/* ════════════════════════════════════════════════════════════════════
   WOW REDESIGN 2026-06 · tunnel d'adhésion (fichier dédié, chargé APRÈS tunnel.css)
   Aligné maquette pana-app.css : paper crème, encre nuit, accent bleu,
   Bricolage Grotesque / Manrope. En-tête centré, stepper connecté moderne,
   cartes sections façon « cartes home » (photo de couverture).
   ════════════════════════════════════════════════════════════════════ */
.pana-tunnel{
	--pana-font-titre:'Bricolage Grotesque','Segoe UI',sans-serif;
	--pana-font-corps:'Manrope',-apple-system,sans-serif;
	--pana-font-mono:'JetBrains Mono',ui-monospace,monospace;
	--pana-texte:var(--ink,#0A1628);
	--pana-bordure:var(--border,#E0D9C5);
	max-width:980px;
	padding:clamp(2rem,5vw,3.5rem) var(--pana-espace);
	font-family:var(--pana-font-corps);
	color:var(--pana-texte);
}

/* ── En-tête centré ── */
.pana-tunnel__entete{ text-align:center; margin:0 auto 2rem; max-width:640px; }
.pana-tunnel__eyebrow{
	display:inline-block; font-family:var(--pana-font-mono);
	font-size:11px; font-weight:600; letter-spacing:.22em; text-transform:uppercase;
	color:var(--accent,#1C56E5); background:var(--accent-soft,rgba(28,86,229,.12));
	padding:6px 14px; border-radius:999px; margin-bottom:1rem;
}
.pana-tunnel__titre{
	margin:0 0 .6rem; font-family:var(--pana-font-titre); font-weight:700;
	font-size:clamp(1.9rem,1.4rem + 2.5vw,2.9rem); line-height:1.05; letter-spacing:-.02em;
	color:var(--ink,#0A1628);
}
.pana-tunnel__soustitre{
	margin:0; font-size:clamp(.95rem,.9rem + .3vw,1.06rem); line-height:1.5;
	color:var(--text-muted,#5A6B7E);
}

/* ── Stepper connecté moderne ── */
.pana-tunnel__progression{ margin:0 0 2.25rem; }
.pana-tunnel__etapes{
	display:flex; flex-wrap:nowrap; align-items:flex-start; justify-content:center;
	gap:0; margin:0 auto; padding:0; list-style:none; max-width:760px;
}
.pana-tunnel__pas{
	flex:1 1 0; min-width:0; position:relative;
	display:flex; flex-direction:column; align-items:center; gap:.55rem;
	padding:0; border:0; background:transparent; white-space:normal; text-align:center;
	font-size:.78rem; font-weight:600; color:var(--text-muted,#5A6B7E);
}
.pana-tunnel__pas::before{
	content:""; position:absolute; top:18px; left:-50%; width:100%; height:3px;
	background:var(--paper-3,#E0D9C5); border-radius:3px; z-index:0;
}
.pana-tunnel__pas:first-child::before{ display:none; }
.pana-tunnel__pas.is-fait::before,
.pana-tunnel__pas.is-courant::before{ background:var(--accent,#1C56E5); }
.pana-tunnel__pas-num{
	position:relative; z-index:1; width:38px; height:38px; border-radius:999px;
	display:inline-flex; align-items:center; justify-content:center;
	background:var(--paper-3,#E0D9C5); color:var(--text-muted,#5A6B7E);
	border:2px solid transparent; font-family:var(--pana-font-mono);
	font-weight:700; font-size:.9rem; line-height:1;
	transition:all .25s cubic-bezier(.22,1,.36,1);
}
.pana-tunnel__pas.is-courant .pana-tunnel__pas-num{
	background:var(--ink,#0A1628); color:var(--accent,#1C56E5);
	border-color:var(--accent,#1C56E5); box-shadow:0 0 0 4px rgba(28,86,229,.2);
}
.pana-tunnel__pas.is-fait .pana-tunnel__pas-num{
	background:var(--accent,#1C56E5); color:#fff; border-color:var(--accent-deep,#1442B8);
}
.pana-tunnel__pas.is-fait .pana-tunnel__pas-num::after{ content:"\2713"; font-size:1rem; }
.pana-tunnel__pas-libelle{ font-family:var(--pana-font-titre); font-weight:600; max-width:10ch; line-height:1.15; }
.pana-tunnel__pas.is-courant .pana-tunnel__pas-libelle{ color:var(--ink,#0A1628); }
.pana-tunnel__pas.is-fait .pana-tunnel__pas-libelle{ color:var(--accent-deep,#1442B8); }
.pana-tunnel__pas.is-verrou{ opacity:.55; }
.pana-tunnel__pas[data-pana-aller]{ cursor:pointer; }
.pana-tunnel__pas[data-pana-aller]:hover .pana-tunnel__pas-num{ border-color:var(--accent,#1C56E5); }
@media (max-width:560px){
	.pana-tunnel__pas-libelle{ display:none; }
	.pana-tunnel__pas-num{ width:34px; height:34px; }
	.pana-tunnel__pas::before{ top:16px; }
}

/* ── Panneau d'étape ── */
.pana-tunnel__etape{
	background:#fff; border:1px solid var(--border,#E0D9C5); border-radius:20px;
	padding:clamp(1.25rem,1rem + 1.5vw,2rem); box-shadow:0 1px 2px rgba(10,22,40,.04);
}

/* ── Cartes sections façon home (photo de couverture) ── */
.pana-choixsec{
	grid-template-columns:repeat(auto-fill,minmax(210px,1fr)) !important;
	gap:18px !important;
}
.pana-choixsec__item{ margin:0; min-width:0; }
.pana-choixsec__label{
	display:flex !important; flex-direction:column; align-items:stretch !important;
	gap:0 !important; height:100%; margin:0; padding:0 !important;
	border:1px solid var(--border,#E0D9C5) !important; border-radius:18px;
	background:#fff !important; overflow:hidden; text-align:left !important;
	box-shadow:0 1px 2px rgba(10,22,40,.04);
	transition:transform .2s cubic-bezier(.22,1,.36,1),box-shadow .2s,border-color .2s;
}
.pana-choixsec__label:hover{
	transform:translateY(-4px); border-color:var(--accent,#1C56E5) !important;
	box-shadow:0 20px 40px -22px rgba(10,22,40,.4) !important;
}
.pana-choixsec__item--fermee .pana-choixsec__label{ cursor:not-allowed; }
.pana-choixsec__item--fermee .pana-choixsec__label:hover{
	transform:none; border-color:var(--border,#E0D9C5) !important; box-shadow:0 1px 2px rgba(10,22,40,.04) !important;
}
.pana-choixsec__media{
	position:relative; display:block; aspect-ratio:16/10; width:100%;
	background-color:var(--ink,#0A1628); background-image:var(--pana-section-photo,none);
	background-size:cover; background-position:center;
}
.pana-choixsec__item:not(.pana-choixsec__item--photo) .pana-choixsec__media{
	background-image:linear-gradient(135deg,var(--pana-sec-couleur,#1C56E5),rgba(10,22,40,.85));
}
.pana-choixsec__media::after{
	content:""; position:absolute; inset:0;
	background:linear-gradient(180deg,rgba(10,22,40,0) 40%,rgba(10,22,40,.5) 100%);
}
.pana-choixsec__item--fermee .pana-choixsec__media{ filter:grayscale(.65); }
.pana-choixsec__check{
	position:absolute; top:10px; right:10px; z-index:2; width:30px; height:30px;
	border-radius:999px; background:rgba(255,255,255,.9); border:2px solid #fff;
	box-shadow:0 2px 8px rgba(0,0,0,.25); display:flex; align-items:center; justify-content:center; transition:.2s;
}
.pana-choixsec__check::after{
	content:""; width:12px; height:6px; margin-top:-2px;
	border-left:2.5px solid var(--accent,#1C56E5); border-bottom:2.5px solid var(--accent,#1C56E5);
	transform:rotate(-45deg) scale(0); transition:transform .2s;
}
.pana-choixsec__item--fermee .pana-choixsec__check{ display:none; }
.pana-choixsec__titre{
	display:block; padding:13px 15px 0 !important; font-family:var(--pana-font-titre);
	font-weight:700; font-size:1.02rem !important; line-height:1.2 !important;
	color:var(--ink,#0A1628) !important; text-align:left;
}
.pana-choixsec__fermee{
	display:block; padding:6px 15px 0; font-size:11.5px; line-height:1.35; color:var(--text-muted,#5A6B7E);
}
.pana-choixsec__corps{ display:block !important; padding:11px 15px 15px !important; }
.pana-choixsec__logo{ display:none !important; }
.pana-choixsec__case{
	position:absolute !important; opacity:0; width:1px !important; height:1px !important;
	min-width:0 !important; min-height:0 !important; margin:0; pointer-events:none;
}
.pana-choixsec__item:has(.pana-choixsec__case:checked) .pana-choixsec__label{
	border-color:var(--accent,#1C56E5) !important; background:#fff !important;
	box-shadow:0 0 0 2px var(--accent,#1C56E5),0 18px 40px -20px rgba(28,86,229,.5) !important;
}
.pana-choixsec__item:has(.pana-choixsec__case:checked) .pana-choixsec__check{ background:var(--accent,#1C56E5); border-color:#fff; }
.pana-choixsec__item:has(.pana-choixsec__case:checked) .pana-choixsec__check::after{ border-color:#fff; transform:rotate(-45deg) scale(1); }
.pana-choixsec__membre-titre{
	font-family:var(--pana-font-titre); font-weight:700; font-size:1.15rem;
	color:var(--ink,#0A1628); display:flex; align-items:center; gap:.5rem;
}
.pana-choixsec__membre-titre::before{ content:""; width:8px; height:22px; border-radius:4px; background:var(--accent,#1C56E5); }

/* ── Boutons navigation ── */
.pana-tunnel__nav{ display:flex; align-items:center; gap:1rem; justify-content:space-between; margin-top:1.75rem; }
.pana-tunnel__btn{
	font-family:var(--pana-font-titre); font-weight:600; font-size:.98rem; border-radius:999px;
	padding:14px 28px; cursor:pointer; border:1px solid transparent; text-decoration:none;
	display:inline-flex; align-items:center; gap:.5rem; transition:all .25s cubic-bezier(.22,1,.36,1);
}
.pana-tunnel__btn--suiv{ background:var(--accent,#1C56E5); color:#fff; border-color:var(--accent-deep,#1442B8); margin-left:auto; }
.pana-tunnel__btn--suiv:hover{ background:var(--ink,#0A1628); color:var(--accent,#1C56E5); transform:translateY(-2px); box-shadow:0 12px 26px -10px rgba(10,22,40,.5); }
.pana-tunnel__btn--prec{ background:transparent; color:var(--ink,#0A1628); border-color:var(--ink,#0A1628); }
.pana-tunnel__btn--prec:hover{ background:var(--ink,#0A1628); color:#fff; }

/* ── Membres collapsibles (accordéon par adhérent) ── */
details.pana-choixsec__membre{
	border:1px solid var(--border,#E0D9C5); border-radius:16px; background:#fff;
	margin:0 0 16px; overflow:hidden; box-shadow:0 1px 2px rgba(10,22,40,.04);
	transition:box-shadow .2s, border-color .2s;
}
details.pana-choixsec__membre[open]{ box-shadow:0 12px 32px -20px rgba(10,22,40,.28); }
summary.pana-choixsec__membre-titre{
	list-style:none; cursor:pointer; user-select:none;
	display:flex; align-items:center; gap:.65rem; margin:0; padding:16px 20px;
	font-family:var(--pana-font-titre); font-weight:700; font-size:1.12rem;
	color:var(--ink,#0A1628); transition:background .15s;
}
summary.pana-choixsec__membre-titre::-webkit-details-marker{ display:none; }
summary.pana-choixsec__membre-titre::marker{ content:""; }
summary.pana-choixsec__membre-titre::before{
	content:""; flex:0 0 auto; width:8px; height:22px; border-radius:4px; background:var(--accent,#1C56E5);
}
summary.pana-choixsec__membre-titre::after{
	content:""; flex:0 0 auto; margin-left:auto; width:9px; height:9px;
	border-right:2.5px solid var(--text-muted,#5A6B7E); border-bottom:2.5px solid var(--text-muted,#5A6B7E);
	transform:rotate(45deg); transition:transform .25s cubic-bezier(.22,1,.36,1);
}
details.pana-choixsec__membre[open] summary.pana-choixsec__membre-titre::after{ transform:rotate(-135deg); }
summary.pana-choixsec__membre-titre:hover{ background:var(--paper-2,#ECE6D6); }
details.pana-choixsec__membre > .pana-choixsec{ padding:2px 18px 20px; }
/* Le display:grid auteur écrase le masquage UA de <details> fermé → masquer explicitement. */
details.pana-choixsec__membre:not([open]) > .pana-choixsec{ display:none !important; }
