/**
 * Stili delle sole pagine dinamiche (elenco e scheda aeromobile).
 * Le pagine vetrina restano quelle congelate da WordPress e non sono toccate.
 * Font, colori e spaziature vengono ereditati dal tema tramite le sue
 * variabili CSS, con valori di ripiego per non dipenderne del tutto.
 */

/*
 * L'header del tema è in overlay sopra il contenuto: nelle pagine costruite
 * con Elementor l'ingombro è assorbito da un hero alto, ma queste pagine non
 * ne hanno uno, e titolo e filtri finirebbero sotto la barra di navigazione.
 * Il valore corrisponde all'altezza misurata dell'header: 109px su tutti i
 * dispositivi (la riga "middle" del tema non ha un'altezza diversa su mobile;
 * il vecchio 70px sotto i 1000px faceva finire il breadcrumb sotto la barra).
 */
:root {
	--of-header-height: 109px;
	/* Altezza dell'intestazione quando si riduce durante lo scorrimento. */
	--of-header-sticky: 63px;
	/* Altezza dell'indice delle specifiche: lo script la rimisura in pagina. */
	--of-specs-nav-height: 47px;
}

/* Testata di pagina: riprende l'impianto delle pagine originali, con
   breadcrumb, titolo e testo introduttivo su fondo tenue. */

.of-page-hero {
	background: #eaf1f8;
	padding-top: calc(var(--of-header-height) + clamp(1.5rem, 4vw, 2.5rem));
	padding-bottom: clamp(2rem, 5vw, 3.5rem);
}

/* Breadcrumb e titolo ricalcano i widget Elementor delle pagine statiche
   (es. Services): breadcrumb 12px/700, titolo Montserrat 600. */
.of-breadcrumb {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 1.8px;
	text-transform: uppercase;
	color: #000;
	margin-bottom: 0.75rem;
}

.of-breadcrumb a {
	text-decoration: none;
	color: var(--e-global-color-primary, #6ec1e4);
}

.of-page-hero__title {
	margin: 0 0 0.75rem;
	font-family: Montserrat, sans-serif;
	font-size: clamp(2rem, 5vw, 3.25rem);
	font-weight: 600;
	letter-spacing: -0.9px;
	line-height: 1.1;
}

/* H1 delle pagine Elementor: prendono lo stile del widget che le contiene. */
.of-h1 {
	margin: 0;
	padding: 0;
	font: inherit;
	color: inherit;
	letter-spacing: inherit;
	text-transform: inherit;
	line-height: inherit;
}

.of-errore {
	padding: 2rem 0 4rem;
}

.of-errore__bottone {
	display: inline-block;
	margin: 0 0.5rem 0.75rem 0;
	padding: 0.75rem 1.5rem;
	color: #fff !important;
	background: #206ba6;
	font-weight: 600;
	text-transform: uppercase;
	text-decoration: none;
}

.of-page-hero__lead {
	max-width: 68ch;
	margin: 0;
	opacity: 0.8;
}

.of-listing {
	padding-block: clamp(2rem, 5vw, 3.5rem);
}

/*
 * Nessun padding in alto: la testata con il breadcrumb, subito sopra, già
 * compensa l'header in overlay. Sommandoli si aprivano 189px fra breadcrumb e
 * gallery, contro i 41 dell'originale.
 */
.of-aircraft {
	padding-top: 0;
	padding-bottom: clamp(2rem, 5vw, 4rem);
}

.of-filters {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem;
	margin-bottom: 2rem;
}

.of-filter {
	padding: 0.35rem 0.85rem;
	font-size: 0.82rem;
	text-decoration: none;
	color: inherit;
	background: #eef2f7;
	border: 1px solid transparent;
	transition: background 0.2s ease, border-color 0.2s ease;
}

.of-filter:hover {
	border-color: #b9cde0;
}

.of-filter.is-active {
	background: #1a6ca8;
	color: #fff;
}

.of-empty {
	padding-block: 2rem;
	opacity: 0.7;
}

/* Elenco */

/*
 * Griglia a cinque colonne, come nell'originale: su container da 1705px sono
 * 317px ciascuna con 30px di distanza (5 × 317 + 4 × 30 = 1705). Card più
 * larghe darebbero immagini sensibilmente più grandi del vecchio sito.
 */
.of-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(min(100%, 280px), 1fr));
	gap: 30px;
	margin: 0;
	padding: 0;
	list-style: none;
}

@media (min-width: 1200px) {
	.of-grid {
		grid-template-columns: repeat(5, 1fr);
	}
}

.of-card {
	border: 1px solid #e3e8ee;
	background: #fbfcfd;
}

.of-card a {
	display: block;
	text-decoration: none;
	color: inherit;
}

.of-card__body {
	padding: 1rem 1.1rem 1.1rem;
}

/* Valori dell'originale: 13px in grassetto con 6px di spaziatura fra le lettere. */
.of-card__cta {
	display: inline-block;
	margin-top: 0.9rem;
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 6px;
	text-transform: uppercase;
	color: #206ba6;
}

.of-card a:hover .of-card__cta {
	text-decoration: underline;
}

/* 16:9 come nell'originale (315 × 177), non 4:3. */
.of-card__media {
	position: relative;
	margin: 0;
	aspect-ratio: 16 / 9;
	overflow: hidden;
	background: rgba(128, 128, 128, 0.08);
}

.of-card__media img {
	width: 100%;
	height: 100%;
	object-fit: contain;
	transition: transform 0.4s ease;
}

.of-card a:hover .of-card__media img {
	transform: scale(1.04);
}

/* Tipografia della card presa dall'originale: titolo 16/600, CTA 13px. */
.of-card__title {
	margin: 0 0 0.25rem;
	font-size: 16px;
	font-weight: 600;
	line-height: 1.35;
}

.of-card__sn {
	margin: 0;
	font-size: 0.85rem;
	opacity: 0.6;
}

/*
 * Badge di stato, con i valori misurati sull'originale: staccato di 10px
 * dall'angolo dell'immagine, padding 10/15, 14px in grassetto maiuscolo.
 * Il colore è lo stesso per tutti gli stati — anche "Sold" è blu.
 */
.of-badge {
	position: absolute;
	inset-block-start: 10px;
	inset-inline-start: 10px;
	padding: 10px 15px;
	font-size: 14px;
	font-weight: 700;
	line-height: 1;
	text-transform: uppercase;
	color: #fff;
	background: #216a9c;
}

/* Scheda */

.of-page-hero--compact {
	padding-bottom: 1rem;
}

.of-page-hero--compact .of-breadcrumb {
	margin-bottom: 0;
}

/* Intestazione della scheda: titolo e tag a sinistra, stato a destra. */

.of-aircraft__head {
	display: flex;
	flex-wrap: wrap;
	gap: 1rem 2rem;
	align-items: flex-start;
	justify-content: space-between;
	margin-block: 2rem 2.5rem;
	padding-bottom: 1.25rem;
	border-bottom: 1px solid #e3e8ee;
}

.of-tags {
	display: flex;
	flex-wrap: wrap;
	gap: 0.4rem;
	margin: 0.85rem 0 0;
}

.of-tag {
	padding: 0.28rem 0.7rem;
	font-size: 0.72rem;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	background: #eef2f7;
}

.of-tag--plain {
	background: transparent;
	padding-inline: 0;
	opacity: 0.6;
	letter-spacing: 0.04em;
	text-transform: none;
}

.of-aircraft__state {
	margin: 0;
	font-size: 1.05rem;
	font-weight: 700;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: #1a6ca8;
	white-space: nowrap;
}

.of-aircraft__state--pending {
	color: #b0761b;
}

.of-aircraft__state--sold {
	color: #55636e;
}

/* Corpo: una sola colonna, le specifiche a piena larghezza. */

.of-aircraft__body {
	display: grid;
	gap: clamp(2rem, 4vw, 3rem);
}

/*
 * Richiesta di informazioni in fondo alla scheda. Prima era una colonna
 * laterale agganciata allo scorrimento; ora chiude la pagina a piena
 * larghezza, quindi il riquadro respira di più e il modulo resta su una
 * misura leggibile invece di allargarsi per tutto il contenitore.
 */
.of-aircraft__contatto {
	margin-top: clamp(2.5rem, 5vw, 4rem);
}

.of-aircraft__contatto .of-contact-box {
	padding: clamp(1.4rem, 4vw, 2.6rem);
}

.of-aircraft__contatto .of-contact-box > * {
	max-width: 900px;
	margin-inline: auto;
}

@media (min-width: 700px) {
	.of-aircraft__contatto .of-contact-box h2 {
		font-size: 1.7rem;
	}

	.of-aircraft__contatto .of-form__campo textarea {
		min-height: 7rem;
	}
}

/* ── Indice delle specifiche ───────────────────────────────────────────────
   Barra con una voce per ogni sezione di `articoli_testi`, agganciata sotto
   l'intestazione del tema: è l'unico sommario della scheda, che altrimenti si
   percorre solo scorrendo. Le voci scorrono in orizzontale quando non stanno
   su una riga, invece di andare a capo e far crescere la barra in altezza. */

.of-specs-nav {
	position: sticky;
	top: var(--of-header-sticky);
	/* Sopra il contenuto della scheda ma sotto l'header del tema, che sta molto più in alto. */
	z-index: 5;
	/*
	 * Sopra basta il margine dell'intestazione, che chiude con una riga di
	 * separazione; sotto serve aria, altrimenti la barra sembra il titolo
	 * della prima sezione invece dell'indice di tutte.
	 */
	margin-block: 0 clamp(2rem, 4vw, 3rem);
	/*
	 * Fondo tenue del riquadro dei contatti e righe di contorno: da agganciata
	 * la barra si stacca dal testo che le scorre dietro, e da ferma si legge
	 * come un elemento a sé e non come una riga di testo fra le altre.
	 */
	background: #eaf3f9;
	border-block: 1px solid #cddcea;
	box-shadow: 0 10px 16px -14px rgba(18, 33, 46, 0.5);
	overflow-x: auto;
	overscroll-behavior-x: contain;
	-webkit-overflow-scrolling: touch;
	/* La barra di scorrimento orizzontale taglierebbe in due una barra alta 47px. */
	scrollbar-width: none;
}

.of-specs-nav::-webkit-scrollbar {
	height: 0;
}

.of-specs-nav__lista {
	display: flex;
	/* Spaziatura piccola: l'aria fra le voci la dà il loro padding. */
	gap: clamp(0.1rem, 0.6vw, 0.4rem);
	margin: 0;
	padding: 0;
	list-style: none;
	white-space: nowrap;
}

.of-specs-nav__link {
	display: block;
	padding: 0.9rem 0.7rem 0.8rem;
	font-size: 0.8rem;
	font-weight: 600;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: #3d5262;
	text-decoration: none;
	border-bottom: 3px solid transparent;
	transition: color 0.2s ease, background 0.2s ease, border-color 0.2s ease;
}

.of-specs-nav__link:hover,
.of-specs-nav__link:focus-visible {
	color: #10477a;
	background: rgba(255, 255, 255, 0.6);
}

/*
 * Sezione che si sta leggendo, marcata dallo script: fondo pieno e riga blu.
 * Il peso del carattere resta quello delle altre voci, perché il grassetto
 * allarga il testo e a ogni cambio di sezione farebbe scattare la fila.
 */
.of-specs-nav__link.is-attiva {
	color: #10477a;
	background: #fff;
	border-bottom-color: #1a6ca8;
}

/*
 * Il salto all'ancora deve fermarsi sotto l'intestazione e sotto la barra,
 * altrimenti il titolo della sezione finisce coperto da entrambe.
 */
.of-specs__block[id] {
	scroll-margin-top: calc(var(--of-header-sticky) + var(--of-specs-nav-height) + 1rem);
}

/* Risalita in coda a ogni sezione, allineata in fondo a destra. */
.of-specs__ritorno {
	margin: 1.1rem 0 0;
	text-align: end;
}

.of-specs__ritorno a {
	font-size: 0.72rem;
	font-weight: 600;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: #55636e;
	text-decoration: none;
}

.of-specs__ritorno a:hover,
.of-specs__ritorno a:focus-visible {
	color: #206ba6;
	text-decoration: underline;
}

/* Scorrimento morbido fra le sezioni, tranne per chi chiede meno animazioni. */
@media (prefers-reduced-motion: no-preference) {
	html:has(.of-specs-nav) {
		scroll-behavior: smooth;
	}
}

.of-section-title {
	display: flex;
	align-items: center;
	gap: 0.9rem;
	margin: 0 0 1.5rem;
	font-size: 1.5rem;
}

.of-section-title::before {
	content: "";
	width: 2.2rem;
	height: 3px;
	background: #1a6ca8;
	flex: none;
}

/* Riquadro della richiesta di informazioni, con il fondo dell'originale. */
.of-contact-box {
	padding: clamp(1.1rem, 2.5vw, 1.4rem);
	background: #eaf3f9;
}

.of-contact-box h2 {
	margin: 0 0 0.75rem;
	font-size: 1.35rem;
}

.of-contact-box h2 em {
	font-style: italic;
	color: #206ba6;
}

.of-contact-box__note {
	margin: 0.7rem 0 0;
	font-size: 0.85rem;
	opacity: 0.75;
}

/* Form */

.of-form__riga {
	display: grid;
	gap: 0.75rem;
}

@media (min-width: 480px) {
	.of-form__riga {
		grid-template-columns: 1fr 1fr;
	}
}

.of-form__campo {
	margin: 0 0 0.6rem;
}

.of-form__campo label {
	display: block;
	margin-bottom: 0.2rem;
	font-size: 0.82rem;
	font-weight: 600;
}

.of-form__campo label span {
	color: #b3261e;
}

.of-form__campo input,
.of-form__campo textarea {
	width: 100%;
	padding: 0.65rem 0.8rem;
	font: inherit;
	color: inherit;
	background: #fff;
	border: 1px solid #cddcea;
}

.of-form__campo input:focus-visible,
.of-form__campo textarea:focus-visible {
	outline: 2px solid #206ba6;
	outline-offset: -1px;
}

.of-form__campo textarea {
	resize: vertical;
	min-height: 4.5rem;
}

.of-form__consenso {
	margin: 0 0 0.6rem;
	font-size: 0.75rem;
	line-height: 1.4;
}

.of-form__consenso label {
	display: grid;
	grid-template-columns: auto 1fr;
	gap: 0.55rem;
	align-items: start;
	cursor: pointer;
}

.of-form__consenso input {
	margin-top: 0.2rem;
}

/*
 * La trappola per gli invii automatici va nascosta senza display:none, che
 * alcuni bot riconoscono, e resa inaccessibile alla navigazione da tastiera.
 */
.of-form__trappola {
	position: absolute;
	left: -9999px;
	width: 1px;
	height: 1px;
	overflow: hidden;
}

/* Pulsante con i valori dell'originale: 16px/700, spaziatura 2.9px. */
.of-form__invia {
	display: inline-block;
	margin-top: 0.35rem;
	padding: 15px 36px;
	font-size: 16px;
	font-weight: 700;
	letter-spacing: 2.9px;
	text-transform: uppercase;
	color: #fff;
	background: #206ba6;
	border: 0;
	cursor: pointer;
	transition: background 0.2s ease;
}

.of-form__invia:hover {
	background: #17537f;
}

/* Esiti */

.of-msg {
	margin: 0 0 1rem;
	padding: 0.75rem 1rem;
	font-size: 0.9rem;
	border-inline-start: 3px solid;
}

.of-msg p {
	margin: 0 0 0.35rem;
}

.of-msg p:last-child {
	margin-bottom: 0;
}

.of-msg--ok {
	color: #14532d;
	background: #dcfce7;
	border-color: #16a34a;
}

.of-msg--ko {
	color: #7f1d1d;
	background: #fee2e2;
	border-color: #b3261e;
}

/* ── Download degli allegati ──────────────────────────────────────────────
   Come nell'originale: il nome del file è testo semplice e lo scaricamento
   avviene dal pulsante sottostante. */

.of-download {
	margin-block: 2.5rem;
}

.of-download__voce + .of-download__voce {
	margin-top: 1.75rem;
	padding-top: 1.75rem;
	border-top: 1px solid #e3e8ee;
}

.of-download__nome {
	margin: 0 0 0.9rem;
}

/* Valori del pulsante originale: fondo #0a1421, 12.8px/600, spaziatura 2.3px. */
.of-download__pulsante {
	display: inline-flex;
	align-items: center;
	gap: 0.55rem;
	padding: 16px 32px;
	font-size: 12.8px;
	font-weight: 600;
	letter-spacing: 2.3px;
	text-decoration: none;
	color: #fff;
	background: #0a1421;
	transition: background 0.2s ease;
}

.of-download__pulsante:hover {
	background: #1d3450;
}

/* Filmato caricato dal pannello: chiude la colonna principale, sotto i
   download. Riempie la colonna e non supera mai l'altezza della finestra. */
.of-video-file {
	margin-top: 2.5rem;
}

.of-video-file__player {
	display: block;
	width: 100%;
	max-height: 70vh;
	background: #000;
}

/* Pulsante del video in fondo a una sezione delle specifiche: stesso aspetto
   del pulsante di download, con un po' d'aria dal testo che lo precede. */
.of-specs__video {
	margin: 1.2rem 0 0;
}

.of-download__icona {
	width: 1.05rem;
	height: 1.05rem;
	flex: none;
}

/* ── Gallery ─────────────────────────────────────────────────────────────
   Slider principale con miniature scorrevoli a lato e ingrandimento, come
   nella pagina prodotto originale. Usa lo Swiper v8 già presente fra gli
   asset del tema. */

.of-gallery {
	display: grid;
	gap: 0.6rem;
}

/* Titolo con il pulsante "Back" allineato a destra. */
.of-aircraft__titolo {
	/* Stacco dalla fascia del breadcrumb (#aircraft-top), che sopra ha lo sfondo azzurro. */
	margin-top: clamp(1.5rem, 4vw, 2.5rem);
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
}

.of-aircraft__titolo h1 {
	margin: 0;
	/* Il tema dà 40px / 1.5 a tutti gli H1: su mobile i titoli lunghi delle
	   schede occupavano mezza schermata. Si scala da ~28px a 40px. */
	--theme-font-size: clamp(26px, 4.2vw + 12px, 40px);
	--theme-line-height: 1.2;
}

.of-indietro {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	padding: 10px 22px;
	font-size: 12.8px;
	font-weight: 600;
	letter-spacing: 2.3px;
	text-transform: uppercase;
	text-decoration: none;
	color: #0a1421;
	border: 1px solid #0a1421;
	transition: background 0.2s ease, color 0.2s ease;
}

.of-indietro:hover,
.of-indietro:focus-visible {
	background: #0a1421;
	color: #fff;
}

/*
 * Gallery a sinistra, Headlines a destra solo da 1400px: sotto, la gallery è
 * troppo bassa per contenere l'elenco e lascerebbe un vuoto, quindi Headlines
 * scende a tutta larghezza con le voci su più colonne.
 */
.of-aircraft__top {
	display: grid;
	gap: 1.5rem;
	margin-top: 1.5rem;
}

.of-headlines {
	display: flex;
	flex-direction: column;
	padding: clamp(1.1rem, 2.5vw, 1.6rem);
	background: #eaf3f9;
}

.of-headlines .of-section-title {
	margin-bottom: 0.9rem;
	font-size: 1.3rem;
}

.of-headlines ul {
	margin: 0;
	padding: 0;
	list-style: none;
	column-gap: 2.5rem;
}

@media (min-width: 700px) {
	.of-headlines ul {
		columns: 2;
	}
}

@media (min-width: 1000px) {
	.of-headlines ul {
		columns: 3;
	}
}

.of-headlines ul li {
	position: relative;
	padding: 0.4rem 0 0.4rem 40px;
	font-size: 0.95rem;
	line-height: 1.35;
	border-bottom: 1px solid rgba(26, 108, 168, 0.15);
	break-inside: avoid;
}

/*
 * Aeroplanino del sito online al posto del punto elenco, centrato sulla prima
 * riga della voce. Il JPG ha il fondo bianco: "multiply" lo fonde con
 * l'azzurro del riquadro, che altrimenti mostrerebbe un rettangolo chiaro.
 */
.of-headlines ul li::before {
	content: "";
	position: absolute;
	left: 3px;
	top: calc(0.4rem + 0.675em - 6.5px);
	width: 30px;
	height: 13px;
	background: url("images/plane_bullet.jpg") no-repeat center / contain;
	mix-blend-mode: multiply;
}

/* Stesso fondo del riquadro: da collassato la maschera isola il contenitore,
   e gli aeroplanini devono fondersi con un colore suo, non col trasparente. */
.of-headlines__testo {
	background: #eaf3f9;
}

/* Margini dei paragrafi dell'editor: il riquadro ha già il suo padding. */
.of-headlines__testo > :first-child {
	margin-top: 0;
}

.of-headlines__testo > :last-child {
	margin-bottom: 0;
}

/*
 * Senza Headlines la gallery resta sola e prende tutta la riga. La doppia
 * classe vince sulle colonne fissate nelle media query più sotto.
 */
.of-aircraft__top.of-aircraft__top--solo {
	grid-template-columns: minmax(0, 1fr);
}

.of-headlines__altro {
	align-self: flex-start;
	margin-top: 0.8rem;
	padding: 0;
	font: inherit;
	font-size: 12.8px;
	font-weight: 600;
	letter-spacing: 2.3px;
	text-transform: uppercase;
	color: #1a6ca8;
	background: none;
	border: 0;
	cursor: pointer;
}

.of-headlines__altro:hover {
	text-decoration: underline;
}

@media (min-width: 1400px) {
	/* Colonna larga e voci su due colonne: l'elenco dimezza l'altezza. */
	.of-aircraft__top {
		grid-template-columns: minmax(0, 3fr) minmax(0, 2fr);
	}

	/*
	 * Griglia e non `columns`: con un'altezza imposta, il multicolonna
	 * aggiungerebbe colonne di lato invece di tagliare in fondo.
	 */
	.of-headlines ul {
		columns: auto;
		display: grid;
		grid-template-columns: 1fr 1fr;
		align-content: start;
		column-gap: 1.5rem;
	}

	.of-headlines ul li {
		font-size: 0.9rem;
	}

	/*
	 * L'altezza della riga la detta la gallery: `contain: size` toglie al
	 * riquadro l'altezza propria, che si allunga quindi fino al fondo della
	 * gallery. Nessuno scorrimento interno: se l'elenco è più lungo, le
	 * ultime voci sfumano e "Show all" apre il riquadro per intero.
	 */
	.of-aircraft__top--gallery .of-headlines:not(.is-aperta) {
		contain: size;
	}

	/*
	 * space-between distribuisce fra le righe l'altezza che avanza, così
	 * l'elenco arriva al fondo della gallery; se invece manca spazio, si
	 * comporta come start e il taglio resta in basso.
	 */
	.of-aircraft__top--gallery .of-headlines:not(.is-aperta) .of-headlines__testo {
		display: flex;
		flex-direction: column;
		flex: 1;
		min-height: 0;
		overflow: hidden;
	}

	.of-aircraft__top--gallery .of-headlines:not(.is-aperta) .of-headlines__testo ul {
		flex: 1;
		align-content: space-between;
	}

	/*
	 * Il taglio sta sul contenitore e non sulla lista: il contenuto viene
	 * dall'editor del pannello e può avere anche paragrafi fuori dall'elenco.
	 */
	.of-headlines.is-troncata .of-headlines__testo {
		-webkit-mask-image: linear-gradient(#000 calc(100% - 3rem), transparent);
		mask-image: linear-gradient(#000 calc(100% - 3rem), transparent);
	}
}

/* Schermi larghi: più spazio alla gallery, che alza la riga, e testo più grande. */
@media (min-width: 1700px) {
	.of-aircraft__top {
		grid-template-columns: minmax(0, 2fr) minmax(0, 1fr);
	}

	.of-headlines .of-section-title {
		font-size: 1.5rem;
	}

	.of-headlines ul li {
		font-size: 1rem;
		padding-block: 0.5rem;
	}

	.of-headlines ul li::before {
		top: calc(0.5rem + 0.675em - 6.5px);
	}
}

/*
 * min-width: 0 è indispensabile. Lo swiper-wrapper è un flex che affianca
 * tutte le slide: senza questo vincolo il contenitore eredita la larghezza del
 * contenuto e arriva al limite di layout del browser (33.554.432px), portando
 * i comandi posizionati a destra fuori dallo schermo.
 */
.of-gallery__main,
.of-gallery__thumbs,
.of-gallery__aside {
	min-width: 0;
	max-width: 100%;
}

/*
 * Geometria presa dall'originale: immagine principale 16:9 che occupa l'80%
 * della larghezza, colonna miniature il 20%, quattro miniature visibili. Con
 * queste proporzioni le miniature risultano anch'esse 16:9, come là.
 */
.of-gallery__main {
	position: relative;
	overflow: hidden;
	background: rgba(128, 128, 128, 0.08);
	aspect-ratio: 16 / 9;
}

.of-gallery__aside {
	position: relative;
}

.of-gallery__main .swiper-slide {
	overflow: hidden;
	cursor: zoom-in;
}

/*
 * Ingrandimento al passaggio del mouse: l'immagine si scala dentro il riquadro
 * seguendo il cursore, e il clic apre comunque la vista a schermo pieno.
 * La transizione è attiva solo in entrata e in uscita, non durante il
 * movimento, altrimenti l'inseguimento del cursore risulterebbe in ritardo.
 */
.of-gallery__main .swiper-slide img {
	transition: transform 0.25s ease;
	will-change: transform;
}

.of-gallery__main .swiper-slide.is-zooming img {
	transition: none;
}

.of-gallery__main img,
.of-gallery__thumbs img {
	width: 100%;
	height: 100%;
	object-fit: contain;
	background-color: #eaeaea;
	display: block;
}

.of-gallery__thumbs {
	overflow: hidden;
}

.of-gallery__thumbs .swiper-slide {
	overflow: hidden;
	cursor: pointer;
	opacity: 0.55;
	transition: opacity 0.2s ease;
	aspect-ratio: 4 / 3;
}

.of-gallery__thumbs .swiper-slide:hover,
.of-gallery__thumbs .swiper-slide-thumb-active {
	opacity: 1;
}

.of-gallery__thumbs .swiper-slide-thumb-active {
	outline: 2px solid #1a6ca8;
	outline-offset: -2px;
}

@media (min-width: 900px) {
	.of-gallery {
		/* 80/20 come nell'originale (1364 + 335 su 1705). */
		grid-template-columns: minmax(0, 4fr) minmax(120px, 1fr);
		align-items: stretch;
		gap: 6px;
	}

	/*
	 * L'altezza della riga la detta l'immagine principale col suo 16:9. La
	 * colonna miniature va sfilata dal flusso con position:absolute: essendo
	 * uno swiper verticale che impila tutte le slide, altrimenti dilaterebbe
	 * la riga fino al limite di layout del browser.
	 */
	.of-gallery__thumbs {
		position: absolute;
		inset: 0;
	}

	.of-gallery__thumbs .swiper-slide {
		aspect-ratio: auto;
	}
}

/* Finché Swiper non è pronto, o se non arriva, le slide restano incolonnate
   e leggibili invece di sovrapporsi. */
.of-gallery:not(.is-ready) .of-gallery__thumbs,
.of-gallery.is-fallback .of-gallery__thumbs {
	display: none;
}

.of-gallery:not(.is-ready) .of-gallery__main .swiper-slide:not(:first-child) {
	display: none;
}

/* Comandi */

.of-gallery__prev,
.of-gallery__next,
.of-gallery__zoom {
	position: absolute;
	z-index: 2;
	display: grid;
	place-items: center;
	width: 2.5rem;
	height: 2.5rem;
	padding: 0;
	border: 0;
	cursor: pointer;
	color: #fff;
	background: rgba(16, 38, 58, 0.55);
	transition: background 0.2s ease, opacity 0.2s ease;
}

.of-gallery__prev:hover,
.of-gallery__next:hover,
.of-gallery__zoom:hover {
	background: rgba(16, 38, 58, 0.85);
}

.of-gallery__prev,
.of-gallery__next {
	top: 50%;
	transform: translateY(-50%);
}

.of-gallery__prev {
	inset-inline-start: 0.6rem;
}

.of-gallery__next {
	inset-inline-end: 0.6rem;
}

.of-gallery__prev::before,
.of-gallery__next::before {
	content: "";
	width: 0.6rem;
	height: 0.6rem;
	border-top: 2px solid currentColor;
	border-right: 2px solid currentColor;
}

.of-gallery__prev::before {
	transform: rotate(-135deg);
}

.of-gallery__next::before {
	transform: rotate(45deg);
}

/*
 * La lente compare al passaggio del mouse sull'immagine principale, come
 * nell'originale. Su dispositivi senza puntatore resta sempre visibile,
 * altrimenti l'ingrandimento sarebbe irraggiungibile.
 */
.of-gallery__zoom {
	inset-block-start: 0.6rem;
	inset-inline-end: 0.6rem;
	border-radius: 50%;
}

.of-gallery__zoom svg {
	width: 1.15rem;
	height: 1.15rem;
}

@media (hover: hover) {
	.of-gallery__zoom {
		opacity: 0;
		transition: opacity 0.2s ease, background 0.2s ease;
	}

	.of-gallery__main:hover .of-gallery__zoom,
	.of-gallery__zoom:focus-visible {
		opacity: 1;
	}
}

/* Frecce di scorrimento della colonna miniature: come le arrow del plugin,
   restano nascoste e compaiono passando sulla colonna. */

.of-thumbs__prev,
.of-thumbs__next {
	position: absolute;
	inset-inline: 0;
	z-index: 2;
	display: grid;
	place-items: center;
	height: 1.9rem;
	padding: 0;
	border: 0;
	cursor: pointer;
	color: #fff;
	background: rgba(0, 0, 0, 0.55);
	transition: opacity 0.2s ease, background 0.2s ease;
}

.of-thumbs__prev:hover,
.of-thumbs__next:hover {
	background: rgba(0, 0, 0, 0.8);
}

.of-thumbs__prev {
	inset-block-start: 0;
}

.of-thumbs__next {
	inset-block-end: 0;
}

.of-thumbs__prev::before,
.of-thumbs__next::before {
	content: "";
	width: 0.55rem;
	height: 0.55rem;
	border-top: 2px solid currentColor;
	border-right: 2px solid currentColor;
}

.of-thumbs__prev::before {
	transform: rotate(-45deg);
	margin-top: 0.2rem;
}

.of-thumbs__next::before {
	transform: rotate(135deg);
	margin-bottom: 0.2rem;
}

@media (hover: hover) {
	.of-thumbs__prev,
	.of-thumbs__next {
		opacity: 0;
	}

	.of-gallery__aside:hover .of-thumbs__prev,
	.of-gallery__aside:hover .of-thumbs__next,
	.of-thumbs__prev:focus-visible,
	.of-thumbs__next:focus-visible {
		opacity: 1;
	}
}

/*
 * Sotto i 900px la colonna miniature diventa una fila orizzontale (vedi
 * gallery.js, PUNTO_DESKTOP): le frecce vanno ai lati, alte quanto la fila,
 * e puntano a sinistra/destra invece che su/giù.
 */
@media (max-width: 899px) {
	.of-thumbs__prev,
	.of-thumbs__next {
		inset-inline: auto;
		inset-block: 0;
		width: 1.9rem;
		height: auto;
	}

	.of-thumbs__prev {
		inset-inline-start: 0;
	}

	.of-thumbs__next {
		inset-inline-end: 0;
	}

	.of-thumbs__prev::before {
		transform: rotate(-135deg);
		margin: 0 0 0 0.2rem;
	}

	.of-thumbs__next::before {
		transform: rotate(45deg);
		margin: 0 0.2rem 0 0;
	}
}

.swiper-button-disabled {
	opacity: 0.35;
	pointer-events: none;
}

/* ── Ingrandimento a schermo pieno ───────────────────────────────────────── */

.of-lightbox {
	position: fixed;
	inset: 0;
	z-index: 99999;
	display: grid;
	grid-template-columns: auto 1fr auto;
	align-items: center;
	gap: 1rem;
	padding: clamp(1rem, 4vw, 3rem);
	background: rgba(6, 14, 22, 0.985);
}

.of-lightbox[hidden] {
	display: none;
}

body.of-lightbox-aperto {
	overflow: hidden;
}

.of-lightbox__stage {
	margin: 0;
	display: grid;
	place-items: center;
	min-height: 0;
	height: 100%;
}

.of-lightbox__stage img {
	max-width: 100%;
	max-height: 100%;
	object-fit: contain;
}

.of-lightbox__close,
.of-lightbox__nav {
	border: 0;
	background: transparent;
	color: #fff;
	cursor: pointer;
	font-size: 2.5rem;
	line-height: 1;
	padding: 0.25rem 0.6rem;
	opacity: 0.75;
	transition: opacity 0.2s ease;
}

.of-lightbox__close:hover,
.of-lightbox__nav:hover {
	opacity: 1;
}

.of-lightbox__close {
	position: absolute;
	inset-block-start: 0.75rem;
	inset-inline-end: 1rem;
	font-size: 2.75rem;
}

.of-lightbox__counter {
	position: absolute;
	inset-block-end: 1rem;
	inset-inline: 0;
	margin: 0;
	text-align: center;
	color: #fff;
	opacity: 0.7;
	font-size: 0.85rem;
	letter-spacing: 0.08em;
}

/*
 * Sezioni impilate in una sola colonna a tutta larghezza, come nell'originale:
 * là ogni blocco occupa i 1116px della colonna e i contenuti — liste di
 * avionica, allestimenti — si leggono su una riga larga, non spezzati in due
 * colonne strette.
 */
.of-specs {
	display: grid;
	gap: 2.5rem;
	margin-block: 2.5rem;
}

.of-specs__title {
	margin: 0 0 0.6rem;
	font-size: 1.1rem;
	padding-bottom: 0.4rem;
	border-bottom: 1px solid rgba(128, 128, 128, 0.25);
}

/*
 * Qui stavano due regole che annullavano font e corpo scritti nel testo,
 * messe perché i contenuti importati da Word portavano Arial e misure in
 * punti. Sono state tolte: la formattazione decisa nel pannello deve
 * arrivare in pagina esattamente com'è stata scelta. I vecchi contenuti
 * sono stati ripuliti una volta per tutte (db_migrazioni/2026-09-10_testi_pulizia_font.sql).
 */

.of-specs .entry-content ul {
	padding-inline-start: 1.2rem;
}

.of-video iframe,
.of-video embed {
	max-width: 100%;
	aspect-ratio: 16 / 9;
	height: auto;
}

.of-back {
	margin-top: 3rem;
}

/* ── Notizie ──────────────────────────────────────────────────────────────
   Elenco a quattro colonne e dettaglio con carosello, con i valori misurati
   sull'originale: immagine 302 × 250, titolo 21/600, estratto 14px grigio,
   data 12px, "READ MORE" 12/700 blu. */

.of-news-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(min(100%, 260px), 1fr));
	gap: 30px;
	margin: 0;
	padding: 0;
	list-style: none;
}

@media (min-width: 1100px) {
	.of-news-grid {
		grid-template-columns: repeat(4, 1fr);
	}
}

.of-news-card a {
	display: block;
	height: 100%;
	text-decoration: none;
	color: inherit;
	background: #fff;
}

.of-news-card__media {
	margin: 0;
	aspect-ratio: 302 / 250;
	overflow: hidden;
	background: rgba(128, 128, 128, 0.08);
}

.of-news-card__media img {
	width: 100%;
	height: 100%;
	object-fit: contain;
	transition: transform 0.4s ease;
}

.of-news-card a:hover .of-news-card__media img {
	transform: scale(1.04);
}

.of-news-card__body {
	padding: 1.5rem 1.25rem 1.75rem;
}

.of-news-card__title {
	margin: 0 0 0.9rem;
	font-size: 21px;
	font-weight: 600;
	line-height: 1.3;
	color: #206ba6;
}

.of-news-card__estratto {
	margin: 0 0 1rem;
	font-size: 14px;
	line-height: 1.6;
	color: #777;
}

.of-news-card__data {
	margin: 0 0 0.6rem;
	font-size: 12px;
	color: #adadad;
}

.of-news-card__cta {
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: #206ba6;
}

.of-news-card a:hover .of-news-card__cta {
	text-decoration: underline;
}

/* Dettaglio */

.of-news {
	padding-bottom: clamp(2rem, 5vw, 4rem);
}

.of-news__data {
	margin: 0;
	font-size: 0.9rem;
	color: #6b7785;
}

/* Il testo redazionale su una colonna leggibile, come nell'originale. */
.of-news__testo {
	max-width: 70ch;
	margin-inline: auto;
	padding-top: clamp(1.5rem, 4vw, 2.5rem);
}

.of-news__testo img {
	max-width: 100%;
	height: auto;
}

.of-news__link {
	max-width: 70ch;
	margin-inline: auto;
}

.of-news__link a {
	font-weight: 600;
	text-decoration: none;
	color: #206ba6;
}

.of-news .of-download {
	max-width: 70ch;
	margin-inline: auto;
}

.of-news .of-back {
	max-width: 70ch;
	margin-inline: auto;
}

/* Carosello */

.of-news-carousel {
	position: relative;
	max-width: 720px;
	margin: clamp(1.5rem, 4vw, 2.5rem) auto 0;
	overflow: hidden;
	background: rgba(128, 128, 128, 0.08);
}

.of-news-carousel .swiper-slide {
	aspect-ratio: 16 / 9;
}

.of-news-carousel img {
	width: 100%;
	height: 100%;
	object-fit: contain;
	display: block;
}

/* Finché Swiper non è pronto si mostra solo la prima immagine. */
.of-news-carousel:not(.is-ready) .swiper-slide:not(:first-child),
.of-news-carousel.is-fallback .swiper-slide:not(:first-child) {
	display: none;
}

.of-news-carousel__prev,
.of-news-carousel__next {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	z-index: 2;
	display: grid;
	place-items: center;
	width: 2.4rem;
	height: 2.4rem;
	padding: 0;
	border: 0;
	border-radius: 50%;
	cursor: pointer;
	color: #fff;
	background: rgba(16, 38, 58, 0.5);
	transition: background 0.2s ease;
}

.of-news-carousel__prev:hover,
.of-news-carousel__next:hover {
	background: rgba(16, 38, 58, 0.8);
}

.of-news-carousel__prev {
	inset-inline-start: 0.6rem;
}

.of-news-carousel__next {
	inset-inline-end: 0.6rem;
}

.of-news-carousel__prev::before,
.of-news-carousel__next::before {
	content: "";
	width: 0.55rem;
	height: 0.55rem;
	border-top: 2px solid currentColor;
	border-right: 2px solid currentColor;
}

.of-news-carousel__prev::before {
	transform: rotate(-135deg);
}

.of-news-carousel__next::before {
	transform: rotate(45deg);
}

.of-news-carousel__dots {
	position: absolute;
	inset-block-end: 0.6rem;
	inset-inline: 0;
	z-index: 2;
	display: flex;
	justify-content: center;
	gap: 0.4rem;
}

.of-news-carousel__dots .swiper-pagination-bullet {
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: rgba(255, 255, 255, 0.55);
	cursor: pointer;
}

.of-news-carousel__dots .swiper-pagination-bullet-active {
	background: #fff;
}

/* ──────────────────────────────────────────────────────────────────
 * Stili base dei widget "atomici" di Elementor V4.
 *
 * Copia di wp-content/uploads/elementor/css/base-desktop.css e
 * base-mobile.css dell'installazione WordPress di partenza: l'export
 * statico ha inlineato tutti gli altri fogli di Elementor ma non questi
 * due, e senza di essi i blocchi con classe e-*-base perdono il loro
 * display. Il caso visibile era la sezione "Meet the team" della home,
 * dove il contenitore ereditava il display:flex di .e-con e impilava
 * nome, ruolo e biografia in colonne verticali.
 *
 * Vanno tenuti allineati alla sorgente se il tema viene rigenerato.
 * ────────────────────────────────────────────────────────────────── */
.elementor .e-div-block-base{min-width:30px;padding:10px;display:block;}.elementor .e-flexbox-base{padding:10px;display:flex;flex-direction:row;}.elementor .e-grid-base{column-gap:20px;padding:10px;display:grid;row-gap:20px;grid-template-columns:repeat(3, 1fr);grid-template-rows:repeat(2, 1fr);}.elementor .e-tabs-base{padding-block-start:0px;display:flex;flex-direction:column;gap:30px;}.elementor .e-tabs-menu-base{display:flex;justify-content:center;}.elementor .e-tab-base{width:160px;color:#0C0D0E;cursor:pointer;padding:8px;border-width:2px;border-color:#E0E0E0;border-style:solid;background-color:#FFFFFF;display:block;}.elementor .e-tab-base.e--selected{border-color:#0C0D0E;outline-width:0px;}.elementor .e-tab-base:focus{border-color:#0C0D0E;outline-width:0px;}.elementor .e-tab-base:hover,.elementor .e-tab-base:focus-visible{background-color:#E0E0E0;}.elementor .e-tabs-content-area-base{display:block;}.elementor .e-tab-content-base{min-width:30px;padding:10px;display:block;}.elementor .e-form-base{padding:20px;display:flex;flex-direction:row;gap:10px;flex-wrap:wrap;align-content:start;align-items:flex-start;}.elementor .e-form-base .e-form-checkbox-row{padding:0px;gap:8px;align-items:center;}.elementor .e-form-success-message-base{font-size:12px;color:#2F532E;text-align:center;padding:12px;background-color:#D4E9D6;display:none;}.elementor .e-form-error-message-base{font-size:12px;color:#870000;text-align:center;padding:12px;background-color:#ffdede;display:none;}.elementor .e-collection-loop-base{display:block;}.elementor .e-collection-loop-layout-base{display:grid;gap:20px;grid-template-columns:repeat(3, 1fr);grid-auto-rows:1fr;}.elementor .e-pagination-base{padding-block-start:8px;padding-block-end:8px;padding-inline-start:8px;padding-inline-end:8px;margin-block-start:8px;display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-start;align-items:center;}.elementor .e-pagination-prev-base{font-size:14px;color:#1F2937;text-align:center;text-decoration:none;padding-block-start:8px;padding-block-end:8px;padding-inline-start:12px;padding-inline-end:12px;border-radius:4px;border-width:1px;border-color:#E5E7EB;border-style:solid;display:inline-flex;gap:8px;align-items:center;}.elementor .e-pagination-next-base{font-size:14px;color:#1F2937;text-align:center;text-decoration:none;padding-block-start:8px;padding-block-end:8px;padding-inline-start:12px;padding-inline-end:12px;border-radius:4px;border-width:1px;border-color:#E5E7EB;border-style:solid;display:inline-flex;gap:8px;align-items:center;}.elementor .e-heading-base{margin:0px;}.elementor .e-heading-link-base{all:unset;cursor:pointer;}.elementor .e-image-link-base{width:fit-content;all:unset;cursor:pointer;display:inherit;}.elementor .e-image-base{display:block;}.elementor .e-paragraph-base{margin:0px;}.elementor .e-paragraph-link-base{all:unset;cursor:pointer;}.elementor .e-svg-base{width:65px;height:65px;display:inline-block;}.elementor .e-button-base{text-align:center;padding-block-start:12px;padding-block-end:12px;padding-inline-start:24px;padding-inline-end:24px;border-radius:2px;border-width:0px;background-color:#375EFB;display:inline-block;}.elementor .e-youtube-base{overflow:hidden;aspect-ratio:16/9;}.elementor .e-divider-base{height:1px;border-width:0px;border-color:transparent;border-style:none;background-color:#000;}.elementor .e-self-hosted-video-base{max-width:100vw;aspect-ratio:16/9;display:inline-block;}.elementor .e-form-input-base{height:36px;font-size:12px;color:#0c0d0e;border-radius:0px;border-color:#D6D5D5;}.elementor .e-form-input-base:focus{border-color:#706F6F;outline-style:none;}.elementor .e-form-input-base::placeholder{color:#9DA5AE;}.elementor .e-form-label-base{font-size:14px;color:#0c0d0e;}.elementor .e-form-textarea-base{font-size:12px;border-radius:0px;border-color:#D6D5D5;}.elementor .e-form-textarea-base:focus{border-color:#706F6F;outline-style:none;}.elementor .e-form-textarea-base::placeholder{color:#9DA5AE;}.elementor .e-form-submit-button-base{color:#fff;padding-block-start:10px;padding-block-end:10px;padding-inline-start:28px;padding-inline-end:30px;border-radius:0px;border-width:0px;background-color:#000;display:flex;justify-content:center;align-items:center;}.elementor .e-form-submit-button-base:hover,.elementor .e-form-submit-button-base:focus-visible{background-color:#323232;}.elementor .e-form-checkbox-base{width:1.15em;height:1.15em;color:#ffffff;border-radius:0px;border-width:1px;border-color:#D6D5D5;border-style:solid;background-color:transparent;transition:background-color 200ms;display:grid;justify-items:center;align-items:center;appearance:none;}.elementor .e-form-checkbox-base:focus{border-color:#706F6F;outline-style:none;}.elementor .e-form-checkbox-base:checked{background-color:#69727D;}.elementor .e-form-checkbox-base::before{width:65%;height:65%;background-color:currentColor;opacity:0%;transform-origin:0% 100% 0px;transition:opacity 200ms;content:"";clip-path:polygon(14% 44%, 0 65%, 50% 100%, 100% 16%, 80% 0%, 43% 62%);}.elementor .e-form-checkbox-base:checked::before{opacity:100%;}.elementor .e-form-radio-button-base{width:1.15em;height:1.15em;color:#ffffff;border-radius:50%;border-width:1px;border-color:#D6D5D5;border-style:solid;background-color:transparent;display:grid;justify-items:center;align-items:center;appearance:none;}.elementor .e-form-radio-button-base:focus{border-color:#706F6F;outline-style:none;}.elementor .e-form-radio-button-base:checked{background-color:transparent;}.elementor .e-form-radio-button-base::before{width:65%;height:65%;border-radius:50%;background-color:#706F6F;opacity:0%;transition:opacity 200ms;content:"";}.elementor .e-form-radio-button-base:checked::before{opacity:100%;}.elementor .e-form-date-picker-base{width:100%;height:36px;font-size:12px;color:#0c0d0e;border-radius:0px;border-width:1px;border-color:#D6D5D5;border-style:solid;}.elementor .e-form-date-picker-base:focus{border-color:#706F6F;outline-style:none;}.elementor .e-form-time-picker-base{width:100%;height:36px;font-size:12px;color:#0c0d0e;border-radius:0px;border-width:1px;border-color:#D6D5D5;border-style:solid;}.elementor .e-form-time-picker-base:focus{border-color:#706F6F;outline-style:none;}.elementor .e-form-select-base{font-size:12px;border-width:1px;border-color:#D6D5D5;border-style:solid;background-color:transparent;}.elementor .e-form-select-base:focus{border-color:#706F6F;outline-style:none;}.elementor .e-form-file-upload-base{height:36px;font-size:12px;color:#0c0d0e;border-radius:0px;border-color:#D6D5D5;}.elementor .e-form-file-upload-base:focus{border-color:#706F6F;outline-style:none;}
@media(max-width:767px){.elementor .e-grid-base{grid-template-columns:repeat(1, 1fr);}}

/* ──────────────────────────────────────────────────────────────────
 * Schede della pagina Brochures.
 *
 * Su WordPress le due schede erano elementi distinti e Elementor aveva
 * scritto per ognuna una regola legata al proprio id (elementor-element-
 * c95fe25 e -2977c69, in uploads/elementor/css/post-3086.css). Ora le
 * schede vengono dal pannello e sono un numero variabile: le stesse
 * dichiarazioni valgono qui per la classe .of-brochure, così una
 * brochure aggiunta in redazione nasce già con l'aspetto giusto.
 * ────────────────────────────────────────────────────────────────── */
.elementor .elementor-element.of-brochure {
	--display: grid;
	--e-con-grid-template-columns: repeat(2, 1fr);
	--e-con-grid-template-rows: repeat(1, 1fr);
	--grid-auto-flow: row;
	--justify-items: end;
	--align-items: stretch;
}

.elementor .elementor-element.of-brochure:not(.elementor-motion-effects-element-type-background),
.elementor .elementor-element.of-brochure > .elementor-motion-effects-container > .elementor-motion-effects-layer {
	background-color: #EAF3F9;
}

@media (min-width: 767px) {
	.elementor .elementor-element.of-brochure {
		grid-template-columns: max-content 1fr;
	}
}

@media (max-width: 767px) {
	.elementor .elementor-element.of-brochure {
		--e-con-grid-template-columns: repeat(1, 1fr);
		--grid-auto-flow: row;
	}
}

.elementor .elementor-element.of-brochure__pulsante {
	margin: 15px 10px calc(var(--kit-widget-spacing, 0px) + 10px) 0px;
}

.elementor .elementor-element.of-brochure__pulsante .elementor-button {
	background-color: var( --e-global-color-blocksy_palette_1 );
	font-weight: 700;
	letter-spacing: 3.1px;
	border-radius: 0px 0px 0px 0px;
}

.elementor .elementor-element.of-brochure__pulsante .elementor-button-content-wrapper {
	flex-direction: row-reverse;
}

.elementor .elementor-element.of-brochure__pulsante .elementor-button .elementor-button-content-wrapper {
	gap: 11px;
}

/*	Voci di menu che aprono solo il proprio sottomenu (Inventory, News).
	Sono ancore senza href: il browser non naviga, ma il puntatore tornerebbe
	a freccia e la voce sembrerebbe spenta. */
.ct-menu-link:not([href]) {
	cursor: pointer;
}

/* Home, sezione About: le due foto (jet ed elicottero) restano intere con il
   loro rapporto; il widget Elementor imporrebbe altezza fissa e ritaglio.
   Gli id sono quelli dei widget nell'esportazione statica della home. */
.elementor-element-6a3295d img,
.elementor-element-4a05042 img {
	width: 100% !important;
	height: auto !important;
	max-height: none !important;
	aspect-ratio: 1149 / 492;
	object-fit: contain !important;
}

/* Pulsante WhatsApp fisso in basso a destra, su tutte le pagine. */
.wa-link {
	position: fixed;
	right: 30px;
	bottom: 30px;
	z-index: 999;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 52px;
	height: 52px;
	color: #fff !important;
	background-color: #25d366;
	border-radius: 50%;
	box-shadow: 0 4px 14px rgba(10, 22, 40, 0.25);
	transition: transform 0.2s ease, background-color 0.2s ease;
}

.wa-link:hover,
.wa-link:focus-visible {
	transform: scale(1.08);
	background-color: #128c7e;
}

@media (max-width: 767px) {
	.wa-link {
		right: 16px;
		bottom: 16px;
		width: 48px;
		height: 48px;
	}
}

/* ── Esito dei form (SweetAlert2) ─────────────────────────────────────────
   Stile del sito e nessuna animazione: le classi of-swal sono assegnate da
   forms.js; la specificità doppia supera il CSS iniettato dalla libreria. */
.swal2-container.swal2-backdrop-show {
	background: rgba(10, 22, 40, 0.55);
}

.swal2-popup.of-swal {
	width: min(32rem, calc(100vw - 32px));
	padding: 2.25rem 2rem 2rem;
	border-radius: 0;
	font-family: Inter, sans-serif;
	color: #0a1628;
	background: #fff;
	border-top: 4px solid #206ba6;
}

.swal2-container,
.swal2-popup.of-swal,
.swal2-popup.of-swal * {
	animation: none !important;
	transition: none !important;
}

.swal2-popup.of-swal .of-swal__icona {
	margin: 0 auto 1.25rem;
	transform: scale(0.8);
}

.swal2-popup.of-swal .swal2-icon.swal2-success {
	border-color: #206ba6;
	color: #206ba6;
}

.swal2-popup.of-swal .swal2-icon.swal2-success [class^="swal2-success-line"] {
	background-color: #206ba6;
}

.swal2-popup.of-swal .swal2-icon.swal2-success .swal2-success-ring {
	border-color: rgba(32, 107, 166, 0.3);
}

.swal2-popup.of-swal .swal2-icon.swal2-error {
	border-color: #b3261e;
	color: #b3261e;
}

.swal2-popup.of-swal .swal2-icon.swal2-error [class^="swal2-x-mark-line"] {
	background-color: #b3261e;
}

.swal2-popup.of-swal .of-swal__titolo {
	padding: 0;
	font-family: Montserrat, sans-serif;
	font-size: 1.6rem;
	font-weight: 600;
	letter-spacing: -0.5px;
	color: #000;
}

.swal2-popup.of-swal .of-swal__testo {
	margin: 0.85rem 0 0;
	padding: 0;
	font-size: 0.95rem;
	line-height: 1.6;
	color: #333;
}

.swal2-popup.of-swal .of-swal__testo p {
	margin: 0 0 0.35rem;
}

.swal2-popup.of-swal .swal2-actions {
	margin-top: 1.5rem;
}

.swal2-popup.of-swal .of-swal__bottone {
	padding: 13px 34px;
	font-family: Inter, sans-serif;
	font-size: 14px;
	font-weight: 700;
	letter-spacing: 2.3px;
	text-transform: uppercase;
	color: #fff;
	background: #206ba6;
	border: 0;
	border-radius: 0;
	cursor: pointer;
}

.swal2-popup.of-swal .of-swal__bottone:hover,
.swal2-popup.of-swal .of-swal__bottone:focus-visible {
	background: #17537f;
	outline: none;
}

/* ── Home: slider in WebP, slide successive dopo il caricamento ─────────
   post-1257.css (export Elementor) punta ai JPG originali: qui li si
   sostituisce con i WebP (-40/60%). Le slide 2-6 non partono finché la
   pagina non ha finito di caricare (classe of-slider-attesa messa e tolta
   da uno script in testa a index.php), così non contendono la banda alla
   prima slide. Senza JavaScript la classe non c'è e i WebP arrivano subito. */
html .elementor-1257 .elementor-element.elementor-element-b2adc95 .elementor-repeater-item-4b9755d .swiper-slide-bg { background-image: url(/static/wp-content/uploads/2026/05/slide-1.webp); }
html .elementor-1257 .elementor-element.elementor-element-b2adc95 .elementor-repeater-item-9569037 .swiper-slide-bg { background-image: url(/static/wp-content/uploads/2026/05/slide-2.webp); }
html .elementor-1257 .elementor-element.elementor-element-b2adc95 .elementor-repeater-item-330675d .swiper-slide-bg { background-image: url(/static/wp-content/uploads/2026/05/slide-3.webp); }
html .elementor-1257 .elementor-element.elementor-element-b2adc95 .elementor-repeater-item-92b8ce5 .swiper-slide-bg { background-image: url(/static/wp-content/uploads/2026/05/slide-4.webp); }
html .elementor-1257 .elementor-element.elementor-element-b2adc95 .elementor-repeater-item-38b057b .swiper-slide-bg { background-image: url(/static/wp-content/uploads/2026/05/slide-5.webp); }
html .elementor-1257 .elementor-element.elementor-element-b2adc95 .elementor-repeater-item-0a15b18 .swiper-slide-bg { background-image: url(/static/wp-content/uploads/2026/05/slide-6.webp); }
html.of-slider-attesa .elementor-1257 .elementor-element.elementor-element-b2adc95 .swiper-slide:not(.elementor-repeater-item-4b9755d) .swiper-slide-bg { background-image: none; }
