/* ==========================================================================
   OASI — Design Tokens
   Fonte: DESIGN.md §2 (Color), §3 (Typography), §4 (Spacing & layout)
   ========================================================================== */

:root {

  /* ------------------------------------------------------------------
     Color primitives (DESIGN.md §2.1)
     ------------------------------------------------------------------ */
  --teal-500: #005470;
  --teal-900: #003d52;
  --orange-500: #FF5416;
  --orange-700: #e6460d;
  --paper: #f7f4ee;
  --paper-2: #efe9dd;
  --ink: #0b2530;
  --muted: #4a6370;

  /* Alias compatibili col prototipo (delivery/prototipo) */
  --teal: var(--teal-500);
  --orange: var(--orange-500);
  --orange-600: var(--orange-700);
  --pad: clamp(24px, 5vw, 80px);

  /* ------------------------------------------------------------------
     Semantic tokens (DESIGN.md §2.2)
     ------------------------------------------------------------------ */
  --bg-primary: var(--paper);
  --bg-accent: var(--teal-500);
  --text-heading: var(--teal-500);
  --text-body: var(--muted);
  --text-inverse: #ffffff;
  --text-accent: var(--orange-500);
  --border-default: rgba(11, 37, 48, .18);

  /* Su fondi scuri (teal) — DESIGN.md §2.3 */
  --text-inverse-body: rgba(255, 255, 255, .78);
  --text-inverse-muted: rgba(255, 255, 255, .7);
  --border-inverse: rgba(255, 255, 255, .18);

  /* ------------------------------------------------------------------
     Typography (DESIGN.md §3)
     ------------------------------------------------------------------ */
  --font-display: 'Figtree', system-ui, sans-serif;  /* display + UI */
  --font-body: 'Raleway', sans-serif;                /* body copy   */

  /* Tracking etichette uppercase (DESIGN.md §3.3) */
  --tracking-label: 0.14em;
  --tracking-eyebrow: 0.22em;

  /* ------------------------------------------------------------------
     Spacing scale — base 8px (DESIGN.md §4.1)
     2 · 4 · 8 · 12 · 16 · 24 · 32 · 40 · 48 · 64 · 80 · 96 · 120
     ------------------------------------------------------------------ */
  --space-2: 2px;
  --space-4: 4px;
  --space-8: 8px;
  --space-12: 12px;
  --space-16: 16px;
  --space-24: 24px;
  --space-32: 32px;
  --space-40: 40px;
  --space-48: 48px;
  --space-64: 64px;
  --space-80: 80px;
  --space-96: 96px;
  --space-120: 120px;

  /* Ritmo verticale di sezione (DESIGN.md §4.1/§4.3) */
  --section-y: 160px;
  --section-y-lg: 180px;

  /* ------------------------------------------------------------------
     Layout (DESIGN.md §4.2) — canvas 1440, contenuto max 1360
     ------------------------------------------------------------------ */
  --container-max: 1360px;
  --container-pad: clamp(20px, 4.4vw, 56px);
}