/* tokens.css — design genome technical_distributor. Estetica istituzionale modernizzata: navy profondo +
   rosso emergenza (DNA della segnalazione di sicurezza) + neutri freddi. Vocabolario CHIUSO di token
   semantici: la sorgente da cui deriva theme.json. I nomi dei ruoli colore coincidono 1:1 con
   palette_roles dell'IR. Contrasti WCAG AA verificati su tutte le coppie di testo (ink/accent-ink su
   chiaro, on-dark/accent-dark su navy, bianco su rosso). Niente valori fuori da qui. */
:root {
  /* --- Colore (navy istituzionale + rosso emergenza) --- */
  --brand-dark: #0B1A34;  /* navy profondo: hero/footer scuri */
  --brand:      #10264C;  /* navy scuro: fasce scure */
  --brand-mid:  #24406E;  /* navy medio: hover/superfici scure intermedie */
  --sage:       #3C5A86;  /* acciaio: filetti/decori non-testo su chiaro (7:1) */
  --sage-light: #6D84AC;  /* acciaio chiaro */
  --sage-tint:  #E3E9F4;  /* tint navy per chip categoria/superfici */
  --accent-ink: #B01722;  /* rosso TESTO su chiaro: link/eyebrow (7:1 su carta) */
  --accent:     #C4161C;  /* rosso emergenza: CTA, filetti, numerali (bianco 6:1) */
  --accent-dark:#FF7A75;  /* rosso su fondo scuro: eyebrow su navy (6.8:1) */

  --paper:   #FFFFFF;  /* fondo pagina */
  --surface: #F3F5FA;  /* sezioni alternate, card */
  --ink:     #14243F;  /* testo principale (15.5:1 su carta) */
  --ink-muted:#4C5B76; /* testo secondario su chiaro (6.8:1 su carta) */
  --line:    #D5DCE8;  /* bordi/divisori (non-testo) */
  --on-dark: #E8EEF8;  /* testo su superfici navy (14.9:1 su navy profondo) */
  --on-dark-muted:#A9B7D0; /* testo secondario su navy (8.6:1) */
  --focus:   #2E6BE6;  /* anello di focus (blu ad alta visibilità) */

  /* --- Ruoli semantici --- */
  --bg: var(--paper);
  --fg: var(--ink);

  /* --- Tipografia: IBM Plex Sans (display + testo) + IBM Plex Mono (label/numerali "scheda tecnica"),
     OFL self-hosted condivisi (zero-live). Registro tecnico-preciso. --- */
  --font-sans: "IBM Plex Sans", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  --font-mono: "IBM Plex Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;

  --text-xs:  0.8125rem;  /* 13px */
  --text-sm:  0.9375rem;  /* 15px */
  --text-base: 1.0625rem; /* 17px corpo */
  --text-md:  1.1875rem;  /* 19px lead */
  --text-lg:  1.375rem;   /* 22px H3 */
  --text-xl:  clamp(1.55rem, 1.2rem + 1.3vw, 2rem);
  --text-2xl: clamp(1.9rem, 1.4rem + 2.2vw, 2.7rem);   /* display sezione */
  --text-3xl: clamp(2.2rem, 1.5rem + 3.1vw, 3.3rem);   /* display hero (cap proporzionato) */

  --lh-tight: 1.12;
  --lh-snug: 1.28;
  --lh-body: 1.65;
  --tracking-label: 0.12em; /* eyebrow uppercase (mono) */

  /* --- Spaziatura (ritmo strutturato-istituzionale) --- */
  --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;
  --section-y: clamp(3.25rem, 2rem + 5.5vw, 6rem);

  /* --- Layout --- */
  --container: 1200px;
  --container-narrow: 740px;
  --gutter: clamp(1.25rem, 0.5rem + 3vw, 2.5rem);

  /* --- Forma (netta-tecnica: raggi contenuti) --- */
  --radius: 6px;
  --radius-lg: 12px;
  --radius-pill: 999px;
  --border: 1px solid var(--line);

  /* --- Ombre (leggere, definite) --- */
  --shadow-sm: 0 1px 2px rgba(11,26,52,.06), 0 2px 10px rgba(11,26,52,.05);
  --shadow-md: 0 10px 28px rgba(11,26,52,.11), 0 2px 8px rgba(11,26,52,.06);

  /* --- Scrim hero: garantisce il contrasto del testo chiaro sopra la foto --- */
  --scrim: linear-gradient(168deg, rgba(11,26,52,.32) 0%, rgba(11,26,52,.58) 55%, rgba(11,26,52,.84) 100%);

  /* --- Motion (sobria) --- */
  --ease: cubic-bezier(.2,.6,.2,1);
  --dur: 200ms;
}

@media (prefers-reduced-motion: reduce) {
  :root { --dur: 0ms; }
}