/* ---------- Platform pages: Software Architecture (page 97, wp-pages/architecture_build.py) and Online Support
   (page 106, wp-pages/support_build.py). Added 2026-10-23. Every section carries .hrm-page.hrm-plat; rules that set
   p/li colours start with .hrm-page.hrm-plat so they beat style.css's html.hrm-dark .hrm-page p { color: ink }.
   Palette variables only, so dark mode and the named palettes apply without extra rules. ---------- */

.hrm-plat { --hrm-plat-accent: color-mix(in srgb, var(--hrm-link) 52%, #000); }   /* green text that reads on white */
html.hrm-dark .hrm-plat { --hrm-plat-accent: var(--hrm-link); }
.hrm-plat .et_pb_module { margin-bottom: 0; }
.hrm-plat h2 { margin: 0; padding: 0; }
.hrm-plat .hrm-sechead { max-width: 780px; margin-bottom: 28px; }
.hrm-plat .hrm-sechead.hrm-center { margin-left: auto; margin-right: auto; text-align: center; }
.hrm-page.hrm-plat .hrm-sechead p { font-size: 18px; color: var(--hrm-muted); margin: 10px 0 0; padding: 0; }
.hrm-plat .hrm-actions { margin-top: 26px; }
.hrm-plat .hrm-center { text-align: center; }
.hrm-plat .hrm-prose a, .hrm-archcard a, .hrm-plat .hrm-sechead a { color: var(--hrm-primary); font-weight: 600; text-decoration: underline; text-underline-offset: 2px; }
.hrm-plat-plain { background: var(--hrm-bg) !important; padding: 64px 0 !important; }
.hrm-plat-soft { background: var(--hrm-rail) !important; padding: 64px 0 !important; }
html.hrm-dark .hrm-plat-soft { background: var(--hrm-back-2) !important; }

/* single-column hero (no screenshot column) */
.hrm-plathero h1 { max-width: 20ch; }
.hrm-plathero .hrm-lead p { max-width: 62ch; }

/* at-a-glance stat strip (uses the shared hrm-stats / hrm-stat cards) */
.hrm-platglance { background: var(--hrm-rail) !important; padding: 44px 0 !important; }
html.hrm-dark .hrm-platglance { background: var(--hrm-back-2) !important; }
.hrm-platglance .hrm-stat b { font-size: clamp(28px, 2.4vw, 38px); }

/* ===== Software Architecture ===== */
.hrm-archintro .et_pb_row { display: flex; align-items: flex-start; gap: 56px; }
.hrm-page.hrm-plat .hrm-archintro .hrm-prose p { margin: 0 0 14px; padding: 0; }
.hrm-archintro .hrm-prose h2 { margin-bottom: 16px; }
.hrm-archpoints { background: var(--hrm-rail); border: 1px solid var(--hrm-line); border-radius: 14px; padding: 24px 26px; }
html.hrm-dark .hrm-archpoints { background: rgba(255, 255, 255, 0.04); }
.hrm-page.hrm-plat .hrm-archpoints p.hrm-archpoints-head { font-size: 12px; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; color: var(--hrm-muted); margin: 0 0 4px; padding: 0; }
.hrm-page.hrm-plat .hrm-archpoints .hrm-checklist li { font-size: 16px; line-height: 1.55; }

/* the diagram (inline SVG; two drawings: landscape for desktop, portrait for phones) */
.hrm-archfig { margin: 0; background: var(--hrm-bg); border: 1px solid var(--hrm-line); border-radius: 16px; padding: 28px 28px 20px; box-shadow: 0 10px 30px rgba(12, 24, 40, 0.06); }
html.hrm-dark .hrm-archfig { background: var(--hrm-back); box-shadow: none; }
.hrm-arch-svg { display: block; width: 100%; height: auto; overflow: visible; }
.hrm-arch-svg--m { display: none; max-width: 420px; margin: 0 auto; }
.hrm-arch-svg text { font-family: Inter, "Open Sans", Arial, sans-serif; fill: var(--hrm-ink); }
.hrm-arch-svg .t { font-family: Outfit, Inter, "Open Sans", sans-serif; font-weight: 700; font-size: 15.5px; }
.hrm-arch-svg .s { font-size: 13px; fill: var(--hrm-muted); }
.hrm-arch-svg .k { font-size: 11px; font-weight: 700; letter-spacing: 0.1em; fill: var(--hrm-plat-accent); }
.hrm-arch-svg .h { font-size: 11px; font-weight: 700; letter-spacing: 0.12em; fill: var(--hrm-muted); }
.hrm-arch-svg .lbl { font-size: 11px; font-weight: 700; letter-spacing: 0.06em; fill: var(--hrm-primary); }
.hrm-arch-svg .u { font-size: 13.5px; font-weight: 600; }
.hrm-arch-svg .b { stroke-width: 1.5; }
.hrm-arch-svg .b-user { fill: color-mix(in srgb, var(--hrm-link) 13%, var(--hrm-bg)); stroke: color-mix(in srgb, var(--hrm-link) 70%, transparent); }
.hrm-arch-svg .b-app { fill: var(--hrm-panel); stroke: var(--hrm-primary); }
.hrm-arch-svg .b-tier { fill: color-mix(in srgb, var(--hrm-primary) 7%, var(--hrm-bg)); stroke: color-mix(in srgb, var(--hrm-primary) 45%, transparent); }
.hrm-arch-svg .b-core { fill: var(--hrm-panel); stroke: var(--hrm-primary); stroke-width: 2; }
.hrm-arch-svg .b-legacy { fill: var(--hrm-panel); stroke: var(--hrm-muted); stroke-dasharray: 5 4; }
.hrm-arch-svg .b-db { fill: color-mix(in srgb, var(--hrm-primary) 16%, var(--hrm-panel)); stroke: var(--hrm-primary); }
.hrm-arch-svg .b-ext { fill: var(--hrm-rail); stroke: var(--hrm-line); }
html.hrm-dark .hrm-arch-svg .b-ext { fill: rgba(255, 255, 255, 0.05); stroke: rgba(255, 255, 255, 0.16); }
.hrm-arch-svg .b-soon { fill: var(--hrm-rail); stroke: var(--hrm-muted); stroke-dasharray: 5 4; }
html.hrm-dark .hrm-arch-svg .b-soon { fill: rgba(255, 255, 255, 0.03); }
.hrm-arch-svg .b-ai { fill: color-mix(in srgb, var(--hrm-link) 10%, var(--hrm-panel)); stroke: var(--hrm-link); }
.hrm-arch-svg .bound { fill: none; stroke: var(--hrm-muted); stroke-width: 1.5; stroke-dasharray: 9 6; opacity: 0.75; }
.hrm-arch-svg .ln { fill: none; stroke: var(--hrm-muted); stroke-width: 1.6; }
.hrm-arch-svg .ln--dash { stroke-dasharray: 5 4; }
.hrm-arch-svg .ah { fill: var(--hrm-muted); }
.hrm-arch-svg .badge { fill: var(--hrm-primary); }
.hrm-arch-svg .badge-t { font-size: 9.5px; font-weight: 800; letter-spacing: 0.08em; fill: #fff; }
.hrm-arch-svg .badge--new { fill: var(--hrm-link); }
.hrm-arch-svg .badge--new + .badge-t, .hrm-arch-svg .badge-t--dark, html.hrm-dark .hrm-arch-svg .badge-t { fill: #0b1829; }
.hrm-archlegend { list-style: none !important; display: flex; flex-wrap: wrap; justify-content: center; gap: 8px 26px; margin: 18px 0 0 !important; padding: 16px 0 0 !important; border-top: 1px solid var(--hrm-line); }
.hrm-page.hrm-plat .hrm-archlegend li { list-style: none !important; display: flex; align-items: center; gap: 9px; font-size: 13.5px; line-height: 1.4; color: var(--hrm-muted); padding: 0; }
.hrm-archlegend svg { flex: none; }
.hrm-page.hrm-plat .hrm-archcaption { font-size: 14px; color: var(--hrm-muted); text-align: center; margin: 14px 0 0; padding: 0; }

/* component cards */
.hrm-archgrid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
.hrm-archcard { display: flex; flex-direction: column; background: var(--hrm-panel); border: 1px solid var(--hrm-line); border-radius: 14px; padding: 26px 26px 22px; }
.hrm-archcard header { display: flex; align-items: center; gap: 14px; margin-bottom: 14px; }
.hrm-archcard header img { width: 44px; height: 44px; flex: none; object-fit: contain; }
.hrm-page.hrm-plat .hrm-archcard h3 { font-size: 20px; margin: 0; padding: 0; line-height: 1.25; }
.hrm-page.hrm-plat .hrm-archcard header p { font-size: 13px; font-weight: 600; letter-spacing: 0.04em; color: var(--hrm-plat-accent); margin: 2px 0 0; padding: 0; line-height: 1.3; }
.hrm-page.hrm-plat .hrm-archcard p { font-size: 15.5px; line-height: 1.62; color: var(--hrm-ink); margin: 0 0 12px; padding: 0; }
.hrm-archcard > :last-child { margin-bottom: 0 !important; }
.hrm-page.hrm-plat .hrm-archcard p b { font-weight: 600; }
.hrm-archtags { list-style: none !important; display: flex; flex-wrap: wrap; gap: 6px; margin: auto 0 0 !important; padding: 14px 0 0 !important; }
.hrm-page.hrm-plat .hrm-archtags li { list-style: none !important; font-size: 12.5px; font-weight: 600; line-height: 1.3; color: var(--hrm-primary); background: color-mix(in srgb, var(--hrm-primary) 9%, transparent); border: 1px solid color-mix(in srgb, var(--hrm-primary) 25%, transparent); border-radius: 999px; padding: 4px 10px; }
.hrm-archcard .hrm-badge { margin-left: 6px; }

/* security + maintenance */
.hrm-archops { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
.hrm-archops .hrm-archcard { background: var(--hrm-panel); }

@media (max-width: 980px) {
  .hrm-plat-plain, .hrm-plat-soft { padding: 44px 0 !important; }
  .hrm-archintro .et_pb_row { display: block; }
  .hrm-archpoints { margin-top: 18px; }
  .hrm-archgrid, .hrm-archops { grid-template-columns: 1fr; }
}
@media (max-width: 760px) {
  .hrm-arch-svg--d { display: none; }
  .hrm-arch-svg--m { display: block; }
  .hrm-archfig { margin: 0 -6vw; padding: 16px 10px 12px; border-radius: 14px; }
  .hrm-archlegend { justify-content: flex-start; }
}
@media (max-width: 560px) {
  .hrm-platglance { padding: 28px 0 !important; }
  .hrm-platglance .hrm-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  .hrm-platglance .hrm-stat { padding: 16px 14px 14px; }
  .hrm-platglance .hrm-stat b { font-size: 22px; margin-bottom: 6px; white-space: nowrap; }
  .hrm-platglance .hrm-stat span { font-size: 13.5px; line-height: 1.4; }
  .hrm-archcard { padding: 20px 18px 18px; }
}

/* ===== Online Support (page 106, wp-pages/support_build.py) =====
   Standard Divi modules since 2026-10-23 (William: editors must be able to work in the Visual Builder): Text for prose
   and lists, Blurb for every card, Button for every action. The card look lives here, keyed off the module/row/column
   CSS classes. Conventions an editor should know:
   - channel cards (.hrm-supch columns): Blurb + Button per column; the Blurb's FIRST paragraph is the address line;
   - support package / Support Code (.hrm-suphow Blurbs): the FIRST paragraph is the small tag pill beside the title;
   - downloads (.hrm-supdl Blurbs): an h4 per item, a paragraph, then a list of links ("label (size)"). */

/* each section: a heading row, then card rows; close Divi's row padding between them (the heading's bottom margin is the gap) */
.hrm-plat .hrm-supheadrow.et_pb_row { padding-bottom: 0 !important; }
.hrm-plat .hrm-supheadrow .hrm-sechead { margin-bottom: 2.75% !important; }  /* the gap Divi's module margin gave when heading and cards shared a row */
.hrm-plat .hrm-supchrow.et_pb_row, .hrm-plat .hrm-supfactrow.et_pb_row, .hrm-plat .hrm-supdlrow.et_pb_row { padding-top: 0 !important; }
.hrm-plat .hrm-supdlrow.et_pb_row:not(:last-child) { padding-bottom: 16px !important; }

/* card rows are CSS grids; Divi's float widths/margins on the columns are structural, hence !important */
.hrm-supchrow.et_pb_row, .hrm-supfactrow.et_pb_row, .hrm-supdlrow.et_pb_row { display: grid; gap: 16px; }
.hrm-supchrow.et_pb_row { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.hrm-supfactrow.et_pb_row { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.hrm-supdlrow.et_pb_row { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.hrm-supchrow.et_pb_row::after, .hrm-supfactrow.et_pb_row::after, .hrm-supdlrow.et_pb_row::after { content: none; display: none; }
.hrm-supchrow > .et_pb_column, .hrm-supfactrow > .et_pb_column, .hrm-supdlrow > .et_pb_column { width: auto !important; margin: 0 !important; float: none !important; display: flex; flex-direction: column; min-width: 0; }
.hrm-supfactrow > .et_pb_column > .et_pb_blurb, .hrm-supdlrow > .et_pb_column > .et_pb_blurb { flex: 1 1 auto; }
.hrm-plat .hrm-supch-blurb .et_pb_blurb_content, .hrm-plat .hrm-suphow .et_pb_blurb_content,
.hrm-plat .hrm-supfact .et_pb_blurb_content, .hrm-plat .hrm-supdl .et_pb_blurb_content { max-width: none; text-align: left; }
.hrm-plat .hrm-supch-blurb .et-pb-icon, .hrm-plat .hrm-supfact .et-pb-icon, .hrm-plat .hrm-supdl .et-pb-icon { animation: none !important; opacity: 1 !important; line-height: 1; }

/* icon tile (channel cards and the hours cards) */
.hrm-plat .hrm-supch-blurb .et_pb_main_blurb_image .et_pb_image_wrap, .hrm-plat .hrm-supfact .et_pb_main_blurb_image .et_pb_image_wrap { display: flex; margin: 0; width: 46px; height: 46px; border-radius: 12px; background: color-mix(in srgb, var(--hrm-primary) 12%, transparent); align-items: center; justify-content: center; }
html.hrm-dark .hrm-plat .hrm-supch-blurb .et_pb_main_blurb_image .et_pb_image_wrap, html.hrm-dark .hrm-plat .hrm-supfact .et_pb_main_blurb_image .et_pb_image_wrap { background: rgba(255, 255, 255, 0.08); }

/* the four channels: each column is the card (Blurb + Button) */
.hrm-supchrow > .et_pb_column.hrm-supch { background: var(--hrm-panel); border: 1px solid var(--hrm-line); border-radius: 14px; padding: 24px 22px 22px !important; }
.hrm-supchrow > .et_pb_column.hrm-supch--main { border-color: var(--hrm-primary); box-shadow: inset 0 3px 0 var(--hrm-link); }
.hrm-plat .hrm-supch .et_pb_blurb { margin: 0 !important; }
.hrm-plat .hrm-supch-blurb .et_pb_main_blurb_image { margin: 0 0 16px; text-align: left; width: auto !important; }
.hrm-page.hrm-plat .hrm-supch-blurb .et_pb_module_header { font-size: 19px; margin: 0; padding: 0; line-height: 1.25; }
.hrm-page.hrm-plat .hrm-supch-blurb .et_pb_blurb_description p { font-size: 15px; line-height: 1.58; color: var(--hrm-muted); margin: 0 0 18px; padding: 0; }
.hrm-page.hrm-plat .hrm-supch-blurb .et_pb_blurb_description p:first-child { font-family: Outfit, Inter, sans-serif; font-weight: 600; font-size: 15.5px; color: var(--hrm-primary); margin: 4px 0 10px; line-height: 1.35; overflow-wrap: anywhere; }
.hrm-page .hrm-supch .et_pb_button_module_wrapper { display: block; margin: auto 0 0 !important; }
.hrm-page.hrm-plat .hrm-supch .et_pb_button.hrm-btn { padding: 11px 20px !important; font-size: 14.5px !important; }
.hrm-page.hrm-plat .hrm-supch .et_pb_button.hrm-btn--outline { padding: 10px 19px !important; }
.hrm-page.hrm-plat .et_pb_button.hrm-btn--outline { background: transparent !important; color: var(--hrm-primary) !important; border: 1.5px solid var(--hrm-primary) !important; }
.hrm-page.hrm-plat .et_pb_button.hrm-btn--outline:hover { background: var(--hrm-hover) !important; }

/* hero and closing band: Button modules, spaced as the former button rows (the lead's module margin is the gap above the
   hero buttons; in the band the line has no bottom margin and the buttons sit 26px below it) */
.hrm-page.hrm-plat .et_pb_column .et_pb_button_module_wrapper { margin-bottom: 0 !important; }
.hrm-plathero .hrm-h1wrap + .hrm-lead + .et_pb_button_module_wrapper { margin-top: 0; }
.hrm-page.hrm-plat.hrm-ctaband .hrm-sub { margin-bottom: 0 !important; }
.hrm-page.hrm-plat.hrm-ctaband .hrm-sub p { margin-bottom: 0; padding-bottom: 0; }
.hrm-page.hrm-plat.hrm-ctaband .et_pb_button_module_wrapper { margin: 26px 0 0; }
.hrm-page.hrm-plathero .et_pb_button_module_wrapper { margin-right: 0; }  /* buttons a space apart, as before */

/* what to include */
.hrm-supinclude .et_pb_row { display: flex; align-items: flex-start; gap: 48px; }
.hrm-supinclude .hrm-checklist { gap: 10px; }
.hrm-page.hrm-plat .hrm-supinclude .hrm-checklist li { font-size: 16.5px; line-height: 1.5; }
.hrm-page.hrm-plat .hrm-supinclude .hrm-prose p { margin: 0; padding: 0; }
.hrm-supinclude .hrm-prose h2 { margin-bottom: 12px; }
.hrm-plat .hrm-suplist.et_pb_text { margin-bottom: 0 !important; }
.hrm-page.hrm-plat .hrm-suplist ul { padding-bottom: 0 !important; }
.hrm-page.hrm-plat .hrm-supnote.et_pb_text { margin-top: 45px; padding: 16px 18px; border-radius: 12px; border: 1px solid color-mix(in srgb, var(--hrm-primary) 35%, transparent); background: color-mix(in srgb, var(--hrm-primary) 7%, transparent); }
.hrm-page.hrm-plat .hrm-supnote p { font-size: 15px; line-height: 1.6; color: var(--hrm-ink); margin: 0; padding: 0; }

/* support package / Support Code: Blurb cards; title and the first paragraph (the tag) share a line */
.hrm-plat .et_pb_blurb.hrm-suphow { background: var(--hrm-panel); border: 1px solid var(--hrm-line); border-radius: 14px; padding: 22px; margin: 0 0 16px !important; }
.hrm-plat .et_pb_blurb.hrm-suphow:last-child { margin-bottom: 0 !important; }
/* spacing: lines are 6px apart (title / tag when they wrap); the paragraph margins below are the old ones less those 6px */
.hrm-suphow .et_pb_blurb_container { display: flex; flex-direction: row; flex-wrap: wrap; align-items: center; justify-content: flex-start; gap: 6px 10px; padding: 0; }
.hrm-suphow .et_pb_blurb_description { display: contents; }
.hrm-suphow .et_pb_blurb_description > * { flex: 0 0 100%; }
.hrm-page.hrm-plat .hrm-suphow .et_pb_module_header { font-size: 18px; line-height: 1.3; margin: 0; padding: 0; flex: 0 1 auto; }
.hrm-page.hrm-plat .hrm-suphow .et_pb_blurb_description p { font-size: 15px; line-height: 1.6; color: var(--hrm-ink); margin: 0 0 4px; padding: 0; }
.hrm-page.hrm-plat .hrm-suphow .et_pb_blurb_description > p:nth-child(2) { margin-top: 2px; }
.hrm-page.hrm-plat .hrm-suphow .et_pb_blurb_description p:last-child { margin-bottom: 0; }
.hrm-page.hrm-plat .hrm-suphow .et_pb_blurb_description > p:first-child { flex: none; font-family: Inter, sans-serif; font-size: 11px; font-weight: 700; line-height: 1.3; letter-spacing: 0.08em; text-transform: uppercase; white-space: nowrap; color: var(--hrm-plat-accent); border: 1px solid currentColor; border-radius: 999px; padding: 2px 8px; margin: 0; }
.hrm-page.hrm-plat .hrm-suphow .et_pb_blurb_description p:has(> img) { margin-bottom: 8px; }
.hrm-suphow .et_pb_blurb_description img { display: block; width: 100%; max-width: 441px; height: auto; border-radius: 10px; border: 1px solid var(--hrm-line); background: #fff; }
.hrm-suphow strong, .hrm-suphow b { font-weight: 600; }

/* hours / account manager / release notes: Blurbs with the icon on the left */
.hrm-plat .et_pb_blurb.hrm-supfact { background: var(--hrm-panel); border: 1px solid var(--hrm-line); border-radius: 14px; padding: 22px; margin: 0 !important; }
.hrm-plat .hrm-supfact .et_pb_blurb_content { display: flex; flex-direction: row; gap: 16px; align-items: flex-start; justify-content: flex-start; }
.hrm-plat .hrm-supfact .et_pb_main_blurb_image { display: block; width: 46px !important; flex: none; margin: 0; }
.hrm-plat .hrm-supfact .et_pb_blurb_container { display: block; padding: 0; min-width: 0; }
.hrm-page.hrm-plat .hrm-supfact .et_pb_module_header { font-size: 17.5px; margin: 0 0 4px; padding: 0; line-height: 1.3; }
.hrm-page.hrm-plat .hrm-supfact .et_pb_blurb_description p { font-size: 15px; line-height: 1.55; color: var(--hrm-muted); margin: 0; padding: 0; }
.hrm-page.hrm-plat .hrm-supfact p strong { color: var(--hrm-ink); font-weight: 600; }
.hrm-supfact a, .hrm-supdl .et_pb_blurb_description p a, .hrm-supnote a, .hrm-suphow a { color: var(--hrm-primary); font-weight: 600; text-decoration: underline; text-underline-offset: 2px; }

/* downloads: a Blurb per group; icon inline before the title, then h4 / paragraph / link list per item */
.hrm-plat .et_pb_blurb.hrm-supdl { background: var(--hrm-panel); border: 1px solid var(--hrm-line); border-radius: 14px; padding: 22px 24px; margin: 0 !important; }
.hrm-plat .hrm-supdl .et_pb_blurb_content { display: flex; flex-direction: row; flex-wrap: wrap; align-items: center; justify-content: flex-start; column-gap: 10px; }
.hrm-plat .hrm-supdl .et_pb_main_blurb_image { margin: 0; width: auto !important; flex: none; }
.hrm-plat .hrm-supdl .et_pb_main_blurb_image .et_pb_image_wrap { display: block; }
.hrm-plat .hrm-supdl .et-pb-icon { font-size: 20px !important; }
.hrm-plat .hrm-supdl .et_pb_blurb_container { display: contents; }
.hrm-page.hrm-plat .hrm-supdl .et_pb_module_header { font-size: 18px; line-height: 1.3; margin: 0; padding: 0; flex: 1 1 0; min-width: 0; }
.hrm-plat .hrm-supdl .et_pb_blurb_description { flex: 0 0 100%; margin-top: 12px; }
.hrm-page.hrm-plat .hrm-supdl .et_pb_blurb_description h4 { font-family: Outfit, Inter, sans-serif; font-weight: 600; font-size: 15.5px; line-height: 1.535; letter-spacing: normal; color: var(--hrm-ink); margin: 0; padding: 0; }
.hrm-page.hrm-plat .hrm-supdl .et_pb_blurb_description p { font-size: 14.5px; line-height: 1.55; color: var(--hrm-muted); margin: 2px 0 0; padding: 0; }
.hrm-page.hrm-plat .hrm-supdl .et_pb_blurb_description ul { list-style: none !important; display: flex; flex-wrap: wrap; gap: 6px 16px; margin: 6px 0 14px !important; padding: 0 !important; }
.hrm-page.hrm-plat .hrm-supdl .et_pb_blurb_description ul:last-child { margin-bottom: 0 !important; }
.hrm-page.hrm-plat .hrm-supdl .et_pb_blurb_description li { list-style: none !important; margin: 0; padding: 0; font-size: 14.5px; line-height: 1.55; color: var(--hrm-muted); }
.hrm-supdl .et_pb_blurb_description li::before { content: ""; display: inline-block; width: 15px; height: 15px; margin-right: 6px; vertical-align: -2px; background: var(--hrm-primary);
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M7 10l5 5 5-5M12 15V3M4 21h16'/%3E%3C/svg%3E") center / contain no-repeat;
          mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M7 10l5 5 5-5M12 15V3M4 21h16'/%3E%3C/svg%3E") center / contain no-repeat; }
.hrm-supdl .et_pb_blurb_description li a { color: var(--hrm-primary); font-weight: 600; text-decoration: none; }
.hrm-supdl .et_pb_blurb_description li a:hover { text-decoration: underline; }

@media (max-width: 1100px) {
  .hrm-supchrow.et_pb_row { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 980px) {
  /* Divi drops its module margin below 981px; the old layout then had these gaps */
  .hrm-plat .hrm-supheadrow .hrm-sechead { margin-bottom: 28px !important; }
  .hrm-plathero .hrm-h1wrap + .hrm-lead + .et_pb_button_module_wrapper { margin-top: 26px; }
  .hrm-supinclude .et_pb_row { display: block; }
  .hrm-supinclude .et_pb_column > .hrm-suphow:first-child { margin-top: 24px !important; }
  .hrm-supfactrow.et_pb_row, .hrm-supdlrow.et_pb_row { grid-template-columns: 1fr; }
}
@media (max-width: 560px) {
  .hrm-supchrow.et_pb_row { grid-template-columns: 1fr; gap: 12px; }
  .hrm-supchrow > .et_pb_column.hrm-supch { padding: 20px 18px 18px !important; }
  .hrm-plat .et_pb_blurb.hrm-supdl { padding: 20px 18px; }
}

html.hrm-dark .hrm-plat .hrm-badge--soon { color: #0b1829; }