/* Token di progetto: colori, caratteri, scala tipografica, spazi, forme.
   Direzione «SaaS moderno pulito»: neutri freddi, un solo blu di marca, schede chiare.
   Vedi docs/design.md. */

:root {
  /* Fondi e filetti */
  --paper: #ffffff;
  --band: #f5f7fa; /* superfici secondarie: fasce, riquadri, righe evidenziate */
  --line: #e4e7ec; /* filetti e bordi: mai testo */
  --line-strong: #cdd3dc; /* bordi dei campi, intestazioni delle tabelle */

  /* Testo */
  --ink: #101828; /* testo e cifre: 17,8:1 */
  --ink-2: #475467; /* testo secondario, unità: 7,6:1 */
  --ink-3: #667085; /* testo di servizio: 4,9:1 */

  /* Marca e significati */
  --blue: #1d4ed8; /* marca, azioni, link, batteria: 6,7:1 */
  --blue-strong: #1e40af; /* azione al passaggio del mouse */
  --blue-tint: #eef3ff;
  --navy: #0b1530; /* fasce scure: piede e invito finale */
  --red: #b42318; /* energia mancante, errori (testo): 6,6:1 */
  --red-fill: #e5484d; /* superfici rosse: barre */
  --red-tint: #fef3f2; /* fondo della riga dell'anno peggiore */
  --green: #067647; /* conferme: 6,1:1 */
  --green-tint: #ecfdf3;

  /* Caratteri: IBM Plex, la stessa famiglia dei fogli dello schema elettrico */
  --font-serif: var(--font-sans); /* nome storico: i titoli ora sono senza grazie */
  --font-sans: 'IBM Plex Sans', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --font-mono: 'IBM Plex Mono', ui-monospace, 'Cascadia Mono', Consolas, monospace;

  /* Scala tipografica: base 16 px */
  --fs-xs: 0.8125rem; /* 13 */
  --fs-s: 0.875rem; /* 14 */
  --fs-m: 1rem; /* 16 */
  --fs-l: 1.25rem; /* 20 */
  --fs-xl: 1.5rem; /* 24 */
  --fs-2xl: 2rem; /* 32 */
  --fs-3xl: 2.75rem; /* 44 */
  --fs-4xl: 3.5rem; /* 56 */

  --lh-text: 1.6;
  --lh-title: 1.15;

  /* Spazi */
  --sp-1: 0.25rem; /* 4 */
  --sp-2: 0.5rem; /* 8 */
  --sp-3: 0.75rem; /* 12 */
  --sp-4: 1rem; /* 16 */
  --sp-5: 1.5rem; /* 24 */
  --sp-6: 2rem; /* 32 */
  --sp-7: 3rem; /* 48 */
  --sp-8: 4rem; /* 64 */
  --sp-9: 6rem; /* 96 */

  /* Forme ed elevazione: un solo bordo oppure una sola ombra, mai tutti e due */
  --radius-s: 6px;
  --radius: 8px;
  --radius-l: 12px;
  --shadow-s: 0 1px 2px rgba(16, 24, 40, 0.06);
  --shadow: 0 1px 3px rgba(16, 24, 40, 0.08), 0 12px 32px -12px rgba(16, 24, 40, 0.18);

  /* Impaginazione */
  --page-max: 72rem;
  --gutter: 1rem;
  --measure: 34em; /* circa 72 caratteri di Plex Sans */
  --rule: 1px solid var(--line);
  --rule-strong: 1px solid var(--line-strong);
}

@media (min-width: 48rem) {
  :root {
    --gutter: 2rem;
  }
}