/* ══════════════════════════════════════════════════════════════════════════
   TRAILGO v2 — Foglio di stile del sito pubblico nuovo
   ──────────────────────────────────────────────────────────────────────────
   Regole fondanti, decise con il committente e da NON cambiare:
   · nessun fondo scuro, in nessuna sezione, footer compreso
   · palette: bianco, verde chiarissimo, verde TRAILGO (#2d6a4f)
   · corpo del testo 20px, titoli fino a 4,4rem
   · font: Figtree (titoli) + Public Sans (testo)

   Questo file NON dipende da Bootstrap e non include mai assets/css/style.css
   del sito vecchio. È autosufficiente.
   ══════════════════════════════════════════════════════════════════════════ */

/* ═══ 1. TOKEN ═══════════════════════════════════════════════════════════ */
:root{
  --verde:#2d6a4f;          /* accento principale */
  --verde-hover:#256045;
  --verde-scuro:#1f3a3a;    /* SOLO testo, mai sfondo */
  --verde-med:#40916c;
  --verde-chiaro:#e8f3ec;
  --verde-tenue:#f6f9f7;    /* sfondo sezioni alternate */
  --verde-linea:#cfe3d7;
  --bianco:#ffffff;
  --testo:#1f3a3a;
  --testo-soft:#54655f;
  --testo-tenue:#7b8a84;
  --linea:#e3eae5;
  --ambra:#b45309;          /* solo per avvisi, su fondo chiaro */
  --ambra-chiaro:#fdf6e8;
  --rosso:#b42318;
  --rosso-chiaro:#fdf2f0;
  --ombra-s:0 1px 2px rgba(31,58,58,.04), 0 6px 18px rgba(31,58,58,.06);
  --ombra-m:0 2px 6px rgba(31,58,58,.05), 0 18px 44px rgba(31,58,58,.09);
  --r-s:10px; --r-m:16px; --r-l:22px;
  --max:1300px;
}

/* ═══ 2. BASE ════════════════════════════════════════════════════════════ */
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;background:var(--bianco);color:var(--testo);
  font-family:'Public Sans',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;
  font-size:20px;line-height:1.7;-webkit-font-smoothing:antialiased;
}
h1,h2,h3,h4,h5{font-family:'Figtree','Public Sans',sans-serif;font-weight:800;letter-spacing:-.022em;line-height:1.12;margin:0;color:var(--verde-scuro);}
p{margin:0 0 1.15em;}
img{max-width:100%;display:block;}
a{color:var(--verde);}
hr{border:0;border-top:1px solid var(--linea);margin:44px 0;}
:focus-visible{outline:3px solid var(--verde);outline-offset:3px;border-radius:4px;}
.salta-al-contenuto{position:absolute;left:-9999px;top:0;background:var(--verde);color:#fff;padding:14px 22px;z-index:999;border-radius:0 0 var(--r-s) 0;font-weight:700;text-decoration:none;}
.salta-al-contenuto:focus{left:0;}

.wrap{max-width:var(--max);margin:0 auto;padding:0 40px;}
.wrap-stretto{max-width:900px;margin:0 auto;padding:0 40px;}
section{padding:104px 0;}
.sez-chiara{background:var(--verde-tenue);}
.sez-compatta{padding:68px 0;}
.centro{text-align:center;}
.mt-0{margin-top:0;} .mb-0{margin-bottom:0;}

/* ═══ 3. TESTATE DI SEZIONE ══════════════════════════════════════════════ */
.et{
  display:inline-flex;align-items:center;gap:9px;font-weight:700;font-size:.95rem;
  text-transform:uppercase;letter-spacing:.1em;color:var(--verde);
  background:var(--verde-chiaro);border:1px solid var(--verde-linea);
  padding:10px 20px;border-radius:999px;margin-bottom:24px;
}
.testata{max-width:900px;margin-bottom:60px;}
.testata.centro{margin-left:auto;margin-right:auto;}
.testata h2{font-size:clamp(2.3rem,4.4vw,3.5rem);margin-bottom:20px;}
.testata p{font-size:1.3rem;color:var(--testo-soft);margin:0;}

/* ═══ 4. PULSANTI ════════════════════════════════════════════════════════ */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:11px;text-decoration:none;
  font-family:'Figtree',sans-serif;font-weight:700;font-size:1.12rem;
  padding:19px 34px;border-radius:var(--r-s);transition:.2s;border:2px solid transparent;cursor:pointer;line-height:1.2;
}
.btn-verde{background:var(--verde);color:#fff;border-color:var(--verde);}
.btn-verde:hover{background:var(--verde-hover);border-color:var(--verde-hover);}
.btn-bordo{background:#fff;color:var(--verde);border-color:var(--verde);}
.btn-bordo:hover{background:var(--verde-chiaro);}
.btn-bordo-neutro{background:#fff;color:var(--verde-scuro);border-color:var(--linea);}
.btn-bordo-neutro:hover{border-color:var(--verde);color:var(--verde);}
.btn-grande{font-size:1.18rem;padding:21px 40px;}
.btn-piccolo{font-size:1rem;padding:13px 22px;}
.btn-largo{width:100%;}

/* ═══ 5. FASCIA DI SERVIZIO + HEADER ═════════════════════════════════════ */
.strip{background:var(--verde-chiaro);border-bottom:1px solid var(--verde-linea);font-size:.95rem;}
.strip .wrap{display:flex;align-items:center;justify-content:space-between;gap:20px;padding-top:11px;padding-bottom:11px;}
.strip .msg{display:flex;align-items:center;gap:10px;color:var(--verde);font-weight:600;}
.strip .msg i{font-size:1.05rem;}
.strip .dx{display:flex;align-items:center;gap:18px;}
.strip a,.strip button.lingua{color:var(--verde);text-decoration:none;font-weight:600;display:inline-flex;align-items:center;gap:7px;background:none;border:0;font-size:.95rem;font-family:inherit;cursor:pointer;padding:0;}
.strip a:hover,.strip button.lingua:hover{text-decoration:underline;}

/* Collegamento all'area riservata: un contorno leggero lo distingue dagli
   altri due, che sono voci di servizio. Non è un invito rivolto ai
   visitatori, quindi resta discreto: nessun riempimento pieno. */
.strip .riservata{border:1px solid var(--verde-linea);background:#fff;border-radius:999px;
  padding:5px 14px;transition:.15s;}
.strip .riservata:hover{background:var(--verde);border-color:var(--verde);color:#fff;
  text-decoration:none;}
.strip .riservata:focus-visible{outline:2px solid var(--verde-scuro);outline-offset:2px;}

header.hd{background:#fff;border-bottom:1px solid var(--linea);position:sticky;top:0;z-index:200;}
header.hd .wrap{display:flex;align-items:center;justify-content:space-between;gap:26px;padding-top:16px;padding-bottom:16px;}
header.hd .logo img{height:52px;width:auto;}
header.hd nav{display:flex;align-items:center;gap:2px;flex:1;justify-content:center;}
header.hd nav a,header.hd nav button.voce{
  text-decoration:none;color:var(--verde-scuro);font-weight:600;font-size:1.05rem;font-family:inherit;
  padding:11px 15px;border-radius:var(--r-s);transition:.18s;white-space:nowrap;
  display:inline-flex;align-items:center;gap:8px;background:none;border:0;cursor:pointer;
}
header.hd nav a i,header.hd nav button.voce i{color:var(--verde);font-size:1.05rem;}
header.hd nav a:hover,header.hd nav button.voce:hover{background:var(--verde-tenue);color:var(--verde);}
header.hd nav a.attivo,header.hd nav button.voce.attivo{color:var(--verde);background:var(--verde-chiaro);}
header.hd .dx{display:flex;align-items:center;gap:12px;}
header.hd .cta-enti{
  display:inline-flex;align-items:center;gap:11px;background:var(--verde);color:#fff;text-decoration:none;
  font-family:'Figtree',sans-serif;font-weight:700;font-size:1.02rem;padding:13px 24px 13px 14px;
  border-radius:var(--r-s);transition:.2s;white-space:nowrap;
}
header.hd .cta-enti .ico{width:30px;height:30px;border-radius:50%;background:#fff;color:var(--verde);display:flex;align-items:center;justify-content:center;font-size:.92rem;flex-shrink:0;}
header.hd .cta-enti:hover{background:var(--verde-hover);}
.hamb{display:none;background:#fff;border:1px solid var(--linea);border-radius:var(--r-s);color:var(--verde-scuro);font-size:1.7rem;cursor:pointer;padding:6px 12px;line-height:1;}

/* tendina "Esplora" e selettore lingua */
.tendina{position:relative;}
.tendina .menu{
  position:absolute;top:calc(100% + 10px);left:0;min-width:270px;background:#fff;
  border:1px solid var(--linea);border-radius:var(--r-m);box-shadow:var(--ombra-m);
  padding:10px;display:none;z-index:300;
}
.tendina .menu.destra{left:auto;right:0;}
.tendina.aperta .menu{display:block;}
.tendina .menu a{display:flex;align-items:center;gap:11px;padding:13px 15px;border-radius:var(--r-s);
  text-decoration:none;color:var(--verde-scuro);font-weight:600;font-size:1.02rem;white-space:nowrap;}
.tendina .menu a:hover{background:var(--verde-tenue);color:var(--verde);}
.tendina .menu a.attivo{background:var(--verde-chiaro);color:var(--verde);}
.tendina .menu .divisore{height:1px;background:var(--linea);margin:8px 6px;}

/* menu mobile */
.menu-mobile{display:none;background:#fff;border-bottom:1px solid var(--linea);}
.menu-mobile.aperto{display:block;}
.menu-mobile .wrap{padding-top:14px;padding-bottom:20px;}
.menu-mobile a{display:flex;align-items:center;gap:12px;padding:15px 4px;border-bottom:1px solid var(--linea);
  text-decoration:none;color:var(--verde-scuro);font-weight:600;font-size:1.08rem;}
.menu-mobile a i{color:var(--verde);}
.menu-mobile a.sotto{padding-left:32px;font-weight:500;font-size:1.02rem;}
.menu-mobile .cta-enti{margin-top:18px;justify-content:center;width:100%;}

/* ═══ 6. HERO CON VIDEO (solo home) ══════════════════════════════════════ */
.hero{position:relative;overflow:hidden;background:var(--verde-tenue);padding:0;}
.hero video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0;}
.hero .velo{
  position:absolute;inset:0;z-index:1;
  background:linear-gradient(100deg,rgba(255,255,255,.97) 0%,rgba(255,255,255,.95) 34%,rgba(255,255,255,.72) 52%,rgba(255,255,255,.12) 74%,rgba(255,255,255,0) 100%);
}
.hero .wrap{position:relative;z-index:2;padding-top:84px;padding-bottom:84px;}
.hero-box{max-width:760px;}
.hero .pre{
  display:inline-flex;align-items:center;gap:10px;background:var(--verde-chiaro);border:1px solid var(--verde-linea);
  color:var(--verde);font-weight:700;font-size:.98rem;padding:11px 20px;border-radius:999px;margin-bottom:26px;
}
.hero h1{font-size:clamp(2.7rem,5.4vw,4.4rem);line-height:1.05;letter-spacing:-.03em;margin-bottom:24px;}
.hero h1 span{color:var(--verde);}
.hero .lead{font-size:clamp(1.15rem,1.5vw,1.35rem);color:var(--testo-soft);margin-bottom:34px;max-width:660px;}
.hero-azioni{display:flex;flex-wrap:wrap;gap:13px;margin-bottom:22px;}
.hero-link{margin-bottom:44px;}
.hero-link a{color:var(--verde);font-weight:600;text-decoration:none;display:inline-flex;align-items:center;gap:9px;border-bottom:2px solid var(--verde-linea);padding-bottom:3px;font-size:1.06rem;}
.hero-link a:hover{border-color:var(--verde);}
.hero-numeri{display:flex;flex-wrap:wrap;gap:54px;}
.hero-numeri .n{font-family:'Figtree',sans-serif;font-weight:800;font-size:clamp(2.1rem,3.4vw,3rem);color:var(--verde);line-height:1;}
.hero-numeri .l{font-size:.94rem;color:var(--testo-soft);margin-top:7px;text-transform:uppercase;letter-spacing:.1em;font-weight:700;}

/* ═══ 7. TESTATA DELLE PAGINE INTERNE (senza video) ══════════════════════ */
.testata-pagina{background:var(--verde-tenue);border-bottom:1px solid var(--linea);padding:56px 0 60px;}
.testata-pagina h1{font-size:clamp(2.3rem,4.6vw,3.6rem);margin-bottom:18px;}
.testata-pagina p{font-size:1.25rem;color:var(--testo-soft);max-width:820px;margin:0;}
.briciole{display:flex;flex-wrap:wrap;gap:9px;align-items:center;font-size:.98rem;color:var(--testo-tenue);margin-bottom:20px;}
.briciole a{color:var(--verde);text-decoration:none;font-weight:600;}
.briciole a:hover{text-decoration:underline;}
.briciole i{font-size:.8rem;opacity:.6;}

/* ═══ 8. BARRA DI RICERCA ════════════════════════════════════════════════ */
.cerca{display:flex;background:#fff;border:2px solid var(--verde);border-radius:var(--r-m);overflow:hidden;box-shadow:var(--ombra-m);max-width:680px;margin-bottom:20px;}
.cerca input{border:0;outline:0;flex:1;font-size:1.1rem;font-family:inherit;padding:20px 22px;color:var(--testo);min-width:0;background:#fff;}
.cerca button{border:0;background:var(--verde);color:#fff;font-family:'Figtree',sans-serif;font-weight:700;font-size:1.08rem;padding:0 32px;cursor:pointer;display:flex;align-items:center;gap:9px;white-space:nowrap;}
.cerca button:hover{background:var(--verde-hover);}

/* ═══ 9. ACCESSI RAPIDI ══════════════════════════════════════════════════ */
.rapidi{border-bottom:1px solid var(--linea);background:#fff;}
.rapidi .wrap{padding-top:0;padding-bottom:0;}
.rapidi-g{display:grid;grid-template-columns:repeat(4,1fr);margin-top:-46px;position:relative;z-index:5;
  border:1px solid var(--linea);border-radius:var(--r-l);overflow:hidden;background:#fff;box-shadow:var(--ombra-m);}
.rapidi-g a{padding:34px 30px 36px;text-decoration:none;border-right:1px solid var(--linea);transition:.2s;display:block;color:inherit;}
.rapidi-g a:last-child{border-right:0;}
.rapidi-g a:hover{background:var(--verde-tenue);}
.rapidi-g .ic{width:56px;height:56px;border-radius:var(--r-m);background:var(--verde-chiaro);color:var(--verde);display:flex;align-items:center;justify-content:center;font-size:1.6rem;margin-bottom:18px;}
.rapidi-g h3{font-size:1.3rem;margin-bottom:7px;}
.rapidi-g p{font-size:1.02rem;color:var(--testo-soft);margin:0;}
.rapidi-g .vai{color:var(--verde);font-weight:700;font-size:1rem;margin-top:14px;display:inline-flex;align-items:center;gap:7px;}

/* ═══ 10. GRIGLIE E SCHEDE ═══════════════════════════════════════════════ */
.griglia{display:grid;gap:28px;}
.g2{grid-template-columns:repeat(2,1fr);}
.g3{grid-template-columns:repeat(3,1fr);}
.g4{grid-template-columns:repeat(4,1fr);}
.due-col{display:grid;grid-template-columns:1.05fr .95fr;gap:70px;align-items:center;}
/* Senza questo, una colonna della griglia non scende mai sotto la larghezza
   minima del suo contenuto: su telefono l'indice delle pagine legali usciva
   dallo schermo e trascinava con sé tutta la pagina. */
.due-col>*{min-width:0;}
.due-col a,.due-col p,.due-col li{overflow-wrap:break-word;}
.due-col h2{font-size:clamp(2.3rem,4.4vw,3.5rem);margin-bottom:22px;}
.due-col p{font-size:1.18rem;color:var(--testo-soft);}

.scheda{background:#fff;border:1px solid var(--linea);border-radius:var(--r-l);padding:42px 36px;transition:.2s;}
.scheda:hover{border-color:var(--verde-linea);box-shadow:var(--ombra-s);}
.scheda h3{font-size:1.5rem;margin-bottom:12px;}
.scheda p{color:var(--testo-soft);font-size:1.08rem;margin:0;}
.scheda .ic{width:62px;height:62px;border-radius:var(--r-m);background:var(--verde-chiaro);color:var(--verde);display:flex;align-items:center;justify-content:center;font-size:1.7rem;margin-bottom:22px;}

.scheda-foto{background:#fff;border:1px solid var(--linea);border-radius:var(--r-l);overflow:hidden;transition:.25s;display:flex;flex-direction:column;}
.scheda-foto:hover{box-shadow:var(--ombra-m);transform:translateY(-4px);}
.scheda-foto .im{height:250px;overflow:hidden;background:var(--verde-tenue);}
.scheda-foto .im img{width:100%;height:100%;object-fit:cover;transition:.6s;}
.scheda-foto:hover .im img{transform:scale(1.05);}
.scheda-foto .bd{padding:32px 32px 36px;flex:1;display:flex;flex-direction:column;}
.scheda-foto h3{font-size:1.5rem;margin-bottom:12px;}
.scheda-foto p{color:var(--testo-soft);font-size:1.06rem;}

.passi{display:grid;grid-template-columns:repeat(3,1fr);gap:28px;}
.passo{background:#fff;border:1px solid var(--linea);border-top:5px solid var(--verde);border-radius:var(--r-l);padding:44px 36px;}
.passo .n{width:62px;height:62px;border-radius:50%;background:var(--verde);color:#fff;display:flex;align-items:center;justify-content:center;
  font-family:'Figtree',sans-serif;font-weight:800;font-size:1.65rem;margin-bottom:22px;}
.passo h3{font-size:1.5rem;margin-bottom:13px;}
.passo p{color:var(--testo-soft);font-size:1.08rem;margin:0;}

.riquadro{background:#fff;border:1px solid var(--linea);border-radius:var(--r-l);box-shadow:var(--ombra-m);overflow:hidden;}
.riquadro .intest{background:var(--verde-chiaro);border-bottom:1px solid var(--verde-linea);padding:20px 32px;font-family:'Figtree',sans-serif;font-weight:800;font-size:1.1rem;color:var(--verde-scuro);}
.riquadro .rg{display:flex;align-items:center;gap:20px;padding:26px 32px;border-bottom:1px solid var(--linea);}
.riquadro .rg:last-child{border-bottom:0;}
.riquadro .rg .ic{width:54px;height:54px;border-radius:var(--r-m);background:var(--verde-chiaro);color:var(--verde);display:flex;align-items:center;justify-content:center;font-size:1.45rem;flex-shrink:0;}
.riquadro .rg .t{font-family:'Figtree',sans-serif;font-weight:700;font-size:1.15rem;line-height:1.3;}
.riquadro .rg .s{font-size:1rem;color:var(--testo-soft);margin-top:3px;}
.riquadro .rg2{display:flex;align-items:flex-start;gap:16px;padding:22px 32px;border-bottom:1px solid var(--linea);font-size:1.08rem;line-height:1.5;}
.riquadro .rg2:last-child{border-bottom:0;}
.riquadro .rg2 i{color:var(--verde);font-size:1.4rem;flex-shrink:0;}

/* ═══ 11. PROMESSE, ESPERIENZE, UTENTI, NUMERI ═══════════════════════════ */
.promesse{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;}
.promesse div{display:flex;align-items:center;gap:12px;background:#fff;border:1px solid var(--verde-linea);
  padding:20px 22px;border-radius:var(--r-m);font-family:'Figtree',sans-serif;font-weight:700;font-size:1.06rem;color:var(--verde-scuro);}
.promesse i{color:var(--verde);font-size:1.3rem;flex-shrink:0;}

.esperienze{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;}
.esperienze a{background:#fff;border:1px solid var(--linea);border-radius:var(--r-l);padding:34px 24px 32px;text-decoration:none;transition:.2s;display:block;color:inherit;}
.esperienze a:hover{border-color:var(--verde);background:var(--verde-tenue);transform:translateY(-4px);}
.esperienze .e{font-size:2.7rem;display:block;margin-bottom:12px;}
.esperienze .l{font-family:'Figtree',sans-serif;font-weight:700;font-size:1.16rem;display:block;margin-bottom:6px;color:var(--verde-scuro);}
.esperienze .d{font-size:.99rem;color:var(--testo-soft);line-height:1.55;}

.utenti{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;margin-top:48px;}
.utenti div{background:#fff;border:1px solid var(--linea);border-radius:var(--r-l);padding:30px 26px;text-align:center;}
.utenti .e{font-size:2.5rem;display:block;margin-bottom:10px;}
.utenti h4{font-size:1.2rem;margin-bottom:7px;}
.utenti p{font-size:1rem;color:var(--testo-soft);margin:0;}

.numeri{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;}
.numeri>div{background:#fff;border:1px solid var(--verde-linea);border-radius:var(--r-l);padding:42px 20px;text-align:center;}
.numeri .ic{width:56px;height:56px;border-radius:var(--r-m);background:var(--verde-chiaro);color:var(--verde);display:flex;align-items:center;justify-content:center;font-size:1.5rem;margin:0 auto 18px;}
.numeri .n{font-family:'Figtree',sans-serif;font-weight:800;font-size:clamp(2.5rem,4.4vw,3.8rem);color:var(--verde);line-height:1;}
.numeri .l{font-size:.98rem;font-weight:700;color:var(--testo-soft);margin-top:12px;text-transform:uppercase;letter-spacing:.1em;}

.check{display:grid;gap:16px;margin:28px 0 0;}
.check div{display:flex;align-items:flex-start;gap:13px;font-size:1.1rem;}
.check i{color:var(--verde);font-size:1.4rem;flex-shrink:0;line-height:1.35;}
.check strong{font-family:'Figtree',sans-serif;}
.foto-lato{border-radius:var(--r-l);overflow:hidden;border:1px solid var(--linea);height:560px;}
.foto-lato img{width:100%;height:100%;object-fit:cover;}

/* ═══ 12. SCHEDE PERCORSO ════════════════════════════════════════════════ */
.percorsi{display:grid;grid-template-columns:repeat(3,1fr);gap:28px;}
.percorso{background:#fff;border:1px solid var(--linea);border-radius:var(--r-l);overflow:hidden;transition:.25s;display:flex;flex-direction:column;}
.percorso:hover{box-shadow:var(--ombra-m);transform:translateY(-4px);}
.percorso .im{position:relative;height:230px;overflow:hidden;background:var(--verde-tenue);}
.percorso .im img{width:100%;height:100%;object-fit:cover;transition:.6s;}
.percorso:hover .im img{transform:scale(1.05);}
.tag-diff{position:absolute;top:16px;left:16px;background:#fff;color:var(--verde-scuro);font-weight:700;font-size:.92rem;padding:8px 16px;border-radius:999px;box-shadow:var(--ombra-s);text-transform:capitalize;}
.tag-acc{position:absolute;top:16px;right:16px;background:var(--verde);color:#fff;font-weight:700;font-size:.92rem;padding:8px 14px;border-radius:999px;}
.tag-acc.parziale{background:var(--ambra);}
.percorso .bd{padding:28px 28px 30px;flex:1;display:flex;flex-direction:column;}
.percorso h3{font-size:1.38rem;margin-bottom:8px;}
.percorso .luogo{color:var(--testo-soft);font-size:1.02rem;margin-bottom:18px;display:flex;align-items:center;gap:7px;}
.percorso .dati{display:grid;grid-template-columns:repeat(3,1fr);border:1px solid var(--linea);border-radius:var(--r-m);overflow:hidden;margin-bottom:22px;background:var(--verde-tenue);}
.percorso .dati span{padding:13px 8px;text-align:center;border-right:1px solid var(--linea);font-size:.9rem;color:var(--testo-soft);}
.percorso .dati span:last-child{border-right:0;}
.percorso .dati b{display:block;font-family:'Figtree',sans-serif;font-weight:800;font-size:1.12rem;color:var(--verde-scuro);}
.percorso .btn{width:100%;font-size:1.04rem;padding:15px;margin-top:auto;}
/* elenco strutture (strutture-lista.php) */
.str-tabs{display:flex;gap:12px;flex-wrap:wrap;margin-top:28px;}
.str-vuota{height:100%;display:flex;align-items:center;justify-content:center;}
.str-vuota i{font-size:3.4rem;color:var(--verde-linea);}
.str-logo{position:absolute;top:14px;right:14px;width:58px;height:58px;border-radius:14px;background:#fff;border:1px solid var(--linea);box-shadow:var(--ombra-s);display:flex;align-items:center;justify-content:center;padding:7px;}
.str-logo img{max-width:100%;max-height:100%;object-fit:contain;}
.str-righe{display:flex;flex-direction:column;gap:9px;margin-bottom:22px;}
.str-righe span{display:flex;align-items:center;gap:8px;color:var(--testo-soft);font-size:1rem;}
.str-righe .ok{color:var(--verde);font-weight:600;}

/* ═══ 13. MAPPA ══════════════════════════════════════════════════════════ */
.mappa-box{background:#fff;border:1px solid var(--linea);border-radius:var(--r-l);overflow:hidden;box-shadow:var(--ombra-s);height:580px;}
.mappa-box #map{width:100%;height:100%;}
.nota{text-align:center;color:var(--testo-soft);font-size:1rem;margin-top:20px;}

/* ═══ 14. FORM ═══════════════════════════════════════════════════════════ */
.campo{margin-bottom:24px;}
.campo label{display:block;font-family:'Figtree',sans-serif;font-weight:700;font-size:1.05rem;margin-bottom:9px;color:var(--verde-scuro);}
.campo .aiuto{font-size:.98rem;color:var(--testo-soft);margin-top:8px;font-weight:400;}
.campo input[type=text],.campo input[type=email],.campo input[type=tel],.campo input[type=password],
.campo select,.campo textarea{
  width:100%;font-family:inherit;font-size:1.08rem;color:var(--testo);background:#fff;
  border:2px solid var(--linea);border-radius:var(--r-s);padding:16px 18px;transition:.18s;
}
.campo textarea{min-height:180px;resize:vertical;}
.campo input:focus,.campo select:focus,.campo textarea:focus{border-color:var(--verde);outline:0;}
.campo.errore input,.campo.errore select,.campo.errore textarea{border-color:var(--rosso);}
.campo .msg-errore{color:var(--rosso);font-size:.98rem;margin-top:8px;font-weight:600;}
.obbligatorio{color:var(--rosso);}

.avviso{background:var(--verde-chiaro);border:1px solid var(--verde-linea);border-left:5px solid var(--verde);
  border-radius:var(--r-m);padding:20px 24px;color:var(--verde-scuro);font-weight:600;font-size:1.05rem;margin-bottom:30px;}
.avviso i{color:var(--verde);margin-right:8px;}
.avviso.ok{background:var(--verde-chiaro);border-left-color:var(--verde);}
.avviso.attenzione{background:var(--ambra-chiaro);border-color:#f3e2c0;border-left-color:var(--ambra);color:#6b4310;}
.avviso.attenzione i{color:var(--ambra);}
.avviso.errore{background:var(--rosso-chiaro);border-color:#f5d5d1;border-left-color:var(--rosso);color:#7d1f18;}
.avviso.errore i{color:var(--rosso);}

/* ═══ 15. FILTRI E PAGINAZIONE ═══════════════════════════════════════════ */
.filtri{background:#fff;border:1px solid var(--linea);border-radius:var(--r-l);padding:28px 30px;box-shadow:var(--ombra-s);margin-bottom:44px;}
.filtri-g{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;align-items:end;}
.filtri .campo{margin-bottom:0;}
.filtri label{font-size:.98rem;}
.conteggio{color:var(--testo-soft);font-size:1.08rem;margin-bottom:28px;}
.conteggio b{color:var(--verde-scuro);font-family:'Figtree',sans-serif;}

.pagine{display:flex;gap:8px;justify-content:center;flex-wrap:wrap;margin-top:56px;}
.pagine a,.pagine span{min-width:52px;height:52px;display:inline-flex;align-items:center;justify-content:center;
  border:1px solid var(--linea);border-radius:var(--r-s);text-decoration:none;color:var(--verde-scuro);
  font-family:'Figtree',sans-serif;font-weight:700;font-size:1.05rem;padding:0 14px;background:#fff;}
.pagine a:hover{border-color:var(--verde);color:var(--verde);}
.pagine .attiva{background:var(--verde);border-color:var(--verde);color:#fff;}
.pagine .disabilitata{opacity:.4;pointer-events:none;}

.vuoto{text-align:center;padding:80px 20px;background:var(--verde-tenue);border:1px solid var(--linea);border-radius:var(--r-l);}
.vuoto i{font-size:3.2rem;color:var(--verde-linea);display:block;margin-bottom:20px;}
.vuoto h3{font-size:1.6rem;margin-bottom:12px;}
.vuoto p{color:var(--testo-soft);margin:0 auto;max-width:520px;}

/* ═══ 15b. ESPLORATORE REGIONI → PROVINCE → COMUNI ═══════════════════════ */
.esplora-stat{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-bottom:44px;}
.esplora-stat>div{background:#fff;border:1px solid var(--verde-linea);border-radius:var(--r-l);padding:28px 20px;text-align:center;}
.esplora-stat .n{font-family:'Figtree',sans-serif;font-weight:800;font-size:2.6rem;color:var(--verde);line-height:1;}
.esplora-stat .l{font-size:.95rem;font-weight:700;color:var(--testo-soft);margin-top:10px;text-transform:uppercase;letter-spacing:.1em;}

.esplora-g{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;}
.esplora-card{
  display:flex;align-items:center;gap:20px;background:#fff;border:1px solid var(--linea);
  border-radius:var(--r-l);padding:26px 28px;text-decoration:none;color:inherit;transition:.2s;
  text-align:left;font-family:inherit;font-size:1rem;cursor:pointer;width:100%;
}
.esplora-card:hover{border-color:var(--verde);background:var(--verde-tenue);transform:translateY(-3px);box-shadow:var(--ombra-s);}
.esplora-card .ic{width:56px;height:56px;border-radius:var(--r-m);background:var(--verde-chiaro);color:var(--verde);
  display:flex;align-items:center;justify-content:center;font-size:1.5rem;flex-shrink:0;}
.esplora-card .tx{flex:1;min-width:0;}
.esplora-card .nm{font-family:'Figtree',sans-serif;font-weight:800;font-size:1.28rem;color:var(--verde-scuro);line-height:1.25;}
.esplora-card .sub{font-size:1rem;color:var(--testo-soft);margin-top:5px;}
.esplora-card .fr{color:var(--verde);font-size:1.5rem;flex-shrink:0;}
.esplora-card .cop{width:76px;height:76px;border-radius:var(--r-m);object-fit:cover;flex-shrink:0;border:1px solid var(--linea);}

.esplora-torna{display:inline-flex;align-items:center;gap:10px;background:#fff;border:2px solid var(--linea);
  border-radius:var(--r-s);padding:13px 22px;font-family:'Figtree',sans-serif;font-weight:700;font-size:1.05rem;
  color:var(--verde-scuro);cursor:pointer;margin-bottom:30px;transition:.2s;}
.esplora-torna:hover{border-color:var(--verde);color:var(--verde);}

.caricamento{text-align:center;padding:70px 20px;color:var(--testo-soft);}
.caricamento .giro{width:52px;height:52px;border:5px solid var(--verde-chiaro);border-top-color:var(--verde);
  border-radius:50%;margin:0 auto 20px;animation:gira .9s linear infinite;}
@keyframes gira{to{transform:rotate(360deg);}}

/* ═══ 16. TESTO LUNGO (privacy, termini, cookie) ═════════════════════════ */
.testo-lungo{font-size:1.1rem;}
.testo-lungo h2{font-size:2rem;margin:52px 0 18px;}
/* l'intestazione è appiccicata in alto: le ancore devono fermarsi sotto,
   altrimenti il titolo della sezione finisce nascosto dietro il menu */
.testo-lungo h2[id],.testo-lungo h3[id]{scroll-margin-top:130px;}
.testo-lungo h2[id]:focus{outline:none;}
.testo-lungo h3{font-size:1.45rem;margin:36px 0 14px;}
.testo-lungo ul,.testo-lungo ol{padding-left:26px;margin:0 0 1.2em;}
.testo-lungo li{margin-bottom:10px;}
.testo-lungo table{width:100%;border-collapse:collapse;margin:26px 0;font-size:1.02rem;}
.testo-lungo th,.testo-lungo td{border:1px solid var(--linea);padding:14px 16px;text-align:left;vertical-align:top;}
.testo-lungo th{background:var(--verde-tenue);font-family:'Figtree',sans-serif;font-weight:700;color:var(--verde-scuro);}
/* Una tabella con molte colonne scorre da sola invece di allargare la pagina */
.tabella-scorrevole{max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch;}
.tabella-scorrevole:focus-visible{outline:3px solid var(--verde);outline-offset:3px;}
.tabella-scorrevole table{min-width:520px;}

/* ═══ 16b. DOMANDE FREQUENTI ═════════════════════════════════════════════ */
/* Costruite su <details>: si aprono e si chiudono senza una riga di
   JavaScript, funzionano con la tastiera e restano leggibili anche se il
   foglio di stile non arriva. Le stesse dimensioni del resto del sito. */
.faq{border-bottom:1px solid var(--linea);}
.faq:last-child{border-bottom:0;}
.faq summary{list-style:none;cursor:pointer;display:flex;align-items:flex-start;gap:16px;
  padding:24px 32px;font-family:'Figtree',sans-serif;font-weight:700;font-size:1.22rem;
  line-height:1.35;color:var(--verde-scuro);transition:background .18s;}
.faq summary::-webkit-details-marker{display:none;}
.faq summary::marker{content:'';}
.faq summary:hover{background:var(--verde-tenue);}
.faq summary:focus-visible{outline:3px solid var(--verde);outline-offset:-3px;}
.faq summary::after{content:'\F282';font-family:'bootstrap-icons';font-weight:400;font-size:1rem;
  color:var(--verde);margin-left:auto;flex-shrink:0;transition:transform .2s;padding-top:4px;}
.faq[open] summary{background:var(--verde-tenue);}
.faq[open] summary::after{transform:rotate(180deg);}
.faq p{padding:0 32px 28px;margin:0;font-size:1.08rem;line-height:1.62;color:var(--testo-soft);max-width:none;}
@media(max-width:760px){
  .faq summary{padding:20px 20px;font-size:1.1rem;}
  .faq p{padding:0 20px 22px;}
}

/* ═══ 17. CTA FINALE ═════════════════════════════════════════════════════ */
.finale{background:var(--verde-chiaro);text-align:center;border-top:1px solid var(--verde-linea);}
.finale h2{font-size:clamp(2.4rem,4.8vw,3.8rem);margin-bottom:20px;}
.finale p{font-size:1.28rem;color:var(--testo-soft);max-width:720px;margin:0 auto 36px;}
.finale .b{display:flex;gap:14px;justify-content:center;flex-wrap:wrap;}

/* ═══ 18. SEZIONE ENTI ═══════════════════════════════════════════════════ */
.enti{background:var(--verde-tenue);border-top:5px solid var(--verde);}
.enti .due-col{align-items:start;}
.enti h2{font-size:clamp(2.2rem,4.2vw,3.3rem);}

/* ═══ 19. FOOTER CHIARO ══════════════════════════════════════════════════ */
footer.ft{background:var(--verde-tenue);border-top:1px solid var(--linea);padding:76px 0 0;}
.ft-g{display:grid;grid-template-columns:1.7fr 1fr 1fr 1fr;gap:52px;padding-bottom:56px;}
.ft-g img.lg{height:48px;margin-bottom:22px;}
.ft-g .desc{color:var(--testo-soft);font-size:1.04rem;line-height:1.7;max-width:380px;margin-bottom:22px;}
.ft-c{display:flex;align-items:center;gap:11px;color:var(--verde-scuro);margin-bottom:11px;font-size:1.03rem;text-decoration:none;font-weight:500;}
.ft-c i{color:var(--verde);}
.ft-c:hover{color:var(--verde);}
.ft-g h4{font-size:1.06rem;margin-bottom:20px;color:var(--verde-scuro);}
.ft-g ul{list-style:none;padding:0;margin:0;display:grid;gap:12px;}
.ft-g ul a{color:var(--testo-soft);text-decoration:none;font-size:1.03rem;}
.ft-g ul a:hover{color:var(--verde);text-decoration:underline;}
.social{display:flex;gap:10px;margin-top:22px;}
.social a{width:46px;height:46px;border-radius:var(--r-m);background:#fff;border:1px solid var(--linea);display:flex;align-items:center;justify-content:center;color:var(--verde);text-decoration:none;font-size:1.15rem;}
.social a:hover{background:var(--verde);color:#fff;border-color:var(--verde);}
.ft-basso{border-top:1px solid var(--linea);background:#fff;}
.ft-b{display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px;color:var(--testo-soft);font-size:.96rem;padding:24px 0 28px;}
.ft-b a{color:var(--verde);text-decoration:none;font-weight:700;}

/* ═══ 20. COOKIE E PWA (versioni chiare) ═════════════════════════════════ */
.cookie{position:fixed;left:0;right:0;bottom:0;z-index:800;background:#fff;border-top:2px solid var(--verde);
  box-shadow:0 -6px 30px rgba(31,58,58,.1);padding:22px 0;transform:translateY(110%);transition:transform .4s ease;}
.cookie.mostra{transform:translateY(0);}
.cookie .wrap{display:flex;align-items:center;gap:26px;flex-wrap:wrap;}
.cookie .tx{flex:1;min-width:280px;font-size:1.02rem;color:var(--testo-soft);}
.cookie .tx b{color:var(--verde-scuro);}

.pwa{position:fixed;left:0;right:0;bottom:0;z-index:790;background:#fff;border-top:2px solid var(--verde);
  box-shadow:0 -6px 30px rgba(31,58,58,.1);padding:14px 18px;display:none;align-items:center;gap:14px;}
.pwa img{width:46px;height:46px;border-radius:12px;flex-shrink:0;}
.pwa .tx{flex:1;min-width:0;}
.pwa .tt{font-family:'Figtree',sans-serif;font-weight:800;font-size:1.02rem;color:var(--verde-scuro);line-height:1.2;}
.pwa .ss{font-size:.9rem;color:var(--testo-soft);margin-top:2px;}
.pwa button.installa{background:var(--verde);color:#fff;border:0;border-radius:var(--r-s);padding:11px 20px;font-family:'Figtree',sans-serif;font-weight:700;font-size:1rem;cursor:pointer;flex-shrink:0;}
.pwa button.chiudi{background:none;border:0;color:var(--testo-tenue);font-size:1.6rem;line-height:1;cursor:pointer;padding:2px 8px;flex-shrink:0;}

/* ── Varianti di colonne ──────────────────────────────────────────────────
   Prima queste erano scritte come style="" dentro le pagine. Uno stile in
   linea però batte qualsiasi regola del foglio, comprese quelle responsive
   qui sotto: il risultato era che su telefono certe griglie restavano a
   quattro colonne e la pagina scorreva di lato. Come classi si comportano
   come tutte le altre e sul piccolo si riordinano da sole. */
.col-2{grid-template-columns:repeat(2,1fr);}
.col-3{grid-template-columns:repeat(3,1fr);}
.col-4{grid-template-columns:repeat(4,1fr);}
.filtri-g.larga-prima{grid-template-columns:2fr 1fr 1fr;}

/* ═══ 20b. PAGINA CONTATTI ═══════════════════════════════════════════════
   Il modulo stava nella colonna più stretta di due-col: dieci campi uno sotto
   l'altro producevano una pagina altissima e un modulo strizzato. Qui la
   colonna del testo ha una larghezza contenuta e fissa, il modulo si prende
   tutto lo spazio che resta, e i campi corti stanno a coppie sulla stessa
   riga. La pagina scende di circa un terzo in altezza senza perdere nulla. */
.ct-layout{display:grid;grid-template-columns:minmax(0,340px) minmax(0,1fr);gap:60px;align-items:start;}
.ct-layout>*{min-width:0;}
.ct-lato h2{font-size:clamp(1.9rem,2.9vw,2.5rem);margin-bottom:16px;line-height:1.15;}
.ct-lato p{font-size:1.08rem;color:var(--testo-soft);}
.ct-lato .check{gap:14px;margin-top:24px;}
.ct-lato .check div{font-size:1.02rem;}
.ct-lato .check i{font-size:1.3rem;}
.ct-recapiti{margin-top:30px;}
.ct-recapiti .intest{padding:15px 24px;font-size:1rem;}
.ct-recapiti .rg2{padding:14px 24px;font-size:1rem;gap:13px;align-items:center;}
.ct-recapiti .rg2 i{font-size:1.2rem;}

.ct-form .intest{padding:20px 34px;}
.ct-corpo{padding:30px 34px 34px;}
.ct-sub{color:var(--testo-soft);margin-bottom:26px;}
/* gap solo orizzontale: il margine sotto lo mette già .campo */
.ct-fila{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 26px;}
.ct-fila>.campo{min-width:0;}
.ct-corpo textarea{min-height:140px;}
/* L'aiuto sotto un campo in coppia non deve spostare in basso il campo
   accanto: lo teniamo fuori dal flusso dell'altezza della riga. */
.ct-fila .campo{align-self:start;}

.ct-verifica{display:flex;align-items:flex-start;gap:11px;padding:13px 17px;
  border:1px solid var(--verde-linea);background:var(--verde-tenue);border-radius:var(--r-m);
  color:var(--verde-scuro);font-weight:600;font-size:1.02rem;line-height:1.45;}
.ct-verifica i{color:var(--verde);font-size:1.2rem;flex-shrink:0;line-height:1.4;margin:0;}
.ct-verifica.ok{background:var(--verde-chiaro);border-color:var(--verde);}
/* label.ct-privacy e non .ct-privacy: .campo label è più specifico e
   altrimenti rimette display:block, grassetto e margine sotto. */
.ct-servizio label.ct-privacy{display:flex;align-items:flex-start;gap:12px;font-weight:500;
  font-size:1.02rem;line-height:1.45;cursor:pointer;margin-bottom:0;color:var(--testo);
  font-family:inherit;}
.ct-servizio label.ct-privacy input{width:22px;height:22px;accent-color:var(--verde);
  flex-shrink:0;margin-top:2px;}
/* Verifica e privacy stanno affiancate: sono le due righe di servizio prima
   del pulsante, non due campi da compilare. */
.ct-servizio{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:26px;
  align-items:start;margin-bottom:26px;}
.ct-servizio .campo{margin-bottom:0;}

/* La colonna del testo è sottile: le due colonne stanno comode fin sotto i
   1100px, non serve impilare già a 1240 come fa .due-col. */
@media(max-width:1080px){
  .ct-layout{grid-template-columns:1fr;gap:40px;}
  .ct-lato .ct-recapiti{max-width:560px;}
}
@media(max-width:820px){
  .ct-fila,.ct-servizio{grid-template-columns:1fr;}
  .ct-servizio{gap:0;}
  .ct-servizio .campo{margin-bottom:24px;}
}
@media(max-width:620px){
  .ct-corpo{padding:26px 22px 28px;}
  .ct-form .intest{padding:18px 22px;}
  .ct-recapiti .rg2,.ct-recapiti .intest{padding-left:20px;padding-right:20px;}
}

/* ═══ 21. RESPONSIVE ═════════════════════════════════════════════════════ */
@media(max-width:1240px){
  header.hd nav{display:none;}
  .hamb{display:block;}
  .col-4,.col-3{grid-template-columns:repeat(2,1fr);}
  .filtri-g.larga-prima{grid-template-columns:1fr 1fr;}
  .rapidi-g,.g3,.g4,.passi,.percorsi,.esperienze,.promesse,.numeri,.utenti,.filtri-g{grid-template-columns:1fr 1fr;}
  .rapidi-g a{border-bottom:1px solid var(--linea);}
  .rapidi-g a:nth-child(2){border-right:0;}
  .due-col{grid-template-columns:1fr !important;gap:44px;}
  #indiceLegale{position:static !important;}
  .esplora-g{grid-template-columns:1fr 1fr;}
  .esplora-stat{grid-template-columns:1fr 1fr 1fr;}
  .foto-lato{height:400px;}
  .ft-g{grid-template-columns:1fr 1fr;}
}
/* Sotto i 620px il pulsante "Sei un Ente Pubblico?" non ci sta accanto al
   logo e spinge la pagina oltre il bordo dello schermo. Non viene perso:
   è la prima voce del menu che si apre col pulsante a tre righe. */
@media(max-width:620px){
  header.hd .dx>.cta-enti{display:none;}
}
@media(max-width:760px){
  body{font-size:18px;}
  .wrap,.wrap-stretto{padding:0 20px;}
  .col-2,.col-3,.col-4{grid-template-columns:1fr;}
  .filtri-g.larga-prima{grid-template-columns:1fr;}
  section{padding:64px 0;}
  .strip .msg span{display:none;}
  .strip .dx{gap:12px;}
  .strip .riservata{padding:5px 10px;}
  .hero .velo{background:linear-gradient(180deg,rgba(255,255,255,.94) 0%,rgba(255,255,255,.96) 60%,rgba(255,255,255,.99) 100%);}
  .hero .wrap{padding-top:52px;padding-bottom:60px;}
  .hero-numeri{gap:32px;}
  .cerca{flex-direction:column;}
  .cerca button{padding:17px;justify-content:center;}
  .rapidi-g,.g2,.g3,.g4,.passi,.percorsi,.esperienze,.promesse,.numeri,.utenti,.filtri-g{grid-template-columns:1fr;}
  .rapidi-g{margin-top:-24px;}
  .rapidi-g a{border-right:0;}
  .scheda,.passo{padding:32px 26px;}
  .riquadro .rg,.riquadro .rg2{padding:20px 22px;}
  .ft-g{grid-template-columns:1fr;gap:38px;}
  .testata{margin-bottom:40px;}
  .mappa-box{height:420px;}
  .esplora-g,.esplora-stat{grid-template-columns:1fr;}
  .esplora-card{padding:20px 20px;gap:16px;}
  .filtri{padding:22px 20px;}
}

/* ═══ 22. STAMPA ═════════════════════════════════════════════════════════ */
@media print{
  .strip,header.hd,.menu-mobile,.cookie,.pwa,.finale,.rapidi,footer.ft .social{display:none !important;}
  body{font-size:12pt;}
  section{padding:20px 0;}
  a{color:#000;text-decoration:none;}
}

/* ═══ 23. DETTAGLIO PERCORSO ═════════════════════════════════════════════ */
.pd-cover{position:relative;border-radius:var(--r-l);overflow:hidden;height:420px;border:1px solid var(--linea);}
.pd-cover img{width:100%;height:100%;object-fit:cover;}
.pd-tag{position:absolute;top:20px;display:inline-flex;align-items:center;gap:8px;background:#fff;
  color:var(--verde-scuro);font-family:'Figtree',sans-serif;font-weight:700;font-size:1rem;
  padding:11px 20px;border-radius:999px;box-shadow:var(--ombra-s);}
.pd-tag.sx{left:20px;} .pd-tag.dx{right:20px;background:var(--verde);color:#fff;}
.pd-tag.dx.parziale{background:var(--ambra);}
.pd-tag.dx.no{background:var(--rosso);}

/* barra dei dati chiave */
.pd-dati{display:grid;grid-template-columns:repeat(5,1fr);border:1px solid var(--linea);
  border-radius:var(--r-l);overflow:hidden;background:#fff;box-shadow:var(--ombra-s);}
.pd-dati>div{padding:26px 18px;text-align:center;border-right:1px solid var(--linea);}
.pd-dati>div:last-child{border-right:0;}
.pd-dati .ic{color:var(--verde);font-size:1.4rem;margin-bottom:10px;}
.pd-dati .v{font-family:'Figtree',sans-serif;font-weight:800;font-size:1.9rem;color:var(--verde-scuro);line-height:1;text-transform:capitalize;}
.pd-dati .l{font-size:.92rem;color:var(--testo-soft);margin-top:9px;text-transform:uppercase;letter-spacing:.09em;font-weight:700;}

/* mappa e profilo */
.pd-mappa{position:relative;height:600px;border:1px solid var(--linea);border-radius:var(--r-l);overflow:hidden;background:var(--verde-tenue);}
/* Il riquadro della mappa dà l'altezza al div che ha dentro. Qui c'era
   scritto "#map-detail", cioè il nome che ha SOLO in percorso-dettaglio.php:
   in ente.php si chiama #mappa-ente e in comune.php #mappa-comune, e in quelle
   due pagine il contenitore restava alto zero. Leaflet partiva lo stesso, dentro
   uno spazio senza altezza, e si vedeva un rettangolo grigio vuoto — che sembra
   una mappa che non carica e invece è una mappa che non ha dove stare.
   Ora vale per il figlio, qualunque nome abbia: tutti e tre i riquadri ne hanno
   uno solo. */
.pd-mappa > div{width:100%;height:100%;}
.pd-strumenti{display:flex;gap:12px;flex-wrap:wrap;margin-top:20px;}
.pd-profilo{background:#fff;border:1px solid var(--linea);border-radius:var(--r-l);padding:30px;}
.pd-profilo canvas{width:100%;max-width:100%;display:block;}
.pd-quote{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:24px;}
.pd-quote>div{background:var(--verde-tenue);border:1px solid var(--verde-linea);border-radius:var(--r-m);padding:18px 12px;text-align:center;}
.pd-quote strong{display:block;font-family:'Figtree',sans-serif;font-weight:800;font-size:1.5rem;color:var(--verde-scuro);}
.pd-quote span{font-size:.9rem;color:var(--testo-soft);text-transform:uppercase;letter-spacing:.08em;font-weight:700;}

/* galleria */
.pd-galleria{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;}
.pd-galleria button{border:1px solid var(--linea);border-radius:var(--r-m);overflow:hidden;padding:0;
  background:var(--verde-tenue);cursor:pointer;aspect-ratio:4/3;position:relative;}
.pd-galleria img,.pd-galleria video{width:100%;height:100%;object-fit:cover;display:block;}
.pd-galleria button:hover{border-color:var(--verde);}
.pd-galleria .play{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
  color:#fff;font-size:2.6rem;text-shadow:0 2px 12px rgba(0,0,0,.5);}

/* punti di interesse */
.pd-poi{display:grid;gap:16px;}
.pd-poi>div{display:flex;gap:18px;background:#fff;border:1px solid var(--linea);border-radius:var(--r-m);padding:22px 24px;}
.pd-poi .em{font-size:2rem;line-height:1;flex-shrink:0;}
.pd-poi h3{font-size:1.24rem;margin-bottom:6px;}
.pd-poi p{color:var(--testo-soft);font-size:1.04rem;margin:0;}

/* QR */
.pd-qr{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;}
.pd-qr>div{background:#fff;border:1px solid var(--linea);border-radius:var(--r-m);padding:24px;text-align:center;}
.pd-qr .cod{display:flex;justify-content:center;margin-bottom:14px;}
.pd-qr .cod img,.pd-qr .cod canvas{border-radius:8px;}
.pd-qr h3{font-size:1.1rem;margin-bottom:5px;}
.pd-qr p{font-size:.96rem;color:var(--testo-soft);margin:0;}
/* i due QR dimostrativi di per-comuni.php: due sole schede, centrate e più larghe */
.pd-qr.qr-demo{grid-template-columns:repeat(2,1fr);gap:44px;max-width:800px;margin:0 auto;}
.pd-qr.qr-demo>div{padding:34px 30px 36px;}
.pd-qr.qr-demo .cod{margin-bottom:20px;}
.pd-qr.qr-demo .cod img{width:100%;max-width:240px;height:auto;}
.pd-qr.qr-demo h3{font-size:1.2rem;margin-bottom:8px;}

/* barra fissa su telefono */
.pd-fissa{position:fixed;left:0;right:0;bottom:0;z-index:700;background:#fff;border-top:2px solid var(--verde);
  box-shadow:0 -6px 24px rgba(31,58,58,.12);padding:12px 16px;display:none;}
.pd-fissa .btn{width:100%;}

/* galleria a schermo intero */
.pd-lightbox{position:fixed;inset:0;z-index:1000;background:rgba(255,255,255,.97);backdrop-filter:blur(8px);
  display:none;align-items:center;justify-content:center;}
.pd-lightbox.active{display:flex;}
.pd-lightbox img,.pd-lightbox video{max-width:92vw;max-height:86vh;border-radius:var(--r-m);box-shadow:var(--ombra-m);}
.pd-lightbox button{position:absolute;background:#fff;border:1px solid var(--linea);border-radius:50%;
  width:58px;height:58px;font-size:1.6rem;color:var(--verde-scuro);cursor:pointer;box-shadow:var(--ombra-s);}
.pd-lightbox .chiudi{top:26px;right:26px;} .pd-lightbox .prec{left:26px;} .pd-lightbox .succ{right:26px;}

/* pannello POI sulla mappa (ereditato dal sito attuale, ricolorato) */
.poi-panel-detail{position:absolute;top:14px;left:14px;z-index:500;font-family:'Public Sans',sans-serif;}
.poi-toggle-d{background:#fff;border:1px solid var(--linea);border-radius:var(--r-s);padding:10px 16px;
  font-weight:700;font-size:.95rem;color:var(--verde-scuro);cursor:pointer;box-shadow:var(--ombra-s);}
.poi-toggle-d i{color:var(--verde);}
.poi-body-d{display:none;background:#fff;border:1px solid var(--linea);border-radius:var(--r-s);
  margin-top:8px;padding:10px;box-shadow:var(--ombra-m);}
.poi-body-d.open{display:block;}
.poi-row-d{display:flex;align-items:center;gap:10px;padding:7px 6px;font-size:.95rem;}
.poi-row-d input{width:18px;height:18px;accent-color:#2d6a4f;}
.poi-ic{width:26px;height:26px;border-radius:7px;display:flex;align-items:center;justify-content:center;color:#fff;font-size:.8rem;}
.spin-icon{display:inline-block;animation:gira 1s linear infinite;}
path.gpx-dots{animation:marchDots 3s linear infinite;}
@keyframes marchDots{to{stroke-dashoffset:-60}}

@media(max-width:1240px){
  .pd-dati{grid-template-columns:repeat(3,1fr);}
  .pd-galleria,.pd-qr{grid-template-columns:repeat(2,1fr);}
}
@media(max-width:760px){
  .pd-cover{height:250px;}
  .pd-dati{grid-template-columns:1fr 1fr;}
  .pd-dati>div{border-bottom:1px solid var(--linea);}
  .pd-mappa{height:440px;}
  .pd-quote{grid-template-columns:1fr 1fr;}
  .pd-galleria,.pd-qr{grid-template-columns:1fr;}
  .pd-qr.qr-demo{grid-template-columns:1fr;gap:24px;max-width:360px;}
  .pd-fissa{display:block;}
  body{padding-bottom:86px;}
  .pd-lightbox button{width:48px;height:48px;font-size:1.3rem;}
  .pd-lightbox .prec{left:10px;} .pd-lightbox .succ{right:10px;}
}

/* Sotto i 480 px nella fascia ci stanno solo le icone: la scritta
   "Area riservata" farebbe andare a capo tutta la riga. */
@media(max-width:480px){
  .strip .riservata span{display:none;}
  .strip .riservata{padding:5px 9px;}
}