/* ==========================================================================
   OVERRIDE — regole che neutralizzano il tema padre attivo (Hello +
   Elementor, Twenty XX, Astra, ecc.) SOLO nel contesto `.void-fiera-shell`.

   Caricato DOPO plugin.css così vince in cascade order.
   ========================================================================== */

/* ==== TIPOGRAFIA HEADINGS — neutralizza Elementor/Hello global h1/h2/h3 ====
   Elementor Global Styles + Hello Elementor theme.css applicano regole tipo
   h1, h2, h3 { font-size: 48px; color: #2B2B2D; font-weight: 700; } che
   vincono contro le classi .fiera-*. Serve alta specificity + !important. */

body.void-fiera-shell .fiera-page h1,
body.void-fiera-shell .fiera-page h2,
body.void-fiera-shell .fiera-page h3,
body.void-fiera-shell .fiera-page h4,
body.void-fiera-shell .fiera-page h5,
body.void-fiera-shell .fiera-page h6,
body.void-fiera-shell #colophon h1,
body.void-fiera-shell #colophon h2,
body.void-fiera-shell #colophon h3 {
	font-family: var(--font-sans) !important;
	color: inherit;
	line-height: var(--lh-tight);
	letter-spacing: var(--tracking-tight);
	margin: 0;
}

/* ==== HERO — tagline (H1 piccolo su hero blu) ==== */
body.void-fiera-shell .fiera-hero {
	color: var(--color-text-inverse) !important;
}

body.void-fiera-shell .fiera-hero__tagline {
	color: rgba(255,255,255,0.9) !important;
	font-size: clamp(0.75rem, 1vw + 0.5rem, 1rem) !important;
	font-weight: 500 !important;
	letter-spacing: 0.15em !important;
	text-transform: uppercase !important;
	opacity: 0.9 !important;
	margin: 0 0 clamp(1rem, 2vw, 1.5rem) !important;
	line-height: 1.3 !important;
}

/* ==== HERO — titolo (H2 grande su hero blu) ==== */
body.void-fiera-shell .fiera-hero__title {
	color: #fff !important;
	font-size: clamp(2.5rem, 6vw + 1rem, 5.5rem) !important;
	font-weight: 700 !important;
	line-height: 1.05 !important;
	letter-spacing: -0.02em !important;
	text-transform: uppercase !important;
	margin: 0 0 clamp(1.5rem, 2.5vw, 2rem) !important;
}

/* ==== HERO — descrizione ==== */
body.void-fiera-shell .fiera-hero__desc {
	color: rgba(255,255,255,0.9) !important;
	font-size: clamp(1rem, 1vw + 0.5rem, 1.25rem) !important;
	line-height: 1.6 !important;
	max-width: 65ch !important;
	margin: 0 0 clamp(2rem, 3vw, 2.5rem) !important;
}

/* ==== SEZIONI LIBERE — titoli e testi ==== */
body.void-fiera-shell .fiera-free-section__title,
body.void-fiera-shell .fiera-other-cities__title,
body.void-fiera-shell .fiera-portfolio__title,
body.void-fiera-shell .fiera-contact__title {
	font-size: clamp(2rem, 4vw + 0.5rem, 3.5rem) !important;
	font-weight: 700 !important;
	line-height: 1.15 !important;
	letter-spacing: -0.015em !important;
	margin: 0 0 clamp(1.5rem, 2vw, 2rem) !important;
	color: inherit !important;
}

body.void-fiera-shell .fiera-free-section__body p,
body.void-fiera-shell .fiera-free-section__body {
	font-size: clamp(1rem, 0.9vw + 0.75rem, 1.125rem) !important;
	line-height: 1.65 !important;
	color: inherit !important;
}

body.void-fiera-shell .fiera-other-cities__desc,
body.void-fiera-shell .fiera-portfolio__desc {
	font-size: clamp(1rem, 0.9vw + 0.75rem, 1.125rem) !important;
	line-height: 1.65 !important;
	color: inherit !important;
}

/* Sec3 (chi-siamo) — sfondo chiaro, testi scuri */
body.void-fiera-shell .fiera-free-section--sec3 {
	background: var(--color-bg-primary, #fff) !important;
	color: var(--color-text-primary, #111) !important;
}
body.void-fiera-shell .fiera-free-section--sec3 .fiera-free-section__title {
	color: var(--color-text-primary, #111) !important;
}
body.void-fiera-shell .fiera-free-section--sec3 .fiera-free-section__body,
body.void-fiera-shell .fiera-free-section--sec3 .fiera-free-section__body p {
	color: var(--color-text-primary, #333) !important;
}

/* Sec4 (cosa-facciamo) — sfondo scuro, testi bianchi */
body.void-fiera-shell .fiera-free-section--sec4 {
	background: var(--color-bg-dark, #0a0a0a) !important;
	color: #fff !important;
}
body.void-fiera-shell .fiera-free-section--sec4 .fiera-free-section__title {
	color: #fff !important;
}
body.void-fiera-shell .fiera-free-section--sec4 .fiera-free-section__body,
body.void-fiera-shell .fiera-free-section--sec4 .fiera-free-section__body p {
	color: rgba(255,255,255,0.9) !important;
}

/* Other-cities — sfondo scuro, testi bianchi, titolo centrato */
body.void-fiera-shell .fiera-other-cities {
	background: var(--color-bg-dark, #0a0a0a) !important;
	color: #fff !important;
	text-align: center;
}

body.void-fiera-shell .fiera-other-cities__title {
	color: #fff !important;
	text-align: center !important;
	margin-inline: auto !important;
}

body.void-fiera-shell .fiera-other-cities__desc {
	color: rgba(255, 255, 255, 0.85) !important;
	text-align: center !important;
	max-width: 60ch !important;
	margin-inline: auto !important;
	margin-bottom: clamp(2rem, 3vw, 3rem) !important;
}

body.void-fiera-shell .fiera-other-cities__list {
	justify-content: center !important;
}

body.void-fiera-shell .fiera-other-cities__list a {
	color: #fff !important;
	border-color: rgba(255,255,255,0.35) !important;
	transition: background 0.2s ease, border-color 0.2s ease, color 0.2s ease;
}

body.void-fiera-shell .fiera-other-cities__list a:hover,
body.void-fiera-shell .fiera-other-cities__list a:focus-visible {
	background: var(--color-bg-hero, #2c8eff) !important;
	border-color: var(--color-bg-hero, #2c8eff) !important;
	color: #fff !important;
}

/* ==== BUTTONS — forza colori sopra Elementor global link color ====
   Elementor imposta `a { color: #2c8eff }` come default → i bottoni <a class="button">
   ereditano quel colore. Serve forzare testo/border per matchare il design VØID. */

/* Primary (pieno blu VØID) — testo bianco */
body.void-fiera-shell .fiera-page .button--primary,
body.void-fiera-shell .fiera-page a.button--primary,
body.void-fiera-shell .fiera-page a.button:not(.button--outline):not(.button--inverse) {
	background: var(--color-bg-hero, #2c3fdf) !important;
	color: #fff !important;
	border-color: var(--color-bg-hero, #2c3fdf) !important;
	text-decoration: none !important;
}

body.void-fiera-shell .fiera-page .button--primary:hover,
body.void-fiera-shell .fiera-page a.button--primary:hover,
body.void-fiera-shell .fiera-page a.button:not(.button--outline):not(.button--inverse):hover {
	background: #111 !important;
	border-color: #111 !important;
	color: #fff !important;
}

/* Outline (contorno scuro su bianco) — testo/border neri */
body.void-fiera-shell .fiera-page .button--outline,
body.void-fiera-shell .fiera-page a.button--outline {
	background: transparent !important;
	color: #111 !important;
	border-color: #111 !important;
	text-decoration: none !important;
}

body.void-fiera-shell .fiera-page .button--outline:hover,
body.void-fiera-shell .fiera-page a.button--outline:hover {
	background: #111 !important;
	color: #fff !important;
	border-color: #111 !important;
}

/* Inverse (bianco su hero blu, es. hero CTA) — testo blu VØID */
body.void-fiera-shell .fiera-page .button--inverse,
body.void-fiera-shell .fiera-page a.button--inverse {
	background: #fff !important;
	color: var(--color-bg-hero, #2c3fdf) !important;
	border-color: #fff !important;
	text-decoration: none !important;
}

body.void-fiera-shell .fiera-page .button--inverse:hover,
body.void-fiera-shell .fiera-page a.button--inverse:hover {
	background: transparent !important;
	color: #fff !important;
	border-color: #fff !important;
}

/* Full width variant */
body.void-fiera-shell .fiera-page .button--full,
body.void-fiera-shell .fiera-page a.button--full {
	width: 100% !important;
	justify-content: center !important;
}

/* ==== CASES CARD — testi bianchi (Elementor override) ====
   Elementor imposta `a { color: #2c8eff }` e h3 colors → serve forzare bianco */

body.void-fiera-shell .case-card,
body.void-fiera-shell a.case-card {
	color: #fff !important;
	text-decoration: none !important;
}

body.void-fiera-shell .case-card__title,
body.void-fiera-shell a.case-card .case-card__title {
	color: #fff !important;
	font-family: var(--font-sans) !important;
}

body.void-fiera-shell .case-card__desc,
body.void-fiera-shell a.case-card .case-card__desc {
	color: rgba(255, 255, 255, 0.9) !important;
}

body.void-fiera-shell .case-card__button,
body.void-fiera-shell a.case-card .case-card__button {
	background: #fff !important;
	color: #111 !important;
}

body.void-fiera-shell .case-card:hover .case-card__button,
body.void-fiera-shell a.case-card:hover .case-card__button {
	background: var(--color-bg-hero, #2c3fdf) !important;
	color: #fff !important;
}

/* ==== CASES CAROUSEL — frecce navigazione discrete ==== */
body.void-fiera-shell .cases-carousel__prev,
body.void-fiera-shell .cases-carousel__next {
	width: 44px !important;
	height: 44px !important;
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	background: transparent !important;
	color: var(--color-text-primary, #111) !important;
	border: 1px solid var(--color-text-primary, #111) !important;
	border-radius: 0 !important;
	font-size: 1rem !important;
	font-family: var(--font-sans) !important;
	line-height: 1 !important;
	cursor: pointer;
	transition: background 0.2s ease, color 0.2s ease;
	box-shadow: none !important;
	padding: 0 !important;
}

body.void-fiera-shell .cases-carousel__prev:hover,
body.void-fiera-shell .cases-carousel__next:hover {
	background: var(--color-text-primary, #111) !important;
	color: #fff !important;
}

body.void-fiera-shell .cases-carousel__prev:disabled,
body.void-fiera-shell .cases-carousel__next:disabled {
	opacity: 0.3 !important;
	cursor: default !important;
}

body.void-fiera-shell .cases-carousel__nav {
	display: inline-flex !important;
	gap: 0.5rem !important;
	margin-top: 1.5rem !important;
}

/* ==== CONTACT FALLBACK BOX — leggibile ==== */
body.void-fiera-shell .fiera-contact__fallback {
	background: transparent !important;
	color: rgba(255,255,255,0.9) !important;
	padding: 0 !important;
	border: 0 !important;
}

body.void-fiera-shell .fiera-contact__fallback * {
	color: rgba(255,255,255,0.9) !important;
}

body.void-fiera-shell .fiera-contact__fallback a {
	color: #fff !important;
	text-decoration: underline;
	text-underline-offset: 3px;
}

body.void-fiera-shell .fiera-contact__fallback a:hover {
	color: var(--color-bg-hero, #2c8eff) !important;
}

/* Portfolio — assume sfondo chiaro */
body.void-fiera-shell .fiera-portfolio {
	background: var(--color-bg-primary, #fff);
	color: var(--color-text-primary, #111);
}
body.void-fiera-shell .fiera-portfolio__title,
body.void-fiera-shell .fiera-portfolio__desc {
	color: var(--color-text-primary, #111) !important;
}

/* Badge certificazioni: la classe .badge--dark è pensata per fondi scuri
   (testo bianco). In .fiera-portfolio il fondo è bianco → invertiamo. */
body.void-fiera-shell .fiera-portfolio .badge,
body.void-fiera-shell .fiera-portfolio .badge--dark {
	color: var(--color-text-primary, #111) !important;
	background: transparent !important;
	border-color: rgba(0, 0, 0, 0.3) !important;
}

body.void-fiera-shell .fiera-portfolio .badge:hover,
body.void-fiera-shell .fiera-portfolio .badge--dark:hover {
	background: var(--color-text-primary, #111) !important;
	color: #fff !important;
	border-color: var(--color-text-primary, #111) !important;
}

body.void-fiera-shell .fiera-portfolio__badges {
	list-style: none !important;
	padding: 0 !important;
	margin: 0 0 var(--space-lg, 1.5rem) !important;
	display: flex !important;
	flex-wrap: wrap !important;
	gap: var(--space-xs, 0.5rem) !important;
}

body.void-fiera-shell .fiera-portfolio__badges li {
	list-style: none !important;
	margin: 0 !important;
}

/* Contact — sfondo scuro, testi bianchi */
body.void-fiera-shell .fiera-contact {
	background: var(--color-bg-dark, #0a0a0a);
	color: #fff !important;
}
body.void-fiera-shell .fiera-contact__title {
	color: #fff !important;
}
body.void-fiera-shell .fiera-contact * {
	color: inherit;
}

/* ==== FOOTER — testi bianchi su sfondo scuro ==== */
body.void-fiera-shell #colophon .site-footer__title {
	color: #fff !important;
	font-size: 0.875rem !important;
	font-weight: 600 !important;
	text-transform: uppercase !important;
	letter-spacing: 0.1em !important;
	margin: 0 0 1rem !important;
}

body.void-fiera-shell #colophon,
body.void-fiera-shell #colophon p,
body.void-fiera-shell #colophon a,
body.void-fiera-shell #colophon li {
	color: rgba(255,255,255,0.85) !important;
}

body.void-fiera-shell #colophon a:hover {
	color: #fff !important;
}



/* ==== FORZA LO STILE DEL NOSTRO HEADER ====
   Riasserisce con !important le regole chiave del header VØID così vincono
   sempre contro i selettori del tema padre (Hello + Elementor). */

body.void-fiera-shell #masthead.site-header {
	position: fixed !important;
	top: 0 !important;
	left: 0 !important;
	right: 0 !important;
	width: 100vw !important;
	max-width: 100vw !important;
	min-width: 0 !important;
	margin: 0 !important;
	z-index: 9999 !important;
	background: transparent;
	color: var(--color-text-inverse) !important;
	padding-block: var(--space-md);
	font-family: var(--font-sans) !important;
	transform: translateY(0);
	transition:
		transform 0.3s ease-out,
		background var(--duration-base) var(--ease-standard),
		color var(--duration-base) var(--ease-standard);
}

/* Container interno del header: qui torna la larghezza boxed per il contenuto (logo + menu) */
body.void-fiera-shell #masthead .site-header__inner {
	width: 100% !important;
	max-width: var(--container-xl, 1360px) !important;
	margin-inline: auto !important;
	padding-inline: var(--space-lg) !important;
	display: flex !important;
	align-items: center !important;
	justify-content: space-between !important;
	gap: var(--space-md) !important;
}

/* ==== FOOTER — stessa cura del header ====
   Il tema padre limita anche il footer a max-width: 1140px. Forziamo full-viewport
   ma manteniamo il container interno boxed per il contenuto. */

body.void-fiera-shell #colophon.site-footer {
	width: 100vw !important;
	max-width: 100vw !important;
	min-width: 0 !important;
	margin: 0 !important;
	margin-top: 0 !important;
	position: relative;
	left: 50%;
	right: 50%;
	margin-left: -50vw !important;
	margin-right: -50vw !important;
	background: var(--color-bg-dark) !important;
	color: var(--color-text-inverse) !important;
	font-family: var(--font-sans) !important;
	padding-block: var(--space-3xl) !important;
	padding-inline: 0 !important;
}

body.void-fiera-shell #colophon.site-footer > .container {
	width: 100% !important;
	max-width: var(--container-xl, 1360px) !important;
	margin-inline: auto !important;
	padding-inline: var(--space-lg) !important;
}

/* Logo footer: assicura sempre visibilità (rimuove eventuali filter del tema padre) */
body.void-fiera-shell #colophon .site-footer__logo {
	display: block !important;
	filter: none !important;
	opacity: 1 !important;
	max-width: 96px !important;
	width: 96px !important;
	height: auto !important;
	background: transparent !important;
}

@media (min-width: 1024px) {
	body.void-fiera-shell #colophon .site-footer__logo {
		width: 124px !important;
		max-width: 124px !important;
	}
}

body.void-fiera-shell #masthead.site-header.is-hidden {
	transform: translateY(-100%);
}

body.void-fiera-shell #masthead.site-header.site-header--scrolled {
	background: rgba(0, 0, 0, 0.4) !important;
	-webkit-backdrop-filter: blur(12px);
	backdrop-filter: blur(12px);
	box-shadow: 0 1px 0 rgba(255, 255, 255, 0.08);
}

body.void-fiera-shell #masthead .site-branding__logo {
	display: block !important;
	width: 96px !important;
	max-width: 96px !important;
	height: auto !important;
	color: inherit;
}

@media (min-width: 1024px) {
	body.void-fiera-shell #masthead .site-branding__logo {
		width: 124px !important;
		max-width: 124px !important;
	}
}

body.void-fiera-shell #masthead .site-nav__list {
	display: flex !important;
	flex-wrap: wrap;
	gap: var(--space-xl) !important;
	margin: 0 !important;
	padding: 0 !important;
	list-style: none !important;
}

body.void-fiera-shell #masthead .site-nav__list a {
	color: inherit !important;
	text-decoration: none !important;
	font-size: var(--fs-14) !important;
	font-weight: var(--fw-medium) !important;
	letter-spacing: var(--tracking-wide);
	text-transform: uppercase;
	padding: var(--space-xs) 0;
	border-bottom: 1px solid transparent;
}

/* Fix 1 — Burger toggle: mostra SOLO sotto 1024px */
body.void-fiera-shell #masthead .site-nav__toggle {
	display: inline-flex !important;
	background: transparent !important;
	border: 0 !important;
	color: inherit !important;
	width: 2.75rem;
	height: 2.75rem;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	padding: 0 !important;
}

@media (min-width: 1024px) {
	body.void-fiera-shell #masthead .site-nav__toggle {
		display: none !important;
	}
	body.void-fiera-shell #masthead .site-nav--desktop {
		display: block !important;
	}
}

@media (max-width: 1023px) {
	body.void-fiera-shell #masthead .site-nav--desktop {
		display: none !important;
	}
}

/* Fix 3 — Header scroll state: forzare padding costante + solid background bel definito */
body.void-fiera-shell #masthead.site-header {
	padding-block: var(--space-md) !important;
	padding-left: 0 !important;
	padding-right: 0 !important;
	box-shadow: none;
}

body.void-fiera-shell #masthead.site-header.site-header--scrolled {
	padding-block: var(--space-md) !important;
	background: rgba(0, 0, 0, 0.4) !important;
	-webkit-backdrop-filter: blur(12px) !important;
	backdrop-filter: blur(12px) !important;
	box-shadow: 0 1px 0 rgba(255, 255, 255, 0.08) !important;
	color: var(--color-text-inverse) !important;
}

/* Fallback per browser senza backdrop-filter */
@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
	body.void-fiera-shell #masthead.site-header.site-header--scrolled {
		background: rgba(0, 0, 0, 0.75) !important;
	}
}

/* Body padding-top compensation: header è fixed → hero deve partire da y=0
   ma il tema padre potrebbe aggiungere padding-top al body. Neutralizzo. */
body.void-fiera-shell {
	padding-top: 0 !important;
	margin-top: 0 !important;
}

/* ==== NASCONDI HEADER/FOOTER DEL TEMA PADRE ====
   Il plugin renderizza il proprio header/footer. Nascondiamo quello
   di Elementor (Hello theme + Elementor Header/Footer Builder) e quelli
   generici dei principali temi WordPress. */

body.void-fiera-shell .elementor-location-header,
body.void-fiera-shell .elementor-location-footer,
body.void-fiera-shell .site-header:not(#masthead),
body.void-fiera-shell .site-footer:not(#colophon),
body.void-fiera-shell header.entry-header,
body.void-fiera-shell nav.wp-block-navigation:not(.site-nav__list),
body.void-fiera-shell > .wp-site-blocks > header,
body.void-fiera-shell > .wp-site-blocks > footer {
	display: none !important;
}

/* Hello theme + Elementor: rimuove tutti i wrapper contenitivi che boxano
   la pagina. Copre le classi note dei principali temi + Elementor Theme
   Builder + Block editor. */
body.void-fiera-shell #page,
body.void-fiera-shell .site,
body.void-fiera-shell .site-content,
body.void-fiera-shell .content-area,
body.void-fiera-shell .site-main,
body.void-fiera-shell #primary,
body.void-fiera-shell #content,
body.void-fiera-shell .hfeed,
body.void-fiera-shell article.post,
body.void-fiera-shell article.type-fiera,
body.void-fiera-shell .entry-content,
body.void-fiera-shell .elementor-location-single,
body.void-fiera-shell .elementor,
body.void-fiera-shell .elementor-container,
body.void-fiera-shell .elementor-section,
body.void-fiera-shell .elementor-section-boxed,
body.void-fiera-shell .elementor-widget-wrap,
body.void-fiera-shell .elementor-widget-container,
body.void-fiera-shell .e-con-boxed,
body.void-fiera-shell .e-con-full,
body.void-fiera-shell .e-con,
body.void-fiera-shell .e-con-inner {
	max-width: none !important;
	width: 100% !important;
	padding: 0 !important;
	margin: 0 !important;
	background: transparent !important;
}

/* Neutralizza main del tema padre se wrappa la nostra pagina fiera */
body.void-fiera-shell > #page,
body.void-fiera-shell > .site,
body.void-fiera-shell > main {
	display: block !important;
}

/* Elementor: rimuovi anche i pseudo-container "wrap" e "row" */
body.void-fiera-shell .elementor-row,
body.void-fiera-shell .elementor-column-wrap {
	max-width: none !important;
	width: 100% !important;
	padding: 0 !important;
	margin: 0 !important;
}

/* ==== BREAKOUT FULL-WIDTH ====
   Le nostre sezioni fiera sono progettate per essere full-viewport-width.
   Il tema padre spesso mette `<main>` dentro un container boxed → questo
   pattern "sfonda" il parent. */

.fiera-page {
	max-width: none !important;
	width: 100%;
	padding: 0 !important;
	margin: 0 !important;
}

.fiera-page > section {
	width: 100vw;
	position: relative;
	left: 50%;
	right: 50%;
	margin-left: -50vw !important;
	margin-right: -50vw !important;
	max-width: none;
}

body.void-fiera-shell {
	overflow-x: hidden;
}

/* ==== TYPOGRAPHY SCOPE ==== */

.fiera-page,
.fiera-page *:not(input):not(textarea):not(select):not(button) {
	font-family: var(--font-sans);
}

.fiera-page h1,
.fiera-page h2,
.fiera-page h3,
.fiera-page h4,
.fiera-page h5,
.fiera-page h6 {
	font-family: var(--font-sans);
	font-weight: var(--fw-bold);
	color: inherit;
	line-height: var(--lh-tight);
	letter-spacing: var(--tracking-tight);
}

.fiera-page p {
	font-family: var(--font-sans);
	line-height: var(--lh-normal);
}

.fiera-page a {
	text-decoration: none;
}

.fiera-page .fiera-free-section__body a,
.fiera-page .fiera-portfolio__desc a,
.fiera-page .fiera-other-cities__desc a,
.fiera-page .accordion__content a {
	color: var(--color-bg-hero);
	text-decoration: underline;
	text-underline-offset: 0.15em;
}

.fiera-page ul,
.fiera-page ol {
	list-style: none;
	padding-left: 0;
}

.fiera-page .fiera-free-section__body ul,
.fiera-page .fiera-portfolio__desc ul,
.fiera-page .accordion__content ul {
	list-style: disc;
	padding-left: var(--space-lg);
}

.fiera-page img {
	max-width: 100%;
	display: block;
}

/* ==== IMMAGINI IN CONTENITORI CON ASPECT-RATIO ====
   Il tema padre (Hello) applica `img { height: auto !important }` che rompe
   il pattern cover con contenitore aspect-ratio. Riasseriamo per tutti i
   componenti VØID che hanno un contenitore con proporzione fissa. */

.fiera-page .fiera-portfolio__image img,
.fiera-page .fiera-other-cities__card-image img,
.fiera-page .fiera-cases__image img,
.fiera-page .fiera-hero__image img,
.fiera-page .fiera-free-section__media img,
.fiera-page .cases-carousel__image img,
.fiera-page .cases-carousel__slide img,
.fiera-page [class*="__image"] > img,
.fiera-page [class*="__media"] > img,
.fiera-page [class*="__cover"] > img,
.fiera-page .ratio > img,
.fiera-page .ratio--1-1 > img,
.fiera-page .ratio--16-9 > img,
.fiera-page .ratio--4-3 > img,
.fiera-page .ratio--3-4 > img {
	width: 100% !important;
	height: 100% !important;
	object-fit: cover !important;
	display: block;
}

/* Video con lo stesso comportamento (hero video, sec5 video) */
.fiera-page .fiera-hero__image video,
.fiera-page [class*="__image"] > video,
.fiera-page [class*="__media"] > video,
.fiera-page [class*="__cover"] > video {
	width: 100% !important;
	height: 100% !important;
	object-fit: cover !important;
	display: block;
}

/* ==== ACCORDION FAQ — riasserimenti anti-tema ==== */
/* Alcuni temi/plugin stilano <button>, <details>, <summary> con propri stili.
   Riasseriamo con forza per l'accordion FAQ VØID. */

.fiera-page .accordion {
	display: flex;
	flex-direction: column;
	gap: var(--space-sm);
}

.fiera-page .accordion__item {
	background: var(--color-bg-primary) !important;
	border: var(--border-thin) !important;
	border-radius: 0 !important;
	overflow: hidden !important;
	padding: 0 !important;
	margin: 0 !important;
	box-shadow: none !important;
}

.fiera-page .accordion__heading {
	margin: 0 !important;
	padding: 0 !important;
	font-size: inherit !important;
	font-weight: inherit !important;
	line-height: inherit !important;
	background: transparent !important;
}

.fiera-page .accordion__trigger {
	width: 100% !important;
	display: flex !important;
	align-items: center !important;
	justify-content: space-between !important;
	gap: var(--space-md) !important;
	padding: var(--space-lg) !important;
	background: transparent !important;
	color: var(--color-text-primary) !important;
	font-family: var(--font-sans) !important;
	font-size: var(--fs-18) !important;
	font-weight: var(--fw-medium) !important;
	text-align: left !important;
	text-transform: none !important;
	letter-spacing: normal !important;
	line-height: var(--lh-normal) !important;
	border: 0 !important;
	border-radius: 0 !important;
	box-shadow: none !important;
	cursor: pointer;
	appearance: none;
	-webkit-appearance: none;
}

.fiera-page .accordion__trigger:hover {
	background: var(--color-bg-muted) !important;
}

.fiera-page .accordion__icon {
	flex-shrink: 0;
	width: 1.25rem;
	height: 1.25rem;
	position: relative;
}

.fiera-page .accordion__panel {
	overflow: hidden;
	max-height: 0;
	transition: max-height var(--duration-slow) var(--ease-standard);
	background: transparent !important;
}

.fiera-page .accordion__panel[data-open="true"] {
	max-height: 2000px;
}

.fiera-page .accordion__content {
	padding: 0 var(--space-lg) var(--space-lg) !important;
	color: var(--color-text-muted) !important;
	line-height: var(--lh-loose) !important;
	font-family: var(--font-sans) !important;
	font-size: var(--fs-16) !important;
}

.fiera-page .accordion__content p {
	margin: 0 0 var(--space-md);
	color: inherit;
}

.fiera-page .accordion__content > :last-child {
	margin-bottom: 0;
}

/* ==== BUTTON — riasseriamo family/line-height ==== */
.fiera-page .button,
.fiera-page a.button {
	font-family: var(--font-sans);
	line-height: 1;
	cursor: pointer;
	text-decoration: none;
}
