/* ============================================
   DESIGN TOKENS — palette, fonts, spacing, radius
   Editorial premium aggiornato 2026-05-24
   ============================================ */
:root {
  /* Palette */
  --navy:         #1F4870;
  --navy-deep:    #14304D;
  --blue:         #4B7AA1;
  --blue-soft:    #8AAFCD;
  --bg:           #E6EFF7;
  --cream:        #FAF7F2;
  --surface:      #FFFFFF;
  --surface-alt:  #F5F5F5;
  --text:         #14233A;
  --text-muted:   #5A6878;   /* 5,7:1 su bianco - 4,9:1 su azzurro (era #6B7A8F, sotto soglia ovunque) */
  --border:       #D6E2EE;   /* separatori decorativi */
  --border-field: #7089A3;   /* bordi di campi e controlli: 3,6:1, requisito WCAG 1.4.11 */
  --on-dark-link: #A9C6DE;   /* link su fondo navy: 7,6:1 */
  --ink-faint:    #C5D7E6;
  --accent:       #F2994A;   /* decorativo, e testo SU FONDO SCURO (6:1 su navy) */
  --accent-ink:   #A2520C;   /* testo su fondi chiari: 5,6:1 bianco - 5,2:1 cream - 4,8:1 azzurro */
  --accent-deep:  #D77F2F;

  /* Legacy aliases per CSS non ancora migrato */
  --ink-strong:   var(--navy);
  --ink-medium:   var(--blue);
  --ink-soft:     var(--blue-soft);

  /* Typography */
  --font-display: 'Fraunces', Georgia, serif;
  --font-body:    'Inter', -apple-system, system-ui, sans-serif;

  /* Spacing scale (8pt-based) */
  --space-1:  4px;
  --space-2:  8px;
  --space-3:  12px;
  --space-4:  16px;
  --space-5:  24px;
  --space-6:  32px;
  --space-7:  48px;
  --space-8:  64px;
  --space-9:  96px;
  --space-10: 128px;

  /* Containers */
  --container:        1240px;
  --container-narrow: 960px;
  --container-prose:  720px;
  --container-read:   680px;

  /* Radius */
  --radius-sm: 8px;
  --radius:    14px;
  --radius-lg: 24px;
  --radius-xl: 32px;
}

/* Palette mapping per blocchi Gutenberg che usano .has-palette-N-color */
.has-palette-1-color { color: var(--navy) !important; }
.has-palette-2-color { color: var(--blue) !important; }
.has-palette-3-color { color: var(--blue-soft) !important; }
.has-palette-4-color { color: var(--ink-faint) !important; }
.has-palette-5-color { color: var(--bg) !important; }
.has-palette-6-color { color: var(--text) !important; }
.has-palette-7-color { color: var(--text-muted) !important; }
.has-palette-8-color { color: var(--surface-alt) !important; }
.has-palette-9-color { color: var(--surface) !important; }

.has-palette-1-background-color { background-color: var(--navy) !important; }
.has-palette-2-background-color { background-color: var(--blue) !important; }
.has-palette-3-background-color { background-color: var(--blue-soft) !important; }
.has-palette-4-background-color { background-color: var(--ink-faint) !important; }
.has-palette-5-background-color { background-color: var(--bg) !important; }
.has-palette-6-background-color { background-color: var(--text) !important; }
.has-palette-7-background-color { background-color: var(--text-muted) !important; }
.has-palette-8-background-color { background-color: var(--surface-alt) !important; }
.has-palette-9-background-color { background-color: var(--surface) !important; }