/* ==========================================================================
   Centro Studi Pontinia
   Scritto mobile first: le media query salgono, non scendono.
   Sistema: carta calda, blocchi di colore pieno, angoli morbidi, serif grande.
   ========================================================================== */

/* --------------------------------------------------------------------------
   Caratteri ospitati sul nostro server.
   NON si usa Google Fonts: quella richiesta manderebbe l'indirizzo IP di
   ogni visitatore a Google prima che possa dare un consenso, e sarebbe da
   dichiarare nella cookie policy. Cosi' non parte nessuna richiesta a terzi.
   -------------------------------------------------------------------------- */
@font-face{font-family:"DM Serif Display";font-style:normal;font-weight:400;
  font-display:swap;src:url(dmserif-400.woff2) format("woff2")}
@font-face{font-family:"DM Serif Display";font-style:italic;font-weight:400;
  font-display:swap;src:url(dmserif-400i.woff2) format("woff2")}
@font-face{font-family:"Source Serif 4";font-style:normal;font-weight:400;
  font-display:swap;src:url(sourceserif-400.woff2) format("woff2")}
@font-face{font-family:"Source Serif 4";font-style:normal;font-weight:600;
  font-display:swap;src:url(sourceserif-600.woff2) format("woff2")}
@font-face{font-family:"Source Serif 4";font-style:italic;font-weight:400;
  font-display:swap;src:url(sourceserif-400i.woff2) format("woff2")}

:root{
  --paper:#FAF7F1;
  --card:#FFFDF9;
  --ink:#0B3739;
  --ink-2:#4C6F70;
  --rule:rgba(13,108,110,.20);
  --rule-soft:rgba(13,108,110,.10);

  --teal-900:#0B4F51;
  --teal-700:#0D6C6E;
  --teal-500:#13BBB6;
  --teal-200:#7ECECB;
  --amber:#FDB92D;

  /* un accento per macrocategoria, campionati dai post del cliente */
  --c-scuola:#0A6A6C;
  --c-universita:#0E8FA6;
  --c-certificazioni:#EDA412;
  --c-concorsi:#11325E;
  --c-soccorso:#C8202F;

  /* un colore per ciascun indirizzo della paritaria */
  --i-meccanica:#B4491C;
  --i-afm:#2F7A52;
  --i-informatica:#5B3E9B;
  --i-chimica:#A32468;
  --i-linguistico:#1F6FB2;

  /* testo sopra ciascun colore */
  --on-dark:#FFFDF9;
  --on-amber:#2E2101;

  --display:"DM Serif Display",Georgia,"Times New Roman",serif;
  --text:"Source Serif 4",Georgia,"Times New Roman",serif;

  --r-xl:34px;
  --r-lg:26px;
  --r-md:18px;
  --r-sm:12px;

  --gut:20px;
  --maxw:1280px;
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}

body{
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font-family:var(--text);
  font-size:17px;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}

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

.wrap{width:100%;max-width:var(--maxw);margin:0 auto;padding-inline:var(--gut)}

.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}

.label{font-weight:600;font-size:.7rem;letter-spacing:.16em;text-transform:uppercase;line-height:1.4}

h1,h2,h3{font-family:var(--display);font-weight:400;letter-spacing:-.008em;margin:0}
h1{font-size:clamp(2.7rem,11.5vw,5.6rem);line-height:1.02;color:var(--teal-900)}
h2{font-size:clamp(2.2rem,8.8vw,4.1rem);line-height:1.06;color:var(--teal-900)}
h3{font-size:clamp(1.5rem,5.6vw,2.1rem);line-height:1.14}
p{margin:0 0 1em}
p:last-child{margin-bottom:0}

/* ---------- testata ---------- */
.site-head{
  position:sticky;top:0;z-index:60;
  background:var(--paper);
  border-bottom:1px solid var(--rule-soft);
}
.site-head .wrap{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:68px}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;flex:none}
.brand img{width:40px}
.brand span{color:var(--teal-900);line-height:1.25;font-size:.66rem}

/* Proporzioni prese dal riferimento del cliente, misurate sul suo file:
   spessore 10, spazio 19, larghezza 99. Cioe' lo spazio vale circa 1,9
   volte lo spessore e la larghezza circa 10 volte. Riportate in scala su
   un bottone da 48 danno 26 x 4 con 5 di spazio. Le barre sono bianche su
   fondo scuro, dove una linea sottile si assottiglia ancora all'occhio:
   per questo sono spesse 4 e non 2. */
.burger{
  /* align-content serve davvero: senza, le tre righe della griglia si
     allungano per riempire il bottone e il gap dichiarato non si vede.
     Con gap:0 restavano comunque 11px di vuoto fra una barra e l'altra. */
  display:grid;place-items:center;align-content:center;gap:3px;
  background:var(--teal-700);border:0;border-radius:999px;
  width:48px;height:48px;cursor:pointer;color:var(--on-dark);
}
.burger span{display:block;width:26px;height:4px;background:currentColor;border-radius:3px}

.nav{
  position:fixed;inset:68px 0 0;z-index:55;
  display:none;flex-direction:column;
  margin:0;padding:14px var(--gut) 50px;list-style:none;
  background:var(--paper);overflow-y:auto;
}
.nav.open{display:flex}
.nav > li{border-bottom:1px solid var(--rule-soft)}
.nav a{
  display:block;padding:17px 0;text-decoration:none;color:var(--ink);
  font-family:var(--display);font-size:1.45rem;
}
.nav a:hover,.nav a[aria-current="page"]{color:var(--teal-700)}
.nav ul{list-style:none;margin:0;padding:0 0 14px}
.nav ul a{
  display:flex;align-items:center;gap:.65em;padding:9px 0;
  font-family:var(--text);font-size:1rem;color:var(--ink-2);
}
.nav ul i{width:12px;height:12px;border-radius:4px;flex:none;font-style:normal}

/* ---------- bottoni ---------- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:.6em;
  padding:1em 1.8em;border-radius:999px;text-decoration:none;
  font-weight:600;font-size:.76rem;letter-spacing:.14em;text-transform:uppercase;
  background:var(--teal-700);color:var(--on-dark);
  transition:background .2s ease,transform .2s ease;
}
.btn:hover{background:var(--teal-900);transform:translateY(-2px)}
.btn.amber{background:var(--amber);color:var(--on-amber)}
.btn.amber:hover{background:#FFC64F}
.btn.ghost{background:transparent;color:var(--teal-900);border:1.5px solid var(--rule)}
.btn.ghost:hover{background:rgba(13,108,110,.08);color:var(--teal-900)}
.btn.on-dark{background:var(--on-dark);color:var(--teal-900)}
.btn.on-dark:hover{background:#fff}
.cta-row{display:flex;flex-direction:column;gap:11px;margin-top:26px}

/* ---------- blocchi arrotondati ---------- */
section{padding:38px 0}
.panel{border-radius:var(--r-xl);padding:38px 24px;overflow:hidden}
.sec-head{margin-bottom:24px}
.sec-head .label{display:block;margin-bottom:.9em;color:var(--teal-700)}
.sec-head p{margin-top:.75em;color:var(--ink-2);font-size:1.03rem}

/* ---------- hero ---------- */
.hero{padding:22px 0 4px}
.hero-logo{width:min(74%,300px);margin:0 auto 22px}
.hero h1 em{font-style:normal;color:var(--c-certificazioni)}
.hero-lead{margin-top:20px;color:var(--ink-2);font-size:1.06rem}

.hero-foto{margin-top:26px}
.hero-solo{
  display:block;width:100%;
  border-radius:var(--r-lg);
  aspect-ratio:4/5;object-fit:cover;
}
.hero-tris{display:none}
.hero-tris img{
  width:100%;border-radius:var(--r-md);
  aspect-ratio:3/2;object-fit:cover;
}


/* ---------- 4 macrocategorie ---------- */
.cats{display:grid;gap:14px}
.cat{
  position:relative;
  display:flex;flex-direction:column;
  border-radius:var(--r-lg);overflow:hidden;
  background:var(--c);color:var(--on-dark);text-decoration:none;
  transition:transform .25s ease;
}
.cat:hover{transform:translateY(-4px)}
.cat[data-c="scuola"]{--c:var(--c-scuola)}
.cat[data-c="universita"]{--c:var(--c-universita)}
.cat[data-c="certificazioni"]{--c:var(--c-certificazioni);color:var(--on-amber)}
.cat[data-c="concorsi"]{--c:var(--c-concorsi)}
.cat > img{width:100%;aspect-ratio:16/8;object-fit:cover}
.cat-body{padding:22px 22px 26px;display:flex;flex-direction:column;flex:1}
.cat .num{font-family:var(--display);font-size:1rem;opacity:.65;margin-bottom:10px}
.cat h3{color:inherit}
.cat ul{margin:.8em 0 0;padding:0;list-style:none;font-size:.97rem;opacity:.95}
.cat li{padding:.2em 0 .2em 1.1em;position:relative}
.cat li::before{content:"";position:absolute;left:0;top:.72em;width:6px;height:6px;border-radius:50%;background:currentColor;opacity:.65}
.cat .go{margin-top:20px;font-weight:600;font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;display:inline-flex;gap:.55em;align-items:center}
/* la scheda intera resta cliccabile, ma il testo del collegamento e' solo
   "Scopri": prima l'ancora avvolgeva immagine, elenco e titolo, e il testo
   del link diventava lunghissimo. */
.cat .go{color:inherit;text-decoration:none}
.cat .go::before{content:"";position:absolute;inset:0}
.cat .go:focus-visible{outline:2px solid var(--on-dark);outline-offset:4px}
.cat .go::after{content:"";width:24px;height:1.5px;background:currentColor;transition:width .25s ease}
.cat:hover .go::after{width:42px}

/* ---------- metodo, blocco ambra ---------- */
.metodo{background:var(--amber);color:var(--on-amber)}
.metodo h2,.metodo .sec-head .label{color:var(--on-amber)}
.metodo .sec-head p{color:rgba(46,33,1,.78)}
.forza-grid{display:grid;gap:22px}
.forza-grid article{border-top:3px solid rgba(46,33,1,.35);padding-top:15px}
.forza-grid h3{font-size:1.32rem;color:var(--on-amber)}
.forza-grid p{margin-top:.45em;color:rgba(46,33,1,.8);font-size:.99rem}

/* ---------- paritaria, blocco blu notte ---------- */
.paritaria{background:var(--c-concorsi);color:var(--on-dark)}
.paritaria h2,.paritaria .sec-head .label{color:var(--on-dark)}
.paritaria .sec-head .label{opacity:.7}
.paritaria .sec-head p{color:rgba(255,253,249,.82)}
.paritaria img{border-radius:var(--r-md);margin-bottom:22px;width:100%;aspect-ratio:16/9;max-height:230px;object-fit:cover}
.indirizzi{margin:0;padding:0;list-style:none}
.indirizzi li{
  border-top:1px solid rgba(255,253,249,.22);
  padding:.9em 0;display:flex;align-items:baseline;gap:.8em;font-size:1.02rem;
}
.indirizzi li:last-child{border-bottom:1px solid rgba(255,253,249,.22)}
.indirizzi i{width:12px;height:12px;border-radius:3px;flex:none;translate:0 1px;background:var(--i-meccanica)}
.indirizzi li:nth-child(2) i{background:var(--i-afm)}
.indirizzi li:nth-child(3) i{background:var(--i-informatica)}
.indirizzi li:nth-child(4) i{background:var(--i-chimica)}
.indirizzi li:nth-child(5) i{background:var(--i-linguistico)}
.indirizzi a{
  display:flex;align-items:baseline;gap:.8em;width:100%;
  text-decoration:none;color:inherit;transition:color .18s ease;
}
.indirizzi a:hover{color:var(--amber)}
.indirizzi a::after{
  content:"";margin-left:auto;align-self:center;flex:none;
  width:22px;height:1.5px;background:currentColor;opacity:.55;transition:width .22s ease;
}
.indirizzi a:hover::after{width:36px;opacity:1}
.indirizzi li{padding:0}
.indirizzi li > a{padding:.9em 0}
.avviso{margin-top:24px;padding:22px;border-radius:var(--r-md);background:var(--amber);color:var(--on-amber)}
.avviso .label{display:block;margin-bottom:.5em}
.avviso p{font-size:.99rem}

/* ---------- primo soccorso, accento rosso ---------- */
.soccorso .panel{background:var(--c-soccorso);color:var(--on-dark);padding:0}
.soccorso img{width:100%;aspect-ratio:16/8;object-fit:cover}
.soccorso .panel > div{padding:30px 24px 34px}
.soccorso h2{color:var(--on-dark);font-size:clamp(1.9rem,7.4vw,3.2rem)}
.soccorso p{color:rgba(255,253,249,.9);margin-top:.7em}
.soccorso .btn{margin-top:22px}

/* ---------- contatti ---------- */
.contatti{background:var(--teal-900);color:#EAF6F5}
.contatti h2{color:var(--on-dark)}
.contatti .sec-head .label{color:var(--teal-200)}
.contatti img{border-radius:var(--r-md);margin-bottom:24px;width:100%}
.dati{margin:0;padding:0;list-style:none}
.dati li{padding:.85em 0;border-bottom:1px solid rgba(255,255,255,.16)}
.dati .k{display:block;color:#9FC9C7;font-weight:600;font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;margin-bottom:.25em}
.dati a{color:var(--on-dark);text-decoration:none;border-bottom:1px solid rgba(255,255,255,.35);font-size:1.12rem}
.dati a:hover{border-bottom-color:var(--on-dark)}

/* ---------- piede ---------- */
.site-foot{background:#062D2F;color:#8FB4B4;padding:40px 0 34px}
.site-foot > .wrap{display:grid;gap:26px}
.site-foot a{color:#CFE6E4;text-decoration:none}
.site-foot a:hover{color:var(--on-dark)}
.social{display:flex;gap:10px;margin:16px 0 0;padding:0;list-style:none}
.social a{display:grid;place-items:center;width:44px;height:44px;border-radius:999px;border:1px solid rgba(255,255,255,.22)}
.social a:hover{background:rgba(255,255,255,.12)}
.social svg{width:18px;height:18px;fill:currentColor}
.legale{font-size:.9rem;line-height:1.75}

/* ---------- rivelazione allo scroll ---------- */
.rev{opacity:0;transform:translateY(20px);transition:opacity .7s ease,transform .7s cubic-bezier(.2,.75,.25,1)}
.rev.on{opacity:1;transform:none}

/* ==========================================================================
   DA 640px IN SU
   ========================================================================== */
@media (min-width:640px){
  :root{--gut:32px}
  body{font-size:17.5px}
  section{padding:50px 0}
  .panel{padding:48px 40px}
  .cta-row{flex-direction:row;flex-wrap:wrap}
  .hero-foto{margin-top:32px}
  .hero-solo{display:none}
  .hero-tris{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(10px,1.4vw,18px)}
  .forza-grid{grid-template-columns:1fr 1fr;gap:26px 32px}
  .soccorso .panel{display:grid;grid-template-columns:1fr 1fr;align-items:center}
  .soccorso img{height:100%;aspect-ratio:auto;min-height:300px;max-height:420px}
  .soccorso .panel > div{padding:40px}
  .dati li{display:flex;gap:1.4em;align-items:baseline}
  .dati .k{flex:none;width:110px;margin-bottom:0}
  .site-foot > .wrap{grid-template-columns:repeat(3,auto);justify-content:space-between}
}

/* ==========================================================================
   DA 900px IN SU
   ========================================================================== */
@media (min-width:900px){
  :root{--gut:48px}
  section{padding:62px 0}
  .panel{padding:62px 56px}
  .sec-head{max-width:58ch;margin-bottom:34px}

  .burger{display:none}
  .nav{
    position:static;inset:auto;display:flex;flex-direction:row;align-items:center;
    gap:26px;padding:0;background:none;overflow:visible;
  }
  .nav > li{border:0;position:relative}
  .nav a{
    font-family:var(--text);font-size:.78rem;font-weight:600;
    letter-spacing:.13em;text-transform:uppercase;padding:9px 0;
    border-bottom:2px solid transparent;
  }
  .nav > li > a:hover,.nav > li > a[aria-current="page"]{border-bottom-color:var(--amber);color:var(--teal-700)}
  .nav ul{
    position:absolute;left:-16px;top:100%;min-width:258px;
    padding:8px;border-radius:var(--r-md);background:var(--card);
    border:1px solid var(--rule);box-shadow:0 20px 44px rgba(11,55,57,.14);
    opacity:0;visibility:hidden;transform:translateY(-6px);transition:.18s ease;
  }
  .nav li:hover ul,.nav li:focus-within ul{opacity:1;visibility:visible;transform:none}
  .nav ul a{padding:10px 12px;border-radius:var(--r-sm);text-transform:none;letter-spacing:.01em;font-size:.95rem;color:var(--ink)}
  .nav ul a:hover{background:rgba(13,108,110,.08)}

  .hero{padding:38px 0 6px}
  .hero-top{display:grid;grid-template-columns:minmax(0,1.18fr) minmax(0,.82fr);gap:56px;align-items:center}
  .hero-logo{width:min(100%,400px);margin:0 auto}
  .hero .hero-text{order:-1}
  .hero-lead{font-size:1.14rem;max-width:44ch}

  .cats{grid-template-columns:repeat(2,1fr);gap:18px}
  .forza-grid{grid-template-columns:repeat(4,1fr)}
  .paritaria{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.9fr);gap:56px;align-items:start}
  .paritaria img{margin-bottom:0}
  .contatti .wrap{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:56px;align-items:center}
  .contatti img{margin-bottom:0}
  .contatti .contatti-text{order:-1}
}

/* ==========================================================================
   DA 1180px IN SU
   ========================================================================== */
@media (min-width:1180px){
  .cats{grid-template-columns:repeat(4,1fr)}
  .cat > img{aspect-ratio:16/9}
}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation:none!important;transition:none!important}
  .rev{opacity:1;transform:none}
}

/* ==========================================================================
   SOTTOMENU A TENDINA
   ========================================================================== */
.sub-toggle{
  display:block;width:100%;text-align:left;
  background:none;border:0;padding:17px 0;cursor:pointer;
  font-family:var(--display);font-size:1.45rem;color:var(--ink);
}
.sub-toggle::after{content:" +";color:var(--teal-500)}
.has-sub.open > .sub-toggle::after{content:" –"}
.has-sub > ul{display:none}
.has-sub.open > ul{display:block}
.nav .in-branch > .sub-toggle{color:var(--teal-700)}

/* ==========================================================================
   PAGINE INTERNE
   ========================================================================== */
.page-hero{padding-top:20px}
.hero-panel{background:var(--c);color:var(--on-dark);display:grid;gap:26px}
.hero-panel .label{opacity:.78}
.hero-panel h1{
  color:var(--on-dark);margin:.28em 0 .4em;
  font-size:clamp(2rem,4.6vw,3.3rem);
  overflow-wrap:break-word;
  hyphens:auto;
}
.hero-panel p{color:rgba(255,253,249,.9);font-size:1.06rem;max-width:52ch}
.hero-panel img{border-radius:var(--r-md);width:100%;aspect-ratio:16/9;object-fit:cover;margin-top:8px}
.mini .hero-panel{grid-template-columns:1fr}

.btn.ghost-light{background:transparent;color:var(--on-dark);border:1.5px solid rgba(255,253,249,.45)}
.btn.ghost-light:hover{background:rgba(255,255,255,.12);color:var(--on-dark)}

.blocchi{display:grid;gap:14px}
.blocco{background:var(--card);border-radius:var(--r-lg);padding:26px 22px;border:1px solid var(--rule-soft)}
.blocco h2{font-size:clamp(1.55rem,5.4vw,2rem)}
.blocco p{margin-top:.55em;color:var(--ink-2)}
.ticks{margin:1.1em 0 0;padding:0;list-style:none}
.ticks li{position:relative;padding:.3em 0 .3em 1.7em;font-size:.99rem}
.ticks li::before{
  content:"";position:absolute;left:0;top:.72em;
  width:9px;height:9px;border-radius:3px;background:var(--teal-500);
}
.blocco:nth-child(2) .ticks li::before{background:var(--amber)}
.blocco:nth-child(3) .ticks li::before{background:var(--c-universita)}
.blocco:nth-child(4) .ticks li::before{background:var(--c-soccorso)}

.chiusura .panel{background:var(--teal-900);color:#EAF6F5;text-align:left}
.chiusura h2{color:var(--on-dark)}
.chiusura p{margin-top:.6em;color:rgba(234,246,245,.86);max-width:48ch}

.nota-paritaria{background:var(--card);border:1px solid var(--rule);padding:24px 22px}
.nota-paritaria p{color:var(--ink-2);font-size:.99rem;margin:0}
.avviso-tab{background:var(--amber);color:var(--on-amber)}
.avviso-tab .label{display:block;margin-bottom:.5em}

/* ---------- quadro orario ---------- */
.nota-intro{color:var(--ink-2);margin:.5em 0 1.2em;font-size:.97rem}
.tab-scroll{overflow-x:auto;border-radius:var(--r-md);border:1px solid var(--rule)}
.orario{border-collapse:collapse;width:100%;min-width:560px;background:var(--card);font-size:.93rem}
.orario th,.orario td{padding:.68em .8em;text-align:center;border-bottom:1px solid var(--rule-soft)}
.orario thead th{
  background:var(--c-tab,var(--c-concorsi));color:var(--on-dark);
  font-family:var(--text);font-weight:600;font-size:.7rem;
  letter-spacing:.1em;text-transform:uppercase;white-space:nowrap;
}
.orario tbody th{text-align:left;font-weight:400;min-width:230px}
.orario tbody tr:nth-child(even){background:rgba(13,108,110,.035)}
.orario .tot th,.orario .tot td{font-weight:600;background:rgba(253,185,45,.22)}
.nota{margin-top:1em;color:var(--ink-2);font-size:.9rem}

/* ---------- contatti ---------- */
.contatti-grid{display:grid;gap:34px}
.dati-chiaro li{border-bottom:1px solid var(--rule-soft)}
.dati-chiaro .k{color:var(--teal-700)}
.dati-chiaro a{color:var(--teal-900);border-bottom-color:var(--rule)}
.dati-chiaro a:hover{border-bottom-color:var(--teal-700)}

.modulo{margin-top:20px}
.modulo p{margin:0 0 16px}
.modulo label{display:block;font-weight:600;font-size:.72rem;letter-spacing:.13em;text-transform:uppercase;color:var(--teal-700);margin-bottom:.45em}
.modulo input,.modulo select,.modulo textarea{
  width:100%;padding:.85em 1em;border-radius:var(--r-sm);
  border:1.5px solid var(--rule);background:var(--card);
  font-family:var(--text);font-size:1rem;color:var(--ink);
}
.modulo input:focus,.modulo select:focus,.modulo textarea:focus{outline:2px solid var(--teal-500);outline-offset:1px;border-color:transparent}
.modulo textarea{resize:vertical}
.modulo .privacy label{
  display:flex;gap:.7em;align-items:flex-start;
  text-transform:none;letter-spacing:0;font-size:.93rem;font-weight:400;color:var(--ink-2);
}
.modulo .privacy input{width:auto;flex:none;margin-top:.25em}
.modulo .privacy a{color:var(--teal-700)}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}

.mappa{border-radius:var(--r-md);overflow:hidden;border:1px solid var(--rule);margin-top:18px}
.mappa iframe{display:block;width:100%;height:340px;border:0}

@media (min-width:640px){
  .blocchi{gap:18px}
  .blocco{padding:32px 30px}
  .hero-panel{grid-template-columns:minmax(0,1fr) minmax(0,.82fr);gap:40px;align-items:center}
  .mappa iframe{height:400px}
}

@media (min-width:900px){
  .page-hero{padding-top:26px}
  .blocchi{grid-template-columns:1fr 1fr;gap:20px}
  .blocco{padding:38px 34px}
  .contatti-grid{grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:56px;align-items:start}
  .chiusura .panel{display:grid;grid-template-columns:1fr auto;gap:36px;align-items:center}
  .chiusura .cta-row{margin-top:0}

  /* sottomenu: passaggio del mouse sul desktop */
  .sub-toggle{
    width:auto;padding:9px 0;
    font-family:var(--text);font-size:.78rem;font-weight:600;
    letter-spacing:.13em;text-transform:uppercase;
    border-bottom:2px solid transparent;
  }
  .sub-toggle::after{content:""}
  .has-sub.open > .sub-toggle::after{content:""}
  .has-sub:hover > .sub-toggle,.has-sub.open > .sub-toggle,.nav .in-branch > .sub-toggle{
    border-bottom-color:var(--amber);color:var(--teal-700);
  }
  .has-sub > ul{
    display:block;
    position:absolute;left:-16px;top:100%;min-width:288px;
    padding:8px;border-radius:var(--r-md);background:var(--card);
    border:1px solid var(--rule);box-shadow:0 20px 44px rgba(11,55,57,.14);
    opacity:0;visibility:hidden;transform:translateY(-6px);transition:.18s ease;
  }
  .has-sub:hover > ul,.has-sub:focus-within > ul,.has-sub.open > ul{opacity:1;visibility:visible;transform:none}
}

/* un blocco solo occupa tutta la riga invece di restare a metà */
.blocchi > .blocco:only-child{grid-column:1 / -1}

/* ==========================================================================
   Pagine di testo lungo: privacy e cookie policy
   ========================================================================== */
/* testata senza foto: una colonna sola anche da schermo grande */
.page-hero.mini .hero-panel{grid-template-columns:1fr}
.page-hero.mini .hero-panel .label{font-size:.78rem;line-height:1.5}
.page-hero.mini .hero-panel p{max-width:62ch}

.prosa{max-width:74ch;margin:0 auto}
.prosa h2{
  font-family:var(--display);font-weight:400;line-height:1.1;
  font-size:clamp(1.5rem,4.2vw,2rem);color:var(--teal-900);
  margin:2.2em 0 .5em;padding-top:.9em;border-top:1px solid var(--rule-soft);
}
.prosa h2:first-child{margin-top:0;padding-top:0;border-top:0}
.prosa h3{
  font-family:var(--text);font-weight:600;font-size:1.05rem;
  color:var(--teal-900);margin:1.8em 0 .35em;
}
.prosa p,.prosa li{color:var(--ink-2)}
.prosa p{margin:.75em 0}
.prosa ul{margin:.75em 0 .75em 1.1em;padding:0}
.prosa li{margin:.4em 0}
.prosa a{color:var(--teal-700);text-underline-offset:3px}
.prosa .dati{
  background:var(--card);border:1px solid var(--rule);border-radius:var(--r-md);
  padding:18px 20px;margin:1.2em 0;
}
.prosa .dati p{margin:.3em 0}
.aggiornato{
  margin-top:2.6em;padding-top:1.1em;border-top:1px solid var(--rule-soft);
  font-size:.9rem;color:var(--ink-2);
}

/* ==========================================================================
   Segnaposto della mappa: niente richieste a Google senza consenso
   ========================================================================== */
.mappa:not(.caricata){
  display:grid;place-items:center;text-align:center;
  min-height:340px;padding:28px 22px;background:var(--card);
}
.mappa .segnaposto p{max-width:42ch;margin:0 auto 16px;color:var(--ink-2);font-size:.95rem}
.mappa .segnaposto .btn{font-size:.95rem}

/* ==========================================================================
   Richiesta di consenso
   ========================================================================== */
.come-link{
  font:inherit;color:var(--teal-700);background:none;border:0;padding:0;
  text-decoration:underline;text-underline-offset:3px;cursor:pointer;
}
.come-link:hover{color:var(--teal-900)}

.consenso{
  position:fixed;z-index:90;left:var(--gut);right:var(--gut);bottom:var(--gut);
  display:grid;gap:18px;padding:22px;
  border-radius:var(--r-lg);background:var(--teal-900);color:var(--on-dark);
  box-shadow:0 22px 60px rgba(11,55,57,.34);
}
.consenso[hidden]{display:none}
.consenso h2{
  font-family:var(--display);font-weight:400;font-size:1.3rem;
  color:var(--on-dark);margin:0 0 .3em;
}
.consenso p{margin:0 0 .5em;font-size:.94rem;line-height:1.5;color:rgba(255,253,249,.88)}
.consenso p:last-child{margin-bottom:0}
.consenso a{color:var(--amber);text-underline-offset:3px}
/* le due scelte hanno lo stesso peso: rifiutare costa un clic come accettare */
.consenso-scelte{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.consenso-scelte .btn{width:100%;justify-content:center;padding:14px 18px}

@media (min-width:760px){
  .consenso{
    left:auto;right:var(--gut);bottom:var(--gut);max-width:640px;
    grid-template-columns:1fr auto;align-items:center;gap:24px;padding:24px 26px;
  }
  .consenso-scelte{grid-template-columns:1fr;align-content:center}
  .consenso-scelte .btn{white-space:nowrap}
}
@media (prefers-reduced-motion:no-preference){
  .consenso{animation:consenso-entra .32s ease both}
}
@keyframes consenso-entra{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}