/* ─────────────────────────────────────────────────────────────────────────────
   examinations.css — /examinations/ only.

   Ported from `Examinations Rebuild/examinations-page-mockup-v3.html` (2026-08-07).
   The mockup was self-contained: it carried its own copy of the site's base
   styles under an `--mc-*` token namespace so it could be opened as a single
   file. This file is that stylesheet with the duplication removed.

   Three rules govern what survived the port:

   1. SITE CHROME WAS DROPPED. header/footer/nav/.btn/.wrap/body/a/img and the
      base resets come from styles.css. The mockup's copies are gone, so the
      page inherits real chrome and any future change to it.

   2. PAGE CONTENT IS SCOPED to `.exam-page` (on <main> and the section bar).
      Where the mockup and the site both style .block, .card, .eyebrow, h1…h4
      and friends, the mockup's version is kept but confined to this page —
      v3's approved look survives without leaking onto any other page.

   3. THE TOKEN OVERRIDES BELOW ARE DELIBERATE DIVERGENCES, not leftovers.
      Everything else resolves to the site tokens in styles.css.

   No @import. The mockup pulled Aboreto/DM Sans/Permanent Marker from Google
   Fonts; this site self-hosts them (preconnects stripped 2026-07-16) and that
   line was removed in the port. Do not reintroduce it.
   ───────────────────────────────────────────────────────────────────────────── */

.exam-page{
  /* Reading measure. This page is a long-form instrument, not a landing page —
     it wants a narrower column than the site default. */
  --maxw:      1160px;   /* site: 1512px */
  --maxw-text:  720px;   /* site:  990px */

  /* Accessibility fix carried over from the mockup. The site's --faint
     (#6f5e49) is 3.05:1 on this background — below WCAG AA. This is 5.70:1.
     Site-wide correction is a separate, larger decision. */
  --faint: #9c8a72;

  /* Tighter vertical rhythm and heading scale — twelve sections is a lot of page. */
  --section-y: clamp(56px,8vw,104px);   /* site: clamp(64px,9vw,120px) */
  --fs-h2:     clamp(1.9rem,5vw,3rem);  /* site: clamp(2rem,6vw,3.4rem) */
  --ls-eyebrow: .3em;                   /* site: .32em */

  /* Page-only tokens — no site equivalent. */
  --fs-h3:      clamp(1.3rem,3vw,1.8rem);
  --focus-ring: rgba(240,197,116,.65);
  --ok:   #7fb069;   /* self-check: Solid        */
  --warn: #d99a3f;   /* self-check: Getting there */
  --bad:  #c9614a;   /* self-check: Not yet       */
  --section-bg: var(--bg);   /* re-pointed by .block.tint; read by the sticky summary */
}

/* Anchor offset for the sticky section bar. Scoped so no other page inherits it. */
html:has(.exam-page){ scroll-padding-top: calc(112px + 24px); }

/* ── Restore the two UA defaults the site reset removes ───────────────────────
   styles.css opens with `*{margin:0;padding:0}`. The mockup's reset was
   `*{box-sizing:border-box}` only, so its prose rhythm came from the browser
   defaults — and dropping the mockup's reset in favour of the site's silently
   flattened every paragraph on this page.

   Verified element by element against the mockup: `p` and the bottom margin of
   `h3` are the ONLY two that differed. Everything else (h1, h2, h4, ul, li,
   details, summary, table, fieldset, legend) carries an explicit rule and
   matched exactly.

   Deliberately unscoped and element-level — specificity (0,0,1). That beats the
   `*` reset while losing to every class-based rule, so components that set their
   own spacing (.lede, .path .sub p, .keyfact p …) keep winning. This file is
   only linked from this page, so there is nothing to leak onto. */
p { margin: 1em 0; }
h3 { margin-bottom: 1em; }

.exam-page h1, .exam-page h2, .exam-page .display{font-family:var(--font-display);font-weight:400;line-height:1.12;
     letter-spacing:var(--ls-display);color:var(--text-hi)}
.exam-page h3, .exam-page h4{font-family:var(--font-body);font-weight:600;line-height:1.3;color:var(--text-hi)}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important}
}
.exam-page .narrow{max-width:var(--maxw-text)}
.exam-page .block{padding:var(--section-y) 0}
.exam-page .block{border-top:1px solid var(--line-soft)}
.exam-page .block.tint{background:#251a10;--section-bg:#251a10}
.exam-page .block.ref{padding:clamp(40px,6vw,68px) 0}
.block.ref .section-head h2{font-size:var(--fs-h3)}
.block.marquee{border-top:1px solid var(--line)}
.exam-page .page-header{padding:clamp(100px,12vw,160px) 0 clamp(36px,5vw,56px);
  background:radial-gradient(1200px 600px at 12% -10%,rgba(47,111,106,.18),transparent 60%),
             radial-gradient(900px 500px at 88% 0%,rgba(91,42,74,.20),transparent 60%),
             linear-gradient(180deg,#1b120b,var(--bg))}
.exam-page .eyebrow{font-weight:500;letter-spacing:var(--ls-eyebrow);text-transform:uppercase;
  font-size:.72rem;color:var(--accent-soft);margin:0 0 .6rem}
.exam-page .callout{font-family:var(--font-accent);color:var(--accent-soft);display:inline-block;transform:rotate(-2deg)}
.exam-page .lede{color:var(--muted);font-size:var(--fs-lede);max-width:62ch}
.exam-page .section-head{max-width:64ch}
.exam-page .section-head h2{font-size:var(--fs-h2);margin:.3rem 0;max-width:19ch}
.exam-page .section-head p{color:var(--muted);font-size:var(--fs-lede);max-width:60ch}
.exam-page h1{font-size:var(--fs-h1);max-width:20ch;margin:.2rem 0 1rem}
.grid-top{margin-top:clamp(26px,4vw,40px)}
p{max-width:66ch}
/* ---- nav ---- */
header.site{position:sticky;top:0;z-index:50;backdrop-filter:blur(12px);
  background:rgba(22,15,9,.82);border-bottom:1px solid var(--line-soft)}
.secbar{border-bottom:1px solid var(--line-soft);background:rgba(22,15,9,.9)}
.secbar .wrap{display:flex;align-items:center;gap:12px;height:46px;overflow-x:auto;
  scrollbar-width:none;mask-image:linear-gradient(90deg,#000 0,#000 calc(100% - 28px),transparent 100%)}
.secbar .wrap::-webkit-scrollbar{display:none}
.secbar a{font-size:.74rem;letter-spacing:var(--ls-nav);text-transform:uppercase;
  color:var(--muted);text-decoration:none;white-space:nowrap;padding:6px 2px;border-bottom:2px solid transparent}
.secbar a[aria-current="true"]{color:var(--accent-soft);border-bottom-color:var(--accent)}
/* ---- buttons ---- */
.btn{display:inline-flex;align-items:center;gap:10px;padding:14px 26px;border-radius:var(--radius-pill);
  font-family:inherit;font-weight:500;font-size:.85rem;letter-spacing:var(--ls-btn);
  text-transform:uppercase;line-height:1;white-space:nowrap;border:1px solid transparent;cursor:pointer;
  text-decoration:none;transition:transform var(--dur) var(--ease),box-shadow var(--dur)}
.exam-page .cta-row{display:flex;flex-wrap:wrap;gap:14px;margin-top:1.6rem}
/* ---- cards ---- */
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(300px,100%),1fr));gap:20px}
.exam-page .card{background:var(--panel-2);border:1px solid var(--line-soft);
  border-radius:var(--radius-lg);padding:28px 26px}
.exam-page .card .num{font-family:var(--font-display);font-size:1.9rem;color:var(--accent);line-height:1}
.exam-page .card h3{font-family:var(--font-display);font-weight:400;letter-spacing:var(--ls-display);
  font-size:1.5rem;margin:.3rem 0 .5rem}
.exam-page .card p{color:var(--muted);font-size:.96rem}
.exam-page .card .sub{margin-top:16px;padding-top:14px;border-top:1px solid var(--line-soft);font-size:.9rem}
/* ---- index ---- */
.toc{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(240px,100%),1fr));gap:24px;
  background:var(--panel-2);border:1px solid var(--line-soft);border-radius:var(--radius-lg);
  padding:28px;margin-top:2rem}
.toc h4{font-size:.72rem;letter-spacing:var(--ls-eyebrow);text-transform:uppercase;
  color:var(--accent);margin:0 0 .7rem;font-weight:500}
.toc ul{list-style:none;margin:0;padding:0}
.toc li{padding:5px 0}
.toc a{font-size:.94rem;text-decoration:none;color:var(--text)}
.toc a:hover{color:var(--accent-soft)}
/* ---- path ---- */
.path .step{display:grid;grid-template-columns:52px minmax(0,1fr);gap:18px;padding:22px 0;
  border-top:1px solid var(--line-soft)}
.exam-page .path .step:last-child{border-bottom:1px solid var(--line-soft)}
.exam-page .path .n{font-family:var(--font-display);font-size:1.5rem;color:var(--accent)}
.path .lead{font-weight:600;color:var(--text-hi)}
.path .sub{color:var(--text);font-size:1rem;margin-top:.35rem}
.path .sub p{margin:.8rem 0 0;color:var(--muted);font-size:.95rem}
@media(max-width:520px){.path .step{grid-template-columns:1fr;gap:6px}}
/* ---- big compare ---- */
.versus{display:grid;grid-template-columns:1fr auto 1fr;gap:24px;align-items:center;
  background:var(--panel-2);border:1px solid var(--line);border-radius:var(--radius-lg);
  padding:32px;margin:2rem 0;text-align:center}
.versus .fig{font-family:var(--font-display);font-size:clamp(2rem,6vw,3.2rem);color:var(--accent);line-height:1}
.versus .lab{font-size:.78rem;letter-spacing:var(--ls-eyebrow);text-transform:uppercase;
  color:var(--faint);margin-top:.5rem}
.versus .mid{color:var(--faint);font-size:.9rem}
.versus + .vcap{color:var(--muted);font-size:.95rem;margin-top:-1rem;text-align:center;max-width:none}
@media(max-width:640px){.versus{grid-template-columns:1fr;gap:16px}}
/* ---- tables ---- */
table.mc{width:100%;border-collapse:collapse;margin-top:1.2rem;font-size:.94rem}
table.mc th, table.mc td{text-align:left;padding:12px 14px;border-bottom:1px solid var(--line-soft);vertical-align:top}
table.mc thead th{color:var(--accent-soft);font-weight:500;font-size:.72rem;
  letter-spacing:var(--ls-eyebrow);text-transform:uppercase;border-bottom:1px solid var(--line)}
table.mc th[scope=row]{color:var(--text-hi);font-weight:600}
.tscroll{overflow-x:auto;-webkit-overflow-scrolling:touch}
.tscroll:focus-visible{outline:2px solid var(--focus-ring)}
@media(max-width:760px){
  table.mc td:first-child,table.mc th:first-child{position:sticky;left:0;
    background:var(--section-bg);box-shadow:1px 0 0 var(--line-soft)}
}
/* ---- flags ---- */
.flag{display:inline-block;font-size:.62rem;letter-spacing:.14em;text-transform:uppercase;
  padding:3px 8px;border-radius:var(--radius-pill);margin-left:6px;font-weight:600;white-space:nowrap}
.flag-mc{background:rgba(201,97,74,.2);color:#e8a894;border:1px solid rgba(201,97,74,.45)}
.flag-pub{background:rgba(127,176,105,.16);color:#a8d194;border:1px solid rgba(127,176,105,.4)}
.flag-un{background:rgba(156,138,114,.16);color:var(--faint);border:1px solid var(--line-soft)}
/* ---- disclosure ---- */
details.disc{border:1px solid var(--line-soft);border-radius:var(--radius-lg);
  background:var(--panel-2);margin-bottom:12px}
details.disc>summary{cursor:pointer;padding:16px 22px;list-style:none;display:flex;
  justify-content:space-between;align-items:center;gap:16px;color:var(--text-hi);font-weight:600;
  border-radius:var(--radius-lg)}
details.disc>summary::-webkit-details-marker{display:none}
details.disc>summary::after{content:"+";color:var(--accent);font-size:1.3rem;line-height:1}
details.disc[open]>summary::after{content:"–"}
.disc-body{padding:0 22px 20px;color:var(--muted);font-size:.96rem}
/* ---- segmented / choice cards ---- */
.choice{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(240px,100%),1fr));gap:14px;margin:1.2rem 0}
.choice button{text-align:left;background:var(--bg);border:1px solid var(--line-soft);
  border-radius:var(--radius-md);padding:18px 20px;cursor:pointer;color:var(--text);font-family:inherit;
  transition:border-color var(--dur),background var(--dur)}
.choice button:hover{border-color:var(--line);background:var(--panel-3)}
.choice button[aria-pressed="true"]{border-color:var(--accent);background:rgba(217,154,63,.1)}
.choice .t{font-weight:600;color:var(--text-hi);display:flex;align-items:center;gap:8px}
.choice button[aria-pressed="true"] .t::before{content:"✓";color:var(--accent)}
.choice .d{font-size:.88rem;color:var(--muted);margin-top:.3rem}
/* ---- assessment: single sheet, native radios ---- */
.quiz{background:var(--panel-2);border:1px solid var(--line);border-radius:var(--radius-lg);
  padding:clamp(22px,4vw,38px);margin-top:2rem}
.qgroup{border:0;margin:0 0 2rem;padding:0;scroll-margin-top:150px}
.qgroup legend{padding:0;font-weight:600;color:var(--text-hi);font-size:1.02rem;
  display:flex;gap:12px;align-items:baseline;max-width:62ch}
.qgroup legend .qn{font-family:var(--font-display);color:var(--accent);font-size:1.1rem;flex:0 0 auto}
.qgroup.missing legend{border-left:3px solid var(--accent);padding-left:12px;margin-left:-15px}
.opts{display:grid;gap:9px;margin:.9rem 0 0}
.opt{position:relative;display:block}
.opt input{position:absolute;opacity:0;width:1px;height:1px}
.opt span.lbl{display:flex;align-items:flex-start;gap:13px;cursor:pointer;
  background:var(--bg);border:1px solid var(--line-soft);border-radius:var(--radius-md);
  padding:14px 17px;font-size:.96rem;min-height:44px;
  transition:border-color var(--dur),background var(--dur)}
.opt span.lbl:hover{border-color:var(--line);background:var(--panel-3)}
.opt .box{width:16px;height:16px;border:1px solid var(--line-hard);border-radius:50%;
  flex:0 0 auto;margin-top:3px}
.opt input:checked + span.lbl{border-color:var(--accent);background:rgba(217,154,63,.09);font-weight:500}
.opt input:checked + span.lbl .box{background:var(--accent);box-shadow:inset 0 0 0 3px var(--panel-2)}
.opt input:checked + span.lbl::after{content:"✓";margin-left:auto;color:var(--accent);font-weight:700}
.opt input:focus-visible + span.lbl{outline:2px solid var(--focus-ring);outline-offset:2px}
.opt.cb .box{border-radius:4px}
.reveal{margin-top:11px;padding:15px 18px;border-radius:var(--radius-md);font-size:.93rem;
  border:1px solid var(--line-soft);background:var(--bg);color:var(--muted)}
.reveal.good{border-color:rgba(127,176,105,.45)}
.reveal.bad{border-color:rgba(201,97,74,.45)}
.reveal b{color:var(--text-hi)}
.qsticky{position:sticky;bottom:0;background:var(--panel-2);border-top:1px solid var(--line);
  margin:0 clamp(-22px,-4vw,-38px) clamp(-22px,-4vw,-38px);
  padding:14px clamp(22px,4vw,38px) calc(14px + env(safe-area-inset-bottom));
  display:flex;justify-content:space-between;align-items:center;gap:14px;flex-wrap:wrap;
  border-radius:0 0 var(--radius-lg) var(--radius-lg);z-index:5}
.qcount{font-size:.86rem;color:var(--muted);font-variant-numeric:tabular-nums}
/* ---- readiness output (NOT a score) ---- */
#qresult{scroll-margin-top:140px}
.tl{background:var(--bg);border:1px solid var(--line-soft);border-radius:var(--radius-md);
  padding:26px 24px;margin:1.4rem 0}
.tl-track{position:relative;height:8px;background:var(--line-soft);border-radius:5px;margin:34px 0 12px}
.tl-fill{position:absolute;left:0;top:0;bottom:0;border-radius:5px;
  background:linear-gradient(90deg,var(--accent-deep,#a9701f),var(--accent-soft))}
.tl-avg{position:absolute;top:-9px;bottom:-9px;width:2px;background:var(--faint)}
.tl-avg span{position:absolute;top:-24px;left:50%;transform:translateX(-50%);white-space:nowrap;
  font-size:.68rem;letter-spacing:.1em;text-transform:uppercase;color:var(--faint)}
.tl-scale{display:flex;justify-content:space-between;font-size:.74rem;color:var(--faint);
  font-variant-numeric:tabular-nums}
.tl-head{font-family:var(--font-display);font-size:clamp(1.5rem,4vw,2.1rem);color:var(--text-hi);line-height:1.2}
.dims{list-style:none;padding:0;margin:1.4rem 0 0}
.dims li{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:12px 16px;align-items:center;padding:14px 0;
  border-top:1px solid var(--line-soft)}
.dims li:last-child{border-bottom:1px solid var(--line-soft)}
.dims .dn{color:var(--text);font-size:.96rem}
.dims .dn small{display:block;color:var(--faint);font-size:.83rem;margin-top:2px}
.state{font-size:.72rem;letter-spacing:var(--ls-btn);text-transform:uppercase;font-weight:600;
  padding:6px 14px;border-radius:var(--radius-pill);white-space:nowrap}
.state.s3{background:rgba(127,176,105,.16);color:#a8d194;border:1px solid rgba(127,176,105,.4)}
.state.s2{background:rgba(217,154,63,.14);color:var(--accent-soft);border:1px solid var(--line)}
.state.s1{background:rgba(201,97,74,.16);color:#e8a894;border:1px solid rgba(201,97,74,.4)}
/* three callout types — a key fact, a caveat, and an editorial note are not the same thing */
.keyfact{background:rgba(217,154,63,.06);border:1px solid var(--line);border-left:3px solid var(--accent);
  border-radius:var(--radius-md);padding:20px 24px;font-size:1rem;color:var(--text);margin:1.4rem 0}
.keyfact p{color:var(--muted);font-size:.95rem}
.caveat, .notprediction{background:var(--bg);border:1px solid var(--line-soft);border-left:3px solid var(--faint);
  border-radius:var(--radius-md);padding:16px 20px;font-size:.92rem;color:var(--muted);margin:1.2rem 0}
.editorial{background:rgba(201,97,74,.09);border:1px dashed rgba(201,97,74,.5);
  border-radius:var(--radius-md);padding:16px 20px;font-size:.92rem;color:#e8a894;margin:1.2rem 0}
/* editorial layer — placeholder flags hidden unless ?edit is in the URL */
body:not(.editing) .flag-mc, body:not(.editing) .editorial{display:none}
.gaplist{list-style:none;padding:0;margin:1rem 0}
.gaplist li{padding:13px 0;border-top:1px solid var(--line-soft);display:flex;gap:14px;align-items:baseline}
.gaplist li:last-child{border-bottom:1px solid var(--line-soft)}
.review{margin:1.6rem 0}
.review .rr{display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:6px 14px;align-items:baseline;
  padding:12px 0;border-top:1px solid var(--line-soft);font-size:.9rem}
.review .rq{color:var(--muted)}
.review .ra{color:var(--text-hi)}
.review button{background:none;border:0;color:var(--accent-soft);cursor:pointer;
  font-family:inherit;font-size:.85rem;text-decoration:underline;padding:4px}
/* ---- calculator ---- */
.calc{display:grid;grid-template-columns:1fr 340px;gap:26px;margin-top:1.6rem;align-items:start}
@media(max-width:900px){.calc{grid-template-columns:1fr}}
.li{display:grid;grid-template-columns:minmax(0,1fr) 118px;gap:14px;align-items:center;padding:11px 0;
  border-top:1px solid var(--line-soft)}
.li.li-pair{grid-template-columns:minmax(0,1fr) 176px}
.li:first-of-type{border-top:0}
.li label{font-size:.94rem;color:var(--text)}
.li label small{display:block;color:var(--faint);font-size:.82rem;margin-top:2px}
.li input[type=number]{width:100%;min-width:0;background:var(--bg);border:1px solid var(--line-soft);
  border-radius:var(--radius-sm);color:var(--text);padding:11px 8px;font-family:inherit;font-size:.95rem;
  font-variant-numeric:tabular-nums;min-height:44px;appearance:textfield;-moz-appearance:textfield}
.li input[type=number]::-webkit-outer-spin-button, .li input[type=number]::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
.li .pair{display:flex;gap:8px;align-items:center;min-width:0}
.li .pair input{width:auto;flex:1 1 0;min-width:0}
.li .pair .x{color:var(--faint);font-size:.9rem;flex:0 0 auto}
@media(max-width:560px){
  .li,.li.li-pair{grid-template-columns:1fr;gap:8px}
}
.summary{background:var(--panel-2);border:1px solid var(--line);border-radius:var(--radius-lg);
  padding:24px;position:sticky;top:calc(var(--stick) + 20px)}
@media(max-width:900px){
  .calc>div{order:2}
  .summary{order:1;position:sticky;top:var(--stick);margin-bottom:8px}
}
.sline{display:flex;justify-content:space-between;gap:12px;padding:7px 0;font-size:.91rem;color:var(--muted)}
.sline span:last-child{font-variant-numeric:tabular-nums;color:var(--text)}
.sline.total{border-top:1px solid var(--line);margin-top:10px;padding-top:14px;color:var(--text-hi)}
.bigrange{font-family:var(--font-display);font-size:clamp(1.4rem,3.4vw,1.9rem);color:var(--accent);
  line-height:1.15;font-variant-numeric:tabular-nums;margin:.2rem 0}
.midpoint{font-size:.8rem;color:var(--faint);font-variant-numeric:tabular-nums}
.snote{font-size:.87rem;color:var(--muted);margin-top:1rem;padding-top:14px;border-top:1px solid var(--line-soft)}
.snote strong{color:var(--accent-soft)}
.pathtotal{margin-top:16px;padding-top:14px;border-top:1px solid var(--line)}
.hide{display:none!important}
.disclaim{background:rgba(201,97,74,.07);border:1px solid rgba(201,97,74,.3);
  border-radius:var(--radius-md);padding:16px 20px;font-size:.92rem;color:var(--muted);margin:1.3rem 0}
.rateblock{background:var(--panel-2);border:1px solid var(--line);border-radius:var(--radius-lg);
  padding:26px;margin:1.6rem 0}
.rateblock .r{display:flex;justify-content:space-between;gap:16px;padding:12px 0;flex-wrap:wrap;
  border-top:1px solid var(--line-soft);font-size:.95rem}
.rateblock .r:first-of-type{border-top:0}
.rateblock .r b{font-variant-numeric:tabular-nums;color:var(--accent);font-weight:600}
.optin{display:flex;gap:12px;align-items:flex-start;margin:1rem 0;font-size:.91rem;color:var(--muted)}
.optin input{margin-top:4px;accent-color:var(--accent);width:18px;height:18px;flex:0 0 auto}
.emailrow{display:flex;gap:10px;flex-wrap:wrap;margin-top:.6rem}
.emailrow input[type=email]{flex:1 1 240px;background:var(--bg);border:1px solid var(--line-soft);
  border-radius:var(--radius-pill);color:var(--text);padding:13px 20px;font-family:inherit;min-height:44px}
.askbox{background:var(--panel-2);border:1px solid var(--line);border-radius:var(--radius-lg);
  padding:26px;margin-top:2rem}
.askbox textarea{width:100%;background:var(--bg);border:1px solid var(--line-soft);
  border-radius:var(--radius-md);color:var(--text);padding:13px;font-family:inherit;
  font-size:.96rem;min-height:80px;margin-top:.7rem}
/* Live region under the ask box. min-height reserves the line so the message
   appearing does not shift the button out from under the cursor. */
.askstatus{font-size:.93rem;color:var(--muted);margin:.8rem 0 0;min-height:1.25em}
/* Fine print under the ask box. Dimmer than .askstatus, which is feedback. */
.asknote{font-size:.86rem;color:var(--faint);margin:.9rem 0 0;max-width:60ch}
.askstatus a{color:var(--accent-soft)}
.privacy{font-size:.87rem;color:var(--faint);border-top:1px solid var(--line-soft);
  margin-top:1.6rem;padding-top:1.2rem}
/* ================= MOBILE ================= */
@media(max-width:760px){
  /* the versus block squeezes badly between 640 and 760 */
  .versus{grid-template-columns:1fr;gap:14px;padding:24px 20px}
  .versus .mid{opacity:.7}
  /* tables get tighter padding so more fits before scrolling */
  table.mc th,table.mc td{padding:10px}
  table.mc{font-size:.88rem}
  /* sticky first column needs a hard edge, not just a hairline */
  table.mc td:first-child,table.mc th:first-child{box-shadow:2px 0 6px rgba(0,0,0,.35)}
  .tscroll{position:relative}
  /* the section index reads better stacked */
  .toc{padding:22px;gap:18px}
}
@media(max-width:600px){
  /* answer review: question over answer, change link to the right */
  .review .rr{grid-template-columns:minmax(0,1fr) auto}
  .review .rq{grid-column:1/-1;font-size:.86rem}
  /* readiness dimensions stack rather than squeezing the pill */
  .dims li{grid-template-columns:1fr}
  .dims .state{justify-self:start}
  /* numbered steps lose the gutter */
  .path .step{grid-template-columns:1fr;gap:4px;padding:20px 0}
  .path .n{font-size:1.2rem}
  /* quiz footer stays reachable and the button goes full width */
  .qsticky{flex-direction:column;align-items:stretch;gap:10px}
  .qsticky .btn{justify-content:center}
  .qcount{text-align:center}
  /* email row stops being a cramped two-up */
  .emailrow{flex-direction:column}
  .emailrow .btn{justify-content:center}
  .cta-row .btn{flex:1 1 100%;justify-content:center}
  /* choice cards */
  .choice{gap:10px}
  .choice button{padding:16px}
  /* headings: Aboreto is wide, give it room */
  .section-head h2{max-width:100%}
  h1{max-width:100%}
  /* callouts and cards lose their generous padding */
  .keyfact,.caveat,.notprediction,.editorial{padding:16px 18px}
  .card{padding:24px 20px}
  .quiz{padding:20px 16px}
  .qsticky{margin:0 -16px -20px;padding:14px 16px calc(14px + env(safe-area-inset-bottom))}
  .summary{padding:20px}
  /* the big money figure must not overflow */
  .bigrange{font-size:1.35rem;overflow-wrap:anywhere}
  .versus .fig{font-size:2rem;overflow-wrap:anywhere}
  /* timeline scale labels */
  .tl{padding:20px 16px}
  .tl-scale{font-size:.68rem}
  .tl-avg span{font-size:.62rem}
}
@media(max-width:400px){
  .tl-avg span{display:none}
  .secbar a{font-size:.7rem}
  .rateblock{padding:20px 16px}
}
/* touch targets everywhere */
@media(hover:none){
  .secbar a{padding:12px 2px}
  .toc li{padding:0}
  .toc a{display:block;padding:11px 0;min-height:44px}
  .review button{padding:12px 6px;min-height:44px}
  .li input[type=number]{font-size:16px}   /* stops iOS zooming on focus */
  .emailrow input[type=email],.askbox textarea{font-size:16px}
}
@media print{
  header.site,.secbar,footer.site,.btn,.qsticky,.opts,.choice,.optin,.emailrow,.askbox,
  .toc,.skip,.review button,#quiz{display:none!important}
  body{background:#fff;color:#111;font-size:11pt}
  .block,.block.tint{background:#fff;padding:10px 0;--section-bg:#fff}
  h1,h2,h3,h4,.tl-head,.bigrange{color:#111}
  details.disc,details.disc .disc-body{display:block!important}
  details.disc>summary::after{content:""}
  .summary{position:static;border:1px solid #999}
  .sline,.li label,.snote,.dims .dn,p,.lede{color:#222}
  .state{border:1px solid #666;color:#111}
  .print-only{display:block!important}
  a[href^="#"]{text-decoration:none;color:#111}
}
.print-only{display:none}