/* ============================================================
   TOKENS — design system del progetto
   Struttura FISSA (vedi SCHELETRO_TOKEN.md): nomi e scale non si
   toccano, qui sotto solo i VALORI compilati dal Component Planner
   a partire dal mood di BLUEPRINT.yaml (Agriturismo Frangivento).

   Google Fonts — <link> che l'orchestratore inserisce in base.njk
   al posto di {# FONT_LINK_PLACEHOLDER #}:

   <link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Cormorant+Garamond:wght@600&family=Inter:wght@400;500&display=swap">
   ============================================================ */
:root {
  /* ---- Palette base (5 colori brand) ----
     Coppia complementare IONIO / ARANCIO AGRUME: il blu tiene le
     superfici piene, l'arancio il testo secondario e i segni grafici.
     Contrasti calcolati su --c-paper (WCAG 2.1). */
  --c-ink: #24231E;        /* inchiostro d'oliva — testo e titoli   13.74:1 */
  --c-paper: #F4EFE6;      /* sabbia/carta — fondo, sito a fondo chiaro */
  --c-accent: #14425C;     /* blu Ionio — accento raro, fasce piene  9.30:1 */
  --c-ash: #8A3A05;        /* arancio agrume bruciato — complementare 6.80:1 */
  --c-mist: #D6CCB6;       /* sabbia chiara — filetti e bordi         1.39:1 */

  /* ---- Semantici (fondo chiaro: bg=paper, text=ink) ---- */
  --color-bg: var(--c-paper);
  --color-text: var(--c-ink);
  --color-muted: var(--c-ash);
  --color-accent: var(--c-accent);
  --color-rule: var(--c-mist);   /* filetti/bordi: solo token, mai esadecimali qui */

  /* ---- Tipografia ---- */
  --font-display: "Cormorant Garamond", serif;
  --font-body: "Inter", system-ui, sans-serif;

  --fs-100: 0.75rem;   --fs-200: 0.875rem;  --fs-300: 1rem;
  --fs-400: 1.125rem;  --fs-500: 1.375rem;
  /* i tre livelli alti sono fluidi: reggono il telefono senza scalini */
  --fs-600: clamp(1.5rem, 3.2vw, 1.75rem);
  --fs-700: clamp(1.875rem, 4.5vw, 2.25rem);
  --fs-800: clamp(2.25rem, 6vw, 3rem);
  --fs-900: clamp(3rem, 8vw, 6rem);

  --lh-tight: 1.1; --lh-snug: 1.3; --lh-normal: 1.6; --lh-loose: 1.7;

  /* ---- Spacing ---- */
  --space-1: 0.25rem;  --space-2: 0.5rem;   --space-3: 0.75rem;
  --space-4: 1rem;     --space-5: 1.5rem;   --space-6: 2rem;
  --space-7: 3rem;     --space-8: 4rem;     --space-9: 6rem;
  --space-10: 8rem;    --space-11: 12rem;   --space-12: 16rem;

  /* ---- Layout ---- */
  --maxw-content: 1200px;
  --maxw-prose: 65ch;
  --gutter: var(--space-5);

  /* ---- Motion ---- */
  --ease-out: cubic-bezier(0.2, 0.7, 0.3, 1);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --duration-fast: 200ms;
  --duration-medium: 500ms;
  --duration-slow: 1200ms;

  /* ---- Bordi / ombre ---- */
  --radius-none: 0;
  --radius-sm: 2px;
  --border-hair: 1px solid var(--color-rule);

  /* ---- Z-index ---- */
  --z-base: 1; --z-header: 100; --z-nav-mobile: 200; --z-modal: 1000;
}