/* ============================================================
   THE INTELLIGENCE LAYER — design tokens (rebrand surface)
   Every gold traces to the 8 official Momentum™ hexes.
   A B2B customer re-skins by editing ONLY:
     · the palette in config/brand.config.js (written to :root at boot), and
     · these 8 source hexes.
   ============================================================ */
:root {
  /* — surface — */
  --void-black:      #060606;                 /* page bg */
  --void-black-alt:  #0A0A0A;                 /* node card fill base */
  --surface-card:    rgba(18,16,12,0.62);     /* translucent node fill */
  --surface-card-hi: rgba(28,24,16,0.82);     /* hovered/active node fill */
  --surface-glass:   rgba(10,9,7,0.66);       /* nav / chips */

  /* — gold system (reel amber glow) — */
  --momentum-gold:   #C9A84C;                 /* primary edge + border */
  --deep-gold:       #A8893D;                 /* edge shadow / inactive border / seed dot */
  --light-gold:      #D4B85A;                 /* particles, highlights, brain dot */
  --gold-glow:       #E6C766;                 /* brightest particle head */
  --gold-faint:      rgba(201,168,76,0.16);   /* idle edges, hairlines */
  --gold-hair:       rgba(201,168,76,0.22);

  /* — cream / text — */
  --warm-cream:      #E8E6E3;                 /* node headings */
  --light-cream:     #F5F3EE;                 /* hero headline */
  --muted-cream:     #B8B5B0;                 /* mono subtitles, legend */
  --mono-dim:        #8A857C;                 /* footnotes */

  /* — derived rgb (canvas rgba composition) — */
  --rgb-gold:        201,168,76;
  --rgb-light-gold:  212,184,90;
  --rgb-glow:        230,199,102;

  --vignette-edge:   rgba(0,0,0,0.85);

  /* — fonts — */
  --font-display: 'Cormorant Garamond', Georgia, 'Times New Roman', serif;
  --font-body:    'Montserrat', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --font-utility: 'Trebuchet MS', 'Lucida Grande', sans-serif;
  --font-mono:    'JetBrains Mono', ui-monospace, 'SFMono-Regular', Menlo, 'Cascadia Code', monospace;

  /* — type scale (clamp, base 16px) — */
  --fs-hero:  clamp(2.75rem, 6vw, 5.25rem);
  --fs-h2:    clamp(2rem, 4vw, 3.25rem);
  --fs-h3:    clamp(1.25rem, 2vw, 1.6rem);
  --fs-lead:  clamp(1.05rem, 1.4vw, 1.25rem);
  --fs-body:  1rem;
  --fs-small: 0.875rem;
  --fs-pill:       11px;
  --fs-node-title: 17px;
  --fs-node-sub:   11px;
  --fs-edge-label: 10px;
  --fs-section:    13px;
  --fs-legend:     11px;

  /* — radii — */
  --r-card: 14px;  --r-pill: 9999px;  --r-sm: 8px;  --r-btn: 10px;

  /* — easing — */
  --dramatic: cubic-bezier(0.16,1,0.3,1);
  --fast:     cubic-bezier(0.4,0,0.2,1);
  --t-fast: 200ms; --t-normal: 320ms; --t-slow: 520ms; --t-drama: 820ms;

  /* — DOM glow recipes — */
  --glow-card:
    0 0 0 1px rgba(var(--rgb-gold),0.42),
    0 0 22px -4px rgba(var(--rgb-gold),0.30),
    inset 0 0 30px -18px rgba(var(--rgb-glow),0.55);
  --glow-card-hover:
    0 0 0 1px rgba(var(--rgb-light-gold),0.80),
    0 0 40px -2px rgba(var(--rgb-gold),0.45),
    0 12px 40px -12px rgba(0,0,0,0.8),
    inset 0 0 36px -16px rgba(var(--rgb-glow),0.70);
  --glow-focal:
    0 0 60px -6px rgba(var(--rgb-gold),0.55),
    0 0 120px -10px rgba(var(--rgb-glow),0.30);
  --glow-pill:      0 0 14px -3px rgba(var(--rgb-gold),0.5);
  --glow-btn-hover: 0 0 28px -4px rgba(var(--rgb-gold),0.6);

  /* — layout — */
  --maxw: 1200px;

  /* — spacing scale (fluid; consumed by section padding) — */
  --space-2xl: clamp(28px, 4vw, 40px);
  --space-3xl: clamp(40px, 6vw, 56px);
  --space-4xl: clamp(56px, 8vw, 80px);
  --space-5xl: clamp(72px, 10vw, 116px);
}

@media (prefers-reduced-motion: reduce) {
  :root { --t-fast: 1ms; --t-normal: 1ms; --t-slow: 1ms; --t-drama: 1ms; }
}
