/* Vision Patrimoine — thème sombre premium
   noir vert #0B1512 · surface #12211B · paper #FFFFFF · or #F2B233 · vert #2E8B6B · brume #A8BBB1 */
:root{
  --bg:#0B1512; --bg-2:#0E1B16; --surface:#132420; --surface-2:#1A2E27; --line:#24382F;
  --ink:#14261F; --ink-2:#4A5A53; --text:#EDF3EF; --text-2:#A8BBB1;
  --panel:#FFFFFF; --sage:#E7EEE8; --sage-2:#C8D6CC;
  --green:#1D5C48; --green-2:#154536; --emeraude:#37A47E; --mango:#F2B233; --mango-2:#D99A1B; --red:#E06A50; --red-deep:#B0432E; --slate:#6FA3CE;
  --display:"Bricolage Grotesque",system-ui,sans-serif; --body:"Public Sans",system-ui,sans-serif;
  --radius:16px; --radius-s:10px; --w:1120px;
}
*{box-sizing:border-box}
html{font-size:17px;-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;font-family:var(--body);color:var(--text);background:var(--bg);line-height:1.55}
body{background-image:radial-gradient(900px 500px at 85% -10%,rgba(46,139,107,.18),transparent 60%),radial-gradient(700px 400px at -10% 30%,rgba(242,178,51,.07),transparent 55%)}
a{color:var(--mango)}
h1,h2,h3{font-family:var(--display);line-height:1.06;letter-spacing:-.02em;margin:0 0 .5em;color:var(--text)}
h1{font-size:clamp(2.4rem,5.2vw,4rem);font-weight:800}
h2{font-size:clamp(1.7rem,3.4vw,2.5rem);font-weight:800}
h3{font-size:1.2rem;font-weight:700}
p{margin:0 0 1em}
.lead{font-size:1.14rem;color:var(--text-2);max-width:36em}
.wrap{max-width:var(--w);margin:0 auto;padding:0 22px}
.narrow{max-width:760px}
section{padding:72px 0}
.muted{color:var(--text-2)}
.small{font-size:.9rem}
::selection{background:var(--mango);color:var(--ink)}

/* ---------- Header ---------- */
.site-head{position:sticky;top:0;z-index:50;background:rgba(11,21,18,.82);backdrop-filter:blur(12px);border-bottom:1px solid var(--line)}
.site-head-in{max-width:var(--w);margin:0 auto;padding:14px 22px;display:flex;align-items:center;justify-content:space-between;gap:18px}
.brand{font-family:var(--display);font-weight:800;font-size:1.18rem;color:var(--text);text-decoration:none;display:flex;align-items:center;gap:10px}
.brand-mark{width:26px;height:26px;border-radius:50%;background:conic-gradient(var(--mango) 0 62%,var(--emeraude) 62% 100%);box-shadow:0 0 0 3px rgba(242,178,51,.15)}
.site-nav{display:flex;gap:6px;align-items:center;flex-wrap:wrap}
.site-nav a{color:var(--text-2);text-decoration:none;font-weight:500;font-size:.93rem;padding:8px 12px;border-radius:999px;transition:color .15s,background .15s}
.site-nav a:hover{color:var(--text);background:var(--surface)}
.site-nav a.nav-cta{background:var(--mango);color:var(--ink);font-weight:700;font-family:var(--display);padding:9px 18px;margin-left:6px}
.site-nav a.nav-cta:hover{background:var(--mango-2);color:var(--ink)}

/* ---------- Footer ---------- */
.site-foot{border-top:1px solid var(--line);margin-top:60px;background:var(--bg-2)}
.site-foot-in{max-width:var(--w);margin:0 auto;padding:48px 22px 56px}
.foot-grid{display:grid;grid-template-columns:1.3fr 1fr 1fr;gap:34px}
.foot-brand{font-family:var(--display);font-weight:800;font-size:1.15rem;margin-bottom:.4em;color:var(--text)}
.foot-note{color:var(--text-2);max-width:30em}
.foot-links{display:flex;flex-direction:column;gap:9px}
.foot-links a{color:var(--text-2);text-decoration:none}
.foot-links a:hover{color:var(--text)}
.foot-h{font-size:.8rem;letter-spacing:.06em;color:var(--text-2);margin:0 0 12px;font-weight:600}
.foot-legal{font-size:.78rem;color:#6E8177;margin-top:36px;max-width:76em;line-height:1.55}

/* ---------- Boutons & formulaires ---------- */
.btn{display:inline-block;font-family:var(--display);font-weight:700;font-size:1rem;padding:14px 26px;border-radius:999px;border:2px solid var(--mango);background:var(--mango);color:var(--ink);text-decoration:none;cursor:pointer;transition:transform .12s,background .12s,box-shadow .12s,border-color .12s}
.btn:hover{background:var(--mango-2);border-color:var(--mango-2);box-shadow:0 10px 28px -12px rgba(242,178,51,.5)}
.btn:active{transform:translateY(1px)}
.btn.mango{background:var(--mango);border-color:var(--mango);color:var(--ink)}
.btn.mango:hover{background:var(--mango-2);border-color:var(--mango-2)}
.btn.ghost{background:transparent;color:var(--text);border-color:var(--line)}
.btn.ghost:hover{background:var(--surface);box-shadow:none;border-color:var(--text-2)}
.btn.block{display:block;width:100%;text-align:center}
.btn[disabled]{opacity:.5;cursor:not-allowed}
label{display:block;font-weight:600;font-size:.95rem;margin-bottom:6px}
.field{margin-bottom:18px}
.field .help{font-size:.85rem;color:var(--ink-2);margin-top:4px}
input[type=text],input[type=email],input[type=tel],input[type=number],input[type=password],select,textarea{width:100%;font:inherit;padding:12px 14px;border:1.5px solid var(--sage-2);border-radius:var(--radius-s);background:#fff;color:var(--ink)}
input:focus,select:focus,textarea:focus,.opt:focus-within{outline:3px solid rgba(242,178,51,.55);outline-offset:1px;border-color:var(--green)}
.money{position:relative}
.money input{padding-right:40px}
.money::after{content:"€";position:absolute;right:14px;top:50%;transform:translateY(-50%);color:var(--ink-2)}
.check{display:flex;gap:10px;align-items:flex-start;font-weight:400;font-size:.92rem}
.check input{margin-top:4px;width:18px;height:18px;accent-color:var(--green)}
.hp{position:absolute;left:-9999px}
.error{background:#3A1710;border:1px solid #7A3223;color:#FFB4A0;padding:12px 16px;border-radius:var(--radius-s);margin-bottom:18px}
.paper .error,.quiz .error,.form-card .error,.card .error{background:#FBE9E5;border-color:#E7B9AE;color:var(--red-deep)}
.notice{background:var(--sage);color:var(--ink);padding:14px 18px;border-radius:var(--radius-s);margin-bottom:18px}

/* Cartes claires (« paper ») : tout composant à fond blanc repasse en encre */
.quiz,.form-card,.card,.pay-box,.preview,.offer,.temoignage,.sidebar,.cred div{color:var(--ink)}
.quiz h1,.quiz h2,.quiz h3,.form-card h1,.form-card h2,.form-card h3,.card h1,.card h2,.card h3,.pay-box h3,.preview h3,.offer h3,.sidebar h3{color:var(--ink)}
.quiz .muted,.form-card .muted,.card .muted,.pay-box .muted,.preview .muted,.offer ul,.sidebar ul,.temoignage figcaption{color:var(--ink-2)}
.card a,.form-card a,.quiz a,.pay-box a,.preview a{color:var(--green)}

/* ---------- Héros ---------- */
.hero{padding:64px 0 56px}
.hero-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:56px;align-items:start}
.hero-kicker{display:inline-flex;align-items:center;gap:8px;background:var(--surface);border:1px solid var(--line);color:var(--text-2);font-size:.85rem;padding:7px 14px;border-radius:999px;margin-bottom:20px}
.hero-kicker b{color:var(--mango);font-weight:700}
.hero-copy h1 .accent{color:var(--mango)}
.hero-badges{display:flex;gap:26px;margin-top:30px;flex-wrap:wrap}
.hero-badges div{display:flex;flex-direction:column;gap:2px;font-size:.88rem;color:var(--text-2);padding-left:14px;border-left:2px solid var(--line)}
.hero-badges b{color:var(--text);font-family:var(--display);font-size:1.05rem;font-weight:700}
.trust{display:flex;flex-direction:column;gap:6px;margin-top:26px;padding-left:16px;border-left:3px solid var(--mango);color:var(--text-2);font-size:.95rem}
.trust b{color:var(--text);font-weight:600}

/* Quiz (carte claire) */
.quiz{background:var(--panel);border-radius:var(--radius);padding:28px;box-shadow:0 30px 80px -30px rgba(0,0,0,.65),0 0 0 1px rgba(255,255,255,.06);position:sticky;top:86px}
.quiz-progress{height:6px;background:var(--sage);border-radius:3px;overflow:hidden;margin-bottom:18px}
.quiz-progress i{display:block;height:100%;background:var(--mango);width:0;transition:width .25s}
.quiz-step{display:none}
.quiz-step.active{display:block}
.quiz-count{font-size:.85rem;color:var(--ink-2);margin-bottom:4px}
.quiz-q{font-family:var(--display);font-size:1.45rem;font-weight:700;line-height:1.15;margin:0 0 18px;color:var(--ink)}
.opts{display:flex;flex-direction:column;gap:8px}
.opt{display:flex;align-items:center;gap:12px;padding:12px 14px;border:1.5px solid var(--sage-2);border-radius:var(--radius-s);cursor:pointer;font-weight:500;background:#fff;color:var(--ink);transition:border-color .15s,background .15s,transform .15s}
.opt:hover{border-color:var(--green)}
.opt input{width:18px;height:18px;accent-color:var(--green);margin:0}
.opt:has(input:checked){border-color:var(--green);background:#EAF1EC}
.opt.picked{transform:scale(.99)}
.quiz-nav{display:flex;justify-content:space-between;align-items:center;margin-top:18px;gap:10px}
.linkbtn{background:none;border:0;color:var(--ink-2);font:inherit;cursor:pointer;padding:6px 0;text-decoration:underline}
.quiz-final h3{margin-bottom:6px}
.quiz .btn{border-color:var(--green);background:var(--green);color:#fff}
.quiz .btn:hover{background:var(--green-2);border-color:var(--green-2);box-shadow:none}
.quiz .btn.mango{background:var(--mango);border-color:var(--mango);color:var(--ink)}

/* ---------- Bandeau chiffres ---------- */
.stats{border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:var(--bg-2)}
.stats-in{max-width:var(--w);margin:0 auto;padding:26px 22px;display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.stat b{display:block;font-family:var(--display);font-size:1.7rem;font-weight:800;color:var(--mango);line-height:1.1}
.stat span{font-size:.88rem;color:var(--text-2)}

/* ---------- Bento / features ---------- */
.how{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.how>div{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:26px;transition:transform .2s,border-color .2s}
.how>div:hover{transform:translateY(-3px);border-color:var(--mango)}
.how h3{margin-bottom:.4em;color:var(--text)}
.how p{color:var(--text-2);margin:0}
.how .pic{font-family:var(--display);font-weight:800;color:var(--mango);font-size:1.5rem;display:block;margin-bottom:10px}

/* ---------- Offres ---------- */
.offers{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;align-items:stretch}
.offer{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:28px;display:flex;flex-direction:column;gap:10px;color:var(--text)}
.offer h3{color:var(--text)}
.offer.featured{background:linear-gradient(160deg,var(--surface-2),var(--surface));border-color:var(--mango);box-shadow:0 24px 60px -30px rgba(242,178,51,.35);position:relative}
.offer.featured::before{content:"Le plus choisi";position:absolute;top:-12px;left:24px;background:var(--mango);color:var(--ink);font-family:var(--display);font-weight:700;font-size:.78rem;padding:4px 12px;border-radius:999px}
.offer .price{font-family:var(--display);font-size:2.1rem;font-weight:800;line-height:1;color:var(--mango)}
.offer .price small{font-family:var(--body);font-size:.85rem;font-weight:400;color:var(--text-2)}
.offer ul{margin:0;padding-left:18px;color:var(--text-2);flex:1}
.offer li{margin-bottom:6px}
.offer li::marker{color:var(--emeraude)}
.offer .btn.ghost{border-color:var(--line)}

/* ---------- 3 étapes ---------- */
.howto{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;counter-reset:etape}
.howto>div{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:26px;counter-increment:etape;position:relative}
.howto>div::before{content:counter(etape);font-family:var(--display);font-weight:800;font-size:2.6rem;color:var(--mango);display:block;line-height:1;margin-bottom:12px}
.howto h3{color:var(--text)}
.howto p{color:var(--text-2);margin:0}

/* ---------- Cadre / sécurité ---------- */
.secure{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.secure>div{border-left:2px solid var(--mango);padding:4px 0 4px 16px;color:var(--text-2);font-size:.95rem}
.secure b{display:block;color:var(--text);font-family:var(--display);font-size:1.02rem;margin-bottom:4px}

/* ---------- FAQ ---------- */
.faq details{border:1px solid var(--line);background:var(--surface);border-radius:var(--radius-s);padding:16px 20px;margin-bottom:10px}
.faq summary{font-weight:600;cursor:pointer;color:var(--text);list-style:none;display:flex;justify-content:space-between;gap:14px;align-items:center}
.faq summary::after{content:"+";font-family:var(--display);font-weight:700;color:var(--mango);font-size:1.3rem;transition:transform .2s}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq p{margin:12px 0 0;color:var(--text-2)}

/* ---------- CTA final ---------- */
.cta-final{background:linear-gradient(160deg,var(--surface-2),var(--surface));border:1px solid var(--line);border-radius:calc(var(--radius) + 6px);padding:52px 40px;text-align:center;position:relative;overflow:hidden}
.cta-final::before{content:"";position:absolute;inset:auto -20% -60% -20%;height:200px;background:radial-gradient(closest-side,rgba(242,178,51,.25),transparent)}
.cta-final h2{margin-bottom:.3em}
.cta-final p{color:var(--text-2);max-width:34em;margin:0 auto 24px}

/* ---------- Résultat ---------- */
.score-hero{display:grid;grid-template-columns:auto 1fr;gap:44px;align-items:center;padding:20px 0}
.score-big{font-family:var(--display);font-weight:800;font-size:clamp(5rem,14vw,9.5rem);line-height:.9;letter-spacing:-.04em;color:var(--mango);text-shadow:0 0 60px rgba(242,178,51,.25)}
.score-big small{font-size:.26em;font-weight:500;color:var(--text-2);letter-spacing:0}
.profil-tag{display:inline-block;background:var(--mango);color:var(--ink);font-family:var(--display);font-weight:700;padding:6px 14px;border-radius:999px;margin-bottom:12px}
.bars{display:grid;gap:12px;margin:24px 0}
.bar{display:grid;grid-template-columns:210px 1fr 90px;gap:14px;align-items:center;font-size:.95rem}
.bar .track{height:12px;background:var(--surface-2);border-radius:6px;overflow:hidden}
.card .bar .track,.preview .bar .track{background:var(--sage)}
.bar .track i{display:block;height:100%;background:var(--emeraude);border-radius:6px;transition:width .7s cubic-bezier(.2,.7,.2,1)}
.bar .track i.warn{background:var(--mango)}
.bar .track i.bad{background:var(--red)}
.bar .val{text-align:right;font-variant-numeric:tabular-nums;color:var(--text-2)}
.card .bar .val,.preview .bar .val{color:var(--ink-2)}
.two{display:grid;grid-template-columns:1fr 1fr;gap:22px}
.card{background:var(--panel);border-radius:var(--radius);padding:28px}
.list-check,.list-warn{list-style:none;padding:0;margin:0;display:grid;gap:10px}
.list-check li,.list-warn li{padding-left:28px;position:relative}
.list-check li::before,.list-warn li::before{content:"";position:absolute;left:0;top:6px;width:14px;height:14px;border-radius:50%;background:var(--emeraude)}
.list-warn li::before{background:var(--mango)}
.wrap>.list-check li,.wrap>.list-check{color:var(--text-2)}
.upsell{background:linear-gradient(160deg,var(--surface-2),var(--surface));border:1px solid var(--mango);border-radius:var(--radius);padding:40px;display:grid;grid-template-columns:1.4fr 1fr;gap:30px;align-items:center;box-shadow:0 30px 80px -40px rgba(242,178,51,.35)}
.upsell h2{color:var(--text)}
.upsell p{color:var(--text-2)}
.upsell ul{color:var(--text-2);padding-left:18px;margin:0 0 20px}
.upsell li::marker{color:var(--emeraude)}
.upsell .price{font-family:var(--display);font-size:2.8rem;font-weight:800;color:var(--mango);line-height:1}
.locked{filter:blur(5px);pointer-events:none;user-select:none}
.lock-wrap{position:relative}
.lock-wrap .card{background:var(--surface);border:1px solid var(--line)}
.lock-wrap .lock-msg{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;text-align:center;padding:20px}
.lock-wrap .lock-msg span{background:var(--panel);color:var(--ink);padding:14px 20px;border-radius:var(--radius-s);box-shadow:0 10px 30px -15px rgba(0,0,0,.6);font-weight:600}

/* ---------- Bilan complet ---------- */
.steps{display:flex;gap:6px;margin-bottom:26px;flex-wrap:wrap}
.steps span{font-size:.85rem;padding:6px 12px;border-radius:999px;background:var(--surface);border:1px solid var(--line);color:var(--text-2);transition:background .2s,color .2s}
.steps span.on{background:var(--mango);border-color:var(--mango);color:var(--ink);font-weight:600}
.steps span.done{background:var(--surface-2);color:var(--text);cursor:pointer}
.form-card{background:var(--panel);border-radius:var(--radius);padding:32px}
.fs{display:none}.fs.active{display:block}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:0 22px}
.grid2 .full{grid-column:1/-1}
.form-nav{display:flex;justify-content:space-between;margin-top:14px;gap:10px}
.form-card .btn{border-color:var(--green);background:var(--green);color:#fff}
.form-card .btn:hover{background:var(--green-2);border-color:var(--green-2);box-shadow:none}
.form-card .btn.mango{background:var(--mango);border-color:var(--mango);color:var(--ink)}
.form-card .btn.ghost{background:#fff;color:var(--green);border-color:var(--sage-2)}
.step-count{font-size:.85rem;color:var(--ink-2);margin:0 0 2px}
.field.has-error input,.field.has-error select,.field.has-error textarea{border-color:var(--red-deep);background:#FFF6F4}
.field.has-error label{color:var(--red-deep)}
.field.has-error::after{content:"Champ obligatoire";display:block;font-size:.82rem;color:var(--red-deep);margin-top:4px}
.form-hint{margin:10px 0 0;color:var(--red-deep)}
.sidebar{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:24px;font-size:.95rem;color:var(--text-2)}
.sidebar h3{font-size:1.02rem;color:var(--text)}
.sidebar ul{padding-left:18px;margin:0;color:var(--text-2)}
.layout-form{display:grid;grid-template-columns:1fr 300px;gap:30px;align-items:start}

/* ---------- Paiement ---------- */
.pay{display:grid;grid-template-columns:1fr 400px;gap:36px;align-items:start}
.pay-box{background:var(--panel);border-radius:var(--radius);padding:28px;box-shadow:0 30px 80px -35px rgba(0,0,0,.6)}
.pay-box .total{display:flex;justify-content:space-between;font-family:var(--display);font-weight:700;font-size:1.3rem;border-top:1px solid var(--sage-2);padding-top:14px;margin:14px 0 20px;color:var(--ink)}
.preview{background:var(--panel);border-radius:var(--radius);padding:24px}
.preview h3{margin-bottom:14px}

/* ---------- Divers ---------- */
.bio{display:grid;grid-template-columns:1fr 1.4fr;gap:40px;align-items:start}
.bio .cred{display:grid;gap:12px}
.bio .cred div{padding:16px 18px;background:var(--panel);border-radius:var(--radius-s);border-left:3px solid var(--mango)}
.bio .cred b{display:block;font-family:var(--display)}
.legal h2{font-size:1.3rem;margin-top:1.6em}
.legal .todo{background:rgba(242,178,51,.12);border-left:3px solid var(--mango);padding:10px 14px;font-size:.9rem;color:var(--text)}
.legal p,.legal li{color:var(--text-2)}
table.simple{width:100%;border-collapse:collapse;font-size:.95rem}
table.simple td,table.simple th{padding:8px 10px;border-bottom:1px solid var(--line);text-align:left}
table.simple td:last-child{text-align:right;font-variant-numeric:tabular-nums}

/* ---------- Témoignages ---------- */
.temoignages{padding:72px 0}
.temoignages-head{display:flex;align-items:baseline;justify-content:space-between;gap:20px;flex-wrap:wrap;margin-bottom:24px}
.temoignages-head h2{margin:0}
.temoignages-head .muted{color:var(--text-2)}
.stars{color:var(--mango);letter-spacing:1px;font-size:1.05rem}
.stars.small{font-size:.9rem}
.temoignages-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.temoignage{margin:0;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:26px;display:flex;flex-direction:column;gap:10px;color:var(--text);transition:transform .2s,border-color .2s}
.temoignage:hover{transform:translateY(-3px);border-color:var(--mango)}
.temoignage blockquote{margin:0;font-size:1rem;line-height:1.6;flex:1;color:var(--text)}
.temoignage blockquote::before{content:"« "}.temoignage blockquote::after{content:" »"}
.temoignage figcaption{font-weight:600;font-size:.92rem;color:var(--text-2)}
.stars-input{display:inline-flex;flex-direction:row-reverse;gap:4px;font-size:2rem;line-height:1}
.stars-input input{position:absolute;opacity:0;width:0;height:0}
.stars-input label{color:var(--sage-2);cursor:pointer;margin:0;transition:color .12s;font-weight:400}
.stars-input input:checked ~ label,.stars-input label:hover,.stars-input label:hover ~ label{color:var(--mango)}
.stars-input input:focus-visible + label{outline:2px solid var(--mango);border-radius:4px}

/* ---------- Aperçu PDF ---------- */
.apercu{max-width:300px;margin:18px auto 0}
.apercu-stack{position:relative;aspect-ratio:210/297;perspective:900px}
.apercu-stack img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;border-radius:6px;box-shadow:0 18px 50px -18px rgba(0,0,0,.75);opacity:0;transform:translateX(12%) rotateY(-14deg) scale(.96);transition:opacity .5s,transform .6s cubic-bezier(.2,.7,.2,1);pointer-events:none}
.apercu-stack img.on{opacity:1;transform:none;pointer-events:auto;z-index:2}
.apercu-stack img.out{opacity:0;transform:translateX(-12%) rotateY(14deg) scale(.96);z-index:1}
.apercu-dots{display:flex;justify-content:center;gap:6px;margin-top:12px}
.apercu-dots button{width:8px;height:8px;border-radius:50%;border:0;background:var(--line);padding:0;cursor:pointer;transition:background .2s,transform .2s}
.apercu-dots button.on{background:var(--mango);transform:scale(1.3)}
.preview .apercu-dots button{background:var(--sage-2)}
.preview .apercu-dots button.on{background:var(--mango)}
.upsell .apercu .muted,.apercu .muted{color:var(--text-2)}
.preview .apercu .muted{color:var(--ink-2)}

/* ---------- Mouvement ---------- */
@keyframes enter{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.quiz-step.enter,.fs.enter{animation:enter .28s ease-out}
@keyframes shake{20%,60%{transform:translateX(-4px)}40%,80%{transform:translateX(4px)}}
.opts.shake{animation:shake .4s}
@keyframes rise{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
.reveal{opacity:0}
.reveal.in{animation:rise .55s ease-out forwards}

/* ---------- Admin (thème clair scopé) ---------- */
body.light{background:#F2F4EF;background-image:none;color:var(--ink)}
body.light h1,body.light h2,body.light h3{color:var(--ink)}
body.light .muted{color:var(--ink-2)}
body.light a{color:var(--green)}
body.light .notice{background:#DCE5DD}
body.light .error{background:#FBE9E5;border-color:#E7B9AE;color:var(--red-deep)}
.adm{max-width:1180px;margin:0 auto;padding:20px}
.adm-nav{display:flex;gap:18px;align-items:center;padding:14px 20px;background:#14261F;color:#fff;border-radius:var(--radius-s);margin-bottom:24px;flex-wrap:wrap}
.adm-nav a{color:#fff;text-decoration:none;font-weight:500}.adm-nav a.on{border-bottom:2px solid var(--mango)}
.adm-nav .sp{flex:1}
.kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:24px}
.kpi{background:#fff;border-radius:var(--radius-s);padding:16px}.kpi b{display:block;font-family:var(--display);font-size:1.8rem;line-height:1;color:var(--ink)}.kpi span{font-size:.85rem;color:var(--ink-2)}
table.adm-t{width:100%;border-collapse:collapse;background:#fff;border-radius:var(--radius-s);overflow:hidden;font-size:.92rem;color:var(--ink)}
.adm-t th,.adm-t td{padding:9px 10px;border-bottom:1px solid #DCE5DD;text-align:left;vertical-align:top}.adm-t th{background:#DCE5DD;font-size:.82rem}
.tag{display:inline-block;padding:2px 8px;border-radius:999px;font-size:.78rem;background:#DCE5DD;color:var(--ink)}
.tag.payant{background:var(--mango)}.tag.coaching{background:#5B8DB8;color:#fff}.tag.abonne{background:var(--green);color:#fff}
.filters{display:flex;gap:10px;margin-bottom:14px;flex-wrap:wrap;align-items:end}.filters .field{margin:0}
pre.json{background:#fff;padding:12px;border-radius:var(--radius-s);font-size:.8rem;white-space:pre-wrap;max-height:320px;overflow:auto;color:var(--ink)}
.cols{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.btn.sm{padding:7px 14px;font-size:.88rem}
body.light .btn{border-color:var(--green);background:var(--green);color:#fff}
body.light .btn:hover{background:var(--green-2);border-color:var(--green-2);box-shadow:none}
body.light .btn.ghost{background:transparent;color:var(--green);border-color:var(--sage-2)}

@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}.reveal{opacity:1}}
@media (max-width:940px){
  .hero-grid,.two,.upsell,.pay,.layout-form,.bio,.foot-grid,.score-hero{grid-template-columns:1fr}
  .how,.offers,.howto,.temoignages-grid{grid-template-columns:1fr}
  .secure{grid-template-columns:1fr 1fr}
  .stats-in{grid-template-columns:1fr 1fr;gap:22px}
  .quiz{position:static;padding:22px}
  .bar{grid-template-columns:110px 1fr 80px}
  .grid2,.kpis,.cols{grid-template-columns:1fr}
  section{padding:48px 0}
  .hero{padding:40px 0}
  .site-nav{gap:2px;font-size:.88rem}
  .cta-final{padding:36px 22px}
  .offer.featured{order:-1}
}
@media (max-width:700px){
  .site-nav a:not(.nav-cta){display:none}
  .site-head-in{padding:12px 18px}
  .hero-badges{gap:16px}
  .hero-badges div{flex-basis:calc(50% - 16px)}
}

.brand-logo{width:34px;height:34px;display:block}
.brand span{color:var(--mango)}
.brand-mark{display:none}
/* Produits */
.produits{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.produit{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:26px;display:flex;flex-direction:column;gap:10px;color:var(--text)}
.produit .type{font-size:.78rem;letter-spacing:.06em;color:var(--mango);font-weight:700}
.produit h3{color:var(--text);margin:0}
.produit p{color:var(--text-2);margin:0;flex:1}
.produit .price{font-family:var(--display);font-size:1.6rem;font-weight:800;color:var(--mango)}
.produit .btn{align-self:flex-start}
.empty{background:var(--surface);border:1px dashed var(--line);border-radius:var(--radius);padding:40px;text-align:center;color:var(--text-2)}
.formule{display:grid;gap:8px;margin:6px 0 18px}
.formule .opt{align-items:flex-start}
.formule .opt b{display:block}
.formule .opt .small{color:var(--ink-2);display:block}
@media (max-width:940px){.produits{grid-template-columns:1fr}}

/* ---- Réassurance & CTA collante ---- */
.reassure{list-style:none;padding:0;margin:14px 0 0;display:flex;flex-wrap:wrap;gap:8px 18px;font-size:.88rem;color:var(--text-2)}
.reassure li{position:relative;padding-left:18px}
.reassure li::before{content:"✓";position:absolute;left:0;color:var(--emeraude);font-weight:700}
.reassure.ink{color:var(--ink-2)}
.sticky-cta{position:fixed;left:0;right:0;bottom:0;z-index:60;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 16px calc(10px + env(safe-area-inset-bottom));background:rgba(11,21,18,.94);backdrop-filter:blur(10px);border-top:1px solid var(--line);font-size:.9rem;color:var(--text-2);transform:translateY(110%);transition:transform .25s}
.sticky-cta.show{transform:none}
.sticky-cta b{color:var(--text)}
.sticky-cta .btn{padding:11px 18px;font-size:.95rem;white-space:nowrap}
.sticky-cta[hidden]{display:none}
@media (min-width:941px){.sticky-cta{display:none!important}}
.apercu-dots button{width:12px;height:12px;box-shadow:0 0 0 6px transparent}
.resultat .temoignages{padding:40px 0 0}
@media (max-width:700px){
  .site-nav a.nav-cta{padding:8px 14px;font-size:.88rem;white-space:nowrap;margin-left:0}
  .steps span:not(.on){display:none}
  .steps span.on::after{content:" · " attr(data-total)}
  .hero-badges div{flex-basis:calc(50% - 8px);border-left:0;padding-left:0}
  .hero-badges{gap:14px}
  .bar{grid-template-columns:96px 1fr 62px;font-size:.88rem}
  .score-hero{gap:18px}
  body.has-sticky{padding-bottom:70px}
}

.nav-cta .short{display:none}
.site-head-in{flex-wrap:nowrap}
.brand{flex-shrink:0}
@media (max-width:700px){
  .brand{font-size:1rem;gap:8px}
  .brand-logo{width:28px;height:28px}
  .nav-cta .full{display:none}.nav-cta .short{display:inline}
  .site-nav a.nav-cta{padding:8px 12px;font-size:.85rem}
}
@media (max-width:360px){.brand span{display:none}.site-head-in{padding:12px 14px}}