/* =========================================================================
   Starsbox -- refonte "Le Club de [Prenom]" (03/11/2026)
   Complete style.css (meme palette, memes polices). Charge SEULEMENT par :
   index, club, noel (+ en/index, en/club, en/christmas).
   Echelle d'espacement : 4 8 16 24 32 48 64. Rayons : 12 (champs), 20 (cartes), 100 (boutons).
   Mouvements : 150-250 ms, ease-out, coupes si prefers-reduced-motion.
   ========================================================================= */
/* Polices de secours calees sur les vraies (mesure du 03/11 : largeur Baloo 2 = 83 % d'Arial, Nunito = 100,7 %) :
   le texte ne change presque pas de largeur quand la vraie police arrive, donc la page ne saute pas (CLS). */
@font-face{font-family:"Baloo 2";src:url(/assets/fonts/baloo2-800.ttf) format("truetype");font-weight:600 800;font-style:normal;font-display:optional}
@font-face{font-family:"Baloo 2 Fallback";src:local("Arial");font-weight:600 800;size-adjust:82.8%}
@font-face{font-family:"Nunito Fallback";src:local("Arial");font-weight:400 800;size-adjust:100.7%}
body{font-family:"Nunito","Nunito Fallback",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif}
h1,h2,h3,h4,h5{font-family:"Baloo 2","Baloo 2 Fallback","Nunito",sans-serif}
:root{
  --cl-navy:#0f1d3d; --cl-navy2:#1b2f5e; --cl-card:#fff; --cl-ring:rgba(240,193,75,.55);
  --muted:#566079; --emma-ink:#c2354a; --cl-s1:4px; --cl-s2:8px; --cl-s3:16px; --cl-s4:24px; --cl-s5:32px; --cl-s6:48px; --cl-s7:64px;
  --cl-r:20px; --cl-rf:12px; --cl-sh:0 10px 30px rgba(22,38,74,.10); --cl-sh2:0 18px 44px rgba(22,38,74,.18);
}
.cl-skip{position:absolute;left:-999px;top:8px;background:#fff;color:var(--ink);padding:8px 16px;border-radius:12px;z-index:99}
.cl-skip:focus{left:8px}
.nav a[aria-current="page"],.mobile-nav a[aria-current="page"]{color:var(--emma)}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible{outline:3px solid var(--gold);outline-offset:2px}

/* ---------- HERO ---------- */
.cl-hero{position:relative;z-index:3;color:#fff;overflow:hidden;
  background:
    radial-gradient(2px 2px at 12% 18%,rgba(255,255,255,.9),transparent 60%),
    radial-gradient(2px 2px at 78% 12%,rgba(255,255,255,.8),transparent 60%),
    radial-gradient(1.5px 1.5px at 42% 30%,rgba(255,255,255,.7),transparent 60%),
    radial-gradient(2px 2px at 90% 44%,rgba(255,255,255,.7),transparent 60%),
    radial-gradient(1.5px 1.5px at 24% 62%,rgba(255,255,255,.6),transparent 60%),
    radial-gradient(120% 90% at 85% 0%,#2a4486 0%,transparent 55%),
    linear-gradient(170deg,var(--cl-navy2) 0%,var(--cl-navy) 70%);
  padding:var(--cl-s6) 0 var(--cl-s7)}
.cl-hero .wrap{display:grid;gap:var(--cl-s6);align-items:center}
.cl-hero h1{color:#fff;font-size:clamp(2rem,6.2vw,3.5rem);letter-spacing:-.01em;margin:0 0 var(--cl-s3)}
.cl-hero h1 .gold{color:var(--gold)}
.cl-hero .eyebrow{background:rgba(255,255,255,.1);color:var(--gold);border-color:rgba(255,255,255,.2);box-shadow:none}
.cl-sub{font-size:clamp(1.05rem,2.4vw,1.25rem);color:rgba(255,255,255,.88);max-width:34em;margin:0 0 var(--cl-s4);line-height:1.55}
.cl-name{background:rgba(255,255,255,.08);border:1.5px solid rgba(255,255,255,.22);border-radius:var(--cl-r);padding:var(--cl-s3) var(--cl-s4) var(--cl-s4);max-width:30em}
.cl-name label{display:block;font-weight:800;font-size:.95rem;margin:0 0 var(--cl-s2);color:#fff}
.cl-name input{width:100%;min-height:52px;padding:12px 16px;border-radius:var(--cl-rf);border:2px solid transparent;font:inherit;font-size:1.1rem;font-weight:700;color:var(--ink);background:#fffdf6}
.cl-name input::placeholder{color:#8a8f9e;font-weight:600}
.cl-name input:focus{border-color:var(--gold);outline:none;box-shadow:0 0 0 4px var(--cl-ring)}
.cl-name small{display:block;margin-top:var(--cl-s2);color:rgba(255,255,255,.72);font-size:.84rem;line-height:1.4}
.cl-cta{display:flex;flex-wrap:wrap;gap:var(--cl-s3);margin:var(--cl-s4) 0 var(--cl-s2)}
.cl-cta .btn{min-height:52px;justify-content:center}
.cl-cta .btn-line{background:transparent;color:#fff;border:2px solid rgba(255,255,255,.55)}
.cl-cta .btn-line:hover{background:rgba(255,255,255,.12);border-color:#fff}
.cl-value{color:rgba(255,255,255,.82);font-size:.95rem;margin:0 0 var(--cl-s2);max-width:36em}
.cl-trust{color:rgba(255,255,255,.66);font-size:.82rem;margin:var(--cl-s2) 0 0;max-width:40em;line-height:1.5}
.cl-trust a{color:var(--gold)}

/* trois preuves visuelles */
.cl-proofs{display:flex;gap:var(--cl-s3);overflow-x:auto;scroll-snap-type:x mandatory;padding:var(--cl-s2) var(--cl-s3) var(--cl-s3);margin:0 calc(var(--cl-s3) * -1);-webkit-overflow-scrolling:touch}
.cl-proof{flex:0 0 min(82%,320px);scroll-snap-align:center;background:#fff;color:var(--ink);border-radius:var(--cl-r);box-shadow:var(--cl-sh2);padding:var(--cl-s3);position:relative}
.cl-proof h2{font-size:.78rem;letter-spacing:.12em;text-transform:uppercase;color:var(--emma);font-family:"Nunito",sans-serif;font-weight:800;margin:0 0 var(--cl-s2)}
.cl-proof .cap{font-size:.8rem;color:var(--muted);margin:var(--cl-s2) 0 0;line-height:1.4}
/* lecteur */
.pl-top{display:flex;align-items:center;gap:var(--cl-s2);margin-bottom:var(--cl-s2)}
.pl-play{width:44px;height:44px;border-radius:50%;background:var(--emma);display:grid;place-items:center;flex:none}
.pl-play svg{width:18px;height:18px;fill:#fff;margin-left:2px}
.pl-t b{display:block;font-family:"Baloo 2",sans-serif;font-size:1.02rem;line-height:1.15}
.pl-t>span{font-size:.78rem;color:var(--muted)}
.pl-bar{height:6px;border-radius:6px;background:#ece6d8;overflow:hidden;margin:var(--cl-s2) 0 var(--cl-s3)}
.pl-bar i{display:block;height:100%;width:38%;background:var(--emma);border-radius:6px;animation:pl-prog 14s linear infinite}
.pl-txt{font-size:1.02rem;line-height:1.7;margin:0;color:#3b4560}
.pl-txt .w{border-radius:6px;padding:0 2px;transition:background-color .15s ease-out,color .15s ease-out}
.pl-txt .w.on{background:var(--gold);color:var(--ink)}
.pl-speed{display:flex;gap:var(--cl-s2);margin-top:var(--cl-s3);font-size:.78rem;color:var(--muted);align-items:center}
.pl-speed b{border:1.5px solid var(--line);border-radius:100px;padding:2px 10px;color:var(--ink)}
.pl-speed b.on{background:var(--ink);color:#fff;border-color:var(--ink)}
@keyframes pl-prog{from{width:6%}to{width:96%}}
/* lettre */
.lt-wrap{display:grid;grid-template-columns:96px 1fr;gap:var(--cl-s3);align-items:start}
.lt-wrap img{width:96px;height:auto;border-radius:12px;box-shadow:0 6px 16px rgba(22,38,74,.25)}
.lt-top{font-size:.66rem;letter-spacing:.14em;text-transform:uppercase;color:#8d7f58;font-weight:800}
.lt-h{font-family:"Baloo 2",sans-serif;font-weight:800;font-size:1.18rem;line-height:1.1;color:var(--ink);margin:2px 0 0}
.lt-h em{display:block;font-style:normal;color:#c0392b;font-size:1.3rem}
.lt-body{font-size:.9rem;line-height:1.55;color:#3b4560;margin:var(--cl-s3) 0 0}
.lt-body b{color:#c0392b;font-family:"Baloo 2",sans-serif;font-size:1.05rem}
.lt-sig{margin-top:var(--cl-s2);font-family:"Baloo 2",sans-serif;font-weight:800;color:#c0392b}
/* calendrier + mug */
.cm-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:5px;margin:0 0 var(--cl-s3)}
.cm-grid span{aspect-ratio:1;border-radius:8px;background:linear-gradient(150deg,#ef5d6e,#b7263a);color:#fff;font-weight:800;font-size:.78rem;display:grid;place-items:center;font-family:"Baloo 2",sans-serif}
.cm-grid span:nth-child(3n){background:linear-gradient(150deg,#2bb6a3,#1d7d70)}
.cm-grid span:nth-child(5n){background:linear-gradient(150deg,#f0c14b,#d99a18);color:var(--ink)}
.cm-grid span.open{background:#fff8ec;color:var(--gold2);border:2px solid var(--gold)}
.cm-mug{display:flex;flex-wrap:wrap;align-items:center;gap:var(--cl-s3)}
.cm-mug svg{width:92px;height:auto;flex:none}
.cm-mug p{margin:0;font-size:.88rem;line-height:1.45;color:#3b4560;flex:1 1 150px}

/* ---------- sections ---------- */
.cl-sec{padding:var(--cl-s7) 0;position:relative;z-index:3}
.cl-sec.alt{background:var(--soft)}
.cl-sec.pap{background:#fff}
.cl-head{max-width:46em;margin:0 auto var(--cl-s5);text-align:center}
.cl-head h2{font-size:clamp(1.7rem,4vw,2.5rem);margin:0 0 var(--cl-s2)}
.cl-head p{color:var(--muted);font-size:1.08rem;margin:0}
.cl-steps{display:grid;gap:var(--cl-s4);counter-reset:st;max-width:1000px;margin:0 auto}
.cl-step{background:#fff;border-radius:var(--cl-r);padding:var(--cl-s4);box-shadow:var(--cl-sh);position:relative;padding-left:76px}
.cl-step:before{counter-increment:st;content:counter(st);position:absolute;left:var(--cl-s4);top:var(--cl-s4);width:40px;height:40px;border-radius:50%;background:var(--gold);color:var(--ink);font-family:"Baloo 2",sans-serif;font-weight:800;font-size:1.3rem;display:grid;place-items:center}
.cl-step h3{font-size:1.25rem;margin:0 0 var(--cl-s1)}
.cl-step p{margin:0;color:var(--muted)}
/* frise */
.cl-year{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--cl-s3);max-width:1100px;margin:0 auto}
.cl-m{background:#fff;border-radius:var(--cl-r);padding:var(--cl-s3);box-shadow:var(--cl-sh);border-top:5px solid var(--c,var(--emma))}
.cl-m b.mo{display:block;font-family:"Baloo 2",sans-serif;font-size:1.15rem;color:var(--ink)}
.cl-m h3{font-size:1rem;margin:2px 0 4px;color:var(--c,var(--emma))}
.cl-m p{font-size:.88rem;line-height:1.45;color:var(--muted);margin:0}
.cl-m.big{grid-column:1/-1;background:linear-gradient(150deg,#1b2f5e,#0f1d3d);color:#fff;border-top-color:var(--gold)}
.cl-m.big b.mo,.cl-m.big h3{color:var(--gold)}
.cl-m.big p{color:rgba(255,255,255,.85)}
.cl-always{display:grid;gap:var(--cl-s3);margin:var(--cl-s4) auto 0;max-width:1100px}
.cl-always div{background:#fff8ec;border:2px dashed var(--gold);border-radius:var(--cl-r);padding:var(--cl-s3) var(--cl-s4)}
.cl-always b{font-family:"Baloo 2",sans-serif;font-size:1.05rem}
.cl-always p{margin:2px 0 0;font-size:.92rem;color:var(--muted)}
.cl-note{max-width:46em;margin:var(--cl-s4) auto 0;text-align:center;font-size:.9rem;color:var(--muted)}
/* formats */
.cl-fmt{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--cl-s3);max-width:1000px;margin:0 auto}
.cl-f{background:#fff;border-radius:var(--cl-r);padding:var(--cl-s4) var(--cl-s3);text-align:center;box-shadow:var(--cl-sh)}
.cl-f svg{width:44px;height:44px;color:var(--emma);margin:0 auto var(--cl-s2);display:block}
.cl-f h3{font-size:1.08rem;margin:0 0 4px}
.cl-f p{margin:0;font-size:.88rem;color:var(--muted);line-height:1.4}
/* trois niveaux */
.cl-three{display:grid;gap:var(--cl-s4);max-width:1100px;margin:0 auto}
.cl-col{background:#fff;border-radius:var(--cl-r);padding:var(--cl-s4);box-shadow:var(--cl-sh);border-top:6px solid var(--c)}
.cl-col .tag{display:inline-block;font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;font-weight:800;color:#fff;background:var(--c);border-radius:100px;padding:4px 12px;margin-bottom:var(--cl-s2)}
.cl-col h3{font-size:1.35rem;margin:0 0 var(--cl-s2)}
.cl-col ul{list-style:none;margin:0;padding:0;display:grid;gap:var(--cl-s2)}
.cl-col li{padding-left:28px;position:relative;font-size:.98rem;color:#3b4560;line-height:1.45}
.cl-col li:before{content:"";position:absolute;left:0;top:4px;width:18px;height:18px;border-radius:50%;background:var(--c) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 12 4 4 8-9'/%3E%3C/svg%3E") center/12px no-repeat}
.cl-col p.cl-foot{margin:var(--cl-s3) 0 0;font-size:.88rem;color:var(--muted)}
/* produits (noel) */
.cl-prod{display:grid;gap:var(--cl-s4);max-width:1180px;margin:0 auto;grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}
.cl-p{background:#fff;border-radius:var(--cl-r);box-shadow:var(--cl-sh);display:flex;flex-direction:column;overflow:hidden}
.cl-p .vis{background:linear-gradient(150deg,#fff8ec,#f6e8c8);min-height:150px;display:grid;place-items:center;padding:var(--cl-s3)}
.cl-p .vis svg,.cl-p .vis img{max-height:130px;width:auto;border-radius:12px}
.cl-p .in{padding:var(--cl-s4);display:flex;flex-direction:column;gap:var(--cl-s2);flex:1}
.cl-p h3{font-size:1.25rem;margin:0}
.cl-p p{margin:0;color:var(--muted);font-size:.95rem;line-height:1.5}
.cl-p .vis .cm-grid{width:min(100%,230px);margin:0}
.cl-badges{display:flex;flex-wrap:wrap;gap:6px}
.cl-badges span{font-size:.72rem;font-weight:800;border-radius:100px;padding:4px 10px;background:#eef6f4;color:#14695d}
.cl-badges span.perso{background:#fde8ea;color:#a8283a}
.cl-badges span.club{background:#fff3d2;color:#8a5d00}
.cl-badges span.non{background:#eceff5;color:#46506a}
.cl-p p.cl-price,.cl-price{font-family:"Baloo 2",sans-serif;font-weight:800;font-size:1.7rem;color:var(--ink);margin:var(--cl-s2) 0 0}
.cl-p p.cl-price small,.cl-price small{font-size:.8rem;font-family:"Nunito",sans-serif;font-weight:600;color:var(--muted)}
.cl-p .btn,.cl-card .btn{justify-content:center;min-height:48px}
.cl-stripe{font-size:.76rem;color:var(--muted);margin:var(--cl-s2) 0 0;line-height:1.4}
.cl-aff{font-size:.78rem;color:var(--muted)}
/* formules du club */
.cl-plans{display:grid;gap:var(--cl-s4);max-width:900px;margin:0 auto}
.cl-card{background:#fff;border-radius:var(--cl-r);padding:var(--cl-s5) var(--cl-s4);box-shadow:var(--cl-sh);border:3px solid transparent;display:flex;flex-direction:column;gap:var(--cl-s2);position:relative}
.cl-card.best{border-color:var(--gold);box-shadow:var(--cl-sh2)}
.cl-card .flag{position:absolute;top:-14px;left:var(--cl-s4);background:var(--gold);color:var(--ink);font-weight:800;font-size:.78rem;border-radius:100px;padding:5px 14px}
.cl-card h3{font-size:1.4rem;margin:0}
.cl-card .btn{margin-top:auto}
.cl-card .amount{margin:0;font-family:"Baloo 2",sans-serif;font-weight:800;font-size:2.8rem;line-height:1;color:var(--ink)}
.cl-card .amount small{font-size:1rem;font-family:"Nunito",sans-serif;font-weight:700;color:var(--muted)}
.cl-card ul{list-style:none;padding:0;margin:var(--cl-s2) 0;display:grid;gap:6px;font-size:.95rem;color:#3b4560}
.cl-card li{padding-left:26px;position:relative}
.cl-card li:before{content:"";position:absolute;left:0;top:5px;width:16px;height:16px;border-radius:50%;background:var(--theo) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 12 4 4 8-9'/%3E%3C/svg%3E") center/11px no-repeat}
.cl-card .engage{margin:0;background:#fff8ec;border-radius:var(--cl-rf);padding:var(--cl-s2) var(--cl-s3);font-size:.9rem;font-weight:700;color:var(--ink)}
/* formulaire de commande club */
.cl-order{max-width:640px;margin:var(--cl-s5) auto 0;background:#fff;border-radius:var(--cl-r);padding:var(--cl-s4);box-shadow:var(--cl-sh2)}
.cl-order h3{font-size:1.3rem;margin:0 0 var(--cl-s3)}
.cl-order label{display:block;font-weight:700;font-size:.95rem;margin:var(--cl-s3) 0 var(--cl-s1)}
.cl-order input[type=text],.cl-order input[type=email]{width:100%;min-height:48px;padding:10px 14px;border:1.5px solid #d9d2c3;border-radius:var(--cl-rf);font:inherit;background:#fffdf8}
.cl-order input:focus{border-color:var(--gold);outline:none;box-shadow:0 0 0 4px var(--cl-ring)}
.cl-choice{display:grid;gap:var(--cl-s2);margin-top:var(--cl-s2)}
.cl-choice label{display:flex;align-items:center;gap:var(--cl-s2);margin:0;border:2px solid var(--line);border-radius:var(--cl-rf);padding:var(--cl-s3);cursor:pointer;min-height:48px;font-weight:700;transition:border-color .15s ease-out,background-color .15s ease-out}
.cl-choice label:hover{border-color:var(--gold)}
.cl-choice input{width:20px;height:20px;accent-color:var(--emma);flex:none}
.cl-choice label:has(input:checked){border-color:var(--emma);background:#fff4f5}
.cl-order .cl-consent,.cl-consent{display:flex;gap:var(--cl-s2);align-items:flex-start;font-size:.86rem;line-height:1.45;color:#3b4560;margin-top:var(--cl-s3);font-weight:600}
.cl-consent input{width:20px;height:20px;margin-top:2px;accent-color:var(--emma);flex:none}
.cl-err{color:#b3261e;font-weight:700;min-height:1.3em;margin:var(--cl-s2) 0 0;font-size:.92rem}
.cl-test{background:#fff3d6;border:1.5px dashed var(--gold);border-radius:var(--cl-rf);padding:10px 16px;font-size:.88rem;margin:0 auto var(--cl-s4);max-width:900px}
.btn[disabled]{opacity:.55;cursor:wait}
/* a retenir (juridique en clair) */
.cl-legal{max-width:900px;margin:var(--cl-s5) auto 0;background:#fff;border-radius:var(--cl-r);padding:var(--cl-s4);box-shadow:var(--cl-sh);border-left:6px solid var(--theo)}
.cl-legal h3{font-size:1.15rem;margin:0 0 var(--cl-s2)}
.cl-legal ul{margin:0;padding-left:20px;display:grid;gap:var(--cl-s2);color:#3b4560;font-size:.95rem;line-height:1.5}
/* calendrier des fetes */
.cl-cal{max-width:900px;margin:0 auto;display:grid;gap:var(--cl-s2)}
.cl-cal div{display:grid;grid-template-columns:96px 1fr;gap:var(--cl-s3);background:#fff;border-radius:var(--cl-rf);padding:var(--cl-s3);box-shadow:0 4px 14px rgba(22,38,74,.06);align-items:center}
.cl-cal b{font-family:"Baloo 2",sans-serif;color:var(--emma);font-size:1rem;line-height:1.2}
.cl-cal span{font-size:.95rem;color:#3b4560;line-height:1.4}
/* prevente */
.cl-pre{background:linear-gradient(150deg,var(--cl-navy2),var(--cl-navy));color:#fff;border-radius:28px;padding:var(--cl-s6) var(--cl-s4);max-width:900px;margin:0 auto;text-align:center}
.cl-pre h2{color:#fff;font-size:clamp(1.5rem,3.6vw,2.1rem);margin:0 0 var(--cl-s2)}
.cl-pre p{color:rgba(255,255,255,.85);margin:0 auto var(--cl-s4);max-width:34em}
.cl-pre .wl-form{display:flex;flex-wrap:wrap;gap:var(--cl-s2);justify-content:center;max-width:560px;margin:0 auto}
.cl-pre .wl-form input{flex:1 1 180px;min-height:48px;border-radius:100px;border:2px solid transparent;padding:0 20px;font:inherit}
.cl-pre .wl-form .btn{min-height:48px}
.cl-pre .wl-ok{display:none;color:var(--gold);font-weight:700;margin-top:var(--cl-s3)}
.cl-pre .wl-ko{display:none;color:#ffb4ab;font-weight:700;margin-top:var(--cl-s3)}
.cl-pre .fine{font-size:.82rem;color:rgba(255,255,255,.6);margin:var(--cl-s3) 0 0}
/* bloc "continuer toute l'annee" (reutilisable dans le lecteur /avent) */
.cl-continue{background:linear-gradient(150deg,#1b2f5e,#0f1d3d);color:#fff;border-radius:24px;padding:var(--cl-s5) var(--cl-s4);text-align:center;max-width:720px;margin:var(--cl-s5) auto;box-shadow:var(--cl-sh2);font-family:"Nunito",-apple-system,"Segoe UI",Roboto,Arial,sans-serif;line-height:1.55}
.cl-continue h2{color:#fff;font-family:"Baloo 2","Nunito",sans-serif;font-weight:800;font-size:clamp(1.4rem,3.4vw,1.9rem);margin:0 0 var(--cl-s2);line-height:1.15}
.cl-continue h2 em{font-style:normal;color:var(--gold)}
.cl-continue p{color:rgba(255,255,255,.88);margin:0 auto var(--cl-s3);max-width:34em}
.cl-continue ul{list-style:none;padding:0;margin:0 0 var(--cl-s3);display:flex;flex-wrap:wrap;gap:8px;justify-content:center}
.cl-continue li{background:rgba(255,255,255,.1);border-radius:100px;padding:6px 14px;font-size:.88rem;font-weight:700}
.cl-continue .btn{min-height:50px;justify-content:center}
.cl-continue small{display:block;margin-top:var(--cl-s2);color:rgba(255,255,255,.65);font-size:.8rem}
/* faq */
.cl-faq{max-width:820px;margin:0 auto;display:grid;gap:var(--cl-s2)}
.cl-faq details{background:#fff;border-radius:var(--cl-rf);box-shadow:0 4px 14px rgba(22,38,74,.06)}
.cl-faq summary{cursor:pointer;list-style:none;padding:var(--cl-s3) 52px var(--cl-s3) var(--cl-s4);font-weight:800;font-size:1.02rem;position:relative;min-height:52px;display:flex;align-items:center}
.cl-faq summary::-webkit-details-marker{display:none}
.cl-faq summary:after{content:"+";position:absolute;right:var(--cl-s4);font-size:1.5rem;color:var(--emma);transition:transform .2s ease-out}
.cl-faq details[open] summary:after{transform:rotate(45deg)}
.cl-faq details p{margin:0;padding:0 var(--cl-s4) var(--cl-s3);color:#3b4560;line-height:1.6}
/* petits utilitaires */
.cl-cta-row{display:flex;flex-wrap:wrap;gap:var(--cl-s3);justify-content:center;margin-top:var(--cl-s4)}
.cl-link{color:var(--ink);font-weight:800;text-decoration:underline;text-decoration-color:var(--gold);text-decoration-thickness:3px;text-underline-offset:3px}
.cl-hide{display:none!important}

/* ---------- tablette / bureau ---------- */
@media(min-width:760px){
  .cl-steps{grid-template-columns:repeat(3,1fr)}
  .cl-step{padding:var(--cl-s5) var(--cl-s4) var(--cl-s4);padding-left:var(--cl-s4)}
  .cl-step:before{position:static;margin-bottom:var(--cl-s3)}
  .cl-year{grid-template-columns:repeat(3,1fr)}
  .cl-fmt{grid-template-columns:repeat(4,1fr)}
  .cl-three{grid-template-columns:repeat(3,1fr)}
  .cl-plans{grid-template-columns:1fr 1fr}
  .cl-always{grid-template-columns:1fr 1fr}
  .cl-cal div{grid-template-columns:150px 1fr}
}
@media(min-width:1000px){
  .cl-hero{padding:var(--cl-s7) 0 80px}
  .cl-hero .wrap{grid-template-columns:1.05fr .95fr;gap:var(--cl-s7)}
  .cl-proofs{display:grid;grid-template-columns:1fr 1fr;overflow:visible;margin:0;padding:0;gap:var(--cl-s3)}
  .cl-proof{flex:none}
  .cl-proof.p-play{grid-column:1/-1}
  .cl-year{grid-template-columns:repeat(4,1fr)}
}
@media(prefers-reduced-motion:reduce){
  .pl-bar i{animation:none;width:38%}
  .cl-faq summary:after,.cl-choice label,.pl-txt .w{transition:none}
}

/* ---------- contrastes (WCAG AA, mesure Lighthouse 03/11) ---------- */
.eyebrow{color:var(--emma-ink)}
.cl-hero .eyebrow{color:var(--gold)}
.cl-proof h2{color:var(--emma-ink)}
.cl-cal b{color:var(--emma-ink)}
.lsw-cur{color:var(--emma-ink)}
.lsw-alt{color:#566079}
.cl-m h3{color:var(--ink)}
.cl-m.big h3{color:var(--gold)}
.cl-col:nth-child(1) .tag{background:#1d7d70}
.cl-col:nth-child(2) .tag{background:#b7263a}
.cl-col:nth-child(3) .tag{background:#1f6fa8}
.nav a[aria-current="page"],.mobile-nav a[aria-current="page"]{color:var(--emma-ink)}

/* ---------- finitions (design-refine : survol, mouvement < 300 ms, ease-out) ---------- */
.cl-p,.cl-card,.cl-m,.cl-f{transition:transform .2s ease-out,box-shadow .2s ease-out}
@media(hover:hover){
  .cl-p:hover,.cl-card:hover,.cl-m:hover,a.cl-f:hover{transform:translateY(-3px);box-shadow:var(--cl-sh2)}
  .cl-faq summary:hover{color:var(--emma-ink)}
  .cl-link:hover{text-decoration-color:var(--emma)}
}
a.cl-f:focus-visible{transform:translateY(-3px)}
.btn:active{transform:scale(.98)}
@media(prefers-reduced-motion:reduce){.cl-p,.cl-card,.cl-m,.cl-f{transition:none}.cl-p:hover,.cl-card:hover,.cl-m:hover,a.cl-f:hover,.btn:active{transform:none}}

/* ---------- numerique d'abord, papier en option avec dates limites ---------- */
.cl-numerique{margin:0 0 var(--cl-s4);max-width:36em;padding:var(--cl-s2) var(--cl-s3);border-left:4px solid var(--gold);background:rgba(255,255,255,.08);border-radius:0 var(--cl-rf) var(--cl-rf) 0;color:rgba(255,255,255,.92);font-size:.98rem;line-height:1.5}
.cl-numerique b{color:var(--gold)}
.cl-hero .wrap[style*="text-align:center"] .cl-numerique{margin-left:auto;margin-right:auto;text-align:left}
.cl-limite{font-size:.86rem;color:var(--muted);line-height:1.45}
.cl-limite p{margin:0 0 var(--cl-s1)}
.cl-limite ul{list-style:none;margin:0;padding:0;display:grid;gap:var(--cl-s1)}
.cl-limite li.ouvert b{color:var(--ink)}
.cl-limite li.ferme{text-decoration:line-through;opacity:.75}
.cl-limite li.ferme b{color:#8a3a2a}
p.cl-fermee{margin:0;padding:var(--cl-s2) var(--cl-s3);background:#eceff5;border-radius:var(--cl-rf);font-weight:700;font-size:.92rem;color:#46506a;line-height:1.4}

/* ---------- comparaison Gratuit / Au prenom (meme dessin partout) ---------- */
.cl-vs{display:grid;gap:var(--cl-s4);max-width:1000px;margin:0 auto}
.cl-vs-col{background:#fff;border-radius:var(--cl-r);padding:var(--cl-s5) var(--cl-s4);box-shadow:var(--cl-sh);display:flex;flex-direction:column;gap:var(--cl-s3)}
.cl-vs-col.gratuit{border:2px dashed #b8c2d6}
.cl-vs-col.paye{border:3px solid var(--gold);box-shadow:var(--cl-sh2)}
.cl-vs-col .tag{align-self:flex-start;font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;font-weight:800;color:#fff;border-radius:100px;padding:4px 12px}
.cl-vs-col.gratuit .tag{background:#1f6fa8}
.cl-vs-col.paye .tag{background:#b7263a}
.cl-vs-col h3{font-size:1.4rem;margin:0}
.cl-vs-col ul{list-style:none;margin:0;padding:0;display:grid;gap:var(--cl-s2)}
.cl-vs-col li{padding-left:28px;position:relative;font-size:.98rem;color:#3b4560;line-height:1.45}
.cl-vs-col li:before{content:"";position:absolute;left:0;top:4px;width:18px;height:18px;border-radius:50%;background:#1f6fa8 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 12 4 4 8-9'/%3E%3C/svg%3E") center/12px no-repeat}
.cl-vs-col.paye li:before{background-color:#b7263a}
.cl-vs-col .btn{margin-top:auto;justify-content:center;min-height:52px}
.cl-vs-prix{margin:0;font-size:.95rem;color:var(--ink);font-weight:700}
.cl-dispo{color:var(--muted);font-weight:700;font-size:.82rem}
@media(min-width:760px){.cl-vs{grid-template-columns:1fr 1fr}}

/* deux boutons par carte de formule : seul le premier descend en bas, l'autre le suit */
.cl-card .btn + .btn{margin-top:0}
.cl-card .engage{font-size:.88rem}
