/* Famiglie e pesi del Task 8-bis, passo 1; file versionati già verificati da Claude. */
@font-face{
  font-family:"Source Sans 3";
  font-style:normal;
  font-weight:400;
  font-display:swap;
  src:url("/fonts/source-sans-3-400-v20.woff2") format("woff2");
}
@font-face{
  font-family:"Source Sans 3";
  font-style:normal;
  font-weight:600;
  font-display:swap;
  src:url("/fonts/source-sans-3-600-v20.woff2") format("woff2");
}
@font-face{
  font-family:"Barlow Condensed";
  font-style:normal;
  font-weight:600;
  font-display:swap;
  src:url("/fonts/barlow-condensed-600-v13.woff2") format("woff2");
}
@font-face{
  font-family:"Barlow Condensed";
  font-style:normal;
  font-weight:700;
  font-display:swap;
  src:url("/fonts/barlow-condensed-700-v13.woff2") format("woff2");
}
/* Grafica2, 09/10/2026: palette del riferimento ITG fornito da Luca.
   Le misure di impaginazione e i tempi sotto sono scelte grafiche di questa variante:
   griglia 1140px, ritmo 8px, testata 96/72px, controlli 44px (oltre i 24px richiesti).
   Il breakpoint 900px conserva quello delle fotografie verticali già collaudate. */
:root{
  --blu:#26348b;--blu-scuro:#142843;--verde:#43883d;--verde-scuro:#2f6a2b;
  --inchiostro:#142843;--testo:#3b4150;--tenue:#5f6573;--fondo:#ffffff;--fondo-alt:#f3f5fa;--bordo:#d9deea;
  --titoli:"Barlow Condensed","Helvetica Neue",Arial,sans-serif;
  --corpo:"Source Sans 3","Helvetica Neue",Arial,sans-serif;
  --raggio:4px;--max:1140px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
[id]{scroll-margin-top:112px}
body{margin:0;background:var(--fondo);color:var(--testo);font:18px/1.65 var(--corpo);-webkit-text-size-adjust:100%}
img{max-width:100%;height:auto;display:block}
button,input,select,textarea{font:inherit}
button,a,input,select,textarea,summary{-webkit-tap-highlight-color:transparent}
a{color:var(--blu);text-underline-offset:.2em;text-decoration-thickness:1px}
a:hover{text-decoration-thickness:2px}
a[href^="tel:"]{white-space:nowrap}
:focus-visible{outline:3px solid var(--verde-scuro);outline-offset:4px;box-shadow:0 0 0 4px #fff}
[hidden]{display:none!important}
h1,h2,h3{font-family:var(--titoli);color:var(--inchiostro);line-height:1.1;margin:1.25em 0 .5em}
h1{font-size:clamp(2.7rem,5.5vw,4.7rem);margin-top:.25em}
h2{font-size:clamp(2rem,3.8vw,3rem)}
h3{font-size:1.65rem}
p{margin:0 0 1.2em}
.contenitore{width:100%;max-width:var(--max);margin:0 auto;padding:0 24px}
.sezione{padding-top:80px;padding-bottom:80px}
.sezione > h2:first-child,.correlati > h2:first-child{margin-top:0}
.sezione > h2:first-child::after,.correlati > h2::after{content:"";display:block;width:48px;height:4px;background:var(--verde);margin-top:20px}
.salta{position:absolute;left:-999px}
.salta:focus{left:16px;top:8px;background:#fff;padding:8px;z-index:100}
/* Il contenitore riserva sempre 96px: la riduzione della riga non sposta il main. */
.testata{height:96px;position:sticky;top:0;z-index:50;pointer-events:none}
.testata-riga{height:96px;max-width:none;padding:0 max(24px,calc((100% - var(--max))/2 + 24px));display:flex;align-items:center;justify-content:space-between;gap:16px;background:#fff;box-shadow:0 1px 0 var(--bordo);pointer-events:auto;transition:height .25s ease,box-shadow .25s ease}
.testata.compatta .testata-riga{height:72px;box-shadow:0 4px 24px #14284312}
.marchio{text-decoration:none;display:flex;align-items:center;gap:12px;max-width:100%;line-height:1.1;padding:8px 0;min-width:0;transform-origin:left center;transition:transform .25s ease}
.compatta .marchio{transform:scale(.94)}
.marchio img{width:62px;height:48px;flex-shrink:0}
.marchio-testo{display:flex;flex-direction:column;min-width:0;gap:3px}
.marchio strong{font:700 1.7rem var(--titoli);color:var(--blu)}
.marchio span{font-size:.8rem;color:var(--tenue)}
.menu{display:flex;gap:24px;align-items:center}
.menu a{display:inline-flex;align-items:center;min-height:44px;text-decoration:none;color:var(--blu-scuro);font-size:.85rem;font-weight:600;white-space:nowrap;border-bottom:2px solid transparent;transition:border-color .2s,color .2s}
.menu a:hover{border-bottom-color:var(--verde);color:var(--blu)}
.menu-interruttore{display:none}
.btn{display:inline-block;background:var(--verde-scuro);color:#fff;text-decoration:none;font-weight:600;padding:14px 26px;border-radius:var(--raggio);border:2px solid transparent;cursor:pointer;font:600 1rem var(--corpo);text-align:center;transition:background .2s ease,transform .2s ease,box-shadow .2s ease}
.btn:hover{background:#24521f}
.menu .btn{color:#fff}
.menu .btn:hover{color:#fff}
.btn-piccolo{padding:8px 18px}
.btn-secondario{background:transparent;color:var(--blu);border:2px solid var(--blu)}
.btn-secondario:hover{background:var(--blu);color:#fff}
/* Ritocchi richiesti da Luca, 09/10/2026: griglia a due colonne, ritmo 8px.
   Tutte le schede occupano la stessa cella: anche quelle invisibili riservano
   l'altezza necessaria al testo, senza salti al cambio servizio o all'avvio JS. */
.eroe{position:relative;isolation:isolate;background:var(--blu-scuro);color:#fff;min-height:46rem;display:grid;align-items:center}
.eroe-foto{position:absolute;inset:0;width:100%;height:100%;z-index:-2;object-fit:cover;object-position:center;pointer-events:none}
/* Anche sul pixel bianco la velatura minima al 64% mantiene il testo bianco >4,5:1. */
.eroe::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(20,40,67,.88),rgba(20,40,67,.64))}
.eroe-griglia{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);align-items:center;gap:48px;padding-top:56px;padding-bottom:56px}
.eroe-griglia > div{min-width:0}
.servizi-slider{touch-action:pan-y pinch-zoom}
.servizi-diapositive{display:grid}
.servizio-slide{grid-area:1/1;visibility:hidden;min-width:0;min-height:28rem;padding:24px;display:flex;flex-direction:column;align-items:flex-start;gap:16px;background:var(--fondo-alt);border-top:4px solid var(--verde-scuro);border-radius:var(--raggio)}
.servizio-slide.attiva{visibility:visible}
.servizio-slide h2{margin:0;font-size:2.2rem}
.eroe .servizio-slide p{margin:0;color:var(--testo);font-size:1.1rem}
.servizio-slide .btn{margin-top:auto;width:100%;padding-left:12px;padding-right:12px}
.servizi-controlli{min-height:44px;margin-top:16px} /* 44px: area toccabile richiesta da Luca. */
.eroe h1{color:#fff;font-size:clamp(3.4rem,7.5vw,6.5rem);line-height:1.02;margin:0 0 24px;max-width:12ch}
.eroe p{font-size:1.25rem;max-width:32em;color:#fff}
.eroe-azioni{display:flex;gap:16px;flex-wrap:wrap;margin-top:32px}
.eroe .btn-secondario{color:#fff;border-color:#fff;background:rgba(20,40,67,.4)}
.eroe .btn-secondario:hover{background:#fff;color:var(--blu-scuro)}
.eroe-comandi{display:flex;align-items:center;gap:8px}
.eroe-comandi button{color:#fff;background:var(--blu-scuro);border:1px solid #ffffff80;min-width:44px;min-height:44px;cursor:pointer;border-radius:2px}
.eroe-comandi button:hover{background:var(--verde-scuro)}
.slide-freccia{font-size:2rem;line-height:1}
.slide-indicatori,.sfoglia-indicatori{display:flex;justify-content:center;align-items:center;gap:0}
.eroe-comandi .slide-punto{background:transparent;border:0;position:relative}
.slide-punto::after,.sfoglia-punto::after{content:"";display:block;width:8px;height:8px;border-radius:50%;border:1px solid currentColor;margin:auto;transition:width .2s ease,background .2s ease}
.slide-punto[aria-pressed="true"]::after,.sfoglia-punto[aria-pressed="true"]::after{width:24px;border-radius:8px;background:currentColor}
.slide-pausa{margin-left:auto;font-size:.8rem;font-weight:600;letter-spacing:.06em;text-transform:uppercase;padding:0 16px}
.slide-pausa[aria-pressed="true"]{border-color:#fff;border-width:2px}
.slide-pausa:disabled{cursor:default;opacity:1}
.intestazione{background:var(--blu-scuro);color:#fff;padding:48px 0 56px}
.intestazione h1,.intestazione p,.briciole,.briciole a{color:#fff}
.intestazione h1{max-width:22ch}
.intestazione p{margin-bottom:0;font-size:.95rem}
.briciole{font-size:.9rem}
.briciole a{display:inline-block;padding:4px 0}
.colonne{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:56px;padding-top:56px;padding-bottom:64px}
.testo{min-width:0;display:flow-root;overflow-wrap:break-word}
/* Apertura Chi siamo, richiesta Luca 09/10/2026: testo e fondo della palette
   verificati a 4,5:1 nei test; bordo 4px e spaziature sul ritmo grafico di 8px. */
.testo blockquote{margin:32px 0;padding:24px;border-left:4px solid var(--verde-scuro);background:var(--fondo-alt);color:var(--inchiostro);font-size:1.25rem}
.testo blockquote p:last-child{margin-bottom:0}
.testo h2{margin-top:1.5em}
.testo-home{max-width:900px}
.testo-home > h2:first-child{margin-top:0}
.testo table{border-collapse:collapse;width:100%;display:block;overflow-x:auto}
.testo th,.testo td{border:1px solid var(--bordo);padding:8px 12px;text-align:left}
/* Tabelle dei testi: stile delle pagine impatto acustico e pubblico spettacolo di iltuogeometraroma.it */
.tabella-scorre{overflow-x:auto;margin:22px 0 10px;-webkit-overflow-scrolling:touch}
.tabella-scorre table{display:table;width:100%;min-width:560px;border-collapse:separate;border-spacing:0;font-size:.95rem;line-height:1.5;background:#fff;border:1px solid var(--bordo);border-radius:10px;overflow:hidden}
.tabella-scorre th,.tabella-scorre td{border:0;border-bottom:1px solid var(--bordo);padding:10px 12px;text-align:left;vertical-align:top}
.tabella-scorre thead th{background:var(--blu-scuro);color:#fff;font-weight:600;padding:12px}
.tabella-scorre thead th a{color:#fff}
.tabella-scorre tbody tr:nth-child(odd){background:var(--fondo-alt)}
.tabella-scorre tbody tr:last-child td{border-bottom:0}
.tabella-scorre tbody td:first-child{font-weight:600;color:var(--blu-scuro)}
.tabella-scorre .etichetta{display:inline-block;padding:3px 10px;border-radius:12px;background:#e6f4ea;color:#1e6b34;font-size:.875rem;font-weight:600;white-space:nowrap}
.tabella-scorre .etichetta-costo{background:#fdecd8;color:#8a4b08}
.legale{max-width:820px;padding-top:48px;padding-bottom:64px}
.laterale{position:sticky;top:96px;align-self:start}
.riquadro{background:var(--fondo-alt);border:1px solid var(--bordo);border-top:4px solid var(--blu);border-radius:var(--raggio);padding:24px;margin:28px 0}
.riquadro h2{margin-top:0}
.riquadro ul{padding-left:20px}
.laterale .riquadro{margin-top:0}
.listino{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;margin:40px 0 0}
.carta{position:relative;background:#fff;border:1px solid var(--bordo);border-top:4px solid var(--blu);border-radius:var(--raggio);padding:32px 24px;display:flex;flex-direction:column;gap:12px;box-shadow:0 12px 36px #14284308;transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease}
.carta:nth-child(2){border-top-color:var(--verde-scuro);background:var(--fondo-alt)}
.carta img{margin-bottom:12px}
.carta h3{margin:0;font-size:2rem}
.carta p{margin:0}
.prezzo{font:700 3.2rem var(--titoli);color:var(--blu)}
.prezzo small{font:600 1rem var(--corpo);color:var(--tenue)}
.carta ul{padding-left:1.1em;margin:4px 0 12px;flex:1;font-size:1rem}
.carta li{margin-bottom:8px}
.nota{font-size:.9rem;color:var(--tenue)}
.carta .btn{margin-top:12px;padding-left:12px;padding-right:12px}
.fascia-metodo{background:var(--blu-scuro);color:#fff}
.fascia-metodo h2,.fascia-metodo strong{color:#fff}
.fascia-metodo .foto-larga{max-height:360px;object-fit:cover;margin:32px 0 40px}
.passi{list-style:none;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:32px;counter-reset:passo;margin:0}
.passi li{counter-increment:passo;border-top:1px solid #ffffff60;padding-top:20px;font-size:1rem}
.passi strong{font:600 1.7rem var(--titoli);display:inline-block;margin:12px 0}
.passi li::before{content:"0" counter(passo);font:600 3rem var(--titoli);color:#fff;display:block}
.faq{margin-top:56px}
.faq details{border-bottom:1px solid var(--bordo);padding:20px 0}
.faq summary{font-weight:600;color:var(--inchiostro);cursor:pointer;padding:4px 0}
.faq details p{margin:16px 0 0}
.correlati{padding-top:48px;padding-bottom:64px}
.correlati ul{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;list-style:none;padding:0;margin:32px 0 0}
.correlati li{min-width:0;display:flex}
.correlati a{display:flex;align-items:center;justify-content:space-between;gap:20px;width:100%;border:1px solid var(--bordo);border-bottom:3px solid var(--blu);padding:24px;background:var(--fondo-alt);font:600 1.6rem/1.2 var(--titoli);transition:transform .25s ease,box-shadow .25s ease}
.correlati a::after{content:"\2197";font-family:var(--corpo);text-decoration:none}
.sfoglia-indicatori{display:none}
.sezione-modulo{background:var(--fondo-alt);padding:64px 0;margin-top:0;border-top:1px solid var(--bordo)}
.sezione-modulo h2{margin-top:0}
.sezione-modulo > .contenitore > p{max-width:44em}
.modulo{display:grid;gap:20px;max-width:720px}
.modulo label{font-weight:600;color:var(--inchiostro);display:block;margin-bottom:6px}
.modulo input,.modulo select,.modulo textarea{width:100%;min-width:0;font:inherit;padding:12px;border:1px solid #737e8e;border-radius:var(--raggio);background:#fff;color:var(--inchiostro)}
.modulo textarea{min-height:144px;resize:vertical}
.modulo .consenso{display:flex;gap:12px;font-size:.95rem;font-weight:400;align-items:flex-start}
.modulo .consenso input{width:24px;height:24px;flex-shrink:0;margin-top:2px;accent-color:var(--verde-scuro)}
.hp{position:absolute;left:-5000px}
.modulo-esito{padding:16px;border-radius:var(--raggio);font-weight:600;max-width:720px}
.modulo-esito.ok{background:#e5f2e3;color:var(--verde-scuro)}
.modulo-esito.errore{background:#fbe9e7;color:#8a2a1b}
.modulo-esito.attesa{background:#fff6dd;color:#6b4e00}
.modulo[hidden],.modulo-esito[hidden]{display:none}
.mappa svg{width:100%;height:auto;margin:16px 0}
.mappa a:hover path,.mappa a:focus path{fill:#cfd6ee}
.mappa-fonte{font-size:.8rem;color:var(--tenue);margin:.4em 0 0}
.piede{background:var(--blu-scuro);color:#fff;padding:56px 0 80px;font-size:.95rem}
.piede a{color:#fff}
/* 44px minimi richiesti da Luca il 09/10/2026; icone su griglia SVG 24px. */
.social{display:flex;flex-wrap:wrap;gap:8px}
.social a{display:inline-flex;align-items:center;justify-content:center;min-width:44px;min-height:44px;border:1px solid currentColor;border-radius:var(--raggio)}
.social a:hover{background:var(--verde-scuro)}
.social a:focus-visible{outline-color:#fff}
.social svg{width:24px;height:24px;fill:currentColor}
.piede strong{color:#fff;font-family:var(--titoli);font-size:1.6rem}
.piede-griglia{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:32px}
.piede-griglia > div{min-width:0;overflow-wrap:break-word}
.whatsapp-spazio{height:80px;text-align:center;padding-top:24px}
/* Senza JS resta nel piede. L'osservatore abilita il flottante solo lontano dal modulo. */
.whatsapp{display:inline-block;background:#2f6a2b;color:#fff;font-weight:600;text-decoration:none;padding:12px 18px;border-radius:var(--raggio);box-shadow:0 6px 20px #14284325;z-index:60}
.whatsapp-flottante{position:fixed;right:20px;bottom:20px}
.foto-pagina{width:100%;margin:0 0 24px}
.foto-pagina img,.foto-larga{width:100%;border-radius:var(--raggio)}
.foto-larga{margin:0 0 24px}
.foto-pagina + .foto-pagina{clear:both}
/* Limiti conservati dal Task 10 di Luca del 09/10/2026. */
.foto-verticale{max-width:420px}
.foto-verticale img{max-height:70vh;object-fit:cover}
/* Nessuna opacity:0 persistente: l'animazione nasce solo quando la sezione entra.
   Se JS/IntersectionObserver falliscono, i contenuti restano leggibili. */
@keyframes comparsa{from{opacity:.35;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}
.comparsa{animation:comparsa .6s ease both}
@media (hover:hover) and (prefers-reduced-motion:no-preference){
  .carta:hover,.correlati a:hover{transform:translateY(-6px);box-shadow:0 20px 40px #14284314}
  .btn:hover{transform:translateY(-2px);box-shadow:0 6px 16px #14284325}
}
@media (min-width:900px){
  .foto-verticale{float:right;width:50%;margin:0 0 24px 24px}
  .foto-verticale img{max-height:none}
}
@media (max-width:900px){
  /* Sotto 900px il testo precede i servizi; 72px tengono libero il menu senza JS. */
  .eroe-griglia{grid-template-columns:minmax(0,1fr);gap:32px;padding-top:72px;padding-bottom:40px}
  .servizi-slider{width:100%;max-width:32rem}
  .contenitore{padding-left:20px;padding-right:20px}
  .testata{height:88px}
  .testata-riga{height:88px;padding:0 20px;gap:12px;position:relative}
  .marchio img{width:50px;height:auto}
  .marchio strong{font-size:1.45rem}
  .marchio span{font-size:.7rem}
  /* Senza JS i link restano in una riga sotto il logo. La riga è fuori flusso
     anche prima dell'avvio: l'inizializzazione non cambia l'altezza della testata. */
  .menu{position:absolute;left:0;right:0;top:100%;flex-wrap:nowrap;gap:12px;padding:8px 20px;background:#fff;overflow-x:auto}
  .menu-pronto .menu-interruttore{display:flex;align-items:center;flex-direction:column;justify-content:center;gap:6px;min-height:48px;min-width:56px;background:#fff;color:var(--blu-scuro);border:1px solid var(--bordo);font-size:.7rem;line-height:1;cursor:pointer}
  .menu-icona{width:20px;height:12px;border-top:2px solid currentColor;border-bottom:2px solid currentColor}
  .menu-pronto .menu{display:none;position:absolute;left:0;right:0;top:100%;background:#fff;padding:16px 24px 24px;box-shadow:0 16px 24px #14284316;max-height:calc(100dvh - 88px);overflow-y:auto}
  .menu-pronto .menu.aperto{display:flex;flex-direction:column;align-items:stretch;gap:8px}
  .menu-pronto .menu a{padding:8px 12px}
  .menu-pronto .menu .btn{justify-content:center}
  .sezione{padding-top:56px;padding-bottom:56px}
  .colonne{grid-template-columns:1fr;gap:0;padding-top:32px;padding-bottom:32px}
  .laterale{position:static}
  .laterale .riquadro{margin-top:32px}
  .passi{grid-template-columns:repeat(2,minmax(0,1fr))}
  .piede-griglia{grid-template-columns:1fr}
  .listino{gap:16px}
  .carta{padding:24px 16px}
}
/* 700px: scelta grafica2 per mostrare sul telefono una scheda e il bordo della successiva. */
@media (max-width:700px){
  .eroe h1{font-size:3.5rem}
  .eroe p{font-size:1.1rem}
  .eroe-azioni{flex-direction:column;align-items:flex-start;gap:12px;margin-top:24px}
  .eroe-comandi{gap:0}
  .eroe-comandi .slide-pausa{padding:0 12px}
  /* 72px lasciano spazio anche alla navigazione sempre visibile senza JavaScript. */
  .intestazione{padding:72px 0 40px}
  .passi{gap:24px}
  .passi strong{font-size:1.45rem}
  [data-sfoglia]{display:flex;flex-wrap:nowrap;overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding-inline:0;gap:16px;padding:8px 0 24px;overscroll-behavior-x:contain;scrollbar-width:thin;scrollbar-color:var(--blu) var(--fondo-alt)}
  [data-sfoglia] > *{flex:0 0 88%;min-width:0;scroll-snap-align:start}
  .correlati a{min-height:0}
  .sfoglia-indicatori{display:flex;flex-wrap:wrap;min-height:44px;margin-top:8px}
  .sfoglia-punto{min-width:32px;min-height:44px;padding:0;border:0;background:transparent;color:var(--blu);cursor:pointer}
  .modulo{gap:16px}
  .sezione-modulo{padding:48px 0}
  .whatsapp-flottante{right:16px;bottom:16px}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
}

/* Giro telefono 09/10/2026 (Luca: "scomoda da mobile, Come funziona bruttissima, troppo testo"). */
.listino{align-items:start}
.carta{padding:24px;gap:12px}
.carta-testa{display:grid;grid-template-columns:40px minmax(0,1fr) auto;align-items:center;gap:12px}
.carta-testa img{margin:0}
.carta-testa h3{font-size:1.6rem;line-height:1.1}
.carta-testa .prezzo{margin:0;white-space:nowrap;font-size:1.9rem}
.carta > p{color:var(--testo)}
.carta-dettagli{border-top:1px solid var(--bordo);padding-top:8px}
.carta-dettagli summary{cursor:pointer;min-height:44px;display:flex;align-items:center;font-weight:600;color:var(--blu);list-style:none}
.carta-dettagli summary::-webkit-details-marker{display:none}
.carta-dettagli summary::after{content:"+";margin-left:auto;font-size:1.4rem;line-height:1}
.carta-dettagli[open] summary::after{content:"−"}
.carta-dettagli ul{flex:none;margin:4px 0 8px}
.carta .btn{margin-top:4px;width:100%}
.fascia-metodo{background:var(--fondo-alt);color:var(--testo)}
.fascia-metodo h2,.fascia-metodo strong{color:var(--inchiostro)}
.passi li{border-top:0;padding-top:0;position:relative}
.passi li::before{content:counter(passo);display:flex;align-items:center;justify-content:center;width:52px;height:52px;border-radius:50%;background:var(--blu-scuro);color:#fff;font:600 1.6rem var(--titoli);margin-bottom:12px}
.passi strong{font-size:1.5rem;margin:0 0 4px;display:block}
.sezione-fisarmonica{border-bottom:1px solid var(--bordo)}
.sezione-fisarmonica summary{cursor:pointer;list-style:none;display:flex;align-items:center;gap:16px;min-height:56px}
.sezione-fisarmonica summary::-webkit-details-marker{display:none}
.sezione-fisarmonica summary h2{margin:16px 0;font-size:clamp(1.5rem,2.6vw,2rem)}
.sezione-fisarmonica summary::after{content:"+";margin-left:auto;font-size:1.8rem;color:var(--blu);line-height:1}
.sezione-fisarmonica[open] summary::after{content:"−"}
.sezione-fisarmonica > :not(summary){margin-top:0}
.faq h2{margin-top:48px}
@media (max-width:899px){
  .servizi-slider{display:none}
  .eroe{min-height:0}
  .eroe-griglia{padding-top:48px;padding-bottom:48px}
  .listino{grid-template-columns:minmax(0,1fr)}
}
@media (max-width:700px){
  h1{font-size:2.4rem}
  h2{font-size:1.75rem}
  .eroe h1{font-size:2.6rem;max-width:none}
  .sezione{padding-top:40px;padding-bottom:40px}
  .listino{margin-top:24px}
  .carta{padding:18px 16px}
  .carta-testa{grid-template-columns:32px minmax(0,1fr) auto}
  .carta-testa img{width:32px;height:32px}
  .carta-testa h3{font-size:1.3rem}
  .carta-testa .prezzo{font-size:1.5rem}
  .passi{grid-template-columns:minmax(0,1fr);gap:0;border-left:2px solid var(--bordo);margin-left:20px}
  .passi li{padding:0 0 20px 36px}
  .passi li::before{position:absolute;left:-21px;top:0;width:40px;height:40px;font-size:1.2rem}
  .passi strong{font-size:1.25rem}
  .passi li{font-size:.95rem}
}

/* Pagina costi 09/10/2026 (Luca: "troppo excel, falla carina con schede e swipe"). */
.colonne-piena{grid-template-columns:minmax(0,1fr)}
.colonne-piena .testo{max-width:var(--max);margin:0 auto;width:100%}
.colonne-piena .testo > :is(p,ul,ol,h2,h3,.faq){max-width:760px}
.costi-visivi{margin:0 0 48px}
.costi-visivi > h2{margin-top:0}
.costi-sottotitolo{color:var(--testo);margin:-4px 0 0}
.costi-visivi .listino{margin-top:20px}
.spese{list-style:none;padding:0;margin:20px 0 0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px}
.spesa{position:relative;background:#fff;border:1px solid var(--bordo);border-radius:var(--raggio);padding:24px 20px 20px;display:flex;flex-direction:column;gap:10px;box-shadow:0 12px 36px #14284308;overflow:hidden;transition:transform .25s ease,box-shadow .25s ease}
.spesa::before{content:"";position:absolute;inset:0 0 auto;height:4px;background:var(--verde)}
.spesa-sanzione-tardiva::before{background:#b4532a}
.spesa:hover{transform:translateY(-3px);box-shadow:0 18px 40px #14284314}
.spesa-nome{font-weight:600;color:var(--inchiostro);text-transform:none}
.spesa-importo{font-family:var(--titoli);font-weight:700;font-size:2.4rem;line-height:1;color:var(--blu)}
.spesa p{margin:0;font-size:.95rem}
.spesa-pacchetti{list-style:none;padding:0;margin:auto 0 0;display:flex;flex-wrap:wrap;gap:6px}
.spesa-pacchetti li{font-size:.8rem;font-weight:600;padding:4px 10px;border-radius:999px;background:var(--fondo-alt);color:var(--blu);margin:0}
.spesa-pacchetti li::before{content:none}
@media (prefers-reduced-motion:reduce){.spesa{transition:none}.spesa:hover{transform:none}}
@media (max-width:700px){
  .spese{display:flex;gap:14px}
  .spesa{padding:20px 16px 16px}
  .spesa-importo{font-size:2.1rem}
  .costi-visivi{margin-bottom:32px}
}
@media (min-width:701px) and (max-width:1020px){.spese{grid-template-columns:repeat(2,minmax(0,1fr))}}
.spesa-iva::before{background:var(--blu)}

/* Come funziona animato 09/10/2026: al clic il passo si allarga e mostra la sua immagine. */
.passi.passi-animati{display:flex;gap:16px;height:460px;border:0;margin:24px 0 0;counter-reset:none}
.passi-animati .passo{position:relative;flex:1 1 0;min-width:0;overflow:hidden;border-radius:12px;background:#fff;border:1px solid var(--bordo);padding:0;transition:flex .55s cubic-bezier(.4,0,.2,1),box-shadow .3s ease,border-color .3s ease,transform .3s ease}
.passi-animati .passo::before{content:none}
.passi-animati .passo:not(.attivo):hover{border-color:var(--blu);transform:translateY(-4px);box-shadow:0 14px 30px #14284318}
.passi-animati .passo.attivo{flex:2.6 1 0;border-color:transparent;box-shadow:0 20px 44px #14284330}
.passo-sfondo{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transform:scale(1.08);transition:opacity .6s ease,transform 1.2s ease}
.passo.attivo .passo-sfondo{opacity:1;transform:scale(1)}
.passo::after{content:"";position:absolute;inset:0;background:linear-gradient(to top,#142843f2 0%,#142843d9 34%,#14284326 68%,#14284300 100%);opacity:0;transition:opacity .5s ease;pointer-events:none}
.passo.attivo::after{opacity:1}
.passo-bottone{position:relative;z-index:1;display:flex;flex-direction:column;align-items:flex-start;gap:8px;width:100%;height:100%;padding:24px;border:0;background:transparent;text-align:left;font:inherit;color:var(--testo);cursor:pointer}
.passo-bottone:focus-visible{outline:3px solid var(--verde);outline-offset:-3px;border-radius:12px}
.passo-numero{display:flex;align-items:center;justify-content:center;width:52px;height:52px;border-radius:50%;background:var(--blu-scuro);color:#fff;font:600 1.6rem var(--titoli);margin-bottom:auto;transition:background .3s ease}
.passo-bottone strong{font:600 1.5rem var(--titoli);color:var(--inchiostro);margin:0}
.passo-testo{font-size:.98rem;line-height:1.5}
.passo.attivo .passo-bottone{color:#fff}
.passo.attivo .passo-bottone strong{color:#fff;font-size:1.9rem}
.passo.attivo .passo-numero{background:var(--verde-scuro)}
.passo.attivo .passo-testo{max-width:440px;font-size:1.05rem}
@media (max-width:899px){
  .passi.passi-animati{flex-direction:column;height:auto;margin-left:0;border-left:0;gap:12px}
  .passi-animati .passo{flex:none;padding:0}
  .passi-animati .passo.attivo{flex:none;min-height:400px}
  .passo-bottone{padding:18px 18px 18px 18px;display:grid;grid-template-columns:44px minmax(0,1fr);column-gap:14px;align-content:start}
  .passo-numero{width:44px;height:44px;font-size:1.3rem;margin:0;grid-row:span 2}
  .passo-bottone strong{font-size:1.3rem;align-self:center}
  .passo-testo{grid-column:2;font-size:.95rem}
  .passo.attivo .passo-bottone{align-content:end;min-height:400px}
  .passo.attivo .passo-bottone strong{font-size:1.5rem}
  .passi-animati .passo:not(.attivo):hover{transform:none}
}
@media (prefers-reduced-motion:reduce){.passi-animati .passo,.passo-sfondo,.passo::after{transition:none}.passo-sfondo{transform:none}}

/* Pagina municipi 09/10/2026: mappa in cima, sotto le schede con tutti i quartieri; scheda tutta cliccabile, al passaggio in negativo. */
.mappa svg{margin:0 0 8px}
.municipi-schede{list-style:none;padding:0;margin:16px 0 0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.municipio-scheda{margin:0;padding:0}
.municipio-scheda::before{content:none}
.municipio-scheda > a{display:block;height:100%;box-sizing:border-box;padding:18px;background:#fff;border:1px solid var(--bordo);border-radius:12px;text-decoration:none;color:var(--inchiostro);transition:background .25s ease,border-color .25s ease,box-shadow .25s ease,transform .25s ease,color .25s ease}
.municipio-scheda > a:hover,.municipio-scheda > a:focus-visible{background:var(--blu);border-color:var(--blu);color:#fff;box-shadow:0 12px 28px #14284330;transform:translateY(-2px)}
.municipio-scheda > a:focus-visible{outline:3px solid var(--verde);outline-offset:2px}
.municipio-testa{display:flex;align-items:center;gap:12px}
.municipio-testa strong{font:600 1.25rem var(--titoli);color:inherit}
.municipio-numero{flex:none;display:flex;align-items:center;justify-content:center;min-width:48px;height:48px;padding:0 8px;border-radius:24px;background:var(--blu-scuro);color:#fff;font:700 1.15rem var(--titoli)}
.quartieri-etichette{display:flex;flex-wrap:wrap;gap:6px;margin:12px 0 0}
.quartieri-etichette span{padding:3px 10px;border-radius:999px;background:var(--fondo-alt);font-size:.85rem;color:var(--testo)}
@media (max-width:700px){
  .municipi-schede{grid-template-columns:minmax(0,1fr);gap:0;border-top:1px solid var(--bordo)}
  .municipio-scheda > a{padding:14px 8px;border:0;border-bottom:1px solid var(--bordo);border-radius:0;background:transparent}
  .municipio-scheda > a:hover{box-shadow:none;transform:none}
  .municipio-numero{min-width:40px;height:40px;font-size:1rem}
  .municipio-testa strong{font-size:1.1rem}
  .quartieri-etichette{display:block;margin-top:6px;font-size:.88rem;line-height:1.5;color:inherit}
  .municipio-scheda > a:hover .quartieri-etichette{color:#fff}
  .quartieri-etichette span{padding:0;background:none;font-size:inherit;color:inherit}
  .quartieri-etichette span:not(:last-child)::after{content:", "}
}
@media (prefers-reduced-motion:reduce){.municipio-scheda > a{transition:none}.municipio-scheda > a:hover{transform:none}}
@media (max-width:700px){.mappa text{font-size:26px;stroke-width:5px}}

/* Municipi 09/10/2026: sagoma di ogni municipio accanto al numero (computer e telefono).
   Sul telefono le righe entrano e escono in 3D seguendo lo scorrimento, nei due versi; la mappa si inclina. */
.municipio-sagoma{flex:none;width:52px;height:52px;fill:#e8ecf7;stroke:var(--blu);stroke-width:1.5;vector-effect:non-scaling-stroke;filter:drop-shadow(0 4px 5px #14284326);transition:fill .25s ease,stroke .25s ease,transform .4s ease}
.municipio-scheda > a:hover .municipio-sagoma,.municipio-scheda > a:focus-visible .municipio-sagoma{fill:#fff;stroke:#fff;transform:rotate(-6deg) scale(1.08)}
@media (max-width:700px){
  .municipio-sagoma{width:56px;height:56px}
  .municipio-testa{gap:10px}
  @supports (animation-timeline:view()){
    .municipio-scheda{animation:riga-entra linear both,riga-esce linear both;animation-timeline:view(),view();animation-range:entry 0% cover 30%,exit 10% exit 100%;transform-origin:50% 0}
    .municipio-scheda > a{animation:riga-colore linear both;animation-timeline:view();animation-range:entry 20% cover 45%}
    .municipio-sagoma{animation:sagoma-gira linear both;animation-timeline:view();animation-range:entry 0% cover 40%}
    .mappa svg{transform-origin:50% 100%;animation:mappa-vola linear both;animation-timeline:view();animation-range:exit -10% exit 90%}
  }
  @keyframes riga-entra{from{opacity:0;transform:perspective(700px) rotateX(-75deg) translateY(50px) scale(.88)}to{opacity:1;transform:perspective(700px) rotateX(0) translateY(0) scale(1)}}
  @keyframes riga-esce{from{opacity:1;transform:perspective(700px) rotateX(0) scale(1)}to{opacity:0;transform:perspective(700px) rotateX(70deg) scale(.9)}}
  @keyframes riga-colore{0%{background:var(--blu);color:#fff}55%{background:var(--blu);color:#fff}100%{background:transparent;color:var(--inchiostro)}}
  @keyframes sagoma-gira{from{transform:perspective(400px) rotateY(-200deg) rotateX(45deg) scale(.5);fill:var(--blu);stroke:#fff}60%{fill:var(--blu)}to{transform:none;fill:#e8ecf7;stroke:var(--blu)}}
  @keyframes mappa-vola{from{transform:none;opacity:1}to{transform:perspective(1000px) rotateX(58deg) scale(.82) translateY(-30px);opacity:.25}}
  /* Browser senza animazioni legate allo scorrimento: entrata e uscita con le classi messe da sito.js. */
  @supports not (animation-timeline:view()){
    [data-comparsa].attiva .municipio-scheda{opacity:0;transform:perspective(700px) rotateX(-70deg) translateY(40px) scale(.9);transform-origin:50% 0;transition:opacity .5s ease,transform .7s cubic-bezier(.2,.8,.2,1)}
    [data-comparsa].attiva .municipio-scheda > a{background:var(--blu);color:#fff;transition:background .9s ease .35s,color .9s ease .35s}
    [data-comparsa].attiva .municipio-scheda .municipio-sagoma{transform:perspective(400px) rotateY(-200deg) scale(.5);transition:transform 1s cubic-bezier(.2,.8,.2,1) .1s}
    [data-comparsa].attiva .municipio-scheda.visibile{opacity:1;transform:none}
    [data-comparsa].attiva .municipio-scheda.visibile > a{background:transparent;color:var(--inchiostro)}
    [data-comparsa].attiva .municipio-scheda.visibile .municipio-sagoma{transform:none}
  }
}
@media (max-width:700px) and (prefers-reduced-motion:reduce){
  .municipio-scheda,.municipio-scheda > a,.municipio-sagoma,.mappa svg{animation:none!important}
  [data-comparsa].attiva .municipio-scheda,[data-comparsa].attiva .municipio-scheda > a,[data-comparsa].attiva .municipio-scheda .municipio-sagoma{opacity:1;transform:none;background:transparent;transition:none}
}

/* Tabella "compreso / non compreso" 09/10/2026: stessa in pacchetti, costi e direzione lavori. */
.confronto{margin:40px 0}
.confronto-scorri{overflow-x:auto}
.confronto table{display:table;width:100%;border-collapse:separate;border-spacing:0;font-size:.95rem;background:#fff;border:1px solid var(--bordo);border-radius:12px;overflow:hidden}
.confronto th,.confronto td{border:0;border-bottom:1px solid var(--bordo);padding:10px 12px;text-align:center;vertical-align:middle}
.confronto tr:last-child th,.confronto tr:last-child td{border-bottom:0}
.confronto thead th{background:var(--blu);color:#fff;font:600 1rem var(--titoli)}
.confronto thead th a{color:#fff}
.confronto tbody th{text-align:left;font-weight:600;color:var(--inchiostro)}
.confronto td{font-weight:600;white-space:nowrap}
.confronto-si{color:var(--verde-scuro)}
.confronto-si::before{content:"✓ "}
.confronto-a-parte{color:#8a4b12}
.confronto-non-serve{color:var(--tenue);font-weight:400}
.confronto-nota{font-size:.95rem;margin-top:12px}
@media (max-width:700px){.confronto table{font-size:.82rem}.confronto th,.confronto td{padding:8px 6px}.confronto td{white-space:normal}}
.spese.totali{grid-template-columns:repeat(3,minmax(0,1fr))}
.spesa-totale::before{background:var(--blu)}
.totale-voci{list-style:none;padding:0;margin:0;font-size:.9rem;color:var(--testo)}
.totale-voci li{margin:2px 0}
.totale-voci li::before{content:none}
.spesa-link{font-weight:600;margin-top:auto}
@media (min-width:701px) and (max-width:1020px){.spese.totali{grid-template-columns:minmax(0,1fr)}}

/* Invito a metà pagina e casi comuni nei municipi (proposta SEO 09/10/2026). */
.invito-meta{margin:32px 0;padding:20px 22px;background:var(--fondo-alt);border-left:4px solid var(--verde-scuro);border-radius:var(--raggio)}
.invito-meta p{margin:0}
.invito-azioni{display:flex;flex-wrap:wrap;gap:10px;margin-top:12px!important}
.invito-azioni .btn{padding:10px 18px}
.casi-comuni ul{list-style:none;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.casi-comuni li{margin:0}
.casi-comuni li::before{content:none}
.casi-comuni a{display:inline-block;padding:6px 14px;border:1px solid var(--bordo);border-radius:999px;text-decoration:none;color:var(--blu);font-weight:600;font-size:.92rem;transition:background .2s ease,color .2s ease}
.casi-comuni a:hover,.casi-comuni a:focus-visible{background:var(--blu);color:#fff;border-color:var(--blu)}

/* Configuratore del costo (piano 2026-10-09-configuratore-zone). Altezza riservata: il form compare senza spostare la pagina. */
.configuratore{position:relative;margin:0 0 48px;padding:28px;background:#fff;border:1px solid var(--bordo);border-top:4px solid var(--verde-scuro);border-radius:12px;box-shadow:0 16px 40px #14284314;display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);grid-template-rows:auto 1fr;gap:8px 32px;align-content:start}
.configuratore > h2{grid-column:1/-1;margin:0 0 4px}
.configuratore-ripiego{grid-column:1/-1;margin:0}
.conf-tipo{border:0;padding:0;margin:0 0 16px;display:grid;gap:10px;min-width:0}
.conf-tipo legend{font-weight:600;color:var(--inchiostro);margin-bottom:8px;padding:0}
.conf-scelta{display:flex;gap:12px;align-items:flex-start;padding:12px 14px;border:1px solid var(--bordo);border-radius:10px;cursor:pointer;min-height:44px;transition:border-color .2s ease,background .2s ease}
.conf-scelta:has(input:checked){border-color:var(--blu);background:#eef0fa}
.conf-scelta input{margin-top:4px;accent-color:var(--blu);width:20px;height:20px;flex:none}
.conf-scelta span{display:flex;flex-direction:column}
.conf-scelta small{color:var(--tenue)}
.conf-campi{display:grid;grid-template-columns:1fr 1fr;gap:12px;align-items:start}
.conf-campo{display:flex;flex-direction:column;gap:6px}
.conf-campo label{font-weight:600;color:var(--inchiostro);font-size:.95rem}
.conf-campo input{font:inherit;padding:10px 12px;border:1.5px solid var(--bordo);border-radius:8px;min-height:44px;width:100%;box-sizing:border-box}
.conf-campo input:focus{outline:3px solid #26348b40;border-color:var(--blu)}
.conf-campo input[aria-invalid="true"]{border-color:#a3341c}
.conf-campo small{color:var(--tenue);font-size:.82rem}
.conf-campo .conf-errore{color:#a3341c;font-weight:600}
.conf-risultato{background:var(--blu);color:#fff;border-radius:12px;padding:22px 22px 18px;align-self:start}
.conf-etichetta{margin:0;font-size:.9rem}
.conf-totale{margin:2px 0 12px;font:700 2.8rem/1 var(--titoli)}
.conf-voci{list-style:none;padding:0;margin:0 0 12px;font-size:.92rem}
.conf-voci li{display:flex;justify-content:space-between;gap:12px;padding:6px 0;border-bottom:1px solid #ffffff40;margin:0}
.conf-voci li::before{content:none}
.conf-nota,.conf-avviso-lieve{margin:0;font-size:.85rem}
.conf-avviso-lieve{margin-bottom:8px}
.conf-nota a{color:#fff;font-weight:600}
.conf-avviso{margin:0;font-weight:600}
.conf-annuncio{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
@media (max-width:899px){
  .configuratore{grid-template-columns:minmax(0,1fr);padding:20px}
  .conf-campi{grid-template-columns:minmax(0,1fr)}
}

/* Zone servite più spesso (municipi VIII, IX, XI, XII): colore più intenso e contorno tratteggiato, legenda testuale. */
.mappa a.zona-servita path{fill:#c9d3f0;stroke-dasharray:7 4;stroke-width:2.2}
.mappa a.zona-servita:hover path,.mappa a.zona-servita:focus path{fill:#b3c1ea}
.mappa-legenda{display:flex;align-items:center;gap:8px;margin:4px 0 0;font-size:.92rem;color:var(--inchiostro);font-weight:600}
.legenda-zona{display:inline-block;width:22px;height:14px;background:#c9d3f0;border:2px dashed var(--blu);border-radius:3px;flex:none}
.etichetta-servito{margin-left:auto;padding:3px 10px;border-radius:999px;background:var(--verde-scuro);color:#fff;font-size:.78rem;font-weight:600;white-space:nowrap}
.municipio-scheda > a:hover .etichetta-servito{background:#fff;color:var(--blu)}
@media (max-width:700px){.etichetta-servito{font-size:.72rem;padding:2px 8px}}
.conf-detraibile{display:flex;justify-content:space-between;gap:12px;margin:0 0 12px;padding:8px 10px;border-radius:8px;background:#ffffff1f;font-weight:600;font-size:.92rem}
.conf-nota-detrazione{grid-column:1/-1;margin:8px 0 0;font-size:.85rem;color:var(--testo);line-height:1.5}
.configuratore > noscript{grid-column:1/-1}

/* Telefono (10/10/2026, Luca: "adatta meglio il sito alla versione mobile"): le guide correlate su tre colonne
   strette spezzavano i titoli e allargavano la pagina, spingendo fuori schermo banner cookie e WhatsApp. */
@media (max-width:900px){
  .correlati ul{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
  .correlati a{font-size:1.3rem;padding:20px}
}
@media (max-width:560px){
  .correlati ul{grid-template-columns:minmax(0,1fr);gap:12px;margin-top:24px}
  .correlati a{font-size:1.2rem;padding:16px 20px;overflow-wrap:anywhere}
}

/* Test "Ti serve la CILA?" (piano 2026-10-10-test-serve-la-cila): stesso linguaggio del configuratore. */
.test-cila{position:relative;margin:8px 0 48px;padding:28px;background:#fff;border:1px solid var(--bordo);border-top:4px solid var(--verde-scuro);border-radius:12px;box-shadow:0 16px 40px #14284314}
.test-cila > h2{margin:0 0 4px}
.tc-intro{margin:0 0 20px;color:var(--testo)}
.tc-form{display:grid;gap:20px}
.tc-domanda{border:0;padding:0;margin:0;display:grid;gap:10px;min-width:0}
.tc-domanda legend{font-weight:600;color:var(--inchiostro);margin-bottom:8px;padding:0;font-size:1.05rem}
.tc-stato,.tc-conferma{grid-template-columns:repeat(3,minmax(0,1fr))}
.tc-conferma{grid-template-columns:repeat(2,minmax(0,140px))}
.tc-scelta{display:flex;gap:12px;align-items:flex-start;padding:12px 14px;border:1px solid var(--bordo);border-radius:10px;cursor:pointer;min-height:44px;transition:border-color .2s ease,background .2s ease}
.tc-scelta:has(input:checked){border-color:var(--blu);background:#eef0fa}
.tc-scelta input{margin-top:3px;accent-color:var(--blu);width:20px;height:20px;flex:none}
.tc-altro{margin:4px 0 0;font-size:.9rem;color:var(--tenue)}
.tc-ripiego{margin:0}
.tc-messaggio{margin:16px 0 0;font-weight:600;color:#a3341c}
.tc-esito{margin-top:24px;padding-top:20px;border-top:1px solid var(--bordo)}
.tc-titolo{margin:0 0 8px;font-size:1.6rem}
.tc-testo{margin:0 0 16px}
.tc-costo{background:var(--blu);color:#fff;border-radius:12px;padding:22px 22px 18px;margin-bottom:16px}
.tc-totale-etichetta{margin:0;font-size:.9rem}
.tc-totale{margin:2px 0 12px;font:700 2.8rem/1 var(--titoli)}
.tc-voci{list-style:none;padding:0;margin:0 0 12px;font-size:.92rem}
.tc-voci li{display:flex;justify-content:space-between;gap:12px;padding:6px 0;border-bottom:1px solid #ffffff40;margin:0}
.tc-voci li::before{content:none}
.tc-detraibile{display:flex;justify-content:space-between;gap:12px;margin:0 0 12px;padding:8px 10px;border-radius:8px;background:#ffffff1f;font-weight:600;font-size:.92rem}
.tc-superficie{display:flex;flex-direction:column;gap:6px;margin:0 0 12px}
.tc-superficie label{font-weight:600;font-size:.9rem}
.tc-superficie input{font:inherit;padding:10px 12px;border:1.5px solid #ffffff80;border-radius:8px;min-height:44px;max-width:220px;box-sizing:border-box}
.tc-superficie input[aria-invalid="true"]{border-color:#ffb4a3}
.tc-errore{color:#ffd9cf;font-weight:600}
.tc-nota{margin:0;font-size:.85rem}
.tc-nota a{color:#fff;font-weight:600}
.tc-nota-detrazione{margin:12px 0 0;font-size:.8rem;color:#ffffffd9}
.tc-nota-detrazione a{color:#fff}
.tc-azioni{display:flex;flex-wrap:wrap;gap:12px;margin:0}
.tc-annuncio{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
@media (max-width:700px){
  .test-cila{padding:20px 16px}
  .tc-stato{grid-template-columns:minmax(0,1fr)}
  .tc-totale{font-size:2.3rem}
  .tc-azioni .btn{width:100%;justify-content:center}
}