/*
 * Fascia blu "Mission & Core Business" (pagina Azienda) — dall'originale
 * index.html r.915–941 (CSS: styles.css r.866–874, r.893–894 e r.1016–1026).
 *
 * In questo file: solo ciò che il componente condiviso non ha già.
 * Fondo blu, trama di puntini e impaginato vengono da `.adea-c-blueband` /
 * `.adea-c-blueband__inner` (adea-tokens.css §6), che porta anche il gradino
 * dei 560 sull'imbottitura.
 *
 * Markup in templates/mission.php, controlli in includes/widgets/class-mission.php.
 * Nessun .js.
 *
 * Cascata MISURATA sull'originale (1440/1024/900/700/560/375):
 *
 *                    >900            561–900         ≤560
 *  imbottitura       78/40/84        78/40/84        56/20/60
 *  testata           680 centrata    680 centrata    680 centrata
 *  titolo            42px            42px            33px
 *  schede            3 colonne       1 colonna       1 colonna
 *                    gap 22, mt 44   gap 16, mt 32   gap 16, mt 32
 *
 * ⚠️ Due gradini DIVERSI: **900** per le schede, **560** per titolo e
 * imbottitura. Non sono i breakpoint del Kit.
 *
 * ⚠️ Il titolo pesa **400** e spazia **-.03em**, non i 500 / -.035em di
 * `.adea-band-title` (r.873): in pagina interna vale
 * `.page:not([data-page="home"]) h2`, che imposta ENTRAMBE le proprietà.
 * Misurato: 400 e -1.26px su 42px. Stessa trappola della fascia "Linee".
 *
 * Indice: sezione · testata · schede in vetro · breakpoint · reduced-motion
 */

/* ---------- sezione ----------
   Il margine sopra è uno stile inline nell'originale (`margin-top:34px`):
   qui diventa un controllo. */
.adea-mission-section{
	margin-top:var(--adea-mission-mt,34px);
	font-family:var(--adea-font-testo,'Source Sans 3',system-ui,sans-serif);
	line-height:normal; /* il Kit impone 1.5; l'originale eredita normal dal body */
}

/* ---------- testata centrata ---------- */
.adea-mission-head{
	text-align:center;
	max-width:var(--adea-mission-head-maxw,680px);
	margin:0 auto;
}
.adea-mission-kicker{
	display:inline-flex;align-items:center;justify-content:center;gap:9px;
	font-family:var(--adea-font-titoli,'Poppins',sans-serif);font-weight:600;
	font-size:var(--adea-t-kicker,12px);letter-spacing:var(--adea-t-kicker-ls,.16em);
	text-transform:uppercase;color:var(--adea-verde-chiaro,#8fd6a1);margin:0 0 16px;
}
.adea-mission-title{
	font-family:var(--adea-font-titoli,'Poppins',sans-serif);
	font-weight:400; /* 400 / -.03em: vedi la nota in testa */
	font-size:var(--adea-mission-title-size,var(--adea-t-h2,42px));
	line-height:var(--adea-t-h2-lh,1.1);letter-spacing:-.03em;
	color:#fff;margin:0 0 16px;
}
.adea-mission-copy{
	font-size:16.5px;line-height:1.65;color:rgba(255,255,255,.8);margin:0;
}

/* ---------- schede in vetro ---------- */
.adea-mission-cards{
	display:grid;grid-template-columns:repeat(var(--adea-mission-cols,3),1fr);
	gap:var(--adea-mission-gap,22px);margin-top:var(--adea-mission-cards-mt,44px);
}
.adea-mission-card{
	background:rgba(255,255,255,.09);border:1px solid rgba(255,255,255,.19);
	border-radius:20px;padding:30px 30px 32px;backdrop-filter:blur(10px);
	transition:background .3s var(--adea-ease),transform .38s var(--adea-ease-spring),box-shadow .38s ease;
}
/* Nell'originale è già CSS (r.1022): qui si aggiunge solo `:focus-within`, così
   la scheda reagisce anche a chi arriva con la tastiera. */
.adea-mission-card:hover,.adea-mission-card:focus-within{
	background:rgba(255,255,255,.16);transform:translateY(-6px);
	box-shadow:0 30px 58px -30px rgba(0,0,0,.55);
}
.adea-mission-ico{
	width:50px;height:50px;border-radius:14px;background:#fff;
	color:var(--adea-blu,#004F9E);
	display:flex;align-items:center;justify-content:center;margin-bottom:20px;
}
.adea-mission-card h3{
	font-family:var(--adea-font-titoli,'Poppins',sans-serif);font-weight:500;
	font-size:19px;letter-spacing:-.01em;color:#fff;margin:0 0 10px;
	line-height:normal; /* il Kit dà 1.2 alle intestazioni; l'originale eredita normal */
}
.adea-mission-card p{
	font-size:15px;line-height:1.6;color:rgba(255,255,255,.78);margin:0;
}

/* ---------- breakpoint originali (misurati) ---------- */
@media(max-width:900px){
	/* ⚠️ Scritte come PROPRIETÀ e non come variabili: i controlli dell'editor
	   scrivono le variabili su un selettore a due classi, che vincerebbe qui. */
	.adea-mission-cards{grid-template-columns:1fr;gap:16px;margin-top:32px}
}
@media(max-width:560px){
	.adea-mission-title{--adea-mission-title-size:var(--adea-t-h2-md,33px)}
}

/* ---------- reduced-motion ----------
   ⚠️ Niente da spegnere, ed è VOLUTO: il blocco `prefers-reduced-motion`
   dell'originale (r.1010–1013) elenca `.adea-lineband-item`, `.adea-fact` e
   altri, ma NON `.adea-glass`. Il sollevamento al passaggio del puntatore resta
   anche lì. Verificato riga per riga, non dimenticato.
   La sezione non ha entrate: è visibile per intero fin da subito. */
