/* The Wheel — v20 QUIET EVOLUTION.
   Loads after site.css on index.html only (for now). Changes materials, not
   bones: every layout, section, and spacing decision from v19 stands.

   What changes:
   1. Typefaces. Georgia italic gives way to Source Serif 4 italic; the system
      sans gives way to Archivo; JetBrains Mono appears only where the record
      speaks (receipts, gates, citations). All three ship self-hosted from
      assets/fonts, keeping the site's own receipt true.
   2. Color. Paper takes a deliberate olive cast, ink deepens to Black Fig
      (the product brand), and bright verdigris #0A947A becomes a working
      accent for text and marks only. It is never a background.
   3. One signature moment: the hero custody flow assembles itself once on
      load. Airy, brief, and never load-bearing.                              */

/* ── Self-hosted faces (staged in v19 assets/fonts, now wired) ─────────── */
@font-face{
  font-family:"Archivo";
  src:url("fonts/archivo-latin.woff2") format("woff2");
  font-weight:100 900; font-style:normal; font-display:swap;
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
@font-face{
  font-family:"Archivo";
  src:url("fonts/archivo-latin-ext.woff2") format("woff2");
  font-weight:100 900; font-style:normal; font-display:swap;
  unicode-range:U+0100-024F,U+0259,U+1E00-1EFF,U+2020,U+20A0-20AB,U+20AD-20CF,U+2113,U+2C60-2C7F,U+A720-A7FF;
}
@font-face{
  font-family:"JetBrains Mono";
  src:url("fonts/jetbrains-mono-latin.woff2") format("woff2");
  font-weight:400 800; font-style:normal; font-display:swap;
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
@font-face{
  font-family:"JetBrains Mono";
  src:url("fonts/jetbrains-mono-latin-ext.woff2") format("woff2");
  font-weight:400 800; font-style:normal; font-display:swap;
  unicode-range:U+0100-024F,U+0259,U+1E00-1EFF,U+2020,U+20A0-20AB,U+20AD-20CF,U+2113,U+2C60-2C7F,U+A720-A7FF;
}
@font-face{
  font-family:"Source Serif 4";
  src:url("fonts/source-serif-4-italic-latin.woff2") format("woff2");
  font-weight:400; font-style:italic; font-display:swap;
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
@font-face{
  font-family:"Source Serif 4";
  src:url("fonts/source-serif-4-italic-latin-ext.woff2") format("woff2");
  font-weight:400; font-style:italic; font-display:swap;
  unicode-range:U+0100-024F,U+0259,U+1E00-1EFF,U+2020,U+20A0-20AB,U+20AD-20CF,U+2113,U+2C60-2C7F,U+A720-A7FF;
}

:root{
  --serif:"Source Serif 4",Georgia,"Times New Roman",serif;
  --sans:"Archivo",ui-sans-serif,system-ui,sans-serif;
  --mono:"JetBrains Mono",ui-monospace,SFMono-Regular,Menlo,monospace;
}

/* ── Color drift (light theme; dark theme keeps v19 values for now) ────── */
:root{
  --bg:#EFEDE0;            /* olive-cast paper, decisively not the generic cream */
  --bg-header:#E9E6D6;
  --bg-2:#DEDAC6;
  --bg-dark:#1C111B;       /* Black Fig, matching the product brand */
  --ink:#1C111B;
  --ink-mid:#3A3138;
  --ink-soft:#6F6B5C;
  --rule:#C4BFA9;
  --vd:#2C6455;            /* surfaces and buttons: the muted verdigris */
  --vd-b:#0E6E85;          /* text and marks only. Never a background. */
}

/* ── Typography: same sizes and rhythm, better voices ─────────────────── */
body{font-family:var(--sans);}
h1,h2{font-family:var(--serif);font-style:italic;font-weight:400;letter-spacing:-.008em;}
.keyline,.serif-turn{font-family:var(--serif);}
.hero h1{font-size:clamp(38px,5vw,68px);line-height:1.05;}

/* the record speaks in mono, and only the record */
.ledger-head,.ledger-num,.ledger-tear,.proof-cite,
.flow-title,.flow-label,.flow-gate,.flow-foot,
.prove-strip,.cta-note,.fb-url{font-family:var(--mono);}
.ledger-num{font-weight:500;color:var(--vd-b);} /* display-size numerals: AA-large */
.flow-gate{color:var(--vd);letter-spacing:.1em;}
.proof-cite{letter-spacing:.04em;}

/* brand presence: the wordmark stops whispering */
.nav .wordmark{font-size:12.5px;letter-spacing:.38em;font-weight:700;}

/* body-size text accents stay on the muted verdigris (5.8:1 on paper);
   the bright verdigris is reserved for display-size numerals and marks */
.btn-link,.uc-card .go{color:var(--vd);}
a.btn-link:hover{color:var(--vd-b);}

/* a11y: the hero dock must not be reachable while visually hidden */
.hero-dock{visibility:hidden;}
.hero-dock.show{visibility:visible;}

/* mobile: the framed screenshot no longer pretends to be a scroll pane */
@media (max-width:760px){
  .two-col .fb-screen{overflow-x:hidden;}
  .two-col .fb-screen img{width:100%;max-width:100%;}
}

/* ── Signature moment: the custody flow assembles once ─────────────────
   Armed by JS immediately before the sequence starts; a JS failure can
   never blank the hero. Reduced motion never arms it.                    */
@media (prefers-reduced-motion: no-preference){
  .hero-flow.q-armed .q-step{opacity:0;transform:translateY(9px);transition:opacity .5s ease,transform .5s ease;}
  .hero-flow.q-armed .q-step.q-in{opacity:1;transform:none;}
}

/* one gentle rhythm break: the engine section's verdigris tint becomes
   perceivable (still the muted verdigris; the bright one stays text-only) */
.on-verdigris{background:color-mix(in srgb,var(--vd) 12%, var(--bg));}

/* ══ Blind-audit punch list (2026-08-19) ══════════════════════════════ */

/* 1 · Dark-mode contrast: secondary text and the green CTA reach AA.
   Selectors mirror site.css's dark scoping so specificity ties break on
   load order (quiet.css loads last). */
@media(prefers-color-scheme:dark){
  :root:not([data-theme=light]){--ink-soft:#8F8A7D;}
  :root:not([data-theme=light]) .btn-verdigris{background:#2C6455;border:1px solid #4A9278;}
}
:root[data-theme=dark]{--ink-soft:#8F8A7D;}
[data-theme=dark] .btn-verdigris{background:#2C6455;border:1px solid #4A9278;}

/* dark-band fine print lifted from 2.3-3.6:1 to 6:1+ */
.cta-note{font-size:12px;color:rgba(237,233,224,.6);}
.waitlist-form input::placeholder{color:rgba(237,233,224,.55);}
.wl-field-label{font-size:12.5px;color:rgba(237,233,224,.66);}
.wl-skip{color:rgba(237,233,224,.66);}

/* 3 · Small-type pass: load-bearing micro-copy reaches 12px (or close);
   purely decorative bits stay small */
.proof-cite{font-size:12px;}
.flow-title{font-size:11.5px;}
.flow-label{font-size:12px;}
.flow-gate{font-size:12px;}
.flow-hub-tag{font-size:11px;}
.flow-cell small{font-size:11.5px;}
.mono-note{font-size:11px;}
.ps-label{font-size:12px;}
.micro-strip{font-size:11px;}

/* 4 · Mid-page rhythm. The verdigris band becomes a real tonal shift
   (supersedes the 12% mix above); the olive fills move off the khaki
   surface onto paper so they read as palette members; thesis headings
   gain a step and connective headings get their own voice. */
.on-verdigris{background:color-mix(in srgb,var(--vd) 19%, var(--bg));border-top:2px solid var(--vd);}
.flow-shared{background:color-mix(in srgb,var(--vd) 13%, var(--bg));border-color:color-mix(in srgb,var(--vd) 45%, transparent);}
.callout{background:color-mix(in srgb,var(--vd) 8%, var(--bg));}
h2{font-size:clamp(28px,3.6vw,50px);}
h2.h-minor{font-family:var(--sans);font-style:normal;font-weight:700;font-size:clamp(20px,2.3vw,27px);letter-spacing:.005em;}
h2.h-minor .serif-turn{font-size:1.05em;}

/* 5 · Form accessibility: visible focus, everywhere it was missing */
.waitlist-form input:focus-visible{outline:2px solid var(--vd-b);outline-offset:2px;border-color:var(--vd-b);}
.wl-chip:focus-visible{outline:2px solid var(--vd-b);outline-offset:2px;}

/* 7 · Typed endings: only the homepage keeps the full dark band and form.
   Every other page closes in its own register, all routes leading to the
   one form on index. */
.coda{border-top:2px solid var(--ink);padding:64px 0 72px;background:var(--bg);}
.coda .eyebrow{margin-bottom:10px;}
.coda-actions{display:flex;gap:22px;align-items:center;flex-wrap:wrap;margin-top:24px;}
.coda .keyline{font-size:clamp(24px,3vw,36px);}
.coda-mono{padding:34px 0;}
.coda-mono-line{display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap;margin:0;font-family:var(--mono);font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-mid);}
.coda-mono-line a{color:var(--vd);font-weight:600;}

/* heading-order fixes keep their visual size */
.pillar-list h3{font-size:14.5px;font-weight:700;margin:0;}
.post-row h2{font-family:var(--serif);font-style:italic;font-weight:400;font-size:19px;margin:0 0 4px;letter-spacing:0;}
