/* =========================================================================
   Sanremese — Design Tokens
   Fonte: Brand Manual v1.0 (2026), sources/brand/DEF_Sanremese_Brand Manual.pdf
   Uso: base del child theme + mappatura sui Global Colors/Fonts di Elementor.
   Regola colore 60/20/10/10 (vedi nota in fondo) — non esprimibile in CSS,
   va rispettata in fase di layout.
   ========================================================================= */

:root {
  /* ---- Palette brand (valori esatti dal manuale) ---------------------- */
  --sr-deep-sea:   #003CA0;  /* Primario dominante (60%) */
  --sr-light-sky:  #5BA3D0;  /* Primario secondario (20%) */
  --sr-dark-night: #0D1E3A;  /* Support (10%) — profondità senza nero puro */
  --sr-gold-sand:  #D3B47C;  /* Support accent (10%) */

  /* Heritage palette — SOLO con l'Heritage Logo, mai mischiata coi primari.
     Vietata per il testo (non passa WCAG AA). */
  --sr-heri-red:   #DF4235;
  --sr-heri-gold:  #C59C43;

  /* Neutri */
  --sr-white:      #FFFFFF;
  --sr-surface:    #F4F6FB;  /* "Deep Blue 4%" del manuale: solo sfondo, NON è un colore brand */

  /* ---- Token semantici (usa questi nei componenti) -------------------- */
  --color-primary:      var(--sr-deep-sea);
  --color-secondary:    var(--sr-light-sky);
  --color-accent:       var(--sr-gold-sand);
  --color-ink:          var(--sr-dark-night);

  --color-bg:           var(--sr-white);
  --color-surface:      var(--sr-surface);
  --color-text:         var(--sr-dark-night); /* body: AA/AAA su bianco */
  --color-text-invert:  var(--sr-white);      /* testo su Deep Sea: AAA */
  --color-link:         var(--sr-deep-sea);
  --color-link-hover:   #002A73;               /* Deep Sea più scuro, per hover */

  /* Accessibilità: Light Sky e Gold Sand FALLISCONO come testo su molte
     combinazioni → usarli solo per superfici/decorazioni, mai per il body. */

  /* ---- Tipografia -------------------------------------------------------
     Solo Inter: è il font del kit Elementor 13200 dal 20/08, e il CSS del tema
     era rimasto indietro su Arial — che è la ragione per cui l'Arial si vedeva
     ancora in pagina. Arial resta solo come fallback della pila. */
  --font-heading: Inter, "Helvetica Neue", Arial, sans-serif;
  --font-body:    Inter, "Helvetica Neue", Arial, sans-serif;

  --fw-book:    400;  /* body/editorial/UI */
  --fw-medium:  500;  /* accent */

  /* Scala tipografica (base 16px, ratio ~1.25). Heading in clamp() responsive. */
  --fs-base:  1rem;      /* 16px  — body */
  --fs-sm:    0.875rem;  /* 14px  — caption/label */
  --fs-lg:    1.125rem;  /* 18px  — lead */
  --fs-h6:    1.125rem;
  --fs-h5:    1.375rem;
  --fs-h4:    1.75rem;
  --fs-h3:    clamp(1.75rem, 1.3rem + 1.6vw, 2.25rem);
  --fs-h2:    clamp(2.25rem, 1.6rem + 2.4vw, 3.25rem);
  --fs-h1:    clamp(2.75rem, 1.8rem + 4vw, 4.5rem);

  --lh-tight:  1.1;   /* heading */
  --lh-base:   1.6;   /* body */

  /* ---- Geometria/spazi (NON nel manuale — default ragionevoli) -------- */
  --radius-sm:   4px;
  --radius-md:   8px;
  --radius-pill: 999px;
  --space-unit:  0.25rem; /* 4px base */
}

/* -------------------------------------------------------------------------
   Applicazione di base (il child theme può estendere)
   ------------------------------------------------------------------------- */
body {
  font-family: var(--font-body);
  font-weight: var(--fw-book);
  font-size: var(--fs-base);
  line-height: var(--lh-base);
  color: var(--color-text);
  background: var(--color-bg);
}

h1, h2, h3, h4, h5, h6 {
  font-family: var(--font-heading);
  line-height: var(--lh-tight);
  color: var(--color-primary);
}
h1 { font-size: var(--fs-h1); }
h2 { font-size: var(--fs-h2); }
h3 { font-size: var(--fs-h3); }
h4 { font-size: var(--fs-h4); }
h5 { font-size: var(--fs-h5); }
h6 { font-size: var(--fs-h6); }

a { color: var(--color-link); }
a:hover { color: var(--color-link-hover); }

/* =========================================================================
   NOTA — Gerarchia colore 60/20/10/10 (dal manuale, non enforced in CSS):
   60% Deep Sea (dominante) · 20% Light Sky · 10% Dark Night · 10% Gold Sand.
   La palette Heritage è un sistema a parte, solo con l'Heritage Logo.
   ========================================================================= */