/* ============================================================
   AuditCalls — Design Tokens ("Light Warm Editorial", RTL-ready)
   Import FIRST in <head>, before any other stylesheet.
   Components must consume these variables — no magic values.
   Contrast pairs audited in design/SPEC.md §Accessibility.
   NO blue / blue-adjacent hues anywhere (warm-only system).
   ============================================================ */

:root {
  /* ---- Surfaces & glass (light warm) ---- */
  --color-bg: #F6F4EE;             /* warm cream page canvas */
  --color-bg-elev: #FBFAF3;        /* warm ivory elevation */
  --color-bg-card: #FFFFFF;        /* white cards */
  --color-ink: #171610;            /* inverted ink sections (CTA band, footer) */
  --color-ink-text: #F6F4EE;       /* cream text on ink (16.5:1) */
  --color-ink-text-secondary: #CFC9B8; /* on ink (11.0:1) */
  --color-ink-text-muted: #8F8A76;     /* on ink (5.2:1) */
  --color-surface-glass: rgba(255, 255, 255, 0.72); /* warm translucent white (sticky header) */
  --glass-bg: rgba(255, 255, 255, 0.65);
  --glass-bg-strong: rgba(251, 250, 243, 0.88);
  --glass-blur: 16px;

  /* ---- Lines & grid (ink hairlines) ---- */
  --color-border: rgba(27, 24, 17, 0.10);
  --color-border-strong: rgba(27, 24, 17, 0.22);
  --color-grid-line: rgba(27, 24, 17, 0.06);

  /* ---- Text (warm ink / olive-gray; AA pairs in SPEC §Accessibility) ---- */
  --color-text: #1B1811;           /* warm near-black ink */
  --color-text-secondary: #56513C; /* warm olive-gray */
  --color-text-muted: #6B654E;     /* still ≥4.5:1 on cream & white */

  /* ---- Brand & semantic (warm only: lime / tangerine / amber / coral) ---- */
  --color-accent: #A9E22B;         /* vivid lime — CTA bg (ink label 11.5:1) */
  --color-accent-strong: #8CC215;  /* hover lime (ink label 8.3:1) */
  --color-accent-deep: #4C6A00;    /* olive-lime for TEXT accent: links/eyebrows/stats (5.7:1 on cream) */
  --color-accent-2: #CC6B24;       /* tangerine — icons/UI (3.7:1 on white) */
  --color-accent-2-deep: #99500A;  /* deep tangerine for TEXT on light (6.0:1 on white) */
  --color-accent-grad: linear-gradient(135deg, #A9E22B 0%, #8CC215 100%); /* lime range — ink-safe */
  --color-success: #477D0E;        /* leaf green (5.0:1 on white) */
  --color-warning: #B45309;        /* warm amber (5.0:1 on white) */
  --color-danger: #C93B1D;         /* coral (5.1:1 on white) */
  --color-ink-danger: #F4A896;     /* soft coral for text on ink (9.4:1 on --color-ink) */
  --color-focus-ring: #4C6A00;     /* olive ring, ≥3:1 on cream & ink */

  /* ---- Warm washes (hero / CTA backgrounds; replaced neon orbs) ---- */
  --orb-violet: rgba(169, 226, 43, 0.16);  /* lime wash (name kept for compat) */
  --orb-mint: rgba(245, 166, 90, 0.18);    /* peach wash (name kept for compat) */
  --orb-dim: rgba(206, 112, 10, 0.10);     /* amber wash (name kept for compat) */

  /* ---- Typography (Latin + Hebrew pairing, unchanged) ---- */
  --font-latin: 'Inter', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --font-hebrew: 'Heebo', 'Inter', system-ui, sans-serif;
  --font-body: 'Inter', 'Heebo', system-ui, sans-serif;
  --font-display: 'Inter', 'Heebo', system-ui, sans-serif;

  --fs-hero: clamp(2.875rem, 1.4rem + 6vw, 5.25rem);
  --fs-display: clamp(2.625rem, 1.7rem + 3.8vw, 4.5rem);
  --fs-h2: clamp(2rem, 1.4rem + 2.4vw, 3rem);
  --fs-h3: clamp(1.375rem, 1.15rem + 0.9vw, 1.75rem);
  --fs-h4: clamp(1.125rem, 1.05rem + 0.4vw, 1.25rem);
  --fs-body: clamp(1rem, 0.96rem + 0.2vw, 1.125rem);
  --fs-sm: 0.9375rem;
  --fs-xs: 0.8125rem;

  --fw-regular: 400;
  --fw-medium: 500;
  --fw-semibold: 600;
  --fw-bold: 700;
  --fw-extrabold: 800;

  --lh-tight: 1.08;
  --lh-heading: 1.2;
  --lh-body: 1.6;
  --lh-loose: 1.75; /* Hebrew body text */

  /* ---- Spacing (unchanged) ---- */
  --space-1: 4px;   --space-2: 8px;   --space-3: 12px;  --space-4: 16px;
  --space-5: 24px;  --space-6: 32px;  --space-7: 40px;  --space-8: 48px;
  --space-9: 64px;  --space-10: 80px; --space-11: 96px; --space-12: 128px;

  /* ---- Layout (unchanged) ---- */
  --container-max: 1200px;
  --gutter: clamp(16px, 4vw, 24px);
  --section-pad: clamp(64px, 48px + 5vw, 128px);
  --header-h: 72px;

  /* ---- Radii (unchanged) ---- */
  --radius-sm: 10px;
  --radius-md: 16px;
  --radius-lg: 24px;
  --radius-xl: 32px;
  --radius-full: 999px;

  /* ---- Elevation (warm-tinted soft layered shadows; no cool blacks) ---- */
  --shadow-sm: 0 1px 2px rgba(27, 24, 17, 0.05), 0 4px 12px rgba(27, 24, 17, 0.05);
  --shadow-md: 0 2px 4px rgba(27, 24, 17, 0.05), 0 12px 32px rgba(27, 24, 17, 0.08);
  --shadow-lg: 0 4px 8px rgba(27, 24, 17, 0.06), 0 24px 64px rgba(27, 24, 17, 0.10);
  --glow-accent: 0 0 0 1px rgba(27, 24, 17, 0.06), 0 12px 32px rgba(140, 194, 21, 0.30); /* soft lime halo */

  /* ---- Motion (unchanged) ---- */
  --dur-fast: 140ms;
  --dur-base: 240ms;
  --dur-slow: 480ms;
  --ease-out: cubic-bezier(0.22, 1, 0.36, 1);
  --ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1);

  /* ---- Z-index scale (unchanged) ---- */
  --z-behind: -1;
  --z-header: 100;
  --z-drawer: 200;
  --z-modal: 1000;
}