/* ============================================================
   DAAS & Chemicals — Design System 2.0 (web) · settembre 2026
   Valori presi dai lavori 2025–26 (Sostenibilità 2025, CHEP
   Tech Book, Tech Book, Calendario 2027), non dedotti.
   ============================================================ */

@font-face { font-family: 'Jost'; font-weight: 300; font-style: normal; font-display: swap; src: url('../fonts/jost-light.woff2') format('woff2'); }
@font-face { font-family: 'Jost'; font-weight: 300; font-style: italic; font-display: swap; src: url('../fonts/jost-lightitalic.woff2') format('woff2'); }
@font-face { font-family: 'Jost'; font-weight: 400; font-style: normal; font-display: swap; src: url('../fonts/jost-regular.woff2') format('woff2'); }
@font-face { font-family: 'Jost'; font-weight: 400; font-style: italic; font-display: swap; src: url('../fonts/jost-italic.woff2') format('woff2'); }
@font-face { font-family: 'Jost'; font-weight: 500; font-style: normal; font-display: swap; src: url('../fonts/jost-medium.woff2') format('woff2'); }
@font-face { font-family: 'Jost'; font-weight: 600; font-style: normal; font-display: swap; src: url('../fonts/jost-semibold.woff2') format('woff2'); }
@font-face { font-family: 'Jost'; font-weight: 700; font-style: normal; font-display: swap; src: url('../fonts/jost-bold.woff2') format('woff2'); }

:root {
  /* ---- Colore: ancore ---- */
  --navy:        #173557;  /* Pantone 295C — primario */
  --navy-deep:   #0f2f4d;  /* superfici scure (in stampa #0f385a / #10385a) */
  --navy-ink:    #0a1e33;  /* fondo più scuro, footer */
  --blue:        #1986c8;  /* UNICO accento — filetti, quadratini, numeri grandi */
  --blue-text:   #006fb9;  /* accento per testo piccolo su bianco (AA 5.2:1) */
  --blue-on-dark:#7cc0ea;  /* accento su navy (AA) */
  --slate:       #82849e;  /* Pantone 5285C — secondario */
  --slate-dark:  #5f6179;  /* slate per testo su bianco (AA) */
  --green:       #0b7634;  /* SOLO contenuti ESG */
  --green-soft:  #328163;

  /* ---- Neutri freddi ---- */
  --ink:      #0e1a2b;   /* testo forte — mai #000 a schermo */
  --text:     #2c3541;   /* testo corrente (dal bilancio) */
  --muted:    #586271;
  --line:     #d6dbe2;
  --line-soft:#e6eaef;
  --paper:    #ffffff;
  --paper-2:  #f3f5f8;   /* fondo alternato (CHEP "Why DAAS") */
  --on-dark:  #d0dceb;   /* testo su navy (dal bilancio) */
  --on-dark-muted: #a2b6cc;
  --line-on-dark: rgba(255,255,255,.16);

  /* ---- Tipografia (Jost ≈ Futura PT) ---- */
  --font: 'Jost', 'Futura PT', 'Futura', system-ui, sans-serif;
  --w-light: 300;   /* display, numeri */
  --w-book: 400;    /* H2 (come i titoli del CHEP), testo */
  --w-medium: 500;  /* H3, navigazione */
  --w-demi: 600;    /* label, grassetti nel testo */
  --w-bold: 700;    /* raro */

  /* scala fluida: min @ 375px → max @ 1440px */
  --fs-display: clamp(2.75rem, 1.6rem + 4.9vw, 6rem);    /* 44 → 96 */
  --fs-h1:      clamp(2.25rem, 1.55rem + 3vw, 4.25rem);  /* 36 → 68 */
  --fs-h2:      clamp(1.75rem, 1.4rem + 1.5vw, 2.75rem); /* 28 → 44 */
  --fs-h3:      clamp(1.25rem, 1.15rem + .45vw, 1.5rem); /* 20 → 24 */
  --fs-lead:    clamp(1.125rem, 1.06rem + .3vw, 1.3125rem); /* 18 → 21 */
  --fs-body:    1.0625rem;  /* 17 */
  --fs-small:   .9375rem;   /* 15 */
  --fs-label:   .8125rem;   /* 13 */
  --fs-eyebrow: .75rem;     /* 12 */
  --fs-stat:    clamp(2.25rem, 1.75rem + 2vw, 3.5rem);

  --lh-tight: 1.02;
  --lh-snug:  1.18;
  --lh-body:  1.62;

  --tr-display: -0.02em;
  --tr-eyebrow: .18em;
  --tr-runner:  .22em;

  /* ---- Spazio (griglia 8px) ---- */
  --s-1: .25rem; --s-2: .5rem; --s-3: .75rem; --s-4: 1rem; --s-5: 1.5rem;
  --s-6: 2rem;   --s-7: 3rem;  --s-8: 4rem;   --s-9: 6rem; --s-10: 8rem;
  --section: clamp(4.5rem, 3rem + 6vw, 9rem);  /* respiro verticale delle sezioni */
  --gutter:  clamp(1rem, .6rem + 1.8vw, 2.5rem);
  --container: 1360px;
  --measure: 62ch;

  /* ---- Forma ---- */
  --radius: 0;        /* squadrato, come il logo */
  --rule: 1px;
  --rule-strong: 3px;
  --square: .5rem;    /* lato del quadratino ■ */

  /* ---- Movimento (livello 3–4) ---- */
  --ease: cubic-bezier(.2,.7,.2,1);
  --ease-out: cubic-bezier(.16,1,.3,1);
  --t-fast: 180ms;
  --t-med: 420ms;
  --t-slow: 900ms;

  --header-h: 5rem;
}

@media (prefers-reduced-motion: reduce) {
  :root { --t-fast: 0ms; --t-med: 0ms; --t-slow: 0ms; }
}
