/* Casa della Batteria · Castel San Pietro Terme
   Stile semplice e piatto: sezioni a tema scuro (blu, scritte gialle) alternate a sezioni a tema chiaro (bianco, scritte blu). */
@font-face{font-family:"Fira Cond";src:url(fonts/fira-condensed-bold.woff2) format("woff2");font-weight:700;font-display:swap}
@font-face{font-family:"Fira Cond";src:url(fonts/fira-condensed-extrabold.woff2) format("woff2");font-weight:800;font-display:swap}
@font-face{font-family:"Atkinson";src:url(fonts/atkinson-400.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"Atkinson";src:url(fonts/atkinson-700.woff2) format("woff2");font-weight:700;font-display:swap}

:root{
  --blu:#2b379b; --blu-2:#3844ad; --blu-3:#222d86; --blu-scuro:#1b2370;
  --giallo:#f2c744; --giallo-2:#ffd95f;
  --bianco:#ffffff; --grigio:#f3f4fa; --linea:#dfe2f1;
  --testo:#1c2152; --rosso:#d8433a; --ok:#2e9a4f;
  --h-barra:68px;
  --titoli:"Fira Cond","Arial Narrow",Arial,sans-serif; --corpo:"Atkinson",system-ui,sans-serif;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:calc(var(--h-barra) + 8px);-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bianco);color:var(--testo);font:400 1.0625rem/1.65 var(--corpo)}
img{max-width:100%;height:auto;display:block}
a{color:inherit}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.salta{position:absolute;left:-999px;top:8px;background:var(--giallo);color:var(--testo);padding:.5rem 1rem;z-index:100;border-radius:8px}
.salta:focus{left:8px}
.contenitore{width:min(1180px,100% - 2.5rem);margin-inline:auto}
.stretto{width:min(820px,100% - 2.5rem)}
h1,h2,h3{font-family:var(--titoli);font-weight:800;line-height:1.08;margin:0;letter-spacing:.005em}
h1{font-size:clamp(2.5rem,5.6vw,4.4rem)}
h2{font-size:clamp(1.9rem,3.8vw,2.9rem)}
h3{font-size:1.45rem;font-weight:700}
p{margin:.6em 0}
:focus-visible{outline:3px solid var(--giallo);outline-offset:3px;border-radius:6px}
.tema-chiaro :focus-visible{outline-color:var(--blu)}

/* Temi: scuro = sfondo blu, scritte gialle · chiaro = sfondo bianco, scritte blu */
.sezione{padding:5rem 0;position:relative}
.tema-scuro{background:var(--blu);color:#fff;--sf:var(--blu)}
.tema-scuro h1,.tema-scuro h2,.tema-scuro h3{color:var(--giallo)}
.tema-chiaro{background:var(--bianco);color:var(--testo);--sf:var(--bianco)}
.tema-chiaro h1,.tema-chiaro h2,.tema-chiaro h3{color:var(--blu)}
.tema-azzurro{background:#eef1fb;color:var(--testo);--sf:#eef1fb}
.tema-azzurro h1,.tema-azzurro h2,.tema-azzurro h3{color:var(--blu)}
.tema-giallino{background:#fff7de;color:var(--testo);--sf:#fff7de}
.tema-giallino h1,.tema-giallino h2,.tema-giallino h3{color:var(--blu)}
.tema-azzurro :focus-visible,.tema-giallino :focus-visible{outline-color:var(--blu)}
.tema-azzurro .chip-lista li,.tema-azzurro .altre a{background:#fff}
.tema-azzurro .altre a:hover{background:#f7f8fd}
.tema-azzurro .mappa svg{background:#fff}
.tema-giallino .rec{background:#fff}
.tema-giallino .rec figcaption{color:var(--blu)}
.tema-giallino .stelle{color:#e0a800}
.tema-azzurro .bottone-bordo,.tema-giallino .bottone-bordo{color:var(--blu)}
.capo{margin-bottom:2.4rem;max-width:44em}
.capo p{font-size:1.15rem;margin-top:.6rem}

/* Scena 3D unica: una sola tela fissa, ogni riquadro [data-vista] è una finestra */
#scena{position:fixed;left:0;top:0;width:100%;height:100%;pointer-events:none;z-index:8}
.vista{position:relative;touch-action:pan-y;min-height:200px}
.vista.senza-3d::after{content:"";position:absolute;inset:12%;background:url(logo/insegna-3.svg) center/contain no-repeat}

/* Barra */
.barra{position:sticky;top:0;z-index:30;display:flex;align-items:center;gap:1.4rem;height:var(--h-barra);
  padding:0 max(1.25rem,calc((100vw - 1180px)/2));background:var(--blu-scuro);color:#fff}
.logo{display:block;flex:none}.logo img{height:46px;width:auto}
.menu{display:flex;gap:1.3rem;margin-left:auto;font-weight:700;font-size:.97rem}
.menu a{text-decoration:none;padding:.4rem 0;border-bottom:3px solid transparent;color:#fff}
.menu a:hover,.menu a.attiva{border-bottom-color:var(--giallo)}
.apri-menu{display:none}

/* Bottoni piatti */
.bottone{display:inline-flex;flex-direction:row;gap:.55rem;white-space:nowrap;align-items:center;justify-content:center;text-align:center;text-decoration:none;
  font-family:var(--corpo);font-weight:700;line-height:1.15;background:var(--giallo);color:var(--testo);border:0;border-radius:10px;padding:.7rem 1.3rem;cursor:pointer;transition:background .15s}
.bottone .ic{width:1.3em;height:1.3em;flex:none}
.bottone .num::before{content:"· "}
.bottone .corto,.sotto .corto{display:none}
.bottone:hover{background:var(--giallo-2)}
.bottone-grande{padding:.95rem 1.7rem;font-size:1.15rem}
.bottone-bordo{background:transparent;color:inherit;border:2px solid currentColor;padding:.85rem 1.4rem;font-size:1.02rem}
.tema-scuro .bottone-bordo{color:#fff}.tema-scuro .bottone-bordo:hover{background:rgba(255,255,255,.12)}
.tema-chiaro .bottone-bordo{color:var(--blu)}.tema-chiaro .bottone-bordo:hover{background:var(--grigio)}
button.bottone{font:inherit;font-weight:700}
.bottone-barra{padding:.5rem 1.1rem}

/* Home / testata */
.hero{padding:4.2rem 0 4.6rem}
.hero-griglia{display:grid;grid-template-columns:1.2fr .8fr;gap:3rem;align-items:center}
.hero .piccolo-titolo{display:inline-block;margin:0 0 1.1rem;padding:.3rem .9rem;border-radius:999px;background:rgba(255,255,255,.14);font-weight:700;font-size:.95rem;color:#fff}
.hero h1 em{font-style:normal;color:#fff}
.sotto{font-size:1.2rem;max-width:36em;margin:1.2rem 0 1.7rem;color:#fff}
.azioni{display:flex;flex-wrap:wrap;gap:.9rem;align-items:center}
.stato{display:flex;align-items:flex-start;gap:.6rem;margin:1.4rem 0 0;font-weight:700;color:#fff}
.lampada{width:12px;height:12px;margin-top:.45em;border-radius:50%;background:#aab;flex:none}
.stato.aperto .lampada{background:#5be08a;animation:pulsa 2s ease-in-out infinite}
.stato.chiuso .lampada{background:var(--giallo)}
@keyframes pulsa{50%{box-shadow:0 0 0 7px rgba(91,224,138,0)}}
.tessera{position:relative;border-radius:20px;background:var(--blu-2);padding:1rem 1rem 1.2rem}
.tessera .vista{aspect-ratio:1/.95}
.misura{display:flex;align-items:center;justify-content:center;gap:.7rem;margin-top:.4rem;color:#fff;font-weight:700}
.misura-barra{display:block;width:120px;height:18px;border:2px solid #fff;border-radius:4px;padding:2px;position:relative}
.misura-barra::after{content:"";position:absolute;right:-7px;top:4px;width:4px;height:6px;background:#fff;border-radius:0 2px 2px 0}
.misura-barra i{display:block;height:100%;width:calc(var(--c,.05)*100%);background:var(--rosso);border-radius:1px;transition:background .3s}
.misura.media .misura-barra i{background:var(--giallo)}
.misura.piena .misura-barra i{background:#5be08a}
.misura.bassa .misura-barra i{animation:lampeggia 1.1s steps(2) infinite}
@keyframes lampeggia{50%{opacity:.25}}
.tessera .bottone{margin:.9rem auto 0;display:flex;width:max-content}

/* Sconto */
.sconto-griglia{display:grid;grid-template-columns:auto 1fr;gap:3rem;align-items:center}
.sconto-numero{font-family:var(--titoli);font-weight:800;font-size:clamp(2.8rem,6.4vw,5rem);line-height:1.02;color:var(--blu)}
.chip-lista{list-style:none;margin:1.2rem 0 0;padding:0;display:flex;flex-wrap:wrap;gap:.6rem}
.chip-lista li{background:var(--grigio);color:var(--testo);border-radius:999px;padding:.4rem 1rem;font-weight:700;font-size:.96rem}
.tema-scuro .chip-lista li{background:rgba(255,255,255,.14);color:#fff}

/* Schede prodotto */
.prodotti{display:grid;grid-template-columns:repeat(6,1fr);gap:1.4rem}
.scheda{grid-column:span 2;display:flex;flex-direction:column;background:var(--blu-2);border-radius:16px;text-decoration:none;color:#fff;overflow:hidden;transition:background .2s}
.scheda:nth-child(4){grid-column:2 / span 2}
.scheda:nth-child(5){grid-column:4 / span 2}
.scheda:hover{background:#4552bd}
.scheda-img{width:100%;height:auto;aspect-ratio:4/3;object-fit:contain;padding:1rem 1rem .2rem;background:radial-gradient(ellipse at 50% 85%,rgba(255,255,255,.16),transparent 70%);transition:transform .3s ease}
.scheda:hover .scheda-img{transform:scale(1.04)}
.scheda-testo{padding:.4rem 1.4rem 1.5rem;display:flex;flex-direction:column;flex:1}
.scheda h3{color:var(--giallo)}
.scheda p{flex:1;font-size:1rem;color:#fff}
.scheda .vai{font-weight:700;color:var(--giallo);margin-top:.4rem}
.scheda .vai::after{content:" →"}

/* Pronto intervento: quattro passi in fila, la linea si riempie con lo scroll */
.passi{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,1fr);gap:1.6rem;position:relative;--p:0}
.passi::before,.passi::after{content:"";position:absolute;top:35px;left:36px;height:4px;border-radius:2px}
.passi::before{right:36px;background:var(--linea)}
.passi::after{width:calc((100% - 72px)*var(--p));background:var(--blu)}
.passo{position:relative;opacity:.5;transition:opacity .4s}
.passo.attivo{opacity:1}
.passo .ico{position:relative;z-index:1;display:grid;place-content:center;width:72px;height:72px;border-radius:50%;background:#c9cfe9;color:var(--blu);margin-bottom:1rem;transition:background .4s,color .4s}
.passo.attivo .ico{background:var(--blu);color:#fff}
.passo .ico svg{width:38px;height:38px}
.passo h3{font-size:1.5rem}
.passo p{margin:.3rem 0 0}
.int-nota{margin-top:3rem;text-align:center}

/* Modulo targa */
.modulo-targa{max-width:640px;display:grid;gap:.5rem;background:var(--blu-2);border-radius:16px;padding:1.8rem}
.modulo-targa label{font-weight:700;margin-top:.5rem}
.modulo-targa input,.modulo-targa select{font:inherit;padding:.8rem .95rem;border:2px solid transparent;border-radius:10px;background:#fff;color:var(--testo)}
.modulo-targa .bottone{margin-top:1rem;justify-self:start}
.piccolo{font-size:.9rem;opacity:.9}

/* Perché noi */
.due-colonne{display:grid;grid-template-columns:1fr 1fr;gap:1.4rem;max-width:900px}
.riquadro{padding:1.5rem 1.6rem;border-radius:14px;background:var(--grigio)}
.riquadro ul{margin:.8rem 0 0;padding-left:1.2rem}.riquadro li{margin:.35rem 0}
.riquadro-blu{background:var(--blu);color:#fff}.riquadro-blu h3{color:var(--giallo)}
.marche{margin-top:2.6rem}
.marche p{font-weight:700;margin:0 0 .8rem}
.marche-loghi{display:flex;gap:2.4rem;align-items:center;flex-wrap:wrap}
.marche-loghi img{height:44px;width:auto;filter:brightness(0) saturate(100%) invert(18%) sepia(70%) saturate(2400%) hue-rotate(222deg)}
.mosaico{display:grid;grid-template-columns:repeat(6,1fr);gap:1rem;margin-top:2.6rem}
.mosaico figure{margin:0;border-radius:12px;overflow:hidden;background:var(--grigio)}
.mosaico img{width:100%;height:100%;object-fit:cover;aspect-ratio:4/3}
.mosaico figure:nth-child(1){grid-column:span 3;grid-row:span 2}.mosaico figure:nth-child(1) img{aspect-ratio:auto}
.mosaico figure:nth-child(2){grid-column:span 3}
.mosaico figure:nth-child(n+3){grid-column:span 1}
.mosaico-nota{font-size:.9rem;margin-top:.7rem;opacity:.85}

/* Marchi: carosello che scorre, Varta e Müller in primo piano */
.sezione-marche{padding:4rem 0 4.4rem}
.carosello{overflow:hidden;margin-top:1rem;-webkit-mask:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);mask:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.carosello-pista{list-style:none;margin:0;padding:0;display:flex;align-items:center;gap:4.2rem;width:max-content;animation:scorre-marchi 38s linear infinite}
.carosello:hover .carosello-pista{animation-play-state:paused}
.carosello li{flex:none;display:flex;align-items:center}
.carosello img{width:auto;filter:brightness(0) saturate(100%) invert(18%) sepia(70%) saturate(2400%) hue-rotate(222deg)}
.carosello .principale img{height:70px}
.carosello .altra img{height:38px;opacity:.38;filter:brightness(0) saturate(100%) invert(30%) sepia(8%) saturate(900%) hue-rotate(190deg)}
@keyframes scorre-marchi{to{transform:translateX(calc(-50% - 2.1rem))}}

/* Recensioni */
.rec-griglia{display:grid;grid-template-columns:repeat(3,1fr);gap:1.4rem}
.rec{margin:0;background:var(--blu-2);border-radius:16px;padding:1.5rem 1.6rem}
.rec blockquote{margin:0 0 .9rem;font-size:1.08rem;line-height:1.55}
.rec figcaption{font-size:.92rem;font-weight:700;color:var(--giallo)}
.stelle{color:var(--giallo);letter-spacing:.1em;font-size:1.1rem}
.centro{text-align:center;margin-top:2rem}

/* Zone */
.zone-griglia{display:grid;grid-template-columns:1fr 1fr;gap:3rem;align-items:center}
.mappa{margin:0;color:var(--blu)}
.mappa svg{width:100%;height:auto;background:var(--grigio);border-radius:16px}
.mappa figcaption{font-size:.85rem;margin-top:.6rem;text-align:center;color:var(--testo)}
.mappa .raggio{transform-origin:270px 210px;animation:respira 6s ease-in-out infinite}
@keyframes respira{50%{transform:scale(1.04)}}

/* Negozio */
.neg-griglia{display:grid;grid-template-columns:1.05fr .95fr;gap:3rem;align-items:center}
.neg-foto{border-radius:16px;overflow:hidden;background:var(--blu-2)}
.orari{border-collapse:collapse;width:100%;max-width:440px;margin:0 0 1.6rem;background:var(--blu-2);border-radius:12px;overflow:hidden;color:#fff}
.orari th,.orari td{text-align:left;padding:.55rem 1rem;border-bottom:1px solid rgba(255,255,255,.14)}
.orari th{font-weight:700;width:8.5em}
.orari tr:last-child th,.orari tr:last-child td{border-bottom:0}
.orari tr.oggi{background:var(--giallo);color:var(--testo)}
.orari tr.oggi th::after{content:" · oggi";font-weight:400}

/* Domande */
.faq details{border-bottom:1px solid var(--linea)}
.faq details:first-child{border-top:1px solid var(--linea)}
.faq summary{cursor:pointer;list-style:none;padding:1.15rem 3rem 1.15rem 0;font-weight:700;font-size:1.08rem;position:relative}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";position:absolute;right:.4rem;top:50%;transform:translateY(-50%);font-family:var(--titoli);font-weight:800;font-size:1.7rem;color:var(--blu);transition:transform .25s}
.faq details[open] summary::after{transform:translateY(-50%) rotate(45deg)}
.faq details p{margin:0;padding:0 0 1.2rem;max-width:44em}

/* Pagine dedicate */
.briciole{font-size:.92rem;margin:0 0 1rem;color:#fff;opacity:.9}.briciole a{text-decoration:none;border-bottom:1px solid rgba(255,255,255,.5)}
.pag-hero{padding:3.6rem 0 4.4rem}
.testo-pagina{max-width:46em}
.testo-pagina h2{margin:2.4rem 0 .6rem;font-size:clamp(1.6rem,3vw,2.2rem)}
.testo-pagina h2:first-child{margin-top:0}
.testo-pagina ul{padding-left:1.2rem}.testo-pagina li{margin:.4rem 0}
.altre{display:grid;grid-template-columns:repeat(5,1fr);gap:1rem}
.altre a{display:block;background:var(--grigio);border-radius:12px;padding:1.1rem 1.1rem 1.2rem;text-decoration:none;font-weight:700;color:var(--blu);transition:background .15s}
.altre a:hover{background:#e6e8f5}
.altre a span{display:block;font-weight:400;color:var(--testo);font-size:.92rem;margin-top:.25rem}

/* Piede */
.piede{background:var(--blu-scuro);color:#fff;padding:3.6rem 0 6rem}
.piede-griglia{display:grid;grid-template-columns:1.2fr 1fr;gap:3rem;align-items:center}
.piede-insegna svg{width:100%;height:auto;max-width:560px}
.piede a{color:var(--giallo)}
.piede-legale{font-size:.9rem;opacity:.92}
.piede-crediti{grid-column:1 / -1;border-top:1px solid rgba(255,255,255,.12);padding-top:.9rem;font-size:.6rem;line-height:1.4;opacity:.5}
.piede-crediti p{margin:.25rem 0}
.insegna-svg .corrente path{fill:none;stroke:#fff6d0;stroke-width:6;stroke-linecap:round;stroke-dasharray:70 930;stroke-dashoffset:1000;
  filter:drop-shadow(0 0 5px rgba(255,236,150,.95));animation:corrente 6.4s linear infinite}
.insegna-svg .corrente .c1{animation-duration:5.6s;animation-delay:-1.3s}
.insegna-svg .corrente .c2{animation-duration:7.4s;animation-delay:-2.6s}
.insegna-svg .corrente .c3{animation-duration:6s;animation-delay:-3.9s}
.insegna-svg .corrente .c4{animation-duration:8s;animation-delay:-5.2s}
@keyframes corrente{to{stroke-dashoffset:0}}

.chiama-fissa{display:none}

/* Comparse allo scroll (non nella testata) */
.entra{opacity:0;transform:translateY(18px);transition:opacity .55s ease,transform .55s cubic-bezier(.2,.7,.2,1)}
.entra.dentro{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}.entra{transform:none;transition:opacity .4s}}

.testo-legale{padding:3rem 0 5rem;max-width:760px}
.testo-legale h1{color:var(--blu);font-size:2.4rem;margin-bottom:1rem}

/* Tablet e telefono */
@media (max-width:1000px){
  .menu{display:none;position:absolute;left:0;right:0;top:100%;flex-direction:column;gap:0;background:var(--blu-scuro);padding:.4rem 1.25rem 1rem;margin:0}
  .menu.aperto{display:flex}
  .menu a{padding:.8rem 0;border-bottom:1px solid rgba(255,255,255,.14)}
  .apri-menu{display:grid;gap:4px;margin-left:auto;background:var(--giallo);border:0;border-radius:10px;width:48px;height:44px;padding:11px 10px;cursor:pointer}
  .apri-menu i{display:block;height:3px;background:var(--testo);border-radius:2px}
  .bottone-barra{display:none}
  .hero-griglia,.zone-griglia,.neg-griglia,.piede-griglia,.sconto-griglia{grid-template-columns:1fr}
  .prodotti{grid-template-columns:1fr 1fr}
  .scheda,.scheda:nth-child(4),.scheda:nth-child(5){grid-column:auto}
  .scheda:last-child{grid-column:1 / -1;width:calc(50% - .7rem);justify-self:center}
  .rec-griglia,.due-colonne{grid-template-columns:1fr}
  .passi{grid-template-columns:1fr;gap:1.6rem}
  .passi::before,.passi::after{top:36px;left:34px;right:auto;width:4px}
  .passi::before{bottom:36px;height:auto}
  .passi::after{height:calc((100% - 72px)*var(--p));width:4px}
  .passo{display:grid;grid-template-columns:72px 1fr;column-gap:1.2rem;align-items:start}
  .passo .ico{grid-row:1 / span 2;margin:0}
  .passo h3{align-self:end}
  .passo p{grid-column:2;margin:0}
  .altre{grid-template-columns:1fr 1fr}
  .mosaico{grid-template-columns:repeat(2,1fr)}
  .mosaico figure:nth-child(n){grid-column:auto;grid-row:auto}
  .mosaico figure:nth-child(1){grid-column:1 / -1}
}
@media (max-width:640px){
  :root{--h-barra:60px}
  body{font-size:1rem}
  .logo img{height:40px}
  .sezione{padding:3.4rem 0}
  .hero{padding:2.4rem 0 3rem}
  .prodotti{grid-template-columns:1fr}
  .scheda:last-child{width:auto}
  .altre{grid-template-columns:1fr}
  .bottone-grande,.bottone-bordo{width:100%}
  .azioni{flex-direction:column;align-items:stretch}
  .tessera .bottone{width:100%}
  /* titolo di sezione fermo sotto la barra, compatto; le frasi sotto il titolo restano fuori dal blocco fermo */
  .capo{display:contents}
  .capo h2{position:sticky;top:var(--h-barra);z-index:20;background:var(--sf);font-size:1.6rem;margin:0 0 .8rem;padding:.6rem 0 .5rem;
    box-shadow:0 0 0 100vmax var(--sf);clip-path:inset(0 -100vmax)}
  .capo p{margin:0 0 1.2rem;font-size:1.05rem}
  .chiama-fissa{display:grid;grid-template-columns:1fr 1fr 1fr;gap:.6rem;position:fixed;left:0;right:0;bottom:0;z-index:40;transform:translateY(110%);transition:transform .3s ease;padding:.6rem .8rem calc(.6rem + env(safe-area-inset-bottom));background:var(--blu-scuro)}
  .chiama-fissa a{display:flex;align-items:center;justify-content:center;gap:.5rem;text-align:center;text-decoration:none;font-weight:700;border-radius:10px;padding:.75rem .5rem;line-height:1.1}
  .chiama-fissa .ic{width:1.3em;height:1.3em}
  .cf-chiama{background:var(--giallo);color:var(--testo)}.cf-wa{background:#fff;color:var(--blu)}
  .piede{padding-bottom:7rem}
}

/* Immagini consegnate: marchi, vetrina batterie */
.carosello img{filter:none}
.carosello .principale img{height:56px}
.carosello .altra img{height:34px;opacity:.5;filter:grayscale(1)}
.mosaico{grid-template-columns:repeat(3,1fr)}
.mosaico figure:nth-child(n){grid-column:auto;grid-row:auto}
.mosaico figure:nth-child(1) img{aspect-ratio:4/3}
.vetrina-batterie{list-style:none;margin:1rem 0 0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:1rem}
.vetrina-batterie li{position:relative;background:#eef1fb;border-radius:12px;overflow:hidden;aspect-ratio:4/3;background-image:url(img/batterie/ombra-contatto.webp);background-size:100% 100%;background-repeat:no-repeat}
.vetrina-batterie img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain}
.vetrina-batterie span{position:absolute;left:.8rem;bottom:.6rem;font-size:.85rem;font-weight:700;color:var(--blu)}

/* Carosello (recensioni sempre; batterie da tablet e telefono): scorre da solo, col dito e coi pulsanti */
.cs-pista{display:flex;gap:1.4rem;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch}
.cs-pista::-webkit-scrollbar{display:none}
.cs-pista>*{flex:0 0 min(40%,470px);scroll-snap-align:start}
.cs-comandi{display:flex;gap:.7rem;justify-content:center;margin-top:1.3rem}
.cs-comandi button{width:48px;height:48px;border-radius:50%;border:2px solid var(--blu);background:transparent;color:var(--blu);cursor:pointer;display:grid;place-content:center;padding:0;transition:background .15s,color .15s}
.cs-comandi button:hover{background:var(--blu);color:#fff}
.cs-comandi svg{width:22px;height:22px}
.vetrina-batterie.cs-pista{display:grid;overflow:visible}

/* Testata: fulmine piatto dietro la batteria */
.tessera-fulmine{background:none;padding:0}
.tessera-fulmine::before{content:"";position:absolute;inset:-12% 0;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 130'%3E%3Cpath d='M60 6 16 74h30l-8 50 46-72H54z' fill='%233844ad' stroke='%233844ad' stroke-width='10' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat}
.tessera-fulmine .vista{position:relative;z-index:1}

/* Come farla durare */
.durata-griglia{display:grid;grid-template-columns:1fr 1.25fr;gap:3rem;align-items:start}
.consigli{list-style:none;counter-reset:c;margin:0;padding:0;display:grid;gap:.9rem}
.consigli li{counter-increment:c;display:grid;grid-template-columns:48px 1fr;column-gap:1rem;align-items:start;background:#fff;border-radius:14px;padding:1.1rem 1.2rem}
.consigli li::before{content:counter(c);grid-row:1 / span 2;width:44px;height:44px;border-radius:50%;background:var(--blu);color:var(--giallo);font-family:var(--titoli);font-weight:800;font-size:1.4rem;display:grid;place-content:center}
.consigli b{color:var(--blu);font-size:1.08rem;line-height:1.3}
.consigli span{grid-column:2;margin-top:.2rem}

/* Negozio: mappa */
.neg-mappa{margin-top:2.4rem}
.neg-vengono{margin:0 0 1rem;font-size:1.05rem}
.neg-mappa iframe{display:block;width:100%;height:360px;border:0;border-radius:16px;background:var(--blu-2)}

@media (max-width:1000px){
  .durata-griglia{grid-template-columns:1fr}
  .vetrina-batterie.cs-pista{display:flex;overflow-x:auto;gap:1rem}
  .vetrina-batterie.cs-pista li{flex:0 0 46%;scroll-snap-align:start}
}
@media (max-width:640px){
  .vetrina-batterie.cs-pista li{flex:0 0 78%}
  .cs-pista>*{flex-basis:86%}
  .vetrina-batterie.cs-pista>li{flex-basis:78%}
  .neg-mappa iframe{height:300px}
  /* testata più corta: dentro lo schermo ci sta anche la batteria in 3D */
  .hero .piccolo-titolo{display:none}
  .hero h1{font-size:2.15rem}
  .hero{padding:1.6rem 0 2rem}
  .sotto .lungo,.bottone .lungo{display:none}
  .sotto .corto,.bottone .corto{display:inline}
  .sotto{font-size:1.05rem;margin:.7rem 0 1.1rem}
  .azioni{flex-direction:row;flex-wrap:nowrap;gap:.6rem}
  .azioni .bottone{flex:1 1 0;width:auto;min-width:0;padding:.8rem .4rem;font-size:.98rem}
  .bottone .num{display:none}
  .hero-griglia{gap:1.2rem}
  .tessera .vista{aspect-ratio:1/.78}
  .chiama-fissa.visibile{transform:none}
}
.hero-testo{position:relative;z-index:2}
@media (max-width:640px){.mosaico{grid-template-columns:1fr 1fr}.mosaico figure:nth-child(1){grid-column:1 / -1}}

/* Fulmini dietro il modulo targa */
[data-fulmini]{position:relative;overflow:hidden}
[data-fulmini]>.contenitore{position:relative;z-index:1}
.fulmini{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:0}

/* Testata: batteria più grande */
.hero-griglia{grid-template-columns:1fr 1fr}
.tessera-fulmine .vista{aspect-ratio:1/.86}
@media (max-width:1000px){.hero-griglia{grid-template-columns:1fr}}
@media (max-width:640px){.tessera-fulmine .vista{aspect-ratio:1/1}}

/* Telefono: le due CTA della testata stanno sopra la batteria, mai coperte */
@media (max-width:640px){.hero .azioni{position:relative;z-index:3;margin-bottom:1.4rem}.hero-griglia{gap:.4rem}}

/* Card prodotti: sfumatura chiara dietro il mezzo che zooma in hover; in hover la card diventa gialla */
.scheda{position:relative;isolation:isolate;transition:background .25s ease}
.scheda::before{content:"";position:absolute;left:0;right:0;top:0;aspect-ratio:4/3;z-index:-1;pointer-events:none;
  background:radial-gradient(closest-side at 50% 62%,rgba(255,255,255,.3),rgba(255,255,255,0));transform:scale(1);transform-origin:50% 62%;transition:transform .55s cubic-bezier(.2,.7,.2,1),opacity .3s}
.scheda-img{background:none}
.scheda h3,.scheda p{color:#fff;transition:color .25s ease}
.scheda .vai{color:var(--giallo);transition:color .25s ease}
.scheda:hover,.scheda:focus-visible{background:var(--giallo)}
.scheda:hover::before,.scheda:focus-visible::before{transform:scale(1.45);background:radial-gradient(closest-side at 50% 62%,rgba(255,255,255,.65),rgba(255,255,255,0))}
.scheda:hover h3,.scheda:hover p,.scheda:focus-visible h3,.scheda:focus-visible p{color:var(--testo)}
.scheda:hover .vai,.scheda:focus-visible .vai{color:var(--blu)}

/* Card prodotti da telefono: due per riga, solo titolo e link */
.scheda .vai .corto{display:none}
@media (max-width:640px){
  .prodotti{grid-template-columns:1fr 1fr;gap:.7rem}
  .scheda:last-child{grid-column:1 / -1;width:calc(50% - .35rem);justify-self:center}
  .scheda p{display:none}
  .scheda-img{padding:.7rem .5rem 0}
  .scheda-testo{padding:.2rem .9rem 1rem}
  .scheda h3{font-size:1.2rem}
  .scheda .vai .lungo{display:none}
  .scheda .vai .corto{display:inline}
  .scheda .vai{font-size:.95rem;margin-top:.3rem}
}
@media (max-width:640px){.scheda-testo{flex:1}.scheda .vai{margin-top:auto;padding-top:.4rem}}

/* Telefono: barra fissa a tre voci, CTA della testata sotto la batteria, sezioni lunghe nascoste */
@media (max-width:640px){
  .solo-pc{display:none}
  .chiama-fissa a{padding:.75rem .2rem;font-size:.95rem;gap:.4rem}
  .cf-dove{background:transparent;color:#fff;border:2px solid rgba(255,255,255,.55)}
  .cf-wa{background:#fff;color:var(--blu)}
  .cf-chiama{background:var(--giallo);color:var(--testo)}
  .hero-testo{display:contents}
  .hero-griglia{gap:0}
  .hero h1{order:1}.hero .sotto{order:2}.hero .tessera{order:3;margin:.2rem 0 .4rem}.hero .azioni{order:4;margin:0}
  .hero .briciole{order:0}
}
@media (max-width:640px){
  .chiama-fissa a{white-space:nowrap;font-size:.9rem;padding:.75rem .1rem;gap:.35rem}
  .hero h1,.hero .sotto{position:relative;z-index:2}
}

/* Caroselli: pulsanti in alto a destra sopra le card (da telefono spariscono); batterie sempre in carosello continuo */
.carosello-rec .cs-comandi{justify-content:flex-end;margin:-1rem 0 1.1rem}
.vetrina-batterie.cs-pista{display:flex;overflow-x:auto;scroll-snap-type:none;gap:1rem;cursor:grab}
.vetrina-batterie.cs-pista.trascina{cursor:grabbing;user-select:none}
.vetrina-batterie.cs-pista>li{flex:0 0 calc((100% - 2rem) / 3.2);scroll-snap-align:none}
@media (max-width:1000px){.vetrina-batterie.cs-pista>li{flex:0 0 46%}}
@media (max-width:640px){
  .cs-comandi{display:none}
  .vetrina-batterie.cs-pista>li{flex:0 0 72%}
}
@media (max-width:640px){.scheda:last-child{grid-column:1 / -1;width:auto;justify-self:stretch}.scheda:last-child .scheda-img{aspect-ratio:16/9;padding:.8rem .5rem 0}}
@media (max-width:640px){.scheda:last-child .scheda-img{aspect-ratio:auto;height:calc((100vw - 3.2rem) / 2 * .75);padding:.7rem .5rem 0}}

/* ——— Marchi: tutti blu, Varta e Müller più grandi */
.carosello .principale img{height:64px;opacity:1;filter:none}
.carosello .altra img{height:38px;opacity:1;filter:none}

/* ——— Sei categorie: tre per riga da computer, due da tablet e telefono */
.prodotti{grid-template-columns:repeat(6,1fr)}
.scheda:nth-child(4),.scheda:nth-child(5),.scheda:nth-child(6){grid-column:span 2}
@media (max-width:1000px){.prodotti{grid-template-columns:1fr 1fr}.scheda,.scheda:nth-child(n){grid-column:auto}}
@media (max-width:1000px){.scheda:last-child{grid-column:auto;width:auto;justify-self:stretch}.scheda:last-child .scheda-img{aspect-ratio:4/3;height:auto;padding:.7rem .5rem 0}}

/* ——— Carosello batterie: foto del negozio e sagome, senza scritte */
.vetrina-batterie li.foto{background:none}
.vetrina-batterie li.foto img{object-fit:cover}
.vista-img{display:grid;place-items:center}
.vista-img img{width:100%;height:100%;object-fit:contain}

/* ——— Garanzia e pronto intervento */
.due-carte{display:grid;grid-template-columns:1fr 1fr;gap:1.4rem;max-width:960px}
.carta{background:#fff;border-radius:16px;padding:1.8rem 1.8rem 2rem}
.carta h3{margin:0 0 .6rem;color:var(--blu)}
.carta p{margin:.5rem 0}
.carta-gialla{background:var(--giallo)}
.carta-gialla h3{color:var(--testo)}
.carta-gialla .bottone{background:var(--blu);color:#fff}
.carta-gialla .bottone:hover{background:var(--blu-3)}
.spunte{list-style:none;margin:.6rem 0 1rem;padding:0;display:grid;gap:.5rem;font-weight:700}
.spunte li{display:flex;gap:.6rem;align-items:center}
.spunte li::before{content:"";width:1.1rem;height:1.1rem;flex:none;border-radius:50%;background:var(--blu) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 12.5l4 4 8-9'/%3E%3C/svg%3E") center/70% no-repeat}

/* ——— Contatti e modulo di richiesta */
.contatti-griglia{display:grid;grid-template-columns:1fr 1.1fr;gap:3rem;align-items:start}
.contatti-lista{list-style:none;margin:0;padding:0;display:grid;gap:.8rem;justify-items:start}
.riga-dato{display:flex;gap:.6rem;align-items:center;margin-top:.6rem;color:#fff}
.riga-dato .ic{width:1.4rem;height:1.4rem;flex:none;color:var(--giallo)}
.modulo-contatto{max-width:640px;display:grid;gap:.9rem;background:var(--blu-2);border-radius:16px;padding:1.8rem;color:#fff}
.contatti-griglia .modulo-contatto{max-width:none}
.modulo-contatto .campo{display:grid;gap:.35rem}
.modulo-contatto label{font-weight:700}
.modulo-contatto input,.modulo-contatto select,.modulo-contatto textarea{font:inherit;padding:.8rem .95rem;border:2px solid transparent;border-radius:10px;background:#fff;color:var(--testo);width:100%}
.modulo-contatto textarea{resize:vertical;min-height:7.5rem}
.modulo-contatto .bottone{justify-self:start;margin-top:.3rem}
.modulo-contatto .trappola{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.modulo-contatto .esito{min-height:1.4em;margin:0;font-weight:700}
.modulo-contatto .esito.ok{color:var(--giallo)}.modulo-contatto .esito.no{color:#ffc4be}
.modulo-contatto .piccolo{margin:0;font-size:.85rem;opacity:.9}.modulo-contatto .piccolo a{color:var(--giallo)}
@media (max-width:1000px){.contatti-griglia{grid-template-columns:1fr}.due-carte{grid-template-columns:1fr}}
@media (max-width:640px){
  .carosello .principale img{height:50px}.carosello .altra img{height:32px}
  .due-carte{gap:1rem}
  .modulo-contatto{padding:1.3rem}
  .modulo-contatto .bottone{justify-self:stretch}
  #contatti .capo h2{position:static;box-shadow:none;clip-path:none;padding:0;margin:0 0 .6rem}
}

/* Garanzia e intervento: icone del set */
.ico-grande{display:block;width:64px;height:64px;margin-bottom:.8rem}
.ico-grande svg,.voci-icone .ico svg{width:100%;height:100%;display:block}
.carta{color:var(--testo)}
.carta-blu{background:var(--blu);color:#fff}
.carta-blu h3{color:var(--giallo)}
.carta-blu .ico-grande{color:#fff}
.carta .ico-grande{color:var(--blu)}.carta-blu .ico-grande{color:#fff}
.carta-blu .bottone{background:var(--giallo);color:var(--testo)}
.carta-blu .bottone:hover{background:var(--giallo-2)}
.voci-icone{list-style:none;margin:.9rem 0 1.2rem;padding:0;display:grid;gap:.7rem;font-weight:700}
.voci-icone li{display:flex;gap:.8rem;align-items:center}
.voci-icone .ico{width:40px;height:40px;flex:none;color:#fff}
.due-carte{max-width:none}.contatti-lista .bottone{min-width:15rem;justify-content:center}
.tessera .vista.vista-img{aspect-ratio:4/3;max-height:440px;min-height:0;display:block;margin-inline:auto}
.tessera .vista.vista-img img{width:100%;height:100%;object-fit:contain}

/* Marchi: più piccoli, più distanziati, più lenti (Varta e Müller restano i più grandi) */
.carosello-pista{gap:7rem;animation-duration:80s}
@keyframes scorre-marchi{to{transform:translateX(calc(-50% - 3.5rem))}}
.carosello .principale img{height:46px}
.carosello .altra img{height:27px}
@media (max-width:640px){.carosello-pista{gap:4.5rem;animation-duration:60s}@keyframes scorre-marchi{to{transform:translateX(calc(-50% - 2.25rem))}}.carosello .principale img{height:36px}.carosello .altra img{height:22px}}

/* Sezioni con il modulo: «Di che hai bisogno?» piccolo, «Ti risponderemo in un lampo!» grande e giallo */
.capo .sopra{margin:0 0 .3rem;font-size:1.05rem;font-weight:700;color:#fff}
.capo h2.grande{font-size:clamp(2.3rem,5vw,3.6rem);line-height:1.05}
@media (max-width:640px){.capo p.sopra{margin:0 0 .2rem;font-size:.95rem}.capo h2.grande{font-size:2.1rem}}

/* Recensioni: titolo e pulsanti sulla stessa riga */
.rec-testata{display:flex;justify-content:space-between;align-items:flex-start;gap:1.5rem}
.rec-testata .cs-comandi{margin:0;flex:none}
@media (max-width:640px){.rec-testata{display:contents}}

/* Assistenza / pit stop: testo a sinistra, immagine a destra (metà del contenuto), da telefono sotto il testo */
.garanzia-griglia{display:grid;grid-template-columns:1fr 1fr;gap:3rem;align-items:center}
.garanzia-nota{display:flex;gap:.9rem;align-items:center;margin:1.2rem 0 1.5rem;color:#fff}
.garanzia-nota .ico{width:46px;height:46px;flex:none;color:#fff}.garanzia-nota .ico svg{width:100%;height:100%;display:block}
.pit-immagine{margin:0;position:relative;aspect-ratio:4/3;border-radius:18px;overflow:hidden;background:var(--blu-2) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 130'%3E%3Cpath d='M60 6 16 74h30l-8 50 46-72H54z' fill='%234552bd' stroke='%234552bd' stroke-width='10' stroke-linejoin='round'/%3E%3C/svg%3E") center/26% no-repeat}
.pit-immagine img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
#negozio{background:var(--blu)}
@media (max-width:1000px){.garanzia-griglia{grid-template-columns:1fr;gap:2rem}}
@media (max-width:640px){#garanzia .capo h2{position:static;box-shadow:none;clip-path:none;padding:0;margin:0 0 .8rem}#garanzia .capo p.sopra{margin:0 0 .2rem}}
.pit-immagine{aspect-ratio:2/1;background:none;border-radius:0;overflow:visible}
.pit-immagine img{object-fit:contain;filter:drop-shadow(0 14px 18px rgba(8,12,60,.35))}

/* Assistenza: testo in alto a sinistra, lista a destra del testo, immagine sotto */
.garanzia-griglia{grid-template-columns:1.1fr .9fr;gap:1.5rem 3rem;align-items:center}
.garanzia-lista .voci-icone{margin-top:0}
.garanzia-lista .bottone{margin-top:.2rem}
.pit-immagine{grid-column:1 / -1;width:100%;max-width:940px;margin:1.2rem auto 0}
@media (max-width:1000px){.garanzia-griglia{grid-template-columns:1fr}}

/* Assistenza: composizione centrata. Testo e lista formano una riga, l'immagine ha la stessa larghezza della riga */
.garanzia-griglia{width:min(58rem,100% - 2.5rem);margin-inline:auto;grid-template-columns:1fr auto;gap:2rem 4rem;align-items:center}
.garanzia-testo .capo{margin-bottom:1.2rem}
.garanzia-lista{justify-self:end}
.garanzia-lista .bottone{width:100%}
.pit-immagine{max-width:none;margin:.4rem 0 0}
@media (max-width:1000px){.garanzia-griglia{grid-template-columns:1fr;width:min(40rem,100% - 2.5rem)}.garanzia-lista{justify-self:start}.garanzia-lista .bottone{width:auto}}

/* Il negozio: testo a sinistra, foto a destra (da telefono la foto resta sopra); frase sotto la mappa */
.neg-griglia{grid-template-columns:.95fr 1.05fr}
.neg-testo{order:-1}
@media (max-width:1000px){.neg-griglia{grid-template-columns:1fr}.neg-testo{order:0}}
.neg-vengono{margin:1rem 0 0;font-size:1.05rem}
.neg-mappa iframe+.neg-vengono{margin-top:1rem}

/* Marchi: più aria sopra e sotto */
.sezione-marche{padding:7rem 0 7.5rem}
@media (max-width:640px){.sezione-marche{padding:4.8rem 0 5rem}}

/* Un negozio solo di batterie: pulsanti delle foto a destra del riquadro «Dal meccanico» */
.perche-riga{display:flex;align-items:flex-end;gap:1.5rem}
.perche-riga .due-colonne{flex:1 1 auto}
.perche-riga .cs-comandi{margin:0 0 .2rem auto;flex:none}

/* Domande frequenti (home): blu scuro come il piede */
.sezione-faq{background:var(--blu-scuro)}
.sezione-faq .faq details{border-bottom-color:rgba(255,255,255,.2)}
.sezione-faq .faq details:first-child{border-top-color:rgba(255,255,255,.2)}
.sezione-faq .faq summary{color:#fff}
.sezione-faq .faq summary::after{color:var(--giallo)}
.sezione-faq .faq details p{color:#fff;opacity:.92}

/* Telefono: la testata dà più spazio al testo che alla batteria 3D */
@media (max-width:640px){
  .hero h1{font-size:2.45rem;line-height:1.06}
  .hero .sotto{font-size:1.12rem;margin:.9rem 0 1rem}
  .tessera .vista{aspect-ratio:1/.7}
  .hero .tessera{margin:0 0 .6rem}
}

/* Titolo della testata: bianco, con «Casa della Batteria» e «pochi minuti» in giallo */
.tema-scuro h1.titolo-hero{color:#fff}
.titolo-hero .g{color:var(--giallo)}

/* Allineamento: assistenza e domande frequenti hanno la stessa larghezza del resto del sito */
.stretto{width:min(1180px,100% - 2.5rem)}
.garanzia-griglia{width:min(1180px,100% - 2.5rem);margin-inline:auto}
.pit-immagine{max-width:960px;margin-inline:auto}
@media (max-width:1000px){.garanzia-griglia{width:min(1180px,100% - 2.5rem)}}

/* Computer: la testata occupa tutto lo schermo sotto la barra */
@media (min-width:1001px){
  #inizio.hero{min-height:calc(100vh - var(--h-barra));min-height:calc(100svh - var(--h-barra));display:flex;align-items:center;padding:2rem 0}
  #inizio.hero>.hero-griglia{width:min(1180px,100% - 2.5rem);margin-inline:auto}
}
.titolo-hero .nw{white-space:nowrap}

/* «Cosa dicono di noi» occupa tutto lo schermo sotto la barra, contenuto al centro */
#recensioni{min-height:calc(100vh - var(--h-barra));min-height:calc(100svh - var(--h-barra));display:flex;flex-direction:column;justify-content:center}
#recensioni>.contenitore{width:min(1180px,100% - 2.5rem)}
/* Telefono: niente fulmine dietro la batteria 3D della testata */
@media (max-width:640px){.tessera-fulmine::before{display:none}}

/* «Domande frequenti» (home) occupa tutto lo schermo sotto la barra, contenuto al centro */
.sezione-faq{min-height:calc(100vh - var(--h-barra));min-height:calc(100svh - var(--h-barra));display:flex;flex-direction:column;justify-content:center}
.sezione-faq>.contenitore{width:min(1180px,100% - 2.5rem)}

/* Pulsanti secondari su sfondo blu (Scrivici, Trovaci…): pieni, blu scuro */
.tema-scuro .bottone-bordo{background:var(--blu-scuro);border-color:var(--blu-scuro);color:#fff}
.tema-scuro .bottone-bordo:hover{background:var(--blu-3);border-color:var(--blu-3)}

/* ——— Piede: a tutto schermo, contatti in due colonne, scritta del logo a tutta larghezza, fulmini nello sfondo ——— */
.piede{min-height:100vh;min-height:100svh;display:flex;flex-direction:column;justify-content:space-between;gap:2.5rem;padding:4.5rem 0 1.6rem;background:var(--blu-scuro);color:#fff}
.piede-contatti{display:grid;grid-template-columns:1fr 1fr;gap:3rem;align-items:start;width:min(1180px,100% - 2.5rem)}
.piede h2{font-size:clamp(1.5rem,2.6vw,2rem);color:var(--giallo);margin:0 0 1.1rem}
.piede h3{font-family:var(--corpo);font-weight:700;font-size:.95rem;letter-spacing:.06em;text-transform:uppercase;color:#fff;opacity:.7;margin:1.7rem 0 .6rem}
.piede-lista{list-style:none;margin:0;padding:0;display:grid;gap:.75rem}
.piede-lista li{display:flex;gap:.75rem;align-items:flex-start;line-height:1.45}
.piede-lista .ic{width:1.3rem;height:1.3rem;flex:none;margin-top:.2rem;color:var(--giallo)}
.piede-lista span{opacity:.75}
.piede-link-riga{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:.35rem 1.5rem}
.piede-dx{justify-self:end;width:100%;max-width:34rem}
.piede-legale{margin:.2rem 0;font-size:.95rem;opacity:.92}
.piede a{color:var(--giallo)}
.piede-insegna{width:min(1180px,100% - 2.5rem)}
.piede-insegna svg{width:100%;max-width:none;height:auto;display:block}
.piede-crediti{width:min(1180px,100% - 2.5rem);grid-column:auto}
/* la luce che corre lungo le lettere: molto più lenta */
.insegna-svg .corrente path{animation-duration:15s}
.insegna-svg .corrente .c1{animation-duration:13s;animation-delay:-3s}
.insegna-svg .corrente .c2{animation-duration:17s;animation-delay:-6s}
.insegna-svg .corrente .c3{animation-duration:14s;animation-delay:-9s}
.insegna-svg .corrente .c4{animation-duration:19s;animation-delay:-12s}
@media (max-width:1000px){.piede-contatti{grid-template-columns:1fr;gap:2rem}.piede-dx{justify-self:start;max-width:none}}
@media (max-width:640px){.piede{padding:3rem 0 7rem}}
.piede{gap:1.6rem;padding:3rem 0 1.2rem}
.piede h3{margin-top:1.3rem}
@media (max-width:640px){.piede{padding:3rem 0 7rem}}
/* il piede parte sotto la barra fissa quando si arriva in fondo: tutto il contenuto resta visibile */
.piede{padding:calc(var(--h-barra) + 1rem) 0 .8rem;gap:1.1rem}
.piede h2{margin-bottom:.8rem}
.piede-lista{gap:.5rem}
.piede h3{margin:1rem 0 .4rem}
.piede-crediti p{margin:0}
@media (max-width:640px){.piede{padding:calc(var(--h-barra) + 1rem) 0 7rem}}
.piede-crediti .piede-legale{margin:0 0 .5rem;font-size:.95rem;opacity:.95}
.piede-crediti .piede-legale a{color:var(--giallo)}
.piede-contatti{align-items:stretch}
@media (min-width:1001px){.piede-col{display:flex;flex-direction:column;justify-content:space-between;gap:.6rem}.piede-col h3{margin:0}}

/* Telefono: «Montaggio gratuito.» resta unito; i due pulsanti della testata non tagliano il testo */
.sotto .nw{white-space:nowrap}
@media (max-width:640px){
  .hero .azioni .bottone{font-size:.92rem;gap:.4rem;padding:.8rem .35rem}
  .hero .azioni .bottone:first-child{flex:1.4 1 0}
  .hero .azioni .bottone:last-child{flex:.9 1 0}
  .hero .azioni .bottone .ic{width:1.15em;height:1.15em}
}
@media (max-width:640px){
  .hero .azioni{gap:.75rem;margin-top:.4rem}
  .hero .azioni .bottone{font-size:clamp(.8rem,3.7vw,.95rem);padding:.85rem .5rem}
  .hero .tessera{margin:0 0 1rem}
  #inizio.hero{padding-bottom:2.6rem}
}
.sezione-faq{--sf:var(--blu-scuro)}
.orari{background:var(--blu-scuro)}

/* Menu da telefono: solo tre linee gialle, senza sfondo */
.apri-menu{background:transparent;border-radius:0}
.apri-menu i{background:var(--giallo);height:3px}

/* Telefono: card dei mezzi con testo più piccolo; pulsanti della testata: «Pronto intervento» più largo e con testo più grande (va a capo se serve), «Scrivici» più stretto */
@media (max-width:640px){
  .scheda h3{font-size:1.02rem;line-height:1.15}
  .scheda .vai{font-size:.8rem}
  .scheda-testo{padding:.1rem .8rem .9rem}
  .hero .azioni .bottone{font-size:1.04rem;line-height:1.15;white-space:normal;padding:.8rem .5rem}
  .hero .azioni .bottone:first-child{flex:1.75 1 0}
  .hero .azioni .bottone:last-child{flex:.7 1 0}
}
@media (max-width:640px){.scheda .vai::after{content:""}}

/* Telefono: «Scrivici» nella testata è solo l'icona di WhatsApp */
@media (max-width:640px){
  .hero .azioni .bottone:last-child{flex:0 0 3.6rem;padding:.8rem 0}
  .hero .azioni .bottone:last-child span{display:none}
  .hero .azioni .bottone:last-child .ic{width:1.6em;height:1.6em}
}
