/* ==========================================================================
   Munna Bus — foglio di stile unico
   Direzione "Blu notte": blu #0E1A2E + verde della livrea #9CBC6A
   Nessun build step: se modifichi qui, rigenera style.min.css con minifica.py
   ========================================================================== */

:root{
  --navy:#0E1A2E;
  --navy-2:#16263F;
  --navy-3:#1E3350;
  --verde:#9CBC6A;          /* verde della livrea, per fondi scuri */
  --verde-scuro:#5E743D;    /* stessa tinta scurita, per testo su chiaro */
  --verde-tenue:#EEF3E6;
  --ghiaccio:#EDF1F6;
  --ghiaccio-2:#F7F9FB;
  --ink:#0C1220;
  --ink-2:#4E5866;
  --ink-3:#7A8494;
  --linea:#DDE3EA;
  --bianco:#FFFFFF;
  --ombra:0 14px 34px -22px rgba(12,18,32,.55);
  --max:1180px;
  --r:2px;
}

*,*::before,*::after{box-sizing:border-box}

html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){ html{scroll-behavior:auto} }

body{
  margin:0;
  background:var(--bianco);
  color:var(--ink);
  font-family:"IBM Plex Sans",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
  font-size:16.5px;
  line-height:1.62;
  -webkit-font-smoothing:antialiased;
}

img{max-width:100%; height:auto; display:block}
a{color:inherit}

h1,h2,h3,h4{
  font-family:"Archivo",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  margin:0; text-wrap:balance; letter-spacing:-.02em;
}
h1{font-weight:800; font-size:clamp(2rem,5vw,3.15rem); line-height:1.05}
h2{font-weight:800; font-size:clamp(1.5rem,3.4vw,2.15rem); line-height:1.12; text-transform:uppercase}
h3{font-weight:700; font-size:clamp(1.1rem,2.2vw,1.35rem); line-height:1.2}
p{margin:0 0 1.05em}
p:last-child{margin-bottom:0}

.wrap{max-width:var(--max); margin:0 auto; padding:0 22px}
.sr-only{
  position:absolute; width:1px; height:1px; padding:0; margin:-1px;
  overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; border:0;
}
:focus-visible{outline:3px solid var(--verde); outline-offset:2px}

/* ---------- salta al contenuto ---------- */
.skip{
  position:absolute; left:-9999px; top:0; z-index:200;
  background:var(--verde); color:var(--navy); padding:10px 18px; font-weight:700;
}
.skip:focus{left:0}

/* ==========================================================================
   Intestazione
   ========================================================================== */
.header{background:var(--navy); position:sticky; top:0; z-index:100}
.header-in{
  max-width:var(--max); margin:0 auto; padding:10px 22px;
  display:flex; align-items:center; justify-content:space-between; gap:20px;
}
.logo{display:flex; align-items:center; gap:13px; text-decoration:none; flex-shrink:0}
.logo img{height:64px; width:auto}
/* il marchio tondo si riconosce, il nome scritto si legge anche in piccolo */
.logo-txt{display:flex; flex-direction:column; line-height:1.15}
.logo-txt b{
  font-family:"Archivo",sans-serif; font-weight:800; font-size:19px;
  color:#fff; letter-spacing:-.02em; text-transform:uppercase;
}
.logo-txt em{
  font-style:normal; font-size:10.5px; letter-spacing:.13em; text-transform:uppercase;
  color:var(--verde); margin-top:3px;
}

.nav{display:flex; align-items:center; gap:26px}
.nav a{
  color:#9FB0C4; text-decoration:none; font-size:13px; font-weight:500;
  text-transform:uppercase; letter-spacing:.07em; padding:6px 0;
  border-bottom:2px solid transparent; transition:color .18s, border-color .18s;
}
.nav a:hover{color:#fff}
.nav a[aria-current="page"]{color:#fff; border-bottom-color:var(--verde)}

/* .nav a ha specificità 0-1-1: per vincere serve 0-2-0, non .nav-tel da solo */
.nav a.nav-tel{
  background:var(--verde); color:var(--navy); text-decoration:none;
  font-weight:700; font-size:13.5px; padding:11px 18px; border-radius:var(--r);
  white-space:nowrap; transition:background .18s;
  border-bottom:0; text-transform:none; letter-spacing:0;
}
.nav a.nav-tel:hover{background:#ADCB7C; color:var(--navy)}

/* ---------- selettore di lingua ----------
   Bandiere disegnate in SVG, non emoji: su Windows le emoji-bandiera non
   esistono e al loro posto compaiono due lettere blu. */
.lingua{
  display:inline-flex; align-items:center; gap:7px; cursor:pointer;
  background:none; border:1px solid rgba(255,255,255,.28); border-radius:var(--r);
  padding:7px 11px; font-family:inherit; color:#C3CDDA;
  font-size:11.5px; font-weight:700; letter-spacing:.08em;
  transition:border-color .18s, color .18s; flex-shrink:0;
}
.lingua:hover{border-color:var(--verde); color:#fff}
.bandiera{width:22px; height:15px; display:block; background-size:cover; border-radius:1px}
.bandiera-en{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 60 30'%3E%3Cpath fill='%23012169' d='M0 0h60v30H0z'/%3E%3Cpath stroke='%23fff' stroke-width='6' d='m0 0 60 30m0-30L0 30'/%3E%3Cpath stroke='%23C8102E' stroke-width='4' d='m0 0 60 30m0-30L0 30'/%3E%3Cpath stroke='%23fff' stroke-width='10' d='M30 0v30M0 15h60'/%3E%3Cpath stroke='%23C8102E' stroke-width='6' d='M30 0v30M0 15h60'/%3E%3C/svg%3E")}
.bandiera-it{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 3 2'%3E%3Cpath fill='%23009246' d='M0 0h1v2H0z'/%3E%3Cpath fill='%23fff' d='M1 0h1v2H1z'/%3E%3Cpath fill='%23CE2B37' d='M2 0h1v2H2z'/%3E%3C/svg%3E")}
@media (max-width:900px){
  .lingua{margin-left:auto; margin-right:6px}
  .lingua-sigla{display:none}
}

.burger{
  display:none; background:none; border:0; cursor:pointer; padding:8px;
  width:44px; height:44px;
}
.burger span{display:block; width:26px; height:2px; background:#fff; margin:5px 0; transition:transform .2s, opacity .2s}
.burger[aria-expanded="true"] span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.burger[aria-expanded="true"] span:nth-child(2){opacity:0}
.burger[aria-expanded="true"] span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

@media (max-width:900px){
  .nav{
    display:none; position:absolute; top:100%; left:0; right:0;
    background:var(--navy-2); flex-direction:column; align-items:stretch; gap:0;
    padding:8px 22px 18px; border-top:1px solid rgba(255,255,255,.1);
  }
  .nav.aperto{display:flex}
  .nav a{padding:13px 0; border-bottom:1px solid rgba(255,255,255,.07); font-size:14px}
  .nav a[aria-current="page"]{border-bottom-color:rgba(255,255,255,.07); color:var(--verde)}
  .nav .nav-tel{margin-top:14px; text-align:center; border-bottom:0}
  .burger{display:block}
  .header-in{position:relative}
  .logo img{height:50px}
  .logo-txt b{font-size:16px}
  .logo-txt em{font-size:9.5px; letter-spacing:.1em}
}
@media (max-width:420px){
  .logo-txt em{display:none}
}
@media (max-width:400px){ .nav-tel-top{display:none} }

/* ==========================================================================
   Hero
   ========================================================================== */
.hero{background:var(--navy); color:#fff; overflow:hidden}
.hero-grid{
  max-width:var(--max); margin:0 auto;
  display:grid; grid-template-columns:1.02fr .98fr; align-items:stretch;
}
.hero-txt{padding:64px 22px 64px; display:flex; flex-direction:column; justify-content:center}
.eyebrow{
  font-size:11.5px; font-weight:600; letter-spacing:.2em; text-transform:uppercase;
  color:var(--verde); margin-bottom:18px;
}
.hero h1{margin-bottom:18px}
.hero-sub{color:#A9B6C7; font-size:1.02rem; max-width:46ch; margin-bottom:28px}
.hero-cta{display:flex; gap:12px; flex-wrap:wrap}
.hero-img{position:relative; min-height:460px}
.hero-img img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:50% 42%}

@media (max-width:860px){
  .hero-grid{grid-template-columns:1fr}
  .hero-txt{padding:44px 22px 38px; order:2}
  .hero-img{min-height:260px; order:1}
}

/* ---------- bottoni ---------- */
.btn{
  display:inline-block; text-decoration:none; font-weight:700; font-size:14px;
  padding:14px 24px; border-radius:var(--r); text-align:center; border:1px solid transparent;
  transition:background .18s, color .18s, border-color .18s;
}
.btn-verde{background:var(--verde); color:var(--navy)}
.btn-verde:hover{background:#ADCB7C}
.btn-bordo{border-color:rgba(255,255,255,.42); color:#fff}
.btn-bordo:hover{background:rgba(255,255,255,.1)}
.btn-scuro{background:var(--navy); color:#fff}
.btn-scuro:hover{background:var(--navy-3)}
.btn-largo{width:100%}

/* ==========================================================================
   Fascia numeri
   ========================================================================== */
.numeri{background:var(--navy-2); color:#fff}
.numeri-in{
  max-width:var(--max); margin:0 auto;
  display:grid; grid-template-columns:repeat(4,1fr);
}
.numeri div{padding:22px; border-right:1px solid rgba(255,255,255,.1)}
.numeri div:last-child{border-right:0}
.numeri b{
  display:block; font-family:"Archivo",sans-serif; font-weight:800; font-size:1.9rem;
  line-height:1; color:var(--verde); font-variant-numeric:tabular-nums;
}
.numeri span{
  display:block; margin-top:8px; font-size:11.5px; text-transform:uppercase;
  letter-spacing:.09em; color:#93A2B5;
}
@media (max-width:720px){
  .numeri-in{grid-template-columns:1fr 1fr}
  .numeri div:nth-child(-n+2){border-bottom:1px solid rgba(255,255,255,.1)}
  .numeri div:nth-child(2n){border-right:0}
  .numeri div{padding:18px}
}

/* ==========================================================================
   Sezioni
   ========================================================================== */
.sez{padding:72px 0}
.sez-chiara{background:var(--ghiaccio)}
.sez-scura{background:var(--navy); color:#fff}
.sez-scura .sez-intro{color:#A9B6C7}
.sez-testa{margin-bottom:38px; max-width:62ch}
.sez-testa .eyebrow{color:var(--verde-scuro)}
.sez-scura .sez-testa .eyebrow{color:var(--verde)}
.sez-intro{color:var(--ink-2); margin-top:14px; font-size:1.02rem}
@media (max-width:640px){ .sez{padding:52px 0} }

/* ---------- griglia servizi ---------- */
.servizi{display:grid; grid-template-columns:repeat(3,1fr); gap:16px}
.servizio{
  background:var(--bianco); padding:26px 24px; border-left:3px solid var(--verde-scuro);
  display:flex; flex-direction:column;
}
.servizio h3{font-size:1.08rem; margin-bottom:9px}
.servizio p{color:var(--ink-2); font-size:.95rem; margin:0}
.servizio a{
  margin-top:16px; font-size:13px; font-weight:600; color:var(--verde-scuro);
  text-decoration:none; border-bottom:1px solid currentColor; align-self:flex-start;
}
@media (max-width:900px){ .servizi{grid-template-columns:1fr 1fr} }
@media (max-width:600px){ .servizi{grid-template-columns:1fr} }

/* ---------- schede mezzo ---------- */
.mezzi{display:grid; grid-template-columns:1fr 1fr; gap:26px}
.mezzo{border:1px solid var(--linea); background:var(--bianco); display:flex; flex-direction:column}
.mezzo-foto{aspect-ratio:16/10; overflow:hidden; background:var(--ghiaccio)}
.mezzo-foto img{width:100%; height:100%; object-fit:cover}
.mezzo-corpo{padding:24px; display:flex; flex-direction:column; flex:1}
.capienza{
  display:inline-block; align-self:flex-start; background:var(--navy); color:#fff;
  font-weight:700; font-size:12.5px; letter-spacing:.02em; padding:5px 11px;
  font-variant-numeric:tabular-nums; margin-bottom:12px;
}
.mezzo h3{margin-bottom:10px; text-transform:uppercase; font-size:1.15rem}
.mezzo p{color:var(--ink-2); font-size:.95rem}
.dotazioni{list-style:none; padding:0; margin:16px 0 0; display:grid; gap:7px}
.dotazioni li{position:relative; padding-left:20px; font-size:.92rem; color:var(--ink-2)}
.dotazioni li::before{
  content:""; position:absolute; left:0; top:.62em;
  width:9px; height:2px; background:var(--verde-scuro);
}
@media (max-width:820px){ .mezzi{grid-template-columns:1fr} }

/* ---------- copertina con foto a tutta larghezza ---------- */
/* niente z-index negativi: con un background sul contenitore finirebbero dietro */
.copertina{position:relative; background:var(--navy); color:#fff; overflow:hidden}
.copertina-sfondo{
  position:absolute; inset:0; width:100%; height:100%; object-fit:cover;
  object-position:50% 46%; z-index:0;
}
.copertina-velo{
  position:absolute; inset:0; z-index:1;
  background:linear-gradient(100deg, rgba(14,26,46,.95) 0%, rgba(14,26,46,.86) 32%, rgba(14,26,46,.38) 62%, rgba(14,26,46,.08) 100%);
}
.copertina-txt{position:relative; z-index:2; padding:88px 22px 84px; max-width:var(--max)}
.copertina-txt h1{margin:0 0 18px}
.copertina-txt .sez-intro{color:#C2CDDB; max-width:60ch}
.copertina-txt .eyebrow{color:var(--verde)}
@media (max-width:640px){
  .copertina-txt{padding:56px 22px 52px}
  .copertina-velo{background:linear-gradient(180deg, rgba(14,26,46,.92) 0%, rgba(14,26,46,.86) 60%, rgba(14,26,46,.78) 100%)}
}

/* ---------- apertura a tutta larghezza ---------- */
.hero-largo{position:relative; background:var(--navy); color:#fff; overflow:hidden; min-height:540px;
  display:flex; align-items:center}
.hero-largo-sfondo{
  position:absolute; inset:0; width:100%; height:100%; object-fit:cover;
  object-position:58% 72%; z-index:0;
}
/* il velo scurisce da destra: il gran turismo bianco, che sta a sinistra, resta in vista */
/* velo leggero: serve solo a staccare il testo dallo sfondo, non a coprire la
   fotografia. La leggibilità la garantisce l'ombra sulle lettere. */
.hero-largo-velo{
  position:absolute; inset:0; z-index:1;
  background:
    linear-gradient(264deg, rgba(14,26,46,.62) 0%, rgba(14,26,46,.40) 34%,
                    rgba(14,26,46,.14) 62%, rgba(14,26,46,0) 100%),
    linear-gradient(180deg, rgba(14,26,46,.30) 0%, rgba(14,26,46,.10) 40%,
                    rgba(14,26,46,.34) 100%);
}
.hero-largo-txt{
  position:relative; z-index:2; width:100%;
  /* la classe "wrap" mette max-width e margin:auto per centrare i contenitori
     normali: qui vanno annullati esplicitamente, altrimenti il testo resta
     chiuso in un riquadro centrato e su monitor larghi non arriva al bordo */
  max-width:none; margin:0; padding:76px 34px 76px 22px;
  text-align:right;
}
.hero-largo-txt > *{max-width:29rem; margin-left:auto; margin-right:0}
.hero-largo-txt h1{
  margin-bottom:18px; max-width:30rem;
  text-shadow:0 2px 18px rgba(8,14,26,.85), 0 1px 3px rgba(8,14,26,.6);
}
.hero-largo-txt .eyebrow{text-shadow:0 1px 10px rgba(8,14,26,.9)}
.hero-largo-txt .hero-sub{
  margin-bottom:28px; color:#E4EAF2;
  text-shadow:0 1px 12px rgba(8,14,26,.9), 0 1px 3px rgba(8,14,26,.7);
}
.hero-largo-txt .hero-cta{justify-content:flex-end}
@media (max-width:860px){
  .hero-largo{min-height:0}
  .hero-largo-txt{padding:52px 22px 48px}
  .hero-largo-txt > *{margin-left:0; max-width:100%}
  .hero-largo-sfondo{object-position:42% 68%}
  .hero-largo-velo{background:linear-gradient(180deg, rgba(14,26,46,.88) 0%,
                   rgba(14,26,46,.84) 55%, rgba(14,26,46,.74) 100%)}
}

/* ---------- il titolo è la frase della fiancata ---------- */
.h1-frase{
  font-family:"Playfair Display",Georgia,serif; font-weight:700; font-style:italic;
  font-size:clamp(1.5rem,3.6vw,2.5rem); line-height:1.22; letter-spacing:-.02em;
  max-width:24ch;
}

/* ---------- fascia del marchio ---------- */
.marchio{background:var(--ghiaccio); padding:64px 0}
.marchio-in{display:grid; grid-template-columns:1.15fr .85fr; gap:38px; align-items:center}
.marchio-in img{width:100%; box-shadow:var(--ombra)}
.marchio-txt h2{margin-bottom:14px}
.marchio-txt p{color:var(--ink-2)}
.marchio-txt .eyebrow{color:var(--verde-scuro)}
@media (max-width:820px){
  .marchio-in{grid-template-columns:1fr; gap:26px}
  .marchio{padding:48px 0}
}

/* ---------- bottone WhatsApp ---------- */
.btn-wa{display:inline-flex; align-items:center; gap:9px}
.btn-wa svg{flex-shrink:0}
.btn-wa-pieno{background:#25683F; color:#fff; border-color:#25683F}
.btn-wa-pieno:hover{background:#1D5432; color:#fff}

/* ---------- mete ---------- */
.mete{display:grid; grid-template-columns:repeat(3,1fr); gap:14px}
.mete img{width:100%; aspect-ratio:16/9; object-fit:cover; background:var(--ghiaccio)}
.mete-piccole{grid-template-columns:repeat(4,1fr); margin-top:14px}
.mete-piccole img{aspect-ratio:1/1}
@media (max-width:760px){
  .mete{grid-template-columns:1fr 1fr; gap:10px}
  .mete-piccole{grid-template-columns:1fr 1fr}
}

/* ---------- galleria ---------- */
.galleria{
  display:grid; grid-template-columns:repeat(3,1fr); gap:14px;
}
.galleria img{
  width:100%; aspect-ratio:4/3; object-fit:cover; background:var(--ghiaccio);
}
@media (max-width:760px){ .galleria{grid-template-columns:1fr 1fr; gap:10px} }

/* ---------- fascia con foto ---------- */
.fascia{background:var(--navy-2); color:#fff}
.fascia-in{
  max-width:var(--max); margin:0 auto;
  display:grid; grid-template-columns:.92fr 1.08fr; align-items:stretch;
}
.fascia-foto{position:relative; min-height:320px}
.fascia-foto img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover}
.fascia-txt{padding:52px 22px; display:flex; flex-direction:column; justify-content:center}
.fascia-txt p{color:#A9B6C7; max-width:52ch}
.fascia-txt h2{margin-bottom:16px}
.fascia-rovescia .fascia-foto{order:2}
@media (max-width:860px){
  .fascia-in{grid-template-columns:1fr}
  .fascia-foto,.fascia-rovescia .fascia-foto{min-height:230px; order:1}
  .fascia-txt{padding:40px 22px; order:2}
}

/* ---------- passi ---------- */
.passi{display:grid; grid-template-columns:repeat(3,1fr); gap:26px; counter-reset:p}
.passo{counter-increment:p; padding-top:18px; border-top:2px solid var(--verde-scuro)}
.passo::before{
  content:counter(p,decimal-leading-zero);
  font-family:"Archivo",sans-serif; font-weight:800; font-size:.95rem;
  color:var(--verde-scuro); display:block; margin-bottom:10px;
  font-variant-numeric:tabular-nums;
}
.passo h3{font-size:1.05rem; margin-bottom:7px}
.passo p{color:var(--ink-2); font-size:.94rem; margin:0}
@media (max-width:760px){ .passi{grid-template-columns:1fr; gap:22px} }

/* ---------- elenco zone ---------- */
.zone{display:flex; flex-wrap:wrap; gap:10px; margin-top:24px}
.zone a{
  text-decoration:none; font-size:13.5px; font-weight:600; color:var(--ink);
  background:var(--bianco); border:1px solid var(--linea); padding:9px 15px;
  border-radius:var(--r); transition:border-color .18s, color .18s;
}
.zone a:hover{border-color:var(--verde-scuro); color:var(--verde-scuro)}

/* ---------- città servite: elenco, non pagine ---------- */
.citta{
  list-style:none; padding:0; margin:0;
  display:flex; flex-wrap:wrap; gap:8px 10px;
}
.citta li{
  font-size:13.5px; color:var(--ink-2); background:var(--bianco);
  border:1px solid var(--linea); border-radius:var(--r); padding:7px 13px;
}

/* ---------- richiamo finale ---------- */
.richiamo{background:var(--verde-tenue); border-top:3px solid var(--verde-scuro)}
.richiamo-in{
  max-width:var(--max); margin:0 auto; padding:52px 22px;
  display:flex; align-items:center; justify-content:space-between; gap:32px; flex-wrap:wrap;
}
.richiamo h2{margin-bottom:10px}
.richiamo p{color:var(--ink-2); max-width:52ch; margin:0}
.richiamo-cta{display:flex; gap:12px; flex-wrap:wrap}

/* ==========================================================================
   Modulo preventivo
   ========================================================================== */
.form-box{
  background:var(--bianco); border:1px solid var(--linea);
  padding:32px; box-shadow:var(--ombra);
}
.campi{display:grid; grid-template-columns:1fr 1fr; gap:16px}
.campo{display:flex; flex-direction:column; gap:6px}
.campo-largo{grid-column:1/-1}
.campo label{font-size:12.5px; font-weight:600; text-transform:uppercase; letter-spacing:.06em; color:var(--ink-2)}
.campo label .obb{color:var(--verde-scuro)}
.campo input,.campo select,.campo textarea{
  font-family:inherit; font-size:15.5px; color:var(--ink);
  padding:12px 13px; border:1px solid var(--linea); border-radius:var(--r);
  background:var(--bianco); width:100%;
}
.campo textarea{min-height:118px; resize:vertical}
.campo input:focus,.campo select:focus,.campo textarea:focus{border-color:var(--verde-scuro)}
.form-nota{font-size:.86rem; color:var(--ink-3); margin:18px 0 0}
.form-nota a{color:var(--verde-scuro)}
.trappola{position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden}
.form-esito{
  display:none; margin-top:20px; padding:16px 18px;
  background:var(--verde-tenue); border-left:3px solid var(--verde-scuro); font-size:.95rem;
}
.form-esito.visibile{display:block}
.form-esito.errore{background:#FDF0EC; border-left-color:#B4472A}
@media (max-width:640px){
  .campi{grid-template-columns:1fr}
  .form-box{padding:24px 20px}
}

/* ---------- due colonne testo + form ---------- */
.due-col{display:grid; grid-template-columns:.85fr 1.15fr; gap:46px; align-items:start}
@media (max-width:900px){ .due-col{grid-template-columns:1fr; gap:32px} }

/* ---------- blocco contatti ---------- */
.contatti-lista{list-style:none; padding:0; margin:0; display:grid; gap:20px}
.contatti-lista li{display:grid; gap:3px}
.contatti-lista .et{font-size:11.5px; text-transform:uppercase; letter-spacing:.1em; color:var(--ink-3); font-weight:600}
.contatti-lista .vl{font-size:1.05rem; font-weight:600}
.contatti-lista a{color:inherit; text-decoration:none; border-bottom:1px solid var(--linea)}
.contatti-lista a:hover{border-bottom-color:var(--verde-scuro)}

/* ---------- domande frequenti ---------- */
.faq{display:grid; gap:2px; background:var(--linea); border:1px solid var(--linea)}
.faq details{background:var(--bianco)}
.faq summary{
  padding:18px 22px; cursor:pointer; font-weight:600; font-size:1rem;
  list-style:none; display:flex; justify-content:space-between; gap:16px; align-items:center;
}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+"; color:var(--verde-scuro); font-weight:700; font-size:1.2rem; line-height:1}
.faq details[open] summary::after{content:"–"}
.faq details > div{padding:0 22px 20px; color:var(--ink-2); font-size:.96rem}

/* ---------- prosa ---------- */
.prosa{max-width:68ch}
.prosa h2{margin:38px 0 14px}
.prosa h3{margin:28px 0 10px}
.prosa ul{padding-left:22px; color:var(--ink-2)}
.prosa li{margin-bottom:8px}

/* ==========================================================================
   Piè di pagina
   ========================================================================== */
.footer{background:var(--navy); color:#8D9BAC; padding:56px 0 0; font-size:.92rem}
.footer-grid{
  display:grid; grid-template-columns:1.4fr 1fr 1fr; gap:38px; padding-bottom:40px;
}
.footer h4{
  color:#fff; font-size:11.5px; text-transform:uppercase; letter-spacing:.12em;
  font-weight:700; margin-bottom:16px;
}
.footer a{color:#8D9BAC; text-decoration:none}
.footer a:hover{color:var(--verde)}
.footer ul{list-style:none; padding:0; margin:0; display:grid; gap:9px}
.footer-logo{height:64px; width:auto; margin-bottom:18px}
.footer-dati{font-size:.86rem; line-height:1.75}
.footer-basso{
  border-top:1px solid rgba(255,255,255,.1); padding:20px 0 26px;
  display:flex; justify-content:space-between; gap:18px; flex-wrap:wrap; font-size:.84rem;
}
.footer-partner{
  border-top:1px solid rgba(255,255,255,.1); padding:22px 0;
  display:flex; align-items:center; gap:16px; flex-wrap:wrap; font-size:.84rem;
}
@media (max-width:820px){ .footer-grid{grid-template-columns:1fr 1fr} }
@media (max-width:560px){ .footer-grid{grid-template-columns:1fr; gap:30px} }

/* ---------- bottone chiama da telefono ---------- */
.chiama-fisso{display:none}
@media (max-width:700px){
  .chiama-fisso{
    display:flex; position:fixed; left:14px; right:14px; bottom:14px; z-index:90;
    gap:10px;
  }
  .chiama-fisso a{
    flex:1; text-align:center; padding:14px; font-weight:700; font-size:14px;
    text-decoration:none; border-radius:var(--r); box-shadow:0 8px 22px -8px rgba(12,18,32,.5);
  }
  .chiama-fisso .c-tel{background:var(--verde); color:var(--navy)}
  .chiama-fisso .c-wa{background:#25683F; color:#fff}
  .chiama-fisso .c-prev{background:var(--navy); color:#fff}
  .chiama-fisso a{font-size:13px; padding:13px 8px}
  body{padding-bottom:74px}
}

/* ---------- banner cookie ---------- */
.cookie{
  position:fixed; left:0; right:0; bottom:0; z-index:120; background:var(--navy-2);
  color:#C3CDDA; padding:16px 22px; font-size:.88rem; display:none;
  border-top:2px solid var(--verde);
}
.cookie.visibile{display:block}
.cookie-in{
  max-width:var(--max); margin:0 auto; display:flex; align-items:center;
  justify-content:space-between; gap:20px; flex-wrap:wrap;
}
.cookie a{color:var(--verde)}
.cookie button{
  font-family:inherit; font-size:13px; font-weight:700; padding:10px 20px;
  border:0; border-radius:var(--r); cursor:pointer; background:var(--verde); color:var(--navy);
}
