/* Funnel Naxom, copie conforme de grow.stonesystems.io (29/10/2026). Couleurs et police Naxom. */
@import url('https://fonts.googleapis.com/css2?family=Public+Sans:ital,wght@0,400;0,600;0,700;0,800;1,800&display=swap');
:root{--accent:#C2410C;--accent-fonce:#9A3412;--encre:#1B1B18;--encre2:#4D4A42;--gris:#8a8478;--vert:#7BC86C}
*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%}
body{font-family:'Public Sans',Arial,sans-serif;color:var(--encre);background:#fff;line-height:1.4}
main{max-width:820px;margin:0 auto;padding:28px 20px 24px;text-align:center}
.logo{display:flex;align-items:center;justify-content:center;gap:10px;margin-bottom:14px}
.logo img.m{width:38px;height:37px}.logo img.w{width:150px;height:18px}
h1{font-weight:800;font-size:clamp(24px,5vw,38px);line-height:1.18;color:var(--accent)}
.surtitre{font-weight:800;font-size:16px;letter-spacing:2px;color:var(--accent-fonce);margin-bottom:6px}
.prix{font-weight:800;font-style:italic;font-size:clamp(24px,5vw,34px);margin:10px 0 18px}
.etape{font-size:17px;margin:4px 0 16px}.etape u{font-weight:800}
.etape2{font-weight:800;font-size:clamp(20px,4vw,26px);margin:8px 0 12px}
.btn{display:inline-block;background:var(--accent);color:#fff;font:800 20px 'Public Sans',Arial,sans-serif;border:0;border-radius:10px;padding:16px 40px;margin:6px 0 22px;box-shadow:0 3px 0 var(--accent-fonce);cursor:pointer;text-decoration:none}
.btn:hover{background:var(--accent-fonce)}
/* fausse vidéo de la landing (image cliquable, comme chez Kai) */
.fausse-video{position:relative;display:block;width:100%;max-width:640px;margin:0 auto 14px;border:0;padding:0;border-radius:8px;overflow:hidden;cursor:pointer;box-shadow:0 2px 10px rgba(0,0,0,.2);background:#eee}
.fausse-video img{display:block;width:100%;height:auto}
.fausse-video .medaillon{position:absolute;left:4%;bottom:5%;width:15%;aspect-ratio:1;border-radius:50%;background:#8a8478;border:3px solid #fff}
.yt{position:absolute;left:50%;top:50%;width:68px;height:48px;margin:-24px 0 0 -34px;background:#FF0000;border-radius:12px;border:2px solid #fff;color:#fff;font-size:22px;line-height:44px}
/* vidéos */
.bandeau{background:var(--accent);color:#fff;font-weight:800;font-size:clamp(20px,4vw,26px);padding:16px;border-radius:8px 8px 0 0;max-width:640px;margin:0 auto}
.video{position:relative;max-width:640px;aspect-ratio:16/9;margin:0 auto 18px;background:#2b2a26;border-radius:0 0 8px 8px;color:#c9c3b6;font-size:13px;overflow:hidden}
.video.seule{border-radius:8px}
.video iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.video .attente{position:absolute;left:0;right:0;bottom:14px;text-align:center}
/* témoignages */
.temoignages{display:flex;gap:16px;justify-content:center;flex-wrap:wrap;margin:6px 0 18px}
.temoignage{width:210px}
.temoignage .tv{height:300px;border-radius:10px;background:#cfc8b8;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;color:var(--encre2);font-size:13px;font-weight:700;padding:10px}
.temoignage .lecture{width:46px;height:46px;border-radius:50%;background:#55524a;color:#fff;font-size:18px;line-height:46px}
.temoignage .citation{font-size:13px;line-height:1.45;margin-top:8px;color:var(--encre2);font-style:italic}
.etoiles{color:#F2A900;font-size:16px;margin-top:4px}.temoignage .nom{font-weight:800;font-size:13px}
footer{font-size:12px;color:var(--gris);border-top:1px solid #eee;padding:14px 0 26px;margin-top:6px;text-align:center}
/* agenda */
.agenda{max-width:640px;margin:0 auto 22px;border:1px solid #e5e0d4;border-radius:10px;padding:16px;text-align:left;min-height:120px}
.agenda iframe{width:100%;height:640px;border:0}
.agenda .verrou{text-align:center;padding:18px 8px}
.agenda .verrou b{display:block;font-size:18px;margin-bottom:6px}
.agenda .verrou p{color:var(--encre2);margin-bottom:14px}
.agenda .secours{display:block;font-size:13px;color:var(--gris);margin-top:10px;text-align:center}
.agenda .a-brancher{color:var(--gris);text-align:center;padding:30px 8px}
/* merci */
.num{display:inline-block;width:30px;height:30px;border-radius:50%;background:var(--accent);color:#fff;font-weight:800;line-height:30px;margin-right:8px;font-size:16px}
.confirmation{max-width:640px;margin:0 auto 20px;border:1px solid #e5e0d4;border-radius:10px;padding:16px 20px;text-align:left;font-size:15px;line-height:1.7}
.confirmation .ok{font-weight:800;font-size:18px;color:#1E5A36}
.mur{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:10px;max-width:640px;margin:0 auto 18px}
.mur div{height:150px;border-radius:8px;background:#cfc8b8;font-size:12px;font-weight:700;color:var(--encre2);display:flex;align-items:center;justify-content:center;padding:6px}
/* fenêtre du formulaire */
.voile{position:fixed;inset:0;background:rgba(0,0,0,.55);display:none;align-items:center;justify-content:center;padding:16px;z-index:50}
.voile.ouvert{display:flex}
.fenetre{position:relative;width:100%;max-width:400px;max-height:calc(100vh - 32px);overflow:auto;background:#fff;border-radius:12px;padding:24px 22px 20px;text-align:center}
.fermer{position:absolute;right:8px;top:8px;width:32px;height:32px;border-radius:50%;border:0;background:#fff;box-shadow:0 1px 4px rgba(0,0,0,.3);font-size:16px;cursor:pointer}
.fenetre h2{font-weight:800;font-size:22px;line-height:1.2;color:var(--accent);padding:0 26px}
.fenetre .prix{font-size:23px;margin:6px 0 12px}
.barre{height:20px;border-radius:10px;background:#e8e8e8;overflow:hidden;margin-bottom:14px}
.barre b{display:block;height:20px;background-color:var(--vert);background-image:linear-gradient(135deg,#8fd47f 25%,transparent 25%,transparent 50%,#8fd47f 50%,#8fd47f 75%,transparent 75%);background-size:28px 28px;border-radius:10px;color:#fff;font-size:11px;font-weight:800;line-height:20px;transition:width .35s ease;animation:rayures 1s linear infinite}
/* rayures qui défilent vers la gauche, à toutes les étapes */
@keyframes rayures{from{background-position:28px 0}to{background-position:0 0}}
@media (prefers-reduced-motion:reduce){.barre b{animation:none}}
.question{font-weight:700;font-size:16px;margin-bottom:12px}
.choix{display:block;width:100%;border:1.5px solid #e2e2e2;background:#fff;border-radius:8px;padding:12px;font:700 15px 'Public Sans',Arial,sans-serif;margin-bottom:8px;cursor:pointer;color:var(--encre)}
.choix:hover,.choix:focus{border-color:var(--accent);outline:none}
.champ{display:block;width:100%;border:1.5px solid #d9d9d9;border-radius:8px;padding:12px;font:16px 'Public Sans',Arial,sans-serif;margin-bottom:6px}
.champ:focus{border-color:var(--accent);outline:none}
.erreur{color:#b42318;font-size:13px;min-height:18px;margin-bottom:6px;text-align:left}
.continuer{display:block;width:100%;background:var(--accent);color:#fff;border:0;border-radius:8px;padding:13px;font:800 16px 'Public Sans',Arial,sans-serif;cursor:pointer}
.continuer[disabled]{opacity:.6;cursor:wait}
.hp{position:absolute;left:-9999px;width:1px;height:1px;opacity:0}
.deja .note{font-size:14px;color:var(--encre2);line-height:1.5;margin:8px 0 14px}
.deja a.lien{display:block;font-size:13px;color:var(--gris);margin-top:10px}
