/* ============================================================
   tokens.css — Merkl design tokens (single source of truth)
   Light-committed. Every color is painted explicitly; the page
   never relies on host/browser theme. Values are verbatim §4.
   ============================================================ */

:root {
  /* ---- Color (warm near-white ground, warm charcoal ink, one orange) ---- */
  --paper:      #FAF8F3; /* page ground — warm near-white, chosen NOT cream       */
  --surface:    #FFFFFF; /* raised panels, the verify card                        */
  --ink:        #1A1712; /* headlines, body, and ASCII glyphs — warm near-black   */
  --muted:      #6E675C; /* secondary text, mono captions                         */
  --faint:      #A79E90; /* dim glyphs in the ambient field, hairline text        */
  --hair:       #E7E1D5; /* 1px rules, borders                                    */
  --accent:     #EE6A1A; /* THE orange — the single traveling accent              */
  --accent-ink: #B5490A; /* orange TEXT on paper — 5.0:1 on --paper (AA)         */
  --good:       #2FA36B; /* rare: a "verified/confirmed" semantic, used once      */
  --bad:        #D23B2E; /* rare: the "chain breaks" tamper beat only             */

  /* ---- Type roles (three faces — none of them the AI defaults) ---- */
  --font-display: "Instrument Serif", Georgia, "Times New Roman", serif;
  --font-body:    "Instrument Sans", system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  --font-mono:    "IBM Plex Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace;

  /* ---- Type scale (px): 13 · 15 · 18 · 22 · 32 · 48 · 72 · 112 ---- */
  --t-13: 0.8125rem;  /* 13 */
  --t-15: 0.9375rem;  /* 15 */
  --t-18: 1.125rem;   /* 18 */
  --t-22: 1.375rem;   /* 22 */
  --t-32: 2rem;       /* 32 */
  --t-48: 3rem;       /* 48 */
  --t-72: 4.5rem;     /* 72 */
  --t-112: 7rem;      /* 112 */
  /* Fluid roles derived from the scale */
  --t-hero: clamp(2.75rem, 1.3rem + 4.4vw, 5.5rem); /* H1: 44 → 88 responsive; keeps the hero CTA above the fold */
  --t-h2:   clamp(2rem, 1.4rem + 2.4vw, 3rem);    /* section headings → 48     */

  /* ---- Space scale (px): 4 · 8 · 12 · 16 · 24 · 40 · 64 · 96 · 160 ---- */
  --s-4: 0.25rem;
  --s-8: 0.5rem;
  --s-12: 0.75rem;
  --s-16: 1rem;
  --s-24: 1.5rem;
  --s-40: 2.5rem;
  --s-64: 4rem;
  --s-96: 6rem;
  --s-160: 10rem;

  /* ---- Structure ---- */
  --maxw: 1200px;              /* content max-width                         */
  --textw: 680px;             /* text column max-width (~65ch guardrail)   */
  --gutter: clamp(20px, 5vw, 64px);
  --header-h: 64px;
  --radius: 6px;              /* small, sparing — editorial, not SaaS      */
  --hairline: 1px solid var(--hair);
  --section-rhythm: clamp(6rem, 4rem + 8vw, 10rem); /* 96 → 160 */

  /* ---- Motion (defined here; consumed in Pass B) ---- */
  --ease-out: cubic-bezier(0.22, 1, 0.36, 1);
  --dur-fast: 160ms;
  --dur-med: 280ms;

  color-scheme: light;
}