:root {
  /* Colors — Warm System */
  --color-midnight-ink:  #0D0D0D;
  --color-paper-white:   #FFFFFF;
  --color-fossil:        #F7F5F3;
  --color-dusty-ash:     #6E6A69;
  --color-pewter:        #9A9796;
  --color-terracotta:    #D15430;
  --color-harvest-gold:  #EAC7A0;
  --color-cardinal-red:  #BC361B;

  /* Colors — Dark Green System */
  --color-midnight-emerald: #072724;
  --color-ghost-jade:       #23524c;
  --color-aura-mint:        #97fcd7;
  --color-ceramic-white:    #ffffff;
  --color-slate-border:     #2c2e33;
  --color-platinum-ghost:   #b0c5c1;
  --color-ash-text:         #0f3933;
  --color-deep-teal:        #33998c;

  /* Typography — Font Families */
  --font-bebas-neue: 'Bebas Neue', ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  /* PDF body (letter/wide one-pagers) — kept condensed for the dense fixed layouts. */
  --font-barlow-condensed: 'Barlow Condensed', ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  /* Web body — Barlow (regular width), switched from condensed for legibility. */
  --font-body: 'Barlow', ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --font-pp-editorial-new: var(--font-bebas-neue);
  --font-switzer: 'Switzer', ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --font-arial: 'Arial', ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --font-system-ui: 'system-ui', ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;

  /* Typography — Functional Scale (hero is the ceiling)
     Anchor: hero h1 maxes at ~56px (3.5rem). Nothing exceeds it.
     Use these tokens — do NOT introduce one-off clamp() calls per section. */
  --text-caption:    0.78rem;                          /* 12.5px — eyebrow caps, nav links, table heads (bumped from 11.5 for legibility) */
  --text-meta:       0.82rem;                          /* 13.1px — micro labels (bumped from 12.5) */
  --text-body-sm:    0.9rem;                           /* 14.4px — secondary body */
  --text-body:       1rem;                             /* 16px   — base body */
  --text-body-lg:    clamp(1rem, 1.1vw, 1.1rem);       /* 16→17.6 — hero/section body */
  --text-card-title: clamp(1.5rem, 2vw, 1.75rem);       /* 24→28   — feature card titles */
  --text-subheading: clamp(1.25rem, 1.6vw, 1.5rem);    /* 20→24   — card titles, sub-claims */
  --text-section:    clamp(1.85rem, 2.8vw, 2.75rem);   /* 29.6→44 — secondary section heads */
  --text-stat:       clamp(2rem, 3vw, 3.25rem);        /* 32→52   — large stat numbers */
  --text-display:    clamp(2.4rem, 3.5vw, 3.5rem);     /* 38.4→56 — hero h1 & primary section H2 (CEILING) */
  /* Decorative ghost numerals (process step numbers) — large but soft */
  --text-ghost:      clamp(4rem, 7vw, 6.5rem);         /* 64→104  — at low opacity, decorative only */

  /* Line heights */
  --leading-display:    1.02;
  --leading-section:    1.1;
  --leading-subheading: 1.2;
  --leading-body:       1.5;
  --leading-eyebrow:    1.4;

  /* Tracking */
  --tracking-display: 0.01em;
  --tracking-eyebrow: 0.14em;
  --tracking-label:   0.1em;

  /* Typography — Weights */
  --font-weight-regular: 400;
  --font-weight-medium: 500;
  --font-weight-semibold: 600;

  /* Spacing */
  --spacing-unit: 4px;
  --spacing-8: 8px;
  --spacing-12: 12px;
  --spacing-16: 16px;
  --spacing-20: 20px;
  --spacing-24: 24px;
  --spacing-32: 32px;
  --spacing-40: 40px;
  --spacing-56: 56px;
  --spacing-60: 60px;
  --spacing-80: 80px;
  --spacing-88: 88px;
  --spacing-116: 116px;
  --spacing-160: 160px;

  /* Layout */
  --page-max-width: 1200px;
  --section-gap: 30px;
  --card-padding: 40px;
  --element-gap: 16px;

  /* Border Radius */
  --radius-lg: 10px;
  --radius-xl: 13px;
  --radius-2xl: 16px;
  --radius-2xl-2: 20px;
  --radius-3xl: 24px;
  --radius-3xl-2: 32px;
  --radius-3xl-3: 42px;
  --radius-full: 48px;

  /* Named Radii */
  --radius-cards: 24px;
  --radius-badges: 10px;
  --radius-buttons: 10px;
  --radius-largeelements: 42px;

  /* Shadows */
  --shadow-md: rgba(0, 0, 0, 0.04) 0px 8px 16px 0px;
  --shadow-subtle: rgba(16, 24, 40, 0.05) 0px 1px 2px 0px;

  /* Surfaces */
  --surface-paper-white: var(--color-paper-white);
  --surface-fossil:      var(--color-fossil);
}