/* BharatClinic clinical templates (hub + condition) · "Glass & Thread", clinical register.
   Tokens are the Health Guides v3 tokens (Design/Health-Guides-Glass-v3-2026-10-27/COMPONENT-TOKENS.md), copied, not linked.
   Three materials: polished glass only on the masthead and the menu; matte forest for choices (concern routes);
   opaque paper for everything a patient reads (answers, tables, urgent signs, sources). No backdrop-filter on
   anything that scrolls; no animation a reader did not ask for, except one 320 ms desktop journey line. */

@font-face { font-family: "Cormorant"; src: url(fonts/cormorant-latin-wght.woff2) format("woff2"); font-weight: 300 700; font-display: swap; }
@font-face { font-family: "Cormorant"; src: url(fonts/cormorant-latin-600i.woff2) format("woff2"); font-weight: 400 700; font-style: italic; font-display: swap; }
@font-face { font-family: "Literata"; src: url(fonts/literata-latin-wght.woff2) format("woff2"); font-weight: 200 900; font-display: swap; }
@font-face { font-family: "Mukta"; src: url(fonts/mukta-latin-600.woff2) format("woff2"); font-weight: 400 700; font-display: swap; }
@font-face { font-family: "Mukta"; src: url(fonts/mukta-400-devanagari.woff2) format("woff2"); font-weight: 400; font-display: swap; unicode-range: U+0900-097F, U+1CD0-1CF9, U+200C-200D, U+20A8, U+25CC, U+A830-A839, U+A8E0-A8FF; }
@font-face { font-family: "Mukta"; src: url(fonts/mukta-600-devanagari.woff2) format("woff2"); font-weight: 600 700; font-display: swap; unicode-range: U+0900-097F, U+1CD0-1CF9, U+200C-200D, U+20A8, U+25CC, U+A830-A839, U+A8E0-A8FF; }
@font-face { font-family: "Mukta Mahee"; src: url(fonts/mukta-mahee-400-gurmukhi.woff2) format("woff2"); font-weight: 400; font-display: swap; unicode-range: U+0A01-0A76, U+200C-200D, U+25CC; }
@font-face { font-family: "Mukta Mahee"; src: url(fonts/mukta-mahee-500-gurmukhi.woff2) format("woff2"); font-weight: 500 700; font-display: swap; unicode-range: U+0A01-0A76, U+200C-200D, U+25CC; }

/* ---------- tokens: day ---------- */
:root {
  --bg: #F6F0E4; --bg-deep: #EEE4D2; --paper: #FAF7F0;
  --ink: #261F19; --ink-2: #3A3229; --ink-3: #5F574B;
  --heading: #143D2C;
  --rule: #D3C5AE; --rule-strong: #BFAE91;
  --accent: #6F2631; --accent-strong: #4E1822;
  --green: #143D2C; --on-green: #FAF7F0;
  --choice: #143D2C; --choice-2: #1B4A36; --on-choice: #FAF7F0; --on-choice-2: #D9E4DA;
  --gold: #B69357; --gold-ink: #765822;
  --alert: #8E2B33; --alert-bg: #F7E3DC; --alert-rule: #E26C3C; --prompt-bg: #FBF0E2;
  --note-bg: #FFF4CC; --note-ink: #4A3A06; --note-rule: #C9A227;
  --focus: #143D2C; --focus-halo: #D9C190;
  --band-bg: #143D2C; --band-ink: #F2EADB; --band-ink-2: #C9C0AE; --band-accent: #E2C37F;
  --amber: 200 138 52; --sage: 98 146 120; --maroon: 122 31 43;
  --glass-rgb: 252 249 243; --glass-a: .9; --lg-rim: .9; --lg-gloss: .6; --shadow-rgb: 46 35 22;
  --tint: var(--sage);
  color-scheme: light;

  --f-display: "Cormorant", "Cormorant Garamond", "Iowan Old Style", Georgia, serif;
  --f-read: "Literata", "Mukta", "Mukta Mahee", "Iowan Old Style", Georgia, serif;
  --f-ui: "Mukta", "Mukta Mahee", "Segoe UI", system-ui, -apple-system, "Helvetica Neue", Arial, sans-serif;

  /* type: 390px values on the left of each clamp, 1280px on the right */
  --t-hub: clamp(2.625rem, 1.66rem + 3.95vw, 4.5rem);     /* 42 → 72 */
  --t-cond: clamp(2.25rem, 1.7rem + 2.25vw, 3.5rem);      /* 36 → 56 */
  --t-h2: clamp(1.75rem, 1.48rem + 1.12vw, 2.25rem);      /* 28 → 36 */
  --t-h3: clamp(1.2rem, 1.12rem + .3vw, 1.35rem);
  --t-read: clamp(1.125rem, 1.1rem + .11vw, 1.1875rem);   /* 18 → 19 */
  --t-faq: clamp(1.125rem, 1.07rem + .22vw, 1.25rem);     /* 18 → 20 */
  --t-tbl: clamp(1rem, .98rem + .07vw, 1.0625rem);        /* 16 → 17 */
  --t-eyebrow: clamp(.8125rem, .8rem + .06vw, .875rem);   /* 13 → 14 */
  --t-btn: clamp(1rem, .98rem + .07vw, 1.0625rem);        /* 16 → 17 */
  --t-s: .9375rem;
  --lh-read: 1.72;

  --gut: 18px; --gap-sec: 28px;
  --r-s: 10px; --r-m: 14px; --r-l: 16px; --r-xl: 22px; --r-pill: 999px;
  --ease: cubic-bezier(.22, .61, .36, 1);
  --w-page: 77.5rem; --w-read: 40rem; --w-rail: 13.5rem;
  --bar-h: 3.5rem;
}

/* ---------- tokens: night (system preference, unless the reader chose day) ---------- */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --bg: #08150F; --bg-deep: #0D1F17; --paper: #12291F;
    --ink: #F6F0E4; --ink-2: #ECE4D3; --ink-3: #C7BDAA; --heading: #EDE0C2;
    --rule: rgba(217, 193, 144, .18); --rule-strong: rgba(217, 193, 144, .34);
    --accent: #E8B3B9; --accent-strong: #F5CBD1;
    --green: #E8D9B2; --on-green: #0B2117;
    --choice: #12291F; --choice-2: #183526; --on-choice: #F6F0E4; --on-choice-2: #C7BDAA;
    --gold: #D9C190; --gold-ink: #D9C190;
    --alert: #F0B9BF; --alert-bg: #3A1A1F; --alert-rule: #E26C3C; --prompt-bg: #2A2116;
    --note-bg: #3A3110; --note-ink: #FBEBB5; --note-rule: #9C8226;
    --focus: #EFE6D4; --focus-halo: rgba(217, 193, 144, .55);
    --band-bg: #0C2B20; --band-ink: #ECE4D5; --band-ink-2: #B5AC9C;
    --glass-rgb: 17 31 25; --glass-a: .9; --lg-rim: .24; --lg-gloss: .12; --shadow-rgb: 0 0 0;
    color-scheme: dark;
  }
}
:root[data-theme="dark"] {
  --bg: #08150F; --bg-deep: #0D1F17; --paper: #12291F;
  --ink: #F6F0E4; --ink-2: #ECE4D3; --ink-3: #C7BDAA; --heading: #EDE0C2;
  --rule: rgba(217, 193, 144, .18); --rule-strong: rgba(217, 193, 144, .34);
  --accent: #E8B3B9; --accent-strong: #F5CBD1;
  --green: #E8D9B2; --on-green: #0B2117;
  --choice: #12291F; --choice-2: #183526; --on-choice: #F6F0E4; --on-choice-2: #C7BDAA;
  --gold: #D9C190; --gold-ink: #D9C190;
  --alert: #F0B9BF; --alert-bg: #3A1A1F; --alert-rule: #E26C3C; --prompt-bg: #2A2116;
  --note-bg: #3A3110; --note-ink: #FBEBB5; --note-rule: #9C8226;
  --focus: #EFE6D4; --focus-halo: rgba(217, 193, 144, .55);
  --band-bg: #0C2B20; --band-ink: #ECE4D5; --band-ink-2: #B5AC9C;
  --glass-rgb: 17 31 25; --glass-a: .9; --lg-rim: .24; --lg-gloss: .12; --shadow-rgb: 0 0 0;
  color-scheme: dark;
}
.hue--sage { --tint: var(--sage); } .hue--amber { --tint: var(--amber); } .hue--maroon { --tint: var(--maroon); }

/* ---------- base ---------- */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; background: var(--bg); scroll-padding-top: calc(var(--bar-h) + 1.25rem); }
/* jumps are instant: an animated scroll is movement the reader did not ask for, and slows the urgent jump */
body { margin: 0; min-height: 100vh; background: var(--bg); color: var(--ink); font: 400 1rem/1.55 var(--f-ui);
  -webkit-font-smoothing: antialiased; overflow-wrap: break-word; overflow-x: clip; }
body::before { /* the page's light: one soft hue pool behind the hero, never behind paragraphs */
  content: ""; position: absolute; inset: 0 0 auto; height: 46rem; z-index: 0; pointer-events: none;
  background: radial-gradient(60rem 30rem at 85% -6%, rgb(var(--tint) / .2), transparent 62%),
              radial-gradient(40rem 22rem at 0% 10%, rgb(var(--amber) / .1), transparent 60%); }
img { max-width: 100%; height: auto; display: block; }
a { color: var(--accent); text-decoration-thickness: 1px; text-underline-offset: .2em; }
a:hover { color: var(--accent-strong); text-decoration-thickness: 2px; }
:focus-visible { outline: 2px solid var(--focus); outline-offset: 2px; box-shadow: 0 0 0 5px var(--focus-halo); border-radius: 6px; }
h1, h2, h3 { color: var(--heading); text-wrap: balance; overflow-wrap: anywhere; }
p, li, dd, td, th { text-wrap: pretty; }
button { font: inherit; color: inherit; }
[hidden] { display: none !important; }
.sr-only { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; }
.i { width: 1.25em; height: 1.25em; flex: none; vertical-align: -.22em; }
.skip { position: absolute; left: var(--gut); top: -100px; z-index: 100; padding: .7rem 1rem; border-radius: var(--r-s);
  background: var(--ink); color: var(--paper); font-weight: 600; text-decoration: none; }
.skip:focus { top: 12px; color: var(--paper); }
.eyebrow { margin: 0; font: 600 var(--t-eyebrow)/1.3 var(--f-ui); letter-spacing: .12em; text-transform: uppercase; color: var(--gold-ink); }
:lang(hi), :lang(pa) { letter-spacing: 0 !important; text-transform: none !important; font-style: normal; line-height: 1.75; }
:lang(pa) { font-family: "Mukta Mahee", var(--f-ui); }
:lang(hi) { font-family: "Mukta", var(--f-ui); }

/* ---------- buttons ---------- */
.btn { display: inline-flex; align-items: center; justify-content: center; gap: .5rem; min-height: 2.9rem; padding: .7rem 1.25rem;
  border-radius: var(--r-pill); border: 1px solid transparent; font: 600 var(--t-btn)/1.15 var(--f-ui); text-decoration: none;
  cursor: pointer; transition: background-color .16s var(--ease), border-color .16s, box-shadow .16s; text-align: center; }
.btn--primary { background: var(--green); color: var(--on-green);
  box-shadow: inset 0 1px 0 rgb(255 255 255 / .22), 0 10px 22px -14px rgb(20 61 44 / .8); }
.btn--primary:hover { color: var(--on-green); background: color-mix(in srgb, var(--green) 86%, var(--ink)); text-decoration: none; }
.btn--primary:active { box-shadow: inset 0 2px 4px rgb(0 0 0 / .25); }
.btn--ghost { border-color: var(--rule-strong); color: var(--ink); background: transparent; }
.btn--ghost:hover { border-color: var(--ink-3); color: var(--ink); text-decoration: none; }
.btn--s { min-height: 2.75rem; padding: .5rem 1rem; font-size: .9375rem; }
.iconbtn { display: inline-flex; align-items: center; justify-content: center; gap: .4rem; min-width: 2.75rem; min-height: 2.75rem;
  padding: 0 .6rem; border-radius: var(--r-pill); border: 0; background: rgb(255 255 255 / calc(var(--lg-rim) * .4));
  color: var(--ink); cursor: pointer; text-decoration: none; font: 600 .9375rem/1 var(--f-ui); }
.iconbtn:hover { color: var(--ink); background: rgb(255 255 255 / calc(var(--lg-rim) * .7)); }
.switch { display: inline-flex; align-items: center; gap: .55rem; min-height: 2.75rem; padding: .3rem .9rem .3rem .35rem;
  border: 1px solid currentColor; border-radius: var(--r-pill); background: transparent; cursor: pointer; font: 600 .9375rem/1 var(--f-ui); }
.switch::before { content: ""; width: 2.2rem; height: 1.3rem; border-radius: var(--r-pill); flex: none;
  background: radial-gradient(circle at 30% 50%, currentColor .5rem, transparent .52rem), transparent; box-shadow: inset 0 0 0 1px currentColor; }
.switch[aria-pressed="true"]::before { background: radial-gradient(circle at 70% 50%, var(--bg) .5rem, transparent .52rem), currentColor; }

/* ---------- masthead: the one polished glass surface (static gradient; no blur because it is sticky) ---------- */
.mast { position: sticky; top: 0; z-index: 40; padding: 8px max(8px, env(safe-area-inset-right)) 0 max(8px, env(safe-area-inset-left)); }
.mast__bar { position: relative; max-width: var(--w-page); margin-inline: auto; display: flex; flex-wrap: wrap; align-items: center; gap: .35rem .5rem;
  min-height: var(--bar-h); padding: .35rem .4rem .35rem .8rem; border-radius: 1.15rem;
  background: linear-gradient(180deg, rgb(255 255 255 / calc(var(--lg-gloss) * .5)), rgb(255 255 255 / 0) 55%), rgb(var(--glass-rgb) / var(--glass-a));
  box-shadow: inset 0 1px 0 rgb(255 255 255 / var(--lg-rim)), inset 0 0 0 1px rgb(255 255 255 / calc(var(--lg-rim) * .3)),
    inset 0 -16px 24px -22px rgb(var(--tint) / .7), 0 1px 2px rgb(var(--shadow-rgb) / .08), 0 18px 40px -28px rgb(var(--shadow-rgb) / .55); }
.mast__bar::after { content: ""; position: absolute; inset: 0; border-radius: inherit; padding: 1px; pointer-events: none;
  background: conic-gradient(from 200deg, rgb(255 255 255 / var(--lg-rim)), rgb(255 255 255 / calc(var(--lg-rim) * .1)) 70deg,
    rgb(var(--amber) / .5) 120deg, rgb(255 255 255 / calc(var(--lg-rim) * .1)) 170deg, rgb(255 255 255 / calc(var(--lg-rim) * .7)) 230deg,
    rgb(var(--tint) / .5) 300deg, rgb(255 255 255 / var(--lg-rim)));
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); -webkit-mask-composite: xor;
  mask: linear-gradient(#000 0 0) content-box exclude, linear-gradient(#000 0 0); }
.mast__logo { display: inline-flex; padding: 3px 6px; margin-left: -6px; border-radius: 9px; flex: none; }
:root[data-theme="dark"] .mast__logo, .foot__brand img { background: #F6F0E4; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) .mast__logo { background: #F6F0E4; } }
.mast__logo img { height: 30px; width: auto; }
.mast__nav { display: none; }
.mast__tools { display: flex; flex-wrap: wrap; justify-content: flex-end; align-items: center; gap: .3rem; margin-left: auto; min-width: 0; }
@media (max-width: 25.9rem) { .menu-btn span { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); } .mast__logo img { height: 26px; } }
.mast__book, .mast .theme-btn { display: none; }
.chip-urgent { display: inline-flex; align-items: center; gap: .35rem; min-height: 2.75rem; padding: 0 .8rem; border-radius: var(--r-pill);
  background: var(--alert-bg); color: var(--alert); font: 600 .9375rem/1 var(--f-ui); text-decoration: none;
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--alert-rule) 55%, transparent); white-space: nowrap; }
.chip-urgent:hover { color: var(--alert); text-decoration: underline; }
.menu-btn span { font-size: .9375rem; }
.theme-btn .i-sun { display: none; }
:root[data-theme="dark"] .theme-btn .i-sun { display: block; } :root[data-theme="dark"] .theme-btn .i-moon { display: none; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) .theme-btn .i-sun { display: block; } :root:not([data-theme="light"]) .theme-btn .i-moon { display: none; } }

/* menu panel: glass, in normal flow under the bar; no scroll lock, no motion */
.menu { max-width: var(--w-page); margin: .4rem auto 0; border-radius: 1.15rem; padding: 1rem;
  background: rgb(var(--glass-rgb) / .97); box-shadow: inset 0 1px 0 rgb(255 255 255 / var(--lg-rim)), inset 0 0 0 1px var(--rule),
  0 30px 60px -30px rgb(var(--shadow-rgb) / .6); max-height: calc(100vh - var(--bar-h) - 2rem); overflow: auto; overscroll-behavior: contain; }
.no-js .menu:target { display: block !important; }
.menu__top { display: flex; align-items: center; justify-content: space-between; margin-bottom: .5rem; }
.hubpicks { list-style: none; margin: 0; padding: 0; display: grid; gap: .35rem; }
.hubpick { display: flex; align-items: center; gap: .75rem; min-height: 3rem; padding: .45rem .6rem; border-radius: var(--r-m);
  color: var(--ink); text-decoration: none; }
.hubpick:hover { background: rgb(var(--tint) / .12); color: var(--ink); }
.hubpick.is-current { background: rgb(var(--tint) / .16); }
.hubpick__i { display: grid; place-items: center; width: 2.25rem; height: 2.25rem; border-radius: 50%; flex: none; color: var(--heading);
  background: radial-gradient(circle at 35% 30%, rgb(255 255 255 / .7), rgb(var(--tint) / .35) 60%, rgb(var(--tint) / .55)); }
.hubpick__n { display: block; font: 600 1rem/1.25 var(--f-ui); }
.hubpick__l { display: block; font-size: .875rem; color: var(--ink-3); line-height: 1.35; }
.menu__routes { list-style: none; margin: .8rem 0 0; padding: .8rem 0 0; border-top: 1px solid var(--rule); display: grid; gap: .2rem; }
.menu__routes a:not(.btn) { display: flex; align-items: center; gap: .6rem; min-height: 2.75rem; padding: 0 .6rem; color: var(--ink);
  font-weight: 600; text-decoration: none; border-radius: var(--r-s); }
.menu__routes a:not(.btn):hover { background: rgb(var(--tint) / .12); }
.menu__routes .btn { width: 100%; margin-bottom: .3rem; }

/* ---------- review bar, marks and ledger (preview only; the public build refuses the page) ---------- */
.rvbar { position: relative; z-index: 1; max-width: var(--w-page); margin: .55rem auto 0; padding: .55rem var(--gut);
  display: flex; flex-wrap: wrap; align-items: center; gap: .4rem 1rem; font: .875rem/1.45 var(--f-ui); color: var(--note-ink); }
.rvbar p { margin: 0; flex: 1 1 18rem; padding: .5rem .8rem; border-radius: var(--r-s); background: var(--note-bg);
  border: 1px dashed var(--note-rule); }
.rvbar a { color: inherit; font-weight: 600; }
.rvbar .switch { color: var(--ink-2); font-size: .875rem; }
.rvbar code { font-size: .8125rem; }
.rv { font: 600 .8125rem/1.45 var(--f-ui); color: var(--note-ink); background: var(--note-bg); border: 1px dashed var(--note-rule);
  border-radius: 6px; padding: .02rem .35rem; box-decoration-break: clone; -webkit-box-decoration-break: clone; letter-spacing: 0; }
.rv__k { text-transform: uppercase; letter-spacing: .06em; font-size: .6875rem; margin-right: .2rem; }
.rv--a { background: color-mix(in srgb, var(--paper) 70%, rgb(var(--maroon) / .25)); border-color: color-mix(in srgb, var(--accent) 60%, transparent); color: var(--ink-2); }
.rv--dot { display: inline-grid; place-items: center; min-width: 1.15rem; height: 1.15rem; padding: 0 .2rem; font-size: .6875rem; vertical-align: .12em; border-radius: 50%; }
.rv--note { display: block; margin: .6rem 0 0; padding: .45rem .7rem; }
p.rv { display: block; }
.badge { display: inline-block; margin-left: .4rem; padding: .05rem .45rem; border-radius: var(--r-pill); font: 600 .6875rem/1.5 var(--f-ui);
  letter-spacing: .04em; text-transform: none; background: var(--note-bg); color: var(--note-ink); border: 1px dashed var(--note-rule); }
.pending { display: inline-flex; flex-wrap: wrap; align-items: baseline; gap: .1rem .4rem; }
.pending__v { border-bottom: 1px dashed var(--note-rule); }
.pending__k { font: 600 .6875rem/1.4 var(--f-ui); text-transform: uppercase; letter-spacing: .05em; color: var(--note-ink);
  background: var(--note-bg); padding: 0 .35rem; border-radius: 4px; }
.rv-off [data-rv], .rv-off .rv, .rv-off .pending__k { display: none !important; }
.rv-off .pending__v { border: 0; }
.ledger { max-width: var(--w-page); margin: 3rem auto 0; padding: 0 var(--gut); position: relative; z-index: 1; }
.ledger h2 { font: 600 var(--t-h2)/1.15 var(--f-display); margin: 0 0 .5rem; }
.ledger > p { max-width: 44rem; color: var(--ink-2); font: 1rem/1.6 var(--f-read); }
.tbl--ledger { font-size: .9375rem; }
.ledger { min-width: 0; max-width: 100%; overflow-x: auto; contain: inline-size; }   /* the private review ledger scrolls inside its own box and never widens the column it sits in (no sideways page scroll at 320 px or 200% text) */
.tbl--ledger td:first-child { white-space: nowrap; }

/* ---------- page layout ---------- */
.page { position: relative; z-index: 1; }
.crumbs ol { display: flex; flex-wrap: wrap; gap: .2rem .5rem; margin: 0; padding: 0; list-style: none; font: .9375rem/1.4 var(--f-ui); color: var(--ink-3); }
.crumbs li + li::before { content: "/"; margin-right: .5rem; color: var(--rule-strong); }
.crumbs a { color: var(--ink-2); text-decoration: none; }
.crumbs a:hover { text-decoration: underline; }
.hubmark { display: flex; align-items: center; gap: .55rem; margin: 1.1rem 0 .6rem; font: 600 .9375rem/1.3 var(--f-ui); color: var(--ink-2); }
.hubmark a { display: inline-flex; align-items: center; gap: .55rem; color: inherit; text-decoration: none; }
.hubmark a:hover span:last-child { text-decoration: underline; }
.hubmark__i { display: grid; place-items: center; width: 2.25rem; height: 2.25rem; border-radius: 50%; color: var(--heading);
  background: radial-gradient(circle at 35% 30%, rgb(255 255 255 / .75), rgb(var(--tint) / .35) 62%, rgb(var(--tint) / .6));
  box-shadow: inset 0 1px 0 rgb(255 255 255 / var(--lg-rim)), 0 0 0 1px rgb(var(--tint) / .35); }
.thread { display: block; width: 7.5rem; height: 2px; margin: .9rem 0 0; border-radius: 2px;
  background: linear-gradient(90deg, var(--gold), color-mix(in srgb, var(--gold) 20%, transparent)); }

.hero, .chero { max-width: var(--w-page); margin: 0 auto; padding: 1.25rem var(--gut) 0; display: grid; gap: 1.5rem; }
.hero h1, .chero h1 { margin: 0; font-family: var(--f-display); font-weight: 600; letter-spacing: -.01em; }
.hero h1 { font-size: var(--t-hub); line-height: 1.02; }
.hero h1 em { font-style: normal; color: var(--accent); }
.chero h1 { font-size: var(--t-cond); line-height: 1.06; }
.hero__h2 { margin: 1.3rem 0 .5rem; font: 600 var(--t-h3)/1.3 var(--f-ui); color: var(--ink-2); letter-spacing: 0; }
.hero p, .chero p { font: 400 var(--t-read)/var(--lh-read) var(--f-read); color: var(--ink); max-width: var(--w-read); }
.hero .crumbs, .chero .crumbs { margin-top: .2rem; }
.hero__go { margin-top: 1.25rem !important; }
.chero__line { margin: .9rem 0 0; color: var(--ink-2) !important; font-style: italic; }
.factline { display: inline-block; margin: .3rem 0 .4rem; padding: .55rem .9rem; border-radius: var(--r-m); background: var(--paper);
  box-shadow: inset 0 0 0 1px var(--rule); font: 600 1rem/1.55 var(--f-ui) !important; color: var(--ink-2) !important; }

/* art slot: vector placeholder for the commissioned still; desktop only so it never pushes the answer down */
.art { display: none; margin: 0; position: relative; border-radius: var(--r-xl); overflow: hidden; aspect-ratio: 3 / 2;
  background: linear-gradient(160deg, var(--paper), color-mix(in srgb, var(--paper) 70%, rgb(var(--tint) / .4)));
  box-shadow: inset 0 0 0 1px var(--rule), 0 30px 60px -40px rgb(var(--shadow-rgb) / .6); }
.art__fold { position: absolute; inset: 0; width: 100%; height: 100%; }
.art__cap { position: absolute; left: .7rem; right: .7rem; bottom: .7rem; padding: .5rem .7rem; border-radius: var(--r-s);
  font: .8125rem/1.45 var(--f-ui); color: var(--note-ink); background: var(--note-bg); border: 1px dashed var(--note-rule); }
.art__cap b { display: block; }

.layout { max-width: var(--w-page); margin: 0 auto; padding: 0 var(--gut); }
.flow { min-width: 0; }
.toc { margin: 1.5rem 0 0; }
.toc__d { border-radius: var(--r-m); background: var(--paper); box-shadow: inset 0 0 0 1px var(--rule); }
.toc summary { display: flex; align-items: center; gap: .55rem; min-height: 3rem; padding: 0 1rem; cursor: pointer; list-style: none;
  font: 600 1rem/1.2 var(--f-ui); color: var(--ink); }
.toc summary::-webkit-details-marker { display: none; }
.toc summary::after { content: ""; margin-left: auto; width: .55rem; height: .55rem; border-right: 2px solid var(--ink-3); border-bottom: 2px solid var(--ink-3);
  transform: rotate(45deg) translateY(-2px); }
.toc details[open] summary::after { transform: rotate(-135deg) translate(-2px, 0); }
.toc ol { margin: 0; padding: 0 1rem 1rem 2.4rem; display: grid; gap: .1rem; font: 1rem/1.4 var(--f-ui); }
.toc li::marker { color: var(--gold-ink); font-size: .875rem; }
.toc a { display: block; padding: .35rem 0; color: var(--ink-2); text-decoration: none; }
.toc a:hover, .toc a[aria-current="true"] { color: var(--accent); text-decoration: underline; }

/* ---------- sections: opaque paper reading ---------- */
.sec { margin-top: var(--gap-sec); padding-top: var(--gap-sec); border-top: 1px solid var(--rule); scroll-margin-top: calc(var(--bar-h) + 1rem); }
.sec > h2 { margin: 0 0 .9rem; font: 600 var(--t-h2)/1.12 var(--f-display); letter-spacing: -.005em; }
.sec h3 { margin: 1.6rem 0 .5rem; font: 600 var(--t-h3)/1.3 var(--f-ui); }
.flow p, .flow li { font: 400 var(--t-read)/var(--lh-read) var(--f-read); color: var(--ink); }
.flow p { margin: 0 0 1rem; max-width: var(--w-read); }
.flow ul, .flow ol { max-width: var(--w-read); margin: 0 0 1.1rem; padding-left: 1.3rem; }
.flow li { margin: .3rem 0; padding-left: .2rem; }
.flow ul > li::marker { color: var(--gold); content: "–  "; font-family: var(--f-ui); }
.flow ol:not(.journey):not(.seq):not(.toc__ol) { counter-reset: n; list-style: none; padding-left: 0; }
.flow ol:not(.journey):not(.seq):not(.toc__ol) > li { counter-increment: n; position: relative; padding-left: 2.6rem; margin: .7rem 0; }
.flow ol:not(.journey):not(.seq):not(.toc__ol) > li::before { content: counter(n); position: absolute; left: 0; top: .2rem; width: 1.8rem; height: 1.8rem;
  display: grid; place-items: center; border-radius: 50%; font: 600 .9375rem/1 var(--f-ui); color: var(--gold-ink);
  box-shadow: inset 0 0 0 1.5px var(--gold); }
.flow strong { font-weight: 650; color: var(--heading); }
.flow a.is-unbuilt { text-decoration-style: solid; }
sup.cite { font: 600 .72em/0 var(--f-ui); margin-left: .08em; }
sup.cite a { padding: 0 .12em; text-decoration: none; color: var(--gold-ink); }
sup.cite a:hover { text-decoration: underline; }

/* short answer: the one emphasised reading surface */
.answer { max-width: var(--w-read); margin: 1.1rem 0 1.25rem; padding: 1.05rem 1.2rem 1.1rem; border-radius: var(--r-l); background: var(--paper);
  box-shadow: inset 4px 0 0 var(--gold), inset 0 0 0 1px var(--rule), 0 18px 40px -34px rgb(var(--shadow-rgb) / .6); }
.answer__k { margin: 0 0 .25rem !important; font: 600 var(--t-eyebrow)/1.3 var(--f-ui) !important; letter-spacing: .12em; text-transform: uppercase; color: var(--gold-ink) !important; }
.answer p:last-child { margin: 0; }

/* tables: real tables on opaque paper, wrapping cells; scroll only if wrapping fails */
.tblwrap { max-width: 100%; margin: 1rem 0 1.25rem; border-radius: var(--r-m); background: var(--paper);
  box-shadow: inset 0 0 0 1px var(--rule); overflow-x: auto; }
.tblwrap.is-scroll { box-shadow: inset 0 0 0 1px var(--rule), inset -18px 0 14px -14px rgb(var(--shadow-rgb) / .35); }
.tbl { width: 100%; border-collapse: collapse; font: 400 var(--t-tbl)/1.55 var(--f-read); color: var(--ink); }
.tbl th, .tbl td { padding: .7rem .8rem; text-align: left; vertical-align: top; border-bottom: 1px solid var(--rule); }
.tbl tr:last-child > * { border-bottom: 0; }
.tbl thead th { font: 600 .875rem/1.35 var(--f-ui); letter-spacing: .03em; color: var(--ink-2); background: color-mix(in srgb, var(--paper) 82%, rgb(var(--tint) / .35)); }
.tbl tbody th { font-weight: 600; }
.tbl--compare td:first-child { border-right: 1px solid var(--rule); }
.tbl--compare thead th:first-child { color: var(--heading); }
.tbl--triage td:nth-child(2) { font-weight: 600; color: var(--heading); }
.tbl--triage td:last-child a { font-family: var(--f-ui); font-weight: 600; }

/* urgent signs: its own surface, explicit heading and icon; never collapsed; no booking button inside */
.urgent { position: relative; max-width: var(--w-read); margin: 1.4rem 0 1.4rem; padding: 1.1rem 1.15rem .4rem; border-radius: var(--r-l);
  background: var(--alert-bg); box-shadow: inset 4px 0 0 var(--alert-rule), inset 0 0 0 1px color-mix(in srgb, var(--alert-rule) 40%, transparent); }
.urgent__h { display: flex; align-items: center; gap: .5rem; margin: 0 0 .5rem !important; font: 700 1.25rem/1.25 var(--f-ui) !important; color: var(--alert) !important;
  scroll-margin-top: calc(var(--bar-h) + 1.25rem); }
.urgent__h .i { width: 1.4rem; height: 1.4rem; color: var(--alert-rule); }
.urgent__h:focus { outline: none; }
.urgent__h:focus-visible { outline: 2px solid var(--focus); }
.urgent p, .urgent li { color: var(--ink) !important; }
.urgent strong { color: var(--alert) !important; }
.urgent ul > li::marker { color: var(--alert-rule); content: "●  "; font-size: .7em; }
.urgent__tier--prompt { margin: .4rem -1.15rem 0; padding: .9rem 1.15rem .3rem; background: var(--prompt-bg); border-top: 1px solid color-mix(in srgb, var(--alert-rule) 30%, transparent); }
.urgent__tier--prompt strong { color: var(--heading) !important; }
.urgent__tier--prompt ul > li::marker { color: var(--gold); content: "–  "; font-size: 1em; }
.urgent__tier--prompt:last-of-type { border-radius: 0 0 var(--r-l) var(--r-l); }
.urgent__back { margin: .2rem 0 .8rem !important; }
.urgent__back a { display: inline-flex; align-items: center; gap: .4rem; min-height: 2.75rem; font: 600 .9375rem/1 var(--f-ui); color: var(--alert); }
.urgent:target, .urgent:has(:target) { animation: none; }

/* concern routes: matte forest choices (day) / deep green (night), whole row is the link */
.routes { list-style: none; margin: 1.1rem 0 .4rem; padding: 0; display: grid; gap: .6rem; max-width: none; }
.routes li { margin: 0 !important; padding: 0 !important; }
.routes li::marker { content: none; }
.route { display: grid; grid-template-columns: 2.6rem minmax(0, 1fr) 1.5rem; align-items: center; gap: .9rem; min-height: 4.5rem;
  padding: .9rem 1rem; border-radius: var(--r-l); text-decoration: none; color: var(--on-choice);
  background-color: var(--choice); background-image: linear-gradient(180deg, var(--choice-2), var(--choice));
  box-shadow: inset 0 1px 0 rgb(255 255 255 / .14), inset 0 0 0 1px rgb(var(--tint) / .35), 0 14px 30px -24px rgb(var(--shadow-rgb) / .9);
  transition: transform .14s var(--ease), box-shadow .14s var(--ease); }
.route:hover { color: var(--on-choice); text-decoration: none; box-shadow: inset 0 1px 0 rgb(255 255 255 / .18), inset 0 0 0 1px var(--gold), 0 16px 34px -24px rgb(var(--shadow-rgb) / .9); }
.route:active { transform: translateY(1px); box-shadow: inset 0 2px 6px rgb(0 0 0 / .35), inset 0 0 0 1px var(--gold); }
.route__icon { display: grid; place-items: center; width: 2.6rem; height: 2.6rem; border-radius: 50%; color: #F2E6C9;
  background: radial-gradient(circle at 35% 30%, rgb(255 255 255 / .25), rgb(var(--tint) / .55) 60%, rgb(var(--tint) / .8)); }
.route__icon .i { width: 1.45rem; height: 1.45rem; }
.route__name { display: block; font: 600 1.375rem/1.15 var(--f-display); color: var(--on-choice); }
.route__line { display: block; margin-top: .2rem; font: 400 .9375rem/1.45 var(--f-ui); color: var(--on-choice-2); }
.route__go { color: var(--gold); }
.route__go .i { width: 1.3rem; height: 1.3rem; }

/* journey: four numbered steps on a gold wire (vertical on phones) */
.journey { list-style: none; padding: 0 !important; margin: 1.2rem 0 1.4rem !important; display: grid; gap: 0; max-width: var(--w-read); position: relative; }
.journey::before { content: ""; position: absolute; left: 1.05rem; top: 1rem; bottom: 1rem; width: 2px; background: var(--gold); opacity: .55; }
.journey li { position: relative; display: grid; grid-template-columns: 2.1rem minmax(0, 1fr); gap: .9rem; padding: .2rem 0 1rem !important; margin: 0 !important; }
.journey li::marker { content: none; }
.journey__n { position: relative; z-index: 1; display: grid; place-items: center; width: 2.1rem; height: 2.1rem; border-radius: 50%;
  background: var(--paper); box-shadow: inset 0 0 0 1.5px var(--gold); font: 600 1rem/1 var(--f-ui); color: var(--gold-ink); }
.journey__t { margin: .15rem 0 .2rem !important; font: 600 1.0625rem/1.35 var(--f-ui) !important; color: var(--heading) !important; }
.journey p:last-child { margin: 0; }

/* trust and offer: doctor, review state, fee: separate lines, one continuous gold edge */
.trustrun { margin-top: var(--gap-sec); padding: 0 0 0 1.1rem; border-left: 2px solid var(--gold); }
.trustrun > .sec:first-child { margin-top: 0; border-top: 0; }
.trustrun > .sec + .sec { border-top: 1px dashed var(--rule); }
.doctor { display: flex; flex-wrap: wrap; gap: 1rem; align-items: flex-start; max-width: var(--w-read); margin: .4rem 0 1rem;
  padding: 1rem; border-radius: var(--r-l); background: var(--paper); box-shadow: inset 0 0 0 1px var(--rule); }
.doctor .slot--portrait { flex: 0 0 6.5rem; }
.doctor__id { flex: 1 1 11rem; min-width: 0; }
.doctor__name { margin: .15rem 0 .35rem !important; font: 600 1.6rem/1.1 var(--f-display) !important; color: var(--heading) !important; }
.doctor__cred { margin: 0 0 .25rem !important; font: 400 .9375rem/1.5 var(--f-ui) !important; color: var(--ink-2) !important; }
.doctor__more { margin: .5rem 0 0 !important; font: 600 .9375rem/1.4 var(--f-ui) !important; }
.doctor__more a { display: inline-flex; align-items: center; gap: .3rem; min-height: 2.75rem; }
.slot { margin: 0; display: grid; place-items: center; text-align: center; gap: .3rem; padding: .5rem; border-radius: var(--r-m);
  border: 1px dashed var(--note-rule); background: repeating-linear-gradient(135deg, transparent 0 8px, rgb(var(--tint) / .07) 8px 16px), var(--paper);
  color: var(--note-ink); font: .75rem/1.35 var(--f-ui); }
.slot--portrait { aspect-ratio: 4 / 5; }
.slot b { display: block; font-size: .75rem; }
.slot__mark { color: var(--gold-ink); }
.reviewline { display: flex; gap: .7rem; align-items: flex-start; max-width: var(--w-read); margin: .2rem 0 1rem; padding: .75rem .9rem;
  border-radius: var(--r-m); background: var(--paper); box-shadow: inset 0 0 0 1px var(--rule); }
.reviewline p { margin: 0 !important; font: 400 .9375rem/1.5 var(--f-ui) !important; color: var(--ink-2) !important; }
.reviewline b { color: var(--ink); }
.reviewline__dot { flex: none; width: .75rem; height: .75rem; margin-top: .38rem; border-radius: 50%; border: 2px solid var(--gold); background: transparent; }
.reviewline__rev { color: var(--ink-3); }
/* a recorded approval for this exact text (integration/review_line.py): a filled dot instead of the open "pending" ring */
.reviewline--done .reviewline__dot { background: var(--gold); }
.fee { max-width: var(--w-read); margin: 1.2rem 0 1rem; padding: 1.15rem 1.15rem 1.2rem; border-radius: var(--r-xl); background: var(--paper);
  box-shadow: inset 0 1px 0 rgb(255 255 255 / var(--lg-rim)), inset 0 0 0 1px var(--rule-strong), 0 24px 50px -38px rgb(var(--shadow-rgb) / .7); display: grid; grid-template-columns: minmax(0, 1fr); gap: 1rem; }
.fee__price { display: flex; flex-wrap: wrap; align-items: baseline; gap: .2rem .8rem; margin: .35rem 0 .3rem !important; }
.fee__amt { font: 600 2.75rem/1 var(--f-display); color: var(--heading); }
.fee__what { font: 600 1rem/1.4 var(--f-ui); color: var(--ink-2); }
.fee__inc { display: flex; gap: .5rem; margin: 0 !important; font: 400 1rem/1.5 var(--f-ui) !important; color: var(--ink-2) !important; }
.fee__inc .i { color: var(--gold-ink); margin-top: .1rem; }
.seq { list-style: none; margin: .5rem 0 0 !important; padding: 0 !important; display: grid; gap: .1rem; counter-reset: s; }
.seq li { counter-increment: s; display: flex; align-items: baseline; gap: .6rem; margin: 0 !important; padding: .3rem 0 !important;
  font: 400 1rem/1.45 var(--f-ui) !important; color: var(--ink-2) !important; }
.seq li::before { content: counter(s); flex: none; display: inline-grid; place-items: center; width: 1.5rem; height: 1.5rem; border-radius: 50%;
  font: 600 .8125rem/1 var(--f-ui); color: var(--gold-ink); box-shadow: inset 0 0 0 1.25px var(--gold); }
.seq li.is-pay { color: var(--ink) !important; font-weight: 600 !important; }
.fee__act { margin: 0 !important; }
.fee__act .btn { width: 100%; }

/* deeper reading card */
.curio { display: grid; grid-template-columns: 2.6rem minmax(0, 1fr) 1.4rem; align-items: center; gap: .9rem; max-width: var(--w-read);
  margin: 1.2rem 0; padding: 1rem 1.1rem; border-radius: var(--r-l); background: var(--paper);
  box-shadow: inset 0 0 0 1px var(--rule), inset 0 -18px 30px -26px rgb(var(--tint) / .6); position: relative; }
.curio__mark { display: grid; place-items: center; width: 2.6rem; height: 2.6rem; border-radius: 50%; color: var(--heading);
  background: radial-gradient(circle at 35% 30%, rgb(255 255 255 / .7), rgb(var(--tint) / .3) 62%, rgb(var(--tint) / .5)); }
.curio .eyebrow { margin: 0 0 .25rem !important; }
.curio__t { margin: 0 !important; font: 600 1.125rem/1.4 var(--f-read) !important; }
.curio__t a { color: var(--heading); text-decoration: none; }
.curio__t a::after { content: ""; position: absolute; inset: 0; border-radius: inherit; }
.curio:hover { box-shadow: inset 0 0 0 1px var(--gold), inset 0 -18px 30px -26px rgb(var(--tint) / .7); }
.curio:focus-within { outline: 2px solid var(--focus); outline-offset: 2px; }
.curio__go { color: var(--gold-ink); }

/* words people use: an h3, then a disclosure (collapsed on phones, opened on wide screens by script) */
.words { max-width: var(--w-read); margin: .2rem 0 1.4rem; border-radius: var(--r-m); background: var(--paper); box-shadow: inset 0 0 0 1px var(--rule); }
.words > summary { display: flex; align-items: center; justify-content: space-between; gap: 1rem; min-height: 3rem; padding: .5rem 1rem;
  cursor: pointer; list-style: none; font: 600 1rem/1.3 var(--f-ui); color: var(--accent); }
.words > summary::-webkit-details-marker { display: none; }
.words > summary::after { content: "+"; font-size: 1.4rem; line-height: 1; color: var(--gold-ink); }
.words[open] > summary::after { content: "–"; }
.words .words__close, .words[open] .words__open { display: none; }
.words[open] .words__close { display: inline; }
.words__body { padding: 0 1rem .6rem; }
.words__body > p, .words__body li { font-size: 1.0625rem !important; }
.words__body ul { padding-left: 0 !important; list-style: none; }
.words__body ul > li { padding: .55rem 0 .55rem !important; border-top: 1px solid var(--rule); }
.words__body ul > li::marker { content: none; }
.words__body ul > li > strong:first-child { display: block; margin-bottom: .15rem; }
.tbl--words th[scope="row"] { white-space: normal; font-family: var(--f-ui); font-size: 1.0625rem; }

/* FAQ: question always visible, its first sentence always visible, the rest one click away (still in the HTML) */
.qa { max-width: var(--w-read); margin: 0; padding: 1rem 0 .4rem; border-top: 1px solid var(--rule); scroll-margin-top: calc(var(--bar-h) + 1rem); }
.qa:first-of-type { border-top: 0; }
.qa__q { margin: 0 0 .35rem !important; font: 600 var(--t-faq)/1.35 var(--f-read) !important; }
.qa__q a { color: var(--heading); text-decoration: none; }
.qa__q a:hover { text-decoration: underline; color: var(--accent); }
.qa__lead p { margin-bottom: .4rem; }
.qa__more > summary { display: inline-flex; align-items: center; gap: .4rem; min-height: 2.75rem; cursor: pointer; list-style: none;
  font: 600 .9375rem/1 var(--f-ui); color: var(--accent); }
.qa__more > summary::-webkit-details-marker { display: none; }
.qa__more > summary::after { content: ""; width: .5rem; height: .5rem; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor;
  transform: rotate(45deg) translateY(-2px); margin-left: .15rem; }
.qa__more[open] > summary::after { transform: rotate(-135deg) translate(-2px, 0); }
.qa__more[open] > summary span::after { content: " (shown)"; font-weight: 400; color: var(--ink-3); }
.qa__body { padding: .2rem 0 .4rem; }
.qa:target .qa__q a { color: var(--accent); }

/* sources */
.sources { max-width: var(--w-read); margin-top: 1.5rem; padding: 1rem 1.1rem .4rem; border-radius: var(--r-m); background: var(--paper); box-shadow: inset 0 0 0 1px var(--rule); }
.sources h3 { margin: 0 0 .5rem !important; }
.sources ol { padding-left: 1.6rem !important; list-style: decimal !important; }
.sources li { font: 400 .9875rem/1.6 var(--f-read) !important; color: var(--ink-2) !important; padding-left: 0 !important; scroll-margin-top: calc(var(--bar-h) + 1rem); }
.sources li::before { display: none !important; }
.sources li::marker { color: var(--gold-ink); font: 600 .875rem var(--f-ui); }
.sources li:target { background: color-mix(in srgb, var(--paper) 70%, var(--note-bg)); border-radius: 6px; }
.src__back { display: inline-flex; vertical-align: middle; min-width: 2rem; min-height: 2rem; align-items: center; justify-content: center; color: var(--gold-ink); }
.disclaimer { margin-top: 1.4rem !important; font: 400 .9375rem/1.55 var(--f-ui) !important; color: var(--ink-3) !important; }
blockquote { margin: 1rem 0; padding-left: 1rem; border-left: 2px solid var(--gold); }

/* ---------- footer ---------- */
.foot { position: relative; z-index: 1; margin-top: 4rem; padding: 2.5rem var(--gut) 2rem; background: var(--band-bg); color: var(--band-ink); }
.foot::before { content: ""; position: absolute; inset: 0 0 auto; height: 2px; background: linear-gradient(90deg, transparent, var(--band-accent) 20%, var(--band-accent) 80%, transparent); opacity: .8; }
.foot__in { max-width: var(--w-page); margin: 0 auto; display: grid; gap: 2rem; }
.foot__brand img { height: 34px; width: auto; padding: 3px 6px; border-radius: 8px; }
.foot__brand p { max-width: 30rem; margin: .8rem 0 0; font: 1rem/1.6 var(--f-read); color: var(--band-ink-2); }
.foot__cols { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(14rem, 100%), 1fr)); gap: 1.8rem; }
.foot__h { margin: 0 0 .5rem; font: 600 .8125rem/1.3 var(--f-ui); letter-spacing: .12em; text-transform: uppercase; color: var(--band-accent); }
.foot ul { list-style: none; margin: 0; padding: 0; display: grid; }
.foot a { display: inline-flex; align-items: center; min-height: 2.5rem; color: var(--band-ink); text-decoration: none; font: 1rem/1.3 var(--f-ui); }
.foot a:hover { text-decoration: underline; color: #fff; }
.foot__facts { margin: .8rem 0 0; display: grid; gap: .6rem; font: .9375rem/1.5 var(--f-ui); }
.foot__facts dt { color: var(--band-ink-2); font-size: .8125rem; }
.foot__facts dd { margin: 0; }
.foot .pending__k { background: rgb(255 244 204 / .14); color: #F7E6A8; }
.foot .pending__v { border-color: rgb(247 230 168 / .5); }
.foot__prefs { display: flex; flex-wrap: wrap; gap: .6rem; padding-top: 1rem; border-top: 1px solid rgb(226 195 127 / .25); }
.foot .switch { color: var(--band-ink); }
.foot .switch[aria-pressed="true"]::before { background: radial-gradient(circle at 70% 50%, var(--band-bg) .5rem, transparent .52rem), currentColor; }
:focus-visible:is(.foot *) { outline-color: #F2EADB; }

/* stub pages (unbuilt destinations) */
.stub { max-width: 40rem; margin: 3rem auto 0; padding: 2rem var(--gut); }
.stub h1 { font: 600 var(--t-cond)/1.08 var(--f-display); margin: .4rem 0 1rem; }
.stub p { font: 1.0625rem/1.65 var(--f-read); color: var(--ink-2); }
.stub__acts { display: flex; flex-wrap: wrap; gap: .6rem; margin-top: 1.5rem; }

/* ---------- wide screens ---------- */
@media (min-width: 48rem) {
  :root { --gut: 32px; --gap-sec: 40px; }
  .routes { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .menu { position: absolute; left: 0; right: 0; width: min(46rem, calc(100% - 16px)); margin: .4rem auto 0; }
  .hubpicks { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .menu__routes { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .menu__routes li:first-child { grid-column: 1 / -1; }
}
@media (min-width: 64rem) {
  :root { --gap-sec: 48px; }
  .mast__nav { display: flex; gap: .1rem; margin-left: 1rem; }
  .mast__nav a { padding: .55rem .8rem; border-radius: var(--r-pill); color: var(--ink-2); font: 600 .9375rem/1 var(--f-ui); text-decoration: none; }
  .mast__nav a:hover, .mast__nav a[aria-expanded="true"] { color: var(--ink); background: rgb(255 255 255 / calc(var(--lg-rim) * .6)); }
  .mast__book, .mast .theme-btn { display: inline-flex; }
  .menu-btn { display: none !important; }
  .menu__routes { display: none; }
  .hero { grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr); align-items: center; padding-top: 2.5rem; gap: 3rem; }
  .chero { grid-template-columns: minmax(0, 1fr) 15rem; align-items: end; padding-top: 2.25rem; padding-left: calc(var(--gut) + var(--w-rail) + 3rem); }
  .chero .art { aspect-ratio: 3 / 2; }
  .art { display: block; }
  .layout { display: grid; grid-template-columns: var(--w-rail) minmax(0, 1fr); gap: 3rem; align-items: start; margin-top: 2.5rem; }
  .toc { position: sticky; top: calc(var(--bar-h) + 1.5rem); margin: 0; }
  .toc__d { background: transparent; box-shadow: none; }
  .toc summary { padding: 0; min-height: 2rem; pointer-events: none; font-size: .8125rem; letter-spacing: .12em; text-transform: uppercase; color: var(--gold-ink); }
  .toc summary::after { display: none; }
  .toc ol { padding: .4rem 0 0 1.2rem; font-size: .9375rem; border-left: 1px solid var(--rule); }
  .flow > .sec:first-child, .flow > .trustrun:first-child { margin-top: 0; border-top: 0; padding-top: 0; }
  .journey { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1.2rem; max-width: none; }
  .journey::before { left: 1rem; right: 1rem; top: 1.05rem; bottom: auto; width: auto; height: 2px; transform-origin: left; }
  .journey li { grid-template-columns: 1fr; gap: .7rem; }
  html.js:not(.motion-off) .journey:not(.is-drawn)::before { transform: scaleX(0); }
  html.js:not(.motion-off) .journey::before { transition: transform .32s var(--ease); }
  .fee { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: start; }
  .fee__act { grid-column: 1 / -1; }
  .fee__act .btn { width: auto; }
  .doctor .slot--portrait { flex-basis: 8.5rem; }
  .foot__in { grid-template-columns: 16rem minmax(0, 1fr); }
  .foot__prefs { grid-column: 1 / -1; }
}

/* ---------- preferences and fallbacks ---------- */
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { transition: none !important; animation: none !important; } }
html.motion-off *, html.motion-off *::before, html.motion-off *::after { transition: none !important; animation: none !important; }
@media (prefers-reduced-transparency: reduce) { .mast__bar, .menu { background: var(--paper); } .mast__bar::after { display: none; } }
@media (forced-colors: active) {
  .mast__bar, .menu, .route, .fee, .doctor, .answer, .urgent, .tblwrap, .curio, .words, .sources, .reviewline, .toc__d { border: 1px solid CanvasText; }
  .route { forced-color-adjust: auto; }
  .rv, .pending__k, .badge { border: 1px dashed CanvasText; }
  .chip-urgent { border: 2px solid CanvasText; }
  .thread, .journey::before { background: CanvasText; }
}
@media print {
  .mast, .rvbar, .toc, .foot, .ledger, .art, .chip-urgent { display: none !important; }
  details > *:not(summary) { display: block !important; }
  body::before { display: none; }
}

/* ---------- component widths win over the reading-column list rules ---------- */
.flow .routes { max-width: none; padding-left: 0; }
.flow ul:not(.routes) > li::marker { color: var(--gold); content: "–  "; font-family: var(--f-ui); }
.flow .routes > li::marker, .flow ul > li.no-mark::marker { content: none; }
.flow .journey { padding-left: 0; }
.journey li { align-content: start; }
.urgent ul > li::marker { color: var(--alert-rule) !important; content: "●  " !important; font-size: .7em; }
.urgent__tier--prompt ul > li::marker { color: var(--gold) !important; content: "–  " !important; font-size: 1em; }
.words__body ul > li::marker { content: none !important; }
@media (min-width: 64rem) {
  .flow .journey { max-width: none; }
  .journey p { font: 400 1rem/1.6 var(--f-read) !important; }
  .hero { align-items: start; }
  .hero .art { margin-top: 4.5rem; }
}
@media (max-width: 47.9rem) {
  .rvbar { flex-wrap: nowrap; align-items: flex-start; gap: .5rem; font-size: .8125rem; }
  .rvbar p { padding: .45rem .6rem; }
  .rvbar .switch { padding: .25rem .5rem .25rem .3rem; font-size: .8125rem; white-space: nowrap; }
  .rvbar .switch::before { width: 1.8rem; height: 1.1rem; }
}

/* ---------- second pass ---------- */
.flow .eyebrow, .fee .eyebrow, .doctor .eyebrow, .curio .eyebrow { font: 600 var(--t-eyebrow)/1.3 var(--f-ui) !important; letter-spacing: .12em; text-transform: uppercase; color: var(--gold-ink) !important; margin: 0; }
.answer__k { display: inline; margin: 0 .2rem 0 0 !important; font: 600 var(--t-eyebrow)/1 var(--f-ui) !important; letter-spacing: .1em; text-transform: uppercase; color: var(--gold-ink) !important; }
.answer p { margin: 0 !important; }
.rv__k { white-space: nowrap; }
/* pending-fact labels may wrap, so a narrow column or large text never pushes the page sideways */
.rv__k { white-space: normal; }
.urgent__tier--prompt { box-shadow: inset 4px 0 0 var(--gold); }
.hero__go { margin: 1.1rem 0 .2rem !important; }
.flow > .toc { margin: var(--gap-sec) 0 0; }
@media (max-width: 47.9rem) {
  .rvbar { flex-wrap: wrap; }
  .rvbar p { flex: 1 1 14rem; }
}
@media (min-width: 64rem) {
  /* the contents list becomes a sticky rail: .flow dissolves into the grid so the rail can span every row */
  .layout { grid-template-columns: var(--w-rail) minmax(0, 1fr); }
  .flow { display: contents; }
  .flow > * { grid-column: 2; min-width: 0; }
  .flow > .toc { grid-column: 1; grid-row: 1 / span 40; align-self: start; position: sticky; top: calc(var(--bar-h) + 1.5rem); margin: 0; }
  .flow > .sec:first-child { margin-top: 0; border-top: 0; padding-top: 0; }
  .chero { grid-template-columns: minmax(0, 1fr) 17rem; align-items: start; }
  .chero .art { margin-top: 3.2rem; }
}
.toc .toc__ol { max-width: none; margin: 0; padding: 0 1rem 1rem 2.4rem; list-style: decimal; }
.toc .toc__ol li { margin: 0; padding: 0; font: 400 1rem/1.4 var(--f-ui); color: var(--ink-2); }
.toc .toc__ol li::marker { color: var(--gold-ink); font: 600 .875rem var(--f-ui); content: counter(list-item) ".  "; }
@media (min-width: 64rem) {
  .toc .toc__ol { padding: .4rem 0 0 1.4rem; border-left: 1px solid var(--rule); }
  .toc .toc__ol li { font-size: .9375rem; }
  .chero .art__cap { font-size: .75rem; padding: .35rem .5rem; }
}

/* =====================================================================================================================
   ROUND 2 · five pilot pages and the universal menu (6 Nov). Later rules win over the round-1 rules above.
   ===================================================================================================================== */

/* ---------- wordmark (text only until the 1965 mark, F4, is confirmed) ---------- */
.mark { display: inline-flex; flex-direction: column; justify-content: center; min-height: 2.75rem; padding: 0 .2rem; margin-right: .2rem;
  color: var(--heading); text-decoration: none; line-height: 1; flex: none; }
.mark:hover { color: var(--heading); text-decoration: none; }
.mark__n { font: 600 1.45rem/1 var(--f-display); letter-spacing: -.005em; }
.mark__s { margin-top: .18rem; font: 600 .6875rem/1 var(--f-ui); letter-spacing: .26em; text-transform: uppercase; color: var(--gold-ink); }
.mark--foot { margin: 0; color: var(--band-ink); }
.mark--foot .mark__s { color: var(--band-accent); }
/* brand lockup (owner, 8 Nov 2026): the logo itself on the glass bar, no chip; day artwork on light glass, night artwork on dark glass.
   30 px tall on phones (26 px under 360), 40 px on desktop; the footer band is always dark, so it carries the night artwork. */
.mark--logo { flex-direction: row; align-items: center; padding: 0; margin-right: .4rem; }
.mark--logo .lg, .mark--foot .lg { display: block; height: 30px; width: auto; max-width: none; }
.mark--logo .lg--n { display: none; }
:root[data-theme="dark"] .mark--logo .lg--d { display: none; } :root[data-theme="dark"] .mark--logo .lg--n { display: block; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) .mark--logo .lg--d { display: none; } :root:not([data-theme="light"]) .mark--logo .lg--n { display: block; } }
.mark--foot .lg { height: 40px; }
@media (max-width: 22.4rem) { .mark--logo .lg { height: 26px; } }
@media (min-width: 64rem) { .mark--logo .lg { height: 40px; } }
.mast__here { font: 600 .9375rem/1.2 var(--f-ui); color: var(--ink-2); }
@media (max-width: 25.9rem) { .mark__n { font-size: 1.3rem; } .mast__here { display: none; } }

/* ---------- desktop navigation: details-based dropdowns (work without script) ---------- */
.dd { position: relative; }
.dd > summary { list-style: none; cursor: pointer; display: inline-flex; align-items: center; gap: .35rem; min-height: 2.75rem;
  padding: 0 .8rem; border-radius: var(--r-pill); color: var(--ink-2); font: 600 .9375rem/1 var(--f-ui); }
.dd > summary::-webkit-details-marker { display: none; }
.dd:not(.dd--appear) > summary::after { content: ""; width: .42rem; height: .42rem; border-right: 1.6px solid currentColor; border-bottom: 1.6px solid currentColor;
  transform: rotate(45deg) translateY(-2px); margin-left: .1rem; }
.dd[open] > summary, .dd > summary:hover { color: var(--ink); background: rgb(255 255 255 / calc(var(--lg-rim) * .6)); }
.dd__panel { position: absolute; top: calc(100% + .5rem); left: 0; z-index: 50; min-width: 17rem; padding: .7rem; border-radius: var(--r-l);
  background: rgb(var(--glass-rgb) / .98); box-shadow: inset 0 1px 0 rgb(255 255 255 / var(--lg-rim)), inset 0 0 0 1px var(--rule),
  0 30px 60px -30px rgb(var(--shadow-rgb) / .6); }
.dd__panel--care { width: 38rem; }
.dd__panel--care .hubpicks { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.dd__panel--right { left: auto; right: 0; min-width: 19rem; }
.dd__list { list-style: none; margin: 0; padding: 0; display: grid; gap: .2rem; }
.dd__list a { display: grid; gap: .1rem; padding: .6rem .7rem; border-radius: var(--r-m); color: var(--ink); text-decoration: none; }
.dd__list a:hover { background: rgb(var(--tint) / .12); }
.dd__list b { font: 600 1rem/1.2 var(--f-ui); }
.dd__list span { font: .875rem/1.35 var(--f-ui); color: var(--ink-3); }
html.js .dd__panel { animation: fadein .14s var(--ease); }
@keyframes fadein { from { opacity: 0; } to { opacity: 1; } }
.mast .dd--appear { display: none; }
.dd--appear > summary { padding: 0; width: 2.75rem; justify-content: center; }

/* ---------- appearance control: same everywhere ---------- */
.appear { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; }
.appear__theme { display: inline-flex; padding: 3px; border-radius: var(--r-pill); box-shadow: inset 0 0 0 1px var(--rule-strong); }
.seg { display: inline-flex; align-items: center; gap: .3rem; min-height: 2.5rem; padding: 0 .8rem; border: 0; border-radius: var(--r-pill);
  background: transparent; color: var(--ink-2); font: 600 .9375rem/1 var(--f-ui); cursor: pointer; }
.seg .i { width: 1.05em; height: 1.05em; }
.seg[aria-pressed="true"] { background: var(--green); color: var(--on-green); }
.appear .switch { color: var(--ink-2); }
.foot .appear .seg { color: var(--band-ink); }
.foot .appear__theme { box-shadow: inset 0 0 0 1px rgb(226 195 127 / .4); }
.foot .appear .seg[aria-pressed="true"] { background: var(--band-ink); color: var(--band-bg); }
.foot .appear .switch { color: var(--band-ink); }

/* ---------- mobile menu: consultation answers first ---------- */
.menu__first { list-style: none; margin: 0 0 .6rem; padding: 0; display: grid; gap: .35rem; }
.menu__first .btn { width: 100%; min-height: 3.1rem; font-size: 1.0625rem; }
.menu__big { display: flex; align-items: center; gap: .7rem; min-height: 3.1rem; padding: 0 .9rem; border-radius: var(--r-m);
  color: var(--ink); background: var(--paper); box-shadow: inset 0 0 0 1px var(--rule); font: 600 1.0625rem/1.2 var(--f-ui); text-decoration: none; }
.menu__big:hover { color: var(--ink); box-shadow: inset 0 0 0 1px var(--gold); }
.menu__care { margin: .2rem 0; border-top: 1px solid var(--rule); border-bottom: 1px solid var(--rule); }
.menu__care > summary { list-style: none; cursor: pointer; display: flex; justify-content: space-between; align-items: center; min-height: 3rem;
  padding: 0 .6rem; font: 600 1.0625rem/1 var(--f-ui); color: var(--ink); }
.menu__care > summary::-webkit-details-marker { display: none; }
.menu__care > summary::after { content: "+"; font-size: 1.4rem; color: var(--gold-ink); }
.menu__care[open] > summary::after { content: "–"; }
.menu__care .hubpicks { padding-bottom: .6rem; }
.menu .menu__routes { display: grid; border-top: 0; margin-top: .2rem; padding-top: .2rem; }
.menu__routes a .i, .menu__lh .i { width: 1.2rem; height: 1.2rem; color: var(--gold-ink); }
.menu__learn { display: flex; flex-wrap: wrap; align-items: center; gap: 0 .2rem; }
.menu__lh { display: inline-flex; align-items: center; gap: .6rem; min-height: 2.75rem; padding: 0 .6rem; font: 600 1rem/1 var(--f-ui); color: var(--ink-3); }
.menu__learn a { padding: 0 .6rem !important; }
.menu__appear { margin-top: .8rem; padding-top: .8rem; border-top: 1px solid var(--rule); }
.hubpick.is-unbuilt .hubpick__l::after { content: " · not in this preview"; color: var(--ink-3); }
.rv-off .hubpick.is-unbuilt .hubpick__l::after { content: none; }

/* ---------- review: one compact disclosure, a visible draft indicator ---------- */
.openrow { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .3rem .8rem; margin-top: .1rem; }
.openrow .crumbs { flex: 1 1 auto; min-width: 0; }
.crumbs ol { font-size: .875rem; }
.rvd { flex: 0 1 auto; font: .875rem/1.45 var(--f-ui); color: var(--note-ink); }
.rvd > summary { list-style: none; cursor: pointer; display: inline-flex; align-items: center; gap: .45rem; min-height: 2.75rem;
  padding: 0 .75rem; border-radius: var(--r-pill); background: var(--note-bg); box-shadow: inset 0 0 0 1px var(--note-rule);
  font: 600 .8125rem/1.2 var(--f-ui); white-space: nowrap; }
.rvd > summary::-webkit-details-marker { display: none; }
.rvd__dot { width: .55rem; height: .55rem; border-radius: 50%; background: var(--note-rule); }
.rvd[open] { flex-basis: 100%; }
.rvd__body { margin-top: .4rem; padding: .7rem .9rem; border-radius: var(--r-m); background: var(--note-bg); border: 1px dashed var(--note-rule); }
.rvd__body p { margin: 0 0 .5rem !important; font: .875rem/1.5 var(--f-ui) !important; color: var(--note-ink) !important; max-width: none !important; }
.rvd__body a { color: inherit; font-weight: 600; }
.rvd__body .switch { color: var(--note-ink); font-size: .875rem; }
.rvd__h { margin: .7rem 0 .2rem !important; font-weight: 600 !important; }
.rvd__body ul { margin: 0; padding-left: 1.1rem; font-size: .8125rem; }
.rvd__body code { font-size: .8125rem; }

/* ---------- hero: H1, the answer, the safety pointer, the route, then the plate ---------- */
.hero, .chero { padding-top: .6rem; gap: 1rem; }
.hero h1 { margin-top: .5rem; }
.chero h1 { margin-top: .5rem; }
.hero__copy > p:first-of-type, .hero__copy > .hero__h2 + p { font-size: calc(var(--t-read) * 1.04); }
.hero__h2 { margin: .9rem 0 .35rem; font-size: 1.0625rem; color: var(--ink-3); }
.btn--route { gap: .55rem; min-height: 3rem; padding: .6rem 1.1rem; border: 1px solid rgb(var(--tint) / .55); background: var(--paper); color: var(--heading);
  font: 600 1rem/1.2 var(--f-ui); box-shadow: 0 8px 20px -16px rgb(var(--shadow-rgb) / .6); text-align: left; }
.btn--route:hover { color: var(--heading); border-color: var(--gold); }
.btn--route .i { color: var(--gold-ink); }
.hero__go { margin: .2rem 0 .8rem !important; }
.thread { margin-top: .7rem; }

/* the safety pointer: the authored urgent sentence, on its own opaque surface */
.safety { max-width: var(--w-read); margin: .2rem 0 1rem; padding: .7rem .95rem; border-radius: var(--r-m); background: var(--alert-bg);
  box-shadow: inset 3px 0 0 var(--alert-rule), inset 0 0 0 1px color-mix(in srgb, var(--alert-rule) 30%, transparent); }
.safety p { margin: 0 !important; font: 400 1.0625rem/1.6 var(--f-read) !important; color: var(--ink) !important; }
.safety__k { display: inline-flex; align-items: center; gap: .3rem; font: 700 1rem/1.3 var(--f-ui); color: var(--alert); }
.safety__k .i { color: var(--alert-rule); width: 1.1rem; height: 1.1rem; }
.safety a { color: var(--alert); font-weight: 600; }

.answer--plain p { font-size: var(--t-read) !important; }
.answer { margin-top: .4rem; }

/* ---------- plates: the hub signature (decorative; nothing clinical sits on it) ---------- */
.sig { display: block; width: 100%; height: 100%; }
.sig .sg-a { stop-color: #FBF4DF; stop-opacity: .92; }
.sig .sg-b { stop-color: rgb(var(--tint)); stop-opacity: .6; }
.sig .sg-c { stop-color: #F4F1E6; stop-opacity: .82; }
.sig .sg-d { stop-color: #1D3328; stop-opacity: .48; }
.sig .sh-a { stop-color: rgb(var(--shadow-rgb)); stop-opacity: .2; }
.sig .sh-b { stop-color: rgb(var(--shadow-rgb)); stop-opacity: 0; }
.sig__glass { stroke: none; opacity: .8; }
.sig__ln { fill: none; stroke: rgb(var(--tint)); stroke-opacity: .55; stroke-width: .5; }
.sig__hi { fill: none; stroke: #FFF6D8; stroke-opacity: .72; stroke-width: .5; }
.sig__edge { fill: none; stroke: #FFF6D8; stroke-opacity: .8; stroke-width: .9; transition: stroke-opacity .42s var(--ease); }
.sig__edge--b { stroke: rgb(var(--tint)); stroke-opacity: .7; }
.sig__thread { fill: none; stroke: var(--gold); stroke-width: 1.9; stroke-linecap: round; }
.sig__rim { fill: none; stroke: #FFF8E2; stroke-width: 5; stroke-linecap: round; opacity: 0; filter: blur(2px); transition: opacity .42s var(--ease); }
:root[data-theme="dark"] .sig .sg-a, :root[data-theme="dark"] .sig .sg-c { stop-opacity: .34; }
:root[data-theme="dark"] .sig .sg-b { stop-opacity: .7; }
:root[data-theme="dark"] .sig .sg-d { stop-color: #000; stop-opacity: .5; }
:root[data-theme="dark"] .sig__hi { stroke-opacity: .32; }
:root[data-theme="dark"] .sig__edge { stroke-opacity: .5; }
:root[data-theme="dark"] .sig__ln { stroke-opacity: .75; }
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) .sig .sg-a, :root:not([data-theme="light"]) .sig .sg-c { stop-opacity: .34; }
  :root:not([data-theme="light"]) .sig .sg-b { stop-opacity: .7; }
  :root:not([data-theme="light"]) .sig .sg-d { stop-color: #000; stop-opacity: .5; }
  :root:not([data-theme="light"]) .sig__hi { stroke-opacity: .32; }
  :root:not([data-theme="light"]) .sig__edge { stroke-opacity: .5; }
  :root:not([data-theme="light"]) .sig__ln { stroke-opacity: .75; }
}
.hue--maroon .sig .sg-d, .sig.hue--maroon .sg-d { stop-color: #3A1218; }

/* phone: the plate is a cropped band under the route control, never above the answer */
.plate { position: relative; margin: .3rem calc(-1 * var(--gut)) 1rem; height: 9.5rem; overflow: hidden; pointer-events: none;
  -webkit-mask: linear-gradient(90deg, transparent, #000 12%, #000 88%, transparent); mask: linear-gradient(90deg, transparent, #000 12%, #000 88%, transparent); }
.plate .sig { position: absolute; inset: -10% 0; height: 120%; }
.plate__rim { position: absolute; inset: 0; opacity: 0; background: radial-gradient(40% 50% at 62% 40%, rgb(255 248 226 / .5), transparent 70%);
  transition: opacity .42s var(--ease); }

/* condition: a detail of the parent plate with the authored symptom line */
.cplate { margin: 0; display: flex; align-items: center; gap: .7rem; }
.cplate__art { flex: none; width: 3rem; height: 3rem; border-radius: 50%; overflow: hidden; background: var(--paper);
  box-shadow: inset 0 0 0 1px rgb(var(--tint) / .35); }
.cplate__line { font: italic 400 1.0625rem/1.5 var(--f-read); color: var(--ink-2); }
.chero__copy + .cplate { margin-top: -.1rem; }

@media (min-width: 64rem) {
  .hero { position: relative; display: block; padding-top: 1.6rem; min-height: 38rem; }
  .hero__copy { max-width: min(40rem, calc(54vw - var(--gut))); }
  .page--hub { overflow-x: clip; }
  .hero .plate { position: absolute; top: 1.2rem; right: min(0px, calc((var(--w-page) - 100vw) / 2)); width: 44vw; max-width: 44rem;
    height: auto; aspect-ratio: 5 / 4; margin: 0; -webkit-mask: radial-gradient(75% 75% at 55% 50%, #000 60%, transparent 100%);
    mask: radial-gradient(75% 75% at 55% 50%, #000 60%, transparent 100%); }
  .hero .plate .sig { inset: 0; height: 100%; }
  .chero { grid-template-columns: minmax(0, 1fr) 18rem; align-items: end; }
  .cplate { display: block; align-self: start; margin-top: 1rem; }
  .cplate__art { width: 100%; height: auto; aspect-ratio: 4 / 3; border-radius: var(--r-xl); box-shadow: inset 0 0 0 1px var(--rule), 0 30px 60px -40px rgb(var(--shadow-rgb) / .6); }
  .cplate__line { margin-top: .7rem; padding: .7rem .9rem; border-radius: var(--r-m); background: var(--paper); box-shadow: inset 0 0 0 1px var(--rule); }
}
/* the one hero motion: a rim light on deliberate pointer or focus, desktop only */
@media (min-width: 64rem) and (hover: hover) {
  html.js:not(.motion-off):not(.read) .hero:hover .plate__rim, html.js:not(.motion-off):not(.read) .hero:focus-within .plate__rim { opacity: 1; }
  html.js:not(.motion-off):not(.read) .hero:hover .sig__rim, html.js:not(.motion-off):not(.read) .hero:focus-within .sig__rim { opacity: .55; }
  html.js:not(.motion-off):not(.read) .hero:hover .sig__edge { stroke-opacity: 1; }
}

/* ---------- routes: condition = matte card; in-page answer = paper card pointing down; guides = typed links ---------- */
.routes__lead { margin: 1rem 0 .2rem !important; font: 600 .9375rem/1.4 var(--f-ui) !important; color: var(--ink-3) !important; }
li.route { position: relative; list-style: none; }
.route__name { display: block; font: 600 1.375rem/1.15 var(--f-display); color: var(--on-choice); text-decoration: none; }
.route__name::first-letter { text-transform: uppercase; }
.route__name::after { content: ""; position: absolute; inset: 0; border-radius: var(--r-l); }
.route__name:hover, .route__name:focus { color: var(--on-choice); text-decoration: none; }
.route__name:focus-visible { outline: none; box-shadow: none; }
li.route:focus-within { outline: 2px solid var(--focus); outline-offset: 3px; box-shadow: 0 0 0 6px var(--focus-halo); }
li.route:hover { box-shadow: inset 0 1px 0 rgb(255 255 255 / .18), inset 0 0 0 1px var(--gold), 0 16px 34px -24px rgb(var(--shadow-rgb) / .9); }
.route__more { display: block; margin-top: .45rem; font: 400 .9375rem/1.5 var(--f-ui); color: var(--on-choice-2); }
.route__more a { position: relative; z-index: 1; color: #F2E6C9; text-decoration: underline; text-underline-offset: .2em; font-weight: 600; }
.route__more a:hover { color: #fff; }
.kind-chip { display: inline-block; padding: .05rem .5rem; margin-right: .1rem; border-radius: var(--r-pill); font: 600 .75rem/1.5 var(--f-ui);
  letter-spacing: .04em; color: #F2E6C9; box-shadow: inset 0 0 0 1px rgb(242 230 201 / .55); }
.route__tag { display: inline-block; margin: .3rem 0 0; padding: 0 .45rem; border-radius: 4px; font: 600 .6875rem/1.6 var(--f-ui);
  letter-spacing: .04em; color: #F7E6A8; background: rgb(255 244 204 / .12); border: 1px dashed rgb(247 230 168 / .5); }
.route__kind { display: block; margin-bottom: .15rem; font: 600 .75rem/1.2 var(--f-ui); letter-spacing: .12em; text-transform: uppercase; color: var(--gold-ink); }
li.route--here { background: var(--paper); background-image: none; color: var(--ink); box-shadow: inset 0 0 0 1.5px rgb(var(--tint) / .55); }
li.route--here .route__name { color: var(--heading); }
li.route--here .route__line { color: var(--ink-2); }
li.route--here .route__icon { color: var(--heading); background: radial-gradient(circle at 35% 30%, rgb(255 255 255 / .7), rgb(var(--tint) / .25) 62%, rgb(var(--tint) / .45)); }
li.route--here:hover { box-shadow: inset 0 0 0 1.5px var(--gold); }
.flow .routes > li.route { padding: .9rem 1rem !important; }
.page--hub .flow .routes { gap: .7rem; }
.quick { scroll-margin-top: calc(var(--bar-h) + 1.25rem); }
@media (min-width: 48rem) { .routes:has(> li:nth-child(5)) { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

/* ---------- trust and offer ---------- */
.doctor__role { margin: .1rem 0 .3rem !important; font: 600 1.35rem/1.2 var(--f-display) !important; color: var(--heading) !important; }
.slot--portrait { display: grid; place-items: center; }
.slot__mark .i { width: 2rem; height: 2rem; }
.fee__other { padding-top: .8rem; border-top: 1px dashed var(--rule); }
.costs { margin: .4rem 0 .3rem; display: grid; gap: .3rem; }
.costs > div { display: flex; flex-wrap: wrap; justify-content: space-between; gap: .1rem 1rem; font: 1rem/1.45 var(--f-ui); }
.costs dt { color: var(--ink-2); }
.costs dd { margin: 0; }
.tbc { font-weight: 600; color: var(--note-ink); background: var(--note-bg); padding: 0 .45rem; border-radius: 4px; border: 1px dashed var(--note-rule); }
.costs__ask { margin: .2rem 0 0 !important; }
.costs__ask a { display: inline-flex; align-items: center; gap: .4rem; min-height: 2.75rem; font: 600 1rem/1 var(--f-ui); }
@media (min-width: 64rem) { .fee__other { grid-column: 1 / -1; } }

/* ---------- BOOK ---------- */
.bhero { max-width: var(--w-page); margin: 0 auto; padding: .6rem var(--gut) 0; }
.bhero h1 { margin: .5rem 0 0; font: 600 var(--t-cond)/1.06 var(--f-display); letter-spacing: -.01em; max-width: 22ch; }
.offer { display: flex; flex-wrap: wrap; align-items: center; gap: .4rem 1.2rem; margin: 1rem 0 0; padding: .8rem 1rem; border-radius: var(--r-l);
  background: var(--paper); box-shadow: inset 4px 0 0 var(--gold), inset 0 0 0 1px var(--rule); max-width: var(--w-read); }
.offer__amt { margin: 0; font: 600 2.6rem/1 var(--f-display); color: var(--heading); }
.offer__facts { list-style: none; margin: 0; padding: 0; display: grid; gap: .25rem; font: 600 1rem/1.35 var(--f-ui); color: var(--ink-2); }
.offer__facts li { display: flex; align-items: center; gap: .45rem; }
.offer__facts .i { color: var(--gold-ink); }
.bookgrid, .booktail { max-width: var(--w-page); margin: 0 auto; padding: 0 var(--gut); }
.page--book .sec { max-width: var(--w-read); }
.page--book .sec p, .page--book .sec li { font: 400 var(--t-read)/var(--lh-read) var(--f-read); color: var(--ink); }
.page--book .sec ul, .page--book .sec ol { padding-left: 1.3rem; }
.page--book .sec ul > li::marker { color: var(--gold); content: "–  "; }
.page--book strong { color: var(--heading); font-weight: 650; }
.steps { list-style: none; padding: 0 !important; margin: 1rem 0 !important; counter-reset: st; display: grid; gap: .5rem; }
.steps > li { counter-increment: st; position: relative; padding: .7rem .9rem .7rem 3.2rem !important; margin: 0 !important; border-radius: var(--r-m);
  background: var(--paper); box-shadow: inset 0 0 0 1px var(--rule); }
.steps > li::before { content: counter(st); position: absolute; left: .8rem; top: .85rem; width: 1.8rem; height: 1.8rem; display: grid; place-items: center;
  border-radius: 50%; font: 600 .9375rem/1 var(--f-ui); color: var(--gold-ink); box-shadow: inset 0 0 0 1.5px var(--gold); }
.steps > li.is-pay { box-shadow: inset 0 0 0 1.5px var(--gold), 0 10px 24px -20px rgb(var(--shadow-rgb) / .8); }
.steps > li.is-pay::before { background: var(--gold); color: var(--paper); }
.page--book .disclaimer, .page--book .factline { font-family: var(--f-ui); }
@media (min-width: 64rem) {
  .bookgrid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 27rem); gap: 3rem; align-items: start; }
  .bookgrid > .sec:last-child { position: sticky; top: calc(var(--bar-h) + 1.5rem); margin-top: var(--gap-sec); }
}

/* the private dummy request */
.req-wrap { max-width: var(--w-read); }
.req, .receipt { margin: 1rem 0; padding: 1.1rem 1.1rem 1.2rem; border-radius: var(--r-xl); background: var(--paper);
  box-shadow: inset 0 0 0 1px var(--rule-strong), 0 24px 50px -38px rgb(var(--shadow-rgb) / .7); }
.req__h, .receipt h3 { margin: 0 0 .5rem !important; font: 600 1.6rem/1.15 var(--f-display) !important; color: var(--heading); }
.req__preview { margin: 0 0 .9rem !important; padding: .5rem .7rem; border-radius: var(--r-s); font: .875rem/1.5 var(--f-ui) !important;
  color: var(--note-ink) !important; background: var(--note-bg); border: 1px dashed var(--note-rule); }
.req__fs { border: 0; margin: 0; padding: 0; min-width: 0; display: grid; gap: .9rem; }
.field { display: grid; gap: .3rem; min-width: 0; border: 0; padding: 0; margin: 0; }
.field label, .field legend { font: 600 1rem/1.3 var(--f-ui); color: var(--ink); padding: 0; }
.field__opt { font-weight: 400; color: var(--ink-3); }
.field input:not([type=radio]), .field textarea { width: 100%; min-height: 3rem; padding: .65rem .8rem; border-radius: var(--r-s); border: 1.5px solid var(--rule-strong);
  background: var(--bg); color: var(--ink); font: 400 1.0625rem/1.4 var(--f-ui); }
.field textarea { min-height: 5.5rem; resize: vertical; }
.field input:not([type=radio]):focus-visible, .field textarea:focus-visible { border-color: var(--focus); outline: 2px solid var(--focus); outline-offset: 1px; }
.field.is-err input, .field.is-err textarea { border-color: var(--alert); }
.field__err { margin: 0 !important; font: 600 .9375rem/1.4 var(--f-ui) !important; color: var(--alert) !important; }
.field--choice { display: grid; gap: .35rem; }
.choice { display: flex; align-items: center; gap: .6rem; min-height: 2.9rem; padding: 0 .8rem; border-radius: var(--r-s);
  box-shadow: inset 0 0 0 1.5px var(--rule-strong); font: 400 1.0625rem/1.3 var(--f-ui) !important; cursor: pointer; }
.choice input { flex: none; width: 1.25rem; height: 1.25rem; min-height: 0; margin: 0; padding: 0; accent-color: var(--green); }
.choice input:focus-visible { outline: 2px solid var(--focus); outline-offset: 2px; }
.choice:has(input:checked) { box-shadow: inset 0 0 0 2px var(--green); }
/* the consent checkbox is a .field input too: keep the box its own size so the label wraps beside it (it took the full row on /go/ at 320–414) */
.field .choice input[type=checkbox] { flex: none; width: 1.25rem; height: 1.25rem; min-height: 0; margin: 0; padding: 0; border: 0; }
.choice > span { min-width: 0; flex: 1 1 auto; }
.field--consent .choice { padding-block: .55rem; }
.req__act .btn { width: 100%; min-height: 3.1rem; }
.req__errs { margin: 0 0 .9rem; padding: .7rem .9rem; border-radius: var(--r-m); background: var(--alert-bg); box-shadow: inset 3px 0 0 var(--alert-rule); }
.req__errs:focus { outline: 2px solid var(--focus); outline-offset: 2px; }
.req__errs-h { margin: 0 0 .3rem !important; font: 700 1rem/1.4 var(--f-ui) !important; color: var(--alert) !important; }
.req__errs ul { margin: 0; padding-left: 1.1rem; }
.req__errs li, .req__errs a { font: 400 1rem/1.5 var(--f-ui) !important; color: var(--ink) !important; }
.req__nojs { margin: .8rem 0 0 !important; font: .9375rem/1.5 var(--f-ui) !important; color: var(--ink-3) !important; }
html.js .req__nojs { display: none; }
.receipt { box-shadow: inset 0 0 0 1.5px var(--gold), 0 24px 50px -38px rgb(var(--shadow-rgb) / .7); }
.receipt:focus { outline: 2px solid var(--focus); outline-offset: 3px; }
.receipt__lead { font: 400 1.0625rem/1.6 var(--f-read) !important; }
.receipt__steps { list-style: none; margin: .8rem 0 !important; padding: 0 !important; display: grid; gap: .1rem; counter-reset: rc; }
.receipt__steps li { counter-increment: rc; display: grid; grid-template-columns: 1.8rem minmax(0, 1fr); column-gap: .6rem; padding: .45rem 0 !important;
  margin: 0 !important; font: 400 1rem/1.4 var(--f-ui) !important; color: var(--ink-3) !important; }
.receipt__steps li::before { content: counter(rc); grid-row: span 2; width: 1.7rem; height: 1.7rem; display: grid; place-items: center; border-radius: 50%;
  font: 600 .875rem/1 var(--f-ui); box-shadow: inset 0 0 0 1.25px var(--rule-strong); }
.receipt__steps b { color: var(--ink-2); }
.receipt__steps li.is-done::before { content: "✓"; background: var(--green); color: var(--on-green); box-shadow: none; }
.receipt__steps li.is-done b, .receipt__steps li.is-next b { color: var(--ink); }
.receipt__steps li.is-next::before { box-shadow: inset 0 0 0 2px var(--gold); color: var(--gold-ink); }
.receipt__not { padding: .6rem .8rem; border-radius: var(--r-s); background: var(--prompt-bg); box-shadow: inset 3px 0 0 var(--gold); }

/* ---------- footer, round 2 ---------- */
.foot__brand p:not(.mark) { margin-top: .6rem; }
.foot__h--2 { margin-top: 1.4rem; }
.foot__held { margin: .4rem 0 0; font: .875rem/1.45 var(--f-ui); color: #F7E6A8; }
.foot__prefs { padding-top: 1.2rem; }

/* ---------- desktop header: the full order; compact header below 72rem, where the items stop fitting ---------- */
@media (min-width: 64rem) {
  .mast__nav, .mast__book, .mast .dd--appear { display: none; }
  .menu-btn { display: inline-flex !important; }
  .menu__routes { display: grid; }
}
@media (min-width: 72rem) {
  .mast__nav { display: flex; align-items: center; gap: .05rem; margin-left: .6rem; }
  .mast__nav > a { display: inline-flex; align-items: center; min-height: 2.75rem; padding: 0 .75rem; border-radius: var(--r-pill); color: var(--ink-2);
    font: 600 .9375rem/1 var(--f-ui); text-decoration: none; }
  .mast__nav > a:hover { color: var(--ink); background: rgb(255 255 255 / calc(var(--lg-rim) * .6)); }
  .mast__book { display: inline-flex; }
  .mast .dd--appear { display: block; }
  .menu-btn { display: none !important; }
}

/* ---------- reading mode: orthogonal to theme; no plates, no motion; urgent navigation stays ---------- */
html.read { --t-read: clamp(1.25rem, 1.22rem + .12vw, 1.3125rem); --t-faq: clamp(1.25rem, 1.2rem + .2vw, 1.375rem); --lh-read: 1.85; --w-read: 66ch; }
html.read .plate, html.read .cplate__art, html.read body::before { display: none !important; }
html.read *, html.read *::before, html.read *::after { transition: none !important; animation: none !important; }
html.read .hero { min-height: 0; }
html.read .hero__copy { max-width: var(--w-read); }
html.read .chero { grid-template-columns: minmax(0, 1fr); }
html.read .route__more, html.read .tbl { font-size: 1.0625rem; }

/* ---------- fallbacks, round 2 ---------- */
@media (forced-colors: active) {
  .plate, .cplate__art { display: none; }
  .safety, .rvd > summary, .req, .receipt, .offer, .steps > li, li.route, .seg, .menu__big { border: 1px solid CanvasText; }
  .seg[aria-pressed="true"] { forced-color-adjust: none; background: Highlight; color: HighlightText; }
  .tbc { border: 1px dashed CanvasText; }
}
@media (prefers-reduced-transparency: reduce) { .dd__panel { background: var(--paper); } }
@media print { .plate, .cplate__art, .rvd, .req-wrap, .menu, .dd { display: none !important; } }
/* phones: breadcrumb and the draft indicator share one row */
@media (max-width: 47.9rem) {
  .openrow { flex-wrap: wrap; align-items: center; }
  .openrow .crumbs { flex: 1 1 10rem; }
  .rvd { flex: 0 1 9.5rem; }
  .rvd > summary { white-space: normal; line-height: 1.15; padding-block: .3rem; text-align: left; }
  .openrow .crumbs ol { font-size: .8125rem; row-gap: 0; }
  .rvd > summary { padding: 0 .6rem; font-size: .75rem; }
  .rvd[open] { position: static; }
  .openrow:has(.rvd[open]) { flex-wrap: wrap; }
}
.cplate__art .sig { -webkit-mask: radial-gradient(85% 85% at 50% 50%, #000 55%, transparent 100%); mask: radial-gradient(85% 85% at 50% 50%, #000 55%, transparent 100%); }
/* the appearance control wraps at large text instead of widening its container */
.appear__theme { flex-wrap: wrap; max-width: 100%; border-radius: var(--r-l); }
.foot__in { grid-template-columns: minmax(0, 1fr); }
@media (min-width: 64rem) { .foot__in { grid-template-columns: 16rem minmax(0, 1fr); } }
.steps > li, .page--book .sec { min-width: 0; overflow-wrap: anywhere; }
@media (min-width: 72rem) { .mast__here { display: none; } }
/* phones: the opening section follows the headline closely, so the authored answer and its qualification come first */
@media (max-width: 47.9rem) {
  .chero { gap: .55rem; }
  .chero h1, .hero h1 { margin-top: .3rem; }
  .thread { margin-top: .5rem; }
  .page--condition .flow > .sec:first-child { margin-top: .9rem; padding-top: .9rem; }
  .page--condition .flow > .sec:first-child > h2 { margin-bottom: .6rem; }
  .page--condition .flow > .sec:first-child > p:first-of-type { margin-bottom: .6rem; }
}

/* clean reading still tells the reader what is unconfirmed: a pending fact shrinks to a short tag, it never vanishes.
   (Clinical [[A]] flags are for Dr. Sharma and stay hidden in clean reading.) */
.rv-off mark.rv--todo[data-rv] { display: inline !important; padding: 0 .3rem; }
.rv-off mark.rv--todo .rv__n { display: none; }

/* =====================================================================================================================
   r3 · four destinations (P03, LB-07, CONTACT, ONLINE) and the Piles opening chips
   ===================================================================================================================== */
/* hub opening: the authored destination names as direct links, so "Blood in stool" is one tap from the first screen */
.chips ul { list-style: none; margin: .1rem 0 .9rem; padding: 0; display: flex; flex-wrap: wrap; gap: .45rem; }
.chips a { display: inline-flex; align-items: center; min-height: 2.75rem; padding: .35rem .95rem; border-radius: var(--r-pill);
  background-color: var(--choice); color: var(--on-choice); font: 600 .9375rem/1.25 var(--f-ui); text-decoration: none;
  box-shadow: inset 0 0 0 1px rgb(var(--tint) / .45); }
.chips a:hover { color: var(--on-choice); box-shadow: inset 0 0 0 1.5px var(--gold); }
.chips a:focus-visible { outline: 2px solid var(--focus); outline-offset: 3px; box-shadow: 0 0 0 6px var(--focus-halo); }
@media (min-width: 64rem) { .chips ul { max-width: 40rem; } }

/* "| | PCOD | PCOS |": a real table on wide screens, stacked comparison rows on a phone (no sideways swipe) */
@media (max-width: 47.9rem) {
  .tbl--vs, .tbl--vs tbody, .tbl--vs tr, .tbl--vs th, .tbl--vs td { display: block; width: 100%; }
  .tbl--vs thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
  .tbl--vs tr { padding: .7rem .9rem .5rem; border-bottom: 1px solid var(--rule); }
  .tbl--vs tr:last-child { border-bottom: 0; }
  .tbl--vs tbody th { padding: 0 0 .35rem; border: 0; font: 600 1rem/1.35 var(--f-ui); color: var(--heading); }
  .tbl--vs td { display: grid; grid-template-columns: 4.2rem minmax(0, 1fr); gap: .6rem; padding: .3rem 0; border: 0; }
  .tbl--vs td::before { content: attr(data-label); font: 700 .8125rem/1.6 var(--f-ui); letter-spacing: .06em; color: var(--gold-ink); }
}

/* contact facts: label, value; unconfirmed values read "To be confirmed" in clean reading and are never a live link */
.contactfacts { max-width: var(--w-read); margin: 1rem 0; padding: .3rem 1rem; border-radius: var(--r-l); background: var(--paper);
  box-shadow: inset 0 0 0 1px var(--rule); }
.contactfacts > div { display: grid; grid-template-columns: minmax(0, 11rem) minmax(0, 1fr); gap: .2rem 1rem; padding: .65rem 0;
  border-bottom: 1px solid var(--rule); }
.contactfacts > div:last-child { border-bottom: 0; }
.contactfacts dt { font: 600 1rem/1.4 var(--f-ui); color: var(--ink-2); }
.contactfacts dd { margin: 0; font: 400 1.0625rem/1.5 var(--f-read); color: var(--ink); }
.contactfacts .pv { border-bottom: 1.5px dashed var(--note-rule); margin-right: .4rem; }
.contactfacts .pv[data-confirmed] { border-bottom: 0; }
.contactlink { font-weight: 600; margin-right: .5rem; }
.req__fail { border-left: 4px solid var(--urgent, #b3412b); padding: .5rem .8rem; border-radius: .5rem; background: rgba(179, 65, 43, .08); }
.req__privacy { display: block; margin-top: .3rem; }
.contactfacts .tbc { display: none; }
.rv-off .contactfacts .tbc { display: inline; }
.contactfacts__todo { margin: -.4rem 0 1rem !important; }
@media (max-width: 35rem) { .contactfacts > div { grid-template-columns: minmax(0, 1fr); } }
.visit { max-width: var(--w-read); margin: 1.2rem 0; padding: 1rem 1.1rem .4rem; border-radius: var(--r-l); background: var(--paper);
  box-shadow: inset 4px 0 0 rgb(var(--tint) / .8), inset 0 0 0 1px var(--rule); scroll-margin-top: calc(var(--bar-h) + 1rem); }
.visit h3 { margin: 0 0 .3rem !important; font: 600 1.45rem/1.2 var(--f-display) !important; color: var(--heading); }
.visit .contactfacts { margin: .3rem 0 .6rem; padding: 0; box-shadow: none; background: none; }
.visit--video { box-shadow: inset 4px 0 0 var(--gold), inset 0 0 0 1px var(--rule); }
.page--service .routes--two { list-style: none; padding: 0; margin: 1rem 0 1.2rem; display: grid; gap: .6rem; max-width: var(--w-read); }
.page--service li.route { padding: .9rem 1rem; }
#ask { scroll-margin-top: calc(var(--bar-h) + 1rem); }
.offer__next { margin: .2rem 0 0 !important; flex-basis: 100%; }
.offer__next .btn { width: 100%; }
@media (min-width: 48rem) { .offer__next .btn { width: auto; } }
.leadin { margin: 1.3rem 0 .3rem !important; scroll-margin-top: calc(var(--bar-h) + 1rem); }
.page--guide .chero { grid-template-columns: minmax(0, 1fr); }
@media (min-width: 64rem) { .page--guide .chero { grid-template-columns: minmax(0, 1fr) 14rem; } }
.page--guide .chero .eyebrow { margin-top: .6rem; }

.chips__h { margin: .1rem 0 .45rem !important; font: 600 1rem/1.3 var(--f-ui) !important; }
.chips__h a { display: inline-flex; align-items: center; gap: .4rem; min-height: 2.75rem; color: var(--heading); text-decoration: none; }
.chips__h a:hover { text-decoration: underline; }
.chips__h .i { color: var(--gold-ink); }
@media (max-width: 47.9rem) { .page--guide .cplate { display: none; } }
.chips .chips__h a { background: none; box-shadow: none; padding: 0; min-height: 2.75rem; color: var(--heading); font: 600 1rem/1.3 var(--f-ui); }
.chips .chips__h a:hover { color: var(--heading); box-shadow: none; }
.chips ul a { font-size: .9375rem; padding: .3rem .85rem; }

.page--service .sec ul.routes--two { padding-left: 0; }
/* inside the contact list the value itself reads "To be confirmed" in clean reading; its to-do tag would say it twice */
.rv-off .contactfacts mark.rv--todo[data-rv] { display: none !important; }

/* =====================================================================================================================
   r4 · first-screen route, steps-to-request, contact grid and fact status, return marker
   ===================================================================================================================== */
/* hub opening on phones: the answer stays at reading size, tighter rhythm, the question and chips share one flow */
@media (max-width: 47.9rem) {
  .page--hub .hero__copy > .hero__h2 + p, .page--hub .hero__copy > p:first-of-type { font-size: var(--t-read); line-height: 1.62; }
  .page--hub .hero__h2 { margin: .6rem 0 .25rem; }
  .page--hub .hero h1 { line-height: 1; }
  .page--hub .safety { padding: .55rem .8rem; margin-bottom: .7rem; }
  .page--hub .safety p { line-height: 1.5 !important; }
}
.chips ul { gap: .4rem; margin-bottom: .8rem; align-items: center; }
.chips li.chips__h { flex-basis: auto; margin-right: .1rem; }
.chips li.chips__h a { display: inline-flex; align-items: center; gap: .35rem; min-height: 2.5rem; padding: 0; background: none; box-shadow: none;
  color: var(--heading); font: 600 1rem/1.3 var(--f-ui); }
.chips li.chips__h a:hover { color: var(--heading); box-shadow: none; text-decoration: underline; }
.chips li.chips__h .i { color: var(--gold-ink); }
.chips a.chip--blood { gap: .35rem; background-color: var(--alert-bg); color: var(--alert); box-shadow: inset 0 0 0 1.5px color-mix(in srgb, var(--alert-rule) 60%, transparent); }
.chips a.chip--blood:hover { color: var(--alert); box-shadow: inset 0 0 0 2px var(--alert-rule); }
.chips a.chip--blood .i { width: 1.05rem; height: 1.05rem; color: var(--alert-rule); }

/* steps -> request: a quiet link, never a second button */
.nextstep { display: flex; flex-wrap: wrap; align-items: center; gap: .2rem .8rem; margin: -.2rem 0 1.2rem !important; }
.nextstep a { display: inline-flex; align-items: center; gap: .4rem; min-height: 2.75rem; font: 600 1rem/1.2 var(--f-ui); }
.nextstep span { font: .9375rem/1.4 var(--f-ui); color: var(--ink-3); }
.req__step { display: flex; align-items: center; gap: .6rem; margin: 0 0 .9rem !important; font: 1rem/1.4 var(--f-ui) !important; color: var(--ink-2) !important; }
.req__n { flex: none; display: grid; place-items: center; width: 1.8rem; height: 1.8rem; border-radius: 50%; background: var(--gold); color: var(--paper);
  font: 700 .9375rem/1 var(--f-ui); }
.req-wrap { scroll-margin-top: calc(var(--bar-h) + 1rem); }

/* contact: where confirmed information ends */
.factstatus { max-width: var(--w-read); margin: 1.2rem 0; padding: .9rem 1rem; border-radius: var(--r-l); background: var(--paper);
  box-shadow: inset 0 0 0 1px var(--rule-strong); }
.factstatus__h { margin: 0 0 .5rem !important; font: 600 1.25rem/1.25 var(--f-display) !important; color: var(--heading) !important; }
.factstatus__cols { display: grid; gap: .8rem; grid-template-columns: repeat(auto-fit, minmax(min(13rem, 100%), 1fr)); }
.factstatus__k { display: flex; align-items: center; gap: .35rem; margin: 0 0 .25rem !important; font: 700 .875rem/1.3 var(--f-ui) !important;
  letter-spacing: .06em; text-transform: uppercase; }
.factstatus__ok .factstatus__k { color: var(--heading) !important; }
.factstatus__ok .factstatus__k .i { color: var(--gold-ink); }
.factstatus__tbc .factstatus__k { color: var(--note-ink) !important; background: var(--note-bg); border: 1px dashed var(--note-rule);
  display: inline-flex; padding: .05rem .45rem; border-radius: 4px; }
.factstatus ul { margin: 0; padding-left: 1.1rem; }
.factstatus li { font: 1rem/1.5 var(--f-ui); color: var(--ink); margin: .15rem 0; }
.factstatus__id { font-size: .75rem; color: var(--ink-3); }
.factstatus__note { margin: .6rem 0 0 !important; font: .9375rem/1.5 var(--f-ui) !important; color: var(--ink-2) !important; }
@media (min-width: 64rem) {
  .page--service .contactgrid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 2.5rem; align-items: start; }
  .page--service .contactgrid .sec, .page--service .contactgrid > div > * { max-width: none; }
  .page--service .cg__b { padding-top: .2rem; }
  .page--service .cg__b > .contactfacts:first-child { margin-top: 0; }
  .page--service .sec:has(.contactgrid) { max-width: none; }
}

/* return marker: after "Back to where you were", the line you were reading is marked until you move on */
.is-return { position: relative; }
.is-return::before { content: ""; position: absolute; left: -.8rem; top: .1rem; bottom: .1rem; width: 3px; border-radius: 2px; background: var(--gold); }
html.js:not(.motion-off) .is-return::before { animation: returnmark 2.4s var(--ease) forwards; }
@keyframes returnmark { 0%, 70% { opacity: 1; } 100% { opacity: .35; } }
@media (prefers-reduced-motion: reduce) { .is-return::before { animation: none !important; } }
@media (forced-colors: active) { .is-return::before { background: Highlight; } .factstatus { border: 1px solid CanvasText; } }

/* art slots: off the critical path (skipped by layout and paint until near the viewport), fixed ratio so nothing shifts when an
   installed image replaces the branded still; the authored caption and the urgent guidance are never inside them */
.plate, .cplate__art, .figslot__ph, .figslot > img { content-visibility: auto; contain-intrinsic-block-size: auto 14rem; }
.figslot { max-width: var(--w-read); margin: 1.4rem 0; }
.figslot > img, .figslot__ph { display: block; width: 100%; aspect-ratio: 16 / 9; object-fit: cover; border-radius: var(--r-l); }
.figslot__ph { display: grid; place-items: center; align-content: center; gap: .4rem; text-align: center;
  background: repeating-linear-gradient(135deg, transparent 0 10px, rgb(var(--tint) / .07) 10px 20px), var(--paper);
  box-shadow: inset 0 0 0 1px var(--rule); color: var(--ink-3); }
.figslot__mark .i { width: 2rem; height: 2rem; color: var(--gold-ink); }
.figslot__k { font: 600 .875rem/1.3 var(--f-ui); letter-spacing: .04em; color: var(--note-ink); background: var(--note-bg); border: 1px dashed var(--note-rule);
  padding: .1rem .6rem; border-radius: 999px; }
.figslot figcaption { margin-top: .5rem; font: 400 .9375rem/1.55 var(--f-read); color: var(--ink-2); }
.plate--img { aspect-ratio: 4 / 3; }
/* phone: an installed image fills the same full-width band as the vector still (the fixed band height would otherwise narrow it to 4:3) */
@media (max-width: 63.9rem) { .plate--img { aspect-ratio: auto; } }
.plate--img img, .cplate__art img { width: 100%; height: 100%; object-fit: cover; display: block; }
.cplate__art picture, .plate--img picture { display: contents; }
@media (max-width: 63.9rem) { .figslot__ph, .figslot > img { aspect-ratio: 4 / 3; } }
@media (forced-colors: active) { .figslot__ph { border: 1px dashed CanvasText; } }

/* Wave 2 page groups: home, info pages, landing */
.hero__ways { display: flex; flex-wrap: wrap; gap: .6rem; margin: 1rem 0 0; }
.hero--landing .hero__copy { max-width: 46rem; }
.mast--lite .mast__nav { display: none; }
.foot--lite .foot__lite { display: flex; flex-wrap: wrap; gap: .4rem 1.2rem; list-style: none; padding: 0; margin: .6rem 0; }

/* the skip link lands on <main>: it takes focus without a ring (it is a target, not a control) */
main:focus { outline: none; }

/* the Knowledge Library's "Learn more" card (p.kl-learn), as the library's own component defines it, on the glass tokens */
.kl-learn { display: flex; flex-wrap: wrap; align-items: baseline; gap: .25rem .6rem; margin: 14px 0 22px; padding: 12px 16px; border-radius: 14px;
  background: color-mix(in srgb, var(--gold) 10%, transparent); box-shadow: inset 3px 0 0 var(--gold); font: 400 1rem/1.5 var(--f-ui); color: inherit; max-width: var(--w-read); }
.kl-learn__k { font: 600 .72rem/1.2 var(--f-ui); letter-spacing: .14em; text-transform: uppercase; color: var(--gold-ink); }
.kl-learn a { font-weight: 600; text-decoration: underline; text-underline-offset: 4px; }
.kl-learn__t { flex-basis: 100%; opacity: .85; }