/*
 * "La gamma" — selettore di prodotti: elenco a sinistra, scheda del prodotto
 * scelto a destra (mockup Linea Pronto, 2026-08-06).
 *
 * Markup in templates/gsel.php, controlli in class-gsel.php,
 * comportamento in assets/js/gsel.js.
 *
 * ⚠️ Senza JavaScript resta aperto il PRIMO prodotto e l'elenco fa da indice:
 * ogni voce è un vero collegamento all'ancora del suo pannello, quindi la
 * pagina resta usabile e tutti i contenuti sono leggibili.
 *
 * ⚠️ Le miniature e la busta grande sono JPEG su fondo bianco: si fondono col
 * fondo chiaro (`mix-blend-mode:multiply`). Per questo né la miniatura né il
 * suo contenitore possono avere filtri o z-index — isolano l'elemento e
 * spengono la fusione, facendo ricomparire il rettangolo del file.
 */

.adea-gsel{
	position:relative;overflow:hidden;background:var(--adea-gsel-bg,#f4f7fb);
	padding:var(--adea-gsel-pt,80px) 0 var(--adea-gsel-pb,88px);
	font-family:var(--adea-font-testo,'Source Sans 3',system-ui,sans-serif);
	line-height:normal; /* il Kit impone 1.5 */
}
.adea-gsel-inner{max-width:var(--adea-gsel-maxw,1320px);margin:0 auto;padding:0 var(--adea-gsel-pad-x,40px)}

/* ---------- testata ---------- */
.adea-gsel-head{text-align:center;max-width:var(--adea-gsel-head-maxw,760px);margin:0 auto 40px}
.adea-gsel-kicker{
	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,#42AD59);margin-bottom:14px;
}
.adea-gsel-head h2{
	font-family:var(--adea-font-titoli,'Poppins',sans-serif);font-weight:600;
	font-size:var(--adea-gsel-title,34px);line-height:1.16;letter-spacing:-.02em;
	color:var(--adea-blu,#004F9E);margin:0 0 12px;
}
.adea-gsel-head p{font-size:15.5px;line-height:1.7;color:#5b6b78;margin:0 0 22px}
/* il filo verde sotto la testata */
.adea-gsel-rule{width:56px;height:3px;border-radius:999px;background:var(--adea-verde,#42AD59);margin:0 auto}

/* ---------- la scheda bianca che contiene tutto ---------- */
.adea-gsel-card{
	display:grid;grid-template-columns:var(--adea-gsel-cols,384px 1fr);
	background:#fff;border-radius:22px;overflow:hidden;
	box-shadow:0 34px 74px -40px rgba(10,37,64,.42);
}

/* ---------- elenco a sinistra ---------- */
.adea-gsel-list{display:flex;flex-direction:column;gap:8px;padding:22px}
/* due classi: il reset del tema colora i <button> in hover e in focus */
.adea-gsel-list .adea-gsel-item{
	display:grid;grid-template-columns:56px 1fr 30px;gap:14px;align-items:center;
	width:100%;text-align:left;cursor:pointer;text-decoration:none;
	padding:14px 14px;border-radius:14px;line-height:normal;
	background:none;border:1.5px solid transparent;color:inherit;
	transition:background .24s ease,border-color .24s ease;
}
.adea-gsel-list .adea-gsel-item:hover{background:#f4f8fd}
/* la voce aperta: bordo e titolo verdi, come nel disegno */
.adea-gsel-list .adea-gsel-item.is-active{
	background:#f3fbf5;border-color:rgba(66,173,89,.5);
}
.adea-gsel-thumb{
	width:56px;height:56px;display:flex;align-items:center;justify-content:center;
}
.adea-gsel-thumb img{
	display:block;max-width:100%;max-height:100%;width:auto;object-fit:contain;
	mix-blend-mode:multiply;
}
.adea-gsel-item strong{
	display:block;font-family:var(--adea-font-titoli,'Poppins',sans-serif);
	font-weight:600;font-size:13.5px;letter-spacing:.02em;text-transform:uppercase;
	color:var(--adea-blu,#004F9E);margin-bottom:5px;
}
.adea-gsel-item.is-active strong{color:var(--adea-verde,#42AD59)}
.adea-gsel-item em{display:block;font-style:normal;font-size:12.5px;line-height:1.5;color:#7c8b98}
.adea-gsel-go{
	width:30px;height:30px;border-radius:50%;flex:none;
	border:1.4px solid #dbe5f0;color:var(--adea-blu,#004F9E);
	display:flex;align-items:center;justify-content:center;
	transition:background .24s ease,border-color .24s ease,color .24s ease;
}
.adea-gsel-item.is-active .adea-gsel-go{
	border-color:rgba(66,173,89,.6);color:var(--adea-verde,#42AD59);
}
/* il collegamento a tutte le schede, in fondo all'elenco */
.adea-gsel-list .adea-gsel-all{
	display:flex;align-items:center;justify-content:center;gap:10px;
	margin-top:8px;padding:14px 16px;border-radius:12px;text-decoration:none;
	border:1.4px solid rgba(66,173,89,.45);color:var(--adea-verde,#42AD59);
	font-family:var(--adea-font-titoli,'Poppins',sans-serif);font-weight:600;font-size:13.5px;
	transition:background .24s ease,color .24s ease,border-color .24s ease;
}
.adea-gsel-list .adea-gsel-all:hover,
.adea-gsel-list .adea-gsel-all:focus-visible{
	background:var(--adea-verde,#42AD59);border-color:var(--adea-verde,#42AD59);color:#fff;
}

/* ---------- la scheda del prodotto ---------- */
.adea-gsel-panels{position:relative;background:linear-gradient(150deg,#0d2f5c 0%,#0a2540 100%)}
/* ⚠️ La colonna del testo deve stare larga abbastanza da tenere i DUE bottoni
   sulla stessa riga: con .84fr andavano a capo. Misurato, non stimato. */
.adea-gsel-panel{display:none;grid-template-columns:var(--adea-gsel-panel-cols,1fr .68fr);min-height:100%}
.adea-gsel-panel.is-active{display:grid}
.adea-gsel-copy{padding:var(--adea-gsel-pad,44px 38px 42px);color:#fff}
.adea-gsel-badge{
	display:inline-block;margin-bottom:18px;padding:7px 16px;border-radius:999px;
	background:rgba(143,214,161,.16);border:1px solid rgba(143,214,161,.4);
	font-family:var(--adea-font-titoli,'Poppins',sans-serif);font-weight:600;
	font-size:var(--adea-t-pill,11.5px);letter-spacing:var(--adea-t-pill-ls,.1em);
	text-transform:uppercase;color:var(--adea-verde-chiaro,#8fd6a1);line-height:normal;
}
.adea-gsel-copy h3{
	font-family:var(--adea-font-titoli,'Poppins',sans-serif);font-weight:600;
	font-size:var(--adea-gsel-h3,29px);line-height:1.16;letter-spacing:-.02em;
	color:#fff;margin:0 0 14px;
}
.adea-gsel-copy > p{font-size:15px;line-height:1.72;color:rgba(255,255,255,.78);margin:0 0 22px}

/* le due spunte */
.adea-gsel-checks{display:flex;flex-direction:column;gap:11px;margin:0 0 24px;padding:0;list-style:none}
.adea-gsel-checks li{display:flex;gap:12px;align-items:flex-start;list-style:none}
.adea-gsel-check{
	flex:none;width:22px;height:22px;border-radius:50%;margin-top:1px;
	border:1.4px solid rgba(143,214,161,.6);background:rgba(143,214,161,.16);
	color:var(--adea-verde-chiaro,#8fd6a1);display:flex;align-items:center;justify-content:center;
}
.adea-gsel-checks span:last-child{font-size:14px;line-height:1.55;color:rgba(255,255,255,.86)}

/* i tre punti forti, sotto un filo */
.adea-gsel-facts{
	display:grid;grid-template-columns:repeat(3,1fr);gap:20px;
	border-top:1px solid rgba(255,255,255,.16);padding-top:22px;margin-bottom:26px;
}
.adea-gsel-fact-ico{color:var(--adea-verde-chiaro,#8fd6a1);margin-bottom:10px;line-height:normal}
.adea-gsel-fact b{
	display:block;font-family:var(--adea-font-titoli,'Poppins',sans-serif);font-weight:600;
	font-size:13.5px;line-height:1.28;color:#fff;margin-bottom:5px;
}
.adea-gsel-fact span{display:block;font-size:12.5px;line-height:1.5;color:rgba(255,255,255,.66)}

/* i due bottoni, incolonnati (scelta dell'utente, 2026-08-06): la scheda
   tecnica sta SOTTO «Approfondisci il prodotto», non di fianco. Incolonnandoli
   cade anche il motivo per cui erano compressi — la larghezza non è più
   contesa, quindi ognuno torna alla sua misura naturale. */
.adea-gsel-btns{display:flex;flex-direction:column;align-items:flex-start;gap:12px}
.adea-gsel-copy .adea-gsel-doc{
	display:inline-flex;align-items:center;gap:10px;text-decoration:none;
	padding:11px 18px;border-radius:999px;line-height:1.3;
	border:1.4px solid rgba(255,255,255,.3);color:#fff;
	font-family:var(--adea-font-titoli,'Poppins',sans-serif);font-weight:600;font-size:13.5px;
	transition:background .24s ease,border-color .24s ease;
}
.adea-gsel-copy .adea-gsel-doc:hover,
.adea-gsel-copy .adea-gsel-doc:focus-visible{
	background:rgba(255,255,255,.14);border-color:rgba(255,255,255,.5);color:#fff;
}
/* «PDF, scheda nuova»: solo per chi legge con la sintesi vocale. Un link che
   apre un documento in una finestra nuova va annunciato; a schermo il bottone
   resta quello disegnato, quindi l'impaginato non cambia di un pixel. */
.adea-gsel-doc .adea-gsel-doc-nota{
	position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;
	clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0;
}

/* la fotografia, a filo del pannello */
.adea-gsel-media{position:relative;overflow:hidden;min-height:var(--adea-gsel-minh,420px)}
.adea-gsel-media img{
	position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;
	max-width:none; /* il Kit dà `max-width:100%` a ogni immagine */
}

/* ---------- breakpoint ---------- */
@media(max-width:1100px){
	.adea-gsel-card{grid-template-columns:1fr}
	.adea-gsel-list{
		flex-direction:row;flex-wrap:wrap;gap:10px;
		border-bottom:1px solid #eef2f7;
	}
	.adea-gsel-list .adea-gsel-item{width:calc(50% - 5px)}
	.adea-gsel-list .adea-gsel-all{width:100%}
	.adea-gsel-media{min-height:300px}
}
@media(max-width:900px){
	.adea-gsel{padding:60px 0 68px}
	.adea-gsel-inner{padding-left:24px;padding-right:24px}
	.adea-gsel-panel{grid-template-columns:1fr}
	/* in colonna la fotografia va sopra il testo */
	.adea-gsel-media{order:-1;min-height:240px}
	.adea-gsel-copy{padding:34px 26px 36px}
	.adea-gsel-head h2{font-size:27px}
	.adea-gsel-copy h3{font-size:24px}
}
@media(max-width:620px){
	.adea-gsel-list .adea-gsel-item{width:100%}
	.adea-gsel-facts{grid-template-columns:1fr;gap:16px}
	.adea-gsel-inner{padding-left:18px;padding-right:18px}
}
