/* Pages « Litbub » et « Présentation » : diapositives pleine largeur,
   dans l'esprit de la présentation Canva de Litbub. */
@font-face{font-family:"Bungee";src:url("fonts/bungee-latin.woff2") format("woff2");font-display:swap}
@font-face{font-family:"Montserrat";src:url("fonts/montserrat-latin.woff2") format("woff2");font-weight:100 900;font-display:swap}

main.wide{max-width:none;padding:0}
main.wide{font-family:"Montserrat",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif}
.slide{position:relative;overflow:hidden;padding:clamp(56px,9vw,104px) 16px}
.slide .in{position:relative;z-index:1;max-width:1080px;margin:0 auto}
.slide.dark{background:linear-gradient(120deg,#0a2a1d 0%,#173f2b 45%,#4d7558 100%);color:#fff}
.slide.paper{background:#eef3ef;color:#10231a}
.slide.white{background:#fff;color:#10231a}
.slide h2{border:0;padding:0;margin-top:0}
.slide.paper p a,.slide.white p a,.slide.paper li a,.slide.white li a{color:#1f7a52}

.display{font-family:"Bungee",Impact,"Arial Black",sans-serif;font-weight:400;text-transform:uppercase;letter-spacing:.01em;line-height:1.05;margin:0 0 18px;font-size:clamp(30px,6.4vw,64px)}
.display.md{font-size:clamp(26px,4.6vw,46px)}
.slide.paper .display,.slide.white .display{color:#0e3b27}
.display .hl{color:#5cc493}
.slide.paper .display .hl,.slide.white .display .hl{color:#25895f}
.kicker{font-family:"Bungee",sans-serif;font-size:15px;letter-spacing:.06em;color:#e9b44c;margin:0 0 10px}
.sub{font-size:clamp(16px,2.2vw,20px);max-width:640px;opacity:.9;margin:0 0 24px}

/* Forme irisée floue, comme sur la couverture */
.blob{position:absolute;z-index:0;width:min(520px,70vw);aspect-ratio:1;border-radius:46% 54% 38% 62%/52% 38% 62% 48%;filter:blur(42px);opacity:.75;
  background:conic-gradient(from 200deg,#ff7a18,#ff2fb2,#7b2ff7,#22d3ee,#a3e635,#ff7a18);animation:float 14s ease-in-out infinite}
.blob.r{right:-140px;top:-80px}.blob.l{left:-180px;bottom:-160px;opacity:.45}
@keyframes float{50%{transform:translate(-30px,24px) rotate(20deg) scale(1.06)}}
@media (prefers-reduced-motion:reduce){.blob{animation:none}}

/* Couverture */
.cover{display:grid;grid-template-columns:1.25fr .9fr;gap:32px;align-items:center}
.phone{justify-self:center;width:min(270px,70vw);border-radius:38px;border:8px solid #06140e;box-shadow:0 30px 70px rgba(0,0,0,.5)}
.pill-row{display:flex;flex-wrap:wrap;gap:10px;margin-top:8px}
.pill{display:inline-flex;align-items:center;gap:10px;border:1px solid rgba(255,255,255,.4);border-radius:12px;padding:9px 16px;font-weight:700;color:#fff;background:rgba(255,255,255,.06)}
.pill small{display:block;font-weight:500;font-size:11px;opacity:.75}
.soon-tag{display:inline-block;font-family:"Bungee",sans-serif;font-size:12px;letter-spacing:.04em;background:#e9b44c;color:#1a1205;border-radius:999px;padding:4px 12px;vertical-align:middle}
.web-soon{display:flex;gap:14px;align-items:center;background:rgba(233,180,76,.14);border:1px solid rgba(233,180,76,.6);border-radius:16px;padding:14px 16px;margin:0 0 22px;max-width:560px}
.web-soon img{width:48px;height:48px}
.web-soon strong{display:block;color:#f5d38c}

/* Boutons « Comment ça fonctionne ? » façon diapositive 4 */
.jump{display:grid;gap:12px}
.jump a{display:flex;align-items:center;justify-content:space-between;gap:12px;background:#0e3b27;color:#fff;text-decoration:none;border-radius:16px;padding:14px 16px 14px 20px;font-family:"Bungee",sans-serif;font-size:15px}
.jump a span.arrow{flex:none;width:34px;height:34px;border-radius:50%;background:#fff;color:#0e3b27;display:grid;place-items:center;font-family:Montserrat,sans-serif;font-weight:800}
.jump a:hover{background:#25895f}

.about{display:grid;grid-template-columns:1.5fr 1fr;gap:28px;align-items:start}
.about-card{background:#0e3b27;color:#fff;border-radius:22px;padding:22px}
.about-card p{margin:0 0 12px}
.about-card .inner{background:#fff;color:#10231a;border-radius:14px;padding:14px 16px;margin:12px 0}
.about-card ul{margin:0;padding-left:18px;font-style:italic}
.about-card li{margin:4px 0}
.about-card .hl{color:#5cc493;font-weight:700}

/* Cartes à bord vert, comme les profils et la monétisation */
.cards4,.cards3{display:grid;gap:18px}
.cards4{grid-template-columns:repeat(4,1fr)}
.cards3{grid-template-columns:repeat(3,1fr)}
.card{position:relative;background:#fff;color:#10231a;border:2.5px solid #25895f;border-radius:22px;padding:22px 18px;text-align:center;box-shadow:0 10px 26px rgba(14,59,39,.12);transition:transform .2s}
.card:hover{transform:translateY(-4px) rotate(-.5deg)}
.card img{width:88px;height:88px;object-fit:contain;margin:0 auto 10px;display:block;filter:drop-shadow(0 8px 10px rgba(0,0,0,.18))}
.card h3{font-family:"Bungee",sans-serif;font-weight:400;font-size:19px;margin:0 0 4px;color:#0e3b27}
.card .tag{display:inline-block;font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.04em;color:#25895f;margin-bottom:8px}
.card p{margin:0;font-size:15px;line-height:1.5}
.card .plus{position:absolute;top:-12px;right:-12px;width:30px;height:30px;border-radius:50%;background:#25895f;color:#fff;font-weight:800;display:grid;place-items:center;font-size:20px}
.card.soon{border-style:dashed}
.card.soon .plus{background:#e9b44c;color:#1a1205}
.curious{margin-top:26px;text-align:center}
.curious strong{font-size:18px}
.marquee{overflow:hidden;white-space:nowrap;margin-top:14px;color:#25895f;font-weight:800;font-size:13px;letter-spacing:.06em;text-transform:uppercase;mask-image:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent)}
.marquee span{display:inline-block;padding-left:100%;animation:scroll 32s linear infinite}
@keyframes scroll{to{transform:translateX(-100%)}}
@media (prefers-reduced-motion:reduce){.marquee span{animation:none;padding-left:0}}

.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;counter-reset:s;list-style:none;padding:0;margin:0}
.steps li{counter-increment:s;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.25);border-radius:18px;padding:18px}
.steps li::before{content:counter(s);display:grid;place-items:center;width:40px;height:40px;border-radius:50%;background:#e9b44c;color:#1a1205;font-family:"Bungee",sans-serif;margin-bottom:10px}
.steps strong{display:block;font-size:17px;margin-bottom:4px}
.tip{margin-top:20px;background:#fff;color:#10231a;border-radius:16px;padding:14px 18px;max-width:760px}
.tip b{color:#25895f}

.feature-row{display:grid;grid-template-columns:repeat(2,1fr);gap:18px}
.feature{display:grid;grid-template-columns:auto 1fr;gap:16px;align-items:start;background:#fff;color:#10231a;border-radius:22px;padding:20px;border:2.5px solid #25895f}
.feature img{width:72px;height:72px}
.feature h3{font-family:"Bungee",sans-serif;font-weight:400;font-size:20px;margin:0 0 6px;color:#0e3b27}
.feature p{margin:0 0 8px;font-size:15.5px}

.premium{display:grid;grid-template-columns:1fr auto;gap:24px;align-items:center;background:#fff;color:#10231a;border-radius:26px;padding:clamp(22px,4vw,40px);box-shadow:0 30px 60px rgba(0,0,0,.35);max-width:900px;margin:0 auto}
.premium h3{font-family:"Bungee",sans-serif;font-weight:400;font-size:clamp(20px,3vw,28px);margin:0 0 14px;color:#0e3b27}
.premium h3 .plus{color:#25895f}
.premium ul{list-style:none;padding:0;margin:0 0 14px}
.premium li{padding:7px 0 7px 34px;position:relative;font-weight:600}
.premium li::before{content:"✓";position:absolute;left:0;top:5px;width:24px;height:24px;border-radius:50%;background:#25895f;color:#fff;display:grid;place-items:center;font-size:14px}
.premium li.later{font-weight:500;color:#5b6f66}
.premium li.later::before{content:"…";background:#e9b44c;color:#1a1205}
.premium .clover{width:130px}
.premium .fine{font-size:13px;color:#5b6f66;margin:0;background:#eef3ef;border-radius:12px;padding:10px 14px}

.faq{max-width:860px;margin:0 auto}
.faq details{background:#fff;color:#10231a;border:2px solid #25895f;border-radius:16px;padding:14px 18px;margin:12px 0}
.faq summary{cursor:pointer;font-weight:800;font-size:17px;list-style:none;display:flex;justify-content:space-between;gap:12px}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";font-family:"Bungee",sans-serif;color:#25895f}
.faq details[open] summary::after{content:"–"}
.faq details p,.faq details li{font-size:15.5px}
.contact{display:flex;align-items:center;gap:18px;justify-content:center;flex-wrap:wrap;text-align:center}
.contact img{width:84px}
.contact a{color:#fff;font-weight:800;font-size:20px}

@media (max-width:900px){.cards4{grid-template-columns:repeat(2,1fr)}.cards3{grid-template-columns:repeat(2,1fr)}.steps{grid-template-columns:repeat(2,1fr)}}
@media (max-width:720px){.cover,.about,.premium{grid-template-columns:1fr}.feature-row{grid-template-columns:1fr}.premium .clover{display:none}}
@media (max-width:520px){.cards4,.cards3,.steps{grid-template-columns:1fr}.card{text-align:left;display:grid;grid-template-columns:64px 1fr;gap:4px 14px;align-items:center}.card img{width:60px;height:60px;margin:0;grid-row:span 3}.feature{grid-template-columns:1fr}}

/* Mes premiers pas (diapositive 5 du PDF) */
.title-deco{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;flex-wrap:wrap}
.deco{display:flex;gap:18px}
.deco img{width:64px;height:64px;filter:drop-shadow(0 6px 8px rgba(0,0,0,.18))}
.deco img:nth-child(2){transform:rotate(-12deg) translateY(18px)}
.signup{border:2.5px solid #25895f;border-radius:26px;padding:22px clamp(16px,3vw,28px);background:#fff;box-shadow:0 14px 32px rgba(14,59,39,.12)}
.signup-title{font-family:"Montserrat",sans-serif;font-weight:800;font-size:26px;margin:0 0 16px;color:#0e3b27;text-transform:uppercase}
.signup-cols{display:grid;grid-template-columns:.8fr 1.3fr 1.1fr;gap:16px}
.signup-col{background:#f1f4f2;border-radius:20px;padding:16px 18px}
.signup-col h4{margin:0 0 10px;color:#1fae6b;font-size:20px;line-height:1.15;border-left:4px solid #1fae6b;padding-left:10px}
.signup-col p{margin:0 0 10px;font-size:15px;line-height:1.45}
.signup-col u{font-weight:700;text-decoration-thickness:1px}
.store-badge{display:block;background:#fff;border-radius:10px;padding:6px 12px;margin:8px 0;font-weight:800;font-size:14px;box-shadow:0 2px 6px rgba(0,0,0,.08)}
.store-badge small{display:block;font-weight:500;font-size:11px;color:#5b6f66}
.signup-tip{margin:16px 0 0;font-style:italic;font-weight:600;font-size:14.5px;border-left:4px solid #1fae6b;padding-left:10px}
.next-row{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-top:10px}
.mascot{width:110px;height:110px;margin-left:clamp(0px,30%,420px);margin-top:-6px;filter:drop-shadow(0 10px 12px rgba(0,0,0,.2))}
.next{display:inline-flex;align-items:center;gap:12px;background:#1fc27a;color:#0e3b27 !important;text-decoration:none;border-radius:999px;padding:10px 12px 10px 22px;font-weight:800;font-size:18px;text-transform:uppercase}
.next .arrow{width:34px;height:34px;border-radius:50%;background:#fff;color:#0e3b27;display:grid;place-items:center;font-weight:800}
.slide.dark .next{background:#0e3b27;color:#fff !important;border:1px solid rgba(255,255,255,.2)}
.small-center{text-align:center;font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:#5b6f66;margin:14px 0 0}

/* Les 4 fonctionnalités (diapositives 7 à 11 du PDF) */
.feat-cards .card{text-decoration:none;color:#10231a;display:flex;flex-direction:column;align-items:center;justify-content:space-between;min-height:250px}
.feat-cards .card h3{font-family:"Montserrat",sans-serif;font-weight:800;font-size:22px;text-transform:none}
.feat-cards .go{width:44px;height:44px;border-radius:50%;border:2px solid #1fae6b;color:#1fae6b;display:grid;place-items:center;font-weight:800;font-size:20px;margin-top:10px}
.feat-grid{display:grid;grid-template-columns:1.4fr 1fr;gap:clamp(20px,5vw,60px);align-items:center}
.feat.alt .feat-grid{grid-template-columns:1fr 1.4fr}
.feat.alt .feat-text{text-align:right}
.feat.alt .feat-text .bar{border-left:0;border-right:5px solid #1fc27a;padding:0 18px 0 0;text-align:left}
.feat .kicker{color:#fff;opacity:.85}
.bar{border-left:5px solid #1fc27a;padding-left:18px;margin:6px 0 22px;font-weight:600}
.bar p{margin:0 0 12px}
.bar ul{margin:0;padding-left:18px}
.bar li{margin:0 0 8px}
.bar u{color:#5cc493}
.feat-art{display:grid;place-items:center}
.feat-art img{width:min(240px,60vw);height:auto;filter:drop-shadow(0 24px 30px rgba(0,0,0,.4));animation:bob 5s ease-in-out infinite}
@keyframes bob{50%{transform:translateY(-12px) rotate(-3deg)}}
@media (prefers-reduced-motion:reduce){.feat-art img{animation:none}}

/* Monétiser : texte aligné */
.intro{text-align:justify;max-width:none;font-size:17px;margin:0 0 26px}
.money .card{text-align:left;display:grid;grid-template-columns:72px 1fr;grid-template-rows:auto auto 1fr;column-gap:14px;align-items:start}
.money .card img{width:72px;height:72px;margin:0;grid-row:1 / span 3}
.money .card h3,.money .card .tag,.money .card p{grid-column:2}
.money .card p{text-align:left}

/* FAQ, contact */
.name-play{font-family:"Bungee",sans-serif;font-size:22px;color:#25895f;margin:6px 0 12px}
.name-play span:first-child{text-decoration:line-through;text-decoration-thickness:2px;color:#5b6f66}
.faq blockquote{margin:10px 0 4px;padding:10px 14px;border-left:4px solid #25895f;background:#eef3ef;border-radius:0 10px 10px 0;font-style:italic}
.faq ol,.faq ul{padding-left:22px}
.faq li{margin:6px 0}
.small-note{font-size:13.5px;color:#5b6f66}
.contact-grid{display:grid;grid-template-columns:1.2fr 1fr;gap:28px;align-items:center}
.contact-grid p{font-weight:700;font-size:17px;margin:8px 0}
.contact-grid a{color:#5cc493}
.socials{display:flex;flex-wrap:wrap;gap:12px;justify-content:center;background:linear-gradient(120deg,#0a2a1d,#2f5a3f);border:1px solid rgba(255,255,255,.35);border-radius:22px;padding:18px}
.socials a{display:flex;flex-direction:column;align-items:center;gap:6px;color:#fff !important;text-decoration:none;font-size:12px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;min-width:64px}
.socials img{width:28px;height:28px;filter:invert(1);background:transparent}
.socials a span{opacity:.85}

@media (max-width:900px){.signup-cols{grid-template-columns:1fr}.feat-grid,.feat.alt .feat-grid{grid-template-columns:1fr}.feat.alt .feat-text{text-align:left}.feat.alt .feat-text .bar{border-right:0;border-left:5px solid #1fc27a;padding:0 0 0 18px}.feat.alt .feat-art{order:2}.contact-grid{grid-template-columns:1fr}.mascot{margin-left:0}}
@media (max-width:520px){.feat-cards .card{min-height:0;display:grid}.money .card{grid-template-columns:56px 1fr}.money .card img{width:56px;height:56px}.deco{display:none}}

/* Pourquoi le nom « Litbub » ? (diapositive 22 du PDF) */
.slide.name-slide{background:radial-gradient(90% 70% at 50% 62%,#0f6b45 0%,#0a4a30 45%,#07301f 100%)}
.name-lead{text-align:center;font-weight:700;font-size:18px;margin:0 0 28px}
.name-steps{display:flex;flex-direction:column;align-items:center;gap:6px}
.name-steps .word{font-family:"Montserrat",sans-serif;font-weight:800;font-size:clamp(34px,6vw,54px);line-height:1.1;color:#fff}
.name-steps s{color:#1fc27a;text-decoration-thickness:4px;text-decoration-color:#1fc27a}
.name-steps .down{font-family:-apple-system,"Segoe UI",sans-serif;font-size:44px;font-weight:300;line-height:1;color:#fff;opacity:.9;margin:2px 0}
.name-steps .final{position:relative;padding:18px 34px;margin-top:6px;color:#0a2a1d;background:#f5d38c;border-radius:20px;
  box-shadow:0 0 0 6px rgba(245,211,140,.25),0 0 60px 18px rgba(245,211,140,.45);animation:glow 2.6s ease-in-out infinite}
.name-steps .rays{position:absolute;inset:-46px;pointer-events:none;
  background:repeating-conic-gradient(from 0deg,rgba(92,196,147,.9) 0 3deg,transparent 3deg 30deg);
  -webkit-mask:radial-gradient(circle,transparent 58%,#000 60%,#000 72%,transparent 74%);mask:radial-gradient(circle,transparent 58%,#000 60%,#000 72%,transparent 74%);
  animation:spin 18s linear infinite}
@keyframes glow{50%{box-shadow:0 0 0 10px rgba(245,211,140,.18),0 0 90px 30px rgba(245,211,140,.55)}}
@keyframes spin{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){.name-steps .final,.name-steps .rays{animation:none}}
.name-quote{max-width:860px;margin:40px auto 0;text-align:center;font-weight:600;font-size:16px;line-height:1.6}
.name-quote .hl{color:#5cc493}

/* Badges officiels des magasins, en attendant la sortie */
.store-badges{display:flex;flex-wrap:wrap;gap:14px;align-items:center}
.sb{position:relative;display:inline-block;line-height:0}
.sb img{height:48px;width:auto;opacity:.92}
.sb-col{display:block;margin:10px 0}
.sb-col img{height:40px}
.sb-soon{position:absolute;top:-9px;right:-10px;line-height:1;font-family:"Bungee",sans-serif;font-size:10px;letter-spacing:.04em;background:#e9b44c;color:#1a1205;border-radius:999px;padding:4px 8px;box-shadow:0 2px 6px rgba(0,0,0,.25)}
.web-note{margin:10px 0 0;opacity:.8;font-size:14px}

/* Téléphone des 4 fonctionnalités : prêt à recevoir une capture */
.phone-frame{width:min(250px,64vw);aspect-ratio:9/19.5;border-radius:40px;padding:10px;background:#06140e;box-shadow:0 30px 70px rgba(0,0,0,.5),inset 0 0 0 2px rgba(255,255,255,.08);position:relative}
.phone-frame::before{content:"";position:absolute;top:18px;left:50%;transform:translateX(-50%);width:34%;height:22px;border-radius:999px;background:#000;z-index:2}
.phone-frame .screen{width:100%;height:100%;border-radius:31px;overflow:hidden;display:grid;place-items:center;background:radial-gradient(80% 60% at 50% 40%,#1f7a52 0%,#0e3b27 60%,#071a12 100%)}
.phone-frame .screen .ill{width:56%;height:auto;filter:drop-shadow(0 18px 24px rgba(0,0,0,.45));animation:bob 5s ease-in-out infinite}
.phone-frame .capture{width:100%;height:100%;object-fit:cover}

/* Vidéo */
.video-grid{display:grid;grid-template-columns:1fr 1.2fr;gap:32px;align-items:center}
.video-frame{aspect-ratio:16/9;border-radius:24px;overflow:hidden;background:linear-gradient(135deg,#0e3b27,#1f7a52 60%,#4d7558);box-shadow:0 30px 60px rgba(0,0,0,.4);border:1px solid rgba(255,255,255,.18)}
.video-frame .video{width:100%;height:100%;object-fit:cover;display:block}
.video-soon{height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;color:#fff}
.video-soon .play{width:84px;height:84px;border-radius:50%;background:rgba(255,255,255,.95);color:#0e3b27;display:grid;place-items:center;font-size:32px;padding-left:6px;box-shadow:0 0 0 12px rgba(255,255,255,.15);animation:glow2 2.4s ease-in-out infinite}
@keyframes glow2{50%{box-shadow:0 0 0 20px rgba(255,255,255,.06)}}
.video-soon strong{font-family:"Bungee",sans-serif;font-weight:400;letter-spacing:.03em}
.followers{flex-basis:100%;text-align:center;margin:8px 0 0;font-size:14px;font-weight:600;color:#fff}
@media (max-width:900px){.video-grid{grid-template-columns:1fr}}

/* Apparitions au défilement (assets/reveal.js) */
.js-reveal .rv{opacity:0;transform:translateY(26px);transition:opacity .7s ease var(--d,0ms),transform .7s cubic-bezier(.2,.7,.2,1) var(--d,0ms)}
.js-reveal .rv.on{opacity:1;transform:none}
.js-reveal .card.rv.on:hover{transform:translateY(-4px) rotate(-.5deg)}

/* Une couleur d'accent par fonctionnalité, reprise de la tache irisée */
.feat.acc-pink{--acc:#ff4f8b}.feat.acc-violet{--acc:#a78bfa}.feat.acc-orange{--acc:#ffa53a}.feat.acc-blue{--acc:#38bdf8}
.feat[class*="acc-"]{background:radial-gradient(60% 80% at 80% 50%,color-mix(in srgb,var(--acc) 24%,transparent) 0%,transparent 70%),linear-gradient(120deg,#0a2a1d 0%,#173f2b 50%,#2c5a41 100%)}
.feat.alt[class*="acc-"]{background:radial-gradient(60% 80% at 20% 50%,color-mix(in srgb,var(--acc) 24%,transparent) 0%,transparent 70%),linear-gradient(240deg,#0a2a1d 0%,#173f2b 50%,#2c5a41 100%)}
.feat[class*="acc-"] .kicker{color:var(--acc)}
.feat[class*="acc-"] .bar{border-color:var(--acc)}
.feat[class*="acc-"] .bar u{color:var(--acc)}
.feat[class*="acc-"] .phone-frame .screen{background:radial-gradient(80% 60% at 50% 40%,color-mix(in srgb,var(--acc) 55%,#0e3b27) 0%,#0e3b27 62%,#071a12 100%)}
.feat[class*="acc-"] .display{text-shadow:0 0 40px color-mix(in srgb,var(--acc) 35%,transparent)}

/* Litbub+ sur fond clair */
#litbub-plus .display{color:#0e3b27}

/* Accueil : page d'entrée */
.home-grid{display:grid;grid-template-columns:1.2fr 1fr;gap:32px;align-items:center}
.cta-row{margin:6px 0 22px}
.cta-row.center{text-align:center;margin-top:30px}
.cta{display:inline-flex;align-items:center;gap:14px;background:#5cc493;color:#06140e !important;text-decoration:none;font-weight:800;font-size:19px;border-radius:999px;padding:14px 16px 14px 26px;box-shadow:0 12px 30px rgba(92,196,147,.35);transition:transform .2s,box-shadow .2s}
.cta:hover{transform:translateY(-2px);box-shadow:0 16px 38px rgba(92,196,147,.5)}
.cta .arrow{width:36px;height:36px;border-radius:50%;background:#06140e;color:#5cc493;display:grid;place-items:center}
.cta.dark{background:#0e3b27;color:#fff !important;box-shadow:0 12px 30px rgba(14,59,39,.3)}
.cta.dark .arrow{background:#fff;color:#0e3b27}
.orbit{position:relative;aspect-ratio:1;max-width:440px;width:100%;justify-self:center}
.orbit::before{content:"";position:absolute;inset:12%;border-radius:50%;border:1px dashed rgba(255,255,255,.22)}
.orbit-logo{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:38%;aspect-ratio:1;border-radius:50%;background:#fff;display:grid;place-items:center;box-shadow:0 0 0 10px rgba(255,255,255,.06),0 0 90px 30px rgba(245,211,140,.35)}
.orbit-logo img{width:70%;height:auto;border-radius:22%}
.chip{position:absolute;display:inline-flex;align-items:center;gap:8px;background:rgba(10,42,29,.75);border:1px solid rgba(255,255,255,.25);backdrop-filter:blur(6px);color:#fff;font-weight:700;font-size:15px;border-radius:999px;padding:8px 14px;animation:bob 5s ease-in-out infinite}
.chip i{width:9px;height:9px;border-radius:50%;display:inline-block}
.chip.c1{left:2%;top:16%}.chip.c2{right:0;top:30%;animation-delay:-1.2s}.chip.c3{left:0;bottom:24%;animation-delay:-2.4s}.chip.c4{right:6%;bottom:12%;animation-delay:-3.6s}
.home .web-soon{margin-top:4px}
a.card{text-decoration:none;color:#10231a}

/* Titres longs et boutons : police de l'app, plus lisible */
.jump a,.next,.cta{font-family:"Montserrat",sans-serif}
.jump a{font-weight:800;font-size:16px;letter-spacing:.01em}
.name-slide .display,.contact-grid .display{font-size:clamp(24px,4vw,40px)}

/* Téléphone (passe mobile) */
@media (max-width:900px){.home-grid{grid-template-columns:1fr}.orbit{max-width:320px}}
@media (max-width:520px){
  .slide{padding:52px 16px}
  .display{font-size:clamp(28px,8.6vw,40px)}
  .display.md{font-size:clamp(24px,7.4vw,34px)}
  .sub{font-size:16px}
  .soon-tag{display:table;margin-top:8px}
  .store-badges{gap:12px}.sb img{height:42px}
  .web-soon{padding:12px}
  .cover .phone{width:min(230px,66vw)}
  .about-card{padding:16px}
  .signup{padding:16px}
  .signup-title{font-size:21px}
  .next-row{flex-direction:column-reverse;align-items:flex-start}
  .mascot{width:80px;height:80px}
  .next{font-size:15px;padding:8px 10px 8px 16px}
  .feat .phone-frame{width:min(200px,58vw)}
  .bar{padding-left:14px}
  .name-steps .word{font-size:clamp(30px,10vw,40px)}
  .name-steps .final{padding:12px 22px}
  .name-steps .rays{inset:-30px}
  .name-quote{font-size:15px}
  .premium{padding:20px}
  .faq summary{font-size:16px}
  .socials{gap:8px;padding:14px}.socials a{min-width:52px;font-size:10px}
  .video-soon .play{width:64px;height:64px;font-size:24px}
  .chip{font-size:13px;padding:6px 11px}
  .cta{font-size:17px;padding:12px 14px 12px 20px}
  .tabs a{padding:6px 9px}
}
.home .display{font-size:clamp(30px,5.2vw,56px)}
@media (max-width:520px){.intro,.money .card p{text-align:left}}
@media (max-width:520px){.cards4.mini{grid-template-columns:1fr 1fr;gap:12px}.cards4.mini .card{display:block;text-align:center;padding:16px 10px}.cards4.mini .card img{width:56px;height:56px;margin:0 auto 8px}.cards4.mini .card h3{font-size:15px}.cards4.mini .card .tag{font-size:10.5px}}

/* Transitions entre sections : un seul fond vert continu pour toutes les
   parties sombres (plus de coupure nette entre elles), et les parties
   claires posées dessus comme des feuilles aux coins arrondis qui se
   chevauchent légèrement. */
main.wide{background:linear-gradient(180deg,#0a2a1d 0%,#123623 22%,#0b2c1e 48%,#16402b 74%,#0a2a1d 100%)}
.slide.dark{background:transparent}
.slide.dark:not(.feat):not(.name-slide)::after{content:"";position:absolute;inset:0;z-index:0;pointer-events:none;
  background:radial-gradient(70% 60% at 85% 60%,rgba(92,196,147,.10),transparent 70%)}
.feat[class*="acc-"]{background:radial-gradient(55% 70% at 78% 50%,color-mix(in srgb,var(--acc) 20%,transparent) 0%,transparent 72%)}
.feat.alt[class*="acc-"]{background:radial-gradient(55% 70% at 22% 50%,color-mix(in srgb,var(--acc) 20%,transparent) 0%,transparent 72%)}
.slide.name-slide{background:radial-gradient(60% 55% at 50% 58%,rgba(31,194,122,.28) 0%,transparent 75%)}
.slide.paper,.slide.white{position:relative;z-index:1;border-radius:44px;margin:-44px 0;box-shadow:0 -18px 40px rgba(0,0,0,.18),0 18px 40px rgba(0,0,0,.18)}
.slide.paper + .slide.white,.slide.white + .slide.paper,.slide.paper + .slide.paper,.slide.white + .slide.white{z-index:2}
.slide.dark{padding-top:calc(clamp(56px,9vw,104px) + 44px);padding-bottom:calc(clamp(56px,9vw,104px) + 44px)}
main.wide > .slide:first-child{padding-top:clamp(56px,9vw,104px)}
main.wide > .slide:last-child{padding-bottom:clamp(56px,9vw,104px)}
main.wide > .slide.paper:last-child,main.wide > .slide.white:last-child{margin-bottom:0;border-radius:44px 44px 0 0}
@media (max-width:520px){
  .slide.paper,.slide.white{border-radius:28px;margin:-28px 0}
  .slide.dark{padding-top:80px;padding-bottom:80px}
  main.wide > .slide:first-child{padding-top:52px}
  main.wide > .slide.paper:last-child,main.wide > .slide.white:last-child{border-radius:28px 28px 0 0}
}
/* Deux parties claires qui se suivent : une seule feuille, fondu doux entre les deux teintes */
.slide.paper:has(+ .slide.paper),.slide.paper:has(+ .slide.white),.slide.white:has(+ .slide.paper),.slide.white:has(+ .slide.white){border-bottom-left-radius:0;border-bottom-right-radius:0;margin-bottom:0;box-shadow:0 -18px 40px rgba(0,0,0,.18)}
.slide.paper + .slide.paper,.slide.paper + .slide.white,.slide.white + .slide.paper,.slide.white + .slide.white{border-top-left-radius:0;border-top-right-radius:0;margin-top:0;box-shadow:0 18px 40px rgba(0,0,0,.18)}
.slide.white + .slide.paper{background:linear-gradient(180deg,#fff 0,#eef3ef 140px)}
.slide.paper + .slide.white{background:linear-gradient(180deg,#eef3ef 0,#fff 140px)}
.slide.paper,.slide.white{box-shadow:none !important}
.feat.alt[class*="acc-"] .feat-text .bar{border-right-color:var(--acc);border-left-color:var(--acc)}
.soon-chip{position:absolute;top:-11px;left:18px;font-family:"Bungee",sans-serif;font-size:11px;letter-spacing:.04em;background:#e9b44c;color:#1a1205;border-radius:999px;padding:4px 10px;box-shadow:0 2px 6px rgba(0,0,0,.15)}

/* Barre de progression du défilement, sur le bord droit */
.scroll-progress{position:fixed;right:0;top:0;bottom:0;width:4px;z-index:20;background:rgba(10,42,29,.18);pointer-events:none}
.scroll-progress span{display:block;height:100%;transform-origin:top;transform:scaleY(0);background:linear-gradient(180deg,#5cc493,#e9b44c);border-radius:0 0 4px 4px;box-shadow:0 0 10px rgba(92,196,147,.6)}
@media (min-width:900px){.scroll-progress{width:5px}}

/* Optimisation téléphone, passe 2 (retours du propriétaire) */
.sb-col{display:inline-block}
@media (max-width:520px){
  .slide.dark{padding-top:72px;padding-bottom:72px}
  .slide.paper,.slide.white{padding-top:44px;padding-bottom:52px}
  .cover{gap:22px}
  .cover .phone{width:min(190px,52vw)}
  .jump{grid-template-columns:1fr 1fr;gap:8px}
  .jump a{font-size:13px;padding:10px 8px 10px 12px;border-radius:12px;min-height:52px}
  .jump a span.arrow{width:24px;height:24px;font-size:12px}
  .about{gap:16px}
  .mascot{display:none}
  .next-row{margin-top:14px}
  .cards4:not(.mini){gap:10px}
  .cards4:not(.mini) .card{padding:14px 12px}
  .feat-cards{grid-template-columns:1fr 1fr !important}
  .feat-cards .card{display:flex !important;padding:14px 8px !important;text-align:center}
  .feat-cards .card img{width:52px;height:52px;margin:0 auto 6px;grid-row:auto}
  .feat-cards .card h3{font-size:15px;margin:0}
  .feat-cards .go{width:32px;height:32px;font-size:15px;margin-top:6px}
  .feat .feat-grid{gap:18px}
  .feat .phone-frame{width:min(150px,42vw);border-radius:28px;padding:7px}
  .feat .phone-frame::before{top:12px;height:14px}
  .feat .phone-frame .screen{border-radius:22px}
  .feat .feat-art{order:2}
  .bar{margin-bottom:16px}
  .bar li,.bar p{font-size:15px}
  .money{gap:12px}
  .money .card{padding:16px 12px 14px}
  .soon-chip{top:-10px;left:12px}
  .premium .fine{font-size:12px}
  .video-grid{gap:18px}
  .name-lead{margin-bottom:18px}
  .name-quote{margin-top:28px}
}
