@import url('/brand-tokens.generated.css');
/* INTER, il ripiego DICHIARATO per gli alfabeti che Poppins non copre: queste pagine girano
   in 23 lingue, e Poppins non porta ne' il cirillico (bulgaro) ne' il greco. Senza questa
   riga quelle due lingue cadono sul carattere di sistema, e il difetto lo vede solo chi
   legge in quella lingua, cioe' il cliente. Trovato da check-fonts il 14-08-2026, dopo che
   portando i caratteri in casa avevo portato via anche Inter senza accorgermene.
   Resta su Google finche' non abbiamo in repo i suoi sottoinsiemi greco e cirillico:
   portarlo in casa a meta' sarebbe peggio, perche' toglierebbe la copertura credendo di
   fare ordine. */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap');

/* I CARATTERI DI MARCA, ospitati da noi. Allineati al manuale il 14-08-2026.
   Prima queste 55 pagine giravano su Fraunces (un serif ritirato) per i titoli e su Inter per il
   corpo, presi dal CDN di Google. Il manuale dice Poppins per il testo e Space Mono per i dati, e
   non nomina nessun serif: chi arrivava qui dal piede della landing atterrava su una pagina che
   sembrava di un'altra azienda. Claudio: "quando uno viaggia nel sito vede queste incompatibilita'
   tra le pagine ed e' bruttissimo".
   I file sono gli stessi della landing e del sito, in /fonts/. Inter resta nella pila come ripiego
   dichiarato per gli alfabeti che Poppins non copre. */
@font-face{font-family:'Poppins';font-style:normal;font-display:swap;font-weight:400;src:url(/fonts/poppins-latin-400-normal.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Poppins';font-style:normal;font-display:swap;font-weight:400;src:url(/fonts/poppins-latin-ext-400-normal.woff2) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Poppins';font-style:normal;font-display:swap;font-weight:500;src:url(/fonts/poppins-latin-500-normal.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Poppins';font-style:normal;font-display:swap;font-weight:500;src:url(/fonts/poppins-latin-ext-500-normal.woff2) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Poppins';font-style:normal;font-display:swap;font-weight:600;src:url(/fonts/poppins-latin-600-normal.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Poppins';font-style:normal;font-display:swap;font-weight:600;src:url(/fonts/poppins-latin-ext-600-normal.woff2) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Poppins';font-style:normal;font-display:swap;font-weight:700;src:url(/fonts/poppins-latin-700-normal.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Poppins';font-style:normal;font-display:swap;font-weight:700;src:url(/fonts/poppins-latin-ext-700-normal.woff2) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Space Mono';font-style:normal;font-display:swap;font-weight:400;src:url(/fonts/space-mono-latin-400-normal.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Space Mono';font-style:normal;font-display:swap;font-weight:700;src:url(/fonts/space-mono-latin-700-normal.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}

:root{
  /* LA TAVOLOZZA NON STA PIU' QUI: arriva dalla fonte unica di marca.
     Prima queste pagine avevano la LORO copia dei colori, e infatti erano derivate: il fondo era
     crema #f3f2ec invece del fondo di marca #f4f4f2, il testo secondario #6c6860 invece di
     #666b73, i filetti #dcd7cb invece di #e4e3df, e l'accento era un verde oliva #7d9400 invece
     del lime #d4f53c. Nessuno di quei valori era stato deciso: erano rimasti li'.
     Claudio, il 14-08-2026, dopo che avevo "sistemato" solo i caratteri: "il verde che e'
     utilizzato non e' quello lime... hai fatto un background con un colore diverso rispetto a
     quello che abbiamo fatto sulle pagine del sito".
     Ora i nomi locali restano (centinaia di regole li usano) ma PUNTANO ai token di marca, che
     arrivano da brand-tokens.generated.css e sono sorvegliati da check-drift. Una copia in meno. */
  --navy:var(--cf-nero); --navy2:var(--cf-nero-2); --cream:var(--cf-fondo); --cream2:var(--cf-fondo-2);
  --ink:var(--cf-nero); --muted:var(--cf-testo-muto); --line:var(--cf-linea);
  --orange:var(--cf-lime); --sage:var(--cf-lime-testo); --card:var(--cf-carta);
}
*{ box-sizing:border-box; }
@page{ size:A4; margin:15mm 14mm; }
@page:first{ margin:0; }
html,body{ margin:0; padding:0; background:var(--cream); }
body{ font-family:'Poppins','Inter',system-ui,Arial,sans-serif; color:var(--ink); font-size:11pt; line-height:1.5; -webkit-print-color-adjust:exact; print-color-adjust:exact; }
h1,h2,h3,.display{ font-family:'Poppins',var(--cf-sans,system-ui),sans-serif; }

/* a max-width wrapper so the guide reads well on screen too */
.content{ max-width:780px; margin:0 auto; padding:26mm 14mm; background:#fff; }
@media print{ .content{ max-width:none; margin:0; padding:0; background:transparent; } }

.cover{ height:297mm; background:var(--cream); display:flex; flex-direction:column; justify-content:center; align-items:center; text-align:center; padding:0 28mm; page-break-after:always; position:relative; }
.brand{ display:flex; align-items:center; gap:12px; margin-bottom:34px; }
.logo{ width:46px; height:46px; border-radius:13px; background:var(--navy); display:flex; align-items:center; justify-content:center; }
.brand-name{ font-family:'Poppins',system-ui,sans-serif; font-weight:700; font-size:24pt; letter-spacing:-0.01em; color:var(--ink); }
.cover h1{ font-size:34pt; font-weight:600; line-height:1.1; margin:0; color:var(--ink); }
.accent{ width:64px; height:4px; border-radius:99px; background:var(--orange); margin:20px auto; }
.cover .sub{ font-size:13pt; color:var(--muted); max-width:380px; margin:0 auto; line-height:1.55; }
.cover .foot{ position:absolute; bottom:24mm; font-size:10pt; color:var(--muted); letter-spacing:0.02em; }

.sec-title{ font-family:'Poppins',system-ui,sans-serif; font-size:21pt; font-weight:600; color:var(--ink); margin:0 0 6px; }
.sec-lead{ font-size:12.5pt; color:var(--navy); font-weight:600; margin:0 0 16px; }
.benefits-page{ page-break-after:always; }
.benefits{ list-style:none; margin:0; padding:0; }
.benefits li{ position:relative; padding:11px 0 11px 26px; border-bottom:1px solid var(--line); font-size:11pt; line-height:1.5; page-break-inside:avoid; }
.benefits li:last-child{ border-bottom:none; }
.benefits li::before{ content:""; position:absolute; left:3px; top:17px; width:8px; height:8px; border-radius:50%; background:var(--orange); }
.benefits li b{ color:var(--navy); }
/* scannable benefit treatment (mirrors the cosa-fa one-pager): a black bold action line + a
   lighter grey description, so a reader who only skims still catches the actions. */
.benefits li .bt{ display:block; font-weight:700; color:var(--ink); margin:0 0 2px; }
.benefits li .bd{ color:var(--muted); }

.intro{ font-size:12pt; color:var(--ink); background:var(--cream2); border:1px solid var(--line); border-radius:12px; padding:16px 18px; margin:0 0 22px; }
.intro b{ color:var(--navy); }

.step{ page-break-inside:avoid; margin:0 0 26px; }
.step-head{ display:flex; align-items:center; gap:12px; margin-bottom:7px; }
.num{ flex:0 0 auto; width:30px; height:30px; border-radius:50%; background:var(--navy); color:#fff; font-weight:600; font-size:13pt; display:flex; align-items:center; justify-content:center; font-family:"Inter"; }
.step h2{ font-size:15pt; font-weight:600; margin:0; color:var(--ink); }
.step p{ margin:0 0 11px 42px; color:var(--ink); }
.step p .k{ color:var(--navy); font-weight:600; }
.shot{ margin-left:42px; }
.shot img{ width:100%; display:block; border:1px solid var(--line); border-radius:10px; box-shadow:0 6px 18px -10px rgba(21,34,56,0.25); }

.note{ page-break-inside:avoid; margin:8px 0 0; background:#e7f0e9; border:1px solid var(--cf-lime-lieve); border-radius:12px; padding:14px 18px; color:var(--cf-lime-testo); font-size:10.5pt; }
.note b{ color:var(--sage); }
.footer{ margin-top:26px; padding-top:12px; border-top:1px solid var(--line); text-align:center; font-size:9pt; color:var(--muted); }

/* on-screen "Salva PDF" button (hidden in print) */
.dlbar{ position:sticky; top:0; z-index:5; display:flex; justify-content:flex-end; gap:8px; padding:10px 14px; background:rgba(243,242,236,0.9); backdrop-filter:blur(6px); border-bottom:1px solid var(--line); }
.dlbtn{ font-family:"Inter"; font-size:11pt; font-weight:600; color:#fff; background:var(--navy); border:none; border-radius:9px; padding:8px 16px; cursor:pointer; }
.dlbtn:hover{ background:var(--navy2); }
@media print{ .dlbar{ display:none; } }


/* IL NOME DEL MODULO A DUE TONI, la stessa regola del sito e della landing (manuale §7.1):
   prima parola nel colore del testo, seconda arretrata di un passo. Qui il tag sta DENTRO la
   parola, ed e' l'unico punto in cui e' ammesso. */
.nome-coda{ font-style:normal; opacity:.62; }
