/* Madeo Impianti - foglio di stile del tema.
   Token e componenti dal design system, direzione "Documentazione tecnica".
   I valori dei token sono allineati al design system: non modificarli qui. */
/* Caratteri ospitati sul nostro server: nessuna richiesta a Google,
   nessun trasferimento dell'indirizzo IP dei visitatori a terzi.
   IBM Plex Sans e IBM Plex Mono, licenza SIL Open Font License 1.1. */
@font-face{font-family:"IBM Plex Sans";font-style:normal;font-weight:400;font-display:swap;src:url("../font/ibm-plex-sans-latin-400-normal.woff2") format("woff2")}
@font-face{font-family:"IBM Plex Sans";font-style:normal;font-weight:500;font-display:swap;src:url("../font/ibm-plex-sans-latin-500-normal.woff2") format("woff2")}
@font-face{font-family:"IBM Plex Sans";font-style:normal;font-weight:600;font-display:swap;src:url("../font/ibm-plex-sans-latin-600-normal.woff2") format("woff2")}
@font-face{font-family:"IBM Plex Mono";font-style:normal;font-weight:400;font-display:swap;src:url("../font/ibm-plex-mono-latin-400-normal.woff2") format("woff2")}
@font-face{font-family:"IBM Plex Mono";font-style:normal;font-weight:500;font-display:swap;src:url("../font/ibm-plex-mono-latin-500-normal.woff2") format("woff2")}

:root{
--brand-700:#003b71;--brand-800:#002b53;--brand-900:#001e3c;--brand-100:#e8eff6;
--ink-900:#10151b;--ink-600:#4d6478;--ink-400:#5f7386;
--surface-000:#ffffff;--surface-100:#f2f4f7;--surface-200:#e6eaf0;
--border-300:#d6dbe1;--border-500:#8d9aa8;
--accent-500:#ffcc00;--accent-900:#5c4a00;
--success-600:#0f7a4d;--success-100:#e4f2ea;--danger-600:#b3261e;
--space-05:4px;--space-1:8px;--space-2:16px;--space-3:24px;--space-4:32px;--space-5:48px;--space-6:64px;--space-7:96px;
--radius-sm:3px;--radius-md:6px;--radius-lg:10px;
--shadow-focus:0 0 0 2px #ffcc00,0 0 0 4px #10151b;
--font-sans:"IBM Plex Sans",system-ui,-apple-system,"Segoe UI",sans-serif;
--font-mono:"IBM Plex Mono",ui-monospace,SFMono-Regular,Menlo,monospace;
--container:1200px;--prose:680px;
box-sizing:border-box;color-scheme:light;
padding-top:env(safe-area-inset-top,0px);
}
*,*::before,*::after{box-sizing:inherit}
html{scroll-padding-top:calc(80px + env(safe-area-inset-top,0px));-webkit-text-size-adjust:100%}
body{margin:0;background:var(--surface-000);color:var(--ink-900);font:400 16px/26px var(--font-sans);
padding-bottom:calc(56px + env(safe-area-inset-bottom,0px))}
img{max-width:100%;height:auto}
h1,h2,h3,h4{margin:0 0 var(--space-2);font-weight:600;letter-spacing:-.01em}
h1{font-size:31px;line-height:40px}
h2{font-size:25px;line-height:32px}
h3{font-size:20px;line-height:28px}
h4{font-size:16px;line-height:24px}
p{margin:0 0 var(--space-2)}
a{color:var(--brand-700)}
:focus-visible{outline:none;box-shadow:var(--shadow-focus);border-radius:var(--radius-sm)}
.salta{position:absolute;left:-9999px}
.salta:focus{left:var(--space-2);top:var(--space-2);z-index:60;background:var(--surface-000);padding:var(--space-1) var(--space-2);border:1px solid var(--ink-900)}
.cnt{max-width:var(--container);margin:0 auto;padding:0 var(--space-2)}
.prosa{max-width:var(--prose)}
.sez--testata{padding-bottom:var(--space-4)}
.sez{padding:var(--space-6) 0}
.sez--tinta{background:var(--surface-100)}
.sez--scura{background:var(--brand-900);color:#fff}
.sez--scura h2,.sez--scura h3{color:#fff}
.dato{font-family:var(--font-mono);font-weight:500}
.meta{font:400 13px/20px var(--font-mono);color:var(--ink-400);margin:0 0 var(--space-05)}
.didascalia{font:400 13px/20px var(--font-sans);color:var(--ink-400);margin:var(--space-1) 0 0;border-left:2px solid var(--accent-500);padding-left:var(--space-1)}

header.top{position:sticky;top:env(safe-area-inset-top,0px);z-index:40;background:var(--surface-000);border-bottom:1px solid transparent}
header.top.scr{border-bottom-color:var(--border-300)}
.top .cnt{display:flex;align-items:center;gap:var(--space-2);height:64px}
.marchio{display:block;flex:none}
.marchio img{display:block;width:auto;height:34px}
.menu-btn{margin-left:auto;display:flex;align-items:center;gap:var(--space-1);height:44px;padding:0 var(--space-1);background:none;border:0;font:500 14px/22px var(--font-sans);color:var(--ink-900);cursor:pointer}
.menu-btn .barre{width:22px;height:2px;background:var(--ink-900);position:relative;display:block}
.menu-btn .barre::before,.menu-btn .barre::after{content:"";position:absolute;left:0;width:22px;height:2px;background:var(--ink-900)}
.menu-btn .barre::before{top:-7px}.menu-btn .barre::after{top:7px}
nav.nv{display:none}
nav.nv a{font:400 15px/22px var(--font-sans);color:var(--ink-900);text-decoration:none;padding:var(--space-1) 0;border-bottom:2px solid transparent}
nav.nv a:hover{border-bottom-color:var(--border-500)}
nav.nv a[aria-current="page"]{border-bottom-color:var(--accent-500);font-weight:500}
.top-azioni{display:none}
#pannello{display:none;border-top:1px solid var(--border-300);background:var(--surface-000)}
#pannello.ap{display:block}
#pannello a{display:block;padding:var(--space-2);border-bottom:1px solid var(--border-300);color:var(--ink-900);text-decoration:none;font-weight:500}

/* [hidden] deve battere qualunque display dichiarato dopo: senza questa riga
   i bottoni nascosti via JS restano visibili. */
[hidden]{display:none !important}
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:0 var(--space-3);border-radius:var(--radius-sm);border:1px solid transparent;font:500 15px/22px var(--font-sans);text-decoration:none;cursor:pointer;text-align:center}
.btn--p{background:var(--brand-700);color:#fff}
.btn--p:hover{background:var(--brand-800)}
.btn--s{background:var(--surface-000);color:var(--ink-900);border-color:var(--border-500)}
.btn--s:hover{background:var(--surface-100);border-color:var(--ink-900)}
.btn--chiaro{background:none;color:#fff;border-color:#69819b}
.btn--chiaro:hover{background:#0a2f56}
.azioni{display:flex;flex-wrap:wrap;gap:var(--space-2);margin-top:var(--space-3)}

.hero{padding:var(--space-5) 0 var(--space-6)}
.hero h1{font-size:34px;line-height:42px;letter-spacing:-.02em;max-width:14ch}
.hero .occhio{font:400 15px/24px var(--font-mono);color:var(--brand-700);margin:0 0 var(--space-2)}
.hero p.sommario{font-size:18px;line-height:30px;color:var(--ink-600);max-width:56ch}
.credenziali{margin-top:var(--space-5);border-top:1px solid var(--border-300);display:grid;gap:0}
.credenziali div{border-bottom:1px solid var(--border-300);padding:var(--space-2) 0}
.credenziali dt{font:400 13px/20px var(--font-mono);color:var(--ink-400)}
.credenziali dd{margin:0;font:500 15px/24px var(--font-sans)}

.porte{display:grid;gap:var(--space-2)}
.porta{display:block;background:var(--surface-000);border:1px solid var(--border-300);border-radius:var(--radius-md);padding:var(--space-3);text-decoration:none;color:inherit}
.porta:hover{border-color:var(--border-500)}
.porta h3{color:var(--brand-700)}
.porta:hover h3{text-decoration:underline;text-underline-offset:3px}
.porta p{color:var(--ink-600);margin:0}

.servizi{display:grid;gap:var(--space-3);margin-top:var(--space-4)}
.servizio{border-top:2px solid var(--brand-700);padding-top:var(--space-2)}
.servizio a{text-decoration:none}
.servizio:hover a,.servizio a:hover,.servizio a:focus-visible{text-decoration:underline;text-underline-offset:3px}
.servizio h2,.servizio h3{font-size:18px;line-height:26px;margin-bottom:var(--space-05)}
.servizio p{color:var(--ink-600);margin:0}

/* Segnaposto per le foto mancanti. Vale solo sui div: scritta ".foto" e basta,
   questa regola metteva 16px di bordo interno anche dentro ogni <img class="foto">. */
div.foto{background:var(--brand-900);position:relative;display:flex;align-items:flex-end;padding:var(--space-2);
background-image:radial-gradient(var(--brand-700) 1.5px,transparent 1.5px);background-size:24px 24px}
div.foto span{font:400 12px/18px var(--font-mono);color:#8fa6bd}
.foto--32{aspect-ratio:3/2}
.foto--169{aspect-ratio:16/9}
.foto--45{aspect-ratio:4/5}
img.foto{display:block;width:100%;height:auto;padding:0;object-fit:cover;background:var(--surface-200)}
img.foto--32{aspect-ratio:3/2}
img.foto--169{aspect-ratio:16/9}
img.foto--45{aspect-ratio:4/5}

.lavori{display:grid;gap:var(--space-3);margin-top:var(--space-4)}
.lavoro{background:var(--surface-000);border:1px solid var(--border-300);border-radius:var(--radius-md);overflow:hidden;text-decoration:none;color:inherit;display:block}
.lavoro:hover{border-color:var(--border-500)}
.lavoro .corpo{padding:var(--space-3)}
.lavoro h3{font-size:18px;line-height:26px}
.lavoro:hover h3{color:var(--brand-700);text-decoration:underline;text-underline-offset:3px}
.lavoro p{color:var(--ink-600);margin:0;font-size:15px;line-height:24px}

.passi{counter-reset:p;margin:var(--space-4) 0 0;padding:0;list-style:none;border-top:1px solid var(--border-300)}
.passi li{counter-increment:p;border-bottom:1px solid var(--border-300);padding:var(--space-3) 0 var(--space-3) 44px;position:relative}
.passi li::before{content:counter(p);position:absolute;left:0;top:var(--space-3);width:28px;height:28px;border:1px solid var(--brand-700);border-radius:50%;display:flex;align-items:center;justify-content:center;font:500 14px/1 var(--font-mono);color:var(--brand-700)}
.passi h3{font-size:17px;line-height:24px;margin-bottom:var(--space-05)}
.passi p{margin:0;color:var(--ink-600)}

.tabella{width:100%;border-collapse:collapse;border-top:1px solid var(--border-300)}
.tabella th,.tabella td{text-align:left;border-bottom:1px solid var(--border-300);padding:var(--space-1) var(--space-2) var(--space-1) 0;vertical-align:baseline}
.tabella th{font:400 13px/20px var(--font-mono);color:var(--ink-400);font-weight:400;width:45%}
.tabella td{font:500 15px/24px var(--font-mono)}

.faq{border-top:1px solid var(--border-300);margin-top:var(--space-4)}
.faq details{border-bottom:1px solid var(--border-300)}
.faq summary{padding:var(--space-2) 0;font-weight:500;cursor:pointer;list-style:none;display:flex;justify-content:space-between;gap:var(--space-2)}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";font-family:var(--font-mono);color:var(--brand-700)}
.faq details[open] summary::after{content:"–"}
.faq p{color:var(--ink-600);padding-bottom:var(--space-2);margin:0;max-width:var(--prose)}

form .campo{margin-bottom:var(--space-3)}
form label,legend.et{display:block;font:500 15px/22px var(--font-sans);margin-bottom:var(--space-05)}
.facolt{font-weight:400;color:var(--ink-400)}
input[type=text],input[type=tel],input[type=email],select,textarea{width:100%;min-height:48px;padding:11px var(--space-2);font:400 16px/24px var(--font-sans);color:var(--ink-900);background:var(--surface-000);border:1px solid var(--border-500);border-radius:var(--radius-sm)}
textarea{min-height:112px;resize:vertical}
input::placeholder,textarea::placeholder{color:var(--ink-400)}
.aiuto{font:400 13px/20px var(--font-sans);color:var(--ink-400);margin:var(--space-05) 0 0}
.errore{font:400 14px/22px var(--font-sans);color:var(--danger-600);margin:var(--space-05) 0 0;display:none}
.campo.ko input,.campo.ko select,.campo.ko textarea{border-color:var(--danger-600);border-width:2px}
.campo.ko .errore{display:block}
fieldset{border:0;padding:0;margin:0 0 var(--space-3)}
.scelte{display:grid;gap:var(--space-1)}
.scelta{display:flex;gap:var(--space-2);align-items:flex-start;border:1px solid var(--border-300);border-radius:var(--radius-sm);padding:var(--space-2);cursor:pointer}
.scelta:hover{border-color:var(--border-500)}
.scelta input{margin:2px 0 0;width:20px;height:20px;flex:none}
.scelta b{display:block;font-weight:500}
.scelta small{color:var(--ink-600);font-size:14px;line-height:22px}
.consenso{display:flex;gap:var(--space-2);align-items:flex-start;margin-bottom:var(--space-3)}
.consenso input{width:20px;height:20px;margin:3px 0 0;flex:none}
.consenso span{font-size:14px;line-height:22px;color:var(--ink-600)}
.esito{background:var(--success-100);color:var(--success-600);border-radius:var(--radius-md);padding:var(--space-2);margin-top:var(--space-2)}
.passo-i{font:400 13px/20px var(--font-mono);color:var(--ink-400);margin-bottom:var(--space-1)}
.riquadro{background:var(--surface-000);border:1px solid var(--border-300);border-radius:var(--radius-lg);padding:var(--space-3)}

.barra{position:fixed;left:0;right:0;bottom:0;z-index:50;display:grid;grid-template-columns:1fr 1fr 1fr;background:var(--surface-000);border-top:1px solid var(--border-300);padding-bottom:env(safe-area-inset-bottom,0px)}
.barra a{display:flex;align-items:center;justify-content:center;height:56px;font:500 15px/22px var(--font-sans);color:var(--ink-900);text-decoration:none;border-right:1px solid var(--border-300)}
.barra a:last-child{border-right:0;background:var(--brand-700);color:#fff}

footer.pie{background:var(--brand-900);color:#c3ccd4;padding:var(--space-6) 0 var(--space-4);font-size:15px;line-height:24px}
footer.pie a{color:#fff}
footer.pie h2{font-size:16px;line-height:24px;color:#fff;margin-bottom:var(--space-1)}
.pie-griglia{display:grid;gap:var(--space-4)}
.pie-legale{margin-top:var(--space-4);padding-top:var(--space-2);border-top:1px solid #10406e;font:400 13px/22px var(--font-sans);color:#9fb0c2}
.pie-marchio{display:block;width:auto;height:40px;margin-bottom:var(--space-2)}

@media (min-width:600px){
.porte,.lavori{grid-template-columns:repeat(2,minmax(0,1fr))}
.servizi{grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-3) var(--space-4)}
.credenziali{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:var(--space-4)}
.hero h1{font-size:44px;line-height:52px}
}
@media (min-width:1024px){
.cnt{padding:0 var(--space-3)}
.sez{padding:var(--space-7) 0}
body{padding-bottom:0}
.barra,.menu-btn,#pannello{display:none}
nav.nv{display:flex;gap:var(--space-3);margin-left:auto}
.top-azioni{display:flex;align-items:center;gap:var(--space-2);margin-left:var(--space-3)}
.top .cnt{height:88px}
.marchio img{height:48px}
.top-azioni .tel{font:500 15px/22px var(--font-sans);color:var(--brand-700);text-decoration:none;white-space:nowrap}
.top-azioni .btn{min-height:44px;padding:0 var(--space-2)}
.porte{grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--space-3)}
.servizi,.lavori{grid-template-columns:repeat(3,minmax(0,1fr))}
.hero h1{font-size:49px;line-height:56px}
.due{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:var(--space-6);align-items:start}
.pie-griglia{grid-template-columns:1.6fr 1fr 1fr 1fr}
h1{font-size:39px;line-height:48px}
h2{font-size:31px;line-height:40px}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}

/* --- Aggiunte del tema rispetto al prototipo --- */

/* Filtri dell'indice lavori */
.filtri{display:flex;flex-wrap:wrap;gap:var(--space-1);margin:var(--space-3) 0 var(--space-4)}
.filtro{display:inline-flex;align-items:center;min-height:40px;padding:0 var(--space-2);border:1px solid var(--border-300);border-radius:var(--radius-pill,999px);font:400 14px/22px var(--font-sans);color:var(--ink-900);text-decoration:none}
.filtro:hover{border-color:var(--border-500)}
.filtro--on{background:var(--brand-700);border-color:var(--brand-700);color:#fff;font-weight:500}

/* Messaggio di errore dopo un invio non riuscito */
.esito--ko{background:var(--danger-100,#fbeae9);color:var(--danger-600)}

/* Contenuto scritto nell'editor a blocchi */
.madeo-testo h2{margin-top:var(--space-5)}
.madeo-testo h2:first-child{margin-top:0}
.madeo-testo h3{margin-top:var(--space-4);font-size:18px;line-height:26px}
.madeo-testo ul,.madeo-testo ol{padding-left:20px;margin:0 0 var(--space-2)}
.madeo-testo li{margin-bottom:var(--space-05)}
.madeo-testo table{width:100%;border-collapse:collapse;border-top:1px solid var(--border-300);margin-bottom:var(--space-3)}
.madeo-testo td,.madeo-testo th{text-align:left;border-bottom:1px solid var(--border-300);padding:var(--space-1) var(--space-2) var(--space-1) 0}
.madeo-testo figcaption{font:400 13px/20px var(--font-sans);color:var(--ink-400);border-left:2px solid var(--accent-500);padding-left:var(--space-1);margin-top:var(--space-1)}
.madeo-testo img{border-radius:var(--radius-md)}

/* Paginazione */
.pagination{display:flex;gap:var(--space-1);flex-wrap:wrap;margin-top:var(--space-4)}
.pagination .page-numbers{display:inline-flex;align-items:center;justify-content:center;min-width:44px;height:44px;padding:0 var(--space-1);border:1px solid var(--border-300);border-radius:var(--radius-sm);text-decoration:none;color:var(--ink-900);font:500 14px/22px var(--font-sans)}
.pagination .current{background:var(--brand-700);border-color:var(--brand-700);color:#fff}

/* Voci di menu generate da WordPress */
nav.nv li{list-style:none;display:inline-block}
nav.nv ul{display:flex;gap:var(--space-3);margin:0;padding:0}
.pie-legale li{list-style:none;display:inline-block;margin-left:var(--space-2)}
.pie-legale ul{display:inline;padding:0;margin:0}

/* Hero su due colonne con fotografia */
.hero-foto{margin-top:var(--space-4)}
img.foto{display:block;width:100%;height:auto;padding:0;object-fit:cover;background:var(--surface-200)}
img.foto--32{aspect-ratio:3/2}
img.foto--169{aspect-ratio:16/9}
img.foto--45{aspect-ratio:4/5}
.sez--scura .didascalia{color:#8fa6bd}
@media (min-width:1024px){
.due--hero{gap:var(--space-5);align-items:center}
.hero-foto{margin-top:0}
}