/* ═══════════════════════════════════════
   css/variables.css
   Museo Nola - Design System
   COSA FA: Definisce tutti i token di design
   COME AGGIORNARE: Modificare qui per cambiare colori, font, spaziature
   ═══════════════════════════════════════ */
:root {
  /* Colori base - AGGIORNA: palette museo */
  --color-primary:      #31576e;
  --color-accent:       #e8734a;
  --color-header-bg:    #b8cdd6;
  --color-bg:           #f5f5f5;
  --color-surface:      #ffffff;
  --color-text:         #1a1a2e;
  --color-text-muted:   #6b7280;
  --color-footer-bg:    #ffffff;
  --color-footer-border: #e5e7eb;

  /* Colori sezioni museo - AGGIORNA: colori sezioni */
  --color-cenere:       #a17c5c;
  --color-imperiale:    #6d5c7d;
  --color-rinascimento: #eaa88f;
  --color-smalto:       #6a878d;
  --color-biblioteca:   #437e68;

  /* Tipografia */
  --font-body:    'Open Sans', sans-serif;
  --font-display: 'Playfair Display', serif;

  /* Spaziatura e forma */
  --radius-sm:  8px;
  --radius-md:  12px;
  --radius-lg:  16px;
  --shadow-sm:  0 1px 3px rgba(0,0,0,0.1);
  --shadow-md:  0 4px 16px rgba(0,0,0,0.12);
  --transition: 0.28s cubic-bezier(0.4, 0, 0.2, 1);

  /* Layout */
  --header-h:     56px;
  --footer-h:     64px;
  --menu-width:   80vw;
  --sidebar-w:    240px;
  --safe-bottom: env(safe-area-inset-bottom, 0px);
}