/* =========================================================
   Parrucchiere Digitale — design tokens
   Bianco come base, azzurro tenue come fascia alternata (al posto
   dell'osso/beige originale — sostituito su richiesta esplicita),
   navy per le due sezioni piene (risultati, CTA finale + footer),
   blu come accento principale (occhielli, numeri risultati, CTA
   primaria). Il rame resta definito ma non è più in uso: prima
   sostituito dal blu perché non piaceva il marrone, poi lo stesso
   blu tenue è diventato anche il tono di alternanza delle sezioni.
   --blue campionato a pixel dal bottone di riferimento sulla
   scrivania (rgb 41,92,212 → #295CD4).
   ========================================================= */
:root {
  /* Superfici */
  --bg-base:        #FFFFFF;  /* sfondo pagina, resta invariato */
  --bg-alt:         var(--blue-deep);  /* fascia alternata: blu pieno, non più azzurro tenue */
  --bg-alt-strong:  #EDEAE2;  /* solo riempimenti puntuali (badge X, placeholder video) — non più usato per intere sezioni */
  --bg-dark:        #041334;  /* sezioni piene: risultati, CTA finale, footer — momentaneamente allineato a --blue-deep per usare un solo blu nelle sezioni piene */
  --surface-card:   #FFFFFF;  /* card su fondo azzurro/greige */

  /* Bordi */
  --border:         #E6E2D9;  /* hairline 0.5px, default */
  --border-strong:  #D9D5CC;  /* divisori, hover */

  /* Testo su chiaro */
  --text-primary:   #131A2B;
  --text-secondary: #5F5B54;
  --text-muted:     #8A857C;

  /* Testo su navy */
  --on-dark:        #F3F1EC;
  --on-dark-soft:   #9BA5B8;
  --on-dark-surface:#1B2438;
  --on-dark-border: #2E3A54;

  /* Accento rame */
  --accent:         #C2724A;  /* campiture grandi, elementi decorativi */
  --accent-strong:  #A35730;  /* testo, link, occhielli, fill con testo bianco */
  --accent-soft:    #F5E7DE;  /* badge, tint di sfondo */
  --accent-on-soft: #7A3E1E;  /* testo su --accent-soft */
  --accent-on-dark: #E0916B;  /* rame schiarito, solo su fondo navy */

  /* Blu — accento principale del sito */
  --blue:           #295CD4;
  --blue-hover:     #2149A9;
  --blue-soft:      #E7ECF5;
  --blue-on-dark:   #95ACE2;
  --blue-deep:      #041334;  /* alone in hero + fascia alternata delle sezioni */
  --cyan-glow:      #0BC8F0;  /* campionato dallo screen di riferimento: icone e bagliore delle card in "metodo" */

  /* Rosso/verde — solo per la coppia X/spunta in "perché siamo
     diversi", su richiesta esplicita per far risaltare i concetti. */
  --red:            #C81E1E;
  --red-soft:       #FDE7E7;
  --green:          #0D7A35;
  --green-soft:     #E3F6EA;
}