/* =========================================================
   Essedue — componenti di progetto per Flatsome
   essedue.css · v1.12.0 · 2026-10-12

   Usa i token di Keyweb Flatsome Kit (--kw-*): i colori letterali
   compaiono solo come ripiego dentro var(). Pulsanti, focus,
   animazioni d'ingresso, barra titolo e moduli li fa il kit:
   qui non si riscrivono.
   Scope: classe .es-site sul body (vedi functions-essedue.php).

   Indice
   01 Token di progetto
   02 Titolo di marca, linea, claim
   03 Apertura con video
   04 Da dove parti? (schede percorso)
   05 Trova la tua rete
   06 Il sistema cdbed (strati a scorrimento)
   07 Letti cdbed (fila orizzontale)
   08 Perché Essedue
   09 Fascia rivenditori
   10 Didascalie e dettagli
   11 Responsive e movimento ridotto
   12 Catalogo: filtri e schede delle composizioni
   13 Scheda della composizione
   14 Testata del modello e "componi"
   15 Contatti e moduli
   16 Megamenu
   17 Piede
   18 Mobile: scheda, catalogo, moduli
   19 Strati e "trova la tua rete" su telefono
   20 Barra titolo delle pagine (kw-barra-titolo)
   21 Barra del catalogo (categorie e negozio)
   22 Primo paragrafo di categorie e catalogo
   23 Secondo paragrafo di categorie e catalogo
   24 Chiusura: trova il rivenditore (kw-chiusura)
   25 Home: da dove parti? e perché essedue
   26 Header: lingua, ricerca, dove acquistare (blocco 16)
   27 Piede (blocco 08)
   28 Scheda prodotto unica per letti e reti (blocco 03)

   CHANGELOG
   1.12.0 · 2026-10-12 · barra del catalogo con immagine di sfondo e velatura, allineata al contenitore; barra titolo e strati allineati al contenitore di Flatsome
   1.11.0 · 2026-10-12 · scheda unica letti e reti: certificazione, dati della rete, voci vuote nascoste
   1.10.0 · 2026-10-12 · piede rifatto: logo, social, colonne dinamiche, riga legale
   1.9.0 · 2026-10-12 · hero: titolo e claim salgono da dietro una maschera all'avvio del video
   1.8.0 · 2026-10-12 · header: lingua, lente con pannello di ricerca, pulsante dove acquistare (blocco 16)
   1.7.0 · 2026-10-12 · apertura: testi allineati al contenuto dell'header e in sequenza all'avvio del video; sistema cdbed con i margini ai lati
   1.6.0 · 2026-10-12 · testi dell'apertura spostati per la foto in alta (lampada a destra); linea dei titoli piena anche con kw-line-draw
   1.5.0 · 2026-10-12 · barra titolo, barra del catalogo, primo e secondo paragrafo di categorie e catalogo, chiusura, da dove parti?, perché essedue
   1.4.0 · 2026-10-10 · didascalie con linea negli strati su telefono, risposte di "trova la tua rete" su una riga, moduli con le classi del kit 0.19.6
   1.3.0 · 2026-10-10 · strati e fila dei letti a tutta altezza, anche su telefono
   1.2.0 · 2026-10-10 · catalogo con filtri, scheda composizione, modello, contatti e moduli, megamenu, piede, mobile
   1.1.0 · 2026-10-09 · apertura a tutto schermo su desktop (03b)
   1.0.0 · 2026-10-09 · prima versione, dall'anteprima HTML 1.7.0
   ========================================================= */

/* 01 Token di progetto ------------------------------------ */
.es-site {
	--es-rosso: var(--kw-primario, #AE1E39);
	--es-rosso-sc: var(--kw-primario-sc, #8C1830);
	--es-grigio: var(--kw-scuro, #515356);
	--es-grigio-sc: var(--kw-secondario-sc, #46484B);
	--es-testo: var(--kw-testo, #63666A);
	--es-carta: var(--kw-carta, #F3F3F4);
	--es-filetto: var(--kw-filetto, #E3E4E6);
	--es-bianco: var(--kw-titolo-chiaro, #FFFFFF);
	--es-sans: var(--kw-sans, 'Avenir Next', Avenir, Arial, sans-serif);
	--es-curva: var(--kw-curva, cubic-bezier(.2, .7, .2, 1));
	--es-margine: clamp(20px, 5vw, 96px);
	--es-header: 84px;                 /* altezza dell'header: allineare a Flatsome */
	/* bordo sinistro del contenuto (contenitore di Flatsome + 15 px di margine della colonna) */
	--es-allinea: max(15px, calc((100vw - var(--es-contenitore, var(--kw-container, 1728px))) / 2 + 15px));
}

/* 02 Titolo di marca, linea, claim -------------------------
   Dal brand book: minuscolo, bold italic, rosso. Il modulo può
   essere un [ux_text class="es-titolo"] con dentro h1/h2/p.        */
.es-site .es-titolo,
.es-site .es-titolo :is(h1, h2, h3, p) {
	margin: 0;
	font-family: var(--es-sans);
	font-size: clamp(44px, 4.4vw, 96px);
	line-height: .98;
	font-weight: 700;
	font-style: italic;
	text-transform: lowercase;
	letter-spacing: -.015em;
	color: var(--es-rosso);
}
.es-site .es-titolo--hero, .es-site .es-titolo--hero :is(h1, h2, p) { font-size: clamp(40px, 5vw, 108px); }
.es-site .es-titolo--medio, .es-site .es-titolo--medio :is(h1, h2, p) { font-size: clamp(34px, 3vw, 64px); }
.es-site .es-titolo--chiaro, .es-site .es-titolo--chiaro :is(h1, h2, p) { color: var(--es-bianco); }

/* Testata di sezione: titolo + linea fino al bordo destro dello schermo.
   La linea è un elemento a sé con la classe del kit kw-line-draw. */
.es-site .es-testata { display: grid; grid-template-columns: auto 1fr; column-gap: clamp(24px, 2.4vw, 48px); align-items: end; }
.es-site .es-testata > .es-titolo { grid-column: 1; }
.es-site .es-linea {
	grid-column: 2; display: block; height: 3px; background: var(--es-rosso); opacity: 1;
	margin-bottom: .32em; font-size: clamp(44px, 4.4vw, 96px);
	margin-right: calc(-1 * (max(0px, (100vw - var(--kw-container, 1728px)) / 2) + var(--es-margine)));
	transform-origin: left center;
}
.es-site .es-linea--chiara { background: var(--es-bianco); }
.es-site .es-testata__sotto { grid-column: 1 / -1; margin: 24px 0 0; max-width: 640px; color: var(--es-testo); font-size: clamp(17px, 1vw, 21px); line-height: 1.55; }

.es-site .es-claim, .es-site .es-claim p {
	margin: 0; font-size: clamp(24px, 2vw, 40px); line-height: 1.1;
	font-weight: 700; font-style: italic; text-transform: lowercase; color: var(--es-grigio);
}

/* 03 Apertura con video (es-apertura.js) ------------------- */
.es-site .es-apertura .section-content > .row { min-height: calc(100vh - var(--es-header)); align-items: center; }
.es-site .es-apertura__cornice { position: relative; aspect-ratio: 16 / 9; overflow: hidden; background: var(--es-carta); }
.es-site .es-apertura__cornice video,
.es-site .es-apertura__foto { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; display: block; margin: 0; }
.es-site .es-apertura__foto { opacity: 0; transition: opacity .5s ease; }
.es-site .es-apertura.is-finita .es-apertura__foto { opacity: 1; }
.es-site .es-apertura__comandi { position: absolute; right: 14px; bottom: 14px; z-index: 2; display: flex; gap: 8px; }
.es-site .es-apertura__comandi button {
	min-height: 40px; padding: 0 16px; margin: 0; border: 0; border-radius: 0; cursor: pointer;
	background: rgba(255, 255, 255, .9); color: var(--es-grigio);
	font-family: var(--es-sans); font-size: 14px; font-weight: 700; text-transform: none; letter-spacing: 0;
	transition: background .2s, color .2s;
}
.es-site .es-apertura__comandi button:hover { background: var(--es-grigio); color: var(--es-bianco); }

/* 03b Apertura a tutto schermo su desktop -------------------
   Video e foto riempiono l'area sotto l'header come un'immagine 16:9
   "cover" ancorata al 30% dall'alto. --W e --H sono le misure
   dell'immagine intera, --offX e --offY la parte tagliata: video, foto
   e testi usano le stesse coordinate, così i testi restano sulla parete
   libera sopra la testata (y 75–342 su 1920×1080). A sinistra si allineano al
   contenuto dell'header di Flatsome (contenitore 1728 + 15 px): sulla foto in
   alta, con la lampada a destra, il bianco ha da 4,9:1 a 6,3:1 di contrasto
   fra 1366 e 2560 px e non tocca mai il letto. */
@media (min-width: 1100px) and (min-aspect-ratio: 4 / 3) {
	.es-site .es-apertura {
		--barra: 56px;
		--altezza: calc(100vh - var(--es-header) - var(--barra));
		--W: max(100vw, calc(var(--altezza) * 16 / 9));
		--H: calc(var(--W) * 9 / 16);
		--offX: calc((var(--W) - 100vw) / 2);
		--offY: calc((var(--H) - var(--altezza)) * .3);
		/* bordo sinistro del contenuto dell'header di Flatsome */
		--es-allinea-header: var(--es-allinea);
		padding: 0 !important;
	}
	.es-site .es-apertura .section-content > .row { position: relative; display: block; width: 100%; max-width: none; height: calc(var(--altezza) + var(--barra)); min-height: 0; margin: 0; }
	.es-site .es-apertura .row > .col.es-apertura__media { position: absolute; inset: 0; width: auto; max-width: none; flex: none; padding: 0; }
	.es-site .es-apertura__media > .col-inner { position: static; height: 100%; }
	.es-site .es-apertura__cornice { position: absolute; left: 0; right: 0; top: 0; height: var(--altezza); aspect-ratio: auto; background: #3c4650; }
	.es-site .es-apertura__cornice video, .es-site .es-apertura__foto { right: auto; bottom: auto; left: calc(-1 * var(--offX)); top: calc(-1 * var(--offY)); width: var(--W); height: var(--H); max-width: none; object-fit: fill; }
	.es-site .es-apertura .row > .col.es-apertura__testi {
		position: absolute; z-index: 3; padding: 0; flex: none; max-width: none;
		left: var(--es-allinea-header); top: calc(var(--H) * .07 - var(--offY)); width: calc(var(--W) * .44);
		text-shadow: 0 1px 14px rgba(20, 24, 28, .25);
	}
	.es-site .es-apertura__testi > .col-inner > * { margin-bottom: calc(var(--W) * .0075); }
	.es-site .es-apertura__testi .es-titolo--hero, .es-site .es-apertura__testi .es-titolo--hero :is(h1, h2, p) { color: var(--es-bianco); font-size: calc(var(--W) * .04); line-height: 1; white-space: nowrap; }
	.es-site .es-apertura__testi .es-claim, .es-site .es-apertura__testi .es-claim p { color: rgba(255, 255, 255, .86); font-size: calc(var(--W) * .0156); }
	.es-site .es-apertura__testi .kw-lead, .es-site .es-apertura__testi .kw-lead p { color: rgba(255, 255, 255, .92); font-size: calc(var(--W) * .0094); max-width: calc(var(--W) * .34); margin: 0; }
	.es-site .es-apertura__testi .button { font-size: calc(var(--W) * .0078); min-height: calc(var(--W) * .026); line-height: calc(var(--W) * .026); padding: 0 calc(var(--W) * .0125); margin: calc(var(--W) * .004) calc(var(--W) * .006) 0 0; text-shadow: none; }
	.es-site .es-apertura__secondario { border-color: var(--es-bianco) !important; color: var(--es-bianco) !important; }
	.es-site .es-apertura__secondario:hover { background: var(--es-bianco) !important; color: var(--es-grigio) !important; }
	.es-site .es-apertura .es-didascalia { position: absolute; left: var(--es-margine); right: var(--es-margine); bottom: 0; height: var(--barra); display: flex; align-items: center; margin: 0; }
	.es-site .es-apertura .es-didascalia p { margin: 0; }
}

/* 04 Da dove parti? (trattamento della copertina del brand book) */
.es-site .es-percorso { display: flex; flex-direction: column; height: 100%; text-decoration: none; color: var(--es-bianco); }
.es-site .es-percorso:hover { color: var(--es-bianco); }
.es-site .es-percorso__banda { background: var(--es-rosso); padding: 32px 28px 28px; min-height: 210px; display: flex; flex-direction: column; justify-content: space-between; gap: 18px; transition: background var(--kw-durata, .3s); }
.es-site .es-percorso:hover .es-percorso__banda { background: var(--es-rosso-sc); }
.es-site .es-percorso__banda strong { font-size: clamp(40px, 3vw, 64px); line-height: 1; font-weight: 700; font-style: italic; text-transform: lowercase; }
.es-site .es-percorso__banda span { font-size: clamp(15px, .9vw, 18px); line-height: 1.5; max-width: 380px; }
.es-site .es-percorso__foto { position: relative; overflow: hidden; aspect-ratio: 4 / 3; background: var(--es-carta); }
.es-site .es-percorso__foto::before { content: ""; position: absolute; left: 28px; top: 0; z-index: 1; width: 2px; height: 72px; background: var(--es-bianco); }
.es-site .es-percorso__foto img { width: 100%; height: 100%; object-fit: cover; filter: grayscale(1) brightness(1.12) contrast(.92); opacity: .9; transition: filter .6s, opacity .6s, transform .8s var(--es-curva); }
.es-site .es-percorso:hover .es-percorso__foto img { filter: none; opacity: 1; transform: scale(1.03); }

/* 05 Trova la tua rete (es-trova-rete.js) ------------------ */
.es-site .es-trova fieldset { border: 0; margin: 0 0 36px; padding: 0; }
.es-site .es-trova legend { font-size: clamp(18px, 1.15vw, 23px); font-weight: 700; margin-bottom: 14px; padding: 0; color: var(--es-grigio); }
.es-site .es-trova legend b { color: var(--es-rosso); font-style: italic; margin-right: 10px; }
.es-site .es-scelte { display: flex; flex-wrap: wrap; gap: 10px; }
.es-site .es-scelta { position: relative; margin: 0; }
.es-site .es-scelta input { position: absolute; opacity: 0; width: 1px; height: 1px; margin: 0; }
.es-site .es-scelta span {
	display: inline-flex; align-items: center; min-height: 52px; padding: 0 22px; cursor: pointer;
	background: var(--es-bianco); border: 1px solid var(--es-filetto); color: var(--es-grigio);
	font-size: clamp(15px, .85vw, 17px); font-weight: 600; transition: background .2s, color .2s, border-color .2s;
}
.es-site .es-scelta span:hover { border-color: var(--es-grigio); }
.es-site .es-scelta input:checked + span { background: var(--es-grigio); border-color: var(--es-grigio); color: var(--es-bianco); }
.es-site .es-scelta input:focus-visible + span { outline: 2px solid var(--es-rosso); outline-offset: 3px; }
.es-site .es-esito { background: var(--es-bianco); display: flex; flex-direction: column; min-height: 640px; }
.es-site .es-esito__foto { position: relative; flex: 1 1 auto; min-height: 380px; overflow: hidden; background: var(--es-carta); }
.es-site .es-esito__foto img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: opacity .5s ease, transform 1.2s var(--es-curva); }
.es-site .es-esito__foto img.is-uscita { opacity: 0; transform: scale(1.04); }
.es-site .es-esito__badge { position: absolute; left: 0; top: 0; z-index: 1; background: var(--es-rosso); color: var(--es-bianco); padding: 10px 18px; font-size: 15px; font-weight: 700; font-style: italic; text-transform: lowercase; }
.es-site .es-esito__testo { padding: clamp(24px, 2.2vw, 44px); display: flex; flex-direction: column; gap: 12px; }
.es-site .es-esito__nome { margin: 0; font-size: clamp(36px, 3vw, 64px); line-height: 1; font-weight: 700; font-style: italic; text-transform: lowercase; color: var(--es-rosso); }
.es-site .es-esito__descr { margin: 0; font-size: clamp(16px, 1vw, 20px); max-width: 640px; color: var(--es-testo); }
.es-site .es-esito__anche, .es-site .es-esito__nota { margin: 0; font-size: 15px; color: var(--es-testo); }
.es-site .es-esito__nota { border-top: 1px solid var(--es-filetto); padding-top: 14px; }
.es-site .es-esito [hidden] { display: none !important; }

/* 06 Il sistema cdbed: strati a scorrimento (es-strati.js) --
   La riga .es-strati__griglia resta ferma (GSAP ScrollTrigger del
   kit, oppure position: sticky se GSAP non c'è) mentre il disegno
   avanza. Le regole vanno sulla classe della riga, non su
   ".section-content > .row": quando GSAP la fissa la avvolge in un
   pin-spacer e il selettore di figlio diretto non vale più. Niente classe Flatsome "relative" su questa sezione:
   la sua regola !important blocca il fissaggio di GSAP.            */
.es-site .es-strati__griglia { height: calc(100vh - var(--es-header)); height: calc(100svh - var(--es-header)); max-width: none; align-items: stretch; }
.es-site .es-strati__disegno-col > .col-inner { position: relative; height: 100%; }
.es-site .es-strati__disegno { position: absolute; inset: 0; }
.es-site .es-strati__disegno svg { width: 100%; height: 100%; display: block; overflow: visible; }
.es-site .es-strati__disegno g[data-k] { will-change: transform, opacity; }
.es-site .es-strati .bl-t { font-size: 16px; font-weight: 700; }
.es-site .es-strati .bl-d { font-size: 13px; font-weight: 400; }
.es-site .es-strati .bl-end { text-anchor: end; }
.es-site .es-strati .bl-mid { text-anchor: middle; }
.es-site .es-strati__etichette { color: var(--es-grigio); fill: var(--es-grigio); font-family: var(--es-sans); }
.es-site .es-fasi ol { list-style: none; margin: 0; padding: 0; }
.es-site .es-fasi li { display: flex; gap: 16px; align-items: baseline; margin: 0; padding: 12px 0; border-top: 1px solid var(--es-filetto); color: #8a8d91; transition: color .3s, border-color .3s; }
.es-site .es-fasi li b { font-size: 15px; font-style: italic; width: 26px; flex: 0 0 auto; }
.es-site .es-fasi li strong { display: block; font-size: 19px; font-weight: 700; }
.es-site .es-fasi li small { display: block; font-size: 13px; }
.es-site .es-fasi li.is-fatta { color: var(--es-grigio); }
.es-site .es-fasi li.is-attiva { color: var(--es-rosso); border-top-color: var(--es-rosso); }
.es-site .es-strati__barra { position: absolute; left: 0; right: 0; bottom: 0; height: 3px; background: var(--es-filetto); }
.es-site .es-strati__barra span { display: block; height: 3px; width: 0; background: var(--es-rosso); }
/* stato iniziale gestito dallo script: senza JS si vede tutto */
.es-site .es-strati.is-pronta .es-strati__fine, .es-site .es-strati.is-pronta .es-strati__azione { opacity: 0; }
.es-site .es-strati.is-statica .es-fasi, .es-site .es-strati.is-statica .es-strati__barra { display: none; }
.es-site .es-strati.is-statica .es-strati__griglia { height: auto; }
.es-site .es-strati.is-statica .es-strati__disegno { position: relative; aspect-ratio: 1250 / 920; }

/* 07 Letti cdbed: fila orizzontale a tutta altezza (es-orizzontale.js)
   La riga occupa tutto lo spazio sotto l'header e resta ferma; la fila
   stampata da [es_fila_modelli] scorre in orizzontale. */
.es-site .es-letti { background: var(--es-grigio); padding: 0 !important; }
.es-site .es-letti__riga { position: relative; height: calc(100vh - var(--es-header)); height: calc(100svh - var(--es-header)); max-width: none; margin: 0; overflow: hidden; }
.es-site .es-letti .row > .col { padding: 0; flex: 0 0 100%; max-width: 100%; height: 100%; }
.es-site .es-letti .col-inner { height: 100%; }
.es-site .es-fila { list-style: none; height: 100%; margin: 0; padding: 0; display: flex; align-items: stretch; gap: 10px; will-change: transform; }
.es-site .es-fila > li { margin: 0; height: 100%; flex: 0 0 auto; }
.es-site .es-fila__intro { flex-basis: clamp(320px, 28vw, 560px) !important; display: flex; flex-direction: column; justify-content: center; gap: 22px; padding: 0 clamp(24px, 3vw, 64px) 0 var(--es-margine); color: var(--es-bianco); }
.es-site .es-fila__linea { display: block; width: 3px; height: clamp(64px, 8vh, 120px); background: var(--es-bianco); }
.es-site .es-fila__testo { margin: 0; font-size: clamp(17px, 1.1vw, 22px); color: #eceded; max-width: 460px; }
.es-site .es-fila__link { color: var(--es-bianco); align-self: flex-start; }
.es-site .es-pannello { position: relative; display: block; height: 100%; aspect-ratio: 849 / 620; overflow: hidden; color: var(--es-bianco); text-decoration: none; background: var(--es-grigio-sc); }
.es-site .es-pannello:hover { color: var(--es-bianco); }
.es-site .es-pannello img { width: 100%; height: 100%; object-fit: cover; transform: scale(1.02); transition: transform 1.2s var(--es-curva); }
.es-site .es-pannello:hover img { transform: scale(1.06); }
.es-site .es-pannello::after { content: ""; position: absolute; inset: 0; background: linear-gradient(to top, rgba(40, 41, 43, .7) 0%, rgba(40, 41, 43, 0) 34%); }
.es-site .es-pannello__testo { position: absolute; z-index: 1; left: clamp(20px, 2.4vw, 48px); right: clamp(20px, 2.4vw, 48px); bottom: clamp(28px, 4vh, 56px); display: flex; justify-content: space-between; align-items: flex-end; gap: 16px; }
.es-site .es-pannello__testo strong { display: block; font-size: clamp(44px, 4.6vw, 100px); line-height: .92; font-weight: 700; font-style: italic; text-transform: lowercase; }
.es-site .es-pannello__testo em { display: block; font-style: normal; font-size: clamp(14px, .85vw, 17px); margin-top: 8px; color: #eceded; }
.es-site .es-pannello__freccia { width: 56px; height: 56px; flex: 0 0 auto; border: 1px solid rgba(255, 255, 255, .7); display: flex; align-items: center; justify-content: center; font-size: 22px; transition: background .3s, color .3s; }
.es-site .es-pannello:hover .es-pannello__freccia { background: var(--es-bianco); color: var(--es-grigio); }
.es-site .es-letti__avanzamento { position: absolute; z-index: 2; left: 0; right: 0; bottom: 0; height: 4px; background: rgba(255, 255, 255, .22); }
.es-site .es-letti__avanzamento span { display: block; height: 4px; width: 0; background: var(--es-bianco); }
/* movimento ridotto: fila da scorrere a mano */
.es-site .es-letti.is-manuale .es-letti__riga { height: min(86vh, 900px); }
.es-site .es-letti.is-manuale .es-fila { overflow-x: auto; scroll-snap-type: x mandatory; }
.es-site .es-letti.is-manuale .es-fila > li { scroll-snap-align: start; }

/* 08 Perché Essedue ---------------------------------------- */
.es-site .es-verticale { writing-mode: vertical-rl; transform: rotate(180deg); font-size: clamp(64px, 5.6vw, 120px); line-height: .9; font-weight: 700; font-style: italic; color: var(--es-rosso); white-space: nowrap; border-left: 2px solid var(--es-rosso); padding-left: 22px; margin: 0; }
.es-site .es-citazione, .es-site .es-citazione p { margin: 0; font-size: clamp(30px, 2.6vw, 54px); line-height: 1.2; font-weight: 400; color: var(--es-grigio); }
.es-site .es-citazione em { font-style: italic; font-weight: 700; color: var(--es-rosso); }
.es-site .es-punti ul { list-style: none; margin: 0; padding: 0; border-bottom: 1px solid var(--es-filetto); }
.es-site .es-punti li { margin: 0; padding: 18px 0; border-top: 1px solid var(--es-filetto); }
.es-site .es-punti strong { display: block; font-size: 17px; color: var(--es-grigio); }
.es-site .es-punti span { display: block; font-size: 14px; color: var(--es-testo); margin-top: 2px; }

/* 09 Fascia rivenditori ------------------------------------ */
.es-site .es-rivenditori { background: var(--es-rosso); color: var(--es-bianco); }
.es-site .es-cerca { display: flex; }
.es-site .es-cerca input[type="text"] { flex: 1; min-width: 0; height: 56px; margin: 0; padding: 0 18px; border: 0; border-radius: 0; box-shadow: none; font-size: 16px; }
.es-site .es-cerca button { height: 56px; margin: 0; padding: 0 28px; border: 0; border-radius: 0; background: var(--es-grigio); color: var(--es-bianco); font-size: 15px; font-weight: 700; text-transform: none; letter-spacing: 0; }

/* 10 Didascalie e dettagli --------------------------------- */
.es-site .es-didascalia, .es-site .es-didascalia p { margin: 14px 0 0; font-size: 15px; color: var(--es-testo); }
.es-site .es-didascalia strong { font-size: 18px; font-weight: 700; font-style: italic; color: var(--es-rosso); margin: 0 8px; }
.es-site .es-didascalia small { font-size: 13px; }

/* 11 Responsive e movimento ridotto ------------------------ */
@media (max-width: 849px) {
	.es-site { --es-header: 64px; }
	.es-site .es-apertura .section-content > .row { min-height: 0; }
	.es-site .es-esito { min-height: 0; }
	.es-site .es-esito__foto { min-height: 0; aspect-ratio: 4 / 3; flex: 0 0 auto; }
	.es-site .es-fila { gap: 8px; }
	.es-site .es-fila__intro { flex-basis: 84vw !important; padding-right: 24px; }
	.es-site .es-pannello { width: 86vw; aspect-ratio: auto; }
	.es-site .es-pannello__testo { bottom: calc(28px + env(safe-area-inset-bottom, 0px)); }
	.es-site .es-pannello__freccia { width: 48px; height: 48px; }
	/* strati su telefono: titolo e fase in alto, il disegno occupa il resto */
	.es-site .es-strati__griglia { display: flex; flex-direction: column; flex-wrap: nowrap; }
	.es-site .es-strati .row > .es-strati__colonna { flex: 0 0 auto; padding-bottom: 8px; }
	.es-site .es-strati .row > .es-strati__disegno-col { flex: 1 1 auto; min-height: 0; padding-bottom: 12px; }
	.es-site .es-strati__colonna .es-titolo { margin-bottom: 8px; }
	.es-site .es-strati__colonna .es-titolo :is(h2, p) { font-size: 34px; }
	.es-site .es-verticale { writing-mode: horizontal-tb; transform: none; font-size: 56px; border-left: 0; padding-left: 0; }
	.es-site .es-strati__etichette { display: none; }
	.es-site .es-fasi li { display: none; border-top: 0; padding: 0; }
	.es-site .es-fasi li.is-attiva { display: flex; }
}
@media (prefers-reduced-motion: reduce) {
	.es-site .es-percorso__foto img, .es-site .es-pannello img, .es-site .es-esito__foto img { transition: none; }
}

/* 06b Colonna del sistema cdbed: elenco e testo finale nella stessa cella,
   uno svanisce mentre l'altro compare */
.es-site .es-strati__colonna > .col-inner { display: grid; align-content: center; }
.es-site .es-strati__colonna .es-titolo { grid-row: 1; grid-column: 1; margin-bottom: 28px; }
.es-site .es-strati__colonna .es-fasi,
.es-site .es-strati__colonna .es-strati__fine { grid-row: 2; grid-column: 1; align-self: start; }
.es-site .es-strati__colonna .es-strati__azione { grid-row: 3; grid-column: 1; justify-self: start; margin-top: 20px; }
.es-site .es-strati__fine .es-claim { margin-bottom: 12px; }
.es-site .es-strati.is-finale .es-fasi, .es-site .es-strati.is-statica .es-fasi { display: none; }
.es-site .es-strati__griglia { position: relative; background: var(--kw-titolo-chiaro, #FFFFFF); }


/* 12 Catalogo: filtri e schede delle composizioni ---------
   Barra stampata da es_barra_filtri() (inc/es-catalogo.php). */
.es-site .es-filtri { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 36px; margin: 0 0 32px; padding: 0 0 22px; border-bottom: 1px solid var(--es-filetto); }
.es-site .es-filtri__apri, .es-site .es-filtri__testa, .es-site .es-filtri__piede, .es-site .es-filtri__sfondo { display: none; }
.es-site .es-filtri__pannello { display: contents; }
.es-site .es-filtri__gruppo { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.es-site .es-filtri__etichetta { margin-right: 6px; font-weight: 700; font-style: italic; text-transform: lowercase; color: var(--es-rosso); }
.es-site .es-chip {
	min-height: 42px; margin: 0; padding: 0 16px; border: 1px solid var(--es-filetto); border-radius: 0; background: var(--es-bianco);
	color: var(--es-grigio); font-family: var(--es-sans); font-size: 15px; font-weight: 600; line-height: 1; text-transform: none; letter-spacing: 0; cursor: pointer;
	transition: background .2s, color .2s, border-color .2s;
}
.es-site .es-chip:hover { border-color: var(--es-grigio); }
.es-site .es-chip[aria-pressed="true"] { background: var(--es-grigio); border-color: var(--es-grigio); color: var(--es-bianco); }
.es-site .es-filtri__stato { margin-left: auto; display: flex; align-items: center; gap: 18px; }
.es-site .es-filtri__conteggio { margin: 0; font-size: 15px; color: var(--es-testo); }
.es-site .es-filtri__azzera {
	min-height: 42px; margin: 0; padding: 0; border: 0; background: none; cursor: pointer;
	color: var(--es-rosso); font-family: var(--es-sans); font-size: 15px; font-weight: 700; text-transform: none; letter-spacing: 0;
	text-decoration: underline; text-underline-offset: 4px;
}
.es-site .es-filtri [hidden] { display: none !important; }
.es-site .products .product.es-nascosta { display: none !important; }
.es-site .product-small .name.product-title, .es-site .product-small .product-title a { font-size: 19px; font-weight: 700; color: var(--es-grigio); }
.es-site .es-scheda-riga { margin: 4px 0 0; font-size: 14px; line-height: 1.45; color: var(--es-testo); }
.es-site .es-scheda-misura { margin: 2px 0 0; font-size: 13px; color: #6c6f73; }

/* 13 Scheda della composizione ----------------------------- */
.es-site .es-prodotto .product-title { font-size: clamp(36px, 3vw, 56px); line-height: 1; font-weight: 700; color: var(--es-grigio); margin-bottom: 14px; }
.es-site .es-prodotto .product-short-description, .es-site .es-prodotto .product-short-description p { font-size: clamp(16px, 1vw, 19px); color: var(--es-testo); }
.es-site .es-prodotto__pannello .button { width: 100%; justify-content: center; margin: 0 0 10px; }
.es-site .es-prodotto__finiture p { font-size: 14px; color: var(--es-testo); margin: 6px 0 0; }
.es-site .es-distinta { margin: 22px 0 26px; padding: 0; border-top: 1px solid var(--es-filetto); }
.es-site .es-distinta__nota { padding: 10px 0; font-size: 13px; color: var(--es-testo); border-bottom: 1px solid var(--es-filetto); }
.es-site .es-distinta__riga { display: grid; grid-template-columns: 110px 1fr; gap: 16px; padding: 14px 0; border-bottom: 1px solid var(--es-filetto); }
.es-site .es-distinta dt { margin: 0; font-weight: 700; font-style: italic; text-transform: lowercase; color: var(--es-rosso); }
.es-site .es-distinta dd { margin: 0; display: flex; flex-wrap: wrap; gap: 2px 10px; align-items: baseline; color: var(--es-grigio); }
.es-site .es-distinta dd strong { font-size: 17px; }
.es-site .es-distinta dd small { flex-basis: 100%; font-size: 13px; color: var(--es-testo); }
.es-site .es-distinta__riga--design dd span { color: var(--es-testo); }
.es-site .es-prodotto__basso .accordion { margin-top: 28px; border-top: 1px solid var(--es-filetto); }
.es-site .es-prodotto__basso .accordion-title { padding: 18px 0; font-size: 18px; font-weight: 700; border-top: 0; border-bottom: 1px solid var(--es-filetto); }
.es-site .es-prodotto__basso .accordion-inner { padding: 6px 0 24px; }
.es-site .es-aiuto { background: var(--es-carta); padding: 28px; }
.es-site .es-titolo--piccolo, .es-site .es-titolo--piccolo :is(h2, h3, p) { font-size: clamp(26px, 2vw, 36px); }
.es-site .es-barra-prodotto { display: none; }

/* 14 Testata del modello e "componi" ----------------------- */
.es-site .es-modello__disegno { background: var(--es-carta); }
.es-site .es-occhiello, .es-site .es-occhiello p { margin: 0 0 6px; font-weight: 700; font-style: italic; text-transform: lowercase; color: var(--es-rosso); }
.es-site .es-specifiche dl { margin: 22px 0; border-top: 1px solid var(--es-filetto); }
.es-site .es-specifiche dl > div { display: grid; grid-template-columns: 140px 1fr; gap: 16px; padding: 12px 0; border-bottom: 1px solid var(--es-filetto); }
.es-site .es-specifiche dt { margin: 0; font-weight: 700; color: var(--es-grigio); }
.es-site .es-specifiche dd { margin: 0; color: var(--es-testo); }
.es-site .es-passo { height: 100%; padding: 30px 28px; border: 1px solid var(--es-filetto); background: var(--es-bianco); }
.es-site .es-passo b { display: block; font-size: 15px; font-style: italic; color: var(--es-rosso); }
.es-site .es-passo h3 { margin: 8px 0 10px; font-size: 24px; font-weight: 700; font-style: italic; text-transform: lowercase; color: var(--es-grigio); }
.es-site .es-passo p { color: var(--es-testo); }

/* 15 Contatti e moduli -------------------------------------
   I moduli li disegna il kit (kw-form): qui recapiti e poco altro. */
.es-site .es-recapiti dl { margin: 24px 0; border-top: 1px solid var(--es-filetto); }
.es-site .es-recapiti dl > div { display: grid; grid-template-columns: 110px 1fr; gap: 16px; padding: 14px 0; border-bottom: 1px solid var(--es-filetto); }
.es-site .es-recapiti dt { margin: 0; font-weight: 700; font-style: italic; text-transform: lowercase; color: var(--es-rosso); }
.es-site .es-recapiti dd { margin: 0; color: var(--es-grigio); }
.es-site .es-recapiti a { color: var(--es-grigio); font-weight: 700; }
.es-site .es-modulo__nota { font-size: 14px; color: var(--es-testo); margin: 0 0 18px; }
/* griglia, consenso e invio sono del kit (kw-form__grid, kw-campo--full, kw-consenso,
   kw-form__invio); qui solo le etichette, minuscole come nel resto del sito */
.es-site .kw-form .kw-form__grid label { font-size: 15px; letter-spacing: 0; text-transform: none; color: var(--es-grigio); }
.es-site .kw-form label small { font-weight: 400; color: var(--es-testo); }

/* 16 Megamenu ------------------------------------------------
   Blocchi UX assegnati alle voci Reti e Letti (dropdown "Block"). */
.es-site .es-mega { max-height: calc(100vh - var(--es-header) - 24px); overflow-y: auto; }
.es-site .es-mega__titolo, .es-site .es-mega__titolo p { margin: 0 0 12px; font-size: 18px; font-weight: 700; font-style: italic; text-transform: lowercase; color: var(--es-rosso); }
.es-site .es-modelli { list-style: none; margin: 0 0 22px; padding: 0; }
.es-site .es-modelli li { margin: 0; }
.es-site .es-modelli__voce { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; padding: 7px 0; color: var(--es-grigio); text-decoration: none; border-bottom: 1px solid var(--es-filetto); }
.es-site .es-modelli__voce:hover { color: var(--es-rosso); }
.es-site .es-modelli__nome { font-weight: 600; }
.es-site .es-modelli__conteggio { font-size: 12px; color: #6c6f73; white-space: nowrap; }
.es-site .es-modelli--schede { display: grid; grid-template-columns: repeat(4, 1fr); gap: 18px; }
.es-site .es-modelli--schede .es-modelli__voce { display: block; border: 0; padding: 0; }
.es-site .es-modelli__img { display: block; aspect-ratio: 4 / 3; overflow: hidden; background: var(--es-carta); margin-bottom: 8px; }
.es-site .es-modelli__img img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s var(--es-curva); }
.es-site .es-modelli__voce:hover .es-modelli__img img { transform: scale(1.04); }
.es-site .es-modelli--schede .es-modelli__nome { display: block; font-size: 17px; font-weight: 700; font-style: italic; text-transform: lowercase; }
.es-site .es-mega__evidenza .es-didascalia p { margin-top: 10px; }

/* 17 Piede ----------------------------------------------------- */
.es-site .es-piede { color: #e6e7e8; }
.es-site .es-piede__titolo, .es-site .es-piede__titolo p { margin: 0 0 12px; font-size: 20px; font-weight: 700; font-style: italic; text-transform: lowercase; color: var(--es-bianco); }
.es-site .es-piede__claim p { color: #e6e7e8; font-size: 15px; }
.es-site .es-piede .ux-menu-link__link, .es-site .es-piede a { color: #e6e7e8; }
.es-site .es-piede .ux-menu-link__link:hover, .es-site .es-piede a:hover { color: var(--es-bianco); }
.es-site .es-piede__legale { border-top: 1px solid #6c6e72; margin-top: 24px; padding-top: 20px; }
.es-site .es-piede__legale p { margin: 0 0 4px; font-size: 13px; color: #d4d5d7; }

/* 18 Mobile: scheda, catalogo, moduli ------------------------
   Pulsanti da almeno 44 px, niente zoom dei campi su iPhone (16 px),
   azioni principali sempre a portata di pollice. */
html.es-blocca-scroll { overflow: hidden; }
@media (max-width: 849px) {
	/* catalogo: pulsante "filtra" e pannello dal basso */
	.es-site .es-filtri { flex-wrap: nowrap; gap: 14px; margin-bottom: 20px; padding-bottom: 14px; }
	.es-site .es-filtri__apri {
		display: inline-flex; align-items: center; min-height: 46px; margin: 0; padding: 0 20px; border: 1px solid var(--es-grigio); border-radius: 0;
		background: var(--es-bianco); color: var(--es-grigio); font-family: var(--es-sans); font-size: 16px; font-weight: 700; text-transform: none; letter-spacing: 0;
	}
	.es-site .es-filtri__stato { gap: 12px; }
	.es-site .es-filtri__attivi { margin-left: 5px; }
	.es-site .es-filtri__pannello {
		display: flex; flex-direction: column; gap: 22px; position: fixed; left: 0; right: 0; bottom: 0; z-index: 1001;
		max-height: 85vh; overflow-y: auto; padding: 20px 20px calc(20px + env(safe-area-inset-bottom, 0px));
		background: var(--es-bianco); box-shadow: 0 -12px 32px rgba(40, 41, 43, .18);
		transform: translateY(105%); visibility: hidden; transition: transform .3s var(--es-curva), visibility 0s .3s;
	}
	.es-site .es-filtri.is-aperto .es-filtri__pannello { transform: none; visibility: visible; transition: transform .3s var(--es-curva); }
	.es-site .es-filtri__sfondo:not([hidden]) { display: block; position: fixed; inset: 0; z-index: 1000; background: rgba(40, 41, 43, .45); }
	.es-site .es-filtri__testa { display: flex; justify-content: space-between; align-items: center; }
	.es-site .es-filtri__titolo { margin: 0; font-size: 22px; font-weight: 700; font-style: italic; text-transform: lowercase; color: var(--es-rosso); }
	.es-site .es-filtri__chiudi { width: 46px; height: 46px; margin: 0; padding: 0; border: 0; background: none; font-size: 30px; line-height: 1; color: var(--es-grigio); }
	.es-site .es-filtri__gruppo { gap: 8px; }
	.es-site .es-filtri__etichetta { flex-basis: 100%; font-size: 17px; }
	.es-site .es-chip { min-height: 46px; font-size: 16px; }
	.es-site .es-filtri__piede { display: block; position: sticky; bottom: 0; background: var(--es-bianco); padding-top: 6px; }
	.es-site .es-filtri__mostra {
		width: 100%; min-height: 52px; margin: 0; border: 0; border-radius: 0; background: var(--es-rosso); color: var(--es-bianco);
		font-family: var(--es-sans); font-size: 16px; font-weight: 700; text-transform: none; letter-spacing: 0;
	}
	.es-site .es-filtri__conteggio { font-size: 14px; }
	/* schede del catalogo: immagine grande, testo leggibile */
	.es-site .product-small .name.product-title, .es-site .product-small .product-title a { font-size: 18px; }

	/* scheda: galleria a tutta larghezza, azioni nella barra in basso */
	.es-site .es-prodotto { padding-top: 0 !important; }
	.es-site .es-prodotto__alto > .es-prodotto__media { padding-left: 0; padding-right: 0; padding-bottom: 16px; }
	.es-site .es-prodotto__pannello .es-prodotto__cta { display: none; }
	.es-site .es-distinta__riga { grid-template-columns: 92px 1fr; gap: 12px; }
	.es-site .es-prodotto__basso .accordion-title { min-height: 52px; display: flex; align-items: center; }
	.es-site .es-barra-prodotto {
		display: grid; grid-template-columns: 1fr 52px; gap: 10px; position: fixed; left: 0; right: 0; bottom: 0; z-index: 999;
		padding: 10px 14px calc(10px + env(safe-area-inset-bottom, 0px)); background: var(--es-bianco);
		border-top: 1px solid var(--es-filetto); box-shadow: 0 -6px 18px rgba(40, 41, 43, .08);
	}
	.es-site .es-barra-prodotto .button { width: 100%; min-height: 52px; margin: 0; justify-content: center; }
	.es-site .es-barra-prodotto__icona { display: flex; align-items: center; justify-content: center; width: 52px; height: 52px; border: 1px solid var(--es-grigio); color: var(--es-grigio); }
	body.single-product.es-site { padding-bottom: calc(76px + env(safe-area-inset-bottom, 0px)); }


	/* megamenu e piede */
	.es-site .es-modelli--schede { grid-template-columns: 1fr 1fr; }
	.es-site .es-piede .ux-menu-link__link { min-height: 44px; display: flex; align-items: center; }
}

/* 19 Strati su telefono: didascalia con linea indicatrice (es-strati.js) */
.es-site .es-strati__griglia { position: relative; }
.es-site .es-guida { display: none; }
@media (max-width: 849px) {
	.es-site .es-strati .es-fasi { display: none; }
	.es-site .es-guida { display: block; position: absolute; inset: 0; z-index: 3; pointer-events: none; opacity: 0; transition: opacity .25s; }
	.es-site .es-guida__linee { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; }
	.es-site .es-guida__linee line { stroke: var(--es-rosso); stroke-width: 1.5; }
	.es-site .es-guida__linee circle { fill: var(--es-rosso); }
	.es-site .es-guida__linee .es-guida__attacco { fill: var(--es-bianco); stroke: var(--es-rosso); stroke-width: 1.5; }
	.es-site .es-guida__testo {
		position: absolute; left: 0; top: 0; max-width: min(300px, 80vw); padding: 10px 14px 11px;
		background: rgba(255, 255, 255, .94); border-left: 3px solid var(--es-rosso);
		display: grid; grid-template-columns: auto 1fr; column-gap: 10px; align-items: baseline;
		transition: transform .35s var(--es-curva);
	}
	.es-site .es-guida__testo b { grid-row: 1 / span 2; font-size: 15px; font-style: italic; color: var(--es-rosso); }
	.es-site .es-guida__testo strong { font-size: 18px; line-height: 1.2; color: var(--es-grigio); }
	.es-site .es-guida__testo small { font-size: 13px; color: var(--es-testo); }

	/* trova la tua rete: risposte su una riga, scorrono di lato se non ci stanno */
	.es-site .es-trova legend { font-size: 16px; margin-bottom: 8px; }
	.es-site .es-scelte {
		flex-wrap: nowrap; overflow-x: auto; gap: 6px; scrollbar-width: none; -webkit-overflow-scrolling: touch;
		margin-right: calc(-1 * var(--es-margine)); padding-right: var(--es-margine);
	}
	.es-site .es-scelte::-webkit-scrollbar { display: none; }
	.es-site .es-scelta { flex: 0 0 auto; }
	.es-site .es-scelta span { min-height: 44px; padding: 0 12px; font-size: 14px; white-space: nowrap; }
}

/* 20 Barra titolo delle pagine (kw-barra-titolo) -------------
   Titolo di marca con la linea fino al bordo; a destra l'immagine in
   evidenza della pagina, se c'è (il kit la passa come --kw-hero-image). */
.es-site .es-barra { position: relative; overflow: hidden; background: var(--es-carta); padding: clamp(36px, 4.4vw, 84px) 0 clamp(28px, 3.4vw, 60px) !important; }
.es-site .es-barra__testi { padding-bottom: 0 !important; }
.es-site .es-barra__testi > .col-inner { display: grid; grid-template-columns: auto 1fr; column-gap: clamp(20px, 2vw, 40px); align-items: end; }
.es-site .es-barra .kw-crumbs { grid-column: 1 / -1; margin-bottom: 14px; font-size: 13px; color: var(--es-testo); }
.es-site .es-barra .kw-crumbs a { color: var(--es-testo); }
.es-site .es-barra__titolo { margin: 0; font-size: clamp(40px, 4.6vw, 96px); line-height: .95; font-weight: 700; font-style: italic; text-transform: lowercase; color: var(--es-rosso); }
.es-site .es-barra .es-linea { margin-bottom: .45em; }
@media (min-width: 850px) {
	.es-site .es-barra::after { content: ""; position: absolute; top: 0; right: 0; bottom: 0; width: 34%; background: var(--kw-hero-image, none) center / cover no-repeat; }
	.es-site .es-barra__testi { max-width: 64% !important; flex-basis: 64% !important; }
}

/* 21 Barra del catalogo (categorie e negozio) -----------------
   Foto del modello come sfondo (--es-barra-sfondo, da es-contesto.php),
   velatura scura da sinistra e dal basso, testi bianchi. La riga è quella
   normale di Flatsome: i testi partono dal bordo di header e contenuti.
   Contrasto del bianco nel caso peggiore (foto bianca dietro): almeno 6:1
   nel primo 45% della larghezza, dove stanno i testi piccoli; almeno 3:1 fino
   a tre quarti, dove può arrivare un titolo lungo. */
.es-site .es-barra-catalogo {
	position: relative; overflow: hidden; padding: 0 !important; color: var(--es-bianco);
	background: var(--es-grigio) var(--es-barra-sfondo, none) center / cover no-repeat;
}
.es-site .es-barra-catalogo::before {
	content: ""; position: absolute; inset: 0; pointer-events: none;
	background:
		linear-gradient(90deg, rgba(34, 35, 37, .86) 0%, rgba(34, 35, 37, .78) 45%, rgba(34, 35, 37, .45) 75%, rgba(34, 35, 37, .15) 100%),
		linear-gradient(0deg, rgba(34, 35, 37, .45) 0%, rgba(34, 35, 37, 0) 55%);
}
.es-site .es-barra-catalogo .section-content { position: relative; z-index: 1; }
.es-site .es-barra-catalogo__riga { min-height: clamp(360px, 46vh, 560px); align-items: flex-end !important; }
.es-site .es-barra-catalogo__testi { padding-top: clamp(48px, 6vw, 96px) !important; padding-bottom: clamp(36px, 4.4vw, 72px) !important; }
.es-site .es-barra-catalogo .kw-crumbs { margin-bottom: 18px; font-size: 13px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--es-bianco); }
.es-site .es-barra-catalogo .kw-crumbs a { color: var(--es-bianco); opacity: .85; }
.es-site .es-barra-catalogo .es-occhiello { margin: 0 0 4px; font-size: clamp(17px, 1.2vw, 22px); color: var(--es-bianco); }
.es-site .es-barra-catalogo__titolo { margin: 0; font-size: clamp(56px, 7vw, 150px); line-height: .9; font-weight: 700; font-style: italic; text-transform: lowercase; color: var(--es-bianco); }
.es-site .es-barra-catalogo__conteggio { margin: 16px 0 0; padding-left: 14px; border-left: 3px solid var(--es-rosso); font-size: 15px; font-weight: 700; color: var(--es-bianco); }
.es-site .es-barra-catalogo__descrizione { margin-top: 14px; max-width: 560px; font-size: clamp(16px, 1vw, 19px); line-height: 1.55; color: var(--es-bianco); }
.es-site .es-barra-catalogo__descrizione p { margin: 0; color: inherit; }
@media (max-width: 849px) {
	.es-site .es-barra-catalogo::before { background: linear-gradient(0deg, rgba(34, 35, 37, .88) 0%, rgba(34, 35, 37, .6) 55%, rgba(34, 35, 37, .25) 100%); }
	.es-site .es-barra-catalogo__riga { min-height: 340px; }
}

/* 22 Primo paragrafo di categorie e catalogo ----------------
   Contenuti dai campi Paragrafo 1 e Immagine 1 ([es_contesto]). */
.es-site .es-ctx { margin: 0; }
.es-site .es-ctx :is(h2, h3) { margin: 0 0 .5em; font-weight: 700; font-style: italic; text-transform: lowercase; color: var(--es-rosso); line-height: 1.05; }
.es-site .es-ctx h2 { font-size: clamp(30px, 2.6vw, 52px); }
.es-site .es-ctx h3 { font-size: clamp(22px, 1.6vw, 30px); }
.es-site .es-intro__paragrafo p { font-size: clamp(17px, 1.15vw, 22px); line-height: 1.6; color: var(--es-grigio); }
.es-site .es-intro__foto img, .es-site .es-approfondimento__foto img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; display: block; }
.es-site .es-intro__media:not(:has(.es-ctx)) { display: none; }

/* 23 Secondo paragrafo di categorie e catalogo --------------- */
.es-site .es-approfondimento__riga + .es-approfondimento__riga { margin-top: clamp(40px, 5vw, 96px); }
.es-site .es-approfondimento__paragrafo p { font-size: clamp(16px, 1vw, 19px); line-height: 1.65; color: var(--es-testo); }
.es-site .es-approfondimento__coppia > .col-inner { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(12px, 1.4vw, 24px); align-items: start; }
.es-site .es-approfondimento__foto--sfalsata { margin-top: clamp(32px, 4vw, 72px); }
.es-site .es-approfondimento__foto img { aspect-ratio: 3 / 4; }
.es-site .es-approfondimento__foto--grande img { aspect-ratio: 4 / 3; }
/* senza campi pieni righe e sezioni spariscono */
.es-site .es-intro:not(:has(.es-ctx)), .es-site .es-approfondimento:not(:has(.es-ctx)), .es-site .es-approfondimento__riga:not(:has(.es-ctx)) { display: none !important; }
@media (max-width: 849px) {
	.es-site .es-approfondimento__riga--inversa .es-approfondimento__coppia { order: -1; }
}

/* 24 Chiusura: trova il rivenditore (kw-chiusura) ------------ */
.es-site .es-chiusura { background: var(--es-rosso); color: var(--es-bianco); }
.es-site .es-chiusura__testo p { margin: 0; max-width: 520px; font-size: clamp(17px, 1.1vw, 21px); line-height: 1.55; color: var(--es-bianco); }
.es-site .es-chiusura .es-cerca { max-width: 640px; margin-left: auto; }
.es-site .es-chiusura__altro { max-width: 640px; margin: 14px 0 0 auto; }
.es-site .es-chiusura__altro a { color: var(--es-bianco); font-weight: 700; text-decoration: underline; text-underline-offset: 4px; }
@media (max-width: 849px) {
	.es-site .es-chiusura .es-cerca, .es-site .es-chiusura__altro { margin-left: 0; }
}

/* 25 Home: da dove parti? e perché essedue ------------------- */
.es-site .es-percorsi .col-inner { height: 100%; }
.es-site .es-perche .es-verticale { margin-top: 8px; }
@media (max-width: 849px) {
	.es-site .es-perche .es-verticale { writing-mode: horizontal-tb; transform: none; border-left: 0; padding-left: 0; font-size: 56px; margin-bottom: 8px; }
}

/* 03c Apertura: testi in sequenza all'avvio del video (es-apertura.js) ---
   Titolo e claim salgono da dietro una maschera (come split-lines del kit),
   poi testo e pulsanti entrano dal basso. */
.es-site .es-apertura--attesa .es-apertura__testi .col-inner > * { opacity: 0; transform: translateY(18px); }
.es-site .es-apertura--attesa .es-apertura__testi .col-inner > :is(.es-titolo, .es-claim) {
	opacity: 1; transform: none; overflow: hidden; padding: 0 .14em .16em 0; margin-bottom: -.16em;
}
.es-site .es-apertura--attesa .es-apertura__testi .col-inner > :is(.es-titolo, .es-claim) > * { transform: translateY(115%); }
.es-site .es-apertura--attesa.is-partita .es-apertura__testi .col-inner > * {
	opacity: 1; transform: none; transition: opacity .8s var(--es-curva), transform .8s var(--es-curva);
}
.es-site .es-apertura--attesa.is-partita .es-apertura__testi .col-inner > :is(.es-titolo, .es-claim) > * {
	transform: none; transition: transform 1.1s cubic-bezier(.16, .84, .3, 1);
}
.es-site .es-apertura.is-partita .es-apertura__testi .col-inner > .es-titolo > * { transition-delay: .15s; }
.es-site .es-apertura.is-partita .es-apertura__testi .col-inner > .es-claim > * { transition-delay: .8s; }
.es-site .es-apertura.is-partita .es-apertura__testi .col-inner > :nth-child(3) { transition-delay: 1.45s; }
.es-site .es-apertura.is-partita .es-apertura__testi .col-inner > :nth-child(4) { transition-delay: 2s; }
.es-site .es-apertura.is-partita .es-apertura__testi .col-inner > :nth-child(5) { transition-delay: 2.15s; }
@media (prefers-reduced-motion: reduce) {
	.es-site .es-apertura--attesa .es-apertura__testi .col-inner > *,
	.es-site .es-apertura--attesa .es-apertura__testi .col-inner > :is(.es-titolo, .es-claim) > * { opacity: 1; transform: none; transition: none; }
}

/* 06c Sistema cdbed: margini ai lati, come il resto della pagina */
.es-site .es-strati .row > .es-strati__colonna { padding-left: var(--es-allinea); }
.es-site .es-strati .row > .es-strati__disegno-col { padding-right: var(--es-allinea); }

/* 26 Header: lingua, ricerca, dove acquistare (blocco 16, es-header.js) */
.es-site .es-azioni { position: relative; display: flex; align-items: center; gap: clamp(14px, 1.6vw, 28px); }
.es-site .es-azioni__lingua { font-size: 15px; font-weight: 700; color: var(--es-grigio); text-decoration: none; letter-spacing: .02em; }
.es-site .es-azioni__lingua:hover { color: var(--es-rosso); }
.es-site .es-azioni__cerca {
	display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; margin: 0; padding: 0;
	border: 0; border-radius: 0; background: none; color: var(--es-grigio); cursor: pointer; min-height: 0;
}
.es-site .es-azioni__cerca:hover, .es-site .es-azioni.is-cerca .es-azioni__cerca { color: var(--es-rosso); }
.es-site .es-azioni__cta {
	display: inline-flex; align-items: center; gap: 10px; min-height: 48px; padding: 0 24px;
	background: var(--es-rosso); color: var(--es-bianco); border-radius: 0; text-decoration: none;
	font-family: var(--es-sans); font-size: 16px; font-weight: 700; text-transform: none; letter-spacing: 0; line-height: 1;
	transition: background .25s;
}
.es-site .es-azioni__cta:hover, .es-site .es-azioni__cta:focus-visible { background: var(--es-rosso-sc); color: var(--es-bianco); }
.es-site .es-cerca-pannello {
	position: absolute; right: 0; top: calc(100% + 18px); z-index: 1000; width: min(460px, 92vw); padding: 22px 22px 20px;
	background: var(--es-bianco); box-shadow: 0 18px 40px rgba(40, 41, 43, .16); border-top: 3px solid var(--es-rosso);
}
.es-site .es-cerca-pannello[hidden] { display: none; }
.es-site .es-cerca-pannello__etichetta { display: block; margin: 0 0 10px; font-size: 18px; font-weight: 700; font-style: italic; text-transform: lowercase; color: var(--es-rosso); }
.es-site .es-cerca-pannello__riga { display: flex; }
.es-site .es-cerca-pannello input[type="search"] {
	flex: 1; min-width: 0; height: 48px; margin: 0; padding: 0 14px; border: 1px solid var(--es-filetto); border-right: 0; border-radius: 0;
	box-shadow: none; font-size: 16px; color: var(--es-grigio); background: var(--es-bianco);
}
.es-site .es-cerca-pannello input[type="search"]:focus { border-color: var(--es-grigio); outline: none; }
.es-site .es-cerca-pannello__vai {
	height: 48px; margin: 0; padding: 0 20px; border: 0; border-radius: 0; background: var(--es-grigio); color: var(--es-bianco);
	font-size: 15px; font-weight: 700; text-transform: none; letter-spacing: 0; min-height: 0;
}
.es-site .es-cerca-pannello__vai:hover { background: var(--es-rosso); }
.es-site .es-cerca-pannello__chiudi {
	position: absolute; top: 8px; right: 8px; width: 36px; height: 36px; margin: 0; padding: 0; border: 0; background: none;
	font-size: 26px; line-height: 1; color: var(--es-grigio); min-height: 0;
}
@media (max-width: 849px) {
	.es-site .es-azioni { gap: 6px; }
	.es-site .es-azioni__lingua { display: none; }
	.es-site .es-azioni__cta { width: 44px; height: 44px; min-height: 0; padding: 0; justify-content: center; }
	.es-site .es-azioni__cta span { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
	.es-site .es-cerca-pannello { position: fixed; left: 0; right: 0; top: var(--es-header); width: auto; }
}

/* 27 Piede (blocco 08) ------------------------------------------ */
.es-site .es-piede__testa { align-items: center; padding-bottom: clamp(28px, 3vw, 48px); margin-bottom: clamp(28px, 3vw, 48px) !important; border-bottom: 1px solid rgba(255, 255, 255, .18); }
.es-site .es-piede__marchio { display: inline-block; }
.es-site .es-piede__marchio img { width: clamp(170px, 14vw, 220px); height: auto; display: block; }
.es-site .es-piede__claim p { margin: 16px 0 0; max-width: 420px; font-size: 16px; line-height: 1.55; color: #e6e7e8; }
.es-site .es-piede__social > .col-inner { display: flex; justify-content: flex-end; }
.es-site .es-piede__titolo, .es-site .es-piede__titolo p { margin: 0 0 14px; font-size: 22px; }
.es-site .es-piede .es-modelli { margin: 0 0 12px; }
.es-site .es-piede .es-modelli__voce { padding: 6px 0; border-bottom: 0; color: #e6e7e8; }
.es-site .es-piede .es-modelli__voce:hover { color: var(--es-bianco); }
.es-site .es-piede .es-modelli__nome { font-weight: 400; }
.es-site .es-piede__tutti { display: inline-block; margin-top: 4px; font-size: 14px; font-weight: 700; color: var(--es-bianco); text-decoration: underline; text-underline-offset: 4px; }
.es-site .es-piede__recapiti p { margin: 0 0 12px; font-size: 15px; line-height: 1.6; color: #e6e7e8; }
.es-site .es-piede__recapiti a { color: #e6e7e8; }
.es-site .es-piede__legale p { margin: 0; }
.es-site .es-piede__link-legali p { text-align: right; }
@media (max-width: 849px) {
	.es-site .es-piede__social > .col-inner { justify-content: flex-start; }
	.es-site .es-piede__link-legali p { text-align: left; }
	.es-site .es-piede .es-modelli__voce { min-height: 44px; display: flex; align-items: center; }
}

/* 28 Scheda prodotto unica per letti e reti (blocco 03) ------------ */
.es-site .es-rete-cert {
	display: inline-flex; align-items: center; gap: 8px; margin: 4px 0 10px; padding: 6px 12px;
	border: 1px solid var(--es-rosso); color: var(--es-rosso); font-size: 13px; font-weight: 700; letter-spacing: .02em;
}
.es-site .es-rete-cert::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: var(--es-rosso); }
.es-site .es-rete-sottotitolo { margin: 0 0 10px; font-size: 16px; color: var(--es-testo); }
.es-site .es-distinta--rete .es-distinta__riga dd strong { font-weight: 700; }
.es-site .es-campo p:last-child { margin-bottom: 0; }
.es-site .es-campo h3 { margin: 1.2em 0 .4em; font-size: 18px; font-weight: 700; font-style: italic; text-transform: lowercase; color: var(--es-rosso); }
.es-site .es-campo h3:first-child { margin-top: 0; }
.es-site .es-campo--vuoto p { color: var(--es-testo); font-style: italic; }
/* voci della fisarmonica senza contenuto per questo prodotto */
.es-site .es-prodotto .accordion-item:not(:has(.es-campo)) { display: none; }