/*!
 * fs/sezione-mosaico — la fascia «Eleganza, su misura per te».
 *
 * Due righe: sopra il claim con la foto dello showroom e il paragrafo su
 * Fausto; sotto le due sale, sposo e sposa, con le loro didascalie.
 *
 * GENERATO da post-457.css (regole congelate di Elementor) e dalla sezione
 * `body.page-id-457` di assets/css/fs-custom.css, riscrivendo gli id degli
 * elementi in classi parlanti. Le classi sono TRIPLICATE per tenere la
 * specificita' che avevano i selettori originali (0,3,0). Con due
 * `.e-con.e-flex{--flex-direction:column}` di frontend.min.css, che vale
 * altrettanto e viene dopo, vincerebbe.
 *
 * Non si modifica a mano senza aggiornare anche il blocco che stampa queste
 * classi: sono le due meta' della stessa cosa.
 */

.fs-mosaico.fs-mosaico.fs-mosaico { --display:flex; --min-height:100vh; --flex-direction:column; --container-widget-width:100%; --container-widget-height:initial; --container-widget-flex-grow:0; --container-widget-align-self:initial; --flex-wrap-mobile:wrap; --justify-content:center; --gap:28px 28px; --row-gap:28px; --column-gap:28px; --margin-top:0px; --margin-bottom:0px; --margin-left:0px; --margin-right:0px }
.fs-mosaico.fs-mosaico.fs-mosaico.e-con { --flex-grow:0; --flex-shrink:0 }
.fs-mosaico__alto.fs-mosaico__alto.fs-mosaico__alto { --display:flex; --flex-direction:row; --container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% ); --container-widget-height:100%; --container-widget-flex-grow:1; --container-widget-align-self:stretch; --flex-wrap-mobile:wrap; --justify-content:flex-start; --align-items:stretch; --gap:28px 28px; --row-gap:28px; --column-gap:28px; --margin-top:50px; --margin-bottom:0px; --margin-left:0px; --margin-right:0px }
.fs-mosaico__occhiello.fs-mosaico__occhiello.fs-mosaico__occhiello { --display:flex; --flex-direction:column; --container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% ); --container-widget-height:initial; --container-widget-flex-grow:0; --container-widget-align-self:initial; --flex-wrap-mobile:wrap; --justify-content:center; --align-items:center }
.fs-mosaico__claim.fs-mosaico__claim.fs-mosaico__claim > .elementor-widget-container { margin:0px 0px 0px 0px; padding:0px 0px 0px 0px }
.fs-mosaico__claim.fs-mosaico__claim.fs-mosaico__claim .text-wrapper { text-align:left }
.fs-mosaico__foto-sala.fs-mosaico__foto-sala.fs-mosaico__foto-sala { width:var( --container-widget-width, 33.33% ); max-width:33.33%; --container-widget-width:33.33%; --container-widget-flex-grow:0 }
.fs-mosaico__didascalia-sala.fs-mosaico__didascalia-sala.fs-mosaico__didascalia-sala .text-wrapper { text-align:left }
.fs-mosaico__testi.fs-mosaico__testi.fs-mosaico__testi { --display:flex; --flex-direction:column; --container-widget-width:100%; --container-widget-height:initial; --container-widget-flex-grow:0; --container-widget-align-self:initial; --flex-wrap-mobile:wrap; --gap:14px 14px; --row-gap:14px; --column-gap:14px; --padding-top:0px; --padding-bottom:0px; --padding-left:0px; --padding-right:0px }
.fs-mosaico__titolo.fs-mosaico__titolo.fs-mosaico__titolo.elementor-element { --align-self:center }
.fs-mosaico__titolo.fs-mosaico__titolo.fs-mosaico__titolo .text-wrapper { text-align:left }
.fs-mosaico__titolo.fs-mosaico__titolo.fs-mosaico__titolo { width:100% }
.fs-mosaico__paragrafo.fs-mosaico__paragrafo.fs-mosaico__paragrafo .text-wrapper { text-align:left }
.fs-mosaico__paragrafo.fs-mosaico__paragrafo.fs-mosaico__paragrafo { width:100% }
.fs-mosaico__basso.fs-mosaico__basso.fs-mosaico__basso { --display:flex; --flex-direction:row; --container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% ); --container-widget-height:100%; --container-widget-flex-grow:1; --container-widget-align-self:stretch; --flex-wrap-mobile:wrap; --justify-content:space-between; --align-items:stretch; --gap:28px 28px; --row-gap:28px; --column-gap:28px; --margin-top:-20px; --margin-bottom:0px; --margin-left:0px; --margin-right:0px }
.fs-mosaico__foto-sposo.fs-mosaico__foto-sposo.fs-mosaico__foto-sposo { width:var( --container-widget-width, 33.33% ); max-width:33.33%; --container-widget-width:33.33%; --container-widget-flex-grow:0 }
.fs-mosaico__didascalia-sposo.fs-mosaico__didascalia-sposo.fs-mosaico__didascalia-sposo .text-wrapper { text-align:left }
.fs-mosaico__foto-sposa.fs-mosaico__foto-sposa.fs-mosaico__foto-sposa { width:var( --container-widget-width, 33.33% ); max-width:33.33%; --container-widget-width:33.33%; --container-widget-flex-grow:0 }
.fs-mosaico__didascalia-sposa.fs-mosaico__didascalia-sposa.fs-mosaico__didascalia-sposa .text-wrapper { text-align:left }
.fs-mosaico__chiusura.fs-mosaico__chiusura.fs-mosaico__chiusura.elementor-element { --align-self:center }
.fs-mosaico__chiusura.fs-mosaico__chiusura.fs-mosaico__chiusura .text-wrapper { text-align:left }
.fs-mosaico__chiusura.fs-mosaico__chiusura.fs-mosaico__chiusura { width:33.33% }
/* End custom CSS *//* Start custom CSS for image, class: .elementor-element-4c63681 */
.fs-mosaico__foto-sala.fs-mosaico__foto-sala.fs-mosaico__foto-sala img { width:100%; aspect-ratio:16/9; object-fit:cover; display:block }
/* End custom CSS *//* Start custom CSS for image, class: .elementor-element-6152f5b */
.fs-mosaico__foto-sposo.fs-mosaico__foto-sposo.fs-mosaico__foto-sposo img { width:100%; aspect-ratio:16/9; object-fit:cover; display:block }
/* End custom CSS *//* Start custom CSS for image, class: .elementor-element-154ae30 */
.fs-mosaico__foto-sposa.fs-mosaico__foto-sposa.fs-mosaico__foto-sposa img { width:100%; aspect-ratio:16/9; object-fit:cover; display:block }
/* image, class: .elementor-element-4c63681 */
.fs-mosaico__foto-sala.fs-mosaico__foto-sala.fs-mosaico__foto-sala img { width:100%; aspect-ratio:16/9; object-fit:cover; display:block }
/* image, class: .elementor-element-6152f5b */
.fs-mosaico__foto-sposo.fs-mosaico__foto-sposo.fs-mosaico__foto-sposo img { width:100%; aspect-ratio:16/9; object-fit:cover; display:block }
/* image, class: .elementor-element-154ae30 */
.fs-mosaico__foto-sposa.fs-mosaico__foto-sposa.fs-mosaico__foto-sposa img { width:100%; aspect-ratio:16/9; object-fit:cover; display:block }

@media (max-width:767px) {
	.fs-mosaico.fs-mosaico.fs-mosaico { --min-height:100vh }
	.fs-mosaico__alto.fs-mosaico__alto.fs-mosaico__alto { --flex-direction:column; --container-widget-width:100%; --container-widget-height:initial; --container-widget-flex-grow:0; --container-widget-align-self:initial; --flex-wrap-mobile:wrap }
	.fs-mosaico__occhiello.fs-mosaico__occhiello.fs-mosaico__occhiello { --width:100% }
	.fs-mosaico__claim.fs-mosaico__claim.fs-mosaico__claim .text-wrapper { text-align:center }
	.fs-mosaico__foto-sala.fs-mosaico__foto-sala.fs-mosaico__foto-sala { --container-widget-width:100%; --container-widget-flex-grow:0; width:var( --container-widget-width, 100% ); max-width:100% }
	.fs-mosaico__testi.fs-mosaico__testi.fs-mosaico__testi { --width:100% }
	.fs-mosaico__titolo.fs-mosaico__titolo.fs-mosaico__titolo { width:100% }
	.fs-mosaico__basso.fs-mosaico__basso.fs-mosaico__basso { --flex-direction:column; --container-widget-width:100%; --container-widget-height:initial; --container-widget-flex-grow:0; --container-widget-align-self:initial; --flex-wrap-mobile:wrap }
	.fs-mosaico__foto-sposo.fs-mosaico__foto-sposo.fs-mosaico__foto-sposo { --container-widget-width:100%; --container-widget-flex-grow:0; width:var( --container-widget-width, 100% ); max-width:100% }
	.fs-mosaico__didascalia-sposo.fs-mosaico__didascalia-sposo.fs-mosaico__didascalia-sposo.elementor-element { --align-self:flex-start }
	.fs-mosaico__didascalia-sposo.fs-mosaico__didascalia-sposo.fs-mosaico__didascalia-sposo { width:50% }
	.fs-mosaico__foto-sposa.fs-mosaico__foto-sposa.fs-mosaico__foto-sposa { --container-widget-width:100%; --container-widget-flex-grow:0; width:var( --container-widget-width, 100% ); max-width:100% }
	.fs-mosaico__didascalia-sposa.fs-mosaico__didascalia-sposa.fs-mosaico__didascalia-sposa.elementor-element { --align-self:flex-end }
	.fs-mosaico__didascalia-sposa.fs-mosaico__didascalia-sposa.fs-mosaico__didascalia-sposa { width:50% }
	.fs-mosaico__chiusura.fs-mosaico__chiusura.fs-mosaico__chiusura { width:100% }
	.fs-mosaico__alto.fs-mosaico__alto.fs-mosaico__alto, .fs-mosaico__basso.fs-mosaico__basso.fs-mosaico__basso, .fs-richiami__colonna--sposa.fs-richiami__colonna--sposa.fs-richiami__colonna--sposa, .fs-richiami__colonna--sposo.fs-richiami__colonna--sposo.fs-richiami__colonna--sposo { box-sizing: border-box }
	/* ---------- 2 · ELEGANZA / TRENT'ANNI — una schermata ---------- *//* la sezione madre non deve piu' imporre la propria altezza:
	le due schermate sono i suoi due contenitori interni. */
	.fs-mosaico.fs-mosaico.fs-mosaico { min-height: 0 !important; padding: 0 !important; gap: 0 !important; row-gap: 0 !important; scroll-snap-align: none }
	.fs-mosaico__alto.fs-mosaico__alto.fs-mosaico__alto, .fs-mosaico__basso.fs-mosaico__basso.fs-mosaico__basso { /* margini di Elementor pensati per il desktop: +50px sotto l'hero e        -20px di sovrapposizione fra i due blocchi. Su mobile sfasavano le        schermate rispetto all'altezza della finestra. */     margin-top: 0 !important; /* min-height a tutta finestra (26 ago 2026 — REVISIONE della scelta del        31 lug, che qui diceva "niente min-height").        Il timore di allora era fondato ma il rimedio era sbagliato: a 844px        questi due moduli stavano in 789 e 668, e portarli a 100dvh lasciando        il contenuto centrato apriva un vuoto attorno. Il vuoto pero' non        veniva dall'altezza, veniva dal CENTRARE: lo spazio in piu' si        raccoglieva tutto in cima e in fondo.        Ora l'altezza c'e' e lo spazio viene distribuito — space-between qui        sotto per 342bcb3, foto piu' alte per d5f4408 — quindi le schermate        sono piene e non si intravede mai il modulo successivo.        Misurato il 26 ago 2026 a 390x844 e 360x800: entrambi al 100% della        finestra, nessun blocco sotto il pieno schermo. */     min-height: 100vh; min-height: 100svh; min-height: 100dvh; scroll-snap-align: start; scroll-snap-stop: normal; gap: 22px; /* in alto lo spazio dell'header fisso, in basso quello della barra CTA */     padding: calc(var(--fs-head) + 10px) 20px calc(var(--fs-bar) + 26px) }
	/* ordine del mockup: occhiello + titolo, titolo grande, paragrafo, foto,
	didascalia. Paragrafo e didascalie sono i widget aggiunti in Elementor
	(classi fs-par-atelier / fs-didascalia). *//* Lo spazio in piu' finisce FRA gli elementi, non attorno: i ~55px che
	mancavano al pieno schermo si spalmano nei tre stacchi (occhiello →
	titolo → paragrafo → foto → didascalia), circa 18px l'uno. Il blocco
	respira invece di avere un buco in fondo. */
	.fs-mosaico__alto.fs-mosaico__alto.fs-mosaico__alto { display: flex; flex-direction: column; justify-content: space-between }
	.fs-mosaico__claim.fs-mosaico__claim.fs-mosaico__claim { order: 1 }
	.fs-mosaico__titolo.fs-mosaico__titolo.fs-mosaico__titolo { order: 2 }
	.fs-mosaico__alto.fs-mosaico__alto.fs-mosaico__alto .fs-par-atelier { order: 3 }
	.fs-mosaico__foto-sala.fs-mosaico__foto-sala.fs-mosaico__foto-sala { order: 4 }
	.fs-mosaico__alto.fs-mosaico__alto.fs-mosaico__alto .fs-didascalia { order: 5; margin-top: -12px }
	/* 30svh e non 34: con l'header fisso scontato dall'altezza utile il
	contenuto della schermata arrivava a 800px su 812 disponibili. */
	.fs-mosaico__foto-sala.fs-mosaico__foto-sala.fs-mosaico__foto-sala img { width: 100%; height: 30vh; height: 30svh; object-fit: cover; display: block }
	/* ---------- 3 · IL RACCONTO + I NUMERI — 92svh ---------- *//* le due foto affiancate (nel mockup sono una coppia, non impilate) */
	.fs-mosaico__basso.fs-mosaico__basso.fs-mosaico__basso { display: grid; grid-template-columns: 1fr 1fr; grid-template-areas:       "img1  img2"       "dida1 dida2"       "testo testo"; /* space-between e non center (26 ago 2026): con il blocco portato a tutta        finestra, "center" raccoglieva i 176px in piu' sopra e sotto la griglia        — il vuoto che il 31 lug aveva fatto scartare il min-height. Distribuito        fra le righe, e con le foto piu' alte qui sotto, non resta buco. */     align-content: space-between; column-gap: 10px; row-gap: 20px }
	.fs-mosaico__foto-sposo.fs-mosaico__foto-sposo.fs-mosaico__foto-sposo { grid-area: img1 }
	.fs-mosaico__foto-sposa.fs-mosaico__foto-sposa.fs-mosaico__foto-sposa { grid-area: img2 }
	.fs-mosaico__chiusura.fs-mosaico__chiusura.fs-mosaico__chiusura { grid-area: testo }
	/* una didascalia per foto (1 ago 2026): prima c'era una sola riga "dida"
	larga due colonne, cosi' quando e' stata aggiunta la seconda didascalia
	le due finivano nella STESSA cella e si stampavano una sopra l'altra
	(si leggeva "LA SALA SPOS" con la A e la O sovrapposte). Ora ogni
	didascalia ha la sua colonna, sotto la foto a cui si riferisce:
	23d8409 = sala sposo (sinistra), 6cca735 = sala sposa (destra).
	Il width:100% serve perche' Elementor mette width:50% sul widget:
	dentro una colonna di grid diventerebbe meta' colonna e il testo
	andrebbe a capo. */
	.fs-mosaico__basso.fs-mosaico__basso.fs-mosaico__basso .fs-mosaico__didascalia-sposo { grid-area: dida1 }
	.fs-mosaico__basso.fs-mosaico__basso.fs-mosaico__basso .fs-mosaico__didascalia-sposa { grid-area: dida2 }
	.fs-mosaico__basso.fs-mosaico__basso.fs-mosaico__basso .fs-didascalia { width: 100% }
	/* 58svh (26 ago 2026; prima 40, prima ancora 30): sono le foto a prendersi
	lo spazio del blocco portato a tutta finestra. Alzare LORO invece di
	allargare gli stacchi e' cio' che tiene il blocco pieno senza staccare le
	didascalie dalle immagini a cui si riferiscono. */
	.fs-mosaico__foto-sposo.fs-mosaico__foto-sposo.fs-mosaico__foto-sposo img, .fs-mosaico__foto-sposa.fs-mosaico__foto-sposa.fs-mosaico__foto-sposa img { width: 100%; height: 58vh; height: 58svh; aspect-ratio: auto; object-fit: cover; display: block }
	.fs-mosaico__foto-sposo.fs-mosaico__foto-sposo.fs-mosaico__foto-sposo img, .fs-mosaico__foto-sposa.fs-mosaico__foto-sposa.fs-mosaico__foto-sposa img { height: 50vh; height: 50svh }
	/* il wrapper eredita il posto che avevano titolo+paragrafo da soli */
	.fs-mosaico__testi.fs-mosaico__testi.fs-mosaico__testi { order: 2 }
}

@media (max-width:1024px) and (min-width:768px) {
	.fs-mosaico__testi.fs-mosaico__testi.fs-mosaico__testi { --width:30% }
}

@media (min-width:768px) {
	.fs-mosaico.fs-mosaico.fs-mosaico { --width:100% }
	.fs-mosaico__occhiello.fs-mosaico__occhiello.fs-mosaico__occhiello { --width:33.33% }
	.fs-mosaico__testi.fs-mosaico__testi.fs-mosaico__testi { --width:33.33% }
	/* specificita alzata: la regola gemella in fs-custom.css (sez. 7) viene
	stampata DOPO questo blocco, quindi a parita di peso vincerebbe lei */
	.fs-mosaico__testi.fs-mosaico__testi.fs-mosaico__testi .fs-par-atelier { display: block !important }
}