/* ══════════════════════════════════════════════════════════
   TDA DESIGN TOKENS — v1.0
   Source of truth: BRIEF.md §1
   Do not add colors, fonts, or spacing values outside this file.
   ══════════════════════════════════════════════════════════ */

:root {
  /* ── Color ── */
  --bone:    #F2EEE8;   /* page background */
  --paper:   #FBF8F2;   /* panel / alt-section background */
  --bone-2:  #E8E2D8;
  --bone-3:  #D9D2C5;
  --ink:     #0E0E0C;   /* text + every border */
  --ink-2:   #1B1B19;
  --ink-3:   #2A2A26;
  --rule:    #BFB8AB;   /* hairline, secondary */
  --muted:   #6B675E;
  --red:     #E63946;   /* THE accent — used <8% of any page */

  /* ── Typography ── */
  --font-display: "Space Grotesk", sans-serif;
  --font-body:    "Inter", sans-serif;
  --font-mono:    "JetBrains Mono", ui-monospace, monospace;
  --font-serif:   "Source Serif 4", Georgia, serif;

  /* ── Spacing scale (use only these) ── */
  --sp-1:   8px;
  --sp-2:   12px;
  --sp-3:   16px;
  --sp-4:   24px;
  --sp-5:   32px;
  --sp-6:   48px;
  --sp-7:   64px;
  --sp-8:   96px;
  --sp-9:   112px;

  /* ── Section geometry ── */
  --section-pad-v: var(--sp-9);   /* 112px vertical */
  --section-pad-h: var(--sp-6);   /* 48px horizontal */
  --border:        1px solid var(--ink);
}