/* Brigata – foglio di stile unico. Caratteri serviti dal sito (nessuna richiesta a terzi). */
@font-face{font-family:"Crimson Text";font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/CrimsonText-Regular.woff) format("woff")}
@font-face{font-family:"Crimson Text";font-style:normal;font-weight:600;font-display:swap;src:url(../fonts/CrimsonText-SemiBold.woff) format("woff")}
@font-face{font-family:"Barlow";font-style:normal;font-weight:500;font-display:swap;src:url(../fonts/Barlow-Medium.woff) format("woff")}
@font-face{font-family:"Barlow";font-style:normal;font-weight:600;font-display:swap;src:url(../fonts/Barlow-SemiBold.woff) format("woff")}

:root{
  --inchiostro:#16243a; --inchiostro-2:#22344f; --rame:#c4622d; --rame-scuro:#a24d20; --senape:#e3a43b;
  --crema:#faf6ef; --crema-2:#f1eadd; --bianco:#fff; --testo:#1f2a37; --tenue:#5a6676; --linea:#e4dccb;
  --verde:#2f7d5b; --r:12px; --ombra:0 10px 30px rgba(22,36,58,.10); --ombra-forte:0 24px 60px rgba(22,36,58,.22);
  --titoli:"Crimson Text",Georgia,"Times New Roman",serif; --corpo:"Barlow",system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
  --larg:1120px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--crema);color:var(--testo);font:500 17px/1.6 var(--corpo)}
img{max-width:100%;height:auto;display:block}
a{color:var(--rame-scuro)}
a:hover{color:var(--rame)}
h1,h2,h3{font-family:var(--titoli);font-weight:600;color:var(--inchiostro);line-height:1.12;margin:0 0 .5em;letter-spacing:-.01em}
h1{font-size:clamp(2.3rem,5.4vw,3.9rem)}
h2{font-size:clamp(1.8rem,3.6vw,2.7rem)}
h3{font-size:1.4rem}
p{margin:0 0 1em}
.contenitore{max-width:var(--larg);margin:0 auto;padding:0 20px}
.sr{position:absolute;left:-9999px}
:focus-visible{outline:3px solid var(--senape);outline-offset:2px;border-radius:4px}

/* Gli elementi delle griglie non si allargano oltre lo schermo (immagini larghe su telefono) */
.hero .contenitore>*,.riga>*,.griglia>*,.flusso>*,.passi>*{min-width:0}
body{overflow-x:hidden}

/* Intestazione */
.testata{position:sticky;top:0;z-index:50;background:rgba(250,246,239,.94);backdrop-filter:saturate(1.4) blur(8px);border-bottom:1px solid var(--linea)}
.testata .contenitore{display:flex;align-items:center;gap:20px;min-height:68px}
.logo{display:inline-flex;align-items:center;gap:10px;text-decoration:none;color:var(--inchiostro)}
.logo svg{width:38px;height:38px;flex:none}
.logo span{font:600 1.7rem/1 var(--titoli);letter-spacing:-.01em}
.menu{display:flex;gap:4px;margin-left:auto;align-items:center}
.menu a{padding:8px 12px;border-radius:8px;color:var(--inchiostro);text-decoration:none;font-weight:600;font-size:.98rem}
.menu a:hover,.menu a[aria-current=page]{background:var(--crema-2)}
.menu .bottone{margin-left:8px}
.apri-menu{display:none;margin-left:auto;background:none;border:1px solid var(--linea);border-radius:10px;padding:9px 12px;font:600 .95rem var(--corpo);color:var(--inchiostro);cursor:pointer}

/* Bottoni */
.bottone{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:13px 22px;border-radius:999px;background:var(--rame);color:#fff!important;text-decoration:none;font:600 1rem var(--corpo);border:2px solid var(--rame);cursor:pointer;transition:background .15s,transform .15s,box-shadow .15s}
.bottone:hover{background:var(--rame-scuro);border-color:var(--rame-scuro);transform:translateY(-1px);box-shadow:0 8px 20px rgba(196,98,45,.35)}
.bottone.vuoto{background:transparent;color:var(--inchiostro)!important;border-color:var(--inchiostro)}
.bottone.vuoto:hover{background:var(--inchiostro);color:#fff!important;box-shadow:none}
.bottone.piccolo{padding:9px 18px;font-size:.95rem}
.bottone.chiaro{background:#fff;color:var(--inchiostro)!important;border-color:#fff}
.bottone.chiaro:hover{background:var(--crema-2);border-color:var(--crema-2)}
.bottone.vuoto-chiaro{background:transparent;color:#fff!important;border-color:#fff}
.bottone.vuoto-chiaro:hover{background:#fff;color:var(--inchiostro)!important;box-shadow:none}

/* Sezioni */
section{padding:64px 0}
.fondo-bianco{background:var(--bianco)}
.fondo-scuro{background:var(--inchiostro);color:#d9e1ec}
.fondo-scuro h2,.fondo-scuro h3{color:#fff}
.fondo-sabbia{background:var(--crema-2)}
.occhiello{display:inline-block;font:600 .85rem var(--corpo);letter-spacing:.12em;text-transform:uppercase;color:var(--rame);margin-bottom:12px}
.fondo-scuro .occhiello{color:var(--senape)}
.intro{max-width:720px;margin:0 auto 32px;text-align:center}
.intro p{color:var(--tenue);font-size:1.12rem}
.fondo-scuro .intro p{color:#b9c6d8}

/* Hero */
.hero{padding:52px 0 64px;background:linear-gradient(180deg,var(--crema) 0%,var(--crema-2) 100%)}
.hero .contenitore{display:grid;grid-template-columns:1.02fr 1fr;gap:48px;align-items:center}
.hero p.sotto{font-size:1.2rem;color:var(--tenue);max-width:560px}
.azioni{display:flex;flex-wrap:wrap;gap:12px;margin:26px 0 22px}
.punti{display:flex;flex-wrap:wrap;gap:8px 22px;padding:0;margin:0;list-style:none;color:var(--tenue);font-size:.95rem}
.punti li::before{content:"✓";color:var(--verde);font-weight:700;margin-right:7px}
.cornice{background:#fff;border:1px solid var(--linea);border-radius:14px;box-shadow:var(--ombra-forte);overflow:hidden}
.cornice .barra{display:flex;gap:6px;padding:10px 12px;background:#eef0f3;border-bottom:1px solid #e1e5ea}
.cornice .barra i{width:10px;height:10px;border-radius:50%;background:#cfd5dd}
.cornice img{width:100%}
.telefono{width:min(290px,70vw);margin:0 auto;border:9px solid var(--inchiostro);border-radius:34px;overflow:hidden;background:#fff;box-shadow:var(--ombra-forte)}

/* Schede e griglie */
.griglia{display:grid;gap:22px}
.g3{grid-template-columns:repeat(3,1fr)}
.g2{grid-template-columns:repeat(2,1fr)}
.g4{grid-template-columns:repeat(4,1fr)}
.scheda{background:#fff;border:1px solid var(--linea);border-radius:var(--r);padding:26px;box-shadow:var(--ombra)}
.scheda h3{margin-bottom:.4em}
.scheda p{color:var(--tenue);margin:0}
.scheda .icona{width:46px;height:46px;border-radius:12px;background:var(--crema-2);display:grid;place-items:center;margin-bottom:14px;color:var(--rame)}
.scheda .icona svg{width:26px;height:26px}
.fondo-bianco .scheda{background:var(--crema);box-shadow:none}
.fondo-scuro .scheda{background:var(--inchiostro-2);border-color:#2f4565;box-shadow:none}
.fondo-scuro .scheda p{color:#b9c6d8}

/* Righe con immagine */
.riga{display:grid;grid-template-columns:1fr 1.05fr;gap:48px;align-items:center;margin-bottom:48px}
.riga:last-child{margin-bottom:0}
.riga.inversa{grid-template-columns:1.05fr 1fr}
.riga.inversa .testo{order:2}
.riga ul{padding-left:1.1em;color:var(--tenue)}
.riga li{margin-bottom:.35em}

/* Passi */
.passi{counter-reset:p;display:grid;grid-template-columns:repeat(4,1fr);gap:22px;padding:0;margin:0;list-style:none}
.passi li{counter-increment:p;background:#fff;border:1px solid var(--linea);border-radius:var(--r);padding:24px;position:relative}
.passi li::before{content:counter(p);display:grid;place-items:center;width:38px;height:38px;border-radius:50%;background:var(--inchiostro);color:#fff;font:600 1.2rem var(--titoli);margin-bottom:12px}
.passi h3{font-size:1.2rem}
.passi p{color:var(--tenue);margin:0;font-size:.98rem}

/* Etichette */
.etichetta{display:inline-block;padding:4px 12px;border-radius:999px;font:600 .8rem var(--corpo);letter-spacing:.04em;text-transform:uppercase}
.et-ok{background:#dcefe5;color:#1d5a40}
.et-presto{background:#fbe9c9;color:#7a5200}
.et-richiesta{background:#e3e9f3;color:#2a3d63}

/* Diagramma comande */
.flusso{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;align-items:stretch}
.flusso .nodo{background:var(--inchiostro-2);border:1px solid #2f4565;border-radius:var(--r);padding:20px;position:relative;text-align:center}
.flusso .nodo strong{display:block;color:#fff;font-family:var(--titoli);font-size:1.25rem;margin:8px 0 4px}
.flusso .nodo span{font-size:.92rem;color:#b9c6d8}
.flusso .nodo svg{width:38px;height:38px;color:var(--senape)}
.flusso .nodo+.nodo::before{content:"→";position:absolute;left:-13px;top:50%;transform:translateY(-50%);color:var(--senape);font-size:1.3rem;font-weight:700}

/* FAQ */
.faq details{background:#fff;border:1px solid var(--linea);border-radius:var(--r);margin-bottom:12px;padding:0 20px}
.faq summary{cursor:pointer;list-style:none;padding:18px 28px 18px 0;font:600 1.12rem var(--corpo);color:var(--inchiostro);position:relative}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";position:absolute;right:0;top:50%;transform:translateY(-50%);font-size:1.6rem;color:var(--rame)}
.faq details[open] summary::after{content:"–"}
.faq details p{color:var(--tenue);padding-bottom:16px;margin:0}

/* Form */
.modulo{background:#fff;border:1px solid var(--linea);border-radius:16px;padding:30px;box-shadow:var(--ombra)}
.modulo .coppia{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.modulo label{display:block;font-weight:600;font-size:.95rem;margin:14px 0 6px;color:var(--inchiostro)}
.modulo input[type=text],.modulo input[type=email],.modulo input[type=tel],.modulo input[type=number],.modulo textarea,.modulo select{width:100%;padding:12px 14px;border:1px solid #cfc6b4;border-radius:10px;background:#fff;font:500 1rem var(--corpo);color:var(--testo)}
.modulo textarea{min-height:120px;resize:vertical}
.modulo .scelte{display:flex;flex-wrap:wrap;gap:8px 20px;margin-top:6px}
.modulo .scelte label,.modulo .consenso label{display:flex;align-items:flex-start;gap:9px;font-weight:500;margin:0}
.modulo input[type=checkbox]{width:19px;height:19px;margin-top:3px;accent-color:var(--rame)}
.modulo .consenso{margin:18px 0}
.modulo .trappola{position:absolute;left:-9999px;height:0;overflow:hidden}
.avviso{padding:14px 18px;border-radius:10px;margin-bottom:18px;font-weight:600}
.avviso.ok{background:#dcefe5;color:#1d5a40}
.avviso.errore{background:#fbe0dc;color:#8c2a1d}

/* Prezzi */
.prezzi .scheda h3{display:flex;justify-content:space-between;gap:10px;align-items:baseline}
.prezzi .cifra{font:600 2.3rem var(--titoli);color:var(--inchiostro);margin:6px 0}
.prezzi ul{padding-left:1.1em;color:var(--tenue);margin:12px 0 0}
.confronto{width:100%;border-collapse:collapse;background:#fff;border:1px solid var(--linea);border-radius:var(--r);overflow:hidden}
.confronto th,.confronto td{padding:13px 16px;border-bottom:1px solid var(--linea);text-align:left;font-size:.98rem}
.confronto th{background:var(--crema-2);color:var(--inchiostro)}

/* Appello finale e piè */
.appello{background:linear-gradient(135deg,var(--inchiostro),#1f3a5c);color:#d9e1ec;text-align:center}
.appello h2{color:#fff}
.appello p{max-width:640px;margin:0 auto 26px;color:#b9c6d8;font-size:1.12rem}
.pie{background:#0f1a2b;color:#aab6c8;padding:46px 0 28px;font-size:.95rem}
.pie a{color:#d9e1ec}
.pie .griglia{grid-template-columns:1.4fr 1fr 1fr;gap:34px}
.pie h3{color:#fff;font:600 1rem var(--corpo);margin-bottom:10px;letter-spacing:.04em;text-transform:uppercase}
.pie ul{list-style:none;padding:0;margin:0}
.pie li{margin-bottom:6px}
.pie .sotto{border-top:1px solid #22334d;margin-top:30px;padding-top:18px;font-size:.88rem;color:#8593a8}

/* Pagine interne */
.titolo-pagina{padding:56px 0 40px;background:var(--crema-2);border-bottom:1px solid var(--linea)}
.titolo-pagina p{font-size:1.15rem;color:var(--tenue);max-width:720px;margin:0}
.testo-lungo{max-width:800px}
.testo-lungo h2{font-size:1.7rem;margin-top:1.6em}
.testo-lungo li{margin-bottom:.4em}
.nota{background:#fff8e8;border-left:4px solid var(--senape);padding:14px 18px;border-radius:8px;color:#5b4a1e}

/* Responsive */
@media(max-width:960px){
  .hero .contenitore,.riga,.riga.inversa{grid-template-columns:1fr}
  .riga.inversa .testo{order:0}
  .g3,.g4,.passi,.flusso{grid-template-columns:1fr 1fr}
  .flusso .nodo+.nodo::before{display:none}
  .pie .griglia{grid-template-columns:1fr 1fr}
}
@media(max-width:720px){
  section{padding:42px 0}
  .apri-menu{display:block}
  .menu{display:none;position:absolute;left:0;right:0;top:68px;background:var(--crema);border-bottom:1px solid var(--linea);flex-direction:column;align-items:stretch;padding:12px 20px 18px;margin:0;gap:2px}
  .menu.aperto{display:flex}
  .menu .bottone{margin:8px 0 0}
  .g3,.g4,.g2,.passi,.flusso,.modulo .coppia,.pie .griglia{grid-template-columns:1fr}
  .azioni .bottone{flex:1 1 100%}
}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}

/* Metriche in evidenza */
.metriche{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:30px;max-width:640px}
.metriche div{background:#fff;border:1px solid var(--linea);border-radius:var(--r);padding:14px 16px}
.metriche b{display:block;font:600 2rem/1.1 var(--titoli);color:var(--rame)}
.metriche span{font-size:.9rem;color:var(--tenue);line-height:1.3;display:block;margin-top:4px}

/* Calcolatore del risparmio */
.calcolatore{background:#fff;border:1px solid var(--linea);border-radius:16px;box-shadow:var(--ombra);padding:30px;display:grid;grid-template-columns:1.1fr 1fr;gap:34px;align-items:center}
.calcolatore label{display:block;font-weight:600;margin:0 0 6px;color:var(--inchiostro)}
.calcolatore .campo{margin-bottom:18px}
.calcolatore .interruttore{display:flex;gap:10px;align-items:center;font-weight:500;cursor:pointer}
.calcolatore .interruttore input{width:20px;height:20px;accent-color:var(--rame)}
.calcolatore #c-canone-box{margin-top:12px}
.calcolatore input[type=range]{width:100%;accent-color:var(--rame)}
.calcolatore .valore{font:600 1.1rem var(--corpo);color:var(--rame-scuro)}
.calcolatore .esito{background:var(--inchiostro);color:#d9e1ec;border-radius:14px;padding:26px;text-align:center}
.calcolatore .esito small{display:block;color:#b9c6d8}
.calcolatore .esito .cifra{font:600 3rem/1.1 var(--titoli);color:#fff;margin:6px 0}
.calcolatore .esito .vs{margin-top:12px;padding-top:12px;border-top:1px solid #2f4565;font-weight:600;color:var(--senape)}
.calcolatore .nota-c{grid-column:1/-1;font-size:.88rem;color:var(--tenue);margin:0}

/* Testimonianze (compaiono solo se ce ne sono) */
.citazione{background:#fff;border:1px solid var(--linea);border-radius:var(--r);padding:26px;box-shadow:var(--ombra)}
.citazione p{font:400 1.25rem/1.45 var(--titoli);color:var(--inchiostro)}
.citazione footer{font-size:.92rem;color:var(--tenue)}
@media(max-width:960px){.calcolatore{grid-template-columns:1fr}.metriche{grid-template-columns:1fr 1fr 1fr}}
@media(max-width:560px){.metriche{grid-template-columns:1fr}}