/* ═══════════════════════════════════════════════════════
   FORGE — Design Tokens
   The single source of truth for every visual decision.
   No color value, spacing value, or font reference
   exists anywhere else in the system.
   ═══════════════════════════════════════════════════════ */

:root {

  /* ── Core Surfaces ────────────────────────────────── */
  --obsidian:     #1A1714;   /* Primary background — warm near-black */
  --n1:           #0F0D0B;   /* Deepest surface */
  --n2:           #1A1714;   /* = obsidian */
  --n3:           #252018;   /* Elevated surface */
  --n4:           #312A21;   /* Card surface / divider */
  --n5:           #4A3F33;   /* Inactive states */
  --n6:           #7A6E62;   /* Subdued text / section labels */
  --n7:           #A89C90;   /* Secondary text */
  --n8:           #D4C8BC;   /* Tertiary text */
  --bone:         #E8E0D5;   /* Primary body text on dark */

  /* ── Brand Colors ─────────────────────────────────── */
  --amber:        #E8832A;   /* Active arc / ember bright / primary CTA */
  --amber-dark:   #C4701A;   /* CTA hover / amber on light bg (WCAG AA) */
  --kintsugi:     #C4741E;   /* Kintsugi scar — arc visualization ONLY */
  --ash:          #7A8085;   /* Arc gap sections — gap visualization ONLY */

  /* ── Semantic Aliases ─────────────────────────────── */
  --bg:           var(--obsidian);
  --bg-raised:    var(--n3);
  --bg-card:      var(--n4);
  --text-primary: var(--bone);
  --text-secondary: var(--n7);
  --text-muted:   var(--n6);
  --border:       var(--n4);
  --accent:       var(--amber);

  /* ── Typefaces ────────────────────────────────────── */
  --font-serif:  'Source Serif 4', Georgia, serif;
  --font-sans:   'Inter', -apple-system, sans-serif;

  /* ── Type Scale ───────────────────────────────────── */
  --text-xs:     11px;
  --text-sm:     13px;
  --text-base:   16px;
  --text-md:     17px;
  --text-lg:     20px;
  --text-xl:     24px;
  --text-2xl:    32px;
  --text-3xl:    clamp(2rem, 5vw, 3.2rem);
  --text-display: clamp(2.4rem, 6vw, 4rem);

  /* ── Weight ───────────────────────────────────────── */
  --weight-light:   300;
  --weight-regular: 400;
  --weight-medium:  500;
  --weight-semi:    600;

  /* ── Line Heights ─────────────────────────────────── */
  --leading-tight:  1.2;
  --leading-normal: 1.5;
  --leading-relaxed: 1.7;
  --leading-loose:  1.9;

  /* ── Letter Spacing ───────────────────────────────── */
  --tracking-tight:  -0.02em;
  --tracking-normal:  0em;
  --tracking-wide:    0.06em;
  --tracking-wider:   0.10em;
  --tracking-label:   0.12em;

  /* ── Paragraph ────────────────────────────────────── */
  --measure:       65ch;
  --measure-narrow: 45ch;

  /* ── Spacing ──────────────────────────────────────── */
  --space-1:   4px;
  --space-2:   8px;
  --space-3:   12px;
  --space-4:   16px;
  --space-5:   20px;
  --space-6:   24px;
  --space-8:   32px;
  --space-10:  40px;
  --space-12:  48px;
  --space-16:  64px;
  --space-20:  80px;
  --space-24:  96px;
  --space-32:  128px;
  --space-40:  160px;

  /* ── Layout ───────────────────────────────────────── */
  --container-max:  1080px;
  --container-wide: 1200px;
  --content-max:    720px;
  --side-pad:       clamp(16px, 5vw, 80px);
  --section-pad-y:  clamp(80px, 10vw, 160px);

  /* ── Easing ───────────────────────────────────────── */
  --ease-out:        cubic-bezier(0.25, 0.46, 0.45, 0.94);
  --ease-in-out:     cubic-bezier(0.45, 0, 0.55, 1);
  --ease-decel:      cubic-bezier(0.0, 0.0, 0.2, 1);

  /* ── Duration ─────────────────────────────────────── */
  --dur-instant:     80ms;
  --dur-fast:        200ms;
  --dur-normal:      400ms;
  --dur-slow:        600ms;
  --dur-deliberate:  800ms;
  --dur-arc:         2000ms;
  --dur-ember:       5000ms;
  --dur-fade:        4000ms;
}
