/* Aurifex Healthcare: polish layer.  Loaded after site.css, so it wins ties.
   One responsive grid system, one hero system, one spacing scale.  See docs/brand.md ("Layout system").

   Breakpoints (min-width): 360 / 520 / 600 / 760 / 900 / 1100 / 1240.  Containers are 1200px, gutters 20px (16px under 380).
   Grid rule: a column count must divide the item count.  No auto-fit / auto-fill for fixed-count rows.
     3 items: 1 / 3          4 items: 1 / 2x2 / 4          5 items: 1 / 2+3 / 5       6 items: 1 / 2x3 / 3x2 / 6          */

:root {
  --gut: 20px;
  --space-1: 8px; --space-2: 16px; --space-3: 24px; --space-4: 32px; --space-5: 48px;
  --space-section: clamp(56px, 6vw + 24px, 96px);
}
@media (max-width: 380px) { :root { --gut: 16px; } }

/* ---------- Page frame: safe areas on all four sides ---------- */
.wrap, .nav__inner {
  padding-left: max(var(--gut), env(safe-area-inset-left, 0px));
  padding-right: max(var(--gut), env(safe-area-inset-right, 0px));
}
.footer { padding-bottom: calc(28px + env(safe-area-inset-bottom, 0px)); }

/* ---------- Typography: balanced headings, no one-word last lines ---------- */
h1, h2, h3, h4, .hubcard__body b, .tile__label, .mod b, .flowstrip figcaption b, .post-card b, .post-lead b,
.fact__label, .role b, .principle h3, .tchip, .eyebrow, .nextup__link b, .cta h2, .cta p, .trustline h2,
.glance__item b, .swim__step b, .phase h3, .scorecard b, .section__lede, .hero__caveat { text-wrap: balance; }
p { text-wrap: pretty; }
li, dd, dt, td, th, label, summary, figcaption, b, strong, .lede, .phero__lede, .hubcard__body > span, .tile__def, .tile__label, .post-card > span,
.callout p, .hubcard__kicker, .fact p, .tile__src, .flow__step, .flow__step *, .lead__phi, .lead__next, .section__lede { text-wrap: balance; }
.blk > p, .article__body p, .prose p, .doc__body > .blk > ul > li { text-wrap: pretty; }
.btn, .hero__ctas a, .chip, .tchip, .ftag { text-wrap: balance; }
.hero__caveat a, .nowrap, .tile__num, .tile__num *, .tl__axis span, .tag-ok, .tbl .num, .proofline span { white-space: nowrap; }
.btn { white-space: normal; max-width: 100%; text-align: center; }

/* ---------- Buttons: one height, equal widths when stacked ---------- */
@media (max-width: 539px) {
  .hero__ctas, .teaser-more, .trustline__links, .hero__ctas--center, .blk__cta, .calc__btns {
    display: grid; grid-template-columns: minmax(0, 1fr); gap: 12px; width: 100%;
  }
  .hero__ctas .btn, .teaser-more .btn, .trustline__links .btn, .blk__cta .btn { width: 100%; }
  .hero__ctas--center { max-width: 360px; margin-inline: auto; }
}

/* ---------- Spacing scale: air below blocks, one rhythm ---------- */
.blk > :is(.tbl, .summary5, .bullets, .checks, details.disclose, .split, figure, .tiles, .callout, .fact, .price, .steps, .day, .shot, .cards, .roles, .phases, .tl, .proj, .flow, .glance, .swim, .compare, .chart45, .arch, .controls, .assets, .swatches, .boiler, .pipeline, ul.tiles, ol.day, ol.steps)
  + :is(p, h2, h3, ul, ol, details, div, aside) { margin-top: var(--space-3); }
.blk :is(.split, .tbl, .shot, .price, .day, .steps, .fact, .callout, .summary5, .checks, .bullets, .cards, .roles, .phases, .tl, .proj, .flow) { margin-bottom: 0; }
.blk > :is(.tbl, .split, .shot, .price, .day, .steps, .fact, .callout, .summary5, .cards, .roles, .phases, .flow, details.disclose, figure) { margin-bottom: var(--space-3); }
.blk > :is(.tbl, .split, .shot, .price, .day, .steps, .fact, .callout, .summary5, .cards, .roles, .phases, .flow, details.disclose, figure):last-child { margin-bottom: 0; }
.blk .checks { margin: 16px 0 0; }
.blk .shot { margin: 28px 0 var(--space-3); }
.blk .fact { margin: var(--space-3) 0; max-width: none; }
.blk .callout, .callout { margin: var(--space-3) 0; }
.blk .tbl, .tbl { margin: var(--space-3) 0; }
.blk h2 + .callout, .blk h2 + .tbl, .blk h2 + .shot { margin-top: 0; }
.doc { gap: var(--space-3); }
@media (min-width: 1000px) { .doc { gap: 56px; } }
.toc { margin: 0; }
.blk > p, .blk > ul > li, .blk > ol > li { max-width: none; }
.doc__body { max-width: 760px; }
@media (min-width: 1000px) { .doc__body { max-width: none; } .doc__body > .blk > p { max-width: 70ch; } .doc__body > .blk > :is(.tbl, .shot, .fact, .callout, .split, .cards, .summary5, .tiles, .price, .day, .steps, .flow, figure, details.disclose, .roles, .phases, .tl, .proj) { max-width: 880px; } }
/* Disclosures: content has the same inset as the summary */
.disclose > :not(summary), .blk .disclose > :not(summary) { margin-left: 18px; margin-right: 18px; }
.disclose > .tbl, .blk .disclose > .tbl { border: 0; margin: 0 18px 18px; }
.disclose > .checks, .blk .disclose > .checks { margin: 6px 18px 18px; }
.disclose > .shot, .blk .disclose > .shot { margin: 18px; box-shadow: none; }
.disclose > :last-child { margin-bottom: 18px; }

/* ---------- Header ---------- */
.nav__inner > .brand { min-width: 0; }
.brand img { flex: none; }
@media (max-width: 400px) {
  .brand { font-size: .98rem; gap: 8px; }
  .brand img { width: 32px; height: 32px; }
  .nav__mdemo { padding: 0 12px; font-size: .875rem; }
  .nav__inner { gap: 8px; }
}
@media (max-width: 359px) {
  .brand { font-size: .9rem; gap: 6px; }
  .brand img { width: 28px; height: 28px; }
  .nav__mdemo { display: none; }
}
/* Announcement bar: one line on phones */
@media (max-width: 899px) {
  .announce__tag { display: none; }
  .announce__inner { display: block; text-align: center; padding-top: 8px; padding-bottom: 8px; }
  .announce p, .announce a { display: inline; }
  .announce a { min-height: 0; }
}
/* Mega menus: equal-height columns */
.mega__grid { align-items: stretch; }
.mega__feature { align-self: stretch; height: 100%; }
.mega__grid--3 { grid-template-columns: 1fr 1fr 1fr; }
/* Phones in landscape: short header, no bar over the content */
@media (max-height: 500px) and (orientation: landscape) {
  .nav { position: static; }
  .stickycta { display: none !important; }
  :root { --nav-h: 56px; }
  .hero, .hero--light { padding-top: 24px; padding-bottom: 32px; }
}

/* ---------- Footer: 6 / brand + 5 / 3x2 / accordions ---------- */
.footer__grid { grid-template-columns: minmax(0, 1fr); gap: 0; align-items: start; }
.footer__brand { grid-column: auto; margin-bottom: 20px; }
.footer__brand p { max-width: 32ch; }
@media (min-width: 600px) and (max-width: 899px) {
  .footer__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 32px 28px; }
  .footer__brand { margin: 0; }
  .fcol { border-top: 0; }
  .fcol > summary { display: block; min-height: 0; margin: 0 0 12px; cursor: default; pointer-events: none; }
  .fcol > summary::after { content: none; }
}
@media (min-width: 760px) and (max-width: 899px) { .footer__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (min-width: 900px) and (max-width: 1239px) {
  .footer__grid { grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 32px 20px; }
  .footer__brand { grid-column: 1 / -1; margin: 0; display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 8px 28px; }
  .footer__brand p { margin: 0; max-width: none; }
}
@media (min-width: 1240px) {
  .footer__grid { grid-template-columns: minmax(212px, 1.3fr) repeat(5, minmax(0, 1fr)); gap: 24px; }
  .footer__brand { margin: 0; }
}
@media (min-width: 600px) {
  .fcol > summary { pointer-events: none; cursor: default; }
  .fcol > summary::after { content: none !important; }
  .fcol > a { min-height: 0; padding: 6px 0; line-height: 1.35; align-items: flex-start; }
  .fcol > summary { margin-bottom: 10px; }
}
@media (max-width: 599px) {
  .fcol { border-top: 1px solid rgba(255, 255, 255, .1); }
  .fcol > summary { display: flex; align-items: center; justify-content: space-between; gap: 16px; min-height: 52px; margin: 0; cursor: pointer; pointer-events: auto; }
  .fcol > summary::after { content: "+"; font-size: 1.3rem; line-height: 1; color: var(--sky); flex: none; width: 24px; text-align: center; }
  .fcol[open] > summary::after { content: "\2013"; }
  .fcol > a { min-height: 44px; padding: 0; align-items: center; }
  .fcol:last-of-type { border-bottom: 1px solid rgba(255, 255, 255, .1); }
}
.footer__base {
  align-items: center; border-top: 0; margin-top: 40px; padding-top: 0;
  background: linear-gradient(rgba(255, 255, 255, .08), rgba(255, 255, 255, .08)) no-repeat;
  background-size: calc(100% - 2 * var(--gut)) 1px; background-position: center top;
  padding-top: 24px;
}
.footer__base > span:first-child { display: inline-flex; align-items: center; min-height: 44px; }
.footer__legal { align-items: center; }
.footer__base a { min-height: 44px; }
.footer__tm { text-wrap: pretty; }

/* ---------- Hero system: .phero, .page-hero, .hero share eyebrow-to-H1 gap, scale and edges ---------- */
.phero h1, .page-hero h1 { text-wrap: balance; }
.page-hero { padding: 40px 0 96px; }
.page-hero .crumbs { text-align: left; margin-bottom: 28px; }
.page-hero h1 { margin: 0 auto 18px; max-width: 24ch; }
.eyebrow { margin-bottom: 14px; }
@media (min-width: 1000px) { .phero h1 { font-size: clamp(2.4rem, 1.3rem + 2.2vw, 3.1rem); } }
/* Split heroes: copy and figure share top and bottom edges; stack until the columns are legible */
.phero--split .phero__grid { align-items: stretch; }
.phero__shot { display: flex; flex-direction: column; justify-content: center; }
.phero__shot img { aspect-ratio: 16 / 10; object-fit: cover; object-position: top left; }
.phero__copy { display: flex; flex-direction: column; justify-content: center; min-width: 0; }
.phero h1, .page-hero h1 { overflow-wrap: break-word; }
@media (min-width: 1180px) { .phero--split .phero__grid { grid-template-columns: minmax(0, 1fr) minmax(0, 1.08fr); gap: 56px; } }
@media (min-width: 1000px) and (max-width: 1179px) { .phero--split .phero__grid { grid-template-columns: minmax(0, 1fr); } .phero__shot img { max-height: 520px; } }
@media (max-width: 539px) { .phero .hero__ctas .btn { width: 100%; } }

/* Home hero */
.hero--light .hero__proof { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; gap: 10px; max-width: 600px; }
.hero--light .hero__proof li, .hero--light .hero__proof--lead {
  display: flex !important; flex-direction: column !important; align-items: flex-start; justify-content: flex-start; gap: 4px;
  padding: 14px 14px 12px !important; background: #fff !important; border: 1px solid var(--cream-line) !important; border-radius: 12px; min-width: 0;
}
.hero--light .hero__proof b, .hero--light .hero__proof--lead b {
  font-size: clamp(1.5rem, 1.1rem + 1.2vw, 2.25rem) !important; line-height: 1.05; letter-spacing: -.03em; color: var(--navy); white-space: nowrap; min-width: 0;
}
.hero--light .hero__proof span { margin-top: 0; font-size: .9375rem; line-height: 1.35; text-wrap: balance; }
@media (max-width: 430px) {
  .hero--light .hero__proof { gap: 6px; }
  .hero--light .hero__proof li, .hero--light .hero__proof--lead { padding: 10px 8px 10px !important; }
  .hero--light .hero__proof span { font-size: .8125rem; }
  .hero--light .hero__proof b, .hero--light .hero__proof--lead b { font-size: 1.375rem !important; }
}
.hero--light .hero__caveat { display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 12px; }
.hero--light .hero__caveat a { white-space: nowrap; }
.hero--light .hero__ctas { align-items: stretch; }
.hero__ctas .btn { min-height: 48px; }
.hero--light .wrap > .hero__flow { margin: 20px 0 0; max-width: 760px; }

/* ---------- Strip: 2 / 4 across, never 3+1 ---------- */
.strip__row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px 32px; max-width: 760px; margin-inline: auto; justify-content: stretch; }
.strip__row span { align-items: flex-start; text-wrap: balance; }
.strip__row svg { margin-top: 2px; }
@media (min-width: 1180px) { .strip__row { grid-template-columns: repeat(4, minmax(0, 1fr)); max-width: none; } }

/* ---------- Shared grids ---------- */
/* 3 items */
.cards--3, .tiles--3, .tiles--home, .tiles--out:not(.tiles--4), .glance, .flowstrip { grid-template-columns: minmax(0, 1fr); }
@media (min-width: 760px) { .tiles--3, .tiles--home, .flowstrip { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (min-width: 980px) { .cards--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (min-width: 700px) { .glance { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.tiles--home { max-width: none; }
/* 4 items: 1 / 2x2 / 4 */
.tiles--4, .summary5--4, .principles, .mods, .sheet__grid, .tiles--q, .cards--4 { grid-template-columns: minmax(0, 1fr); }
@media (min-width: 520px) { .tiles--4, .summary5--4, .principles, .mods, .sheet__grid, .tiles--q, .cards--4 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1100px) { .tiles--4, .summary5--4, .principles, .mods, .sheet__grid, .tiles--q, .cards--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
/* The body column is narrow beside the table of contents, so inner-page 4-up rows stay 2x2 until it is wide */
@media (min-width: 1000px) and (max-width: 1279px) { .doc__body .summary5--4, .doc__body .tiles--4 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1280px) { .doc__body .summary5--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
/* 5 items */
.summary5:not(.summary5--4) { grid-template-columns: minmax(0, 1fr); }
@media (min-width: 520px) { .summary5:not(.summary5--4) { grid-template-columns: repeat(6, minmax(0, 1fr)); } .summary5:not(.summary5--4) > * { grid-column: span 2; } .summary5:not(.summary5--4) > :nth-child(n+4) { grid-column: span 3; } }
@media (min-width: 1100px) { .summary5:not(.summary5--4) { grid-template-columns: repeat(5, minmax(0, 1fr)); } .summary5:not(.summary5--4) > *, .summary5:not(.summary5--4) > :nth-child(n+4) { grid-column: auto; } }
.swatches { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.swatches > :first-child { grid-column: 1 / -1; }
@media (min-width: 720px) { .swatches { grid-template-columns: repeat(5, minmax(0, 1fr)); } .swatches > :first-child { grid-column: auto; } }
/* 6 items: 1 / 2x3 / 3x2 / 6 */
.hub { grid-template-columns: minmax(0, 1fr); }
@media (min-width: 640px) { .hub { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1000px) { .hub { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.roles { grid-template-columns: minmax(0, 1fr); }
@media (min-width: 560px) { .roles { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 900px) { .roles { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (min-width: 561px) and (max-width: 1099px) {
  .pipeline__steps { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px 16px; text-align: center; max-width: none; margin: 0; }
  .pipeline__steps li { display: block; padding-bottom: 0; }
  .pipeline__steps li::before { display: none; }
  .pipeline__steps .node { grid-row: auto; }
  .pipeline__steps h3 { margin: 14px 0 6px; }
}
@media (min-width: 561px) and (max-width: 1099px) { .pipeline__line { display: none; } }
.steps, ol.steps { grid-template-columns: minmax(0, 1fr); }
/* Resources hub: 5 items */
.hub:not(.hub--roles):has(> :nth-child(5):last-child) { grid-template-columns: minmax(0, 1fr); }
@media (min-width: 560px) { .hub:not(.hub--roles):has(> :nth-child(5):last-child) { grid-template-columns: repeat(2, minmax(0, 1fr)); } .hub:not(.hub--roles):has(> :nth-child(5):last-child) > :first-child { grid-column: 1 / -1; } }
@media (min-width: 900px) { .hub:not(.hub--roles):has(> :nth-child(5):last-child) { grid-template-columns: repeat(6, minmax(0, 1fr)); } .hub:not(.hub--roles):has(> :nth-child(5):last-child) > * { grid-column: span 2; } .hub:not(.hub--roles):has(> :nth-child(5):last-child) > :nth-child(n+4) { grid-column: span 3; } }
.hub:not(:has(> :nth-child(5):last-child)):has(> :nth-child(6)) > * { grid-column: auto; }
/* Tour notes: 4 items, 1 / 2x2 */
.tour__notes { grid-template-columns: minmax(0, 1fr); }
@media (min-width: 640px) { .tour__notes { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
/* Tour steps: 2x3 / 3x2 / 6 across, no scrolling */
.tour__steps { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; overflow: visible; padding: 4px 0 12px; -webkit-mask-image: none; mask-image: none; }
.tour__steps button { flex: none; width: 100%; justify-content: flex-start; text-align: left; min-width: 0; }
@media (min-width: 561px) { .tour__steps { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (min-width: 1110px) { .tour__steps { grid-template-columns: repeat(6, minmax(0, 1fr)); } }
@media (max-width: 760px) { .tour__steps { padding-right: 0; } }
.tour__ctrl { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 12px; }
.tour__ctrl .btn:first-child { justify-self: start; }
.tour__ctrl .btn:last-child { justify-self: end; }
.tour__count { text-align: center; }
@media (max-width: 479px) {
  .tour__ctrl { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .tour__count { grid-column: 1 / -1; grid-row: 1; }
  .tour__ctrl .btn { width: 100%; justify-self: stretch !important; }
}
.tour__nextstep { display: none; }
/* Glossary A-Z: 5 across or 15 across */
.az { display: grid; grid-template-columns: repeat(8, minmax(0, 1fr)); gap: 6px; }
@media (min-width: 560px) { .az { grid-template-columns: repeat(16, minmax(0, 1fr)); } }
/* Assets: 3 across */
.assets { grid-template-columns: minmax(0, 1fr); }
@media (min-width: 640px) { .assets { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.asset { display: block; }
.asset__body { display: block; padding: 14px 16px; }
/* Pilot: roles 6, scorecard 4 */
.scorecard { grid-template-columns: minmax(0, 1fr); }
/* Next-up card: label + title + arrow, never an orphan row */
.nextup__link { grid-template-columns: minmax(0, 1fr) 48px; }
.nextup__link .nextup__arrow { grid-column: 2; grid-row: 1 / span 2; justify-self: end; }

/* ---------- Tiles: equal size, nowrap numerals, fluid size ---------- */
.tile { display: flex; flex-direction: column; align-items: flex-start; min-width: 0; }
.tiles .tile { height: 100%; }
.tile__num, .tiles--4 .tile__num, .tiles--home .tile__num { white-space: nowrap; font-size: clamp(2rem, 1.2rem + 2vw, 3rem); max-width: 100%; }
.tiles--4 .tile__num { display: flex; flex-wrap: nowrap; align-items: baseline; }
.tile__num small { white-space: nowrap; }
.tile__num--word { white-space: normal; font-size: 1.35rem; }
.tile__label { text-wrap: balance; }
.role { display: flex; flex-direction: column; }
.role em { margin-top: auto; padding-top: 8px; }
.principle h3 { align-items: flex-start; }
.principle h3 svg { margin-top: 1px; }
.mod, .principle, .hubcard, .tile, .post-card { min-width: 0; }
.hubcard .more { display: block; }
.fact .fact__num { color: #fff; }
.fact__fine a { color: var(--sky); text-decoration: underline; }
.fact__sub { display: flex; gap: 4px 10px; align-items: baseline; flex-wrap: wrap; }
.blk .fact { max-width: none; }

/* ---------- Home: problem block, trust line ---------- */
.editorial { align-items: stretch; }
.pathway { margin-top: auto; max-width: none; width: 100%; }
.trustline h2 { text-wrap: balance; }
.notyet { grid-template-columns: minmax(0, 1fr); }
@media (min-width: 760px) { .notyet { grid-template-columns: repeat(3, minmax(0, 1fr)); } }

/* ---------- Results: projection, timeline ---------- */
.proj { grid-template-columns: minmax(0, 1fr); }
@media (min-width: 1100px) { .proj { grid-template-columns: 280px minmax(0, 1fr); } }
.proj__bridge { display: grid; }
.tl__row { min-height: 56px; }
@media (max-width: 760px) { .tl__legend { display: none; } }

/* ---------- Insights ---------- */
.post-lead { grid-template-columns: minmax(0, 1fr); padding: 26px; }
@media (min-width: 900px) { .post-lead { grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr); gap: 40px; padding: 36px 40px; } }
.post-card .more, .post-lead .more, .hubcard .more { display: inline-flex; align-items: center; min-height: 44px; }
.post-card { padding: 26px; }
.author { align-items: center; }
.byline span { text-wrap: balance; }
.cards--3.cards { margin-top: 24px; }
.section__head--left { text-align: left; margin-left: 0; }

/* ---------- Tables: shared widths, stacked cards on phones ---------- */
.tbl table { table-layout: auto; }
.tbl th, .tbl td { text-align: left; }
.tbl td:first-child, .tbl th[scope="row"] { min-width: 9em; }
.tbl td.num, .tbl th.num { white-space: nowrap; }
@media (max-width: 600px) {
  .tbl--stack td:first-child:not([data-label]) { padding-top: 12px; }
  .tbl--stack tr > th[scope="row"] + td[data-label]:last-child::before { display: none; }
  .tbl:has(.tbl--stack) { margin: var(--space-3) 0; }
}
#facts table { min-width: 0; }

/* ---------- Security summary ---------- */
.sheet__grid { gap: 20px; }
.flow { grid-template-columns: minmax(0, 1fr); }
@media (min-width: 760px) { .flow { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; } }
@media (min-width: 1280px) { .flow { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0; } }
.flow__step { max-width: none; }

/* ---------- Breadcrumbs ---------- */
.crumbs li { min-height: 44px; }

/* ---------- Calculator ---------- */
.calc__out { align-self: stretch; display: flex; flex-direction: column; }
.calc__btns { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.calc__btns .btn { width: 100%; }
.calc__cta .btn { display: flex; width: 100%; white-space: normal; }

/* ---------- Forms: demo and contact ---------- */
.page__grid { align-items: stretch; }
@media (min-width: 640px) and (max-width: 959px) { .aside { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); } .aside > :first-child { grid-column: 1 / -1; } }
.modal__head h2 { padding-right: 44px; text-wrap: balance; }
.modal__tabs button, .tabs button { white-space: nowrap; }
.copybtn, .modal__close { min-height: 44px; min-width: 44px; }
.prose > :first-child { margin-top: 0; }
@media (min-width: 520px) { .lead__row { grid-template-columns: 1fr 1fr; } }

/* ---------- Lightbox: safe areas, one-line close ---------- */
.lbx, .lightbox { padding-top: max(16px, env(safe-area-inset-top, 0px)); padding-left: max(16px, env(safe-area-inset-left, 0px)); padding-right: max(16px, env(safe-area-inset-right, 0px)); padding-bottom: max(16px, env(safe-area-inset-bottom, 0px)); }

/* ---------- Sticky CTA: respects the home indicator ---------- */
@media (max-width: 760px) { .stickycta { padding-bottom: env(safe-area-inset-bottom, 0px); min-height: calc(48px + env(safe-area-inset-bottom, 0px)); } }

/* ---------- Large screens ---------- */
@media (min-width: 1700px) { .wrap, .nav__inner { max-width: 1320px; } .phero h1 { font-size: 3.1rem; } }

/* ---------- Print: the one-page security summary (Letter and A4) ---------- */
@page { margin: .5in; }
@media print {
  * { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  body { font-size: 10pt; line-height: 1.4; }
  .wrap { max-width: none; padding-left: 0; padding-right: 0; }
  .phero { padding: 0 0 6pt !important; }
  .phero h1 { font-size: 20pt !important; margin-bottom: 6pt; }
  .phero__lede { font-size: 10pt !important; margin: 0; max-width: none; }
  .eyebrow, .eyebrow--light { color: #1e3a8a !important; margin-bottom: 4pt; }
  .section, .summary-sheet { padding: 8pt 0 !important; }
  h2, .summary-sheet h2, .sheet__grid h2 { font-size: 11.5pt !important; margin: 0 0 4pt; }
  .sheet__grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 8pt 18pt; margin-top: 8pt; }
  .sheet__grid li, .checks li { font-size: 9pt; }
  .checks { gap: 3pt; margin: 0; }
  .sheet__grid, .glance, .tbl, .disclose, figure, .fact, .callout { break-inside: avoid; }
}

/* Smallest phones: hero proof and home tiles never clip */
@media (max-width: 359px) {
  .hero--light .hero__proof { grid-template-columns: minmax(0, 1fr) !important; }
  .hero--light .hero__proof li, .hero--light .hero__proof--lead { flex-direction: row !important; align-items: baseline; gap: 12px; }
  .hero--light .hero__proof b, .hero--light .hero__proof--lead b { flex: none; min-width: 3.5em; }
}
@media (max-width: 400px) {
  .tiles--home .tile { grid-template-columns: 84px minmax(0, 1fr); }
  .tiles--home .tile__num { font-size: 1.5rem; }
}

/* Insights lead card: the right half carries the brand mark, so the card never reads as half empty */
@media (min-width: 900px) {
  .post-lead { overflow: hidden; }
  .post-lead::after { content: ""; justify-self: center; width: min(240px, 100%); aspect-ratio: 1; background: url("../img/logo-mark.png") center / contain no-repeat; opacity: .16; filter: saturate(.8); }
}
.post-lead p { max-width: 56ch; }

/* Split heroes (>=1180): the screen fills the copy column, so both share top and bottom edges */
@media (min-width: 1180px) {
  .phero--split .phero__shot { position: relative; display: block; min-height: 0; }
  .phero--split .phero__shot img { width: 100%; height: 100%; aspect-ratio: auto; object-fit: cover; object-position: top left; position: absolute; inset: 0; }
  .phero--split .phero__shot figcaption { position: absolute; left: 14px; bottom: 14px; margin: 0; padding: 4px 12px; border-radius: 999px; background: rgba(11, 23, 48, .82); color: rgba(219, 231, 255, .9); text-align: left; }
}

/* Article measure, section scale, stacked table text */
.article__body > * { max-width: 68ch; }
.article__body h2 { font-size: clamp(1.5rem, 1.2rem + 1vw, 2rem); }
@media (min-width: 641px) { .cta { padding: var(--space-section) 0; } }
.section__head--left { text-align: left; margin-left: 0; max-width: none; }
.tbl--stack td, .tbl--stack th { overflow-wrap: break-word; }
.nextup { padding-bottom: 56px; }
.author { align-items: flex-start; }
@media (min-width: 480px) { .author { align-items: center; } }

/* Swim tags wrap; tap targets are 44px below the desktop breakpoint */
.fcol > a { min-height: 44px; }
@media (min-width: 1100px) { .fcol > a { min-height: 0; } }
@media (max-width: 1099px) { .btn--sm { min-height: 44px; } .toc summary { min-height: 44px; display: flex; align-items: center; } }
.company__actions, .company__actions--center { display: grid; grid-template-columns: minmax(0, 1fr); gap: 12px; }
.company__actions .btn { width: 100%; }
@media (min-width: 640px) { .company__actions--center { grid-template-columns: repeat(3, minmax(0, 1fr)); } }

/* Tour close-ups: one crop shape on phones */
.tour__crop { object-fit: cover; }

/* ======================================================================
   Polish pass 2
   ====================================================================== */
.nw { white-space: nowrap; }

/* ---------- Lead-form modal: fixed header and tabs, scrolling form ---------- */
.modal { padding: max(12px, env(safe-area-inset-top, 0px)) max(12px, env(safe-area-inset-right, 0px)) max(12px, env(safe-area-inset-bottom, 0px)) max(12px, env(safe-area-inset-left, 0px)); }
.modal__panel { display: flex; flex-direction: column; overflow: hidden; padding: 0; width: min(720px, 100%); max-height: calc(100vh - 24px); max-height: calc(100dvh - 24px); }
.modal__top { flex: none; padding: clamp(16px, 3vw, 26px) clamp(16px, 3.5vw, 32px) 0; background: #fff; position: relative; z-index: 2; }
.modal__body { flex: 1 1 auto; min-height: 0; overflow-y: auto; overscroll-behavior: contain; -webkit-overflow-scrolling: touch; padding: 2px clamp(16px, 3.5vw, 32px) clamp(16px, 3vw, 26px); }
.modal__close { top: 10px; right: 10px; z-index: 3; }
.modal__head { padding-right: 0; margin-bottom: 14px; align-items: center; }
.modal__head h2 { font-size: clamp(1.2rem, 4.6vw, 1.5rem); line-height: 1.2; margin-bottom: 2px; padding-right: 48px; text-wrap: balance; }
.modal__head p { font-size: clamp(.84rem, 3.4vw, .95rem); line-height: 1.4; padding-right: 0; }
.modal__tabs { margin-bottom: 14px; }
.modal__tabs button { white-space: nowrap; padding: 10px 6px; font-size: clamp(.84rem, 3.7vw, .95rem); min-height: 44px; }
@media (max-width: 380px) { .modal__head img { width: 32px; height: 32px; } .modal__head { gap: 10px; } }

/* Shorter laptops: tighter form so the panel fits without an inner scroll */
@media (min-width: 640px) and (max-height: 820px) {
  .modal__top { padding-top: 18px; }
  .modal__head { margin-bottom: 10px; }
  .modal__tabs { margin-bottom: 10px; }
  .modal .lead { gap: 12px; }
  .modal .lead__row { gap: 12px; }
  .modal .field textarea { min-height: 64px; }
  .modal .lead__phi { margin: 0; }
  .modal__body { padding-bottom: 16px; }
}

/* Landscape phones and other short viewports: one-row header, two-column form */
@media (max-height: 520px) and (min-width: 520px) {
  .modal__panel { width: min(900px, 100%); }
  .modal__top { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 10px 56px 8px 20px; }
  .modal__head { margin: 0; flex: 1 1 auto; min-width: 0; }
  .modal__head img, .modal__head p { display: none; }
  .modal__head h2 { font-size: 1.15rem; padding-right: 0; margin: 0; }
  .modal__tabs { margin: 0; flex: 0 0 auto; width: min(340px, 48%); padding: 3px; }
  .modal__tabs button { min-height: 40px; padding: 6px 4px; font-size: .86rem; }
  .modal__body { padding: 2px 20px 14px; }
  .modal .lead { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px 14px; }
  .modal .lead > * { grid-column: 1 / -1; }
  .modal .lead__row { display: contents; }
  .modal .lead__row > .field { grid-column: auto; }
  .modal .field label { font-size: .86rem; }
  .modal .field input, .modal .field select { min-height: 42px; padding-top: 7px; padding-bottom: 7px; }
  .modal .field textarea { min-height: 56px; }
  .modal .lead__phi, .modal .lead__next, .modal .lead__note { font-size: .8rem; margin: 0; }
}

/* ---------- Calculator: the demo link only appears once there is an estimate ---------- */
.calc__cta[hidden] { display: none; }

/* ---------- Tour caption and lightbox bar ---------- */
figcaption.has-zoom { display: flex; align-items: center; justify-content: space-between; flex-wrap: nowrap; gap: 8px 16px; text-wrap: balance; }
figcaption.has-zoom .zoombtn { flex: none; white-space: nowrap; }
@media (max-width: 559px) {
  figcaption.has-zoom { flex-direction: column; align-items: stretch; text-align: left; }
  figcaption.has-zoom .zoombtn { width: 100%; justify-content: center; }
}
.lightbox__bar { min-height: 56px; max-height: 64px; padding-top: 6px; padding-bottom: 6px; padding-left: 0; padding-right: 0; gap: 12px; }
.lightbox__bar > :first-child { flex: 1 1 auto; min-width: 0; font-size: .8125rem; line-height: 1.25; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.lightbox__close { flex: none; white-space: nowrap; min-width: 44px; padding: 0 14px; }
.lightbox__scroll { padding-left: max(0px, env(safe-area-inset-left, 0px)); padding-right: max(0px, env(safe-area-inset-right, 0px)); padding-bottom: max(16px, env(safe-area-inset-bottom, 0px)); }
.calc__btns { grid-template-columns: repeat(auto-fit, minmax(min(100%, 210px), 1fr)); }
.calc__btns .btn { white-space: normal; text-wrap: balance; }

/* Text-only heroes (solutions hub, tour): keep the measure readable so the right side never looks half-empty */
.phero--compact:not(.phero--split) .phero__copy { max-width: 760px; }
.phero--compact:not(.phero--split) .phero__lede { max-width: 62ch; }
/* Architecture video: swap to the phone-shaped cut before the desktop cut's text drops below ~10px */
@media (max-width: 760px) { .arch__d { display: none; } .arch__m { display: block; } }
@media (min-width: 761px) { .arch__m { display: none; } .arch__d { display: block; } }
/* r4 C-level: hero caption shares the mock's left edge when stacked; decorative ring never intercepts clicks */
.phero__shot figcaption { text-align: left; }
.fact::after { pointer-events: none; }
/* r4 C-level: small consistency fixes */
.toc a.is-active { font-weight: inherit; }
.nextup__link { line-height: 1.25; }
td, th[scope="row"] { text-wrap: pretty; }
p, .callout, .boiler { text-wrap: pretty; }
.price { box-shadow: var(--shadow); }

/* Polish pass 2b: about company block measure, tablet media width */
.company > div { max-width: 64ch; }
.company__media { width: 100%; }
@media (min-width: 600px) and (max-width: 959px) { .company { justify-items: start; } .company__media { max-width: 720px; } }

/* ======================================================================
   Round 4: vertical rhythm and text wrapping
   Spacing scale (--space-1..5 = 8 / 16 / 24 / 32 / 48):
     box to its note ................ 16-24px     box to the next block ..... 32px
     box to a link or button row .... 32px        button row to section end . 48px or more
     section padding ................ 56px phones, 72px tablets, 88px desktop
   ====================================================================== */
:root { --sec-pad: 56px; }
@media (min-width: 641px) { :root { --sec-pad: 72px; } }
@media (min-width: 1024px) { :root { --sec-pad: 88px; } }
.section, .home .section { padding-top: var(--sec-pad); padding-bottom: var(--sec-pad); }
.page-hero { padding: 28px 0 48px; }
@media (min-width: 641px) { .page-hero { padding: 32px 0 80px; } }

/* Running text breaks at natural places; short labels stay balanced */
li, dd, .flow__step, .flow__step * { text-wrap: pretty; }
.flow__step b, .glance__item b, .swim__step b, .tile__label, .scorecard b { text-wrap: balance; }

/* Link or button row after a box: 32px above it, and 48px at least before the section ends */
:is(div, ul, ol, table, figure, section, nav, details, aside) + p.center,
:is(div, ul, ol, table, figure, section, nav, details, aside) + .blk__cta { margin-top: var(--space-4); }
.section:has(> .wrap > :is(p.center, .teaser-more, .trustline__links):last-child),
.trustline { padding-bottom: max(var(--space-5), var(--sec-pad)); }
.trustline { padding-top: max(var(--space-5), var(--sec-pad)); }

/* Principles: two across, so no card is a narrow column and the button never touches them */
.principles { grid-template-columns: minmax(0, 1fr); gap: var(--space-2); }
@media (min-width: 640px) { .principles { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-3); } }
.principle { padding: var(--space-3); }

/* Notes and fine print keep clear of the box above */
:is(ul, ol).checks + p.fine, .checks + .fine { margin-top: var(--space-2); }
.split + :is(p, .fine) { margin-top: var(--space-3); }
.sheet__grid + p.fine, .chart45 + .compare__fine, .tl__row + .tl__legend { margin-top: var(--space-3); }
.scorecard + .checks { margin-top: var(--space-3); }
.proj__bridge { margin-bottom: var(--space-2) !important; }
.compare__head { margin-bottom: var(--space-3); }
.fact__sub + .fact__fine { margin-top: 12px; }
.swim + .arch, figure.swim + figure { margin-top: var(--space-4); }
.swim__steps + figcaption { margin-top: 14px; }
.az { margin-bottom: var(--space-3); }
.hero--light .hero__ctas { margin-bottom: var(--space-2); }
.hero--light .hero__ctas + .hero__proof { margin-top: var(--space-3); }
.hero__proof + .hero__caveat, .hero--light .hero__caveat { margin-top: var(--space-2); }

/* Cards: the same inner space on all four sides */
.controls { padding: 18px 20px; }
.controls .checks:last-child { margin-bottom: 0; }

/* Calculator: example-values note reads as one calm, balanced line */
.calc__warn { text-wrap: balance; margin: 8px 0 16px; padding: 12px 16px; line-height: 1.5; }
.calc__out h3 { margin-bottom: 0; }

/* ============================================================================
   SWIM v2: "who acts" pipeline.  Drop-in replacement for every .swim* rule.
   Markup: ol.swim__steps > li.swim__step (DOM order = reading order = 1..5).
   No JS, no measurement: connectors are pseudo-elements that live INSIDE the gap
   between cards, so they follow the cards through wrapping, zoom and print.
   Layouts are chosen by the figure's own width (container query), not the viewport:
     < 600px   stacked cards, down arrows        (phones, 400% zoom)
     600-959   stacked wide rows, actor on the left, down arrows (tablet, 200% zoom)
     >= 960    one 5-column left-to-right pipeline, right arrows (desktop, print)
   ========================================================================== */
.swim {
  --sw-gap: 28px;            /* length of every connector (it fills the gap) */
  --sw-head: 9px;            /* arrowhead length */
  --sw-line: var(--blue, #2a4fc8);
  --sw-r: var(--radius, 14px);
  display: block; margin: 32px auto 8px; max-width: 1160px;
  container: swim / inline-size;
}

.swim .swim__steps {
  list-style: none; margin: 0; padding: 0; counter-reset: sw;
  display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--sw-gap);
}
.swim .swim__step {
  --b-bg: #e8efff; --b-ink: #1e3a8a; --b-num: var(--blue, #2a4fc8); --b-line: #c7d7fe;
  counter-increment: sw; position: relative; min-width: 0; margin: 0; padding: 0;
  grid-column: auto; grid-row: auto;                  /* beat legacy --col / --lane placement */
  display: flex; flex-direction: column;
  background: #fff; border: 1px solid var(--line, #e2e8f0); border-radius: var(--sw-r);
  box-shadow: 0 1px 2px rgba(15, 23, 42, .06);
  font-size: .92rem; overflow-wrap: anywhere;
}
.swim .swim__step::before { content: none; }          /* legacy floating number: retired */
.swim .swim__step--epic { --b-bg: #eef2f7; --b-ink: #334155; --b-num: #334155; --b-line: #d5dde8; }
.swim .swim__step--you  { --b-bg: #d1fae5; --b-ink: #065f46; --b-num: #065f46; --b-line: #a7f3d0; background: #f0fdf8; border-color: #a7f3d0; }

/* actor band (who acts) with the step number inside it */
.swim .swim__from {
  display: flex; align-items: center; gap: 10px; min-height: 48px; padding: 10px 16px;
  background: var(--b-bg); color: var(--b-ink); border-bottom: 1px solid var(--b-line);
  border-radius: calc(var(--sw-r) - 1px) calc(var(--sw-r) - 1px) 0 0;
  font-size: var(--fs-min, .8125rem); font-weight: 700; letter-spacing: .04em; text-transform: uppercase; line-height: 1.25;
}
.swim .swim__from::before {
  content: counter(sw) / ""; flex: none; display: grid; place-items: center;
  width: 26px; height: 26px; border-radius: 50%; background: var(--b-num); color: #fff;
  font-size: .8125rem; font-weight: 800; letter-spacing: 0; line-height: 1;
}
.swim .swim__step b { display: block; padding: 14px 16px 0; font-size: 1rem; line-height: 1.3; color: var(--ink, #0f172a); }
.swim .swim__step > span:not(.swim__from) { display: block; flex: 1; padding: 6px 16px 16px; font-size: .92rem; line-height: 1.45; color: var(--muted, #475569); }

/* hand-off type: a full-width footer bar, so it can never wrap into a blob */
.swim .swim__tag {
  display: block; align-self: stretch; margin: 0; padding: 10px 16px; border: 0; border-top: 1px solid var(--b-line);
  border-radius: 0 0 calc(var(--sw-r) - 1px) calc(var(--sw-r) - 1px);
  background: #f1f5f9; color: #334155; border-top-color: #cbd5e1;
  font-style: normal; font-size: var(--fs-min, .8125rem); font-weight: 700; line-height: 1.3; white-space: normal; text-wrap: balance;
}
.swim .swim__tag--read  { background: #e8efff; color: #1e3a8a; border-top-color: #c7d7fe; }
.swim .swim__tag--you   { background: #d1fae5; color: #065f46; border-top-color: #a7f3d0; }
.swim .swim__tag--write { background: var(--deep, #0f2147); color: #fff; border-top-color: var(--deep, #0f2147); }

.swim figcaption { margin-top: 14px; text-align: center; color: var(--muted, #475569); font-size: var(--fs-cap, .875rem); }

/* connector: ONE pseudo-element per gap, shaped by clip-path (line + head), colored by one token */
.swim .swim__steps > .swim__step:not(:last-child)::after {
  content: ""; display: block !important; position: absolute; z-index: 1; pointer-events: none;
  background: var(--sw-line); transform: none; color: transparent;
  left: 24px; top: 100%; width: 12px; height: calc(var(--sw-gap) + 2px);              /* down arrow: centred under the number */
  clip-path: polygon(5px 0, 7px 0, 7px calc(100% - var(--sw-head)), 12px calc(100% - var(--sw-head)), 6px 100%, 0 calc(100% - var(--sw-head)), 5px calc(100% - var(--sw-head)));
}

/* ---- 600-959: wide stacked rows, actor in a left column ---- */
@container swim (min-width: 600px) {
  .swim .swim__steps { grid-auto-rows: 1fr; }                     /* equal-height rows */
  .swim .swim__step {
    display: grid; grid-template-columns: minmax(190px, 240px) minmax(0, 1fr);
    grid-template-rows: auto 1fr auto; grid-template-areas: "from title" "from desc" "from tag";
  }
  .swim .swim__from { grid-area: from; align-items: flex-start; padding: 16px; border-bottom: 0; border-right: 1px solid var(--b-line); border-radius: calc(var(--sw-r) - 1px) 0 0 calc(var(--sw-r) - 1px); }
  .swim .swim__step b { grid-area: title; padding: 16px 20px 0; }
  .swim .swim__step > span:not(.swim__from) { grid-area: desc; padding: 6px 20px 16px; }
  .swim .swim__tag { grid-area: tag; padding: 10px 20px; border-radius: 0 0 calc(var(--sw-r) - 1px) 0; }
}

/* ---- >= 960: one left-to-right pipeline ---- */
@container swim (min-width: 960px) {
  .swim { --sw-gap: 26px; }
  .swim .swim__steps { grid-template-columns: repeat(5, minmax(0, 1fr)); grid-auto-rows: auto; }
  .swim .swim__step { display: flex; flex-direction: column; }
  .swim .swim__from { padding: 10px 14px; border-right: 0; border-bottom: 1px solid var(--b-line); border-radius: calc(var(--sw-r) - 1px) calc(var(--sw-r) - 1px) 0 0; align-items: center; }
  .swim .swim__step b { padding: 14px 14px 0; }
  .swim .swim__step > span:not(.swim__from) { padding: 6px 14px 14px; }
  .swim .swim__tag { padding: 10px 14px; border-radius: 0 0 calc(var(--sw-r) - 1px) calc(var(--sw-r) - 1px); }
  .swim .swim__steps > .swim__step:not(:last-child)::after {
    left: 100%; top: 18px; width: calc(var(--sw-gap) + 2px); height: 12px;            /* right arrow, attached to the actor band */
    clip-path: polygon(0 5px, calc(100% - var(--sw-head)) 5px, calc(100% - var(--sw-head)) 0, 100% 6px, calc(100% - var(--sw-head)) 12px, calc(100% - var(--sw-head)) 7px, 0 7px);
  }
}
/* rows line up across cards (actor / title / text / hand-off) where subgrid exists */
@supports (grid-template-rows: subgrid) {
  @container swim (min-width: 960px) {
    .swim .swim__steps { grid-template-rows: auto auto 1fr auto; row-gap: 0; }
    .swim .swim__step { display: grid; grid-row: span 4; grid-template-rows: subgrid; grid-template-columns: minmax(0, 1fr); grid-template-areas: none; }
    .swim .swim__from, .swim .swim__step b, .swim .swim__step > span:not(.swim__from), .swim .swim__tag { grid-area: auto; }
  }
}

/* ---- print: always the pipeline, one row, on the one-page security summary ---- */
@media print {
  .swim { --sw-gap: 14px; --sw-head: 6px; margin: 6pt 0 0; max-width: none; }
  .swim .swim__steps { grid-template-columns: repeat(5, minmax(0, 1fr)) !important; grid-template-rows: none !important; grid-auto-flow: row; }
  .swim .swim__step { display: flex !important; grid-row: auto !important; flex-direction: column; box-shadow: none; break-inside: avoid; font-size: 8pt; }
  .swim .swim__from { padding: 5pt 6pt; min-height: 0; border-right: 0 !important; border-bottom: 1px solid var(--b-line) !important; border-radius: 6px 6px 0 0 !important; font-size: 7pt !important; gap: 5pt; align-items: center; }
  .swim .swim__from::before { width: 14pt; height: 14pt; font-size: 8pt; }
  .swim .swim__step b { padding: 5pt 6pt 0 !important; font-size: 8.5pt; }
  .swim .swim__step > span:not(.swim__from) { padding: 2pt 6pt 6pt !important; font-size: 8pt !important; line-height: 1.35; }
  .swim .swim__tag { padding: 4pt 6pt !important; font-size: 7.5pt !important; border-radius: 0 0 6px 6px !important; }
  .swim .swim__steps > .swim__step:not(:last-child)::after {
    display: block !important; left: 100% !important; top: 8pt !important; width: calc(var(--sw-gap) + 2px) !important; height: 10px !important;
    clip-path: polygon(0 4px, calc(100% - var(--sw-head)) 4px, calc(100% - var(--sw-head)) 0, 100% 5px, calc(100% - var(--sw-head)) 10px, calc(100% - var(--sw-head)) 6px, 0 6px) !important;
  }
  .swim figcaption { font-size: 8pt; margin-top: 4pt; }
}

/* ---- forced colors (Windows High Contrast): keep structure with borders and system colors ---- */
@media (forced-colors: active) {
  .swim .swim__step, .swim .swim__tag { border: 1px solid CanvasText; }
  .swim .swim__from { border-bottom: 1px solid CanvasText; }
  .swim .swim__from::before { border: 1px solid CanvasText; background: Canvas; color: CanvasText; forced-color-adjust: none; }
  .swim .swim__steps > .swim__step:not(:last-child)::after { forced-color-adjust: none; background: CanvasText; }
  .swim .swim__tag--write { font-weight: 800; text-decoration: underline; }
}
/* motion: none by design. If a reveal is wanted, gate it: */
@media (prefers-reduced-motion: no-preference) { .swim .swim__step { transition: box-shadow .2s; } }

/* approval gate: the connector leaving "Your team" is green, and its hand-off carries a check */
.swim .swim__step--you:not(:last-child)::after { background: #047857; }
.swim .swim__tag--you::before { content: "\2713"; margin-right: 6px; font-weight: 800; }

/* Round 4: notes and link rows sit 20px or more below the box above them */
:is(ul, ol).checks + p.fine, .checks + .fine, .proj__bridge { margin-top: 20px; }
.proj__bridge { margin-top: 0 !important; margin-bottom: 20px !important; }
.hero--light .hero__ctas { margin-bottom: 20px; }
.hero__proof + .hero__caveat, .hero--light .hero__caveat { margin-top: 20px; }
.tour__stage + .tour__notes, .tour__notes { margin-top: 24px; }
.tour__cropbox { margin-bottom: 14px; }
.proofline + form, p.proofline { margin-bottom: 20px; }

/* ======================================================================
   Round 5: even line endings, caption rows, compounds that stay whole
   ====================================================================== */
.nb { white-space: nowrap; }

/* Running text: no short last lines.  Short blocks (lists, callouts, captions, notes) are balanced
   so every line ends at about the same place;  long paragraphs use "pretty" */
main p, main li, main dd, .footer p, .legal p { text-wrap: pretty; }

.callout p, .fine, .tiles__note, .compare__fine, .calc__note,
.hero__caveat, .hero__tertiary, .blk__cta, .teaser-more, .fact__fine, .tile__def, .tile__src, .card p, .principle p,
.hubcard span, .mod span, .role span, figcaption, figcaption .cap, .proofline, .trustline p, .legal-note, .fcol p,
.qa dd, .faq__a p { text-wrap: balance; }


/* One measure for sibling blocks inside a content section */
.blk > p, .blk > ul > li, .blk > ol > li, .blk .checks li, .blk .callout p, .blk .fine { max-width: 68ch; }
.blk .checks { max-width: calc(68ch + 30px); }

/* Bold lead-in plus sentence reads as one hanging block, not two ragged pieces */

/* Image caption row: caption on the left, one "View full size" button on the right;  stacked on phones */
figcaption.has-zoom { display: flex; align-items: center; justify-content: space-between; flex-wrap: nowrap; gap: 10px 20px; text-align: left; }
figcaption.has-zoom .cap { flex: 1 1 0; min-width: 0; text-align: left; text-wrap: balance; }
figcaption.has-zoom .zoombtn { flex: none; margin-left: auto; white-space: nowrap; }
.shot figcaption.has-zoom, .showcase figcaption.has-zoom { margin-top: 12px; padding: 0; }
.shot figcaption:not(.has-zoom), .showcase figcaption:not(.has-zoom) { text-align: left; }
@media (max-width: 639px) {
  figcaption.has-zoom { flex-direction: column; align-items: stretch; flex-wrap: wrap; }
  figcaption.has-zoom .zoombtn { width: 100%; justify-content: center; margin-left: 0; }
}

/* Button rows after text: one gap above, buttons the same width, no ragged wrap */
.blk__cta { align-items: stretch; margin-top: var(--space-4); }
.blk__cta .btn { justify-content: center; }
.blk p + .blk__cta, .blk ul + .blk__cta, .blk .callout + .blk__cta { margin-top: var(--space-4); }

/* Lists balance only where there is room;  on phones every line runs the full width */
.footer__tm, .footer__legal p, .footer__legal span { text-wrap: balance; max-width: 62ch; }

/* Round 5 sweep fixes */
.hero__caveat a, .hero--light .hero__caveat a { display: inline-flex; align-items: center; min-height: 44px; }
@container swim (min-width: 960px) and (max-width: 1120px) {
  .swim .swim__step b { font-size: .9375rem; padding-left: 12px; padding-right: 12px; }
  .swim .swim__from, .swim .swim__tag { padding-left: 12px; padding-right: 12px; }
  .swim .swim__step > span:not(.swim__from) { padding-left: 12px; padding-right: 12px; }
}

/* ======================================================================
   Round 6: clean hero mock, role cards, tables, lists, compounds
   ====================================================================== */

/* Breadcrumbs: on phones the current page wraps to its own row (the li carries the basis, not the span) */
@media (max-width: 480px) {
  .crumbs li:last-child { flex-basis: 100%; margin-top: -6px; }
  .crumbs li:last-child::before { display: none; }
  .crumbs [aria-current] { min-height: 0; }
}

/* Home role cards: one column, then three over two (6-col grid) once it fits.  No hole at any width */
.hub--roles { grid-template-columns: minmax(0, 1fr); gap: var(--space-2, 16px); }
@media (min-width: 900px) {
  .hub--roles { grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 20px; }
  .hub--roles > * { grid-column: span 2; }
  .hub--roles > :nth-child(n+4) { grid-column: span 3; }
}
.hub--roles .hubcard { height: 100%; }
.hub--roles .hubcard__body { padding: 22px; gap: 8px; }
.hub--roles .hubcard__body b { font-size: 1.15rem; line-height: 1.3; text-wrap: balance; }

/* Tables: whole words only, headers on one line, the "where it comes from" column gets room */
.tbl thead th { white-space: nowrap; }
@media (min-width: 600px) { .tbl--stack td:nth-child(3) { min-width: 11rem; } }
.tiles--4 .tile__num { font-size: clamp(1.75rem, 1rem + 1.4vw, 2.5rem); flex-wrap: wrap; }

/* Lists: a sentence lead-in sits on its own line;  the body wraps at one measure */
.checks li > b.lead, .bullets li > b.lead, .notyet li > b.lead { display: block; margin: 0 0 .1em; }
.checks li, .bullets li, .notyet li, .summary5 li { text-wrap: pretty; }

/* Fine print and footnotes balance (these out-rank the .blk > p rule) */
.blk > p.fine, .blk > p.blk__cta, .blk > p.tiles__note, .blk .fine, .blk .callout p { text-wrap: balance; }
@media (min-width: 640px) { main p:not(.lead):not(.phero__lede):not(.section__lede), main dd { text-wrap: balance; } .article__body p, .prose p { text-wrap: pretty; } }

/* One gap above every button row */
.blk__cta, .teaser-more, .hero__ctas { margin-top: var(--space-4, 32px); }
.notyet + .teaser-more, .home .teaser-more { margin-top: var(--space-4, 32px); }
.calc__btns { gap: 12px; }

/* Round 6, from the device sweep: balance wins on lists, notes, callouts and long text alike (these out-rank the .blk > p rule) */
.blk > p.fine, .blk > p.callout, .blk .callout p, .blk .fine,
.blk .checks li, .doc__body > .blk > ul > li, .doc__body > .blk > ol > li,
.blk > p, .article__body p, .prose p, .panel.prose p, .gloss__term p, .boiler p,
blockquote p, .phase p, .reveal > p, .checks li, .bullets li, .notyet li { text-wrap: balance; }
.hubcard__body b { text-wrap: balance; }
.lead, .phero__lede, .section__lede { text-wrap: pretty; }
@media (min-width: 1180px) { .phero h1 { max-width: 22ch; } }

/* Tables at 600-1100: the last column keeps room */
@media (min-width: 600px) and (max-width: 1100px) { .tbl--stack td:last-child, .tbl--stack th:last-child { min-width: 11.5rem; } }

/* Sticky demo button: not focusable while it is off screen */
.stickycta:not(.is-on) { visibility: hidden; }

/* Security summary on screen: two columns, like the print layout */
@media (min-width: 900px) { .sheet__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

/* Standalone methodology links are 44px tall on touch screens */
.fact__fine a, p.fine > a:only-child, main p > a:only-child { display: inline-flex; align-items: center; min-height: 44px; }
.crumbs li:first-child a { min-width: 44px; justify-content: center; }

/* Hero eyebrow and the IT link: one flex child for the label, so the word gaps stay normal */
.eyebrow, .hero__tertiary a { column-gap: 8px; }

/* Print: tick icons sit on the first line */
@media print {
  .checks li { padding-left: 16pt; }
  .checks li::before { width: 10pt; height: 10pt; top: 1.5pt; }
  .phero__lede { max-width: none; text-wrap: pretty; }
}

/* Tour pins: a 44px touch area around each numbered pin */
.pin::after { content: ""; position: absolute; inset: -9px; border-radius: 50%; }

/* Compounds and no-break phrases stay whole even inside elements that set text-wrap (it resets white-space's wrap mode) */
.nb, .nw, .nowrap { white-space: nowrap; text-wrap: nowrap !important; }

/* ======================================================================
   Round 7: home hero shares edges, clean worklist mock, roles always visible, trust band
   ====================================================================== */

/* Role cards and the four modules: always visible (open in the markup);  the toggle bar is only for phones */
@media (min-width: 700px) { .mdisc > summary { display: none; } }
.hub--roles { grid-template-columns: minmax(0, 1fr); }
@media (min-width: 700px) {
  .hub--roles { grid-template-columns: repeat(6, minmax(0, 1fr)); }
  .hub--roles > * { grid-column: span 3; }
  .hub--roles > :last-child { grid-column: span 6; }
  .hub--roles .hubcard__body b { min-height: 2.6em; }
}
@media (min-width: 1180px) {
  .hub--roles > * { grid-column: span 2; }
  .hub--roles > :nth-child(n+4) { grid-column: span 3; }
}
.hub--roles .hubcard .more { white-space: nowrap; margin-top: auto; }

/* Trust band: white, even padding, heading sized like the other section heads */
.trustline { background: #fff; padding-top: 0; padding-bottom: 0; }
.trustline__inner { padding-top: 56px; padding-bottom: 56px; }
.trustline h2 { font-size: clamp(1.375rem, 1rem + 1vw, 1.75rem); }

/* Claims strip: every item takes the same height, one-line items centre against two-line ones */
.strip__row { align-items: center; }
.strip__row span { align-items: center; min-height: 2.9em; }
@media (max-width: 639px) { .strip__row { grid-auto-rows: 1fr; } }
@media (min-width: 700px) { .hub--roles .hubcard__body b { max-width: 38ch; min-height: 0; } }
.hub--roles .hubcard .more { display: block; white-space: normal; min-height: 44px; line-height: 1.4; }
.hub--roles .hubcard .more span { display: inline; }

/* ======================================================================
   Round 8: home hero animation, "three beats, one outcome" (panel-scored v5).
   Namespaced .hx-*;  the story is a pure function of time (site.js), so Pause freezes everything.
   Layout: head, story, CTAs, lede on phones;  two columns from 1000px with the story top-aligned to the H1 block.
   ====================================================================== */
.hero.hx-hero { padding: 18px 0 40px; }
@media (min-width: 640px) { .hero.hx-hero { padding: 48px 0 56px; } }
@media (min-width: 1000px) { .hero.hx-hero { padding: 56px 0 64px; } }
.hx-hero .hx-grid { display: grid; grid-template-columns: minmax(0, 1fr); grid-template-areas: "head" "story" "acts" "lede" "foot"; gap: 16px; }
.hx-head { grid-area: head; min-width: 0; }
.hx-hero .hx-lede { grid-area: lede; min-width: 0; margin: 0; text-wrap: pretty; }
.hx-acts { grid-area: acts; min-width: 0; }
.hx-hero .eyebrow { margin: 0 0 10px; }
.hx-hero h1 { margin: 0; font-size: clamp(2rem, 1.3rem + 3.2vw, 3.5rem); }
.hx-hero .hero__ctas { margin: 0 0 4px; }
.hx-hero .hero__tertiary { margin: 0; }
.hx-hero .hero__tertiary a, .hx-hero .hero__caveat a { color: var(--blue); font-weight: 600; }
.hx-hero .hero__foot { grid-area: foot; display: grid; gap: 12px; }
.hx-hero .hero__proof { max-width: none; margin: 0; }
.hx-hero .hero__proof li { height: 100%; transition: border-color .3s var(--ease), box-shadow .3s var(--ease); }
.hx-hero .hero__proof li.is-linked { border-color: #9db8fb !important; box-shadow: 0 0 0 3px rgba(59, 111, 240, .14); }
.hx-hero .hero__caveat { margin: 0; }
.hx-hero .btn--primary.is-ring { animation: hx-ring 1.1s var(--ease) 1; }
@keyframes hx-ring { 0% { box-shadow: 0 6px 18px rgba(42, 79, 200, .35), 0 0 0 0 rgba(59, 111, 240, .45); } 100% { box-shadow: 0 6px 18px rgba(42, 79, 200, .35), 0 0 0 12px rgba(59, 111, 240, 0); } }
@media (min-width: 640px) { .hx-hero .hx-grid { gap: 24px; } }
@media (min-width: 1000px) {
  .hx-hero .hx-grid { grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr); grid-template-rows: auto auto 1fr auto; grid-template-areas: "head story" "lede story" "acts story" "foot foot"; gap: 20px 48px; align-items: start; }
  .hx-acts { padding-top: 16px; }
  .hx-hero .hero__ctas { margin-bottom: 6px; }
  .hx-hero .hero__foot { display: flex; align-items: center; gap: 24px; margin-top: 16px; }
  .hx-hero .hero__proof { flex: 1; }
  .hx-hero .hero__caveat { flex: none; }
}
@media (min-width: 1000px) and (max-width: 1179px) { .hx-hero .hero__ctas .btn { padding-inline: 18px; } }

/* The story */
.hx { --out: cubic-bezier(.2, .7, .2, 1); --ok: #065f46; --ok-bg: #e7f8ef; }
#hx, #hx * { text-wrap-style: auto; }
.js .hx:not(.is-live) .hx-stage { visibility: hidden; }   /* the markup holds the final state for no-JS;  with JS the story renders from time 0 */
.hx-ctl[hidden] { display: none; }
.hx { grid-area: story; margin: 0; min-width: 0; display: flex; flex-direction: column; gap: 10px; }
.hx-win { container-type: inline-size; flex: 1 1 auto; display: flex; flex-direction: column; border-radius: 18px; background: #fff; border: 1px solid var(--cream-line); box-shadow: 0 1px 2px rgba(15, 23, 42, .06), 0 20px 48px rgba(15, 23, 42, .14); overflow: hidden; }
.hx-win__bar { flex: none; display: flex; align-items: center; gap: 8px; padding: 9px 14px; background: #f1f5fb; border-bottom: 1px solid var(--line); font-size: .8125rem; color: #334155; }
.hx-win__bar em { font-style: normal; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0; }
.hx-win__bar em b { color: var(--navy); }
.hx-win__badge { margin-left: auto; flex: none; font-style: normal; font-size: .8125rem; font-weight: 700; color: #1e3a8a; background: #e8efff; padding: 1px 9px; border-radius: 999px; }
.hx-s { display: none; }
.hx-stage { position: relative; flex: 1 1 auto; padding: 12px; font-size: 14px; line-height: 1.4; background: #fff; }

.hx-swap { display: inline-grid; justify-items: start; align-items: center; }
.hx-swap > * { grid-area: 1 / 1; opacity: 0; transition: opacity .2s var(--out); }
.hx-swap > .is-on { opacity: 1; transition: opacity .25s var(--out) .2s; }

/* Spotlight after the hand-off to the draft: the other rows step back a little */
.hx-wl__r, .hx-wl__why { transition: opacity .35s var(--out), transform .35s var(--out); }
.hx[data-focus="doc"] .hx-wl__r:not(.is-hit) { opacity: .55; }

/* Worklist */
.hx-wl { border: 1px solid var(--line); border-radius: 8px; overflow: hidden; }
.hx-wl__h, .hx-wl__r { display: grid; grid-template-columns: minmax(0, 1.45fr) minmax(0, .85fr) minmax(0, 1.05fr) minmax(0, 1.1fr); gap: 8px; align-items: center; padding: 0 12px; }
.hx-wl__h { min-height: 32px; background: #f8fafc; color: #334155; font-weight: 650; }
.hx-wl__h .hx-ai { color: #1e40af; }
.hx-wl__r { min-height: 34px; border-top: 1px solid var(--line); position: relative; }
.hx-wl__n { font-weight: 650; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.hx-wl__d { font-variant-numeric: tabular-nums; color: #1e293b; white-space: nowrap; }
.hx-edd { color: #1e40af; font-weight: 650; }
.hx-edd small { font-size: 12.5px; font-weight: 650; color: #1e40af; background: #e8efff; border-radius: 4px; padding: 0 4px; margin-left: 4px; }
.hx-dash { color: #94a3b8; }
.hx-tag { display: inline-flex; align-items: center; padding: 2px 9px; border-radius: 999px; font-weight: 650; white-space: nowrap; }
.hx-tag--muted { background: #eef2f7; color: #334155; }
.hx-tag--sent { background: var(--ok-bg); color: var(--ok); }
.hx-tag--review { background: #e8efff; color: #1e3a8a; }
.hx-tag--irf { background: var(--amber); color: var(--amber-ink); }
.hx-tag--none { color: #5b6779; padding-left: 2px; font-weight: 500; }
.hx-wl__r.is-hit::before, .hx-wl__r.is-hit::after, .hx-wl__why::before, .hx-wl__why::after { content: ""; position: absolute; inset: 0; opacity: 0; transition: opacity .3s var(--out); z-index: 0; }
.hx-wl__r.is-hit::before, .hx-wl__why::before { background: #fff8ec; box-shadow: inset 3px 0 0 var(--amber); }
.hx-wl__r.is-hit::after, .hx-wl__why::after { background: #f2fbf6; box-shadow: inset 3px 0 0 #34a77a; }
.hx-wl__r > *, .hx-wl__why > * { position: relative; z-index: 1; }
.hx.is-flag:not(.is-sent) .hx-wl__r.is-hit::before, .hx.is-why:not(.is-sent) .hx-wl__why::before { opacity: 1; }
.hx.is-sent .hx-wl__r.is-hit::after, .hx.is-sent .hx-wl__why::after { opacity: 1; }
.hx-wl__why { position: relative; padding: 0 12px 7px; margin-top: -1px; color: #334155; opacity: 0; transform: translateY(-3px); }
.hx-wl__why b { color: var(--navy); }
.hx.is-why .hx-wl__why { opacity: 1; transform: none; }

/* Referral document */
.hx-doc { position: relative; margin-top: 10px; border: 1px solid #c7d7fe; border-radius: 10px; background: #fbfcff; padding: 11px 14px 12px; }
.hx-doc__strip { display: none; }
.hx-doc__head { display: flex; align-items: center; gap: 8px; }
.hx-doc__title { font-weight: 700; font-size: 14.5px; min-width: 0; }
.hx-doc__head .hx-swap { margin-left: auto; justify-items: end; flex: none; }
.hx-chip { padding: 1px 9px; border-radius: 999px; font-weight: 700; font-size: 13px; white-space: nowrap; }
.hx-chip--none { background: #eef2f7; color: #475569; }
.hx-chip--draft { background: #e8efff; color: #1e3a8a; }
.hx-chip--sent { background: var(--ok-bg); color: var(--ok); }
.hx-doc__by { display: grid; margin: 2px 0 0; color: #475569; }
.hx-doc__vp { position: relative; }
.hx-doc__body { position: relative; padding: 1px 0; transition: transform .35s var(--out); }
.hx-doc__lines { display: grid; gap: 2px; margin: 8px 0 10px; }
.hx-ln { position: relative; display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 2px 12px; align-items: start; padding: 4px 8px; margin: 0 -8px; border-radius: 6px; }
.hx-ln::before { content: ""; position: absolute; inset: 0; border-radius: 6px; background: #eaf1ff; opacity: 0; transition: opacity .3s var(--out); }
.hx-ln::after { content: ""; position: absolute; left: 8px; right: 8px; bottom: 0; border-bottom: 1px dashed #dbe3f0; }
.hx-ln > * { position: relative; }
.hx-ln.is-link::before { opacity: 1; }
.hx-ln__t { color: #0f172a; }
.hx-ln__s { justify-self: end; font-weight: 650; font-size: 12.5px; color: #1e3a8a; background: #e8efff; border: 1px solid #c7d7fe; padding: 0 8px; border-radius: 999px; white-space: nowrap; transition: opacity .25s var(--out), transform .25s var(--out), box-shadow .25s var(--out); }
.hx-ln__t { transition: opacity .25s var(--out), transform .25s var(--out); }
.hx-ln:not(.is-on) .hx-ln__t { opacity: 0; transform: translateY(3px); }
.hx-ln:not(.is-on) .hx-ln__s { opacity: 0; transform: translateX(-4px); }
/* The edit: strike-and-replace, then it settles */
.hx-ln__t.hx-swap { display: grid; }
.hx-ln del { color: #9a3412; text-decoration: line-through; text-decoration-thickness: 1.5px; }
.hx-ln ins { text-decoration: none; background: #dfe8ff; border-radius: 3px; box-shadow: 0 1px 0 #3b6ff0; color: #0f172a; }
.hx-ln__side { display: flex; flex-direction: column; align-items: flex-end; gap: 3px; }
.hx-ln__ed { justify-self: end; font-size: 12.5px; font-weight: 650; color: #1e40af; white-space: nowrap; opacity: 0; transform: translateY(-2px); transition: opacity .3s var(--out), transform .3s var(--out); }
.hx.is-edit .hx-ln__ed { opacity: 1; transform: none; }
.hx-ln--edit.is-diff::before { opacity: 1; background: #fff7e0; }
/* Source excerpt: reserved row under the PT line (space held from the start: covers nothing, pushes nothing) */
.hx-src { grid-column: 1 / -1; position: relative; display: block; margin: 6px 0 2px; }
.hx-src__in { display: block; position: relative; padding: 7px 10px; border-radius: 8px; background: #f5f8ff; border: 1px solid #c7d7fe; font-size: 12.5px; line-height: 1.45; color: #1e293b; opacity: 0; transition: opacity .15s linear; }
.hx-src__in::before { content: ""; position: absolute; right: var(--ax, 40px); top: -6px; width: 10px; height: 10px; background: #f5f8ff; border-left: 1px solid #c7d7fe; border-top: 1px solid #c7d7fe; transform: rotate(45deg); }
.hx-src__in b { display: block; font-size: 12px; color: #1e3a8a; }
.hx-src__in q { quotes: "\201C" "\201D"; }
.hx-src__sk { position: absolute; inset: 0; border-radius: 8px; background: #f1f4f8; transition: opacity .15s linear; }
.hx.is-src .hx-src__in { opacity: 1; }
.hx.is-collapse .hx-src__in { opacity: 0; }
/* Small screens, after approval: the sent referral as four cited lines (all sources and the approval in view) */
.hx-sum { display: none; }
.hx.use-sum .hx-sum { display: grid; position: absolute; left: 12px; right: 12px; top: 2px; gap: 6px; margin: 0; opacity: 0; transition: opacity .25s var(--out); }
.hx.use-sum .hx-sum li { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px; align-items: start; padding-bottom: 6px; border-bottom: 1px dashed #dbe3f0; }
.hx.use-sum .hx-sum span { font-size: 15px; line-height: 1.4; color: #0f172a; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.hx.use-sum .hx-sum i { font-style: normal; font-weight: 650; font-size: 12.5px; color: #1e3a8a; background: #e8efff; border: 1px solid #c7d7fe; padding: 0 8px; border-radius: 999px; white-space: nowrap; margin-top: 2px; }
.hx.use-sum.is-sum .hx-sum { opacity: 1; transition: opacity .25s var(--out) .2s; }
.hx.use-sum .hx-doc__body { transition: transform .35s var(--out), opacity .2s var(--out); }
.hx.use-sum.is-sum .hx-doc__body { opacity: 0; }
.hx.use-sum.is-sum .hx-doc__vp { -webkit-mask-image: none !important; mask-image: none !important; }
[data-edline] { transition: transform .35s var(--out); }
.hx.is-collapse [data-edline] { transform: translateY(calc(-1 * var(--srcH, 0px))); }
.hx.is-src .hx-src__sk, .hx-ln.is-on .hx-src__sk { opacity: 0; }
.hx.is-ptring .hx-ln__s[data-pt] { box-shadow: 0 0 0 3px rgba(59, 111, 240, .35); }
/* Placeholder skeleton: the empty referral reads as a form waiting to be filled */
.hx-ln__sk { position: absolute; inset: 6px 8px auto 8px; display: grid; grid-template-columns: 1fr auto; gap: 6px 14px; pointer-events: none; transition: opacity .2s var(--out); }
.hx-ln__sk i { display: block; height: 9px; border-radius: 5px; background: #e5eaf1; }
.hx-ln__sk i:nth-child(2) { grid-row: 2; width: 55%; }
.hx-ln__sk em { grid-column: 2; grid-row: 1; width: 86px; height: 14px; border-radius: 999px; background: #e8eef9; }
.hx-ln.is-on .hx-ln__sk { opacity: 0; }

.hx-doc__foot { display: grid; }
.hx-doc__foot > * { grid-area: 1 / 1; }
.hx-foot__ask { display: flex; align-items: center; gap: 8px; white-space: nowrap; transition: opacity .15s var(--out); }
.hx-foot__note { margin-right: auto; font-weight: 600; color: #334155; display: inline-flex; align-items: center; gap: 6px; }
.hx-foot__note svg { width: 14px; height: 14px; flex: none; }
.hx-edit, .hx-go { transition: opacity .25s var(--out), transform .2s var(--out), background-color .2s var(--out); }
.hx:not(.is-ready) .hx-edit, .hx:not(.is-ready) .hx-go { opacity: .4; }
.hx.is-done .hx-foot__ask { opacity: 0; }
.hx-edit { display: inline-flex; align-items: center; min-height: 32px; padding: 0 12px; border-radius: 999px; border: 1px solid #c7d7fe; color: var(--blue); font-weight: 650; background: #fff; }
.hx.is-epress .hx-edit { transform: scale(.94); background: #e8efff; }
.hx-go { display: inline-grid; justify-items: center; min-height: 32px; border-radius: 999px; background: var(--blue); color: #fff; font-weight: 700; }
.hx-go > span { display: inline-flex; align-items: center; justify-content: center; padding: 0 13px; white-space: nowrap; }
.hx.is-press .hx-go { transform: scale(.94); background: #1d3a9e; }
.hx.is-pending .hx-go { background: #5b7fdc; }
.hx-foot__done { display: grid; gap: 1px; opacity: 0; transition: opacity .3s var(--out) .15s; }
.hx.is-done .hx-foot__done { opacity: 1; }
.hx-foot__done b { display: inline-flex; align-items: center; gap: 7px; color: var(--ok); }
.hx-foot__done b svg { width: 18px; height: 18px; flex: none; }
.hx-foot__done span { color: #334155; font-weight: 600; padding-left: 25px; line-height: 1.35; }

/* The person: pointer settles on button padding, never over text */
.hx-cursor { position: absolute; left: 0; top: 0; width: 18px; height: 22px; pointer-events: none; opacity: 0; z-index: 8; transition: transform .7s cubic-bezier(.45, 0, .2, 1), opacity .25s var(--out); }
.hx.is-hand .hx-cursor { opacity: 1; }
.hx-cursor svg { display: block; width: 100%; height: 100%; filter: drop-shadow(0 2px 3px rgba(15, 23, 42, .3)); }

/* Step rail and the docked caption (fixed height) */
.hx-rail__steps { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.hx-step { width: 100%; min-height: 44px; display: grid; align-content: start; gap: 7px; padding: 4px 0 2px; background: none; border: 0; text-align: left; cursor: pointer; color: #556274; border-radius: 8px; }
.hx-step__track { display: block; height: 4px; border-radius: 99px; background: #e2ddd0; overflow: hidden; }
.hx-step__fill { display: block; height: 100%; background: var(--blue); transform-origin: 0 50%; transform: scaleX(0); }
.hx-step__lab { display: flex; align-items: center; gap: 7px; font-size: .875rem; font-weight: 650; line-height: 1.25; }
.hx-step__num { flex: none; display: inline-grid; place-items: center; width: 21px; height: 21px; border-radius: 50%; border: 1.5px solid #a8b3c2; font-size: .75rem; font-weight: 700; background: #fff; }
.hx-step[aria-current="step"] { color: var(--navy); }
.hx-step[aria-current="step"] .hx-step__num { border-color: var(--blue); color: var(--blue); }
.hx-step.is-done { color: #334155; }
.hx-step.is-done .hx-step__num { background: var(--blue); border-color: var(--blue); color: #fff; }
.hx-step:hover { color: var(--navy); }
.hx-capbar { display: flex; align-items: center; gap: 10px; }
.hx-cap { flex: 1; min-width: 0; margin: 0; height: 3em; overflow: hidden; font-size: .9375rem; line-height: 1.5; color: #334155; transition: opacity .3s var(--out); display: flex; align-items: center; }
.hx-cap > span { display: block; }
.hx-cap.is-out { opacity: 0; transition-duration: .2s; }
.hx-cap b { color: var(--navy); }
.hx-cap a { font-weight: 650; white-space: nowrap; }
.hx-cap .hx-big { white-space: nowrap; font-size: 1.08em; letter-spacing: -.015em; }
.hx-cap.is-pay { font-size: .875rem; letter-spacing: -.012em; }
@media (min-width: 1000px) and (max-width: 1279px) { .hx-cap.is-pay { font-size: 13.25px; } }
.hx-ctl { flex: none; display: inline-flex; align-items: center; justify-content: center; gap: 6px; min-width: 44px; height: 44px; padding: 0 11px; border-radius: 999px; border: 1px solid #c9c2b2; background: #fff; color: var(--navy); cursor: pointer; font-size: .875rem; font-weight: 650; }
.hx-ctl:hover { border-color: var(--blue); color: var(--blue); }
.hx-ctl svg { width: 16px; height: 16px; flex: none; }

/* Narrow windows (two-column layout at 1000-1179px): short labels, approval row wraps */
@container (max-width: 520px) {
  .hx-tag .hx-l { display: none; } .hx-tag .hx-s { display: inline; }
  .hx-foot__ask { flex-wrap: wrap; white-space: normal; gap: 6px 8px; } .hx-foot__note { flex-basis: 100%; }
}

/* 1000-1179px: the whole story (Approve, steps, caption) fits the first screen with the CTAs */
@media (min-width: 1000px) and (max-width: 1179px) and (min-height: 700px) {
  .hero.hx-hero { padding-top: 28px; }
  .hx { max-height: calc(100vh - var(--nav-h, 68px) - 28px - 14px); gap: 8px; }
  .hx-win { min-height: 0; }
  .hx-stage { min-height: 0; display: flex; flex-direction: column; overflow: hidden; padding: 8px 10px; font-size: 13px; line-height: 1.35; }
  .hx-wl { flex: none; }
  .hx-wl__h { min-height: 28px; } .hx-wl__r { min-height: 29px; } .hx-wl__why { padding-bottom: 5px; }
  .hx-doc { flex: 1 1 auto; min-height: 0; display: flex; flex-direction: column; margin-top: 8px; padding: 8px 12px 10px; }
  .hx-doc__vp { flex: 1 1 auto; min-height: 0; overflow: hidden; }
  /* the draft rests on whole rows;  a short top fade only while it scrolls */
  .hx-doc__vp { -webkit-mask-image: linear-gradient(180deg, transparent 0, #000 22px); mask-image: linear-gradient(180deg, transparent 0, #000 22px); -webkit-mask-size: 100% calc(100% + 22px); mask-size: 100% calc(100% + 22px); -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat; -webkit-mask-position: 0 -22px; mask-position: 0 -22px; transition: -webkit-mask-position .15s linear, mask-position .15s linear; }
  .hx.is-moving .hx-doc__vp { -webkit-mask-position: 0 0; mask-position: 0 0; }
  .hx-doc__lines { margin: 6px 0 6px; }
  .hx-ln { padding: 3px 8px; }
  .hx-doc__foot { flex: none; padding-top: 6px; border-top: 1px solid #e2e8f0; }
  .hx-win__bar { padding: 7px 12px; }
}

/* ---------- Phone: the referral opens as a sheet; the Reyes row stays pinned on top ---------- */
@media (max-width: 560px) {
  .hx-l { display: none; } .hx-s { display: inline; }
  .hx-stage { height: 413px; padding: 8px; font-size: 13px; overflow: hidden; }
  .hx-doc__foot { flex: none; margin: 0 -12px; padding: 8px 12px 0; border-top: 1px solid #e2e8f0; background: #fbfcff; }
  .hx-hero h1 { font-size: 1.875rem; }
  .hx-win__bar { padding: 8px 12px; }
  .hx-wl__h, .hx-wl__r { grid-template-columns: minmax(0, 1.25fr) minmax(0, .62fr) minmax(0, .95fr) minmax(0, 1.12fr); gap: 6px; padding: 0 8px; }
  .hx-wl__h { min-height: 38px; line-height: 1.2; }
  .hx-edd small { display: block; width: max-content; margin: 1px 0 0; }
  .hx-wl__r { min-height: 36px; padding-top: 3px; padding-bottom: 3px; }
  .hx-tag { padding: 2px 7px; }
  .hx-wl__why { padding: 0 8px 6px; }
  .hx-doc { position: absolute; z-index: 3; left: 8px; right: 8px; top: 8px; bottom: 8px; margin: 0; padding: 0 12px; display: flex; flex-direction: column; transform: translateY(var(--peek, 240px)); transition: transform .35s var(--out); box-shadow: 0 -6px 18px rgba(15, 23, 42, .08); }
  .hx:not([data-focus="wl"]) .hx-doc { transform: none; }
  .hx-doc__strip { flex: none; display: grid; grid-template-columns: auto minmax(0, 1fr) auto auto; gap: 8px; align-items: center; margin: 0 -12px; padding: 6px 10px 6px 12px; min-height: 36px; background: #fff8ec; box-shadow: inset 3px 0 0 var(--amber); border-bottom: 1px solid var(--line); border-radius: 10px 10px 0 0; font-weight: 650; transition: background-color .3s var(--out), box-shadow .3s var(--out); }
  .hx.is-sent .hx-doc__strip { background: #f2fbf6; box-shadow: inset 3px 0 0 #34a77a; }
  .hx-doc__strip .hx-back { color: #1e40af; font-weight: 700; font-size: 16px; line-height: 1; }
  .hx-doc__strip .hx-edd { white-space: nowrap; }
  .hx[data-focus="wl"] .hx-doc__strip { background: #f1f5fb; box-shadow: none; }
  .hx-doc__head { flex: none; padding-top: 8px; }
  .hx-doc__title { font-size: 14px; }
  .hx-doc__by { flex: none; font-size: 13px; }
  .hx-doc__vp { flex: 1 1 auto; min-height: 0; overflow: hidden; margin: 0 -12px; padding: 0 12px; }
  .hx.is-scrolled .hx-doc__vp { -webkit-mask-image: linear-gradient(180deg, transparent 0, #000 18px); mask-image: linear-gradient(180deg, transparent 0, #000 18px); }
  .hx-ln { display: block; padding: 5px 8px; }
  .hx-ln__t { display: inline; font-size: 15px; line-height: 1.4; }
  .hx-ln__t.hx-swap { display: inline-grid; }
  .hx-ln__s { display: inline-block; margin: 3px 0 0; font-size: 12.5px; }
  .hx-ln__side { display: inline; }
  .hx-ln__ed { display: inline-block; margin: 3px 0 0 6px; }
  .hx-doc__lines { margin: 6px 0 8px; }
  .hx-foot__ask { flex-wrap: wrap; gap: 6px 8px; white-space: normal; padding-bottom: 10px; }
  .hx-foot__note { flex-basis: 100%; }
  .hx-foot__done { padding-bottom: 10px; }
  .hx-src__in { font-size: 14px; line-height: 1.4; }
  .hx-src__in b { font-size: 13px; }
  .hx-ln__sk { grid-template-columns: 1fr; }
  .hx-ln__sk em { grid-column: 1; grid-row: 3; }
  .hx-rail__steps { gap: 8px; }
  .hx-step__lab { font-size: .8125rem; align-items: flex-start; }
  .hx-cap { font-size: .875rem; height: 3em; line-height: 1.5; }
  .hx-cap.is-pay { font-size: 15px; letter-spacing: -.01em; }
  .hx-capbar { gap: 10px; }
}

.hx.is-snap *, .hx.is-snap *::before, .hx.is-snap *::after { transition: none !important; }

/* Desktop screens 800px tall or less (e.g. 1280x800): ~50px tighter so the caption and Pause/Replay sit in the first screen;  text stays >= 12px */
@media (min-width: 1180px) and (max-height: 800px) {
  .hero.hx-hero { padding-top: 32px; }
  .hx { gap: 8px; }
  .hx-win__bar { padding: 7px 14px; }
  .hx-stage { padding: 10px 12px; }
  .hx-wl__h { min-height: 28px; } .hx-wl__r { min-height: 30px; }
  .hx-wl__why { padding-bottom: 5px; }
  .hx-doc { margin-top: 8px; padding: 9px 14px 10px; }
  .hx-doc__lines { margin: 6px 0 7px; gap: 1px; }
  .hx-ln { padding: 3px 8px; }
  .hx-src { margin: 4px 0 1px; }
  .hx-src__in { padding: 5px 10px; }
}

@media (prefers-reduced-motion: reduce) {
  .hx *, .hx *::before, .hx *::after { transition: none !important; }
  .hx-hero .btn--primary.is-ring { animation: none; }
  .hx-ctl { display: none; }
}
@media print { .hx-ctl, .hx-cursor { display: none !important; } }

/* ======================================================================
   v4 formatting pass (designer review): natural wrapping, one callout style,
   hero balance, even strips, tables and cards
   ====================================================================== */
/* running text wraps naturally; balance stays on headings only */
p, li, dd, td, .callout p, .section__lede, .phase p, .role span, .disclose p, .checks li, .bullets li, .notyet li,
.blk > p.fine, .blk > p.blk__cta, .blk > p.tiles__note, .blk .fine, .blk .callout p, .qa dd, .faq__a p, .strip__row span,
.hero--light .hero__proof span, .flow__step, .flow__step * { text-wrap: pretty; }
@media (min-width: 640px) { main p:not(.lead):not(.phero__lede):not(.section__lede), main dd { text-wrap: pretty; } }
.callout p, .phase p, .phase__note, .role span, .disclose p, .blk > p { max-width: none; }
.phero p, .phero__lede { max-width: 34em; text-wrap: pretty; }
.fine { line-height: 1.5; }
/* disclosure panels share one body style */
.disclose > :not(summary) { font-size: 1rem; color: var(--ink-2, #334155); }
.disclose > p, .disclose > ul, .disclose > .tbl { margin-left: 18px; margin-right: 18px; }
/* "What Aurifex doesn't do yet" uses the standard callout look */
.notyet { background: var(--tint); border: 1px solid #dbe6ff; border-radius: var(--radius); padding: 18px 22px; }
.notyet li { color: var(--ink-2, #334155); }
.notyet li::before { width: 6px; height: 6px; border-radius: 50%; top: .62em; left: 6px; background: var(--blue); }
/* callout before the first section heading keeps the section rhythm */
.doc__body > .callout:first-child, .doc__body > .blk:first-child > .callout:first-child { margin-bottom: var(--space-5, 48px); }
/* home hero: copy column centred against the product story, proof tiles in one row with the method link under them */
@media (min-width: 1000px) {
  .hx-hero .hx-grid { grid-template-rows: 1fr auto auto auto 1fr auto; grid-template-areas: "sp1 story" "head story" "lede story" "acts story" "sp2 story" "foot foot"; }
  .hx-hero .hero__foot { display: grid; grid-template-columns: minmax(0, 1fr); justify-items: start; gap: 10px; }
  .hx-hero .hero__proof { width: 100%; max-width: none; }
}
/* trust strip: four equal cells inside the page gutter */
.strip__row { max-width: var(--maxw, 1160px); margin-inline: auto; }
@media (min-width: 1180px) { .strip__row { grid-template-columns: repeat(4, minmax(0, 1fr)); align-items: center; } }
/* role cards: titles, body and footer line up across a row */
.roles .role { display: grid; grid-template-rows: auto 1fr auto; }
.roles .role em { margin-top: auto; }
/* tables: hours never split, cells wrap naturally */
td .nw, td.nw { white-space: nowrap; }
.tbl td, .tbl th { text-wrap: pretty; }
/* data-flow steps and chart rows keep equal heights in a row */
.swim__steps { align-items: stretch; }
.chart45 { align-items: stretch; }
/* status chips read as sentence case ("In testing", not "In Testing") */
.tchip { text-transform: none; }
/* v4: body copy in lists, callouts and quotes wraps "pretty" (balance only on headings, labels and buttons); out-ranks the round 6 balance block */
html main .blk > p.fine, html main .blk > p.callout, html main .blk .callout p, html main .blk .fine,
html main .blk .checks li, html main .doc__body > .blk > ul > li, html main .doc__body > .blk > ol > li,
html main .blk > p, html main .article__body p, html main .prose p, html main .panel.prose p, html main .gloss__term p, html main .boiler p,
html main blockquote p, html main .phase p, html main .reveal > p, html main .checks li, html main .bullets li, html main .notyet li, html main .summary5 li,
html main .qa dd, html main .faq__a p, html main .calc__warn { text-wrap: pretty; }
/* trust strip: all four items on one line from 1024px */
@media (min-width: 1024px) { .strip__row { grid-template-columns: repeat(4, max-content); justify-content: space-between; align-items: center; } .strip__row span { white-space: nowrap; } }

/* ======================================================================
   Cycle 1 (buyers + UX): hero order and spacing, scope line, text-link CTA, capacity line, readable "doesn't do yet"
   ====================================================================== */
.hx-hero .hx-grid { grid-template-areas: "head" "lede" "acts" "story" "foot"; }
.hero__textlink { display: inline-flex; align-items: center; gap: 6px; min-height: 44px; padding: 0 4px; color: var(--blue); font-weight: 600; }
.hero__textlink:hover { text-decoration: underline; }
.hx-hero .hero__ctas { align-items: center; }
.hero__scope { margin: 6px 0 4px; font-size: .9375rem; color: var(--muted); max-width: 46ch; }
.hx-hero .hero__caveat { font-size: .9375rem; color: var(--muted); }
@media (min-width: 1000px) {
  .hx-hero .hx-grid { grid-template-rows: auto auto auto 1fr auto; grid-template-areas: "head story" "lede story" "acts story" ". story" "foot foot"; }
}
.capline { margin: 0 0 28px; }
.capline a { display: inline-flex; align-items: center; gap: 6px; min-height: 44px; color: var(--blue); font-weight: 600; }
.notyet h3 { font-size: 1.25rem; margin-bottom: 10px; }
.notyet li { font-size: 1rem; color: var(--ink); line-height: 1.5; }
.notyet { border-left: 4px solid var(--blue); }
@media (max-width: 819px) {
  .flowstrip { display: grid; grid-template-columns: minmax(0, 1fr); overflow: visible; margin: 0 0 24px; padding: 0; }
  .flowstrip li { flex: none; }
}
.strip__row { grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (min-width: 1180px) { .strip__row { grid-template-columns: repeat(2, minmax(0, max-content)); justify-content: center; gap: 12px 64px; } }
@media (max-width: 479px) {
  .hx-wl__h, .hx-wl__r { grid-template-columns: minmax(0, 1.15fr) minmax(0, .6fr) minmax(0, .7fr) minmax(0, 1.25fr); gap: 5px; }
  .hx-wl__r .hx-tag { padding: 2px 6px; letter-spacing: -.01em; }
}
@media (max-width: 560px) { .hx-edd small.hx-l { display: none; } }
/* wide 4-column definitions table: a table from 900px, cards below */
@media (max-width: 899px) {
  .tbl:has(.tbl--stack-wide) { overflow: visible; border: 0; background: none; }
  .tbl table.tbl--stack-wide { min-width: 0; }
  .tbl--stack-wide thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
  .tbl--stack-wide, .tbl--stack-wide tbody, .tbl--stack-wide tr, .tbl--stack-wide th, .tbl--stack-wide td { display: block; width: 100%; min-width: 0 !important; }
  .tbl--stack-wide tr { margin-bottom: 12px; border: 1px solid var(--line); border-radius: var(--radius); background: #fff; overflow: hidden; }
  .tbl--stack-wide td, .tbl--stack-wide th { border-top: 1px solid var(--line); padding: 12px 16px; }
  .tbl--stack-wide tr > :first-child { border-top: 0; background: #f8fafc; }
  .tbl--stack-wide td[data-label]::before { content: attr(data-label); display: block; margin-bottom: 4px; font-size: .8125rem; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: var(--blue); }
}
.hx-hero .hero__tertiary { display: flex; flex-wrap: wrap; gap: 4px 20px; }
.hx-hero .hero__tertiary a { display: inline-flex; align-items: center; gap: 6px; min-height: 44px; }

/* ---------- Cycle 1, site-wide: About media, demo/contact gap, footer, tap targets ---------- */
.company--stack { grid-template-columns: minmax(0, 1fr) !important; gap: 32px; }
.company--stack > .reveal:first-child { max-width: 760px; }
.company--stack .company__media { max-width: 1100px; margin: 0 auto; }
.page-hero { padding-bottom: 112px; }
.fcol summary { min-height: 44px; display: flex; align-items: center; }
.fcol > a { display: flex; align-items: center; min-height: 44px; }
.faq summary, details.qa summary { min-height: 44px; }
body { overflow-x: clip; }
.announce a, .role em a { display: inline-block; padding: 4px 0; min-height: 24px; }
@media (max-width: 599px) {
  .crumbs ol { flex-wrap: nowrap; min-width: 0; }
  .crumbs li { flex: none; white-space: nowrap; }
  .crumbs li:last-child { flex: 0 1 auto; min-width: 0; }
  .crumbs li:last-child > span, .crumbs [aria-current] { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-width: 0; }
}

/* ============ CYCLE 2 (buyer + UX panel) ============ */
/* Hero story: states that are faded out are also hidden from text extraction, so the DOM reads only what is on screen */
.hx-swap > * { visibility: hidden; transition: opacity .2s var(--out), visibility 0s linear .2s; }
.hx-swap > .is-on { visibility: inherit; transition: opacity .25s var(--out) .2s, visibility 0s linear 0s; }
.hx-sum { visibility: hidden; }
.hx.use-sum.is-sum .hx-sum { visibility: inherit; }
.hx.use-sum.is-sum .hx-doc__body { visibility: hidden; transition: transform .35s var(--out), opacity .2s var(--out), visibility 0s linear .2s; }
.hx-foot__done { visibility: hidden; }
.hx.is-done .hx-foot__done { visibility: inherit; }
.hx.is-done .hx-foot__ask { visibility: hidden; transition: opacity .15s var(--out), visibility 0s linear .15s; }
.hx-src__in { visibility: hidden; }
.hx.is-src .hx-src__in { visibility: inherit; }
.hx.is-collapse .hx-src__in { visibility: hidden; transition: opacity .15s linear, visibility 0s linear .15s; }
.hx-cursor { visibility: hidden; }
.hx.is-hand .hx-cursor { visibility: inherit; }
.hx-wl__why { visibility: hidden; }
.hx.is-why .hx-wl__why { visibility: inherit; }
.hx-ln__ed { visibility: hidden; }
.hx.is-edit .hx-ln__ed { visibility: inherit; }

/* Hero proof: the AUROC card's recall/precision sit on their own small line */
.hx-hero .hero__proof small { display: block; margin-top: 4px; font-size: .8125rem; line-height: 1.3; color: var(--muted); font-weight: 600; }
@media (max-width: 560px) { .hx-hero .hero__proof small { margin-top: 0; } }
/* For IT and security: a quiet strip under the metrics */
.itstrip { display: flex; flex-wrap: wrap; align-items: center; gap: 0 20px; margin: 4px 0 0; font-size: .9375rem; }
.itstrip b { color: var(--navy); font-weight: 700; margin-right: 4px; }
.itstrip a { display: inline-flex; align-items: center; gap: 6px; min-height: 44px; color: var(--blue); font-weight: 600; }
/* Hospital view: a card-style link like its neighbours */
.capline .pill-link { display: inline-flex; flex-wrap: wrap; align-items: center; gap: 4px 10px; min-height: 44px; padding: 10px 18px; border: 1px solid var(--line); border-radius: 999px; background: #fff; color: var(--navy); font-weight: 500; text-decoration: none; box-shadow: 0 1px 2px rgba(15, 23, 42, .05); }
.capline .pill-link b { color: var(--blue); font-weight: 700; }
.capline .pill-link:hover { border-color: #9db8fb; }
@media (max-width: 560px) { .capline .pill-link { border-radius: 14px; } }
/* Eyebrow dot: no halo crowding the text on phones */
@media (max-width: 560px) { .eyebrow .pulse-dot { box-shadow: none !important; animation: none; } }
/* The struck-and-replaced edit is drawn from data-t, so the page text holds only the final line */
.hx [data-t]::before { content: attr(data-t); }
@media (max-width: 560px) {
  .hx[data-focus="wl"]:not(.is-why) .hx-doc { transform: translateY(calc(var(--peek, 240px) - var(--whyH, 0px))); }
}
@media (max-width: 560px) { .itstrip { display: grid; justify-items: start; gap: 0; } .itstrip b { margin: 8px 0 0; } }
/* Split heroes: show the whole screen (never crop its right edge);  the screen centers against the copy */
@media (min-width: 1180px) {
  .phero--split .phero__shot { align-self: center; display: flex; flex-direction: column; }
  .phero--split .phero__shot img { position: static; height: auto; aspect-ratio: auto; object-fit: contain; }
  .phero--split .phero__shot figcaption { left: 14px; bottom: 14px; }
}

/* ---- Cycle 2: one type scale.  h1 (inner) 36 -> 49.6px, h2 26 -> 32px, h3 (card titles) 20px;  home h1 stays larger on wide screens ---- */
@media screen {
  :root { --t-h1: clamp(2.25rem, 1.5rem + 2.4vw, 3.1rem); --t-h2: clamp(1.625rem, 1.3rem + 1.1vw, 2rem); --t-h3: 1.25rem; }
  .phero h1, .page-hero h1 { font-size: var(--t-h1) !important; }
  main h2:not(.sr-only):not(.gloss__letter), .cta h2 { font-size: var(--t-h2) !important; }
  .phase h3, .principle h3, #pricing h3, .card__h { font-size: var(--t-h3) !important; }
  .gloss__letter { font-size: var(--t-h2) !important; letter-spacing: 0; text-transform: none; color: var(--blue); margin: 40px 0 4px; padding-bottom: 6px; border-bottom: 1px solid var(--line); }
  .gloss__letter:first-child { margin-top: 8px; }
}
@media screen and (max-width: 560px) { .hx-hero h1 { font-size: 2.25rem !important; line-height: 1.1; } .phero h1, .page-hero h1 { line-height: 1.1; } }

/* demo/ and contact/: left-aligned hero with the blue eyebrow, like every other page;  no dead space under the form */
.page-hero .wrap { text-align: left; }
.page-hero h1 { margin-left: 0 !important; margin-right: 0 !important; }
.page-hero p { margin-left: 0; margin-right: 0; }
.page-hero p.eyebrow { color: var(--sky); font-size: 13px; letter-spacing: .12em; line-height: 1.6; margin-bottom: 14px; }
.page__grid { align-items: start !important; }
@media (min-width: 960px) { .page__grid > .panel { position: sticky; top: 96px; } }
p.proofline { display: grid; gap: 2px; }
p.proofline span { white-space: normal; }
p.proofline a { justify-self: start; display: inline-flex; align-items: center; min-height: 44px; margin-bottom: -10px; }
@media (min-width: 960px) { p.proofline { display: none; } }
/* Phone breadcrumbs: one line, chevron before the current page, shared baseline */
@media (max-width: 599px) {
  .crumbs li:last-child { flex-basis: auto; margin-top: 0; }
  .crumbs li:last-child::before { display: block; }
  .crumbs li { min-height: 44px; }
}
/* Mobile menu: the two extra rows match the top-level rows (same inset, size and weight) */
.nav__mextra { padding-top: 0 !important; }
.nav__mextra a { padding: 0 10px !important; font-weight: 550 !important; font-size: 1.05rem; color: rgba(255, 255, 255, .86) !important; }
.pipeline__steps .node { font-size: 1.125rem; font-variant-numeric: tabular-nums; }
.pipeline__steps p, .pipeline__steps h3 { text-wrap: wrap !important; }
/* Tap targets: inline links get a taller hit area without changing the line layout */
@media (max-width: 1024px) {
  main :is(p, li, td, dd, figcaption, em) a:not(.btn):not(.more), .footer a:not(.btn) { padding-block: 14px; }
  .announce a { padding-block: 14px; }
  .announce a { display: inline; min-height: 0; }
}
/* A single link inside a sentence stays inline (its 44px hit area comes from padding, so the line keeps its height) */
main p:not(.fine):not(.fact__fine):not(.hero__caveat):not(.capline):not(.itstrip):not(.proofline):not(.blk__cta):not(.teaser-more) > a:only-child:not(.btn):not(.more) { display: inline; min-height: 0; padding-block: 14px; }
.hx-hero .hero__proof li > span, .hx-hero .hero__proof li > small { align-self: stretch; text-wrap: wrap !important; }
.hero__proof span span { display: inline; margin: 0; font-size: inherit; color: inherit; }

/* ======================================================================
   Cycle 3 review pass
   ====================================================================== */
/* Hero: Pause/Replay sits at the right end of the step-tab row */
.hx-rail { display: flex; align-items: flex-start; gap: 12px; }
.hx-rail__steps { flex: 1; min-width: 0; }
.hx-rail .hx-ctl { margin-top: 2px; }
/* Hero text link starts on the gutter;  arrow keeps its space */
.hero__textlink { padding: 0 4px 0 0; }
.hero--light .hero__caveat a, .hero__caveat a { gap: 6px; }
/* Below the two-column hero the foot strip carries the IT links, so the mockup follows the CTA directly */
@media (max-width: 999px) { .hx-hero .hero__tertiary { display: none; } }
/* Equal-height cards in the module and role grids */
.mods, .hub--roles { align-items: stretch; }
.mods > .mod, .hub--roles > .hubcard { height: 100%; }
.hub--roles .hubcard__body { display: flex; flex-direction: column; height: 100%; }
.hub--roles .hubcard__body .more { margin-top: auto; padding-top: 12px; }
/* Breadcrumb links are at least 44px wide */
.crumbs a { min-width: 44px; justify-content: center; }
/* Calculator inputs: a solid, visible focus ring */
.calc .unit:focus-within { border-color: #3b6ff0; box-shadow: 0 0 0 2px #3b6ff0; }
.calc .field input:focus-visible { outline: none; }
/* Worked example on the executives page */
.example { padding: 14px 16px; border-left: 3px solid var(--blue, #2b59d9); background: #f5f8ff; border-radius: 0 8px 8px 0; }
/* "What Aurifex will not do" on Trust reuses the not-yet callout */
.blk .notyet { margin-top: 24px; }
/* Mega menus without promo cards */
.mega__grid--2 { grid-template-columns: 1fr 1fr; }
.mega__grid--1 { grid-template-columns: 1fr; }
@media (max-width: 1100px) { .mega__grid--2, .mega__grid--1 { grid-template-columns: 1fr; } }

/* Resources hub: tour card full width as image + text side by side;  the four cards below pair up 50/50 */
@media (min-width: 900px) {
  .hub:not(.hub--roles):has(> :nth-child(5):last-child) > :nth-child(n+2) { grid-column: span 3; }
  .hub:not(.hub--roles):has(> :nth-child(5):last-child) > :first-child { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr); }
  .hub:not(.hub--roles):has(> :nth-child(5):last-child) > :first-child .hubcard__media { border-bottom: 0; border-right: 1px solid var(--line); }
  .hub:not(.hub--roles):has(> :nth-child(5):last-child) > :first-child .hubcard__body { align-self: center; }
}
/* Phones: the Pause/Replay control is an icon-only 44px button so the three step labels keep their width */
@media (max-width: 639px) {
  .hx-rail .hx-ctl { padding: 0; width: 44px; }
  .hx-rail .hx-ctl [data-ctl-txt] { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
}

/* ===== Cycle 4 ===== */
/* One label per figure: screens carry their own "Illustrative" chip;  "View full size" is an icon-only button over the image */
.zoombox { position: relative; display: block; }
.zoombtn.zoombtn--icon { position: absolute; top: auto; bottom: 10px; right: 10px; left: auto; width: 44px; height: 44px; min-height: 44px; padding: 0; justify-content: center; border-radius: 10px; background: rgba(11, 23, 48, .82); color: #fff; box-shadow: 0 2px 10px rgba(0, 0, 0, .22); margin: 0; }
.zoombtn.zoombtn--icon:hover, .zoombtn.zoombtn--icon:focus-visible { background: var(--navy); }
.tour__img .zoombtn.zoombtn--icon { bottom: 8px; right: 8px; }
/* Rehab "How candidacy is handled": a 2x2 grid in the doc column so card text wraps naturally */
@media (min-width: 1280px) { .doc__body .summary5--4 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.summary5 span, .tile__def, .tile__label { text-wrap: pretty; }
/* Wide tables that scroll sideways on phones: fade at the right edge plus a small "Scroll" cue */
.tbl.tbl--scrolls:not(.tbl--end) { -webkit-mask-image: linear-gradient(90deg, #000 calc(100% - 36px), transparent); mask-image: linear-gradient(90deg, #000 calc(100% - 36px), transparent); }
.tbl__cue { margin: var(--space-3) 0 -12px; text-align: right; font-size: .8125rem; font-weight: 650; color: var(--muted); }
.disclose > .tbl__cue { margin-left: 18px; margin-right: 18px; }
/* Form helper:  neutral, not an error colour */
.lead__phi, .modal .lead__phi { color: var(--muted); font-weight: 400; }
/* Tour pins:  44px targets in the 48px gutter */
.tour__gutter .pin { width: 44px; height: 44px; font-size: .875rem; }
.tour__gutter .pin::after { inset: 0; }
/* One h3 size (20px) for card and entry titles;  small uppercase labels stay labels */
.price h3, .gloss__term h3, .pipeline__steps h3 { font-size: 1.25rem !important; }
/* Phone nav: "Request demo" where it fits on one line, "Demo" on narrow phones */
.nav__mdemo { white-space: nowrap; }
.nav__mdemo-s { display: none; }
@media (max-width: 439px) { .nav__mdemo-l { display: none; } .nav__mdemo-s { display: inline; } }


/* ===== c5 polish ===== */
/* Calculator: inputs carry their own focus ring;  figures mute when the reduction looks implausible */
.calc input:focus-visible { outline: 3px solid #3b6ff0; outline-offset: 2px; }
.calc__rows.is-over output { opacity: .45; }
/* Home: steps keep clear of Pause;  proof tiles stack on narrow phones */
@media (min-width: 1000px) { .hx-rail { gap: 16px; } }
@media (max-width: 480px) {
  .hero--light .hero__proof { grid-template-columns: minmax(0, 1fr) !important; }
  .hero--light .hero__proof li, .hero--light .hero__proof--lead { flex-direction: row !important; flex-wrap: wrap; align-items: baseline; gap: 4px 12px; }
  .hero--light .hero__proof b, .hero--light .hero__proof--lead b { flex: none; min-width: 3.6em; }
  .hero--light .hero__proof small { flex-basis: 100%; padding-left: 0; }
}

/* Trust: one fact per line in table cells;  gate pairs drop the repeated labels on phones */
.cell-list { margin: 0; padding-left: 1.1em; list-style: disc; }
.cell-list li { display: list-item; }
.cell-list li { margin: 0 0 4px; }
.cell-list li:last-child { margin-bottom: 0; }
@media (max-width: 600px) {
  .tbl--pairs td[data-label]::before { display: none !important; }
  .tbl--pairs tr > td:first-child { background: #f8fafc; font-weight: 650; color: var(--ink); }
}

/* Mobile menu: quick links set apart with a divider and label */
.nav__mlabel { display: none; }
@media (max-width: 1099px) {
  .nav__mextra { margin-top: 10px; border-top: 1px solid rgba(255, 255, 255, .18); }
  .nav__mlabel { display: block; margin: 12px 10px 2px; font-size: .8125rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: rgba(219, 231, 255, .78); }
}

/* Pixel polish (icon centring): heading icons sit on the first line's cap-height centre, legend swatches and callout icons centred on their text. */
.principle h3 svg { margin-top: -1px; }
.callout svg { margin-top: 1px; }
.tl__legend span { display: inline-flex; align-items: center; }
.tl__legend i { vertical-align: 0; }
.hx.use-sum .hx-sum { top: 10px; }