/* Testata «Testata FT» (template della libreria del tema), 12/11/2026.
   Una sola testata per desktop, tablet e telefono, costruita in Elementor: logo, Menu di Elementor Pro (mega menu),
   numero verde, pulsante «Richiedi consulenza». I pannelli del menu li riempie [ftc_menu] (functions.php).
   Qui: la testata resta in alto scorrendo e si stringe (assets/js/testata.js), lo stile dei pannelli,
   e quello che serve perche' niente finisca sotto la testata fissa. Tutto vale solo quando la testata nuova c'e'. */

:root { --ft-testata-h: 88px; }
@media (max-width: 1199px) { :root { --ft-testata-h: 68px; } }

/* --- la testata: una sola a tutte le larghezze, nel flusso della pagina e ferma in alto quando scorri --- */
#pxl-header-elementor:has(.ft-testata) {
	position: sticky !important;
	top: 0;
	z-index: 1000;
	background: #fff;
	box-shadow: 0 1px 0 rgba(32, 40, 45, .08);
	transition: box-shadow .25s ease;
}
#pxl-header-elementor:has(.ft-testata) .pxl-header-elementor-main { display: block !important; position: relative !important; }
#pxl-header-elementor:has(.ft-testata) .pxl-header-elementor-sticky,
#pxl-header-elementor:has(.ft-testata) #pxl-header-mobile { display: none !important; }
body.ft-scorrendo #pxl-header-elementor:has(.ft-testata) { box-shadow: 0 4px 18px rgba(2, 21, 78, .08); }
/* da collegati c'e' la barra di WordPress in alto (32 px, 46 sotto i 783 px; sotto i 601 px scorre via con la pagina):
   la testata si ferma sotto di lei e non ci finisce dietro */
body.admin-bar #pxl-header-elementor:has(.ft-testata) { top: 32px; }
@media (max-width: 782px) { body.admin-bar #pxl-header-elementor:has(.ft-testata) { top: 46px; } }
@media (max-width: 600px) { body.admin-bar #pxl-header-elementor:has(.ft-testata) { top: 0; } }

.ft-testata.e-con { min-height: var(--ft-testata-h) !important; transition: min-height .25s ease; }
body.ft-scorrendo .ft-testata.e-con { --ft-testata-h: 70px; }
@media (max-width: 1199px) { body.ft-scorrendo .ft-testata.e-con { --ft-testata-h: 60px; } }
.ft-testata__logo img { width: 196px; height: auto; transition: width .25s ease; }
body.ft-scorrendo .ft-testata__logo img { width: 172px; }
@media (max-width: 767px) { .ft-testata__logo img, body.ft-scorrendo .ft-testata__logo img { width: 136px; } }
/* il logo e' un SVG: senza questo il menu, che si allarga, lo schiaccerebbe fino a farlo sparire */
.ft-testata .ft-testata__logo.elementor-widget { flex: 0 0 auto !important; }
.ft-testata__logo img, .ft-testata__logo a img[src$=".svg"] { max-width: none !important; display: block; }
/* Elementor da solo mette 48 px alle immagini SVG con link: qui vale la misura del logo */
.ft-testata .ft-testata__logo a img[src$=".svg"] { width: 196px; }
body.ft-scorrendo .ft-testata .ft-testata__logo a img[src$=".svg"] { width: 172px; }
@media (max-width: 767px) { .ft-testata .ft-testata__logo a img[src$=".svg"], body.ft-scorrendo .ft-testata .ft-testata__logo a img[src$=".svg"] { width: 136px; } }

/* niente finisce sotto la testata fissa: i link interni (#modulo) e la colonna laterale che resta ferma */
html:has(.ft-testata) { scroll-padding-top: calc(var(--ft-testata-h) + 16px); }
html:has(body.admin-bar .ft-testata) { scroll-padding-top: calc(var(--ft-testata-h) + 48px); }
body:has(.ft-testata) .pxl-column-sticky { top: calc(var(--ft-testata-h) + 24px) !important; }
body.admin-bar:has(.ft-testata) .pxl-column-sticky { top: calc(var(--ft-testata-h) + 56px) !important; }

/* --- la riga: logo, menu al centro, numero verde e pulsante a destra, tutto dentro i margini del sito --- */
.ft-testata.e-con > .e-con-inner { flex-wrap: nowrap; }
.ft-menu { min-width: 0; }
.ft-menu .e-n-menu-heading { justify-content: center; }
.ft-testata__telefono .elementor-icon-list-text { white-space: nowrap; font-weight: 600; }

/* --- voci del menu --- */
/* alte quanto la testata (anche quando si stringe): Elementor apre il pannello sotto le voci, cosi' parte dal bordo della testata */
@media (min-width: 1200px) {
	.ft-testata .ft-menu .e-n-menu-heading > .e-n-menu-item > .e-n-menu-title { min-height: var(--ft-testata-h); transition: min-height .25s ease; }
}
.ft-menu .e-n-menu-title { font-family: "Roboto", sans-serif; }
.ft-menu .e-n-menu-title-text { font-size: 16px; font-weight: 500; color: #20282d; letter-spacing: 0; }
.ft-menu .e-n-menu-title:hover .e-n-menu-title-text,
.ft-menu .e-n-menu-item:has(.e-n-menu-content.e-active) .e-n-menu-title-text,
.ft-menu .e-current .e-n-menu-title-text { color: #153155; }

/* --- pannelli del mega menu: larghi quanto la finestra, contenuto sui margini del sito --- */
.ft-mega { background: #fff; border-top: 1px solid rgba(32, 40, 45, .08); box-shadow: 0 18px 30px -18px rgba(2, 21, 78, .18); }
.ft-mega__dentro {
	max-width: 1490px; margin: 0 auto; padding: 32px 15px 36px;
	display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 32px 40px;
}
.ft-mega--sicurezza .ft-mega__dentro { grid-template-columns: 1fr 2fr 1fr; }
.ft-mega--altri .ft-mega__dentro { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.ft-mega--iso .ft-mega__dentro { grid-template-columns: 1fr; }
.ft-mega__titolo { margin: 0 0 12px !important; font-family: "Roboto", sans-serif; font-size: 13px !important; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: #5b6773; }
.ft-mega__titolo a { color: inherit; text-decoration: none; }
.ft-mega__titolo a:hover { color: #153155; }
.ft-mega__sottotitolo { margin: 0 0 6px !important; font-family: "Roboto", sans-serif; font-size: 14px !important; font-weight: 700; color: #263037; }
.ft-mega__gruppi { display: grid; grid-template-columns: 1fr 1fr; gap: 20px 32px; }
.ft-mega ul { list-style: none; margin: 0; padding: 0; }
.ft-mega li { margin: 0; padding: 0; }
.ft-mega li::before { display: none; }
.ft-mega li a { display: block; padding: 5px 0; font-family: "Roboto", sans-serif; font-size: 15px; line-height: 1.4; color: #20282d; text-decoration: none; transition: color .2s ease, transform .2s ease; }
.ft-mega li a:hover, .ft-mega li a:focus-visible { color: #153155; transform: translateX(4px); }
.ft-mega li a[aria-current="page"] { color: #153155; font-weight: 600; }
.ft-mega__desc { display: block; font-size: 13px; color: #5b6773; }
.ft-mega__col--griglia ul { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px 40px; }
.ft-mega__col--griglia li a { padding: 10px 0; border-bottom: 1px solid rgba(32, 40, 45, .1); }
.ft-mega__col--griglia .ft-mega__voce { font-weight: 600; }
.ft-mega__tutto { display: inline-block; margin-top: 14px; font-family: "Roboto", sans-serif; font-size: 14px; font-weight: 600; color: #153155; text-decoration: none; }
.ft-mega__tutto::after { content: " \2192"; }
.ft-mega__tutto:hover { text-decoration: underline; text-underline-offset: 3px; }

/* --- tablet e telefono: il menu diventa un pulsante; le voci a fisarmonica, i pannelli in una colonna --- */
@media (max-width: 1199px) {
	/* logo a sinistra; a destra l'icona per chiamare e il pulsante del menu. Il menu di Elementor qui non serve:
	   c'e' il menu a tutto schermo [ftc_menu_mobile] */
	.ft-testata__logo { margin-right: auto; }
	.ft-testata .ft-menu { display: none !important; }
	.ft-testata__telefono { order: 2; }
	/* il numero resta leggibile dagli screen reader (nome del link), a vista resta solo l'icona */
	.ft-testata__telefono .elementor-icon-list-text { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; }
	.ft-testata__telefono a { display: inline-flex; align-items: center; justify-content: center; min-width: 48px; min-height: 48px; }
	.ft-testata__telefono .elementor-icon-list-icon i { font-size: 20px; }
	.ft-testata .ft-testata__burger { order: 3; flex: 0 0 auto !important; }
}
@media (min-width: 1200px) { .ft-testata .ft-testata__burger { display: none !important; } }

/* --- la testata della pagina (foto): la testata nuova non le sta sopra, quindi niente spazio riservato ---
   (la vecchia, trasparente, copriva i primi 145 px della foto su desktop) */
body:has(.ft-testata) #pxl-page-title-elementor .elementor-element-79f133e > .elementor-element-populated { padding-top: 0 !important; }
@media (min-width: 1200px) {
	body:has(.ft-testata) #pxl-page-title-elementor .elementor-element-14e2ef1 > .elementor-container { min-height: 420px !important; }
}

/* il link del logo senza riga di testo intorno: il logo sta esattamente al centro della testata, come le voci */
.ft-testata__logo a { display: block; line-height: 0; }
.ft-testata__logo .elementor-widget-container { display: flex; align-items: center; }

/* desktop: le voci si distribuiscono nello spazio tra logo e numero verde (il pulsante non c'e piu') */
@media (min-width: 1200px) {
	.ft-testata .ft-menu .e-n-menu, .ft-testata .ft-menu .e-n-menu-wrapper { width: 100%; }
	.ft-testata .ft-menu .e-n-menu-heading { justify-content: space-evenly !important; width: 100%; }
}


/* ===== Menu di telefono e tablet a tutto schermo ([ftc_menu_mobile], testata.js) ===== */
/* pulsante: tre barre nel blu del sito, lunga, media, corta; aperto diventano una X */
.ft-mm-toggle {
	display: inline-flex; align-items: center; justify-content: center;
	width: 48px; height: 48px; margin-right: -10px; padding: 0;
	background: transparent; border: 0; border-radius: 12px; color: #153155; cursor: pointer;
	-webkit-tap-highlight-color: transparent;
}
.ft-mm-toggle:focus-visible { outline: 3px solid #153155; outline-offset: 2px; }
.ft-mm-toggle__barre { position: relative; display: block; width: 30px; height: 22px; }
.ft-mm-toggle__barre span {
	position: absolute; right: 0; height: 3px; border-radius: 3px; background: currentColor;
	transition: transform .3s cubic-bezier(.65, 0, .35, 1), width .3s cubic-bezier(.65, 0, .35, 1), opacity .2s ease, top .3s cubic-bezier(.65, 0, .35, 1);
}
.ft-mm-toggle__barre span:nth-child(1) { top: 0; width: 30px; }
.ft-mm-toggle__barre span:nth-child(2) { top: 9.5px; width: 22px; }
.ft-mm-toggle__barre span:nth-child(3) { top: 19px; width: 14px; }
.ft-mm-toggle[aria-expanded="true"] .ft-mm-toggle__barre span:nth-child(1) { top: 9.5px; width: 30px; transform: rotate(45deg); }
.ft-mm-toggle[aria-expanded="true"] .ft-mm-toggle__barre span:nth-child(2) { opacity: 0; width: 0; }
.ft-mm-toggle[aria-expanded="true"] .ft-mm-toggle__barre span:nth-child(3) { top: 9.5px; width: 30px; transform: rotate(-45deg); }

/* pannello: dalla fine della testata al fondo dello schermo, scorre solo lui */
.ft-mm {
	position: fixed; left: 0; right: 0; bottom: 0; top: var(--ft-mm-top, var(--ft-testata-h));
	z-index: 999; overflow-y: auto; overscroll-behavior: contain; -webkit-overflow-scrolling: touch;
	background: #fff; padding: 8px 0 calc(32px + env(safe-area-inset-bottom));
	opacity: 0; transform: translateY(-12px);
	transition: opacity .28s ease, transform .28s cubic-bezier(.2, .7, .3, 1);
}
.ft-mm--visibile { opacity: 1; transform: none; }
.ft-mm[hidden] { display: none; }
/* la pagina sotto resta ferma (testata.js salva e rimette il punto in cui eri) */
html.ft-mm-aperto, html.ft-mm-aperto body { overflow: hidden; }
html.ft-mm-aperto body { position: fixed; left: 0; right: 0; width: 100%; }
html.ft-mm-aperto #pxl-header-elementor:has(.ft-testata) { position: fixed !important; left: 0; right: 0; top: 0; box-shadow: 0 1px 0 rgba(32, 40, 45, .1); }
html.ft-mm-aperto body.admin-bar #pxl-header-elementor:has(.ft-testata) { top: 46px; }
@media (max-width: 600px) { html.ft-mm-aperto body.admin-bar #pxl-header-elementor:has(.ft-testata) { top: 0; } }

.ft-mm__nav, .ft-mm__contatti { max-width: 760px; margin: 0 auto; padding: 0 20px; }
.ft-mm ul { list-style: none; margin: 0; padding: 0; }
.ft-mm li { margin: 0; padding: 0; }
.ft-mm li::before { display: none; }
.ft-mm__aree > li { border-bottom: 1px solid rgba(32, 40, 45, .12); }

/* i pulsanti del tema hanno maiuscolo, spaziatura, sfondo e altezza propri: qui non valgono */
.ft-mm button, .ft-mm-toggle {
	text-transform: none !important; letter-spacing: 0 !important; box-shadow: none !important; height: auto;
	-webkit-appearance: none; appearance: none;
}
.ft-mm-toggle { height: 48px !important; background: transparent !important; }
.ft-mm .ft-mm__area-btn, .ft-mm .ft-mm__link.ft-mm__area-link { font-family: "Roboto", sans-serif !important; font-size: 22px !important; font-weight: 700 !important; min-height: 60px; }
.ft-mm .ft-mm__area-btn { background: none !important; border: 0 !important; border-radius: 0 !important; color: #20282d !important; font-size: 22px !important; font-weight: 700 !important; line-height: 1.25 !important; padding: 12px 0 !important; }
.ft-mm .ft-mm__area-btn:hover { color: #153155 !important; }
.ft-mm .ft-mm__area--qui > .ft-mm__area-btn { color: #153155 !important; }

/* voci principali: grandi, alte almeno 56 px */
.ft-mm__area-btn, .ft-mm__area-link {
	display: flex; align-items: center; justify-content: space-between; width: 100%; min-height: 60px;
	padding: 12px 0; background: none; border: 0; text-align: left; cursor: pointer;
	font-family: "Roboto", sans-serif; font-size: 22px; font-weight: 700; line-height: 1.25; color: #20282d; text-decoration: none;
}
.ft-mm__area-link[aria-current="page"], .ft-mm__area--qui > .ft-mm__area-btn { color: #153155; }
.ft-mm__freccia { position: relative; width: 36px; height: 36px; flex: 0 0 36px; border-radius: 50%; background: #eef2f6; transition: background-color .2s ease, transform .3s cubic-bezier(.65, 0, .35, 1); }
.ft-mm__freccia::before {
	content: ""; position: absolute; left: 50%; top: 50%; width: 9px; height: 9px; margin: -7px 0 0 -4.5px;
	border-right: 2.5px solid #153155; border-bottom: 2.5px solid #153155; transform: rotate(45deg);
}
.ft-mm__area-btn[aria-expanded="true"] .ft-mm__freccia { transform: rotate(180deg); background: #153155; }
.ft-mm__area-btn[aria-expanded="true"] .ft-mm__freccia::before { border-color: #fff; }

/* fisarmonica: si apre in altezza senza scatti */
.ft-mm__pannello { display: grid; grid-template-rows: 0fr; transition: grid-template-rows .32s cubic-bezier(.2, .7, .3, 1); }
.ft-mm__pannello--aperto { grid-template-rows: 1fr; }
.ft-mm__pannello-dentro { overflow: hidden; }
.ft-mm__pannello--aperto .ft-mm__pannello-dentro { padding-bottom: 20px; }
.ft-mm__gruppo { margin-top: 18px; }
.ft-mm__gruppo-titolo { margin: 0 0 4px !important; font-family: "Roboto", sans-serif; font-size: 13px !important; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: #4f5b66; }
.ft-mm__sottotitolo { margin: 14px 0 2px !important; font-family: "Roboto", sans-serif; font-size: 15px !important; font-weight: 700; color: #263037; }
.ft-mm__link {
	display: flex; align-items: center; min-height: 48px; padding: 6px 0;
	font-family: "Roboto", sans-serif; font-size: 17px; line-height: 1.35; color: #20282d; text-decoration: none;
}
.ft-mm__link[aria-current="page"] { color: #153155; font-weight: 700; }
.ft-mm__link[aria-current="page"]::after { content: ""; width: 8px; height: 8px; margin-left: 10px; border-radius: 50%; background: #2eb4be; }
.ft-mm__tutto { font-weight: 600; color: #153155; }
.ft-mm__tutto::after { content: " \2192"; margin-left: 6px; }
.ft-mm a:focus-visible, .ft-mm button:focus-visible { outline: 3px solid #153155; outline-offset: 2px; border-radius: 6px; }

/* in fondo: chiamata ed email */
.ft-mm__contatti { margin-top: 28px; }
.ft-mm__contatti-titolo { margin: 0 0 10px !important; font-family: "Roboto", sans-serif; font-size: 13px !important; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: #4f5b66; }

@media (prefers-reduced-motion: reduce) {
	.ft-mm, .ft-mm__pannello, .ft-mm__freccia, .ft-mm-toggle__barre span { transition: none !important; }
	.ft-mm { transform: none; }
}

/* ===== Numero verde (ftc_numero_verde_html): cornetta verde, «Numero Verde», riquadro con il numero ===== */
.ft-nv {
	--nv: #1f8a34; /* verde del numero verde, scurito quanto basta per il contrasto su bianco */
	display: inline-flex; align-items: stretch; gap: 0; color: var(--nv) !important; text-decoration: none !important;
	font-family: "Roboto", sans-serif; line-height: 1;
}
.ft-nv__cornetta { width: 18px; height: auto; flex: 0 0 auto; fill: var(--nv); margin-right: -3px; position: relative; z-index: 1; }
.ft-nv__riquadro {
	position: relative; display: flex; align-items: center; justify-content: center;
	margin-top: 9px; padding: 7px 14px 6px 12px;
	border: 2.5px solid var(--nv); border-left: 0; border-radius: 0 9px 9px 0;
}
.ft-nv__titolo {
	position: absolute; left: 6px; top: -10px; padding: 0 5px 0 2px; background: #fff;
	font-size: 15px; font-weight: 900; letter-spacing: -.01em; white-space: nowrap;
}
.ft-nv__numero { font-size: 19px; font-weight: 800; letter-spacing: .02em; white-space: nowrap; padding-top: 4px; }
.ft-nv:hover .ft-nv__riquadro { background: #f1f9f2; }
.ft-nv:hover .ft-nv__titolo { background: #f1f9f2; }
.ft-nv:focus-visible { outline: 3px solid #153155; outline-offset: 4px; border-radius: 6px; }
/* nella testata: il riquadro da 1200 px in su, solo la cornetta sotto */
.ft-nv-testata { display: flex; align-items: center; }
.ft-nv-icona { display: none; }
.ft-nv-icona svg { width: 13px; height: auto; fill: #1f8a34; }
@media (max-width: 1199px) {
	.ft-nv-testata .ft-nv { display: none; }
	.ft-nv-icona { display: inline-flex; align-items: center; justify-content: center; min-width: 48px; min-height: 48px; }
	.ft-nv-icona:focus-visible { outline: 3px solid #153155; outline-offset: 2px; border-radius: 8px; }
}
.ft-testata .ft-testata__nv { flex: 0 0 auto !important; }
body.ft-scorrendo .ft-testata .ft-nv__numero { font-size: 17px; }
/* nel menu da telefono: grande, a tutta larghezza */
.ft-nv--grande { display: flex; width: 100%; }
.ft-nv--grande .ft-nv__cornetta { width: 30px; margin-right: -5px; }
.ft-nv--grande .ft-nv__riquadro { flex: 1; margin-top: 13px; padding: 14px 16px 12px; border-width: 3px; border-radius: 0 14px 14px 0; }
.ft-nv--grande .ft-nv__titolo { font-size: 21px; top: -14px; left: 8px; }
.ft-nv--grande .ft-nv__numero { font-size: 28px; }
/* email sotto il numero verde: icona e indirizzo, senza pulsante */
.ft-mm__mail { display: flex; align-items: center; gap: 14px; min-height: 56px; margin-top: 18px; color: #20282d !important; text-decoration: none !important; font-family: "Roboto", sans-serif; }
.ft-mm__mail-icona { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; flex: 0 0 44px; border-radius: 50%; background: #eef2f6; color: #153155; }
.ft-mm__mail-testo { display: flex; flex-direction: column; gap: 2px; }
.ft-mm__mail-et { font-size: 13px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: #4f5b66; }
.ft-mm__mail-indirizzo { font-size: 18px; color: #153155; text-decoration: underline; text-underline-offset: 3px; }
@media (max-width: 1199px) { .ft-testata .ft-testata__nv { order: 2; } }

/* Telefono e tablet, testata chiusa (12/11/2026, Manuel): piu' alta di poco, solo il pittogramma, niente cornetta.
   Il logo resta lo stesso file SVG (testo alternativo «FT Consulting»), inquadrato sul solo pittogramma a sinistra. */
@media (max-width: 1199px) {
	:root { --ft-testata-h: 76px; }
	body.ft-scorrendo .ft-testata.e-con { --ft-testata-h: 66px; }
	.ft-testata .ft-testata__nv { display: none !important; }
	.ft-testata .ft-testata__logo a img[src$=".svg"],
	body.ft-scorrendo .ft-testata .ft-testata__logo a img[src$=".svg"] {
		width: 40px !important; height: 40px !important; object-fit: cover; object-position: left center;
	}
	body.ft-scorrendo .ft-testata .ft-testata__logo a img[src$=".svg"] { width: 36px !important; height: 36px !important; }
}