/*
 * Header ADEA — tutti i valori vengono da styles.css e dagli stili inline
 * dell'originale (index.html r.16–127). I data-hover dell'originale sono
 * tradotti in :hover / :focus-visible (§5 del prompt di porting).
 *
 * ⚠️ I valori NON vengono dalle prime righe di styles.css (r.11–18): quel
 * blocco è superato da un blocco di correzione in fondo al foglio (r.837–855,
 * "1. HEADER: logo a colori, grande, payoff leggibile") che, a pari
 * specificità e più in basso, vince. Le righe 286 (logo 48px ≤1040) e 394
 * (logo 46px ≤620) dell'originale sono CODICE MORTO per lo stesso motivo.
 * La cascata qui sotto è stata MISURATA con getComputedStyle sull'originale a
 * 1440/1200/1024/900/700/600/560/375, non dedotta:
 *
 *   larghezza   pad barra   logo    payoff              pad orizz. inner
 *   >1040       13px        74px    11.6px / .052em     40px
 *   961–1040    11px        74px    11.6px / .052em     40px
 *   861–960     11px        74px    11.6px / .052em     20px   (.sect ≤960)
 *   621–860     11px        58px    10px   / .03em      20px
 *   561–620     10px        58px    10px   / .03em      20px
 *   ≤560        10px        50px    8.8px  / .02em      20px
 *
 * Variabili controllate dall'editor (ripiego = valore originale). I tre
 * gradini hanno una variabile PROPRIA invece di una sola responsive: il CSS
 * che Elementor stampa per il desktop sta su un selettore con l'id del
 * documento (specificità più alta) e batterebbe qualunque media query di
 * questo foglio (§13). Con una variabile per gradino è la media query a
 * scegliere QUALE variabile leggere, e i tre controlli restano indipendenti.
 *   --adea-header-bg          sfondo barra (orig: trasparente)
 *   --adea-header-pad-v       padding barra           13px / 11px / 10px
 *   --adea-header-logo-h      altezza logo            74px / 58px / 50px
 *   --adea-header-payoff-*    payoff: corpo e spaziatura per gradino
 *   --adea-header-active      colore voce attiva (orig: #42AD59)
 *   --adea-header-cta-bg      sfondo CTA (orig: #004F9E)
 *   --adea-header-cta-hover   sfondo CTA hover (orig: #003a75, dal data-hover)
 *
 * Indice: barra · brand · nav a pillola · dropdown · lingua · CTA · burger ·
 *         menu mobile · breakpoint originali · editor/reduced-motion
 */

/* ---------- barra ---------- */
.adea-header{
	position:absolute;top:0;left:0;right:0;z-index:var(--adea-z-header,220);
	padding:var(--adea-header-pad-v,13px) 0;
	background:var(--adea-header-bg,transparent);
	animation:adeaHeaderDrop .7s cubic-bezier(.22,1,.36,1) both;
	/* nell'originale l'header non dichiara font: eredita da body,
	   font-family:'Source Sans 3' e line-height NON dichiarata (= normal).
	   Vanno detti entrambi, perché il Kit di Elementor impone Source Sans 3
	   con line-height 1.5: con 1.5 le voci del dropdown crescono di .75px
	   l'una e il pannello dei prodotti risultava 428px invece di 421px
	   (misurato, non ipotesi). Le regole che dichiarano un line-height
	   proprio (navlink, payoff) restano più specifiche e vincono. */
	font-family:var(--adea-font-testo,'Source Sans 3',system-ui,sans-serif);
	line-height:normal;
}
@keyframes adeaHeaderDrop{from{opacity:0;transform:translateY(-16px)}to{opacity:1;transform:translateY(0)}}
.adea-header-inner{
	position:relative;max-width:1480px;margin:0 auto;padding:0 40px;
	display:flex;align-items:center;justify-content:space-between;gap:24px;min-height:56px;
}
.adea-header a{text-decoration:none}
.adea-header img{display:block}

/* ---------- brand ----------
   Il logo è a COLORI: il blocco di correzione dell'originale annulla con
   `filter:none!important` il brightness/invert delle prime righe (che rendeva
   bianco il marchio). Il filtro bianco resta disponibile come opzione. */
.adea-header .adea-brand{cursor:pointer;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:7px;flex:none}
.adea-header .adea-brand-logo{height:var(--adea-header-logo-h,74px);width:auto;filter:none;transition:filter .3s ease}
.adea-header .adea-brand--white .adea-brand-logo{filter:brightness(0) invert(1)}
.adea-header .adea-brand-payoff{
	font-family:var(--adea-font-titoli,'Poppins',sans-serif);font-weight:600;
	font-size:var(--adea-header-payoff-size,11.6px);
	letter-spacing:var(--adea-header-payoff-ls,.052em);
	text-transform:uppercase;line-height:1;padding-left:3px;
	color:var(--adea-header-payoff-color,var(--adea-verde,#42AD59));
	white-space:nowrap;transition:color .3s ease;
}

/* ---------- nav a pillola ---------- */
.adea-header .adea-nav-shell{
	position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
	display:flex;align-items:center;gap:4px;padding:6px 8px;border-radius:999px;
	background:rgba(8,25,45,.34);border:1px solid rgba(255,255,255,.22);
	backdrop-filter:blur(16px) saturate(1.3);
	box-shadow:0 18px 42px -22px rgba(0,0,0,.55),inset 0 1px 0 rgba(255,255,255,.22);
}
/* ⚠️ nessun font-family/weight qui: nell'originale la voce di menu eredita da
   body (Source Sans 3, weight normale). Dichiarare Poppins 500 allargava la
   pillola di 65px (misurato: 685px invece di 620px). */
.adea-header .navlink{
	display:flex;align-items:center;gap:6px;cursor:pointer;color:#fff;
	padding:9px 17px;border-radius:999px;font-size:14.5px;line-height:1;position:relative;
	transition:color .22s ease,background-color .24s ease,transform .3s cubic-bezier(.34,1.5,.64,1);
}
/* l'hover dell'originale è in due pezzi: il fondo dalla regola .adea-nav-shell
   (r.79) e il colore verde dal data-hover inline (§5 → :hover/:focus-visible) */
.adea-header .navlink:not(.navlink-active):hover,
.adea-header .navlink:not(.navlink-active):focus-visible{
	background:rgba(255,255,255,.2);transform:translateY(-1px);
	color:var(--adea-header-active,var(--adea-verde,#42AD59));
}
.adea-header .navlink.navlink-active{
	background:#fff!important;color:var(--adea-header-active,#42AD59)!important;
	box-shadow:0 8px 18px -8px rgba(0,0,0,.38);
}
.adea-header .has-dd{position:relative}
.adea-header .has-dd .navlink svg{transition:transform .3s cubic-bezier(.34,1.3,.64,1)}
.adea-header .has-dd:hover .navlink svg,
.adea-header .has-dd:focus-within .navlink svg{transform:rotate(180deg)}

/* ---------- dropdown (stili inline dell'originale, promossi a classi) ---------- */
.adea-header .dd{display:none}
.adea-header .has-dd:hover .dd,
.adea-header .has-dd:focus-within .dd{display:block}
.adea-header .adea-header-dd{position:absolute;top:100%;left:-12px;padding-top:16px;z-index:var(--adea-z-dropdown,260)}
.adea-header .adea-header-dd-panel{
	background:rgba(255,255,255,0.95);border:1px solid rgba(255,255,255,0.55);border-radius:18px;
	box-shadow:0 24px 44px -18px rgba(10,37,64,0.32);backdrop-filter:blur(14px);padding:8px;
}
.adea-header .adea-header-dd-panel--prodotti{min-width:460px;display:grid;grid-template-columns:1fr 1fr;gap:2px}
.adea-header .adea-header-dd-panel--linee{min-width:214px;display:flex;flex-direction:column;gap:2px}
.adea-header .adea-header-dd-item{
	cursor:pointer;color:#26313a;padding:11px 14px;border-radius:10px;font-size:14.5px;
	transition:background .18s ease,color .18s ease;
}
.adea-header .adea-header-dd-item:hover,
.adea-header .adea-header-dd-item:focus-visible{background:#f2f7fc;color:var(--adea-blu,#004F9E)}
.adea-header .has-dd:hover .dd .adea-header-dd-panel,
.adea-header .has-dd:focus-within .dd .adea-header-dd-panel{animation:adeaDDIn .28s cubic-bezier(.34,1.3,.64,1) both}
@keyframes adeaDDIn{from{opacity:0;transform:translateY(10px) scale(.97)}to{opacity:1;transform:translateY(0) scale(1)}}

/* ---------- selettore lingua ---------- */
.adea-header .adea-lang{position:relative;margin-left:auto;flex:none}
.adea-header .adea-lang-btn{
	display:inline-flex;align-items:center;gap:6px;background:transparent;border:none;cursor:pointer;
	padding:9px 12px;border-radius:999px;font-family:var(--adea-font-titoli);font-weight:600;
	font-size:14px;letter-spacing:.02em;color:#fff;transition:background .2s ease,color .2s ease;
}
.adea-header .adea-lang-btn:hover,.adea-header .adea-lang-btn:focus-visible{background:rgba(255,255,255,.14)}
.adea-header .adea-lang-caret{display:inline-flex;transition:transform .28s cubic-bezier(.34,1.3,.64,1)}
.adea-header .adea-lang.open .adea-lang-caret{transform:rotate(180deg)}
.adea-header .adea-lang-menu{
	position:absolute;top:calc(100% + 12px);right:0;min-width:158px;background:#fff;
	border:1px solid rgba(10,37,64,.08);border-radius:16px;box-shadow:0 24px 48px -20px rgba(10,37,64,.35);
	padding:7px;display:flex;flex-direction:column;gap:2px;
	opacity:0;visibility:hidden;transform:translateY(8px) scale(.98);transform-origin:top right;
	transition:opacity .2s ease,transform .24s cubic-bezier(.34,1.3,.64,1),visibility .24s;z-index:280;
}
.adea-header .adea-lang.open .adea-lang-menu{opacity:1;visibility:visible;transform:translateY(0) scale(1)}
.adea-header .adea-lang-opt{
	display:flex;align-items:center;gap:12px;padding:11px 14px;border-radius:10px;
	font-family:var(--adea-font-titoli);font-weight:500;font-size:15px;color:#26313a;cursor:pointer;
	transition:background .18s ease,color .18s ease;
}
.adea-header .adea-lang-opt:hover{background:#f2f7fc;color:var(--adea-blu,#004F9E)}
.adea-header .adea-lang-opt.is-active{background:#eef5fc;color:var(--adea-blu,#004F9E)}
.adea-header .adea-lang-opt-label{font-weight:600}
.adea-header .adea-lang-flag{font-size:18px;line-height:1}

/* ---------- CTA (hover dal data-hover dell'originale) ---------- */
.adea-header .adea-hdcta{
	display:inline-flex;align-items:center;gap:10px;padding:7px 9px 7px 20px;
	border:1.2px solid var(--adea-header-cta-bg,var(--adea-blu,#004F9E));border-radius:999px;
	background:var(--adea-header-cta-bg,var(--adea-blu,#004F9E));backdrop-filter:blur(10px);
	box-shadow:0 18px 32px -18px rgba(0,79,158,.55);
	cursor:pointer;color:#fff;font-family:var(--adea-font-titoli);font-weight:500;font-size:14px;
	transition:transform .18s cubic-bezier(.34,1.4,.64,1),box-shadow .22s ease,background .2s ease,border-color .2s ease;
}

/* ⚠️ 2026-09-09 — IL COLORE VA RIDICHIARATO IN HOVER, non basta averlo a riposo.
   Il Kit di Elementor stampa `.elementor-kit-N a:hover{color:#42AD59}`, che vale
   (0,2,1). La regola di riposo del bottone, `.adea-header .adea-hdcta`, vale
   (0,2,0): a riposo vince lei, ma appena il puntatore arriva vince il Kit e il
   testo diventa VERDE — nell'originale resta bianco (il suo `data-hover` cambia
   solo fondo, bordo, ombra e traslazione). La regola di hover qui sotto vale
   (0,3,0) e batte il Kit, ma solo per le proprietà che DICHIARA: finché non
   nominava `color`, quella la decideva il Kit.
   Stessa cosa per le voci del menu del telefono, poco più sotto.
   Misurato con hover vero su entrambi i lati, non dedotto. */
.adea-header .adea-hdcta:hover,.adea-header .adea-hdcta:focus-visible{
	transform:translateY(-2px);box-shadow:0 18px 32px -16px rgba(0,79,158,.55);
	background:var(--adea-header-cta-hover,#003a75);border-color:var(--adea-header-cta-hover,#003a75);
	color:#fff;   /* ⚠️ senza questa riga il Kit lo fa diventare verde: vedi sopra */
}
.adea-header .adea-hdcta:active{transform:translateY(0) scale(.96)}
.adea-header .adea-hdcta-icon{
	display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;
	border-radius:50%;background:#fff;color:var(--adea-header-cta-bg,var(--adea-blu,#004F9E));
	transition:transform .32s var(--adea-ease-spring);
}
.adea-header .adea-hdcta:hover .adea-hdcta-icon{transform:translateX(4px)}

/* ---------- burger (stili inline dell'originale) ---------- */
.adea-header .adea-burger{
	display:none;align-items:center;justify-content:center;width:48px;height:48px;
	background:rgba(8,25,45,0.34);border:1px solid rgba(255,255,255,0.4);border-radius:999px;
	cursor:pointer;flex-direction:column;gap:5px;backdrop-filter:blur(10px);
}
.adea-header .adea-burger span{width:18px;height:2px;background:#fff;display:block}

/* ---------- menu mobile (stili inline dell'originale) ---------- */
.adea-header .adea-header-m[hidden]{display:none}
.adea-header .adea-header-m-inner{
	border-top:1px solid rgba(255,255,255,.16);background:rgba(8,28,30,.92);backdrop-filter:blur(18px);
	padding:14px 24px 22px;display:flex;flex-direction:column;gap:4px;
	font-family:var(--adea-font-titoli);font-weight:500;
}
.adea-header .adea-header-m-link{cursor:pointer;color:#fff;padding:12px 6px;border-bottom:1px solid rgba(255,255,255,.08)}
/* ⚠️ come per il bottone: senza ridichiarare il colore, in hover vince il
   Kit e la voce diventa verde. Nell'originale le voci del menu del telefono
   non hanno nessun `data-hover` e restano bianche. */
.adea-header .adea-header-m-link:hover,
.adea-header .adea-header-m-link:focus-visible{color:#fff}
.adea-header .adea-header-m-group{padding:12px 6px 4px;border-bottom:1px solid rgba(255,255,255,.08)}
.adea-header .adea-header-m-group .adea-header-m-link--group{display:block;margin-bottom:6px;padding:0;border:none}
.adea-header .adea-header-m-sub{display:flex;flex-direction:column;gap:2px;padding-left:6px}
.adea-header .adea-header-m-sub a{cursor:pointer;color:#fff;padding:8px 0}
.adea-header .adea-header-m-cta{
	cursor:pointer;margin-top:12px;text-align:center;background:var(--adea-header-cta-bg,var(--adea-blu,#004F9E));
	color:#fff;font-weight:600;padding:14px;border-radius:100px;
	transition:transform .18s cubic-bezier(.34,1.4,.64,1),box-shadow .22s ease,background .2s ease;
}
.adea-header .adea-header-m-cta:active{transform:scale(.96)}

/* ---------- breakpoint originali (misurati, non dedotti: vedi tabella in testa) ----------
   Ogni gradino legge una variabile PROPRIA, così un valore impostato
   dall'editor per il desktop non piove sui gradini più stretti (§13). */
@media(max-width:1040px){
	.adea-header .adea-nav{display:none!important}
	.adea-header .adea-burger{display:inline-flex!important}
	.adea-header .adea-hdcta{display:none!important}
	.adea-header .adea-lang{display:none!important}
	.adea-header{padding:var(--adea-header-pad-v-1040,11px) 0}
	.adea-header-inner{min-height:auto}
}
/* .sect dell'originale: a ≤960 il padding orizzontale scende a 20px */
@media(max-width:960px){.adea-header-inner{padding:0 20px}}
@media(max-width:860px){
	.adea-header .adea-brand-logo{height:var(--adea-header-logo-h-860,58px)}
	.adea-header .adea-brand-payoff{font-size:var(--adea-header-payoff-size-860,10px);letter-spacing:var(--adea-header-payoff-ls-860,.03em)}
}
@media(max-width:620px){.adea-header{padding:var(--adea-header-pad-v-620,10px) 0}}
@media(max-width:560px){
	.adea-header .adea-brand-logo{height:var(--adea-header-logo-h-560,50px)}
	.adea-header .adea-brand-payoff{font-size:var(--adea-header-payoff-size-560,8.8px);letter-spacing:var(--adea-header-payoff-ls-560,.02em)}
}

/* ---------- editor e reduced-motion ----------
   Nell'editor niente animazione d'ingresso (ripartirebbe a ogni modifica);
   con reduced-motion la barra è ferma e visibile (§8 del prompt: deviazione
   DICHIARATA dall'originale, che non spegneva adeaHeaderDrop). */
.elementor-editor-active .adea-header{animation:none}
@media(prefers-reduced-motion:reduce){
	.adea-header{animation:none}
	.adea-header .adea-header-dd-panel{animation:none!important}
}
