/*
 * Tunnel d'adhésion du site www.ericzemmour.fr (adhesion.twig, adhesion-retour.twig ; moteur js/adhesion.js).
 * Charte : les 6 couleurs et les 2 dégradés d'ez.css, Digitalt pour les titres et les compteurs, Futura pour le texte.
 *
 * - Scène : ciel de la charte, soleil corail posé sur l'horizon, sol néon en canevas (adhesion.js) ; fixe derrière la page.
 * - Carte d'adhérent en 3D (partials/adhesion-carte.twig) : tracé néon à l'arrivée, puis elle se construit étape par
 *   étape (a-formule, a-duree, a-sceau, a-nom), prend fond et reflet holographique de la formule (data-formule), se
 *   retourne pour le récapitulatif (est-retournee).
 * - Borne de sélection (formules), boîte de vitesses (durée), compteurs à rouleaux (montants), enseigne néon (merci).
 * 60 images par seconde : transform et opacity seulement, sauf le canevas du sol (une trentaine de traits) ; aucun
 * flou d'arrière-plan sur la scène animée. Mouvement réduit : tout est posé à l'état final, rien ne bouge.
 */

@property --ad-bord { syntax: "<color>"; inherits: true; initial-value: #45D5DE; }
@property --ad-accent { syntax: "<color>"; inherits: true; initial-value: #FFFFFF; }
@property --ad-ligne { syntax: "<color>"; inherits: true; initial-value: #45D5DE; }
@property --ad-holo { syntax: "<number>"; inherits: true; initial-value: 0; }

.ezad {
	--ezad-horizon: 64vh;
	--ezad-fuite: 50%;
	--ezad-soleil: clamp(150px, 34vmin, 360px);
	min-height: 100vh; min-height: 100svh; background: var(--ez-nuit);
}
@media (min-width: 960px) { .ezad { --ezad-fuite: 72%; --ezad-horizon: 66vh; } }

/* ---------- Scène ---------- */
.ezad-scene { position: fixed; inset: 0; z-index: 0; overflow: hidden; pointer-events: none; }
.ezad-ciel {
	position: absolute; left: 0; right: 0; top: 0; height: var(--ezad-horizon);
	background:
		radial-gradient(ellipse 70% 55% at var(--ezad-fuite) 100%, rgba(238, 124, 111, 0.55), rgba(238, 124, 111, 0) 70%),
		linear-gradient(180deg, var(--ez-nuit) 0%, var(--ez-encre) 42%, var(--ez-violet) 78%, var(--ez-corail) 130%);
}
/* Étoiles : quelques points fixes (un seul calque, jamais repeint) */
.ezad-ciel::before {
	content: ""; position: absolute; inset: 0 0 35%; opacity: 0.7;
	background-image:
		radial-gradient(1.5px 1.5px at 8% 18%, #fff, transparent), radial-gradient(1px 1px at 22% 8%, #fff, transparent),
		radial-gradient(1.5px 1.5px at 35% 30%, #fff, transparent), radial-gradient(1px 1px at 48% 12%, #fff, transparent),
		radial-gradient(1px 1px at 61% 24%, #fff, transparent), radial-gradient(1.5px 1.5px at 74% 6%, #fff, transparent),
		radial-gradient(1px 1px at 86% 20%, #fff, transparent), radial-gradient(1.5px 1.5px at 93% 34%, #fff, transparent),
		radial-gradient(1px 1px at 15% 40%, #fff, transparent), radial-gradient(1px 1px at 55% 44%, #fff, transparent);
}
/* Soleil : disque corail net, coupé par l'horizon (comme vivant.js), qui se lève à l'arrivée */
.ezad-astre { position: absolute; left: var(--ezad-fuite); top: var(--ezad-horizon); width: var(--ezad-soleil); height: calc(var(--ezad-soleil) * 0.56); margin-left: calc(var(--ezad-soleil) / -2); transform: translateY(-100%); overflow: hidden; }
.ezad-soleil { width: 100%; aspect-ratio: 1; border-radius: 50%; background: var(--ez-corail); transform: translateY(0); }
.ezad-js .ezad-soleil { animation: ezad-lever 2600ms var(--ez-courbe) 150ms both; }
@keyframes ezad-lever { from { transform: translateY(70%); } to { transform: translateY(0); } }
.ezad-sol { position: absolute; left: 0; right: 0; top: var(--ezad-horizon); bottom: 0; width: 100%; height: calc(100% - var(--ezad-horizon)); background: linear-gradient(180deg, var(--ez-encre), var(--ez-nuit) 55%); border-top: 2px solid var(--ez-corail); }
.ezad-trainee { position: fixed; z-index: 4; left: 0; top: 0; height: 3px; margin-top: -1.5px; transform-origin: 0 50%; pointer-events: none; background: linear-gradient(90deg, rgba(69, 213, 222, 0), var(--ez-turquoise) 40%, var(--ez-blanc)); box-shadow: 0 0 10px var(--ez-turquoise); }
.ezad-trainee--corail { background: linear-gradient(90deg, rgba(238, 124, 111, 0), var(--ez-corail) 40%, var(--ez-blanc)); box-shadow: 0 0 10px var(--ez-corail); }

/* ---------- En-tête et étapes ---------- */
.ezad-entete { position: relative; z-index: 3; display: flex; align-items: center; justify-content: space-between; gap: var(--ez-e4); width: 100%; max-width: 1240px; margin: 0 auto; padding: max(12px, env(safe-area-inset-top)) var(--ez-gouttiere) 10px; transition: opacity 400ms; }
.ezad-logo img { height: 42px; width: auto; }
.ezad-etapes { display: flex; gap: 6px; list-style: none; margin: 0; padding: 0; transition: opacity 400ms; }
.ezad[data-etape="depart"] .ezad-etapes, .ezad[data-etape="fin"] .ezad-etapes { opacity: 0; }
.ezad-etapes li { display: flex; align-items: center; gap: 8px; font-size: 0.72rem; font-weight: 300; text-transform: uppercase; letter-spacing: 0.16em; opacity: 0.6; }
.ezad-etapes li[aria-current="step"], .ezad-etapes li.est-fait { opacity: 1; }
.ezad-etapes__led { width: 24px; height: 6px; border-radius: 1px; background: rgba(255, 255, 255, 0.22); transition: background-color 300ms, box-shadow 300ms; }
.ezad-etapes li.est-fait .ezad-etapes__led { background: var(--ez-corail); }
.ezad-etapes li[aria-current="step"] .ezad-etapes__led { background: var(--ez-turquoise); box-shadow: 0 0 10px var(--ez-turquoise); }
.ezad-etapes__nom { display: none; }
.ezad-etapes li[aria-current="step"] .ezad-etapes__nom { display: inline; }
@media (min-width: 1100px) { .ezad-etapes { gap: 18px; } .ezad-etapes__nom { display: inline; } }

/* ---------- Mise en page : vitrine (carte, compteurs) et panneau (étapes) ---------- */
.ezad-main { position: relative; z-index: 2; display: grid; gap: var(--ez-e4); width: 100%; max-width: 1240px; margin: 0 auto; padding: 0 var(--ez-gouttiere) max(48px, env(safe-area-inset-bottom)); }
.ezad-vitrine { display: grid; justify-items: center; align-items: center; gap: var(--ez-e4); min-width: 0; }
.ezad-panneau { position: relative; min-width: 0; padding: 24px 20px 28px; background: rgba(30, 30, 62, 0.9); border: 1px solid rgba(69, 213, 222, 0.28); border-radius: var(--ez-rayon); box-shadow: 0 30px 60px -30px rgba(0, 0, 0, 0.85); outline: none; transition: opacity 400ms, transform 500ms var(--ez-courbe); }
@media (min-width: 960px) {
	.ezad-main { grid-template-columns: minmax(0, 540px) minmax(0, 1fr); gap: 56px; align-items: start; }
	.ezad-panneau { grid-column: 1; grid-row: 1; padding: 36px 40px 40px; margin-bottom: 8vh; }
	/* La carte flotte au-dessus de l'horizon, à hauteur fixe pendant que le panneau défile */
	.ezad-vitrine { grid-column: 2; grid-row: 1; position: sticky; top: 0; height: 100vh; height: 100svh; align-content: center; padding-bottom: 22vh; margin-top: -64px; }
	.ezad-main--retour { align-items: center; min-height: calc(100svh - 64px); }
	.ezad-main--retour .ezad-panneau { margin-bottom: 0; }
}
@media (max-width: 959px) {
	/* Téléphone : carte et compteurs en bandeau collé en haut pendant les choix (formule, durée, paiement) */
	.ezad-vitrine { position: sticky; top: 0; z-index: 3; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); margin: 0 calc(-1 * var(--ez-gouttiere)); padding: 8px var(--ez-gouttiere) 14px; background: linear-gradient(180deg, rgba(30, 30, 62, 0.97) 78%, rgba(30, 30, 62, 0)); }
	.ezad[data-etape="depart"] .ezad-vitrine, .ezad[data-etape="recap"] .ezad-vitrine, .ezad[data-etape="fin"] .ezad-vitrine,
	.ezad[data-etape="retour"] .ezad-vitrine { position: relative; grid-template-columns: minmax(0, 1fr); background: none; padding: 12px var(--ez-gouttiere) 20px; }
	.ezad[data-etape="infos"] .ezad-vitrine { position: relative; }
	.ezad[data-etape="depart"] .ezad-carte, .ezad[data-etape="recap"] .ezad-carte, .ezad[data-etape="retour"] .ezad-carte { width: min(100%, 420px); }
	.ezad[data-etape="fin"] .ezad-carte { width: min(76%, 340px); }
}
.ezad[data-etape="depart"] .ezad-tableau, .ezad[data-etape="recap"] .ezad-tableau, .ezad[data-etape="fin"] .ezad-tableau { display: none; }
.ezad.est-au-depart .ezad-panneau { opacity: 0; transform: translateY(40px); }
.ezad.est-au-depart .ezad-tableau, .ezad.est-au-depart .ezad-entete { opacity: 0; transition: opacity 400ms; }

/* ---------- Carte d'adhérent ---------- */
.ezad-carte {
	position: relative; width: min(100%, 500px); aspect-ratio: 1586 / 1000; container-type: inline-size; perspective: 1400px;
	--ad-texte: var(--ez-blanc); --ad-accent: var(--ez-blanc); --ad-bord: var(--ez-turquoise); --ad-ligne: var(--ez-turquoise); --ad-holo: 0;
	transition: --ad-bord 700ms, --ad-accent 700ms, --ad-ligne 700ms, --ad-holo 700ms;
}
.ezad-carte__pivot, .ezad-carte__corps { position: absolute; inset: 0; transform-style: preserve-3d; }
.ezad-carte__pivot { will-change: transform; }
.ezad-carte__corps { transition: transform 900ms var(--ez-courbe); }
.ezad-carte.est-retournee .ezad-carte__corps { transform: rotateY(180deg); }
.ezad-carte__face {
	position: absolute; inset: 0; overflow: hidden; border-radius: 4.6cqw; color: var(--ad-texte);
	-webkit-backface-visibility: hidden; backface-visibility: hidden; background: rgba(30, 30, 62, 0.45);
	box-shadow: 0 0 0 1.5px var(--ad-bord), 0 0 3.6cqw -0.4cqw var(--ad-bord), 0 7cqw 10cqw -6cqw rgba(0, 0, 0, 0.9);
}
.ezad-carte:not(.a-formule) .ezad-carte__face { box-shadow: 0 7cqw 10cqw -6cqw rgba(0, 0, 0, 0.7); }
.ezad-carte__face--arriere { transform: rotateY(180deg); }

/* Fonds : chaque changement de formule pose un nouveau fond, révélé par un balayage (adhesion.js retire les anciens) */
.ezad-carte__fonds, .ezad-carte__fond { position: absolute; inset: 0; }
.ezad-carte__fond { background: var(--ez-encre) var(--ez-degrade-bicolore); }
.ezad-carte__fond.est-entrant { animation: ezad-balayage 700ms var(--ez-courbe) both; }
.ezad-carte__fond.est-entrant::after { content: ""; position: absolute; top: 0; bottom: 0; left: 0; width: 1cqw; background: var(--ez-blanc); box-shadow: 0 0 3cqw 1cqw var(--ez-turquoise); animation: ezad-balayage-trait 700ms var(--ez-courbe) both; }
@keyframes ezad-balayage { from { clip-path: inset(0 100% 0 0); } to { clip-path: inset(0 0 0 0); } }
@keyframes ezad-balayage-trait { from { transform: translateX(0); opacity: 1; } 85% { opacity: 1; } to { transform: translateX(100cqw); opacity: 0; } }
.ezad-carte__fond[data-f="simple"] { background: var(--ez-encre) var(--ez-degrade-bicolore); }
.ezad-carte__fond[data-f="soutien"] { background: var(--ez-violet); }
.ezad-carte__fond[data-f="bienfaiteur"] { background: var(--ez-violet) var(--ez-degrade-quadri); }
.ezad-carte__fond[data-f="mecene"] { background: var(--ez-corail); }
.ezad-carte__fond[data-f="protecteur"], .ezad-carte__fond[data-f="francais-difficulte"] { background: var(--ez-nuit); }
.ezad-carte__fond[data-f="couple"] { background: var(--ez-violet) var(--ez-degrade-bicolore); }
.ezad-carte__fond[data-f="jeune"] { background: var(--ez-encre); }

/* Couleurs et éclat holographique par formule : plus la formule est haute, plus la carte brille */
.ezad-carte[data-formule="simple"] { --ad-accent: var(--ez-turquoise); --ad-bord: var(--ez-turquoise); --ad-ligne: var(--ez-turquoise); --ad-holo: 0.14; }
.ezad-carte[data-formule="soutien"] { --ad-accent: var(--ez-corail); --ad-bord: var(--ez-corail); --ad-ligne: var(--ez-corail); --ad-holo: 0.22; }
.ezad-carte[data-formule="bienfaiteur"] { --ad-accent: var(--ez-blanc); --ad-bord: var(--ez-corail); --ad-ligne: var(--ez-blanc); --ad-holo: 0.38; }
.ezad-carte[data-formule="mecene"] { --ad-texte: var(--ez-encre); --ad-accent: var(--ez-encre); --ad-bord: var(--ez-turquoise); --ad-ligne: var(--ez-encre); --ad-holo: 0.5; }
.ezad-carte[data-formule="protecteur"] { --ad-accent: var(--ez-blanc); --ad-bord: var(--ez-turquoise); --ad-ligne: var(--ez-turquoise); --ad-holo: 0.72; }
.ezad-carte[data-formule="couple"] { --ad-accent: var(--ez-corail); --ad-bord: var(--ez-corail); --ad-ligne: var(--ez-corail); --ad-holo: 0.2; }
.ezad-carte[data-formule="jeune"] { --ad-accent: var(--ez-turquoise); --ad-bord: var(--ez-turquoise); --ad-ligne: var(--ez-turquoise); --ad-holo: 0.26; }
.ezad-carte[data-formule="francais-difficulte"] { --ad-accent: var(--ez-blanc); --ad-bord: var(--ez-blanc); --ad-ligne: var(--ez-blanc); --ad-holo: 0.12; }

.ezad-carte__horizon { position: absolute; inset: 0; width: 100%; height: 100%; opacity: 0.12; transition: opacity 700ms; }
.ezad-carte.a-formule .ezad-carte__horizon { opacity: 0.34; }
.ezad-carte__horizon .ezad-carte__astre { fill: var(--ez-corail); }
.ezad-carte__horizon .ezad-carte__lignes { fill: none; stroke: var(--ad-ligne); stroke-width: 4; }
/* Reflet holographique : bandes irisées et éclat, déplacés par adhesion.js selon l'inclinaison (transform seulement) */
.ezad-carte__holo, .ezad-carte__reflet { position: absolute; left: -50%; top: -50%; width: 200%; height: 200%; pointer-events: none; will-change: transform; }
.ezad-carte__holo {
	opacity: var(--ad-holo); mix-blend-mode: color-dodge;
	background: repeating-linear-gradient(115deg, rgba(69, 213, 222, 0) 0%, rgba(69, 213, 222, 0.85) 5%, rgba(238, 124, 111, 0.85) 10%, rgba(91, 62, 144, 0.85) 15%, rgba(255, 255, 255, 0.85) 18%, rgba(69, 213, 222, 0) 26%);
}
.ezad-carte__reflet { opacity: 0; background: radial-gradient(circle at 50% 50%, rgba(255, 255, 255, 0.3), rgba(255, 255, 255, 0) 30%); transition: opacity 700ms; }
.ezad-carte.a-formule .ezad-carte__reflet { opacity: 1; }

.ezad-carte__logo { position: absolute; left: 6.5%; top: 9%; width: 36%; height: auto; opacity: 0.4; transition: opacity 600ms 150ms; }
.ezad-carte__type { position: absolute; right: 6.5%; top: 9.6%; font-size: 2.3cqw; font-weight: 300; letter-spacing: 0.26em; text-transform: uppercase; opacity: 0.55; transition: opacity 600ms 150ms; }
.ezad-carte.a-formule .ezad-carte__logo, .ezad-carte.a-formule .ezad-carte__type { opacity: 1; }
.ezad-carte__formule {
	position: absolute; left: 6.5%; top: 26%; max-width: 62%; font-family: var(--ez-f-titre); font-size: 10cqw; line-height: 1;
	text-transform: uppercase; white-space: nowrap; color: var(--ad-accent); text-shadow: 0 0 2.2cqw var(--ad-bord);
	transform: rotate(var(--ez-inclinaison)); transform-origin: 0 100%; opacity: 0; transition: opacity 400ms;
}
.ezad-carte.a-formule .ezad-carte__formule { opacity: 1; }
.ezad-carte__sceau { position: absolute; right: 6.5%; top: 25%; display: grid; place-items: center; width: 15cqw; aspect-ratio: 1; border-radius: 50%; overflow: hidden; opacity: 0; transform: scale(0.3) rotate(-120deg); transition: opacity 500ms, transform 900ms cubic-bezier(0.2, 1.5, 0.4, 1); box-shadow: inset 0 0 0 0.5cqw rgba(255, 255, 255, 0.55), 0 0 2.4cqw rgba(69, 213, 222, 0.55); }
.ezad-carte__sceau::before { content: ""; position: absolute; inset: -20%; background: conic-gradient(var(--ez-turquoise), var(--ez-corail), var(--ez-violet), var(--ez-blanc), var(--ez-turquoise)); }
.ezad-js .ezad-carte.a-sceau .ezad-carte__sceau::before { animation: ezad-tourne 6s linear infinite; }
.ezad-carte__sceau img { position: relative; width: 58%; height: auto; }
.ezad-carte.a-sceau .ezad-carte__sceau { opacity: 1; transform: none; }
@keyframes ezad-tourne { to { transform: rotate(360deg); } }
.ezad-carte__etiquette { position: absolute; font-size: 1.9cqw; font-weight: 300; letter-spacing: 0.24em; text-transform: uppercase; opacity: 0; transition: opacity 500ms; }
.ezad-carte__etiquette--nom { left: 6.5%; bottom: 22%; }
.ezad-carte__etiquette--duree { right: 6.5%; bottom: 22%; }
.ezad-carte__nom { position: absolute; left: 6.5%; bottom: 10.5%; max-width: 64%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: 700; font-size: 5.2cqw; line-height: 1.1; letter-spacing: 0.06em; text-transform: uppercase; opacity: 0; transform: translateY(25%); transition: opacity 500ms, transform 600ms var(--ez-courbe); }
.ezad-carte__nom.est-vide { color: rgba(255, 255, 255, 0.45); }
.ezad-carte[data-formule="mecene"] .ezad-carte__nom.est-vide { color: rgba(43, 45, 109, 0.5); }
.ezad-carte__nom.est-grave { animation: ezad-grave 520ms ease-out; }
@keyframes ezad-grave { from { text-shadow: 0 0 1cqw var(--ez-turquoise), 0 0 3cqw var(--ez-turquoise); } to { text-shadow: 0 0 0 rgba(69, 213, 222, 0); } }
.ezad-carte__duree { position: absolute; right: 6.5%; bottom: 9.5%; font-family: var(--ez-f-titre); font-size: 6cqw; line-height: 1; text-transform: uppercase; color: var(--ad-accent); opacity: 0; transform: translateY(25%); transition: opacity 500ms, transform 600ms var(--ez-courbe); }
.ezad-carte.a-duree .ezad-carte__duree, .ezad-carte.a-duree .ezad-carte__etiquette--duree,
.ezad-carte.a-nom .ezad-carte__nom, .ezad-carte.a-nom .ezad-carte__etiquette--nom { opacity: 1; transform: none; }

/* Dos : bande, récapitulatif, signature */
.ezad-carte__bande { position: absolute; left: 0; right: 0; top: 9%; height: 15%; background: var(--ez-nuit); }
.ezad-carte__face--arriere .ezad-carte__holo { opacity: calc(var(--ad-holo) * 0.6); }
.ezad-carte__recap { position: absolute; left: 6.5%; right: 6.5%; top: 31%; display: grid; grid-template-columns: 1fr 1fr; gap: 2.4cqw 4cqw; margin: 0; }
.ezad-carte__recap dt { font-size: 1.9cqw; font-weight: 300; letter-spacing: 0.2em; text-transform: uppercase; opacity: 0.8; }
.ezad-carte__recap dd { margin: 0.4cqw 0 0; font-family: var(--ez-f-titre); font-size: 4.4cqw; line-height: 1; text-transform: uppercase; color: var(--ad-accent); white-space: nowrap; }
.ezad-carte__signature { position: absolute; left: 6.5%; right: 30%; bottom: 13%; height: 13%; display: flex; align-items: center; padding: 0 3cqw; background: rgba(255, 255, 255, 0.92); color: var(--ez-encre); font-family: var(--ez-f-signature); font-size: 5.6cqw; line-height: 1; white-space: nowrap; overflow: hidden; }
.ezad-carte__adresse { position: absolute; left: 6.5%; bottom: 5%; font-size: 1.7cqw; letter-spacing: 0.08em; opacity: 0.75; }

/* Tracé néon de l'arrivée : la carte se dessine avant d'exister */
.ezad-carte__trace { position: absolute; inset: 0; z-index: 1; width: 100%; height: 100%; overflow: visible; pointer-events: none; transition: opacity 900ms 200ms; }
.ezad-carte__trace rect { fill: none; stroke: var(--ez-turquoise); stroke-dasharray: 1; stroke-dashoffset: 0; }
.ezad-carte__trace-ligne { stroke-width: 6; }
.ezad-carte__trace-halo { stroke-width: 26; opacity: 0.28; }
.ezad-js .ezad-carte__trace rect { stroke-dashoffset: 1; animation: ezad-trace 1800ms var(--ez-courbe) 300ms forwards; }
@keyframes ezad-trace { to { stroke-dashoffset: 0; } }
.ezad-carte.a-formule .ezad-carte__trace { opacity: 0; }
.ezad-carte__ombre { position: absolute; left: 10%; right: 10%; top: 106%; height: 18%; border-radius: 50%; background: radial-gradient(closest-side, var(--ad-bord), rgba(69, 213, 222, 0)); opacity: 0.32; pointer-events: none; }
@media (max-width: 959px) { .ezad-carte__ombre { display: none; } }

/* ---------- Compteurs (tableau de bord) ---------- */
.ezad-tableau { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; width: min(100%, 500px); }
.ezad-cadran { display: flex; flex-direction: column; gap: 3px; min-width: 0; padding: 10px 14px 8px; background: rgba(30, 30, 62, 0.85); border: 1px solid rgba(69, 213, 222, 0.35); border-radius: var(--ez-rayon); box-shadow: inset 0 0 18px rgba(69, 213, 222, 0.1); }
.ezad-cadran__nom { font-size: 0.66rem; font-weight: 300; letter-spacing: 0.22em; text-transform: uppercase; opacity: 0.8; }
.ezad-cadran__note { font-size: 0.7rem; line-height: 1.3; opacity: 0.7; }
.ezad-odo { display: inline-flex; overflow: hidden; font-family: var(--ez-f-titre); font-size: clamp(1.45rem, 3vw, 2.3rem); line-height: 1; white-space: nowrap; color: var(--ez-turquoise); text-shadow: 0 0 12px rgba(69, 213, 222, 0.55); }
.ezad-cadran--reel .ezad-odo { color: var(--ez-corail); text-shadow: 0 0 12px rgba(238, 124, 111, 0.5); }
.ezad-odo__c { display: inline-block; height: 1em; overflow: hidden; }
.ezad-odo__b { display: block; white-space: pre; text-align: center; transform: translateY(calc(var(--d, 0) * -1em)); transition: transform 1000ms cubic-bezier(0.2, 0.9, 0.25, 1); transition-delay: calc(var(--i, 0) * 70ms); }
.ezad-odo__s { white-space: pre; }
@media (max-width: 959px) {
	.ezad-tableau { grid-template-columns: minmax(0, 1fr); gap: 6px; }
	.ezad-cadran { padding: 7px 10px 6px; }
	.ezad-cadran__note { display: none; }
	.ezad-odo { font-size: clamp(1.3rem, 6.4vw, 1.9rem); }
}

/* ---------- Panneau : textes communs ---------- */
html:not(.ezad-js) .ezad-etape[data-etape="depart"] { display: none; }
.ezad-etape[hidden] { display: none; }
.ezad-js .ezad-etape { animation: ezad-entree 550ms var(--ez-courbe) both; }
@keyframes ezad-entree { from { opacity: 0; transform: translateY(18px); } to { opacity: 1; transform: none; } }
.ezad-surtitre { display: flex; align-items: center; gap: var(--ez-e3); margin: 0 0 var(--ez-e3); font-size: 0.8rem; font-weight: 300; letter-spacing: 0.22em; text-transform: uppercase; }
.ezad-surtitre::after { content: ""; width: 48px; height: 6px; background: var(--ez-corail); }
.ezad-titre { margin: 0 0 var(--ez-e4); font-family: var(--ez-f-titre); font-size: clamp(2.4rem, 7vw, 4rem); font-weight: 400; line-height: 0.95; text-transform: uppercase; outline: none; }
.ezad-titre--etape { display: flex; align-items: center; gap: var(--ez-e3); font-size: clamp(1.7rem, 4.4vw, 2.4rem); }
.ezad-num { display: inline-grid; flex: none; place-items: center; width: 1.2em; height: 1.2em; padding-top: 0.08em; font-size: 0.8em; background: var(--ez-corail); color: var(--ez-nuit); transform: rotate(var(--ez-inclinaison)); }
.ezad-chapo { margin: 0 0 var(--ez-e2); font-size: 1.15rem; font-weight: 700; line-height: 1.45; }
.ezad-texte { margin: 0 0 var(--ez-e5); }
.ezad-texte--grand { font-size: 1.15rem; line-height: 1.5; }
.ezad-note { margin: var(--ez-e4) 0 0; font-size: 0.85rem; opacity: 0.8; }
.ezad-actions { display: flex; flex-wrap: wrap; gap: var(--ez-e3); margin-top: var(--ez-e5); }
.ezad-actions .ez-bouton { white-space: normal; text-align: center; }
.ezad-actions .ez-bouton--large { flex: 1 1 auto; }
.ezad-actions--colonne { flex-direction: column; }
.ezad-bouton-deux { flex-direction: column; gap: 6px; }
.ezad-bouton-deux small { font-family: var(--ez-f-texte); font-size: 0.85rem; text-transform: none; letter-spacing: 0; }
.ezad-retour { display: inline-flex; align-items: center; gap: 8px; margin: -6px 0 var(--ez-e3); padding: 8px 0; border: 0; background: none; color: inherit; font: inherit; font-size: 0.78rem; letter-spacing: 0.18em; text-transform: uppercase; opacity: 0.8; cursor: pointer; }
.ezad-retour::before { content: ""; width: 14px; height: 10px; background: currentColor; clip-path: polygon(0 50%, 45% 0, 45% 35%, 100% 35%, 100% 65%, 45% 65%, 45% 100%); }
.ezad-retour:hover { opacity: 1; color: var(--ez-corail); }

/* ---------- Borne de sélection des formules ---------- */
.ezad-borne { min-width: 0; margin: 0 0 var(--ez-e5); padding: 0; border: 0; }
.ezad-borne__titre { display: flex; align-items: center; gap: var(--ez-e3); margin-bottom: var(--ez-e3); padding: 0; font-size: 0.8rem; font-weight: 300; letter-spacing: 0.2em; text-transform: uppercase; }
.ezad-borne__titre::after { content: ""; width: 36px; height: 4px; background: var(--ez-corail); }
.ezad-borne__liste { position: relative; display: grid; gap: 8px; padding: 10px; background: var(--ez-nuit); border: 2px solid var(--ez-encre); border-radius: var(--ez-rayon); box-shadow: inset 0 0 0 1px rgba(69, 213, 222, 0.16), inset 0 0 40px rgba(43, 45, 109, 0.9); }
/* Lignes de balayage d'écran d'arcade (calque fixe) */
.ezad-borne__liste::after { content: ""; position: absolute; inset: 0; pointer-events: none; background: repeating-linear-gradient(180deg, rgba(255, 255, 255, 0.035) 0 1px, rgba(255, 255, 255, 0) 1px 3px); }
.ezad-formule {
	position: relative; display: grid; grid-template-columns: 14px minmax(0, 1fr) auto; grid-template-areas: "c nom prix" ". jauge jauge" ". texte texte";
	column-gap: 12px; align-items: center; padding: 12px 14px 12px 10px; border: 2px solid transparent; border-radius: var(--ez-rayon);
	background: rgba(43, 45, 109, 0.5); cursor: pointer; transition: background-color 200ms, border-color 200ms, box-shadow 200ms;
}
.ezad-formule:hover { border-color: rgba(69, 213, 222, 0.45); }
.ezad-formule.est-choisi { background: linear-gradient(90deg, rgba(91, 62, 144, 0.95), rgba(43, 45, 109, 0.95)); border-color: var(--ez-turquoise); box-shadow: 0 0 22px -6px var(--ez-turquoise), inset 0 0 18px -8px var(--ez-turquoise); }
.ezad-formule:focus-within { outline: 3px solid var(--ez-blanc); outline-offset: 2px; }
.ezad-formule:focus-within:not(:has(:focus-visible)) { outline: none; }
.ezad-formule__radio, .ezad-vitesse__radio, .ezad-moyen__radio { position: absolute; width: 1px; height: 1px; margin: 0; opacity: 0; pointer-events: none; }
.ezad-formule__curseur { grid-area: c; width: 12px; height: 14px; background: var(--ez-corail); clip-path: polygon(0 0, 100% 50%, 0 100%); opacity: 0; }
.ezad-formule.est-choisi .ezad-formule__curseur { opacity: 1; }
.ezad-js .ezad-formule.est-choisi .ezad-formule__curseur { animation: ezad-clignote 900ms steps(1) infinite; }
@keyframes ezad-clignote { 50% { opacity: 0; } }
.ezad-formule__nom { grid-area: nom; min-width: 0; font-family: var(--ez-f-titre); font-size: 1.4rem; line-height: 1.05; text-transform: uppercase; }
.ezad-formule__prix { grid-area: prix; font-family: var(--ez-f-titre); font-size: 1.4rem; line-height: 1.05; color: var(--ez-turquoise); white-space: nowrap; text-align: right; }
.ezad-formule__prix small { font-family: var(--ez-f-texte); font-size: 0.7rem; letter-spacing: 0.08em; text-transform: uppercase; color: var(--ez-blanc); opacity: 0.75; }
.ezad-formule__jauge { grid-area: jauge; display: flex; gap: 3px; margin-top: 7px; }
.ezad-formule__jauge i { width: 20px; height: 6px; background: rgba(255, 255, 255, 0.14); }
.ezad-formule__jauge i.est-plein { background: var(--ez-corail); }
.ezad-formule.est-choisi .ezad-formule__jauge i.est-plein { background: var(--ez-turquoise); box-shadow: 0 0 6px var(--ez-turquoise); }
.ezad-formule__texte { grid-area: texte; display: none; margin-top: 8px; font-size: 0.9rem; line-height: 1.45; }
.ezad-formule.est-choisi .ezad-formule__texte { display: block; }
.ezad-formule__badge { position: absolute; top: -10px; left: 30px; padding: 3px 8px 1px; background: var(--ez-corail); color: var(--ez-nuit); font-family: var(--ez-f-titre); font-size: 0.78rem; text-transform: uppercase; transform: rotate(var(--ez-inclinaison)); }
.ezad-formule.est-flash::before { content: ""; position: absolute; inset: 0; z-index: 1; border-radius: inherit; background: var(--ez-blanc); pointer-events: none; animation: ezad-flash 300ms ease-out both; }
@keyframes ezad-flash { from { opacity: 0.5; } to { opacity: 0; } }

/* ---------- Boîte de vitesses (durée) ---------- */
.ezad-boite { position: relative; isolation: isolate; width: min(100%, 360px); aspect-ratio: 3 / 2; min-width: 0; margin: 34px auto 30px; padding: 0; border: 0; }
.ezad-boite::before { content: ""; position: absolute; z-index: -1; inset: -12% -6%; border: 1px solid rgba(255, 255, 255, 0.08); border-radius: 18px; background: radial-gradient(ellipse at 50% 35%, var(--ez-encre), var(--ez-nuit) 75%); box-shadow: inset 0 2px 0 rgba(255, 255, 255, 0.07), inset 0 -14px 30px rgba(0, 0, 0, 0.45); }
.ezad-boite__grille { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; }
.ezad-boite__fente { fill: none; stroke: var(--ez-nuit); stroke-width: 24; stroke-linecap: round; }
.ezad-boite__neon { fill: none; stroke: var(--ez-corail); stroke-width: 2.5; stroke-linecap: round; opacity: 0.85; }
.ezad-boite__grille text { fill: rgba(255, 255, 255, 0.35); font-family: var(--ez-f-titre); font-size: 18px; }
.ezad-vitesse { position: absolute; left: calc(var(--x) / 6 * 100%); top: calc(15% + var(--y) * 35%); display: grid; place-items: center; width: 64px; height: 64px; margin: -32px 0 0 -32px; cursor: pointer; }
.ezad-vitesse__num { display: grid; place-items: center; width: 42px; height: 42px; padding-top: 3px; border: 2px solid rgba(238, 124, 111, 0.65); border-radius: 50%; background: var(--ez-encre); font-family: var(--ez-f-titre); font-size: 1.4rem; line-height: 1; transition: background-color 200ms, border-color 200ms; }
.ezad-vitesse:hover .ezad-vitesse__num { border-color: var(--ez-turquoise); }
.ezad-vitesse__nom { position: absolute; left: 50%; white-space: nowrap; font-size: 0.74rem; letter-spacing: 0.14em; text-transform: uppercase; transform: translateX(-50%); opacity: 0.85; }
.ezad-vitesse--haut .ezad-vitesse__nom { bottom: 100%; }
.ezad-vitesse--bas .ezad-vitesse__nom { top: 100%; }
.ezad-vitesse.est-choisi .ezad-vitesse__nom { color: var(--ez-turquoise); opacity: 1; }
.ezad-vitesse:focus-within .ezad-vitesse__num { outline: 3px solid var(--ez-blanc); outline-offset: 4px; }
.ezad-vitesse:focus-within:not(:has(:focus-visible)) .ezad-vitesse__num { outline: none; }
/* Pommeau : il glisse dans la grille en H, en passant par le point mort (adhesion.js) */
.ezad-boite__pommeau { position: absolute; z-index: 2; left: 0; top: 0; display: grid; place-items: center; width: 54px; height: 54px; margin: -27px 0 0 -27px; border-radius: 50%; pointer-events: none; will-change: transform; background: radial-gradient(circle at 34% 30%, var(--ez-blanc) 0 5%, var(--ez-corail) 32%, var(--ez-violet) 78%, var(--ez-encre)); box-shadow: 0 10px 18px rgba(0, 0, 0, 0.55), 0 0 24px rgba(238, 124, 111, 0.5); }
.ezad-boite__pommeau span { padding-top: 3px; font-family: var(--ez-f-titre); font-size: 1.55rem; line-height: 1; color: var(--ez-blanc); text-shadow: 0 1px 2px rgba(30, 30, 62, 0.8); }
.ezad-boite__choix { min-height: 1.6em; margin: 0; text-align: center; font-family: var(--ez-f-titre); font-size: 1.3rem; text-transform: uppercase; color: var(--ez-turquoise); }

/* ---------- Moyens de paiement ---------- */
.ezad-moyens { display: grid; gap: 10px; min-width: 0; margin: 0; padding: 0; border: 0; }
.ezad-moyen { position: relative; display: grid; grid-template-columns: 42px minmax(0, 1fr); grid-template-areas: "i nom" "i aide"; align-items: center; column-gap: 14px; padding: 16px 18px; border: 2px solid rgba(255, 255, 255, 0.2); border-radius: var(--ez-rayon); background: rgba(43, 45, 109, 0.5); cursor: pointer; transition: border-color 200ms, background-color 200ms, box-shadow 200ms; }
.ezad-moyen:hover { border-color: rgba(69, 213, 222, 0.5); }
.ezad-moyen.est-choisi { border-color: var(--ez-turquoise); background: rgba(91, 62, 144, 0.65); box-shadow: 0 0 20px -6px var(--ez-turquoise); }
.ezad-moyen:focus-within { outline: 3px solid var(--ez-blanc); outline-offset: 2px; }
.ezad-moyen:focus-within:not(:has(:focus-visible)) { outline: none; }
.ezad-moyen__icone { grid-area: i; width: 40px; height: auto; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.ezad-moyen__nom { grid-area: nom; font-family: var(--ez-f-titre); font-size: 1.2rem; line-height: 1.05; text-transform: uppercase; }
.ezad-moyen__aide { grid-area: aide; font-size: 0.85rem; opacity: 0.8; }
.ezad-moyen:not(.ezad-moyen--cb) { grid-template-areas: "i nom"; }
.ezad-autres { padding: 12px; border: 1px dashed rgba(255, 255, 255, 0.35); border-radius: var(--ez-rayon); background: none; color: inherit; font: inherit; font-size: 0.8rem; letter-spacing: 0.14em; text-transform: uppercase; cursor: pointer; }
.ezad-autres:hover { border-color: var(--ez-turquoise); }
.ezad-autres[aria-expanded="true"] { display: none; }
.ezad-autres-moyens { display: grid; gap: 10px; }
.ezad-autres-moyens[hidden] { display: none; }
@media (min-width: 480px) { .ezad-autres-moyens { grid-template-columns: 1fr 1fr; } }
.ezad-securise { display: flex; gap: 10px; margin: var(--ez-e4) 0 0; font-size: 0.85rem; opacity: 0.85; }
.ezad-securise svg { flex: none; width: 12px; height: 16px; margin-top: 3px; fill: var(--ez-corail); }

/* ---------- Coordonnées ---------- */
.ezad-aide-champs { margin: 0 0 var(--ez-e4); font-size: 0.85rem; opacity: 0.8; }
.ezad-ligne { display: grid; gap: 0 14px; }
@media (min-width: 560px) { .ezad-ligne { grid-template-columns: 1fr 1fr; } .ezad-ligne--cp { grid-template-columns: 1fr 2fr; } }
.ezad-formulaire .ez-champ label { line-height: 1.4; }
.ezad-formulaire select.ez-saisie { padding-right: 12px; }
.ezad-formulaire .ez-erreur { margin: 0; }
.ezad-formulaire .ez-aide { margin: 0; }
.ezad-case { text-transform: none; letter-spacing: 0; font-weight: 400; cursor: pointer; }
.ezad-formulaire .ez-champ .ezad-case { font-size: 0.82rem; text-transform: none; letter-spacing: 0; font-weight: 400; }
.ezad-erreurs { margin: 0 0 var(--ez-e4); padding: 12px 16px; border: 2px solid var(--ez-corail); background: rgba(238, 124, 111, 0.12); outline: none; }
.ezad-erreurs p { margin: 0; font-weight: 700; }
.ezad-erreurs ul { margin: 6px 0 0; padding-left: 20px; }
.ezad-erreurs a { color: inherit; }
.ezad-mentions { margin-top: var(--ez-e6); padding-top: var(--ez-e5); border-top: 1px solid rgba(255, 255, 255, 0.15); font-size: 0.85rem; }
.ezad-mentions h3 { margin: 0 0 var(--ez-e2); font-family: var(--ez-f-titre); font-size: 1.1rem; font-weight: 400; text-transform: uppercase; color: var(--ez-corail); }
.ezad-mentions p { margin: 0 0 0.8em; }
.ezad-mentions__petit { font-size: 0.7rem; line-height: 1.5; opacity: 0.75; }

/* ---------- Récapitulatif et fin ---------- */
.ezad-recap { display: grid; margin: 0; border-top: 1px solid rgba(255, 255, 255, 0.16); }
.ezad-recap > div { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.3fr); gap: 12px; padding: 10px 0; border-bottom: 1px solid rgba(255, 255, 255, 0.16); }
.ezad-recap dt { font-size: 0.78rem; letter-spacing: 0.1em; text-transform: uppercase; opacity: 0.78; }
.ezad-recap dd { margin: 0; font-weight: 700; overflow-wrap: anywhere; }
.ezad-alerte { margin-top: var(--ez-e4); padding: 12px 16px; border: 2px solid var(--ez-corail); background: rgba(238, 124, 111, 0.14); font-weight: 700; }
.ezad-valider[aria-busy="true"] { opacity: 0.75; pointer-events: none; }
.ezad-valider[aria-busy="true"]::after { content: ""; width: 18px; height: 18px; margin-left: 10px; border: 3px solid currentColor; border-right-color: transparent; border-radius: 50%; animation: ezad-tourne 800ms linear infinite; }
.ezad-coordonnees { margin: var(--ez-e4) 0; padding: 16px 18px; border: 1px solid rgba(69, 213, 222, 0.45); }
.ezad-coordonnees p { margin: 0 0 0.8em; }
.ezad-coordonnees__fort { font-weight: 700; }
.ezad-coordonnees dl { margin: 0; }
.ezad-coordonnees dt { font-size: 0.78rem; letter-spacing: 0.1em; text-transform: uppercase; opacity: 0.78; }
.ezad-coordonnees dd { margin: 0 0 10px; font-weight: 700; overflow-wrap: anywhere; }
.ezad-reference { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; font-family: var(--ez-f-titre); font-size: 1.8rem; line-height: 1; color: var(--ez-turquoise); }
.ezad-copier { padding: 6px 10px 5px; border: 1px solid currentColor; border-radius: var(--ez-rayon); background: none; color: var(--ez-blanc); font: inherit; font-family: var(--ez-f-texte); font-size: 0.72rem; letter-spacing: 0.12em; text-transform: uppercase; cursor: pointer; }
.ezad-copier:hover { color: var(--ez-turquoise); }

/* ---------- Enseigne néon (merci) : chaque lettre s'allume comme un tube ---------- */
.ezad-neon { display: grid; gap: 6px; margin: 4px 0 var(--ez-e5); font-family: var(--ez-f-titre); line-height: 0.95; text-transform: uppercase; transform: rotate(var(--ez-inclinaison)); transform-origin: 0 100%; }
.ezad-neon__ligne { display: block; font-size: clamp(2.6rem, 10vw, 4.2rem); color: var(--ez-blanc); text-shadow: 0 0 3px var(--ez-blanc), 0 0 12px var(--ez-corail), 0 0 28px var(--ez-corail), 0 0 50px var(--ez-corail); }
.ezad-neon__ligne + .ezad-neon__ligne { font-size: clamp(1.9rem, 7.2vw, 3rem); }
.ezad-neon__ligne--turquoise { text-shadow: 0 0 3px var(--ez-blanc), 0 0 12px var(--ez-turquoise), 0 0 28px var(--ez-turquoise), 0 0 50px var(--ez-turquoise); }
.ezad-neon__mot { display: inline-block; white-space: nowrap; }
.ezad-neon__l { display: inline-block; white-space: pre; opacity: 0.14; }
.ezad-neon.est-allume .ezad-neon__l { animation: ezad-allume 1100ms linear var(--delai, 0ms) both; }
@keyframes ezad-allume { 0% { opacity: 0.14; } 8% { opacity: 1; } 14% { opacity: 0.25; } 22% { opacity: 1; } 30% { opacity: 0.4; } 38%, 100% { opacity: 1; } }

/* ---------- Départ vers la banque ---------- */
.ezad-depart { position: fixed; z-index: 10; inset: 0; display: grid; place-items: end center; padding: 0 var(--ez-gouttiere) 12vh; pointer-events: none; }
.ezad-depart[hidden] { display: none; }
.ezad-depart__texte { margin: 0; padding: 12px 18px 9px; background: rgba(30, 30, 62, 0.85); border: 1px solid rgba(69, 213, 222, 0.45); font-family: var(--ez-f-titre); font-size: clamp(1.1rem, 3vw, 1.5rem); text-align: center; text-transform: uppercase; color: var(--ez-turquoise); text-shadow: 0 0 12px rgba(69, 213, 222, 0.6); animation: ezad-entree 500ms var(--ez-courbe) 500ms both; }
.ezad-depart__points::after { content: "…"; }

/* ---------- Mouvement réduit : état final, rien ne bouge ---------- */
@media (prefers-reduced-motion: reduce) {
	.ezad *, .ezad *::before, .ezad *::after { animation: none !important; transition: none !important; }
	.ezad-js .ezad-carte__trace rect { stroke-dashoffset: 0; }
	.ezad-neon__l { opacity: 1; }
}