/* =========================================================================
   SA Termoidraulica – stili dei componenti
   Colori, font, dimensioni del testo e spaziature sono in theme.json:
   qui ci sono solo i componenti che theme.json non può descrivere.

   Indice
   1. Variabili          6. Copertina e barra di fiducia   11. Pagine servizi
   2. Base               7. Home: card e sezioni           12. Contatti e footer
   3. Testi              8. La nostra struttura            13. Barra mobile
   4. Pulsanti e card    9. Chi siamo, marchi, zone, FAQ   14. Responsive
   5. Icone e immagini  10. Header                        15. Lavori (filtro, griglia, scheda)
                                                            16. Guida e tabelle
                                                            17. Chi siamo
                                                            18. Per chi lavoriamo
                                                            19. Contatti
   ========================================================================= */

/* 1. Variabili ------------------------------------------------------------ */
:root {
	--sa-navy: var(--wp--preset--color--navy);
	--sa-ink: var(--wp--preset--color--ink);
	--sa-muted: var(--wp--preset--color--muted);
	--sa-line: var(--wp--preset--color--line);
	--sa-water: var(--wp--preset--color--water);
	--sa-volt: var(--wp--preset--color--volt);
	/* tonalità scure per testi e icone su fondo chiaro (contrasto leggibile) */
	--sa-water-text: #0089bd;
	--sa-volt-text: #c77d00;
	--sa-text-2: #33445e;
	/* testi su fondo scuro */
	--sa-on-dark: #c4d0e4;
	--sa-on-dark-2: #9fb0cc;
	/* sfumature ricorrenti */
	--sa-grad-light: linear-gradient(180deg, #f4f9fd 0%, #eaf3fb 100%);
	--sa-grad-trust: linear-gradient(90deg, #e3f5fd 0%, #eef4fb 50%, #fff3df 100%);
	--sa-shadow: 0 8px 24px rgba(0, 19, 51, 0.1);
	--sa-header-h: 85px; /* aggiornata da assets/js/header.js */
	/* Scala del testo (i titoli sono in theme.json): solo questi 4 valori */
	--sa-fs-lead: 1.1875rem; /* introduzione sotto i titoli di sezione e in copertina */
	--sa-fs-body: 1.0625rem; /* paragrafi */
	--sa-fs-sm: 0.9375rem;   /* testi dentro card, elenchi, recensioni, form */
	--sa-fs-xs: 0.8125rem;   /* occhielli, tag, didascalie, note */
	/* Titoli: h1 e h2 da theme.json (xx-large, x-large); h3 1.375rem; titoletti = --sa-fs-lead */
	--sa-fs-h3: 1.375rem;
	/* Spaziature interne ricorrenti */
	--sa-pad-card: clamp(1.5rem, 3vw, 2.25rem);       /* card grandi (stile Card, aree, target) */
	--sa-pad-card-sm: var(--wp--preset--spacing--40); /* card delle griglie lavori e consigli */
	--sa-pad-box: 1rem 1.25rem;  /* riquadri piccoli: certificazioni, consigli, voci */
	--sa-pad-chip: 0.45rem 0.9rem; /* pillole cliccabili e filtri */
	--sa-pad-tag: 0.2rem 0.65rem;  /* etichette piccole */
	/* Angoli */
	--sa-r-s: var(--wp--custom--radius--s);
	--sa-r-m: var(--wp--custom--radius--m);
	--sa-r-l: var(--wp--custom--radius--l);
	/* Icona luogo (lucide map-pin) usata come maschera */
	--sa-pin: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 10c0 4.993-5.539 10.193-7.399 11.799a1 1 0 0 1-1.202 0C9.539 20.193 4 14.993 4 10a8 8 0 0 1 16 0'/%3E%3Ccircle cx='12' cy='10' r='3'/%3E%3C/svg%3E");
}

/* 2. Base ----------------------------------------------------------------- */
html { scroll-behavior: smooth; scroll-padding-top: calc(var(--sa-header-h, 84px) + var(--sa-subnav-h, 0px) + 24px); }
html:has(body.admin-bar) { scroll-padding-top: calc(var(--wp-admin--admin-bar--height, 32px) + var(--sa-header-h, 84px) + var(--sa-subnav-h, 0px) + 24px); }
body { -webkit-font-smoothing: antialiased; }
img { height: auto; }
/* Le sezioni a tutta larghezza si toccano: niente spazio automatico (block gap) tra header, contenuto, sezioni e footer */
.wp-site-blocks > *,
.wp-block-post-content > .alignfull { margin-block-start: 0; }
.sa-section { padding-top: var(--wp--preset--spacing--70); padding-bottom: var(--wp--preset--spacing--70); }
.sa-sec-head { margin-bottom: var(--wp--preset--spacing--50); }
.sa-sec-head h2 { margin-top: 0.4rem; }

/* 3. Testi ---------------------------------------------------------------- */
.is-style-sa-eyebrow {
	font-family: var(--wp--preset--font-family--heading);
	font-weight: 600;
	font-size: var(--sa-fs-xs);
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--sa-water-text);
	margin-bottom: 0.25rem !important;
}
.sa-lead { font-size: var(--sa-fs-lead); color: var(--sa-muted); max-width: 720px; }
.has-text-align-center.sa-lead { margin-left: auto; margin-right: auto; }
.sa-sub { font-size: var(--sa-fs-lead); color: var(--sa-text-2); max-width: 600px; }
.sa-small { font-size: var(--sa-fs-xs); color: var(--sa-muted); }
.sa-h-small { font-size: var(--sa-fs-lead); }
.sa-facts { gap: 0.6rem; }
.sa-facts p { margin: 0; background: var(--wp--preset--color--water-soft); color: var(--sa-navy); border-radius: 999px; padding: var(--sa-pad-chip); font-size: var(--sa-fs-sm); }

/* Sezioni scure (contatti, riquadro progetti, invito al preventivo) */
.sa-dark h2, .sa-dark h3 { color: #fff; }
.sa-dark p, .sa-dark .sa-lead { color: var(--sa-on-dark); }

/* 4. Pulsanti, card, elenchi ----------------------------------------------- */
.wp-block-button__link { display: inline-flex; align-items: center; gap: 0.6rem; }
.is-style-sa-ghost .wp-block-button__link { background: rgba(255, 255, 255, 0.7); border: 2px solid var(--sa-navy); color: var(--sa-navy); }
.is-style-sa-ghost .wp-block-button__link:hover { background: var(--sa-navy); color: #fff; }
.sa-dark .is-style-sa-ghost .wp-block-button__link { background: rgba(255, 255, 255, 0.1); border-color: rgba(255, 255, 255, 0.35); color: #fff; }
.sa-dark .is-style-sa-ghost .wp-block-button__link:hover { background: #fff; border-color: #fff; color: var(--sa-navy); }
.is-style-sa-dark .wp-block-button__link { background: var(--sa-navy); color: #fff; }
.is-style-sa-dark .wp-block-button__link:hover { background: var(--wp--preset--color--navy-2); }

.is-style-sa-card {
	background: #fff;
	border: 1px solid var(--sa-line);
	border-radius: var(--sa-r-m);
	padding: var(--sa-pad-card);
}

.is-style-sa-check { list-style: none; padding-left: 0; display: grid; gap: 0.5rem; }
.is-style-sa-check li { position: relative; padding-left: 1.75rem; font-size: var(--sa-fs-sm); }
.is-style-sa-check li::before {
	content: "";
	position: absolute; left: 0; top: 0.3em;
	width: 1.05rem; height: 1.05rem;
	background: var(--sa-water);
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E") center / contain no-repeat;
}

/* Pillole (marchi, comuni, indice servizi) */
.sa-logos, .sa-towns { list-style: none; padding: 0; margin: 0; display: flex; flex-wrap: wrap; gap: 0.6rem; }
.sa-logos li {
	display: flex; align-items: center; justify-content: center; height: 2.5rem; min-width: 5.5rem;
	border: 1px solid var(--sa-line); border-radius: var(--sa-r-s); padding: 0 0.9rem; background: #fff;
}
/* Loghi dei marchi: altezza in base alla forma, grigi a riposo e a colori al passaggio */
.sa-logos img { display: block; width: auto; max-width: 7.5rem; filter: grayscale(1); opacity: 0.8; transition: filter 0.2s, opacity 0.2s; }
.sa-logos img.is-wide { height: 14px; }
.sa-logos img.is-mid { height: 19px; }
.sa-logos img.is-square { height: 24px; }
.sa-logos li:hover img { filter: none; opacity: 1; }
.sa-towns li { border: 1px solid var(--sa-line); background: #fff; border-radius: 999px; padding: var(--sa-pad-chip); font-size: var(--sa-fs-sm); }
.sa-towns li:first-child { background: var(--sa-navy); color: #fff; border-color: var(--sa-navy); }

/* 5. Icone e immagini -------------------------------------------------------
   .sa-ic   riquadro icona (classe sul blocco Icona)
            dimensione: is-sm (40) · predefinita (52) · is-lg (60)
            colore:     is-volt · is-water · is-white · is-ghost (su fondo scuro)
            forma:      is-round · is-outline
   .sa-img  immagine con angoli arrotondati: is-4x3 · is-3x2 · is-16x10 · is-shadow · is-low
   .sa-card-img  foto a filo in testa a una card                                  */
.wp-block-sa-icona { display: inline-flex; flex: none; line-height: 0; }
.wp-block-sa-icona svg { width: 24px; height: 24px; }
.wp-block-sa-icona.is-size-16 svg { width: 16px; height: 16px; }
.wp-block-sa-icona.is-size-20 svg { width: 20px; height: 20px; }
.wp-block-sa-icona.is-size-30 svg { width: 30px; height: 30px; }
.wp-block-sa-icona.is-size-40 svg { width: 40px; height: 40px; }

.sa-ic {
	--sa-ic: 52px;
	width: var(--sa-ic); height: var(--sa-ic);
	display: inline-grid; place-items: center; flex: none;
	border-radius: var(--sa-r-m);
	background: var(--wp--preset--color--bg-alt); color: var(--sa-navy);
}
.sa-ic.is-sm { --sa-ic: 40px; border-radius: var(--sa-r-s); }
.sa-ic.is-lg { --sa-ic: 60px; border-radius: var(--sa-r-m); }
.sa-ic.is-round { border-radius: 50%; }
.sa-ic.is-volt { background: var(--wp--preset--color--volt-soft); color: var(--sa-volt-text); }
.sa-ic.is-water { background: var(--wp--preset--color--water-soft); color: var(--sa-water-text); }
.sa-ic.is-white { background: #fff; color: var(--sa-water-text); box-shadow: 0 4px 14px rgba(0, 19, 51, 0.07); }
.sa-ic.is-outline { box-shadow: none; border: 2px solid var(--sa-line); color: var(--sa-navy); }
.sa-ic.is-ghost { background: rgba(255, 255, 255, 0.06); color: var(--sa-water); }
.sa-ic.is-stars { color: var(--sa-volt); }

.sa-img img { width: 100%; border-radius: var(--sa-r-l); object-fit: cover; }
.sa-img.is-4x3 img { aspect-ratio: 4 / 3; }
.sa-img.is-3x2 img { aspect-ratio: 3 / 2; }
.sa-img.is-16x10 img { aspect-ratio: 16 / 10; border-radius: var(--sa-r-s); }
.sa-img.is-shadow img { box-shadow: 0 24px 60px rgba(0, 19, 51, 0.14); }
.sa-img.is-low img { object-position: center 70%; }

.sa-card-img { margin-top: 0 !important; overflow: hidden; background: var(--wp--preset--color--bg-alt); }
.sa-card-img img { width: 100%; height: 100%; object-fit: cover; }

/* 6. Copertina e barra di fiducia ------------------------------------------ */
.sa-hero.wp-block-cover { padding-top: clamp(3rem, 7vw, 5rem); padding-bottom: clamp(3rem, 7vw, 4.5rem); align-items: center; overflow: hidden; }
.sa-hero .wp-block-cover__inner-container { width: 100%; max-width: var(--wp--style--global--wide-size, 1200px); margin-inline: auto; }
.sa-hero .sa-hero-text { margin-left: 0 !important; }
.sa-hero h1, .sa-page-hero h1 { color: var(--sa-navy); }
.sa-mark { background: none; color: inherit; }
.sa-mark.is-volt { color: var(--sa-volt-text); }
.sa-mark.is-water { color: var(--sa-water-text); }
.sa-hero-tags { gap: 0.6rem !important; }
.sa-hero-tags > .wp-block-group {
	gap: 0.5rem; padding: var(--sa-pad-chip); border-radius: 999px;
	border: 1px solid rgba(0, 19, 51, 0.15); background: rgba(255, 255, 255, 0.75);
	font-size: var(--sa-fs-xs); color: var(--sa-text-2);
}
.sa-hero-tags p { margin: 0; }

/* Barra di fiducia: 4 colonne uguali separate da filetti, sfumatura azzurro → ambra */
.sa-trust { background: var(--sa-grad-trust); border-top: 1px solid var(--sa-line); border-bottom: 1px solid #e6e0d2; }
.sa-trust-grid { gap: 0 !important; padding-top: 1.4rem; padding-bottom: 1.4rem; }
.sa-trust-item { gap: 0.9rem; padding: 0.25rem 1rem; border-left: 1px solid rgba(0, 19, 51, 0.1); }
.sa-trust-item:first-child { border-left: 0; }
.sa-trust p { margin: 0; }
.sa-trust strong { font-family: var(--wp--preset--font-family--heading); font-size: var(--sa-fs-lead); line-height: 1.2; color: var(--sa-navy); white-space: nowrap; }
.sa-trust .sa-small { white-space: nowrap; }

/* 7. Home: card e sezioni -------------------------------------------------- */
/* Card elettrico / idraulico: foto in testa e barra colorata */
.sa-area { position: relative; overflow: hidden; border-radius: var(--sa-r-l) !important; padding: 0 var(--sa-pad-card) var(--sa-pad-card) !important; }
.sa-area::before { content: ""; position: absolute; inset: 0 0 auto 0; height: 6px; z-index: 2; }
.sa-area.is-el::before { background: var(--sa-volt); }
.sa-area.is-hy::before { background: var(--sa-water); }
.sa-area .sa-card-img { margin: 0 calc(-1 * var(--sa-pad-card)) 1.6rem !important; height: 230px; }
.sa-area > p { color: var(--sa-muted); }
/* elenco servizi: righe di altezza fissa, così le due card hanno la stessa griglia */
.sa-svc { grid-auto-rows: 52px; gap: 0.5rem 1.1rem !important; }
.sa-svc > .wp-block-group { align-items: center !important; gap: 0.75rem; }
.sa-svc p { margin: 0; font-size: var(--sa-fs-sm); font-weight: 500; line-height: 1.3; }

/* Un unico referente */
.sa-benefit { gap: 1.1rem; }
.sa-benefit h3 { margin: 0 0 0.25rem; }
.sa-benefit p { margin: 0; font-size: var(--sa-fs-sm); color: var(--sa-muted); }
.sa-combo {
	padding: 2rem;
	border-radius: var(--sa-r-l);
	border: 1px solid rgba(255, 255, 255, 0.1);
	background: linear-gradient(160deg, rgba(10, 35, 80, 0.66), rgba(6, 25, 61, 0.86)), url("../img/stock/combo-wallbox.webp") center / cover;
}
.sa-combo a:not(.wp-block-button__link) { color: var(--sa-water); font-weight: 600; text-decoration: none; }
.sa-combo-item { gap: 0.9rem; padding: var(--sa-pad-box); border-radius: var(--sa-r-s); background: rgba(255, 255, 255, 0.06); border: 1px solid rgba(255, 255, 255, 0.1); }
.sa-combo-item p { margin: 0; color: #fff; font-weight: 500; }
.sa-combo-item p:not(.sa-tag) { flex: 1; } /* testo accanto all'icona, etichetta in fondo a destra */
.sa-combo .is-volt { color: var(--sa-volt); }
.sa-combo .is-water { color: var(--sa-water); }
.sa-tag { flex: none; font-size: var(--sa-fs-xs) !important; font-weight: 600; letter-spacing: 0.03em; padding: var(--sa-pad-tag); border-radius: 999px; }
.sa-tag.is-e { background: rgba(245, 166, 35, 0.18); color: var(--sa-volt) !important; }
.sa-tag.is-i { background: rgba(0, 174, 239, 0.18); color: var(--sa-water) !important; }

/* Per chi lavoriamo */
.sa-target { display: flex; flex-direction: column; overflow: hidden; padding: 0 var(--sa-pad-card) var(--sa-pad-card) !important; }
.sa-target .sa-card-img { margin: 0 calc(-1 * var(--sa-pad-card)) !important; height: 190px; }
.sa-target .sa-card-badge { margin-top: -28px !important; position: relative; box-shadow: var(--sa-shadow); }
.sa-target > p { color: var(--sa-muted); font-size: var(--sa-fs-sm); }
.sa-target .sa-more { margin-top: auto; font-weight: 600; }
.sa-target .sa-more a { text-decoration: none; }

/* Come lavoriamo */
.sa-step-n { display: flex; align-items: center; gap: 0.75rem; font-family: var(--wp--preset--font-family--heading); font-weight: 700; font-size: var(--sa-fs-sm); letter-spacing: 0.1em; color: var(--sa-water-text); margin: 0; }
/* puntini che collegano un numero al passo successivo (non sull'ultimo) */
.sa-step:not(:last-child) .sa-step-n::after { content: ""; flex: 1; border-top: 3px dotted #b9d7ea; margin-right: -0.6rem; }
.sa-step p:not(.sa-step-n) { color: var(--sa-muted); font-size: var(--sa-fs-sm); }

.sa-empty { border: 2px dashed var(--sa-line); border-radius: var(--sa-r-m); padding: 2rem; text-align: center; color: var(--sa-muted); }

/* Lavori (archivio e home quando ci saranno foto di cantiere) */
/* Sottogriglia: foto, categorie, titolo e testo allineati tra le card della stessa riga */
.sa-works > li { display: grid; grid-template-rows: subgrid; grid-row: span 5; row-gap: 0; align-content: start; }
/* Luogo del lavoro (comune) in fondo alla card, con il segnaposto della mappa */
.sa-works .sa-place { display: flex; align-items: center; gap: 0.4rem; font-size: var(--sa-fs-xs); font-weight: 600; color: var(--sa-muted); }
.sa-works .sa-place::before { content: ""; flex: none; width: 14px; height: 14px; background: var(--sa-water-text); -webkit-mask: var(--sa-pin) center / contain no-repeat; mask: var(--sa-pin) center / contain no-repeat; }
.sa-works .sa-place a { color: inherit; text-decoration: none; }
.sa-works .sa-place a:hover { color: var(--sa-water-text); }
.sa-works > li > * { margin-block-start: 0; }
.sa-works > li { background: #fff; border: 1px solid var(--sa-line); border-radius: var(--sa-r-m); overflow: hidden; }
.sa-works > li > *:not(.wp-block-post-featured-image) { padding-left: var(--sa-pad-card-sm); padding-right: var(--sa-pad-card-sm); }
.sa-works > li > *:last-child { padding-bottom: var(--sa-pad-card-sm); }
.sa-works .wp-block-post-excerpt { color: var(--sa-muted); font-size: var(--sa-fs-sm); }
.sa-works .taxonomy-sa_servizio a, .sa-works .taxonomy-category a { font-size: var(--sa-fs-xs); font-weight: 600; text-decoration: none; padding: var(--sa-pad-tag); border-radius: 999px; background: var(--wp--preset--color--water-soft); color: var(--sa-water-text); }
.sa-works .wp-block-post-terms__separator { display: none; }

/* 8. La nostra struttura ---------------------------------------------------- */
.sa-mosaic { display: grid !important; grid-template-columns: 1.4fr 1fr 1fr; grid-template-rows: 240px 240px; gap: 14px; }
.sa-mosaic > * { margin: 0 !important; }
.sa-mosaic-item { position: relative; border-radius: var(--sa-r-m); overflow: hidden; }
.sa-mosaic-item:first-child { grid-row: span 2; }
.sa-mosaic-item img { width: 100%; height: 100%; object-fit: cover; }
.sa-mosaic-item:last-child img { object-position: center 75%; }
.sa-mosaic figcaption {
	position: absolute; left: 12px; bottom: 12px; margin: 0;
	padding: var(--sa-pad-chip); border-radius: 999px;
	background: rgba(0, 19, 51, 0.85); color: #fff; font-size: var(--sa-fs-xs); font-weight: 600;
}
.sa-stats { margin-top: 1.75rem; }
.sa-stat { border-left: 3px solid var(--sa-water); padding-left: 0.9rem; }
.sa-stat p { margin: 0; }
.sa-stat strong { font-family: var(--wp--preset--font-family--heading); font-size: var(--sa-fs-h3); }

/* 9. Chi siamo, marchi, FAQ ------------------------------------------------- */
.sa-cert { gap: 0.75rem; padding: var(--sa-pad-box); border: 1px solid var(--sa-line); border-radius: var(--sa-r-s); background: #fff; }
.sa-cert p { margin: 0; font-size: var(--sa-fs-sm); line-height: 1.4; }

.sa-brand-row { padding-bottom: 1.5rem; border-bottom: 1px solid var(--sa-line); }
.sa-brand-row + .sa-brand-row { margin-top: 1.5rem; }
.sa-brand-row:last-child { padding-bottom: 0; border-bottom: 0; }
.sa-brand-row > .wp-block-group:first-child { flex: 0 0 220px; }
.sa-brand-row .sa-h-small { font-size: var(--sa-fs-sm); margin: 0; }

.sa-faq .wp-block-details summary { display: flex; justify-content: space-between; gap: 1rem; padding: 1.2rem 0; font-weight: 600; font-size: var(--sa-fs-body); cursor: pointer; list-style: none; }
.sa-faq .wp-block-details summary::-webkit-details-marker { display: none; }
.sa-faq .wp-block-details summary::after { content: "+"; font-family: var(--wp--preset--font-family--heading); font-size: 1.6rem; line-height: 1; color: var(--sa-water); }
.sa-faq .wp-block-details[open] summary::after { content: "–"; }
.sa-faq .wp-block-details p { margin: 0; padding-bottom: 1.3rem; color: var(--sa-muted); }

/* 10. Header ---------------------------------------------------------------- */
.sa-topbar { background: #e4edf7; border-bottom: 1px solid var(--sa-line); font-size: var(--sa-fs-xs); }
.sa-topbar p { margin: 0; color: var(--sa-text-2); }
.sa-topbar .wp-block-sa-icona { color: var(--sa-water-text); }

/* Sticky sul contenitore dell'header (template part): la barra superiore scorre via, l'header resta.
   Lo sticky su .sa-header da solo non funziona perché il suo genitore è alto quanto lui. */
.wp-site-blocks > header.wp-block-template-part { position: sticky; top: calc(-1 * var(--sa-topbar-h, 0px)); z-index: 50; }
.admin-bar .wp-site-blocks > header.wp-block-template-part { top: calc(var(--wp-admin--admin-bar--height, 32px) - var(--sa-topbar-h, 0px)); }
.sa-header {
	position: relative;
	background: var(--sa-grad-light);
	-webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px);
	border-bottom: 1px solid var(--sa-line);
	transition: box-shadow 0.25s;
}
.sa-header-bar { padding-block: 0.9rem; }
.sa-header.is-scrolled { box-shadow: 0 6px 24px rgba(0, 19, 51, 0.08); }
.sa-header .sa-logo img { height: 54px; width: auto; }
.sa-header .wp-block-navigation a { color: var(--sa-ink); white-space: nowrap; }
.sa-header .wp-block-navigation a:hover { color: var(--sa-water-text); }
.sa-header .wp-block-navigation__responsive-container-open { color: var(--sa-navy); }
.sa-header .wp-block-navigation__responsive-container.is-menu-open { background: #fff; color: var(--sa-ink); }
/* "Preventivo gratuito" compare solo dopo lo scroll (classe is-scrolled da header.js) */
.sa-header .sa-header-cta { opacity: 0; transform: translateY(-6px); pointer-events: none; transition: opacity 0.25s, transform 0.25s; }
.sa-header.is-scrolled .sa-header-cta { opacity: 1; transform: none; pointer-events: auto; }
/* Su mobile il preventivo è già nella barra in basso */
@media (max-width: 781px) { .sa-header .sa-header-cta { display: none; } }

/* 11. Pagine servizi -------------------------------------------------------- */
.sa-page-hero { padding-top: clamp(2.5rem, 5vw, 3.5rem); padding-bottom: clamp(2.5rem, 5vw, 3.5rem); background: var(--sa-grad-light); }
.sa-page-hero.is-volt { background: linear-gradient(135deg, #fffaf0 0%, #f4f9fd 55%, #eef5fb 100%); }
.sa-page-hero.is-water { background: linear-gradient(135deg, #eaf7fd 0%, #f4f9fd 55%, #eef5fb 100%); }
.sa-page-hero h1 { font-size: var(--wp--preset--font-size--xx-large); }
.sa-crumbs { font-size: var(--sa-fs-xs); color: var(--sa-muted); margin-bottom: 0.5rem !important; }
.sa-crumbs a { color: var(--sa-water-text); text-decoration: none; }

/* Indice dei servizi: fisso sotto l'header */
.sa-svc-index { position: sticky; top: var(--sa-header-h); z-index: 40; background: rgba(255, 255, 255, 0.94); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); border-bottom: 1px solid var(--sa-line); }
.admin-bar .sa-svc-index { top: calc(var(--sa-header-h) + var(--wp-admin--admin-bar--height, 32px)); }
.sa-svc-index-list { list-style: none; margin: 0; padding: 0.75rem 0 !important; display: flex; flex-wrap: wrap; justify-content: center; gap: 0.5rem; }
@media (max-width: 781px) { .sa-svc-index-list { flex-wrap: nowrap; justify-content: flex-start; overflow-x: auto; scrollbar-width: none; } }
.sa-svc-index-list::-webkit-scrollbar { display: none; }
.sa-svc-index-list li { flex: none; }
.sa-svc-index-list a { display: inline-block; padding: var(--sa-pad-chip); border: 1px solid var(--sa-line); border-radius: 999px; background: #fff; font-size: var(--sa-fs-xs); font-weight: 500; color: var(--sa-ink); text-decoration: none; white-space: nowrap; }
.sa-svc-index-list a:hover { border-color: var(--sa-water-text); color: var(--sa-water-text); }

/* Servizi principali: righe foto + testo */
.sa-svc-row { padding: 2.25rem 0; gap: 3.5rem !important; }
.sa-svc-row + .sa-svc-row { border-top: 1px solid var(--sa-line); }
.sa-svc-title { gap: 0.9rem; margin-bottom: 0.5rem; }
.sa-svc-title h2 { margin: 0; }
.sa-svc-title h3 { margin: 0; }
.sa-svc-list { grid-template-columns: 1fr 1fr; grid-auto-rows: minmax(40px, auto); gap: 0.25rem 1.25rem !important; align-items: center; }
.sa-svc-brands { margin-top: 1.25rem !important; }
.sa-svc-brands li { font-size: var(--sa-fs-xs); padding: var(--sa-pad-tag); border-radius: var(--sa-r-s); }

/* Servizi secondari: card di altezza uguale */
/* Card "Altri servizi": titolo, introduzione ed elenco allineati tra le card (stesse righe, come le card dei lavori) */
.sa-svc-cards > .sa-svc-card { display: grid; grid-template-rows: subgrid; grid-row: span 3; row-gap: 1.25rem; align-content: start; }
.sa-svc-card > * { margin-block: 0 !important; align-self: start; }
.sa-svc-card > p { color: var(--sa-muted); font-size: var(--sa-fs-sm); }
.sa-integr-band { gap: 2.5rem; }

/* Pagine legali: titoli di sezione al livello dei sottotitoli */
.sa-legal h2 { font-size: var(--sa-fs-h3); margin-top: var(--wp--preset--spacing--50); }

/* 12. Contatti, invito al preventivo, footer ------------------------------- */
.sa-c-item { gap: 1rem; align-items: center; }
.sa-c-item p { margin: 0; }
.sa-c-item .sa-small { color: var(--sa-on-dark-2); }
.sa-c-item a, .sa-c-item strong { color: #fff; text-decoration: none; font-weight: 600; }
.sa-cta { padding: 2.5rem; border-radius: var(--sa-r-l); margin-top: var(--wp--preset--spacing--60); }

.sa-footer { font-size: var(--sa-fs-sm); }
.sa-footer p, .sa-footer li, .sa-footer a { color: var(--sa-on-dark-2); }
.sa-footer a { text-decoration: none; }
.sa-footer a:hover { color: #fff; }
.sa-footer .sa-footer-title { color: #fff; font-family: var(--wp--preset--font-family--heading); font-weight: 600; font-size: var(--sa-fs-body); }
.sa-footer ul, .sa-footer-stack { list-style: none; padding: 0; display: grid; gap: 0.5rem; }
.sa-footer-stack > * { margin: 0; }
.sa-footer .sa-logo img { height: 80px; width: auto; }
.sa-footer-stack a[href^="mailto:"] { white-space: nowrap; }
/* Tablet: logo e descrizione su una riga intera, le tre colonne di link sotto (l'email resta su una riga) */
@media (min-width: 782px) and (max-width: 1100px) {
	.sa-footer .wp-block-columns { flex-wrap: wrap !important; }
	.sa-footer .wp-block-column:first-child { flex-basis: 100% !important; }
}
.sa-footer-bottom { border-top: 1px solid rgba(255, 255, 255, 0.08); }

/* 13. Barra fissa mobile ----------------------------------------------------- */
.sa-mbar { display: none !important; }

/* 14. Responsive ------------------------------------------------------------- */
/* Menu a scomparsa fino a 1100px (il core lo fa solo sotto 600px) */
@media (max-width: 1100px) {
	.sa-header .wp-block-navigation__responsive-container-open:not(.always-shown) { display: flex; }
	.sa-header .wp-block-navigation__responsive-container:not(.hidden-by-default):not(.is-menu-open) { display: none; }
}
@media (max-width: 1080px) {
	.sa-step .sa-step-n::after { display: none; }
	.sa-trust-grid { grid-template-columns: 1fr 1fr !important; row-gap: 1.1rem !important; }
	.sa-trust-item { justify-content: flex-start !important; }
	.sa-trust-item:nth-child(3) { border-left: 0; }
	.sa-mosaic { grid-template-columns: 1fr 1fr; grid-template-rows: auto; }
	.sa-mosaic-item, .sa-mosaic-item:first-child { grid-row: auto; aspect-ratio: 4 / 3; }
	.sa-mosaic-item:first-child { grid-column: span 2; }
}
@media (max-width: 781px) {
	.sa-topbar { display: none; }
	.sa-header .sa-logo img { height: 44px; }
	/* Copertina: testo su bianco, foto intera sotto i pulsanti */
	.sa-hero.wp-block-cover { flex-direction: column; align-items: stretch; padding-bottom: 0; min-height: 0 !important; }
	.sa-hero .wp-block-cover__background { display: none; }
	.sa-hero .wp-block-cover__inner-container { order: 1; }
	.sa-hero .wp-block-cover__image-background {
		position: relative !important; order: 2; inset: auto !important;
		width: calc(100% + 2 * var(--wp--style--root--padding-left, 1rem)) !important;
		margin-left: calc(-1 * var(--wp--style--root--padding-left, 1rem));
		height: auto !important; aspect-ratio: 4 / 3; margin-top: 0.5rem;
		object-position: 68% center !important;
		-webkit-mask-image: linear-gradient(180deg, transparent 0%, #000 22%);
		mask-image: linear-gradient(180deg, transparent 0%, #000 22%);
	}
	.sa-sub { font-size: var(--sa-fs-body); }
	.sa-area .sa-card-img { height: 180px; }
	/* Riquadro progetti: testo su tutta la riga accanto all'icona, etichetta sotto al testo */
	.sa-combo { padding: 1.25rem; }
	.sa-combo-item { flex-wrap: wrap !important; row-gap: 0.4rem; align-items: flex-start !important; }
	.sa-combo-item p:not(.sa-tag) { flex: 1 1 calc(100% - 24px - 0.9rem); }
	.sa-combo-item .sa-tag { margin-left: calc(24px + 0.9rem); }
	.sa-svc, .sa-svc-list { grid-template-columns: 1fr !important; grid-auto-rows: auto; }
	.sa-svc > .wp-block-group { min-height: 44px; }
	.sa-stats { grid-template-columns: 1fr !important; }
	.sa-brand-row { flex-direction: column; align-items: flex-start !important; }
	.sa-svc-row.is-reverse { flex-direction: column-reverse; }
}
@media (max-width: 640px) {
	.sa-trust-grid { gap: 1rem 0.5rem !important; }
	.sa-trust-item { flex-direction: column; align-items: center !important; text-align: center; border-left: 0; padding: 0.25rem; }
	.sa-trust strong { font-size: var(--sa-fs-body); }
	.sa-trust .sa-small { white-space: normal; }
	.sa-mosaic { grid-template-columns: 1fr; }
	.sa-mosaic-item:first-child { grid-column: auto; }
	/* Barra fissa: Chiama / WhatsApp / Preventivo */
	.sa-mbar { display: grid !important; grid-template-columns: repeat(3, 1fr); gap: 0 !important; position: fixed; bottom: 0; left: 0; right: 0; z-index: 60; margin: 0 !important; }
	.sa-mbar .wp-block-button { width: 100%; }
	.sa-mbar .wp-block-button__link { width: 100%; border-radius: 0; justify-content: center; flex-direction: column; gap: 0.15rem; font-size: var(--sa-fs-xs); padding: 0.7rem 0; }
	.sa-mbar .is-call .wp-block-button__link { background: var(--sa-navy); }
	.sa-mbar .is-wa .wp-block-button__link { background: #128c43; }
	.sa-mbar .is-quote .wp-block-button__link { background: #007aa8; }
	body { padding-bottom: 64px; }
}

/* 15. Lavori: filtro, griglia, scheda ------------------------------------- */
.sa-filter { list-style: none; padding: 0; margin: 0 0 var(--wp--preset--spacing--40); display: flex; flex-wrap: wrap; gap: 0.5rem; }
.sa-filter a { display: inline-flex; gap: 0.4rem; align-items: center; padding: var(--sa-pad-chip); border: 1px solid var(--sa-line); border-radius: 999px; background: #fff; font-size: var(--sa-fs-sm); font-weight: 500; color: var(--sa-ink); text-decoration: none; }
.sa-filter a span { font-size: var(--sa-fs-xs); color: var(--sa-muted); }
.sa-filter a:hover { border-color: var(--sa-water-text); color: var(--sa-water-text); }
.sa-filter a[aria-current], .sa-filter .current-cat > a { background: var(--sa-navy); border-color: var(--sa-navy); color: #fff; }
.sa-filter a[aria-current] span { color: var(--sa-on-dark); }
.sa-works-grid { list-style: none; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(17rem, 1fr)); gap: 1.5rem; }
.sa-works-img img { display: block; width: 100%; aspect-ratio: 4 / 3; object-fit: cover; }
.sa-works h3 { font-size: var(--sa-fs-body); margin: 0.5rem 0 0.25rem; }
.sa-works h3 a { color: var(--sa-ink); text-decoration: none; }
.sa-works .taxonomy-sa_servizio, .sa-works .taxonomy-category { margin-top: 1rem; display: flex; flex-wrap: wrap; gap: 0.35rem; align-items: flex-start; align-content: flex-start; }
.sa-altri-lavori { margin-top: var(--wp--preset--spacing--70); padding-top: var(--wp--preset--spacing--50); border-top: 1px solid var(--sa-line); }
.sa-lavoro-meta { gap: 0.5rem; margin-bottom: var(--wp--preset--spacing--40); }
.sa-lavoro-meta .wp-block-post-terms { display: flex; flex-wrap: wrap; gap: 0.5rem; }
.sa-lavoro-meta .wp-block-post-terms__separator { display: none; }
/* Galleria dei lavori: griglia regolare 3 colonne (2 su mobile), riquadri tutti uguali */
.wp-block-gallery.has-nested-images.is-cropped { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0.75rem; }
.wp-block-gallery.has-nested-images.is-cropped > figure.wp-block-image { width: auto !important; margin: 0 !important; aspect-ratio: 4 / 3; border-radius: var(--sa-r-s); overflow: hidden; }
@media (max-width: 600px) { .wp-block-gallery.has-nested-images.is-cropped { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.sa-lavoro-meta .wp-block-post-terms a { display: inline-block; padding: var(--sa-pad-tag); border-radius: 999px; background: var(--wp--preset--color--water-soft); color: var(--sa-water-text); font-size: var(--sa-fs-xs); font-weight: 600; text-decoration: none; }

/* 16. Guida (Energia ed efficienza) ------------------------------------------ */
.sa-g-layout { gap: 3.5rem !important; }
.sa-g-aside { position: sticky; top: calc(var(--sa-header-h) + 24px); align-self: flex-start; max-height: calc(100vh - var(--sa-header-h) - 48px); overflow: auto; }
.sa-toc summary { font-family: var(--wp--preset--font-family--heading); font-weight: 600; font-size: var(--sa-fs-sm); letter-spacing: 0.06em; text-transform: uppercase; color: var(--sa-muted); cursor: pointer; }
.sa-toc-list { list-style: none; padding: 0; margin: 0.75rem 0 0; border-left: 2px solid var(--sa-line); }
.sa-toc-list a { display: block; margin-left: -2px; padding: 0.35rem 0 0.35rem 0.85rem; border-left: 2px solid transparent; font-size: var(--sa-fs-sm); line-height: 1.35; color: var(--sa-ink); text-decoration: none; }
.sa-toc-list a:hover, .sa-toc-list a.is-active { border-left-color: var(--sa-water-text); color: var(--sa-water-text); }
.sa-toc-cta { margin-top: 1.25rem; }
.sa-g-body { font-size: var(--sa-fs-body); line-height: 1.7; min-width: 0; }
.sa-g-sec { margin-bottom: var(--wp--preset--spacing--60); scroll-margin-top: calc(var(--sa-header-h) + 24px); }
.sa-g-num { font-family: var(--wp--preset--font-family--heading); font-weight: 700; font-size: var(--sa-fs-xs); letter-spacing: 0.12em; color: var(--sa-water-text); margin-bottom: 0 !important; }
.sa-g-label { font-family: var(--wp--preset--font-family--heading); font-size: var(--sa-fs-xs); letter-spacing: 0.12em; text-transform: uppercase; color: var(--sa-water-text); margin: 0 !important; }
.sa-g-breve { background: var(--wp--preset--color--water-soft); border-left: 4px solid var(--sa-water); border-radius: 0 var(--sa-r-s) var(--sa-r-s) 0; padding: var(--sa-pad-box); }
.sa-g-breve p:last-child { margin: 0.25rem 0 0; font-weight: 500; color: var(--sa-navy); }
.sa-g-sintesi { margin-bottom: var(--wp--preset--spacing--60); }
.sa-g-list li::marker { color: var(--sa-water-text); font-weight: 700; }
.sa-g-diagram { background: var(--sa-navy); border-radius: var(--sa-r-m); padding: 1rem; }
.sa-g-diagram img { max-height: 420px; width: 100%; object-fit: contain; }
.sa-img.is-16x9 img { aspect-ratio: 16 / 9; }
.sa-g-tip { gap: 0.9rem; background: var(--wp--preset--color--volt-soft); border-radius: var(--sa-r-m); padding: var(--sa-pad-box); }
.sa-g-tip p { margin: 0; }
.sa-g-tip strong { color: var(--sa-volt-text); }
.sa-g-meta { gap: 0.4rem 1.25rem; font-size: var(--sa-fs-xs); color: var(--sa-muted); }
.sa-g-meta p { margin: 0; }
.sa-g-meta .wp-block-sa-icona { color: var(--sa-water-text); }
.sa-g-gloss .is-style-sa-card { padding: var(--sa-pad-box); }
.sa-g-gloss p { margin: 0; }

/* Tabelle di confronto (blocco Tabella con classe sa-table) */
.sa-table { overflow-x: auto; border: 1px solid var(--sa-line); border-radius: var(--sa-r-m); }
.sa-table table { border-collapse: collapse; font-size: var(--sa-fs-sm); line-height: 1.45; }
.sa-table.is-wide table { min-width: 560px; }
.sa-table th, .sa-table td { padding: 0.75rem 0.9rem; border: 0; border-bottom: 1px solid var(--sa-line); text-align: left; vertical-align: top; }
.sa-table thead th { background: var(--sa-navy); color: #fff; font-family: var(--wp--preset--font-family--heading); font-weight: 600; }
.sa-table tbody td:first-child { background: var(--wp--preset--color--bg-alt); font-weight: 600; color: var(--sa-navy); }
.sa-table tbody tr:last-child td { border-bottom: 0; }

@media (max-width: 1080px) {
	.sa-g-layout { flex-direction: column; }
	.sa-g-aside { position: static; max-height: none; flex-basis: auto !important; border: 1px solid var(--sa-line); border-radius: var(--sa-r-m); padding: var(--sa-pad-box); }
	.sa-toc-cta { display: none; }
}

/* 17. Chi siamo: linea del tempo e valori ---------------------------------- */
.sa-timeline-item { position: relative; padding-top: 1.75rem; border-top: 3px solid var(--sa-line); }
.sa-timeline-item::before { content: ""; position: absolute; top: -9px; left: 0; width: 15px; height: 15px; border-radius: 50%; background: var(--sa-water); box-shadow: 0 0 0 4px #fff; }
.sa-timeline-item:last-child::before { background: var(--sa-volt); }
.sa-timeline-year { font-family: var(--wp--preset--font-family--heading); font-weight: 700; font-size: var(--sa-fs-h3); color: var(--sa-water-text); margin: 0 !important; }
.sa-timeline-item h3 { margin: 0.25rem 0 0.5rem; }
.sa-timeline-item p:last-child, .sa-value p { color: var(--sa-muted); font-size: var(--sa-fs-sm); }
.sa-value h3 { margin: 1rem 0 0.4rem; }
.sa-certs { margin-top: var(--wp--preset--spacing--50) !important; gap: 1.5rem; }
/* Tre per riga; l'ultima riga incompleta resta centrata */
.sa-certs > * { flex: 0 1 calc((100% - 3rem) / 3); min-width: min(100%, 16rem); }
/* Scheda azienda: tabella a due colonne, etichette a sinistra */
.sa-table.is-facts td { font-size: var(--sa-fs-sm); }
.sa-table.is-facts tbody td:first-child { width: 34%; }
/* Confronto: la colonna SA in evidenza */
.sa-table.is-compare { background: #fff; }
.sa-table.is-compare th:last-child, .sa-table.is-compare td:last-child { background: var(--wp--preset--color--water-soft); font-weight: 600; color: var(--sa-navy); }
.sa-table.is-compare thead th:last-child { background: var(--sa-water-text); color: #fff; }
.sa-table.is-compare td:nth-child(2) { color: var(--sa-muted); }
/* Squadra */
.sa-person { text-align: center; }
.sa-person p { margin: 0.2rem 0 0; }
.sa-avatar { width: 64px; height: 64px; border-radius: 50%; margin: 0 auto 0.75rem !important; display: grid; place-items: center; background: var(--sa-navy); color: #fff; font-family: var(--wp--preset--font-family--heading); font-weight: 700; font-size: var(--sa-fs-h3); }
.sa-avatar.is-lg { width: 96px; height: 96px; margin: 0 !important; flex: none; font-size: 2rem; }
.sa-founder { gap: 1.5rem; margin-top: var(--wp--preset--spacing--40) !important; }
.sa-founder p { margin: 0.25rem 0 0; }
.sa-dove-row { gap: 0.75rem; align-items: center !important; }
.sa-dove-row p { margin: 0; }
/* Linea del tempo verticale (Chi siamo) */
.sa-timeline.is-vertical .sa-timeline-item { padding: 0 0 1.5rem 1.75rem; border-top: 0; border-left: 3px solid var(--sa-line); }
.sa-timeline.is-vertical .sa-timeline-item:last-child { padding-bottom: 0; }
.sa-timeline.is-vertical .sa-timeline-item::before { top: 0.35rem; left: -9px; }
/* Due colonne di altezza uguale: la tabella si allunga fino al fondo della colonna accanto */
.sa-equal { align-items: stretch !important; }
.sa-equal > .wp-block-column { display: flex; flex-direction: column; }
.sa-equal .sa-table { flex: 1; margin: 0; }
.sa-equal .sa-table table { height: 100%; }

/* 18. Per chi lavoriamo ------------------------------------------------------ */
.sa-picks { margin-top: var(--wp--preset--spacing--50) !important; }
.sa-pick { display: flex; flex-direction: column; gap: 0.5rem; transition: border-color 0.2s, box-shadow 0.2s; }
.sa-pick:hover { border-color: var(--sa-water-text); box-shadow: var(--sa-shadow); }
.sa-pick p { margin: 0; }
.sa-pick-title a { color: var(--sa-navy); text-decoration: none; font-size: var(--sa-fs-body); }
.sa-target-svc { margin-top: var(--wp--preset--spacing--60) !important; }
.sa-extra { margin-top: 1.5rem !important; }
.sa-extra h3 { margin-top: 0; }
.sa-pick-note { margin: 1rem 0 0 !important; padding-top: 1rem; border-top: 1px solid var(--sa-line); font-size: var(--sa-fs-sm); color: var(--sa-muted); }

/* 19. Contatti ---------------------------------------------------------------- */
.sa-channels { margin-top: var(--wp--preset--spacing--50) !important; gap: 1rem !important; }
.sa-channel { gap: 0.9rem; align-items: center; }
.sa-channel p { margin: 0; }
.sa-channel a, .sa-channel p:not(.sa-small) { color: var(--sa-navy); font-weight: 600; text-decoration: none; }
.sa-form-col .sa-form { border: 1px solid var(--sa-line); box-shadow: 0 24px 60px rgba(0, 19, 51, 0.1); }

/* Più spazio tra le colonne nelle sezioni a due colonne */
.wp-block-columns.alignwide.is-layout-flex { column-gap: clamp(2.5rem, 5vw, 4.5rem); }

/* Chi siamo: stampa e interviste (loghi in un riquadro di altezza fissa, allineati a sinistra) */
.sa-press-logo { height: 48px; margin: 0 0 0.5rem; }
.sa-press-logo a { display: block; height: 100%; }
.sa-press-logo img { height: 100%; width: auto; max-width: 100%; object-fit: contain; object-position: left center; }
.sa-press h3 a { color: var(--sa-ink); text-decoration: none; }
.sa-press h3 a:hover { color: var(--sa-water-text); text-decoration: underline; }

/* Home: invito alla guida */
#guida .sa-g-diagram img { max-height: 560px; }
.sa-guide-list { margin-block: 0.5rem 1.5rem; }
.sa-guide-list > * { margin-block-start: 0; }
.sa-guide-q { padding: 0.6rem 0; border-top: 1px solid var(--sa-line); gap: 0.75rem; align-items: center; }
.sa-guide-q p { margin: 0; font-weight: 500; }
.sa-guide-q a { color: var(--sa-ink); text-decoration: none; }
.sa-guide-q a:hover { color: var(--sa-water-text); text-decoration: underline; }
.sa-faq-more { margin-top: var(--wp--preset--spacing--40); font-size: var(--sa-fs-sm); }

/* Blog: indice, scheda articolo, autore */
.wp-block-categories.sa-filter { margin-bottom: var(--wp--preset--spacing--40); }
.sa-blog-cat a { color: inherit; text-decoration: none; }
.sa-blog-meta { gap: 0.25rem 1.25rem; color: var(--sa-muted); font-size: var(--sa-fs-sm); margin-bottom: var(--wp--preset--spacing--40); }
.sa-blog-meta p, .sa-blog-meta .wp-block-post-date { margin: 0; }
.sa-blog-meta .wp-block-post-date::before { content: "Pubblicato il "; }
.sa-blog-links { margin-block: var(--wp--preset--spacing--50); }
.sa-blog-links .sa-h-small { margin-top: 0; }
.sa-author { gap: 1.25rem; margin-block: var(--wp--preset--spacing--50); }
.sa-author .sa-avatar { flex: none; margin: 0 !important; }
.sa-author p { margin: 0; }
