/* tokens.css — Imanaka Asato design system (Modern Tropics, enforced)
   Single source of truth. Phase 3 of REBUILD-PROMPT.
   Fixes the demo drift: PRD Koolau Moss + Cormorant, never the green #14b869 / DM-Sans-display. */

:root {
  /* ---- Palette: Koʻolau / Volcanic ---- */
  --color-primary:    #2A3F35; /* Koolau Moss   — accents, active states */
  --color-background: #F5F4F0; /* Sandstone     — page bg */
  --color-surface:    #EBE9E4; /* Limestone     — cards, secondary sections */
  --color-text:       #1A1A1A; /* Volcanic Ash  — headings, body */
  --color-muted:      #5C5C5C; /* Pahoehoe (darkened for AA body text; PRD #7A7A7A reserved for hairlines) */
  --color-muted-soft: #7A7A7A; /* original Pahoehoe — decorative only, never body copy */
  --color-accent:     #8C7355; /* Koa Wood      — hover, subtle highlights */
  --color-federal:    #1C2A3A; /* Deep slate    — ONLY the D.C. pole of the pipeline */
  --color-line:       #D1CDC4; /* hairline border */
  --color-on-dark:        #F2F1EC; /* text on moss/slate */
  --color-on-dark-muted:  #AEB4B0;

  /* ---- Type families ---- */
  --font-heading: 'Cormorant Garamond', Georgia, 'Times New Roman', serif;
  --font-body:    'DM Sans', system-ui, -apple-system, sans-serif;

  /* ---- Fluid type scale ---- */
  --fs-display: clamp(3.25rem, 8.5vw, 7.5rem);  /* hero, up to ~120px */
  --fs-h1:      clamp(2.5rem, 5.5vw, 5rem);
  --fs-h2:      clamp(1.9rem, 3.6vw, 3.25rem);
  --fs-h3:      clamp(1.4rem, 2.2vw, 2rem);
  --fs-lede:    clamp(1.125rem, 1.5vw, 1.375rem);
  --fs-body:    1rem;        /* 16px min — no iOS zoom */
  --fs-meta:    0.8125rem;
  --fs-label:   0.75rem;     /* 12px tracked uppercase */
  --leading-body: 1.6;
  --leading-tight: 1.02;

  /* ---- Letterspacing ---- */
  --track-label: 0.16em;
  --track-btn:   0.12em;
  --track-brand: 0.28em;

  /* ---- Space scale (8px base) ---- */
  --sp-1: 8px;  --sp-2: 16px; --sp-3: 24px; --sp-4: 32px;
  --sp-6: 48px; --sp-8: 64px; --sp-12: 96px; --sp-16: 120px; --sp-20: 160px;

  /* ---- Layout ---- */
  --gutter: clamp(20px, 5vw, 64px);
  --maxw: 1320px;
  --measure: 60ch;
  --header-h: 76px;

  /* ---- Shape & motion ---- */
  --radius: 0px;            /* sharp corners everywhere */
  --cursor-size: 12px;
  --ease: cubic-bezier(0.22, 1, 0.36, 1);
  --ease-soft: cubic-bezier(0.4, 0, 0.2, 1);
  --dur: 0.6s;
  --dur-fast: 0.3s;
}
