/* =============================================================
   EDIL VINCI — DESIGN TOKENS
   Fondazioni del design system. Unica fonte di verità per
   colori, tipografia, spaziatura, griglia, motion.
   Riferimenti: doc 02 §4 (direzione visiva), doc 03 (strategia v2)
   ============================================================= */

:root {

  /* ---------- COLORE ----------
     Regola operativa (doc 02 §4.3): il rosso non supera il 5%
     della superficie visibile. Una sola fascia rossa piena
     per pagina (i "Tre impegni"). Mai nero puro accanto al rosso. */

  --c-red:        #B21112;   /* Rosso Vinci — campionato dal logo vettoriale ufficiale */
  --c-red-dark:   #8B0D0E;   /* hover / pressed */
  --c-white:      #FFFFFF;   /* fondo primario */
  --c-calce:      #F6F4F1;   /* off-white "calce" — sezioni alterne */
  --c-ink:        #1A1A1A;   /* testo primario (mai #000) */
  --c-ink-2:      #5A5A5A;   /* testo secondario, metadati */
  --c-line:       #E3E0DC;   /* hairline 1px */
  --c-line-strong: #8A857F;  /* bordi funzionali (input): ≥3:1 su bianco */
  --c-dark:       #141414;   /* fondi scuri: footer, blocco persone */

  /* Derivati per fondi scuri */
  --c-dark-2:     #1C1C1C;   /* superficie rialzata su fondo scuro */
  --c-on-dark:    #F6F4F1;   /* testo primario su scuro */
  --c-on-dark-2:  #A6A29D;   /* testo secondario su scuro */
  --c-line-dark:  rgba(246, 244, 241, 0.14);

  /* Derivati per la fascia rossa */
  --c-on-red:      #FFFFFF;
  --c-on-red-2:    rgba(255, 255, 255, 0.78);
  --c-line-on-red: rgba(255, 255, 255, 0.28);

  /* Velatura obbligatoria per testo su fotografia (doc 02 §4.3) */
  --c-scrim: rgba(20, 20, 20, 0.45);

  /* ---------- TIPOGRAFIA ----------
     Un solo carattere, grotesque, contrasto di scala (doc 02 §4.4). */

  --font-sans: "Instrument Sans", "Helvetica Neue", Helvetica, Arial,
               ui-sans-serif, system-ui, sans-serif;

  /* Scala fluida */
  --fs-display: clamp(2.625rem, 1.35rem + 4.6vw, 5rem);      /* H1 hero */
  --fs-1:       clamp(2rem, 1.25rem + 2.7vw, 3.375rem);      /* H2 sezione */
  --fs-2:       clamp(1.5rem, 1.2rem + 1.1vw, 2.0625rem);    /* H3 grande */
  --fs-3:       clamp(1.1875rem, 1.08rem + 0.4vw, 1.375rem); /* H4 / card */
  --fs-body-l:  clamp(1.0625rem, 1rem + 0.3vw, 1.1875rem);   /* lead */
  --fs-body:    1.0625rem;                                    /* 17px */
  --fs-small:   0.9375rem;                                    /* 15px */
  --fs-meta:    0.75rem;                                      /* 12px — metadati */
  --fs-num-xl:  clamp(3.25rem, 2rem + 4.4vw, 5.5rem);        /* numeri grandi */

  --lh-display: 1.04;
  --lh-heading: 1.12;
  --lh-body:    1.65;
  --lh-tight:   1.35;

  --ls-display: -0.02em;   /* tracking negativo sui titoli */
  --ls-meta:     0.08em;   /* maiuscoletto dei metadati */

  --fw-regular:  400;
  --fw-medium:   500;
  --fw-semibold: 600;
  --fw-bold:     700;

  --measure: 66ch;         /* misura di lettura 65–75 caratteri */

  /* ---------- SPAZIATURA (base 4) ---------- */
  --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 */
  --sp-10: 8rem;      /* 128 */

  --sect-pad: clamp(4.5rem, 9vw, 8rem);       /* respiro verticale sezioni */
  --sect-pad-s: clamp(3rem, 6vw, 5rem);

  /* ---------- GRIGLIA E CONTENITORI ---------- */
  --container-max: 1320px;
  --container-pad: clamp(1.25rem, 5vw, 3.5rem);
  --grid-gap: clamp(1.25rem, 2.5vw, 2rem);

  /* ---------- BORDI, RAGGI, OMBRE ----------
     Estetica d'archivio: spigoli vivi. Nessun raggio sui volumi. */
  --radius-0: 0;
  --radius-pill: 999px;      /* solo micro-elementi (pallini stato) */
  --hairline: 1px solid var(--c-line);
  --hairline-dark: 1px solid var(--c-line-dark);
  --tick: 4px;               /* filetto rosso sopra i titoli di sezione */

  --shadow-header: 0 1px 0 var(--c-line), 0 8px 24px rgba(20, 20, 20, 0.06);
  --shadow-card:   0 24px 64px rgba(20, 20, 20, 0.16);

  /* ---------- MOTION ----------
     Sobrio, mai decorativo (doc 02 §4.7): fade-in 16px, una volta sola. */
  --ease-out:  cubic-bezier(0.22, 0.61, 0.21, 1);
  --dur-1: 160ms;    /* micro: hover, focus */
  --dur-2: 300ms;    /* transizioni componente */
  --dur-3: 200ms;    /* reveal su scroll — 200ms da doc 02 §4.7 */
  --reveal-offset: 16px;

  /* ---------- Z-INDEX ---------- */
  --z-header: 100;
  --z-menu:   95;   /* sotto l'header: il toggle resta raggiungibile */
  --z-bar:    90;
  --z-skip:   200;
  --z-mirino: 300;  /* il puntatore a mirino attraversa tutta la finestra */

  /* ---------- BREAKPOINT (riferimento, non usabili in @media)
     sm 640px · md 840px · lg 1080px · xl 1320px  ---------- */
}