:root{
  --noir:#0a0a0a;
  --blanc:#ffffff;
  --gris:#67738b;        /* gris du blazer */
  --gris-fonce:#484f66;  /* ombre du blazer */
  --gris-clair:#838fa9;  /* lumière du blazer */
  --voile:#f1f2f5;       /* gris très léger pour les sections */
  --texte:#1b1d22;
  --texte-doux:#5a6070;
  --ligne:#dcdfe6;
  --r:14px;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:'Inter',system-ui,sans-serif;color:var(--texte);background:var(--blanc);line-height:1.6;font-size:17px;-webkit-font-smoothing:antialiased}
img{max-width:100%;display:block}
a{color:inherit}
.wrap{max-width:1120px;margin:0 auto;padding:0 20px}
.serif{font-family:'Marcellus',Georgia,serif;font-weight:400}
h1,h2,h3{line-height:1.12;color:var(--noir)}
h1{font-size:clamp(34px,5.4vw,60px);font-weight:800;letter-spacing:-.02em}
h2{font-size:clamp(28px,3.8vw,44px);font-weight:800;letter-spacing:-.015em}
h3{font-size:20px;font-weight:700}
.surligne{background:linear-gradient(transparent 62%,rgba(103,115,139,.32) 62%)}
.eyebrow{display:inline-flex;align-items:center;gap:10px;font-size:13px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--gris-fonce)}
.eyebrow::before{content:"";width:28px;height:2px;background:var(--gris)}
.lead{font-size:clamp(18px,2vw,21px);color:var(--texte-doux);max-width:640px}

/* barre haute */
.top{position:sticky;top:0;z-index:20;background:rgba(255,255,255,.94);backdrop-filter:blur(8px);border-bottom:1px solid var(--ligne)}
.top .wrap{display:flex;align-items:center;justify-content:space-between;height:68px}
.top img{height:42px;width:auto}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;background:var(--noir);color:var(--blanc);text-decoration:none;font-weight:700;border:0;border-radius:999px;padding:16px 28px;font-size:16px;cursor:pointer;transition:transform .15s,background .15s;font-family:inherit;text-align:center}
.btn:hover{background:var(--gris-fonce);transform:translateY(-1px)}
.btn.sm{padding:10px 18px;font-size:14px}
.btn.gris{background:var(--gris)}
.btn.gris:hover{background:var(--gris-fonce)}
.btn.contour{background:transparent;color:var(--noir);border:2px solid var(--noir)}
.btn.contour:hover{background:var(--noir);color:var(--blanc)}
.btn.blanc{background:var(--blanc);color:var(--noir)}
.btn.blanc:hover{background:var(--voile)}

/* héros */
.hero{padding:56px 0 72px;background:linear-gradient(180deg,var(--blanc) 0%,var(--voile) 100%)}
.hero .grille{display:grid;grid-template-columns:1.15fr .85fr;gap:56px;align-items:start}
.hero h1{margin:18px 0 20px}
.hero .lead{margin-bottom:28px}
.photo-hero{position:relative;border-radius:22px;overflow:hidden;background:#ebebeb;aspect-ratio:4/5}
.photo-hero img{width:100%;height:100%;object-fit:cover;object-position:top}
.badge{position:absolute;left:16px;right:16px;bottom:16px;background:var(--noir);color:var(--blanc);border-radius:14px;padding:16px 18px;display:flex;gap:14px;align-items:center}
.badge b{font-size:34px;line-height:1;font-weight:800}
.badge span{font-size:14px;line-height:1.35;color:#d8dbe3}

/* formulaire */
.carte-form{background:var(--blanc);border:1px solid var(--ligne);border-radius:20px;padding:26px;box-shadow:0 18px 50px -24px rgba(72,79,102,.45)}
.carte-form h3{font-size:19px;margin-bottom:4px}
.carte-form p.petit{font-size:14px;color:var(--texte-doux);margin-bottom:18px}
.champ{margin-bottom:12px}
.champ label{display:block;font-size:13px;font-weight:600;margin-bottom:6px;color:var(--gris-fonce)}
.champ input{width:100%;font:inherit;font-size:16px;padding:13px 14px;border:1.5px solid var(--ligne);border-radius:10px;background:var(--blanc);color:var(--texte)}
.champ input:focus{outline:none;border-color:var(--gris)}
.deux{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.coche{display:flex;gap:10px;align-items:flex-start;font-size:14px;line-height:1.45;margin:10px 0;cursor:pointer}
.coche input{margin-top:3px;width:18px;height:18px;accent-color:var(--noir);flex:none}
.coche.remise{background:var(--voile);border:1.5px dashed var(--gris);border-radius:10px;padding:12px}
.carte-form .btn{width:100%;margin-top:8px;padding:18px}
.rassure{display:flex;flex-wrap:wrap;gap:6px 16px;font-size:13px;color:var(--texte-doux);margin-top:12px;justify-content:center}
.cache{position:absolute;left:-9999px}

/* sections */
section{padding:84px 0}
.voile{background:var(--voile)}
.noir{background:var(--noir);color:#e6e8ee}
.noir h2,.noir h3{color:var(--blanc)}
.noir .eyebrow{color:var(--gris-clair)}
.noir .eyebrow::before{background:var(--gris-clair)}
.tete{max-width:760px;margin-bottom:44px}
.tete h2{margin:14px 0 14px}
.centre{text-align:center;margin-left:auto;margin-right:auto}
.centre .eyebrow{justify-content:center}

/* financeurs */
.financeurs{padding:44px 0;border-bottom:1px solid var(--ligne)}
.financeurs p{text-align:center;font-size:14px;font-weight:600;color:var(--texte-doux);margin-bottom:22px;letter-spacing:.02em}
.logos{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:22px 44px}
.logos img{height:58px;width:auto;object-fit:contain}

/* chiffres V10 */
.chiffres{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-bottom:40px}
.chiffre{border:1px solid #2a2d35;border-radius:var(--r);padding:26px}
.chiffre b{display:block;font-size:46px;font-weight:800;color:var(--blanc);line-height:1}
.chiffre span{display:block;margin-top:10px;font-size:15px;color:#b9bdc8}
.indics{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}
.indic{background:#15171c;border:1px solid #2a2d35;border-radius:var(--r);padding:20px 22px;display:flex;gap:16px}
.indic .num{flex:none;width:52px;height:52px;border-radius:12px;background:var(--gris);color:var(--blanc);display:flex;align-items:center;justify-content:center;font-weight:800;font-size:15px;text-align:center;line-height:1.1}
.indic h3{font-size:17px;margin-bottom:4px}
.indic p{font-size:15px;color:#b9bdc8}
.source{font-size:13px;color:#8a8f9c;margin-top:22px}

/* enjeu */
.enjeu{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.colonne{border-radius:18px;padding:30px}
.colonne.mal{background:var(--blanc);border:1px solid var(--ligne)}
.colonne.bien{background:var(--noir);color:#e6e8ee}
.colonne.bien h3{color:var(--blanc)}
.colonne h3{margin-bottom:16px;font-size:21px}
.colonne ul{list-style:none;display:grid;gap:12px}
.colonne li{display:flex;gap:12px;font-size:16px}
.colonne li::before{flex:none;width:24px;height:24px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:800;margin-top:1px}
.colonne.mal li::before{content:"✕";background:var(--voile);color:var(--gris-fonce)}
.colonne.bien li::before{content:"✓";background:var(--gris);color:var(--blanc)}

/* pile de valeur */
.pile{display:grid;gap:14px;max-width:860px;margin:0 auto}
.element{display:grid;grid-template-columns:64px 1fr;gap:20px;align-items:start;background:var(--blanc);border:1px solid var(--ligne);border-radius:18px;padding:24px 26px}
.element .ico{width:64px;height:64px;border-radius:16px;background:var(--noir);color:var(--blanc);display:flex;align-items:center;justify-content:center}
.element .ico svg{width:30px;height:30px}
.element h3{margin-bottom:6px}
.element p{color:var(--texte-doux);font-size:16px}
.element.bonus{border:2px solid var(--gris);background:linear-gradient(135deg,var(--blanc),var(--voile))}
.element.bonus .ico{background:var(--gris);font-weight:800;font-size:20px}
.etiquette{display:inline-block;font-size:12px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;background:var(--gris);color:var(--blanc);border-radius:6px;padding:3px 8px;margin-bottom:8px}
.cta-centre{text-align:center;margin-top:36px}
.cta-centre small{display:block;margin-top:10px;font-size:13px;color:var(--texte-doux)}

/* étapes */
.etapes{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;counter-reset:e}
.etape{border:1px solid var(--ligne);border-radius:18px;padding:28px;position:relative;background:var(--blanc)}
.etape .quand{font-size:13px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--gris)}
.etape h3{margin:10px 0 8px}
.etape p{color:var(--texte-doux);font-size:16px}
.etape::before{counter-increment:e;content:counter(e);position:absolute;top:-16px;left:24px;width:34px;height:34px;border-radius:50%;background:var(--noir);color:var(--blanc);font-weight:800;display:flex;align-items:center;justify-content:center}

/* à propos */
.apropos{display:grid;grid-template-columns:.9fr 1.1fr;gap:56px;align-items:center}
.apropos .photo{border-radius:22px;overflow:hidden}
.apropos h2{margin:14px 0 18px}
.apropos p{margin-bottom:14px;color:var(--texte-doux)}
.apropos p strong{color:var(--texte)}
.preuves{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:24px 0}
.preuves div{background:var(--voile);border-radius:12px;padding:16px}
.preuves b{display:block;font-size:28px;font-weight:800;color:var(--noir);line-height:1}
.preuves span{font-size:13px;color:var(--texte-doux)}
.boutons{display:flex;flex-wrap:wrap;gap:12px}

/* rendez-vous */
.rdv{background:var(--gris);color:var(--blanc);border-radius:24px;padding:48px;display:grid;grid-template-columns:1.4fr .6fr;gap:30px;align-items:center}
.rdv h2{color:var(--blanc);font-size:clamp(26px,3.2vw,38px);margin-bottom:12px}
.rdv p{color:#eef0f5}
.rdv .btn{justify-self:end}

/* FAQ */
.faq{max-width:820px;margin:0 auto}
.faq details{border-bottom:1px solid var(--ligne);padding:20px 0}
.faq summary{cursor:pointer;font-weight:700;font-size:18px;list-style:none;display:flex;justify-content:space-between;gap:16px;color:var(--noir)}
.faq summary::after{content:"+";font-size:24px;line-height:1;color:var(--gris)}
.faq details[open] summary::after{content:"–"}
.faq details p{margin-top:12px;color:var(--texte-doux)}

/* final */
.final{text-align:center}
.final h2{max-width:780px;margin:14px auto 16px}
.final .lead{margin:0 auto 30px;color:#b9bdc8}

/* pied */
footer{background:var(--noir);color:#9aa0ad;padding:56px 0 34px;font-size:14px;border-top:1px solid #22252c}
footer .haut{display:flex;flex-wrap:wrap;justify-content:space-between;gap:30px;align-items:flex-start}
footer img{height:64px;width:auto}
.reseaux{display:flex;flex-wrap:wrap;gap:10px}
.reseaux a{display:inline-flex;align-items:center;gap:8px;text-decoration:none;color:var(--blanc);border:1px solid #333743;border-radius:999px;padding:9px 16px;font-weight:600;font-size:14px}
.reseaux a:hover{background:var(--gris)}
.reseaux svg{width:16px;height:16px}
footer .bas{margin-top:34px;padding-top:22px;border-top:1px solid #22252c;display:flex;flex-wrap:wrap;gap:10px 24px;justify-content:space-between}
footer a{color:#c9ccd5}

/* pages merci / avant-première */
.simple{padding:70px 0 90px;text-align:center}
.simple .coche-ok{width:76px;height:76px;border-radius:50%;background:var(--noir);color:var(--blanc);display:flex;align-items:center;justify-content:center;margin:0 auto 24px;font-size:36px}
.simple h1{font-size:clamp(32px,4.6vw,52px);margin-bottom:16px}
.simple .lead{margin:0 auto 34px}
.liste-suite{max-width:620px;margin:0 auto 40px;text-align:left;display:grid;gap:12px}
.liste-suite div{display:flex;gap:14px;background:var(--voile);border-radius:14px;padding:16px 18px}
.liste-suite b{flex:none;width:30px;height:30px;border-radius:50%;background:var(--gris);color:var(--blanc);display:flex;align-items:center;justify-content:center;font-size:14px}
.video{max-width:900px;margin:0 auto 40px;aspect-ratio:16/9;border-radius:20px;background:var(--noir);color:var(--blanc);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;overflow:hidden;position:relative}
.video iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.video .play{width:84px;height:84px;border-radius:50%;background:var(--gris);display:flex;align-items:center;justify-content:center}
.video small{color:#b9bdc8}

@media (max-width:900px){
  .hero .grille,.apropos,.enjeu,.rdv{grid-template-columns:1fr}
  .hero .grille{gap:34px}
  .photo-hero{max-width:420px;aspect-ratio:1/1}
  .chiffres,.etapes{grid-template-columns:1fr}
  .indics{grid-template-columns:1fr}
  .rdv{padding:32px 24px}
  .rdv .btn{justify-self:start}
  .etapes{gap:30px}
}
@media (max-width:560px){
  body{font-size:16px}
  .wrap{padding:0 16px}
  section{padding:60px 0}
  .deux{grid-template-columns:1fr}
  .element{grid-template-columns:1fr;gap:14px;padding:22px}
  .preuves{grid-template-columns:1fr 1fr 1fr;gap:8px}
  .preuves b{font-size:22px}
  .logos img{height:44px}
  .logos{gap:18px 26px}
  .top .btn.sm{padding:9px 14px;font-size:13px;width:auto}
  .top img{height:36px}
  .carte-form{padding:20px}
  .btn{width:100%}
  .boutons .btn{width:100%}
}

/* --- ajouts v2 --- */
.nom{white-space:nowrap}
.niveaux{display:grid;grid-template-columns:1fr 1.15fr;gap:20px;align-items:stretch}
.niveau{border-radius:20px;padding:32px;border:1px solid var(--ligne);background:var(--blanc);display:flex;flex-direction:column}
.niveau.payant{background:var(--noir);color:#e6e8ee;border:0;position:relative}
.niveau.payant h3{color:var(--blanc)}
.niveau .tag{align-self:flex-start;font-size:12px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;border-radius:6px;padding:4px 9px;margin-bottom:14px;background:var(--voile);color:var(--gris-fonce)}
.niveau.payant .tag{background:var(--gris);color:var(--blanc)}
.niveau h3{font-size:23px;margin-bottom:8px}
.niveau .sous{color:var(--texte-doux);margin-bottom:18px;font-size:16px}
.niveau.payant .sous{color:#b9bdc8}
.niveau ul{list-style:none;display:grid;gap:10px;margin-bottom:24px}
.niveau li{display:flex;gap:10px;font-size:16px}
.niveau li::before{content:"✓";flex:none;width:22px;height:22px;border-radius:50%;background:var(--voile);color:var(--gris-fonce);font-size:12px;font-weight:800;display:flex;align-items:center;justify-content:center;margin-top:2px}
.niveau.payant li::before{background:var(--gris);color:var(--blanc)}
.prix{margin-top:auto;padding-top:20px;border-top:1px solid #2a2d35}
.niveau:not(.payant) .prix{border-top-color:var(--ligne)}
.prix .montant{font-size:52px;font-weight:800;line-height:1;color:var(--blanc)}
.niveau:not(.payant) .prix .montant{color:var(--noir)}
.prix .fois{display:flex;flex-wrap:wrap;gap:8px;margin:14px 0 6px}
.prix .fois span{border:1px solid #3a3e48;border-radius:999px;padding:6px 12px;font-size:14px;font-weight:600}
.prix small{display:block;font-size:13px;color:#8a8f9c}
.valeur{max-width:820px;margin:34px auto 0;text-align:center;font-size:19px;color:var(--texte)}
.valeur strong{color:var(--noir)}
.options{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:8px}
.option{border:1px solid var(--ligne);border-radius:18px;padding:28px;background:var(--blanc);display:flex;flex-direction:column;gap:10px}
.option .px{font-size:30px;font-weight:800;color:var(--noir)}
.option p{color:var(--texte-doux);font-size:16px}
.option .btn{margin-top:auto;align-self:flex-start}
.final-photo{display:grid;grid-template-columns:1fr 1fr;gap:50px;align-items:center;text-align:left}
.final-photo h2{margin:14px 0 16px}
.final-photo .lead{margin:0 0 28px}
.final-photo img{border-radius:22px}
.galerie{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:30px}
.galerie img{border-radius:16px;aspect-ratio:4/5;object-fit:cover;width:100%}
.paiement{display:grid;gap:12px;max-width:520px;margin:0 auto}
.paiement .btn{width:100%;justify-content:space-between;padding:20px 26px}
.paiement .btn span{font-weight:500;opacity:.85}
@media (max-width:900px){
  .niveaux,.options,.final-photo{grid-template-columns:1fr}
  .final-photo img{max-width:440px}
}
@media (max-width:560px){
  .galerie{grid-template-columns:1fr 1fr}
  .galerie img:nth-child(3){display:none}
  .niveau{padding:24px}
  .option .btn{align-self:stretch}
}
.final-photo>*,.apropos>*,.hero .grille>*,.niveaux>*,.options>*{min-width:0}
.final-photo img,.apropos .photo img{width:100%;height:auto}
.final-photo img{aspect-ratio:4/5;object-fit:cover;object-position:top}
.champ select{width:100%;font:inherit;font-size:16px;padding:13px 14px;border:1.5px solid var(--ligne);border-radius:10px;background:var(--blanc);color:var(--texte);appearance:auto}
.champ select:focus{outline:none;border-color:var(--gris)}

/* --- v3 : centrage et catégories --- */
.hero .grille>div:first-child{text-align:center}
.hero .eyebrow{justify-content:center}
.hero .lead{margin-left:auto;margin-right:auto}
.carte-form{text-align:center}
.carte-form .champ label{text-align:center}
.choix{border:1.5px solid var(--ligne);border-radius:12px;padding:14px 16px 12px;margin:6px 0 12px;text-align:left}
.choix legend{font-size:14px;font-weight:700;color:var(--noir);padding:0 6px;text-align:center}
.choix .aide{font-size:13px;color:var(--texte-doux);margin:2px 0 10px;text-align:center}
.choix label{display:flex;gap:10px;align-items:center;font-size:15px;padding:7px 4px;cursor:pointer}
.choix input{width:18px;height:18px;accent-color:var(--noir);flex:none}
.choix.remise{background:var(--voile);border:1.5px dashed var(--gris)}
.ouinon{display:flex;justify-content:center;gap:30px}
.erreur{color:#b42318;font-size:13px;font-weight:600;text-align:center;margin-top:6px}
.carte-form .coche{text-align:left}
.tete,.niveau,.etape,.colonne,.indic div{text-wrap:pretty}
h1,h2,h3{text-wrap:balance}
.niveau{text-align:center;align-items:center}
.niveau .tag{align-self:center}
.niveau ul{text-align:left}
.prix{width:100%}
.prix .fois{justify-content:center}
.tete{text-align:center;margin-left:auto;margin-right:auto}
.tete .eyebrow{justify-content:center}
.tete .lead{margin-left:auto;margin-right:auto}
.etape{text-align:center}
.etape::before{left:50%;transform:translateX(-50%)}
.apropos>div:last-child{text-align:center}
.apropos .eyebrow{justify-content:center}
.apropos .boutons{justify-content:center}
.sociaux{display:flex;flex-wrap:wrap;justify-content:center;gap:14px;margin:8px auto 44px;max-width:640px}
.sociaux a{display:flex;flex-direction:column;align-items:center;gap:8px;text-decoration:none;color:var(--noir);font-size:14px;font-weight:600;width:96px}
.sociaux svg{width:58px;height:58px;padding:15px;border-radius:50%;background:var(--noir);color:var(--blanc);transition:background .15s}
.sociaux a:hover svg{background:var(--gris)}
.rdv-court{border-top:1px solid var(--ligne);max-width:520px;margin:0 auto;padding-top:30px}
.rdv-court p{font-size:18px;font-weight:600;margin-bottom:14px;color:var(--noir)}
@media (max-width:560px){.sociaux a{width:84px}.rdv-court .btn{width:100%}}