@charset "utf-8";

/* ============================================================================
   carrara.css — Landing di città "Carrara" (URL /carrara.htm; il file sta in css/landing/
   perché la cartella organizza i sorgenti, non l'indirizzo pubblico)
   Stile specifico delle sezioni della landing. Token e componenti generici
   (.FdoSection, .FdoHeading, .FdoBtn, .FdoMarquee, .FdoCtaRow) arrivano da
   global.css (caricato da head.htm). Tutto sotto .FdoPage per coerenza col
   resto del sito. Prefisso classi: .FdoCarrara*
   ============================================================================ */

/* --- 1. HERO (contenuto CENTRATO, come l'originale) ------------------------- */
.FdoCarraraHero {
	position: relative;
	box-sizing: border-box;
	/* Come www: hero largo 95% e centrato, NON a tutta larghezza (margini laterali ~2,5%). */
	width: 95%;
	margin: 0 auto;
	display: flex;
	align-items: center;
	justify-content: center;
	/* padding-top dimezzato (96px -> 48px) il 05/08/2026: il titolo stava troppo in basso.
	   Regola base, senza override nei @media: vale sia desktop sia mobile. */
	padding: 48px var(--space-4) var(--space-4);
	background-image: var(--u-hero-mobile);
	background-size: cover;
	background-position: center;
	overflow: hidden;
	/* Come www: l'hero prende l'ASPECT-RATIO dell'immagine, così si vede l'immagine INTERA
	   (bordo "strappato" incluso) senza ritaglio. Mobile = aspetto di hero-mobile.jpg (462x1024). */
	aspect-ratio: 462 / 1024;
}
@media (min-width: 641px) {
	.FdoCarraraHero { background-image: var(--u-hero); aspect-ratio: 1024 / 622; }
}
.FdoCarraraHero::before {
	content: "";
	position: absolute; inset: 0; z-index: 0;
	background: rgba(0,0,0,.35); /* velo nero piatto 35%, identico a www */
}
.FdoCarraraHeroInner {
	/* z-index: sta sopra al velo nero (.FdoCarraraHero::before, absolute inset:0).
	   top:-50px (05/08/2026): il blocco resta troppo in basso. Non basta togliere altro
	   padding-top all'hero, perché con align-items:center un taglio di padding si distribuisce
	   a METÀ (48px tolti = 24px di risalita): qui lo spostamento è esatto e uguale su ogni
	   viewport. Non tocca il flusso, quindi cresce solo lo spazio sotto.
	   Margine verificato prima di applicarlo (l'hero ha overflow:hidden): sopra al titolo
	   restano 134px su desktop 1440 e 75px su mobile 380 — nessun taglio. */
	position: relative; z-index: 1; top: -50px;
	width: 100%; max-width: 820px; margin: 0 auto;
	display: flex; flex-direction: column; align-items: center; gap: var(--space-3);
	text-align: center;
}
.FdoCarraraHeroTitle { text-align: center; font-size: clamp(44px, 8vw, 80px); line-height: 1.1; margin: 0; }
.FdoPage .FdoCarraraHeroEyebrow { margin: 0; color: #ffbed8; font-weight: 600; text-transform: uppercase; letter-spacing: .36px; font-size: 18px; line-height: 24px; }
.FdoPage .FdoCarraraHeroText { margin: var(--space-2) auto 0; max-width: 62ch; color: var(--color-body); font-size: 18px; line-height: 26px; }
.FdoCarraraHeroDate { display: flex; flex-direction: column; align-items: center; gap: 2px; margin-top: var(--space-3); color: var(--color-button-secondary-bg); }
.FdoCarraraHeroDateGiorni { font-size: var(--text-body-size); }
.FdoCarraraHeroDateNumeri { font-family: var(--font-display); font-size: clamp(40px, 6vw, 64px); line-height: 1; }
.FdoCarraraHeroDateMese { font-family: var(--font-display); font-size: clamp(22px, 3vw, 30px); }
.FdoCarraraHeroCta { margin-top: var(--space-4); }

/* --- 2. PERCHÉ VISITARE ------------------------------------------------------
   Come www: titolo max 888px (va a 2 righe), lead max 782px, e i 6 benefit in
   GRIGLIA a 3 colonne × 2 righe (non una fila unica). Item: icona 32px sopra,
   label 16px/700 rosa #ffbed8, senza box. */
.FdoPage #carrara-perche-title { max-width: 888px; margin-left: auto; margin-right: auto; }
.FdoPage #carrara-perche .FdoSectionBody { max-width: 782px; }

.FdoCarraraBenefits {
	list-style: none; margin: var(--space-6) auto 0; padding: 0; width: 100%; max-width: 1200px;
	display: grid; gap: var(--space-5); justify-content: center;
	grid-template-columns: minmax(0, 378px);
}
@media (min-width: 641px)  { .FdoCarraraBenefits { grid-template-columns: repeat(2, minmax(0, 378px)); } }
@media (min-width: 1025px) { .FdoCarraraBenefits { grid-template-columns: repeat(3, minmax(0, 378px)); } }
.FdoCarraraBenefit {
	display: flex; flex-direction: column; align-items: center; gap: var(--space-2);
	padding: 0; border: 0; background: none;
	color: #ffbed8; text-align: center;
	font-size: 16px; font-weight: 700; line-height: 24px;
}
.FdoCarraraBenefitIcon { width: 32px; height: 32px; flex-shrink: 0; }

/* --- 3. EXPERIENCE ROWS ------------------------------------------------------ */
/* Sezione a TUTTA LARGHEZZA come www: niente padding orizzontale (il titolo resta
   centrato nel suo FdoSectionInner). Righe: testo ~517px da un lato, media ~1fr fino
   al BORDO opposto (16:9). Le righe "reverse" hanno il media dal lato sinistro. */
.FdoPage #carrara-rows { padding-left: 0; padding-right: 0; }
.FdoCarraraRows {
	width: 100%; margin: var(--space-6) 0 0;
	display: flex; flex-direction: column; gap: 0; /* righe attaccate verticalmente, come www */
}
.FdoCarraraRow { display: grid; grid-template-columns: 1fr; gap: var(--space-4); align-items: center; }
.FdoCarraraRowText { text-align: left; padding: 0 var(--space-4); }
.FdoCarraraRowMedia { overflow: hidden; aspect-ratio: 16 / 9; background: #04182f; }
.FdoCarraraRowMedia img, .FdoCarraraRowMedia video { width: 100%; height: 100%; object-fit: cover; display: block; }
.FdoPage .FdoCarraraRowTitle {
	font-family: var(--font-display); margin: 0 0 0.8rem; /* .FdoPage per battere ".FdoPage h3{margin:0}" globale */
	font-size: clamp(28px, 3.2vw, 40px); line-height: 1.2;
	background: var(--gradient-heading);
	-webkit-background-clip: text; background-clip: text;
	-webkit-text-fill-color: transparent; color: #d89958; /* fallback */
}
.FdoPage .FdoCarraraRowText p { margin: 0; color: var(--color-body); font-size: var(--text-body-size); line-height: var(--text-body-line); }
.FdoCarraraRowCta { margin-top: var(--space-4); }
/* Bottone rosa OUTLINE delle rows (bordo + testo rosa, fondo trasparente), come l'originale */
.FdoPage a.FdoCarraraRowCta,
.FdoPage a.FdoCarraraRowCta:visited,
.FdoPage a.FdoCarraraRowCta:active {
	background: transparent;
	border: 1px solid var(--color-button-secondary-bg);
	color: var(--color-button-secondary-bg);
}
.FdoPage a.FdoCarraraRowCta:hover { background: rgba(255,174,206,.12); color: var(--color-button-secondary-bg-hover); border-color: var(--color-button-secondary-bg-hover); }
/* MOBILE (05/08/2026): impilate una sull'altra, le righe erano allineate a sinistra e appiccicate
   fra loro (il video di un blocco toccava il titolo del successivo, perché .FdoCarraraRows ha gap:0).
   Qui centro il testo e stacco pulsante e video. Deve stare DOPO la regola base .FdoCarraraRowText
   (stessa specificità 0,1,0: vince l'ordine sorgente). Il CTA è inline-flex, quindi lo centra il
   text-align del contenitore; h3 e <p> ereditano.
   Su desktop (>=1025px) non cambia nulla: il blocco qui sotto e questo si escludono a vicenda. */
@media (max-width: 1024px) {
	.FdoCarraraRowText { text-align: center; }
	.FdoCarraraRowText .FdoCarraraRowCta { margin-bottom: 1.5rem; }
	.FdoCarraraRowMedia { margin-bottom: 1.5rem; }
	/* Titoli su più righe: le righe vengono bilanciate invece di riempire la prima e lasciare
	   una parola orfana sull'ultima ("Spettacoli e folklore dal / vivo"). Nessun'altra regola
	   dichiara text-wrap, quindi non serve la specificità di .FdoPage. I browser che non lo
	   supportano lo ignorano e vanno a capo come prima. */
	.FdoCarraraRowTitle { text-wrap: balance; }
}
@media (min-width: 1025px) {
	/* Normale: testo 517px a sinistra, media fino al bordo destro. */
	/* 12/08/2026 (richiesta del committente): la riga non è più a tutta larghezza su desktop —
	   centrata e ristretta rispetto al contenitore FdoCarraraRows (che resta width:100% senza
	   padding, vedi sopra: qui si centra la singola riga, non la sezione). */
	.FdoCarraraRow { grid-template-columns: 517px minmax(0, 1fr); gap: var(--space-6); width: 80%; max-width: 65rem; margin-left: auto; margin-right: auto; }
	.FdoCarraraRow .FdoCarraraRowText { padding: 0 0 0 var(--space-8); }
	/* Reverse: media dal bordo sinistro, testo 517px a destra. Nel markup il testo è
	   sempre prima del media, quindi uso order per invertirli. */
	.FdoCarraraRow--reverse { grid-template-columns: minmax(0, 1fr) 517px; }
	.FdoCarraraRow--reverse .FdoCarraraRowMedia { order: 1; }
	.FdoCarraraRow--reverse .FdoCarraraRowText  { order: 2; padding: 0 var(--space-8) 0 0; }
}

/* --- 4. OLTRE 300 ESPERIENZE (2 marquee auto-scorrevoli come www) ------------
   Titolo 2 righe (max 888) e lead più stretto (max 782), come le altre sezioni.
   Card: immagine 300px quadrata (radius 8) + titolo 18px/700 rosa a sinistra.
   L'animazione la fa il sistema .FdoMarquee (global.css) attivato via JS. */
.FdoPage #carrara-esperienze-title { max-width: 888px; margin-left: auto; margin-right: auto; }
.FdoPage #carrara-esperienze .FdoSectionBody { max-width: 782px; }

.FdoCarraraExpMarquees { display: flex; flex-direction: column; gap: var(--space-4); margin: var(--space-6) auto 0; max-width: 1200px; }
/* Seconda riga: scorre nel verso opposto. */
.FdoCarraraExpRow--reverse.is-animating .FdoMarqueeTrack { animation-direction: reverse; -webkit-animation-direction: reverse; }

/* Card ESPERIENZE = card "Il Programma" della home: regole copiate 1:1 da home.css
   (che non è caricata su questa pagina), così restano identiche a CSS. */
.FdoProgrammaCard { display: flex; flex-direction: column; flex-shrink: 0; width: 316px; height: 100%; }
.FdoProgrammaFrame { display: flex; flex: 1; flex-direction: column; height: 100%; padding: var(--space-2); border: 1px solid #000; border-radius: var(--radius); background-color: #ffffff0a; }
.FdoProgrammaImage { display: block; width: 300px; height: 300px; object-fit: cover; border-radius: var(--radius); }
.FdoProgrammaContent { display: flex; flex: 1; flex-direction: column; gap: var(--space-2); padding-top: var(--space-2); text-align: left; }
.FdoPage .FdoProgrammaCardTitle { margin: 0; font-family: var(--font-body); font-size: var(--text-subtitle-size); line-height: var(--text-subtitle-line); font-weight: var(--text-body-bold-weight); color: #ffbed8; text-align: left; }
@media (max-width: 640px) {
	.FdoProgrammaCard { width: min(316px, 75vw); }
	.FdoProgrammaImage { width: 100%; height: auto; aspect-ratio: 1; }
}

/* --- 5. COUNTRIES BAND (sfondo + marquee nomi paese + CTA) -------------------
   Come www: sfondo countries-band.jpg (cover, ancorato in alto) SENZA velo scuro,
   titolo gold + testo (max 782), marquee di nomi paese in Zen Antique 88px oro,
   e pulsante rosa "Acquista il biglietto". */
.FdoCarraraCountries {
	position: relative;
	padding: 160px var(--space-4) var(--space-8);
	background-color: var(--color-bg);
	background-image: var(--u-countries-mobile);
	background-size: cover; background-position: 50% 0%; background-repeat: no-repeat;
	overflow: hidden;
}
@media (min-width: 641px) { .FdoCarraraCountries { background-image: var(--u-countries); } }
/* Sfuma l'immagine nel blu della pagina in alto e in basso: nessuno stacco di colore
   tra questo blocco e quelli sopra/sotto (che sono blu pieno #052e5a). */
.FdoCarraraCountries::before {
	content: ""; position: absolute; inset: 0; z-index: 0; pointer-events: none;
	background: linear-gradient(to bottom, var(--color-bg) 0%, rgba(5,46,90,0) 18%, rgba(5,46,90,0) 82%, var(--color-bg) 100%);
}
.FdoCarraraCountries > * { position: relative; z-index: 1; }
.FdoCarraraCountriesInner {
	position: relative; max-width: 782px; margin: 0 auto; text-align: center;
	display: flex; flex-direction: column; gap: var(--space-4); align-items: center;
}
.FdoPage .FdoCarraraCountriesText { margin: 0; max-width: 782px; color: var(--color-body); font-size: var(--text-body-size); line-height: var(--text-body-line); }
/* Marquee dei paesi: nomi grandi in Zen Antique oro, scorrevoli */
.FdoCarraraCountriesMarquee { margin: var(--space-6) auto 0; max-width: 1200px; }
/* Nomi Paese = identici alla home (.FdoPaesiNome): Zen Antique, gradiente oro, NON maiuscolo.
   Regole copiate 1:1 da home.css (non caricata qui). */
.FdoPaesiNome {
	flex-shrink: 0;
	font-family: var(--font-display);
	font-size: clamp(40px, 12vw, 88px);
	line-height: 1;
	font-weight: 400;
	color: #d89958;
	background: var(--gradient-heading);
	background-clip: text;
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	white-space: nowrap;
	padding-inline: var(--space-4);
}
@media (min-width: 1025px) {
	.FdoPaesiNome { font-size: 88px; line-height: 88px; padding-inline: var(--space-6); }
}
.FdoCarraraCountriesCta { position: relative; text-align: center; margin-top: var(--space-6); }

/* --- 6. GALLERY MASONRY ------------------------------------------------------ */
/* Gallery come www: video 16:9 e mosaico dentro un contenitore centrato (~1338px),
   NON a tutta larghezza; nessuna banda di colore di sfondo; mosaico max 3 colonne. */
.FdoCarraraGalleryInner { max-width: 1338px; margin: 0 auto; }
.FdoCarraraGalleryBanner { width: 100%; aspect-ratio: 16 / 9; overflow: hidden; }
.FdoCarraraGalleryBanner video { width: 100%; height: 100%; object-fit: cover; display: block; }
/* Mobile a UNA colonna (05/08/2026, era 2): sotto i 641px due foto affiancate diventavano
   francobolli. Vale anche per il mosaico extra .FdoCarraraMasonry--more, che eredita questa regola. */
.FdoCarraraMasonry { width: 100%; columns: 1; column-gap: var(--space-5); margin-top: var(--space-5); }
@media (min-width: 641px)  { .FdoCarraraMasonry { columns: 3; } }
.FdoCarraraMasonry--more { margin-top: var(--space-5); }
.FdoCarraraMasonryItem { break-inside: avoid; margin-bottom: var(--space-5); border-radius: var(--radius); overflow: hidden; background: rgba(0,0,0,.2); }
.FdoCarraraMasonryItem img { width: 100%; height: auto; display: block; }
/* Stacco fra l'ultima foto e il pulsante "Visualizza altre immagini", che era appiccicato al
   mosaico. Scoped a #carrara-gallery: .FdoCtaRow è globale e la usano anche le altre sezioni. */
#carrara-gallery .FdoCtaRow { margin-top: var(--space-5); }

/* --- 7/8. STORIE + ORGANIZZA (UNICO fondo stellato continuo, come www) ------- */
.FdoCarraraStarsBand {
	background-color: var(--color-bg);
	background-image: var(--u-stars);
	background-size: cover; background-position: center; background-repeat: no-repeat;
}
/* Video testimonianze (embed YouTube 16:9, max 1200 centrato) come www */
.FdoCarraraStorieVideo { position: relative; width: 100%; max-width: 1200px; margin: var(--space-6) auto 0; aspect-ratio: 16 / 9; overflow: hidden; background: #00000040; }
.FdoCarraraStorieIframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }

/*	Facciata click-to-play (11/08/2026, replicata identica da home.css): miniatura a piena
	copertura + pulsante play centrato, stesso ingombro di .FdoCarraraStorieVideo. */
.FdoYtFacade { cursor: pointer; }
.FdoYtFacadeImg { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.FdoYtFacadePlay {
	position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);
	width: 68px; height: 48px; padding: 0; border: 0; background: transparent;
	cursor: pointer; transition: transform 0.15s ease;
}
.FdoYtFacadePlay svg { display: block; width: 100%; height: 100%; }
.FdoYtFacade:hover .FdoYtFacadePlay, .FdoYtFacadePlay:focus-visible { transform: translate(-50%, -50%) scale(1.1); }
.FdoCarraraInfoGrid {
	width: 100%; display: grid; gap: var(--space-2); margin-top: var(--space-5);
	grid-template-columns: 1fr;
}
@media (min-width: 641px)  { .FdoCarraraInfoGrid { grid-template-columns: repeat(2, 1fr); } }
/* Desktop: 3 colonne come www — col1 Date (alta), col2 Orari+Accessibilità impilati,
   col3 Biglietti (alta). Date e Biglietti occupano entrambe le righe. */
@media (min-width: 1025px) {
	.FdoCarraraInfoGrid { grid-template-columns: 1fr 1fr 1fr; grid-template-rows: auto auto; align-items: stretch; }
	.FdoCarraraInfoGrid > :nth-child(1) { grid-column: 1; grid-row: 1 / span 2; }  /* Date */
	.FdoCarraraInfoGrid > :nth-child(2) { grid-column: 2; grid-row: 1; }           /* Orari */
	.FdoCarraraInfoGrid > :nth-child(3) { grid-column: 2; grid-row: 2; }           /* Accessibilità */
	.FdoCarraraInfoGrid > :nth-child(4) { grid-column: 3; grid-row: 1 / span 2; }  /* Biglietti */
}
/* Box come www: fondo solido #011d3d, angoli quadrati, niente bordo, padding 32/16,
   contenuto CENTRATO (titolo + valori). */
.FdoCarraraInfoCard {
	padding: var(--space-6) var(--space-4); border: 0; border-radius: 0;
	background: var(--color-card-activity);
	display: flex; flex-direction: column; align-items: center; justify-content: center; gap: var(--space-2);
	text-align: center;
}
/* Lead della sezione organizza: max 782px come le altre (non a tutta larghezza) */
.FdoPage #carrara-organizza .FdoSectionBody { max-width: 782px; }
/* Box "Biglietti": tariffe separate da righine; ogni tariffa = titolo/prezzo in grassetto + descrizione */
.FdoCarraraTariffe { width: 100%; display: flex; flex-direction: column; }
.FdoCarraraTariffa { padding: var(--space-3) 0; }
.FdoCarraraTariffa:first-child { padding-top: 0; }
.FdoCarraraTariffa:last-child { padding-bottom: 0; }
.FdoCarraraTariffa + .FdoCarraraTariffa { border-top: 1px solid rgba(255,255,255,.14); }
.FdoPage .FdoCarraraTariffaTitolo { margin: 0; font-weight: 700; color: var(--color-body); font-size: 16px; line-height: 22px; }
.FdoPage .FdoCarraraTariffaDesc { margin: 4px 0 0; font-weight: 400; color: var(--color-body); font-size: 16px; line-height: 22px; }
.FdoPage .FdoCarraraInfoTitle { font-family: var(--font-body); color: #ffbed8; font-weight: 700; text-transform: none; margin: 0; font-size: 16px; line-height: 24px; }
.FdoPage .FdoCarraraInfoCard p { margin: 0; color: var(--color-body); font-size: 16px; line-height: 24px; }
/* Box "Date": nessun titolo "Date", due blocchi arieggiati (24px tra i blocchi, 8px interni) come www */
.FdoCarraraInfoCard--dates { gap: var(--space-5); }
.FdoCarraraDateBlock { display: flex; flex-direction: column; align-items: center; gap: var(--space-2); }
.FdoPage .FdoCarraraDateGiorni { color: var(--color-body); font-size: 14px; line-height: 20px; }
.FdoCarraraDateNum { font-family: var(--font-display); color: var(--color-button-secondary-bg); font-size: 56px; line-height: 1.05; }
.FdoCarraraDateMese { font-family: var(--font-display); color: var(--color-button-secondary-bg); font-size: 26px; line-height: 1.2; }
.FdoPage .FdoCarraraInfoCard p:last-child { margin-bottom: 0; }

/* --- 9. DOVE TROVARCI -------------------------------------------------------- */
.FdoCarraraDove { background-image: var(--u-dove-mobile); background-size: cover; background-position: center; }
@media (min-width: 641px) { .FdoCarraraDove { background-image: var(--u-dove); } }
/* Single-column CENTRATA come www: h2 -> lead -> "Carrara Fiere" (h3 oro) -> indirizzo -> mappa (780 centrata) */
.FdoPage .FdoCarraraDoveSede { margin: var(--space-4) 0 var(--space-1); font-size: 24px; line-height: 1.2; text-align: center; }
.FdoPage .FdoCarraraDoveIndirizzo { margin: 0; text-align: center; color: var(--color-gold); font-size: 16px; line-height: 24px; }
.FdoCarraraMap { width: 100%; max-width: 780px; aspect-ratio: 16 / 9; margin: var(--space-5) auto 0; border-radius: var(--radius); overflow: hidden; background: #04182f; }
.FdoCarraraMap iframe { width: 100%; height: 100%; border: 0; display: block; }
/* Lead di dove: max 782 (largo quanto la mappa), non a tutta larghezza */
.FdoPage #carrara-dove .FdoSectionBody { max-width: 782px; }
/* "Come raggiungere" E "Domande Frequenti": stesso accordion, identico a www
   (righe a linea di separazione, chiuse di default, chevron a "V" a destra). */
.FdoCarraraArrivo,
.FdoCarraraFaq { width: 100%; max-width: 782px; margin: var(--space-6) auto 0; text-align: left; display: flex; flex-direction: column; }
.FdoCarraraArrivoItem,
.FdoCarraraFaqItem { border: 0; border-bottom: 1px solid rgba(255,234,243,.2); border-radius: 0; background: none; overflow: visible; }
.FdoPage .FdoCarraraArrivoTitolo,
.FdoPage .FdoCarraraFaqItem summary {
	display: flex; align-items: center; justify-content: space-between; gap: var(--space-4);
	cursor: pointer; list-style: none; padding: var(--space-4) 0;
	font-family: var(--font-body); font-weight: 600; font-size: 18px; line-height: 24px; color: var(--color-body);
}
.FdoCarraraArrivoTitolo::-webkit-details-marker,
.FdoCarraraFaqItem summary::-webkit-details-marker { display: none; }
/* Freccia = chevron a "V" come www (colore del testo, NON rosa): ruota all'apertura. */
.FdoCarraraArrivoTitolo::after,
.FdoCarraraFaqItem summary::after {
	content: ""; flex: 0 0 auto; width: 9px; height: 9px; float: none;
	border-right: 2px solid var(--color-body); border-bottom: 2px solid var(--color-body);
	transform: rotate(45deg); transform-origin: center; transition: transform .2s ease;
}
.FdoCarraraArrivoItem[open] .FdoCarraraArrivoTitolo::after,
.FdoCarraraFaqItem[open] summary::after { transform: rotate(-135deg); }
/* Risposta (arrivo = HTML con elenco puntato; FAQ = testo) */
.FdoCarraraArrivoTesto,
.FdoCarraraFaqAnswer { padding: 0 0 var(--space-4); color: var(--color-body); font-size: 16px; line-height: 24px; text-align: left; }
.FdoPage .FdoCarraraArrivoTesto p { margin: 0 0 var(--space-3); }
.FdoPage .FdoCarraraArrivoTesto p:last-child { margin-bottom: 0; }
.FdoPage .FdoCarraraArrivoTesto ul { margin: 0 0 var(--space-3); padding-left: 1.4em; list-style: disc outside; }
.FdoPage .FdoCarraraArrivoTesto ul:last-child { margin-bottom: 0; }
.FdoPage .FdoCarraraArrivoTesto ol { margin: 0 0 var(--space-3); padding-left: 1.4em; list-style: decimal outside; }
.FdoPage .FdoCarraraArrivoTesto li { margin-bottom: var(--space-1); list-style: inherit; display: list-item; }
.FdoCarraraArrivoTesto a,
.FdoCarraraFaqAnswer a { color: var(--color-h3); text-decoration: underline; text-underline-offset: 3px; }
/* Nota "esigenze particolari" sotto la lista "Come raggiungere" */
.FdoCarraraArrivoFooter { width: 100%; max-width: 782px; margin: var(--space-4) auto 0; text-align: center; color: var(--color-body); font-size: 16px; line-height: 24px; }
.FdoCarraraArrivoFooter a { color: var(--color-h3); text-decoration: underline; text-underline-offset: 3px; }

/* --- 11. TICKET CTA (francobollo, come www) --------------------------------- */
.FdoCarraraTicket {
	width: 90%; max-width: 1280px; margin: 0 auto var(--space-8);
	background-color: var(--color-ticket-surface);
}
.FdoCarraraTicketInner {
	width: 100%; margin: 0; display: flex; flex-direction: column; gap: var(--space-4);
	padding: var(--space-5) var(--space-4);
}
/* Colonna date (Settembre + elenco Sab/Dom + numero) */
.FdoCarraraTicketDates { display: flex; flex-direction: column; gap: var(--space-3); flex-shrink: 0; }
.FdoPage .FdoCarraraTicketMonth {
	margin: 0; font-family: var(--font-display); font-size: clamp(22px, 4vw, 28px); line-height: 1.2;
	font-weight: 400; color: var(--color-button-secondary-bg-hover);
}
.FdoCarraraTicketDateList { display: flex; flex-flow: wrap; gap: var(--space-3) var(--space-5); list-style: none; margin: 0; padding: 0; }
.FdoCarraraTicketDate {
	display: flex; flex-direction: column; gap: 2px; min-width: 3.5rem;
	padding-bottom: var(--space-2); border-bottom: 1px solid var(--color-pink-soft);
}
.FdoCarraraTicketDay { font-family: var(--font-body); font-size: 14px; font-weight: 500; color: var(--color-heading-alt); }
.FdoPage .FdoCarraraTicketNum {
	font-family: var(--font-display); font-size: clamp(36px, 8vw, 48px); line-height: 1; font-weight: 400; color: var(--color-heading-alt);
}
/* Card francobollo: immagine (con lo smerlo già nel JPG) + overlay testuale */
.FdoCarraraTicketStamp {
	position: relative; width: min(100%, 420px); margin-inline: auto;
	aspect-ratio: 358 / 709; overflow: hidden; isolation: isolate;
}
.FdoCarraraTicketStamp picture { display: block; width: 100%; height: 100%; }
.FdoCarraraTicketArt { display: block; width: 100%; height: 100%; object-fit: cover; object-position: center top; }
.FdoCarraraTicketCopy {
	position: absolute; inset: auto 0 0; z-index: 1; display: flex; flex-direction: column;
	align-items: flex-start; justify-content: flex-end; gap: var(--space-3);
	width: 100%; padding: var(--space-6) var(--space-5) var(--space-7); text-align: left;
}
.FdoPage .FdoCarraraTicketTitle { margin: 0; font-size: clamp(24px, 6vw, 32px); line-height: 1.15; }
.FdoPage .FdoCarraraTicketText { margin: 0; color: var(--color-body); font-size: var(--text-body-size); line-height: var(--text-body-line); text-align: left; }
.FdoCarraraTicketCta { margin-top: var(--space-1); }

@media (min-width: 641px) {
	.FdoCarraraTicketInner { padding: var(--space-6) var(--space-5); }
	.FdoCarraraTicketStamp { width: min(100%, 480px); }
	.FdoCarraraTicketCopy { padding: var(--space-7) var(--space-6); }
	.FdoPage .FdoCarraraTicketText { max-width: 42ch; }
}
@media (min-width: 1025px) {
	.FdoCarraraTicketInner { flex-direction: row; align-items: stretch; gap: var(--space-6); padding: var(--space-7) var(--space-6); }
	.FdoCarraraTicketDates { width: 148px; justify-content: center; padding-block: var(--space-4); }
	.FdoCarraraTicketDateList { flex-flow: column; gap: 0; }
	.FdoCarraraTicketStamp { flex: 1 1 0; width: auto; max-width: none; margin-inline: 0; min-width: 0; aspect-ratio: 1024 / 515; }
	.FdoCarraraTicketCopy { inset: 0 auto 0 0; width: min(48%, 34rem); justify-content: center; }
}