/* ============================================================
   RACHELEITE — Design Tokens
   Fonte: BrandBook_Racheleite.docx, Capitolo 12 (Visual Identity)
   Questi valori sono la "source of truth" del sistema visivo.
   In WordPress diventano la sezione settings.color / typography
   di theme.json (vedi GUTENBERG-MAP.md).
   ============================================================ */

:root {
  /* ---- Palette (Cap. 12, tabella cromatica) ---- */
  --c-petrolio:        #005F61; /* Primario. Campiture grandi e fondini */
  --c-terracotta:      #D25030; /* Accento: UN SOLO elemento per composizione */
  --c-bordeaux:        #73143E; /* Accento scuro, dettagli tipografici */
  --c-avorio:          #F7EDE3; /* Base, colore di fondo e respiro */
  --c-arancio-bruciato:#D87440; /* Dettaglio caldo */
  --c-cipria:          #E7CEC9; /* Sfumatura secondaria, mai dominante */
  --c-nebbioso:        #BFD6D9; /* Sfumatura secondaria, mai dominante */

  /* Derivati funzionali (non in palette brand: solo ruoli d'uso) */
  --c-petrolio-scuro:  #00474A; /* footer / band scura, derivato del primario */
  --c-avorio-alt:      #F6E6D6; /* banda alternata (da 10colori.png) */
  --c-ink:             #33291F; /* testo body: bruno caldo quasi nero */
  --c-ink-soft:        #5E5245; /* testo secondario */
  --c-line:            rgba(0, 95, 97, .18); /* filetti editoriali */

  /* ---- Tipografia (Cap. 12) ----
     DM Serif Display: logo/wordmark + display editoriale
     Belgiano: titoli di brand — FILE FONT NON PRESENTE in cartella,
               fallback su DM Serif Display finché non viene fornito
     DM Sans: testo corpo
     Regola fissa: mai più di due font nella stessa composizione. */
  --f-display: "DM Serif Display", "Belgiano", Georgia, serif;
  --f-body: "DM Sans", system-ui, -apple-system, sans-serif;

  /* Scala tipografica fluida (editoriale) */
  --fs-hero:    clamp(2.75rem, 7.5vw, 5.25rem);
  --fs-h2:      clamp(2rem, 4.5vw, 3.25rem);
  --fs-h3:      clamp(1.375rem, 2.5vw, 1.75rem);
  --fs-lead:    clamp(1.125rem, 1.6vw, 1.3125rem);
  --fs-body:    1.0625rem;
  --fs-small:   .9375rem;
  --fs-overline:.8125rem;

  --lh-tight: 1.08;
  --lh-body:  1.7;

  --ls-overline: .18em;

  /* ---- Spaziatura e layout ---- */
  --space-1: .5rem;
  --space-2: 1rem;
  --space-3: 1.5rem;
  --space-4: 2.5rem;
  --space-5: 4rem;
  --space-6: 6rem;
  --space-7: clamp(5rem, 12vh, 9rem); /* respiro tra sezioni */

  --container: 72rem;
  --container-narrow: 46rem;
  --gutter: clamp(1.25rem, 4vw, 2.5rem);

  /* ---- Forme ----
     Il logo "respira liberamente nello spazio" (Cap. 12):
     raggi organici, mai card rettangolari rigide ovunque. */
  --r-soft: 1.25rem;
  --r-organic: 58% 42% 55% 45% / 48% 55% 45% 52%;

  /* ---- Motion ----
     Nessuna ombra decorativa (Cap. 12). Le transizioni sono
     l'unico "effetto": misurate, mai gratuite. */
  --ease-out: cubic-bezier(.22, .8, .3, 1);
  --t-fast: 180ms;
  --t-med: 420ms;
  --t-slow: 900ms;
}