/* ============================================================
   TOKENS — l'unico file da toccare per cambiare l'identità visiva
   ============================================================ */

:root {
  /* --- Colori (invariati) ----------------------------------- */
  --inchiostro:      #0E2B35;  /* blu-petrolio profondo: testo e fondi scuri */
  --inchiostro-alt:  #143B47;  /* blu-petrolio più chiaro per superfici scure */
  --carta:           #F3F8F9;  /* fondo pagina */
  --carta-alta:      #FFFFFF;  /* superfici in rilievo, bianco pieno */
  --azzurro-tenue:   #E6F1F3;  /* tinta leggera per schede e riquadri */
  --nebbia:          #DAE6E8;  /* bordi e linee */
  --nebbia-scura:    #2A4C57;  /* bordi su fondo scuro */
  --blu:             #1B6FA8;  /* accento primario */
  --acqua:           #279E8E;  /* accento verde-acqua */
  --testo:           #10262E;
  --testo-tenue:     #4C6B74;
  --testo-chiaro:    #C9DEE0;  /* testo su fondo scuro */

  /* --- Tipografia -------------------------------------------
     UNA SOLA famiglia in tutto il sito. La gerarchia nasce da
     peso, dimensione e spaziatura, non dall'alternanza di font.
     ---------------------------------------------------------- */
  --font: "Instrument Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --font-titoli: "Source Serif 4", Georgia, "Times New Roman", serif;

  /* Scala tipografica compatta: titoli più contenuti = meno vuoti */
  --scala-1:    clamp(2.05rem, 1.45rem + 2.4vw, 3.35rem);  /* h1 */
  --scala-2:    clamp(1.55rem, 1.3rem + 1.05vw, 2.15rem);  /* h2 */
  --scala-3:    1.0625rem;                                  /* h3 */
  --scala-lede: clamp(1rem, 0.96rem + 0.22vw, 1.125rem);
  --scala-base: 1rem;
  --scala-piccola: 0.9375rem;
  --scala-micro:   0.75rem;

  /* --- Spaziature (griglia di 8px) -------------------------- */
  --sp-1: 0.5rem;
  --sp-2: 1rem;
  --sp-3: 1.5rem;
  --sp-4: 2rem;
  --sp-5: 2.75rem;
  --sp-6: 3.5rem;
  --sp-7: 4.5rem;

  /* Ritmo verticale delle sezioni: più stretto di prima */
  --sezione-y: clamp(2.75rem, 4.5vw, 4.25rem);
  --hero-y-top: clamp(2rem, 3.5vw, 3.25rem);
  --hero-y-bottom: clamp(2.5rem, 4vw, 3.75rem);

  /* --- Struttura -------------------------------------------- */
  --larghezza-max: 1160px;
  --larghezza-stretta: 780px;
  --gutter: clamp(1.25rem, 4vw, 2.75rem);
  --raggio: 10px;
  --raggio-grande: 20px;
  --raggio-morbido: 28px;
  --raggio-tondo: 999px;

  --ombra-lieve: 0 1px 2px rgba(14, 43, 53, 0.04),
                 0 4px 14px -8px rgba(14, 43, 53, 0.12);
  --ombra: 0 1px 2px rgba(14, 43, 53, 0.04),
           0 14px 38px -18px rgba(14, 43, 53, 0.28);
  --ombra-morbida: 0 2px 6px rgba(14, 43, 53, 0.04),
                   0 22px 48px -24px rgba(14, 43, 53, 0.30);
  --transizione: 200ms cubic-bezier(0.2, 0.6, 0.3, 1);
}