/* ============================================================
   CORSIVA — Site 5 pages · DA dark canvas (CORSIVA_DA_Site_5_Pages.md)
   ============================================================ */
:root{color-scheme:dark;
  --canvas:#090909;--s1:#141414;--s2:#1c1c1c;--hair:#262626;--hair-soft:#1a1a1a;
  --ink:#fff;--muted:#999;
  --blue:#0099ff;--violet:#6a4cf5;--orange:#ff7a3d;
  --r-card:20px;--r-big:30px;--pill:100px;
  --display:"Geist",system-ui,sans-serif;--body:"Inter",system-ui,sans-serif;
  --ease:cubic-bezier(.2,.7,.2,1);
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:var(--body);background:var(--canvas);color:var(--ink);-webkit-font-smoothing:antialiased;font-feature-settings:"cv01","cv05","cv09","cv11","ss03","ss07";letter-spacing:-.011em;line-height:1.5;overflow-x:hidden}
::selection{background:rgba(0,153,255,.3)}
img,video{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
button{font-family:inherit}
h1,h2,h3{font-family:var(--display);font-weight:500;letter-spacing:-.04em}
.wrap{max-width:1180px;margin:0 auto;padding:0 22px}
section{padding:96px 0;position:relative}
/* Intitulé de section — caption Framer (Inter, sobre, tracking serré, point bleu signal). PAS de police arrondie. */
.eyebrow{display:inline-flex;align-items:center;gap:9px;font-family:var(--body);font-size:11.5px;font-weight:600;text-transform:uppercase;letter-spacing:.14em;color:#c8cdd4;line-height:1;margin-bottom:18px;padding:8px 15px;border:1px solid var(--hair);border-radius:100px;background:linear-gradient(180deg,var(--s1),#101010);box-shadow:inset 0 1px 0 rgba(255,255,255,.04);font-feature-settings:"cv01","cv05","cv09","cv11";-webkit-font-smoothing:antialiased}
.eyebrow .dot{display:block;width:6px;height:6px;border-radius:50%;background:var(--ac,#0099ff);flex:0 0 auto}
.eyebrow img{height:13px;margin-right:2px}
.sechead .eyebrow{justify-content:center}
/* badge note Google (hero) — conservé tel quel, hors du système de titres */
.ratebadge{display:inline-flex;align-items:center;gap:8px;font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:.1em;color:var(--muted);border:1px solid var(--hair);border-radius:var(--pill);padding:7px 14px;margin-bottom:22px}
.ratebadge .stars{letter-spacing:1px}
.h-display{font-size:clamp(38px,7vw,84px);line-height:.95;letter-spacing:-.045em}
.h-sec{font-size:clamp(34px,4.6vw,56px);line-height:1.02;margin-bottom:16px}
.lead{font-size:clamp(16px,2vw,19px);color:var(--muted);max-width:58ch;line-height:1.55}
.num{font-family:var(--display)}

/* ---------- Nav ---------- */
.progress{position:fixed;top:0;left:0;height:2px;background:var(--ac,var(--blue));width:0;z-index:120;transition:width .1s linear}
nav{position:fixed;top:0;left:0;right:0;z-index:110;display:flex;align-items:center;gap:26px;padding:0 26px;height:64px;transition:background .3s,backdrop-filter .3s,border-color .3s;border-bottom:1px solid transparent}
nav.scrolled{background:rgba(9,9,9,.78);backdrop-filter:blur(14px);border-bottom-color:var(--hair-soft)}
nav .brand img{height:17px}
nav .links{display:flex;gap:4px;margin-left:8px}
nav .links a{font-size:13.5px;font-weight:500;color:var(--muted);padding:8px 13px;border-radius:var(--pill);transition:.2s}
nav .links a:hover{color:#fff;background:var(--s1)}
nav .links a.on{color:#fff;background:var(--s1)}
nav .spacer{flex:1}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;font-size:14.5px;font-weight:600;border:none;border-radius:var(--pill);padding:13px 24px;cursor:pointer;transition:transform .2s var(--ease),box-shadow .2s;min-height:48px;position:relative}
.btn-w{background:#fff;color:#000}
.btn-w:hover{box-shadow:0 0 0 5px rgba(255,255,255,.12);transform:translateY(-1px)}
.btn-d{background:var(--s1);color:#fff;border:1px solid var(--hair)}
.btn-d:hover{background:var(--s2)}
.btn-sm{padding:9px 17px;min-height:40px;font-size:13.5px}
.burger{display:none}

/* ---------- Hero vidéo ---------- */
.hero{min-height:100svh;display:flex;align-items:center;padding:120px 0 80px;overflow:hidden}
.hero-bg{position:absolute;inset:0;z-index:-2}
.hero-bg video{width:100%;height:100%;object-fit:cover;opacity:.5}
.hero-bg::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(9,9,9,.55),rgba(9,9,9,.35) 45%,var(--canvas) 96%)}
.hero-glow{position:absolute;inset:0;z-index:-1;background:radial-gradient(700px 420px at 22% 80%,color-mix(in srgb,var(--ac,#0099ff) 9%,transparent),transparent)}
.ticker{display:flex;gap:34px;flex-wrap:wrap;margin-top:46px;padding-top:26px;border-top:1px solid rgba(255,255,255,.12)}
.ticker b{font-family:var(--display);font-size:24px;font-weight:500;display:block;letter-spacing:-.03em}
.ticker span{font-size:12px;color:var(--muted);text-transform:uppercase;letter-spacing:.07em}
.stars{color:#f5b43c;letter-spacing:2px}

/* ---------- Cartes & portails ---------- */
.card{background:var(--s1);border:1px solid var(--hair);border-radius:var(--r-card);padding:26px}
.portals{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.portal{border-radius:var(--r-big);padding:42px 38px;min-height:430px;display:flex;flex-direction:column;justify-content:flex-end;position:relative;overflow:hidden;transform-style:preserve-3d;transition:transform .35s var(--ease),box-shadow .35s}
.portal h3{font-size:clamp(26px,3vw,36px);letter-spacing:-.04em;margin:14px 0 10px;transform:translateZ(34px)}
.portal p{color:rgba(255,255,255,.82);font-size:15.5px;max-width:46ch;margin-bottom:24px;transform:translateZ(22px)}
.portal .btn{align-self:flex-start;transform:translateZ(40px)}
.portal img.plogo{height:24px;align-self:flex-start;transform:translateZ(30px)}
.portal-lab{background:radial-gradient(130% 150% at 12% 0%,#8f7bff,#6a4cf5 46%,#2a1a7a)}
.portal-os{background:var(--s1);border:1px solid var(--hair)}
.portal-os::before{content:"";position:absolute;inset:0;background:radial-gradient(420px 320px at 86% 8%,rgba(0,153,255,.2),transparent)}
.portal:hover{box-shadow:0 30px 80px rgba(0,0,0,.5)}

/* ---------- Phone & desktop mockups ---------- */
.phone{width:min(290px,72vw);aspect-ratio:9/19;border-radius:42px;background:#0c0c0c;border:1px solid #2c2c2c;box-shadow:0 0 0 9px #060606,0 0 0 10px #2a2a2a,0 50px 100px rgba(0,0,0,.6);padding:11px;position:relative;transform-style:preserve-3d}
.phone::before{content:"";position:absolute;top:21px;left:50%;transform:translateX(-50%);width:86px;height:24px;background:#060606;border-radius:14px;z-index:4}
.phone .screen{width:100%;height:100%;border-radius:32px;overflow:hidden;background:var(--canvas);position:relative}
.phone .screen video{width:100%;height:100%;object-fit:cover}
.float{animation:float 7s ease-in-out infinite}
@keyframes float{0%,100%{transform:translateY(0) rotate(0)}50%{transform:translateY(-16px) rotate(-.6deg)}}
.tilt{transform-style:preserve-3d;will-change:transform}

/* mini-UI OS reconstitué */
.ui{font-size:11px;color:var(--muted);padding:38px 13px 13px;display:flex;flex-direction:column;gap:9px;height:100%;background:var(--canvas)}
.ui .bar{display:flex;justify-content:space-between;align-items:center}
.ui .bar b{color:#fff;font-size:12.5px;font-family:var(--display);letter-spacing:-.02em}
.ui .chip{background:rgba(0,153,255,.14);color:var(--blue);border-radius:100px;padding:3px 9px;font-weight:600;font-size:9.5px}
.ui .kpis2{display:grid;grid-template-columns:1fr 1fr;gap:7px}
.ui .k{background:var(--s1);border:1px solid var(--hair);border-radius:11px;padding:9px}
.ui .k b{display:block;color:#fff;font-family:var(--display);font-size:16px;letter-spacing:-.02em;margin-top:2px}
.ui .row2{background:var(--s1);border:1px solid var(--hair);border-radius:11px;padding:8px 10px;display:flex;justify-content:space-between;align-items:center}
.ui .tag{padding:2px 8px;border-radius:100px;font-size:9px;font-weight:700}
.ui .split{height:9px;border-radius:100px;overflow:hidden;display:flex;background:var(--s2)}
.ui .split i{display:block;height:100%}
.deskmock{background:#0d0d0d;border:1px solid var(--hair);border-radius:14px;overflow:hidden;box-shadow:0 40px 90px rgba(0,0,0,.55)}
.deskmock .dtop{display:flex;gap:6px;padding:11px 13px;border-bottom:1px solid var(--hair-soft)}
.deskmock .dtop i{width:9px;height:9px;border-radius:50%;background:var(--s2);display:block}

/* ---------- Section "remplace" ---------- */
.replace{display:grid;grid-template-columns:1fr auto 1fr;gap:30px;align-items:center}
.repl-tags{display:flex;flex-direction:column;gap:10px}
.rtag{background:var(--s1);border:1px solid var(--hair);border-radius:12px;padding:12px 16px;font-size:14px;color:var(--muted);display:flex;align-items:center;gap:10px;transition:transform .7s var(--ease),opacity .7s}
.rtag .x{color:#ff5577;font-weight:700}
.replace.played .rtag{transform:translateX(120px) scale(.7);opacity:0}
.rtag:nth-child(2){transition-delay:.08s}.rtag:nth-child(3){transition-delay:.16s}.rtag:nth-child(4){transition-delay:.24s}.rtag:nth-child(5){transition-delay:.32s}.rtag:nth-child(6){transition-delay:.4s}.rtag:nth-child(7){transition-delay:.48s}
.repl-arrow{font-size:30px;color:var(--blue);text-align:center}
.repl-box{background:radial-gradient(140% 160% at 20% 0%,rgba(0,153,255,.25),rgba(0,153,255,.06) 55%,transparent),var(--s1);border:1px solid rgba(0,153,255,.4);border-radius:var(--r-big);padding:40px 34px;text-align:center;box-shadow:0 0 80px rgba(0,153,255,.12)}
.repl-box img{height:26px;margin:0 auto 14px}

/* ---------- Modules alternés ---------- */
.module{display:grid;grid-template-columns:1fr 1fr;gap:54px;align-items:center;padding:54px 0;border-bottom:1px solid var(--hair-soft)}
.module:last-child{border-bottom:none}
.module.flip .mtext{order:2}
.module .n{font-family:var(--display);font-size:14px;color:var(--ac,var(--blue));font-weight:600;letter-spacing:.04em;margin-bottom:10px}
.module h3{font-size:clamp(24px,3vw,34px);letter-spacing:-.035em;margin-bottom:12px}
.module p{color:var(--muted);font-size:15.5px;max-width:46ch}
.module ul{list-style:none;margin-top:16px;display:flex;flex-direction:column;gap:9px}
.module li{color:var(--muted);font-size:14px;padding-left:22px;position:relative}
.module li::before{content:"✓";position:absolute;left:0;color:var(--ac,var(--blue));font-weight:700}

/* ---------- Étapes Lab (storytelling) ---------- */
.steps-lab{display:flex;flex-direction:column;gap:0;position:relative;padding-left:54px}
.steps-lab::before{content:"";position:absolute;left:17px;top:20px;bottom:20px;width:2px;background:linear-gradient(180deg,#8f7bff,#6a4cf5 50%,rgba(106,76,245,.15))}
.step-lab{position:relative;padding:34px 0}
.step-lab .sn{position:absolute;left:-54px;top:34px;width:36px;height:36px;border-radius:50%;background:rgba(106,76,245,.15);border:1px solid rgba(106,76,245,.5);color:#a18fff;display:grid;place-items:center;font-family:var(--display);font-weight:600}
.step-lab h3{font-size:clamp(24px,3.4vw,38px);letter-spacing:-.04em;margin-bottom:10px}
.step-lab p{color:var(--muted);max-width:56ch;font-size:16px}

/* ---------- Pricing ---------- */
.prices{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;align-items:stretch}
.price{background:var(--s1);border:1px solid var(--hair);border-radius:var(--r-card);padding:30px;position:relative;display:flex;flex-direction:column;transition:transform .25s var(--ease),border-color .25s}
.price:hover{transform:translateY(-5px)}
.price.feat{background:var(--s2);border-color:color-mix(in srgb,var(--ac,#0099ff) 45%,transparent);transform:translateY(-8px)}
.price.feat:hover{transform:translateY(-12px)}
.price::before{content:"";position:absolute;top:0;left:0;right:0;height:3px;border-radius:20px 20px 0 0;background:var(--ac,transparent)}
.price .badge{position:absolute;top:-13px;right:20px;background:var(--ac,#0099ff);color:#04121f;font-size:11px;font-weight:700;border-radius:100px;padding:5px 12px}
.price h3{font-size:20px;margin-bottom:4px}
.price .amount{font-family:var(--display);font-size:42px;letter-spacing:-.04em;margin:14px 0 2px}
.price .amount small{font-size:15px;color:var(--muted);font-family:var(--body);letter-spacing:0}
.price ul{list-style:none;margin:18px 0 24px;display:flex;flex-direction:column;gap:10px;flex:1}
.price li{color:var(--muted);font-size:14px;padding-left:22px;position:relative}
.price li::before{content:"✓";position:absolute;left:0;color:var(--ac,#0099ff)}
.price .btn{width:100%}

/* ---------- Divers ---------- */
.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.photo{border-radius:var(--r-card);overflow:hidden;border:1px solid var(--hair);position:relative}
.photo img{width:100%;height:100%;object-fit:cover;transition:transform .6s var(--ease)}
.photo:hover img{transform:scale(1.045)}
.photo .cap{position:absolute;left:14px;bottom:12px;font-size:12px;font-weight:600;text-shadow:0 1px 8px rgba(0,0,0,.8)}
.marquee{overflow:hidden;border-top:1px solid var(--hair-soft);border-bottom:1px solid var(--hair-soft);padding:18px 0;white-space:nowrap}
.marquee .track{display:inline-flex;gap:54px;animation:scroll 30s linear infinite;font-family:var(--display);font-size:19px;color:var(--muted);letter-spacing:-.02em}
.marquee:hover .track{animation-play-state:paused}
@keyframes scroll{to{transform:translateX(-50%)}}
.gstat{display:flex;align-items:center;gap:14px;background:var(--s1);border:1px solid var(--hair);border-radius:var(--r-card);padding:18px 22px}
.gstat .g{width:40px;height:40px;border-radius:50%;background:#fff;display:grid;place-items:center;font-weight:800;color:#1a73e8;font-family:Arial;font-size:19px}
.faq details{border-bottom:1px solid var(--hair-soft);padding:20px 4px}
.faq summary{cursor:pointer;font-weight:600;font-size:16px;list-style:none;display:flex;justify-content:space-between;gap:14px}
.faq summary::after{content:"+";color:var(--muted);font-size:20px}
.faq details[open] summary::after{content:"–"}
.faq p{color:var(--muted);font-size:14.5px;margin-top:12px;max-width:70ch}
.legal{font-size:11.5px;color:#666;line-height:1.55}
footer{border-top:1px solid var(--hair-soft);padding:54px 0 90px;margin-top:40px}
footer .cols{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:30px}
footer h4{font-size:12px;text-transform:uppercase;letter-spacing:.08em;color:#666;margin-bottom:14px;font-family:var(--body)}
footer a,footer p{display:block;font-size:13.5px;color:var(--muted);margin-bottom:9px}
footer a:hover{color:#fff}

/* formulaire contact */
.fld{margin-bottom:16px}
.fld label{display:block;font-size:13px;color:var(--muted);margin-bottom:7px;font-weight:500}
.inp{width:100%;background:var(--s1);border:1px solid var(--hair);border-radius:12px;padding:15px 16px;color:#fff;font-family:inherit;font-size:15px;min-height:52px;transition:.2s}
.inp:focus{outline:none;border-color:var(--blue);box-shadow:0 0 0 3px rgba(0,153,255,.2)}
.choice{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.choice label{border:1px solid var(--hair);background:var(--s1);border-radius:14px;padding:16px;cursor:pointer;font-size:14px;font-weight:600;color:var(--muted);text-align:center;transition:.2s}
.choice input{display:none}
.choice input:checked+span{color:#fff}
.choice label:has(input:checked){border-color:var(--blue);background:rgba(0,153,255,.08);color:#fff}

/* ---------- Reveal & anim ---------- */
.rv{opacity:0;transform:translateY(26px);transition:opacity .42s var(--ease),transform .42s var(--ease)}
.rv.in{opacity:1;transform:none}
.d1{transition-delay:.05s}.d2{transition-delay:.10s}.d3{transition-delay:.15s}.d4{transition-delay:.20s}
.cursor-glow{position:fixed;width:520px;height:520px;border-radius:50%;pointer-events:none;z-index:1;background:radial-gradient(circle,color-mix(in srgb,var(--ac,#0099ff) 7%,transparent),transparent 65%);transform:translate(-50%,-50%);mix-blend-mode:screen;opacity:0;transition:opacity .4s}
body:hover .cursor-glow{opacity:1}

/* ---------- Mobile ---------- */
@media(max-width:880px){
  section{padding:64px 0}
  nav{height:58px;padding:0 16px;gap:12px}
  nav .links{position:fixed;inset:58px 0 auto 0;background:rgba(9,9,9,.97);backdrop-filter:blur(18px);flex-direction:column;padding:18px;gap:6px;border-bottom:1px solid var(--hair);display:none}
  nav .links.open{display:flex}
  nav .links a{font-size:16px;padding:13px}
  .burger{display:grid;place-items:center;width:42px;height:42px;border-radius:12px;background:var(--s1);border:1px solid var(--hair);color:#fff;cursor:pointer;font-size:17px}
  .h-display{font-size:clamp(36px,11vw,52px)}
  .portals,.grid3,.grid2,.prices,.replace,.module,footer .cols{grid-template-columns:1fr}
  .module .mtext{order:0!important}
  .module{gap:26px;padding:38px 0}
  .portal{min-height:340px;padding:30px 24px}
  .repl-arrow{transform:rotate(90deg)}
  .replace.played .rtag{transform:translateY(60px) scale(.7)}
  .btn{width:100%}
  nav .btn,.btn-inline{width:auto}
  .price.feat{transform:none}
  .steps-lab{padding-left:46px}
  .step-lab .sn{left:-46px}
  .ticker{gap:20px}
  .ticker b{font-size:19px}
  .float{animation:none}
  .contact-send{position:sticky;bottom:14px;z-index:5}
}
@media(hover:none){.tilt{transform:none!important}.cursor-glow{display:none}}
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
  html{scroll-behavior:auto}
  .rv{opacity:1;transform:none}
  .replace .rtag{opacity:1!important;transform:none!important}
}

/* ============ V2 — sections riches ============ */
.btn-w::after{content:"";position:absolute;inset:0;border-radius:inherit;background:linear-gradient(110deg,transparent 30%,rgba(255,255,255,.45) 50%,transparent 70%);transform:translateX(-130%);opacity:0;pointer-events:none}
.btn-w:hover::after{opacity:1;transform:translateX(130%);transition:transform .7s var(--ease)}

/* showroom */
.showroom{display:grid;grid-template-columns:1.35fr .65fr;gap:18px;align-items:stretch}
.show-stage{border-radius:var(--r-big);overflow:hidden;border:1px solid var(--hair);position:relative;min-height:420px;background:var(--s1)}
.show-stage img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transform:scale(1.04);transition:opacity .55s var(--ease),transform .9s var(--ease)}
.show-stage img.on{opacity:1;transform:scale(1)}
.show-stage .specs{position:absolute;left:18px;bottom:16px;display:flex;gap:9px;flex-wrap:wrap;z-index:2}
.show-stage .spec{background:rgba(9,9,9,.72);backdrop-filter:blur(8px);border:1px solid rgba(255,255,255,.14);border-radius:100px;padding:7px 14px;font-size:12.5px;font-weight:600}
.show-stage::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 55%,rgba(9,9,9,.55))}
.show-list{display:flex;flex-direction:column;gap:9px}
.show-item{background:var(--s1);border:1px solid var(--hair);border-radius:16px;padding:15px 18px;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:10px;transition:.2s;text-align:left;color:#fff;font-family:inherit}
.show-item small{color:var(--muted);font-size:12px;display:block;font-weight:400}
.show-item b{font-family:var(--display);font-size:15.5px;letter-spacing:-.02em;font-weight:500}
.show-item .pj{font-family:var(--display);color:var(--muted);font-size:14px;white-space:nowrap}
.show-item:hover{border-color:#3a3a3a}
.show-item.on{border-color:color-mix(in srgb,var(--ac,#0099ff) 55%,transparent);background:color-mix(in srgb,var(--ac,#0099ff) 7%,var(--s1))}
.show-item.on .pj{color:var(--ac,#0099ff)}

/* avis google */
.reviews{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.review{background:var(--s1);border:1px solid var(--hair);border-radius:var(--r-card);padding:24px;display:flex;flex-direction:column;gap:12px}
.review .rhead{display:flex;align-items:center;gap:11px}
.review .av{width:38px;height:38px;border-radius:50%;display:grid;place-items:center;font-weight:700;font-size:14px;color:#fff}
.review p{color:var(--muted);font-size:14px;line-height:1.55;flex:1}
.review .rstars{color:#f5b43c;letter-spacing:3px;font-size:13px}
.review .gmark{margin-left:auto;width:22px;height:22px;border-radius:50%;background:#fff;display:grid;place-items:center;font-family:Arial;font-weight:800;color:#1a73e8;font-size:12px}

/* photo marquee */
.pmarquee{overflow:hidden;padding:8px 0}
.pmarquee .ptrack{display:inline-flex;gap:14px;animation:scroll 46s linear infinite}
.pmarquee:hover .ptrack{animation-play-state:paused}
.pmarquee img{height:210px;width:auto;border-radius:16px;border:1px solid var(--hair)}

/* carte villes */
.cities{position:relative;border-radius:var(--r-big);border:1px solid var(--hair);background:radial-gradient(600px 400px at 70% 20%,rgba(0,153,255,.07),transparent),var(--s1);padding:46px 40px;overflow:hidden}
.cities .grid-cities{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:10px;margin-top:26px}
.city{border:1px solid var(--hair);border-radius:14px;padding:14px 16px;font-size:14px;display:flex;align-items:center;gap:10px;background:rgba(9,9,9,.45)}
.city .pin{width:9px;height:9px;border-radius:50%;flex:0 0 auto}
.city.open .pin{background:#22c55e;box-shadow:0 0 0 4px rgba(34,197,94,.15)}
.city.next .pin{background:var(--orange);box-shadow:0 0 0 4px rgba(255,122,61,.15);animation:pulse 2s infinite}
@keyframes pulse{0%,100%{box-shadow:0 0 0 4px rgba(255,122,61,.15)}50%{box-shadow:0 0 0 8px rgba(255,122,61,.06)}}
.city small{color:var(--muted);display:block;font-size:11px}

/* timeline 6 mois (Lab) */
.months{display:grid;grid-template-columns:repeat(6,1fr);gap:10px}
.month{background:var(--s1);border:1px solid var(--hair);border-radius:16px;padding:18px 15px;position:relative;overflow:hidden}
.month::before{content:"";position:absolute;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg,#8f7bff,#6a4cf5)}
.month b{font-family:var(--display);font-size:13px;color:#a18fff;display:block;margin-bottom:7px;letter-spacing:.02em}
.month span{font-size:12.5px;color:var(--muted);line-height:1.45;display:block}

/* modules formation (Lab) */
.fmods{display:grid;grid-template-columns:repeat(3,1fr);gap:13px}
.fmod{background:var(--s1);border:1px solid var(--hair);border-radius:var(--r-card);padding:22px;transition:transform .2s var(--ease),border-color .2s}
.fmod:hover{transform:translateY(-4px);border-color:rgba(106,76,245,.45)}
.fmod .fi{width:40px;height:40px;border-radius:12px;background:rgba(106,76,245,.14);color:#a18fff;display:grid;place-items:center;font-size:17px;margin-bottom:13px}
.fmod b{font-family:var(--display);font-size:16px;font-weight:500;letter-spacing:-.02em;display:block;margin-bottom:6px}
.fmod span{color:var(--muted);font-size:13.5px;line-height:1.5}

/* citation */
.quote{border-radius:var(--r-big);padding:50px 44px;background:radial-gradient(700px 400px at 15% 0%,rgba(106,76,245,.16),transparent),var(--s1);border:1px solid var(--hair);position:relative}
.quote p{font-family:var(--display);font-size:clamp(20px,2.6vw,28px);letter-spacing:-.03em;line-height:1.3;max-width:30ch}
.quote .who{display:flex;align-items:center;gap:12px;margin-top:22px;color:var(--muted);font-size:14px}
.quote .who .av{width:42px;height:42px;border-radius:50%;background:var(--s2);border:1px solid var(--hair);display:grid;place-items:center;font-weight:700;color:#fff}

/* comparateur OS */
.compare{border:1px solid var(--hair);border-radius:var(--r-card);overflow:hidden}
.compare table{width:100%;border-collapse:collapse;font-size:13.5px}
.compare th{background:var(--s2);padding:14px;font-family:var(--display);font-weight:500;font-size:14.5px;letter-spacing:-.02em}
.compare th small{display:block;font-family:var(--body);color:var(--muted);font-weight:400;font-size:11.5px;margin-top:2px}
.compare td{padding:12px 14px;border-top:1px solid var(--hair-soft);color:var(--muted);text-align:center}
.compare td:first-child{text-align:left;color:#fff}
.compare .y{color:#22c55e;font-weight:700}
.compare .n{color:#444}
.compare .opt{color:#f5b43c;font-size:11.5px;font-weight:600}
.compare tr th:nth-child(3){box-shadow:inset 0 3px 0 var(--blue)}

/* personas */
.personas{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.persona{background:var(--s1);border:1px solid var(--hair);border-radius:var(--r-card);padding:26px;position:relative;overflow:hidden}
.persona::before{content:"";position:absolute;top:0;left:0;right:0;height:3px;background:var(--pc,#0099ff)}
.persona .pi{font-size:26px;margin-bottom:12px}
.persona b{font-family:var(--display);font-size:17px;font-weight:500;letter-spacing:-.02em;display:block;margin-bottom:7px}
.persona span{color:var(--muted);font-size:13.5px;line-height:1.55}

/* sélecteur de formule interactif */
.plansel .tabsbar{display:inline-flex;background:var(--s1);border:1px solid var(--hair);border-radius:100px;padding:5px;gap:4px;margin-bottom:22px}
.plansel .tabsbar button{border:none;background:none;color:var(--muted);font-size:14px;font-weight:600;padding:10px 22px;border-radius:100px;cursor:pointer;transition:.2s;font-family:inherit}
.plansel .tabsbar button.on{background:var(--s2);color:#fff;box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--pc,#0099ff) 50%,transparent)}
.plan-feats{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
.pfeat{border:1px solid var(--hair);border-radius:14px;padding:15px 16px;font-size:13px;display:flex;align-items:center;gap:10px;transition:.3s var(--ease)}
.pfeat .ic2{font-size:16px}
.pfeat.off{opacity:.32;filter:grayscale(1)}
.pfeat.off .lockico::after{content:" 🔒"}
.plan-price{font-family:var(--display);font-size:40px;letter-spacing:-.04em;margin:6px 0 18px}
.plan-price small{font-size:15px;color:var(--muted);font-family:var(--body)}

/* étapes contact */
.next-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:26px}
.nstep{background:var(--s1);border:1px solid var(--hair);border-radius:16px;padding:18px}
.nstep b{font-family:var(--display);color:var(--blue);display:block;margin-bottom:6px;font-size:14px}
.nstep span{font-size:13px;color:var(--muted)}

@media(max-width:880px){
  .showroom{grid-template-columns:1fr}
  .show-stage{min-height:300px}
  .show-list{flex-direction:row;overflow-x:auto;padding-bottom:6px}
  .show-item{min-width:190px;flex-direction:column;align-items:flex-start}
  .reviews,.fmods,.personas,.next-steps{grid-template-columns:1fr}
  .months{grid-template-columns:1fr 1fr}
  .plan-feats{grid-template-columns:1fr}
  .pmarquee img{height:150px}
  .compare{overflow-x:auto}
  .compare table{min-width:560px}
  .cities{padding:30px 22px}
}

/* ============ V3 ============ */
.grad-blue{background:linear-gradient(110deg,#fff 10%,#7cc4ff 45%,#0099ff 75%);-webkit-background-clip:text;background-clip:text;color:transparent}
.grad-violet{background:linear-gradient(110deg,#fff 10%,#b9a8ff 45%,#6a4cf5 80%);-webkit-background-clip:text;background-clip:text;color:transparent}
.sec-glow-blue{background:radial-gradient(900px 500px at 50% -10%,rgba(0,153,255,.10),transparent 60%)}
.sec-grad-blue{background:linear-gradient(180deg,transparent,rgba(0,80,160,.10) 30%,rgba(0,153,255,.05) 60%,transparent)}
.divider-grad{height:1px;background:linear-gradient(90deg,transparent,rgba(0,153,255,.5),transparent);border:none;margin:0 auto;max-width:1180px}

/* iPhone 16 Pro Max */
.iphone{width:min(320px,78vw);aspect-ratio:9/19.4;border-radius:54px;position:relative;padding:13px;transform-style:preserve-3d;
  background:linear-gradient(145deg,#3a3a3c,#1c1c1e 40%,#2c2c2e);
  box-shadow:inset 0 0 0 2px #4a4a4d,inset 0 0 0 5px #0a0a0a,0 60px 120px rgba(0,0,0,.65),0 0 90px rgba(0,153,255,.10)}
.iphone::before{content:"";position:absolute;top:24px;left:50%;transform:translateX(-50%);width:108px;height:31px;background:#000;border-radius:20px;z-index:6;box-shadow:inset 0 0 0 1px #111}
.iphone::after{content:"";position:absolute;right:-3px;top:21%;width:3px;height:9%;border-radius:2px;background:#48484a}
.iphone .btnside{position:absolute;left:-3px;top:18%;width:3px;height:5%;border-radius:2px;background:#48484a;box-shadow:0 64px 0 #48484a,0 110px 0 #48484a}
.iphone .screen{width:100%;height:100%;border-radius:42px;overflow:hidden;background:var(--canvas);position:relative}
.iphone .screen video{width:100%;height:100%;object-fit:cover}
.iphone .ui{padding:64px 14px 16px;border-radius:42px}

/* démo interactive */
.demo-tabs{display:flex;gap:8px;flex-wrap:wrap;margin:22px 0}
.demo-tabs button{border:1px solid var(--hair);background:var(--s1);color:var(--muted);font-size:13.5px;font-weight:600;border-radius:100px;padding:11px 18px;cursor:pointer;transition:.25s var(--ease);display:flex;gap:8px;align-items:center;min-height:44px}
.demo-tabs button:hover{border-color:#3a3a3a;color:#fff}
.demo-tabs button.on{background:linear-gradient(120deg,rgba(0,153,255,.22),rgba(0,153,255,.08));border-color:rgba(0,153,255,.6);color:#fff;box-shadow:0 0 24px rgba(0,153,255,.18)}
.demo-screen{position:absolute;inset:0;opacity:0;transform:translateX(26px);transition:opacity .4s var(--ease),transform .4s var(--ease);pointer-events:none}
.demo-screen.on{opacity:1;transform:none;pointer-events:auto}
.demo-cap{min-height:74px}
.demo-cap p{color:var(--muted);font-size:15px;max-width:46ch;animation:capin .4s var(--ease)}
@keyframes capin{from{opacity:0;transform:translateY(8px)}}

/* vitrine PC */
.pcstage{perspective:1400px}
.pcframe{background:linear-gradient(180deg,#1f1f21,#101012);border:1px solid #333;border-radius:18px;padding:12px 12px 0;box-shadow:0 80px 160px rgba(0,0,0,.6),0 0 120px rgba(0,153,255,.08);transform:rotateX(6deg);transform-origin:center bottom}
.pcframe .pcscreen{border-radius:10px 10px 0 0;overflow:hidden;background:var(--canvas);border:1px solid var(--hair-soft);border-bottom:none}
.pcbase{height:16px;background:linear-gradient(180deg,#2a2a2c,#0c0c0c);border-radius:0 0 16px 16px;margin:0 -12px;box-shadow:0 14px 24px rgba(0,0,0,.5)}
.pcfoot{width:170px;height:11px;margin:0 auto;background:linear-gradient(180deg,#161617,#060606);border-radius:0 0 12px 12px}
.osui{display:grid;grid-template-columns:170px 1fr;min-height:380px;font-size:11.5px;color:var(--muted)}
.osui .side{background:#0b0b0b;border-right:1px solid var(--hair-soft);padding:14px 10px}
.osui .side .it{padding:7px 10px;border-radius:7px;margin-bottom:2px;font-weight:500;font-size:11.5px}
.osui .side .it.on{background:rgba(0,153,255,.13);color:#fff;border-left:2px solid var(--blue)}
.osui .mainz{padding:16px}
.osui .krow{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-bottom:10px}
.osui .k2{background:var(--s1);border:1px solid var(--hair);border-radius:10px;padding:10px;position:relative;overflow:hidden}
.osui .k2::before{content:"";position:absolute;top:0;left:0;right:0;height:2px;background:var(--kc,var(--blue))}
.osui .k2 b{display:block;color:#fff;font-family:var(--display);font-size:17px;letter-spacing:-.02em;margin-top:3px}
.osui .gantt{display:grid;grid-template-columns:110px repeat(10,1fr);gap:3px;align-items:center;margin-top:6px}
.osui .gantt .gl{font-size:10.5px;color:#fff;font-weight:600;white-space:nowrap;overflow:hidden}
.osui .gantt .gc{height:16px;border-radius:4px;background:var(--s1)}
.osui .gantt .gc.b{background:linear-gradient(90deg,#0077cc,#0099ff)}
.osui .gantt .gc.g{background:linear-gradient(90deg,#16a34a,#22c55e)}
.osui .gantt .gc.a{background:linear-gradient(90deg,#d97706,#f59e0b)}

/* configurateur + panier */
.config{display:grid;grid-template-columns:1.1fr .9fr;gap:20px;align-items:start}
.copt{display:flex;align-items:center;gap:12px;border:1px solid var(--hair);background:var(--s1);border-radius:14px;padding:14px 16px;cursor:pointer;transition:.2s;margin-bottom:9px}
.copt:hover{border-color:#3a3a3a}
.copt.on{border-color:color-mix(in srgb,var(--cc,#0099ff) 60%,transparent);background:color-mix(in srgb,var(--cc,#0099ff) 8%,var(--s1))}
.copt .cbox{width:22px;height:22px;border-radius:7px;border:1.5px solid var(--hair);display:grid;place-items:center;color:transparent;font-size:13px;flex:0 0 auto;transition:.15s}
.copt.on .cbox{background:var(--cc,#0099ff);border-color:var(--cc,#0099ff);color:#fff}
.copt b{font-size:14.5px;display:block}
.copt small{color:var(--muted);font-size:12px}
.copt .cprix{margin-left:auto;font-family:var(--display);font-size:15px;white-space:nowrap}
.cart{position:sticky;top:84px;background:radial-gradient(400px 260px at 80% 0%,color-mix(in srgb,var(--cc,#0099ff) 14%,transparent),transparent),var(--s1);border:1px solid color-mix(in srgb,var(--cc,#0099ff) 35%,var(--hair));border-radius:var(--r-card);padding:26px}
.cart .cline{display:flex;justify-content:space-between;gap:10px;padding:8px 0;border-bottom:1px solid var(--hair-soft);font-size:13.5px;color:var(--muted)}
.cart .cline b{color:#fff;font-weight:500}
.cart .ctot{display:flex;justify-content:space-between;align-items:baseline;padding-top:14px}
.cart .ctot .v{font-family:var(--display);font-size:34px;letter-spacing:-.04em}
.cart .badge-cart{position:relative}
.bump{animation:bump .35s var(--ease)}
@keyframes bump{30%{transform:scale(1.12)}}

/* simulateur site */
.sim{display:grid;grid-template-columns:1fr 1fr;gap:20px;align-items:start}
.sim .srange{margin-bottom:20px}
.sim label{display:flex;justify-content:space-between;font-size:13.5px;color:var(--muted);margin-bottom:9px}
.sim label b{color:#fff;font-family:var(--display);letter-spacing:-.02em}
input[type=range].rg{-webkit-appearance:none;appearance:none;width:100%;height:6px;border-radius:100px;background:linear-gradient(90deg,#0099ff var(--p,50%),var(--s2) var(--p,50%))}
input[type=range].rg::-webkit-slider-thumb{-webkit-appearance:none;width:22px;height:22px;border-radius:50%;background:#fff;border:3px solid #0099ff;cursor:pointer;box-shadow:0 2px 10px rgba(0,153,255,.4)}
.simout{background:radial-gradient(420px 280px at 20% 0%,rgba(0,153,255,.16),transparent),var(--s1);border:1px solid rgba(0,153,255,.35);border-radius:var(--r-card);padding:28px}
.simout .big{font-family:var(--display);font-size:clamp(38px,4.4vw,54px);letter-spacing:-.04em}
.simbar{height:12px;border-radius:100px;display:flex;overflow:hidden;background:var(--s2);margin:16px 0 8px}
.simbar i{display:block;height:100%;transition:width .5s var(--ease)}

/* carte de France */
.france{position:relative;max-width:560px;margin:0 auto}
.france svg{width:100%;height:auto;filter:drop-shadow(0 30px 60px rgba(0,153,255,.12))}
.fpath{fill:rgba(0,153,255,.05);stroke:rgba(0,153,255,.45);stroke-width:2}
.fgrid{stroke:rgba(0,153,255,.08);stroke-width:1}
.fpin{position:absolute;transform:translate(-50%,-50%);display:flex;flex-direction:column;align-items:center;gap:4px}
.fpin .pp{width:13px;height:13px;border-radius:50%;border:2.5px solid var(--canvas)}
.fpin.o .pp{background:#22c55e;box-shadow:0 0 0 5px rgba(34,197,94,.18),0 0 18px rgba(34,197,94,.5)}
.fpin.n .pp{background:var(--orange);box-shadow:0 0 0 5px rgba(255,122,61,.16);animation:pulse 2.2s infinite}
.fpin span{font-size:10.5px;font-weight:700;background:rgba(9,9,9,.8);border:1px solid var(--hair);padding:2px 8px;border-radius:100px;white-space:nowrap;backdrop-filter:blur(4px)}
.fpin.n span{color:#ffb38d}
.fpin.o span{color:#7be3a3}

/* feed insta */
.insta{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.ipost{background:var(--s1);border:1px solid var(--hair);border-radius:18px;overflow:hidden;transition:transform .25s var(--ease),border-color .25s}
.ipost:hover{transform:translateY(-5px);border-color:#3a3a3a}
.ipost .ihead{display:flex;align-items:center;gap:9px;padding:11px 13px}
.ipost .iav{width:30px;height:30px;border-radius:50%;background:conic-gradient(#f09433,#e6683c,#dc2743,#cc2366,#bc1888,#f09433);display:grid;place-items:center}
.ipost .iav i{width:24px;height:24px;border-radius:50%;background:var(--s2);display:grid;place-items:center;font-style:normal;font-size:10px;font-weight:800;color:#fff}
.ipost .ihead b{font-size:12.5px}
.ipost .ihead small{color:var(--muted);font-size:10.5px;display:block}
.ipost img{aspect-ratio:1;object-fit:cover;width:100%}
.ipost .ibody{padding:11px 13px}
.ipost .iacts{font-size:14px;letter-spacing:4px;margin-bottom:7px}
.ipost .icap{font-size:12px;color:var(--muted);line-height:1.5}
.ipost .icap b{color:#fff}
.ipost .ilikes{font-size:11.5px;font-weight:700;margin-bottom:4px}

/* tirage au sort */
.raffle{border-radius:var(--r-big);padding:54px 46px;position:relative;overflow:hidden;background:
  radial-gradient(700px 420px at 12% 0%,rgba(0,153,255,.35),transparent 55%),
  radial-gradient(600px 420px at 95% 100%,rgba(106,76,245,.4),transparent 55%),
  linear-gradient(160deg,#0c1726,#0a0a14)}
.raffle::before{content:"";position:absolute;inset:0;background-image:radial-gradient(rgba(255,255,255,.16) 1px,transparent 1px);background-size:26px 26px;mask-image:radial-gradient(600px 360px at 50% 0%,#000,transparent)}
.raffle .rbadge{display:inline-flex;align-items:center;gap:8px;background:linear-gradient(120deg,#f5b43c,#ff7a3d);color:#1d0f02;font-weight:800;font-size:12px;border-radius:100px;padding:7px 15px;letter-spacing:.05em;text-transform:uppercase;margin-bottom:18px}
.raffle h2{font-size:clamp(30px,4.4vw,52px);letter-spacing:-.045em;line-height:1.02}

/* lien corsiva.fr */
.rentcard{display:grid;grid-template-columns:1fr 1fr;border-radius:var(--r-big);overflow:hidden;border:1px solid var(--hair);background:var(--s1)}
.rentcard .rimg{min-height:300px;position:relative}
.rentcard .rimg img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.rentcard .rtxt{padding:44px 40px;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;gap:14px}

@media(max-width:880px){
  .config,.sim,.rentcard{grid-template-columns:1fr}
  .cart{position:static}
  .insta{grid-template-columns:1fr}
  .osui{grid-template-columns:1fr}
  .osui .side{display:none}
  .pcframe{transform:none}
  .demo-tabs{overflow-x:auto;flex-wrap:nowrap;padding-bottom:6px}
  .iphone{width:min(290px,80vw)}
  .raffle{padding:34px 24px}
}

/* ============ V4 ============ */
/* nav centrée flottante */
nav{justify-content:center;height:auto;padding:14px 16px;border-bottom:none;background:none!important;backdrop-filter:none!important}
nav .navpill{display:flex;align-items:center;gap:6px;background:rgba(12,12,12,.55);border:1px solid rgba(255,255,255,.10);border-radius:100px;padding:7px 9px;backdrop-filter:blur(18px);box-shadow:0 12px 40px rgba(0,0,0,.35);transition:background .3s,border-color .3s}
nav.scrolled .navpill{background:rgba(10,10,10,.82);border-color:rgba(255,255,255,.14)}
nav .brand{padding:0 14px 0 10px;display:flex;align-items:center}
nav .links{margin-left:0}
nav .links a{font-family:var(--display);font-weight:500;font-size:14px;letter-spacing:-.015em;color:rgba(255,255,255,.65);padding:9px 15px}
nav .links a:hover,nav .links a.on{color:#fff;background:rgba(255,255,255,.08)}
nav .spacer{display:none}
nav .navpill>.btn{margin-left:8px}
@media(max-width:880px){
  nav{padding:10px}
  nav .navpill{width:100%;justify-content:space-between}
  nav .links{position:fixed;top:74px;left:10px;right:10px;border-radius:22px;border:1px solid var(--hair)}
}

/* heros V4 (OS & Lab) — propre, structuré */
.hero4{min-height:100svh;display:flex;align-items:center;padding:140px 0 90px;position:relative;overflow:hidden}
.hero4 .gridbg{position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);background-size:72px 72px;mask-image:radial-gradient(900px 600px at 50% 10%,#000,transparent)}
.hero4 .orb{position:absolute;width:680px;height:680px;border-radius:50%;filter:blur(110px);opacity:.30;pointer-events:none}
.hero4 .center{text-align:center;max-width:900px;margin:0 auto;position:relative}
.hero4 .pillbadge{display:inline-flex;align-items:center;gap:9px;border:1px solid color-mix(in srgb,var(--hc,#0099ff) 40%,transparent);background:color-mix(in srgb,var(--hc,#0099ff) 10%,transparent);color:#fff;border-radius:100px;padding:8px 18px;font-size:13px;font-weight:600;margin-bottom:26px}
.hero4 .pillbadge .pdot{width:8px;height:8px;border-radius:50%;background:var(--hc,#0099ff);box-shadow:0 0 12px var(--hc,#0099ff)}
.hero4 h1{font-size:clamp(40px,6.6vw,86px);line-height:.97;letter-spacing:-.045em}
.hero4 .sub{font-size:clamp(16px,2vw,19px);color:var(--muted);max-width:56ch;margin:22px auto 30px;line-height:1.6}
.hero4 .ctas{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}
.hero4 .heromedia{margin-top:60px;position:relative}
.scrollhint{position:absolute;bottom:26px;left:50%;transform:translateX(-50%);width:24px;height:40px;border:1.5px solid rgba(255,255,255,.25);border-radius:14px}
.scrollhint::after{content:"";position:absolute;top:7px;left:50%;width:4px;height:8px;margin-left:-2px;border-radius:3px;background:rgba(255,255,255,.6);animation:wheel 1.8s infinite}
@keyframes wheel{0%{transform:translateY(0);opacity:1}70%{transform:translateY(12px);opacity:0}100%{opacity:0}}

/* cartes offres V4 — image + dégradé, sans bande */
.offers{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;align-items:stretch}
.offer{border-radius:24px;overflow:hidden;border:1px solid var(--hair);background:var(--s1);display:flex;flex-direction:column;position:relative;transition:transform .3s var(--ease),border-color .3s,box-shadow .3s}
.offer:hover{transform:translateY(-7px);border-color:color-mix(in srgb,var(--oc,#0099ff) 45%,var(--hair));box-shadow:0 30px 70px rgba(0,0,0,.45)}
.offer .ohead{position:relative;aspect-ratio:16/8.4;overflow:hidden}
.offer .ohead img{width:100%;height:100%;object-fit:cover;transition:transform .8s var(--ease)}
.offer:hover .ohead img{transform:scale(1.06)}
.offer .ohead::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 20%,color-mix(in srgb,var(--oc,#0099ff) 14%,rgba(9,9,9,.45)) 70%,var(--s1) 100%)}
.offer .otag{position:absolute;top:13px;left:13px;z-index:2;background:rgba(9,9,9,.7);backdrop-filter:blur(8px);border:1px solid color-mix(in srgb,var(--oc,#0099ff) 50%,transparent);color:#fff;font-size:11.5px;font-weight:700;border-radius:100px;padding:6px 13px;letter-spacing:.04em;text-transform:uppercase}
.offer .otag.star{background:linear-gradient(120deg,color-mix(in srgb,var(--oc,#0099ff) 85%,#fff),var(--oc,#0099ff));border:none;color:#04101c}
.offer .obody{padding:22px 24px 26px;display:flex;flex-direction:column;flex:1;margin-top:-34px;position:relative;z-index:2}
.offer h3{font-size:21px;letter-spacing:-.03em}
.offer .oprice{font-family:var(--display);font-size:38px;letter-spacing:-.04em;margin:10px 0 2px}
.offer .oprice small{font-size:14px;color:var(--muted);font-family:var(--body);letter-spacing:0}
.offer .odesc{color:var(--muted);font-size:13.5px;margin-bottom:14px}
.offer ul{list-style:none;display:flex;flex-direction:column;gap:9px;margin:6px 0 22px;flex:1}
.offer li{color:var(--muted);font-size:13.5px;padding-left:24px;position:relative}
.offer li::before{content:"";position:absolute;left:0;top:7px;width:13px;height:2px;background:var(--oc,#0099ff);border-radius:2px}
.offer .btn{width:100%}

/* section vidéos / présence */
.vidgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.vid{position:relative;border-radius:20px;overflow:hidden;border:1px solid var(--hair);aspect-ratio:9/13;cursor:pointer;background:var(--s1)}
.vid.wide{aspect-ratio:16/10;grid-column:span 2}
.vid video{width:100%;height:100%;object-fit:cover;transition:transform .7s var(--ease)}
.vid:hover video{transform:scale(1.04)}
.vid .vcap{position:absolute;left:16px;bottom:14px;z-index:2;font-family:var(--display);font-size:15px;letter-spacing:-.02em;text-shadow:0 2px 14px rgba(0,0,0,.8)}
.vid .vloc{position:absolute;top:13px;left:13px;z-index:2;background:rgba(9,9,9,.65);backdrop-filter:blur(6px);border:1px solid rgba(255,255,255,.14);font-size:11px;font-weight:600;border-radius:100px;padding:5px 12px}
.vid::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 55%,rgba(9,9,9,.6))}
.vid .vplay{position:absolute;inset:0;display:grid;place-items:center;z-index:3;opacity:0;transition:.3s}
.vid:hover .vplay{opacity:1}
.vid .vplay i{width:58px;height:58px;border-radius:50%;background:rgba(255,255,255,.92);display:grid;place-items:center;font-style:normal;color:#000;font-size:18px;padding-left:4px}

/* section mariages */
.wed{display:grid;grid-template-columns:1.05fr .95fr;gap:50px;align-items:center}
.wedphotos{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.wedphotos .photo:first-child{grid-column:span 2;aspect-ratio:16/8}
.wedphotos .photo{aspect-ratio:4/3.4}

/* autodemo : une réservation se crée toute seule */
.autodemo{position:relative}
.ad-step{display:none;flex-direction:column;gap:9px}
.ad-step.on{display:flex;animation:adin .45s var(--ease)}
@keyframes adin{from{opacity:0;transform:translateY(12px)}}
.ad-progress{display:flex;gap:6px;margin-bottom:12px}
.ad-progress i{height:3px;flex:1;border-radius:3px;background:var(--s2);overflow:hidden;position:relative}
.ad-progress i.done{background:var(--blue)}
.ad-progress i.cur::after{content:"";position:absolute;inset:0;background:var(--blue);transform-origin:left;animation:adbar var(--dur,3.2s) linear forwards}
@keyframes adbar{from{transform:scaleX(0)}to{transform:scaleX(1)}}
.ad-type::after{content:"|";animation:blink 1s steps(1) infinite;color:var(--blue)}
@keyframes blink{50%{opacity:0}}
.ad-toast{background:rgba(34,197,94,.13);border:1px solid rgba(34,197,94,.45);border-radius:12px;padding:11px 13px;font-size:11px;color:#7be3a3;font-weight:600;display:flex;gap:9px;align-items:center}
.ad-steps-list{display:flex;flex-direction:column;gap:14px}
.ad-li{display:flex;gap:14px;align-items:flex-start;opacity:.35;transition:.4s var(--ease)}
.ad-li.cur{opacity:1}
.ad-li .adn{width:30px;height:30px;border-radius:50%;background:var(--s1);border:1px solid var(--hair);display:grid;place-items:center;font-family:var(--display);font-size:13px;flex:0 0 auto;transition:.3s}
.ad-li.cur .adn{background:rgba(0,153,255,.15);border-color:var(--blue);color:#fff;box-shadow:0 0 18px rgba(0,153,255,.3)}
.ad-li b{font-size:15px;display:block;font-family:var(--display);font-weight:500;letter-spacing:-.02em}
.ad-li span{color:var(--muted);font-size:13px}

/* titres de section V4 */
.sechead{text-align:center;max-width:780px;margin:0 auto 50px}
.sechead .eyebrow{margin-bottom:18px}
.sechead .lead{margin:14px auto 0}

@media(max-width:880px){
  .offers{grid-template-columns:1fr}
  .vidgrid{grid-template-columns:1fr}
  .vid.wide{grid-column:span 1;aspect-ratio:16/11}
  .wed{grid-template-columns:1fr;gap:26px}
}

/* ============ V5 ============ */
/* remplace : plus lent, plus visible */
.rtag{transition:transform 1.4s var(--ease),opacity 1.4s}
.rtag:nth-child(2){transition-delay:.22s}.rtag:nth-child(3){transition-delay:.44s}.rtag:nth-child(4){transition-delay:.66s}.rtag:nth-child(5){transition-delay:.88s}.rtag:nth-child(6){transition-delay:1.1s}.rtag:nth-child(7){transition-delay:1.32s}

/* cascades génériques (façon "remplace") */
.cascade>*{opacity:0;transform:translateY(34px) scale(.96);transition:opacity .34s var(--ease),transform .34s var(--ease)}
.cascade.played>*{opacity:1;transform:none}
.cascade.from-right>*{transform:translateX(70px)}
.cascade.from-right.played>*{transform:none}

/* logo google */
.gg{width:22px;height:22px;display:inline-block;vertical-align:middle}
.gstat .g{background:#fff;padding:8px}
.gstat .g img{width:100%;height:100%}

/* carte de France V5 — dessin + pins séquencés */
.fpath{stroke-dasharray:3200;stroke-dashoffset:3200}
.france.played .fpath{animation:drawfr 2.6s var(--ease) forwards}
@keyframes drawfr{to{stroke-dashoffset:0}}
.fpin{opacity:0;transform:translate(-50%,-50%) scale(.3)}
.france.played .fpin{animation:pinpop .55s var(--ease) forwards}
@keyframes pinpop{60%{transform:translate(-50%,-50%) scale(1.25)}100%{opacity:1;transform:translate(-50%,-50%) scale(1)}}
.fpin.o .pp{animation:glowg 2.6s ease-in-out infinite}
@keyframes glowg{0%,100%{box-shadow:0 0 0 5px rgba(34,197,94,.18),0 0 14px rgba(34,197,94,.45)}50%{box-shadow:0 0 0 9px rgba(34,197,94,.08),0 0 30px rgba(34,197,94,.85)}}

/* section IA — couleurs qui cassent / s'allument */
.ia{position:relative;overflow:hidden;border-radius:var(--r-big);padding:64px 50px;border:1px solid rgba(255,255,255,.08);background:#07070c}
.ia .iabg{position:absolute;inset:-40%;background:conic-gradient(from 0deg,#0099ff,#6a4cf5,#d44df0,#19c6c6,#0099ff);filter:blur(120px);opacity:.28;animation:iaspin 16s linear infinite}
@keyframes iaspin{to{transform:rotate(360deg)}}
.ia .iagrid{position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.05) 1px,transparent 1px);background-size:54px 54px;mask-image:radial-gradient(700px 420px at 50% 0%,#000,transparent)}
.ia>*{position:relative}
.iabadge{display:inline-flex;align-items:center;gap:9px;border-radius:100px;padding:8px 18px;font-size:12.5px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:#fff;background:linear-gradient(120deg,rgba(0,153,255,.3),rgba(212,77,240,.3));border:1px solid rgba(212,77,240,.5);margin-bottom:20px}
.iabadge .pdot{width:8px;height:8px;border-radius:50%;background:#d44df0;box-shadow:0 0 14px #d44df0;animation:blinkdot 1.6s infinite}
@keyframes blinkdot{50%{opacity:.3}}
.iagrid2{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:36px}
.iacard{background:rgba(10,10,16,.7);backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.1);border-radius:18px;padding:22px;position:relative;overflow:hidden;transition:border-color .5s}
.iacard::before{content:"";position:absolute;inset:0;border-radius:18px;padding:1px;background:linear-gradient(120deg,var(--ic1,#0099ff),var(--ic2,#d44df0));-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask-composite:exclude;opacity:0;transition:opacity .8s}
.cascade.played .iacard::before{opacity:1}
.iacard .iic{width:40px;height:40px;border-radius:12px;display:grid;place-items:center;font-size:17px;margin-bottom:13px;background:linear-gradient(120deg,color-mix(in srgb,var(--ic1,#0099ff) 25%,transparent),color-mix(in srgb,var(--ic2,#d44df0) 25%,transparent));color:#fff}
.iacard b{font-family:var(--display);font-size:16px;font-weight:500;letter-spacing:-.02em;display:block;margin-bottom:6px}
.iacard span{color:var(--muted);font-size:13px;line-height:1.5}

/* hero OS : plateforme vivante en fond */
.heroplatform{position:absolute;inset:0;z-index:-1;perspective:1400px;overflow:hidden}
.heroplatform .plat{position:absolute;left:50%;top:54%;width:min(1240px,120vw);transform:translateX(-50%) rotateX(38deg) scale(1.05);transform-origin:center top;opacity:.5;mask-image:linear-gradient(180deg,transparent 0%,#000 16%,#000 60%,transparent 96%)}
.heroplatform .plat .osui{animation:platpan 22s ease-in-out infinite alternate}
@keyframes platpan{from{transform:translateX(-28px) translateY(0)}to{transform:translateX(28px) translateY(-22px)}}
.floatcard{position:absolute;background:rgba(14,14,18,.78);backdrop-filter:blur(12px);border:1px solid rgba(0,153,255,.35);border-radius:16px;padding:13px 17px;font-size:12px;color:var(--muted);box-shadow:0 24px 60px rgba(0,0,0,.5),0 0 40px rgba(0,153,255,.10);animation:floaty 9s ease-in-out infinite}
.floatcard b{display:block;color:#fff;font-family:var(--display);font-size:18px;letter-spacing:-.02em}
.floatcard.f2{animation-delay:-3s;animation-duration:11s;border-color:rgba(106,76,245,.4)}
.floatcard.f3{animation-delay:-6s;animation-duration:10s;border-color:rgba(34,197,94,.4)}
@keyframes floaty{0%,100%{transform:translateY(0) rotate(-.5deg)}50%{transform:translateY(-22px) rotate(.5deg)}}

/* CTA bands 3D (sans image) */
.cta3d{border-radius:var(--r-big);padding:58px 50px;text-align:center;position:relative;overflow:hidden;transform-style:preserve-3d;background:
 radial-gradient(640px 360px at 18% 0%,color-mix(in srgb,var(--cta,#0099ff) 28%,transparent),transparent 60%),
 radial-gradient(560px 380px at 90% 100%,color-mix(in srgb,var(--cta,#0099ff) 16%,transparent),transparent 60%),var(--s1);
 border:1px solid color-mix(in srgb,var(--cta,#0099ff) 35%,var(--hair))}
.cta3d::before{content:"";position:absolute;inset:0;background-image:radial-gradient(rgba(255,255,255,.13) 1px,transparent 1px);background-size:24px 24px;mask-image:radial-gradient(560px 300px at 50% 0%,#000,transparent)}
.cta3d h2{font-size:clamp(28px,4vw,48px);letter-spacing:-.045em;transform:translateZ(46px)}
.cta3d p{color:var(--muted);max-width:54ch;margin:14px auto 28px;transform:translateZ(30px);position:relative}
.cta3d .ctas{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;transform:translateZ(56px)}
.cta3d .mini{font-size:12px;color:var(--muted);margin-top:18px;position:relative}

/* vidéo formation (reel 9:16 cadre lumineux) */
.reelframe{border-radius:28px;overflow:hidden;border:1px solid rgba(106,76,245,.4);box-shadow:0 50px 110px rgba(0,0,0,.6),0 0 80px rgba(106,76,245,.16);aspect-ratio:9/14;max-width:380px}
.reelframe video{width:100%;height:100%;object-fit:cover}

@media(max-width:880px){
  .iagrid2{grid-template-columns:1fr}
  .ia{padding:36px 22px}
  .cta3d{padding:38px 22px}
  .heroplatform .plat{width:200vw;opacity:.35}
  .floatcard{display:none}
}
.heroplatform::after{content:"";position:absolute;inset:0;background:radial-gradient(860px 520px at 50% 44%,rgba(7,7,10,.92),rgba(7,7,10,.45) 55%,transparent 78%)}

/* ============ V6 ============ */
/* hero OS : plateforme plus basse + voile renforcé */
.heroplatform .plat{top:62%;opacity:.42}
.heroplatform::after{background:radial-gradient(900px 560px at 50% 40%,rgba(7,7,10,.96),rgba(7,7,10,.55) 58%,transparent 80%)}

/* cartes formules OS — produit, sans photo */
.planhead{position:relative;aspect-ratio:16/7;overflow:hidden;display:flex;align-items:center;justify-content:center;background:
 radial-gradient(420px 240px at 18% 0%,color-mix(in srgb,var(--oc,#0099ff) 38%,transparent),transparent 60%),
 radial-gradient(380px 240px at 95% 110%,color-mix(in srgb,var(--oc,#0099ff) 22%,transparent),transparent 60%),#0b0d12}
.planhead::before{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.05) 1px,transparent 1px);background-size:34px 34px;mask-image:radial-gradient(420px 220px at 50% 50%,#000,transparent)}
.planhead .pword{font-family:var(--display);font-weight:600;font-size:30px;letter-spacing:-.04em;color:#fff;position:relative}
.planhead .pword span{color:var(--oc,#0099ff)}
.planhead .pmods{position:absolute;bottom:13px;left:0;right:0;display:flex;justify-content:center;gap:7px}
.planhead .pmods i{width:26px;height:26px;border-radius:8px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12);display:grid;place-items:center;font-style:normal;font-size:11px;color:var(--muted)}
.planhead .pmods i.on{background:color-mix(in srgb,var(--oc,#0099ff) 22%,transparent);border-color:color-mix(in srgb,var(--oc,#0099ff) 55%,transparent);color:#fff}

/* personas V6 — propres, sans emoji */
.persona{padding:28px 26px}
.persona::before{height:2px;opacity:.8}
.persona .pi{font-size:initial;width:46px;height:46px;border-radius:14px;display:grid;place-items:center;margin-bottom:16px;background:color-mix(in srgb,var(--pc,#0099ff) 14%,transparent);border:1px solid color-mix(in srgb,var(--pc,#0099ff) 40%,transparent);color:var(--pc,#0099ff);font-family:var(--display);font-weight:600;font-size:15px;letter-spacing:0}
.persona .ptag{display:inline-block;font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--pc,#0099ff);margin-bottom:8px}

/* carte de France — WOW : lignes + radar */
.fline{fill:none;stroke:url(#lg);stroke-width:2;stroke-linecap:round;stroke-dasharray:400;stroke-dashoffset:400;opacity:0}
.france.played .fline{animation:linedraw 1.1s var(--ease) forwards}
@keyframes linedraw{1%{opacity:1}100%{opacity:.85;stroke-dashoffset:0}}
.radar{position:absolute;left:73%;top:48.5%;width:14px;height:14px;transform:translate(-50%,-50%);pointer-events:none}
.radar i{position:absolute;inset:0;border-radius:50%;border:1.5px solid rgba(0,153,255,.65)}
.france.played .radar i{animation:radar 3s ease-out infinite}
.france.played .radar i:nth-child(2){animation-delay:1s}
.france.played .radar i:nth-child(3){animation-delay:2s}
@keyframes radar{from{transform:scale(1);opacity:.9}to{transform:scale(16);opacity:0}}
.mapcount{display:flex;gap:26px;margin-top:22px}
.mapcount b{font-family:var(--display);font-size:30px;letter-spacing:-.03em;display:block}
.mapcount span{font-size:12px;color:var(--muted);text-transform:uppercase;letter-spacing:.06em}

/* piliers home (3D sans image) */
.pillars{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.pillar{border-radius:24px;padding:34px 30px;position:relative;overflow:hidden;border:1px solid color-mix(in srgb,var(--plc,#0099ff) 30%,var(--hair));background:radial-gradient(380px 260px at 20% 0%,color-mix(in srgb,var(--plc,#0099ff) 18%,transparent),transparent 65%),var(--s1);transform-style:preserve-3d;transition:transform .3s var(--ease),box-shadow .3s}
.pillar:hover{transform:translateY(-6px);box-shadow:0 30px 70px rgba(0,0,0,.45)}
.pillar .pn{font-family:var(--display);font-size:52px;letter-spacing:-.05em;color:color-mix(in srgb,var(--plc,#0099ff) 55%,transparent);line-height:1}
.pillar h3{font-size:22px;letter-spacing:-.03em;margin:12px 0 8px;transform:translateZ(24px)}
.pillar p{color:var(--muted);font-size:14px;line-height:1.55}
.pillar img{height:20px;margin-top:18px;opacity:.95}

/* pont OS dans la formation */
.osbridge{display:grid;grid-template-columns:1fr .9fr;gap:46px;align-items:center;border-radius:var(--r-big);border:1px solid rgba(0,153,255,.3);padding:46px 44px;background:radial-gradient(620px 360px at 90% 10%,rgba(0,153,255,.16),transparent 60%),var(--s1);overflow:hidden}
.osbridge .miniplat{border-radius:16px;border:1px solid rgba(0,153,255,.35);overflow:hidden;box-shadow:0 40px 90px rgba(0,0,0,.5),0 0 60px rgba(0,153,255,.12);transform:rotateX(3deg) rotateY(-4deg)}
@media(max-width:880px){
  .pillars{grid-template-columns:1fr}
  .osbridge{grid-template-columns:1fr;padding:28px 20px}
  .mapcount{gap:16px}
  .planhead{aspect-ratio:16/6}
}

/* ============ V7 ============ */
/* hero OS — flux d'activité en direct */
.feedhero{position:relative}
.livefeed{max-width:560px;margin:54px auto 0;background:rgba(10,11,15,.72);backdrop-filter:blur(16px);border:1px solid rgba(0,153,255,.3);border-radius:22px;overflow:hidden;box-shadow:0 50px 110px rgba(0,0,0,.55),0 0 70px rgba(0,153,255,.10);text-align:left}
.livefeed .lfhead{display:flex;align-items:center;gap:10px;padding:13px 17px;border-bottom:1px solid var(--hair-soft);font-size:12.5px;color:var(--muted)}
.livefeed .lfdot{width:8px;height:8px;border-radius:50%;background:#22c55e;box-shadow:0 0 10px #22c55e;animation:blinkdot 1.6s infinite}
.livefeed .lfbody{padding:10px 12px;height:236px;overflow:hidden;display:flex;flex-direction:column;justify-content:flex-end;gap:7px}
.lfline{display:flex;align-items:center;gap:11px;background:var(--s1);border:1px solid var(--hair);border-radius:12px;padding:9px 13px;font-size:12.5px;color:var(--muted);animation:lfin .5s var(--ease)}
@keyframes lfin{from{opacity:0;transform:translateY(16px) scale(.97)}}
.lfline .lfc{width:30px;height:30px;border-radius:9px;display:grid;place-items:center;font-size:13px;flex:0 0 auto;background:color-mix(in srgb,var(--lc,#0099ff) 16%,transparent);color:var(--lc,#0099ff);border:1px solid color-mix(in srgb,var(--lc,#0099ff) 38%,transparent)}
.lfline b{color:#fff;font-weight:600}
.lfline .lft{margin-left:auto;font-size:10.5px;color:#555;font-variant-numeric:tabular-nums;flex:0 0 auto}

/* hero Lab — vidéo duotone violet plein écran */
.hero-bg.duov::after{background:linear-gradient(180deg,rgba(28,12,64,.72),rgba(15,8,40,.55) 50%,var(--canvas) 97%)}
.hero-bg.duov video{opacity:.55;filter:saturate(.8) contrast(1.05)}

/* espace de cours / visio animé */
.course{border-radius:22px;overflow:hidden;border:1px solid rgba(106,76,245,.4);background:#0c0c12;box-shadow:0 50px 110px rgba(0,0,0,.55),0 0 70px rgba(106,76,245,.12);font-size:11.5px;color:var(--muted)}
.course .chead{display:flex;align-items:center;gap:9px;padding:11px 15px;border-bottom:1px solid var(--hair-soft)}
.course .chead .rec{width:8px;height:8px;border-radius:50%;background:#ef4444;animation:blinkdot 1.4s infinite}
.course .cgrid{display:grid;grid-template-columns:1fr 168px}
.course .cstage{position:relative;aspect-ratio:16/9.6;background:radial-gradient(360px 220px at 50% 40%,rgba(106,76,245,.22),transparent),#0a0a10;display:grid;place-items:center}
.course .coach{width:84px;height:84px;border-radius:50%;background:linear-gradient(135deg,#8f7bff,#6a4cf5);display:grid;place-items:center;font-family:var(--display);font-weight:600;font-size:24px;color:#fff;position:relative}
.course .coach::after{content:"";position:absolute;inset:-7px;border-radius:50%;border:2px solid rgba(143,123,255,.55);animation:speak 1.6s ease-out infinite}
@keyframes speak{from{transform:scale(.92);opacity:1}to{transform:scale(1.25);opacity:0}}
.course .cname{position:absolute;left:12px;bottom:10px;background:rgba(9,9,9,.7);border-radius:8px;padding:4px 10px;font-size:10.5px;color:#fff}
.course .ppl{position:absolute;right:12px;bottom:10px;display:flex;gap:6px}
.course .ppl i{width:34px;height:34px;border-radius:9px;background:var(--s2);border:1px solid var(--hair);display:grid;place-items:center;font-style:normal;font-size:10px;color:#fff;font-weight:700}
.course .ppl i:nth-child(2){animation:talk 3.4s infinite}
.course .ppl i:nth-child(3){animation:talk 3.4s 1.7s infinite}
@keyframes talk{0%,100%{box-shadow:none}12%{box-shadow:0 0 0 2px #22c55e}}
.course .cside{border-left:1px solid var(--hair-soft);padding:12px 11px;display:flex;flex-direction:column;gap:7px}
.course .lesson{display:flex;align-items:center;gap:8px;padding:7px 9px;border-radius:9px;background:var(--s1);border:1px solid var(--hair)}
.course .lesson.done{opacity:.55}.course .lesson.done .lc2{background:#22c55e;color:#06130a}
.course .lesson.cur{border-color:rgba(143,123,255,.6);background:rgba(106,76,245,.10)}
.course .lesson .lc2{width:18px;height:18px;border-radius:6px;background:var(--s2);display:grid;place-items:center;font-size:9px;color:var(--muted);flex:0 0 auto}
.course .lesson.cur .lc2{background:#6a4cf5;color:#fff;animation:blinkdot 1.5s infinite}
.course .cprog{padding:10px 15px;border-top:1px solid var(--hair-soft);display:flex;align-items:center;gap:10px}
.course .cbar{flex:1;height:6px;border-radius:100px;background:var(--s2);overflow:hidden}
.course .cbar i{display:block;height:100%;width:0;border-radius:100px;background:linear-gradient(90deg,#8f7bff,#6a4cf5)}
.course.played .cbar i{animation:cfill 3.2s var(--ease) forwards}
@keyframes cfill{to{width:68%}}

/* carrousel vidéos cinéma */
.cine{display:flex;gap:16px;overflow-x:auto;scroll-snap-type:x mandatory;padding:6px 4px 18px;scrollbar-width:none;mask-image:linear-gradient(90deg,transparent,#000 3%,#000 97%,transparent)}
.cine::-webkit-scrollbar{display:none}
.cine .vid{flex:0 0 min(520px,86vw);aspect-ratio:16/10;scroll-snap-align:center}
.cine .vid .vcap{font-size:18px;left:20px;bottom:18px}
.draghint{display:flex;align-items:center;gap:10px;justify-content:center;color:var(--muted);font-size:12.5px;margin-top:4px}
.draghint .dh{width:46px;height:2px;border-radius:2px;background:var(--hair);position:relative;overflow:hidden}
.draghint .dh::after{content:"";position:absolute;inset:0;width:18px;background:var(--blue);border-radius:2px;animation:dh 2.2s var(--ease) infinite}
@keyframes dh{0%{transform:translateX(-18px)}100%{transform:translateX(46px)}}

/* insta V7 — vrai look */
.ipost .iav{background:none}
.ipost .iav i{background:linear-gradient(45deg,#f09433,#e6683c 25%,#dc2743 50%,#cc2366 75%,#bc1888);color:#fff;width:30px;height:30px;font-size:11px}
.ipost .iglogo{margin-left:auto;width:18px;height:18px;color:#fff;opacity:.85}
.ipost .iheart{display:inline-block;animation:none}
.ipost:hover .iheart{animation:heart .5s var(--ease)}
@keyframes heart{30%{transform:scale(1.35)}}
.ipost .imeta{font-size:10.5px;color:#666;margin-top:6px;text-transform:uppercase;letter-spacing:.04em}

/* blocs qui pulsent (IA, tirage) */
.pulse-violet{animation:pulsev 3.4s ease-in-out infinite}
@keyframes pulsev{0%,100%{box-shadow:0 0 0 0 rgba(212,77,240,0),0 0 60px rgba(0,153,255,.08)}50%{box-shadow:0 0 0 1px rgba(212,77,240,.35),0 0 90px rgba(106,76,245,.22)}}
.pulse-gold{animation:pulseg 3.8s ease-in-out infinite}
@keyframes pulseg{0%,100%{box-shadow:0 0 0 0 rgba(245,180,60,0)}50%{box-shadow:0 0 0 1px rgba(245,180,60,.4),0 0 80px rgba(255,122,61,.20)}}
.iacard{transition:transform .4s var(--ease)}
.iacard:hover{transform:translateY(-5px)}

@media(max-width:880px){
  .livefeed .lfbody{height:206px}
  .course .cgrid{grid-template-columns:1fr}
  .course .cside{flex-direction:row;overflow-x:auto;border-left:none;border-top:1px solid var(--hair-soft)}
  .course .lesson{min-width:150px}
}

/* ============ V8 ============ */
.gridbg{display:none}

/* formules — style Framer : lift de surface, sobre */
.fprices{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;align-items:stretch}
.fprice{background:var(--s1);border-radius:20px;padding:28px 26px;display:flex;flex-direction:column;position:relative;border:1px solid transparent;transition:transform .25s var(--ease)}
.fprice:hover{transform:translateY(-4px)}
.fprice.feat{background:var(--s2);box-shadow:inset 0 1px 0 rgba(255,255,255,.10),0 24px 60px rgba(0,0,0,.4)}
.fprice .tierdot{width:9px;height:9px;border-radius:50%;background:var(--tc,#0099ff);display:inline-block;margin-right:9px}
.fprice .tname{font-family:var(--display);font-size:19px;font-weight:500;letter-spacing:-.03em;display:flex;align-items:center}
.fprice .tdesc{color:var(--muted);font-size:13.5px;margin-top:4px;min-height:36px}
.fprice .tprice{font-family:var(--display);font-size:46px;font-weight:500;letter-spacing:-.045em;margin:16px 0 4px}
.fprice .tprice small{font-size:14px;color:var(--muted);font-family:var(--body);letter-spacing:0;font-weight:400}
.fprice ul{list-style:none;display:flex;flex-direction:column;gap:0;margin:16px 0 24px;flex:1}
.fprice li{color:var(--muted);font-size:13.5px;padding:9px 0 9px 26px;position:relative;border-bottom:1px solid var(--hair-soft)}
.fprice li:last-child{border-bottom:none}
.fprice li::before{content:"✓";position:absolute;left:2px;color:var(--tc,#0099ff);font-weight:700}
.fprice .fbadge{position:absolute;top:-12px;left:26px;background:#fff;color:#000;font-size:11px;font-weight:700;border-radius:100px;padding:5px 13px;letter-spacing:.02em}

/* spotlight cards (signature) */
.spotcard{border-radius:30px;padding:38px 34px;color:#fff;position:relative;overflow:hidden}
.spotcard h3{font-family:var(--display);font-size:clamp(22px,2.6vw,30px);letter-spacing:-.035em;line-height:1.05}
.spotcard p{color:rgba(255,255,255,.85);font-size:14.5px;margin-top:10px;max-width:46ch}
.spotcard.violet{background:radial-gradient(130% 150% at 10% 0%,#8f7bff,#6a4cf5 48%,#3c2bb0)}
.spotcard.magenta{background:radial-gradient(130% 150% at 88% 0%,#e87bff,#d44df0 45%,#7a1f8e)}
.spotcard.orange{background:radial-gradient(130% 150% at 12% 0%,#ffb38d,#ff7a3d 48%,#9e3a10)}
.spotcard.coral{background:radial-gradient(130% 150% at 88% 8%,#ff8ba3,#ff5577 50%,#8e1f3a)}
.spotcard .btn{margin-top:20px}

/* IA — sobre : spotlight + typewriter */
.ia2{border-radius:30px;padding:54px 48px;position:relative;overflow:hidden;background:radial-gradient(120% 160% at 12% 0%,#8f7bff,#6a4cf5 42%,#2d1c86 78%,#1a1150)}
.ia2::after{content:"";position:absolute;inset:0;background:radial-gradient(560px 320px at var(--sx,80%) 110%,rgba(212,77,240,.5),transparent 60%);animation:iadrift 9s ease-in-out infinite alternate}
@keyframes iadrift{from{--sx:75%;opacity:.7}to{--sx:25%;opacity:1}}
.ia2>*{position:relative;z-index:2}
.ia2 .iatag{display:inline-flex;align-items:center;gap:8px;background:rgba(9,9,9,.35);border:1px solid rgba(255,255,255,.25);border-radius:100px;padding:7px 16px;font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;margin-bottom:20px}
.ia2 h2{font-family:var(--display);font-size:clamp(30px,4.4vw,52px);letter-spacing:-.045em;line-height:1}
.ia2 .typelines{margin-top:30px;display:flex;flex-direction:column;gap:13px;max-width:560px}
.typeline{font-size:15.5px;color:rgba(255,255,255,.92);min-height:24px;border-left:2px solid rgba(255,255,255,.35);padding-left:14px}
.typeline .cursorbar{display:inline-block;width:9px;height:17px;background:#fff;vertical-align:-2px;margin-left:2px;animation:blink 1s steps(1) infinite}
.typeline.donez .cursorbar{display:none}
.typeline b{color:#fff}

/* Europe / confiance */
.eu{display:grid;grid-template-columns:1.1fr .9fr;gap:50px;align-items:center}
.eu h2{font-size:clamp(30px,4.4vw,52px);line-height:1.02;letter-spacing:-.045em}
.trusts{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.trust{background:var(--s1);border:1px solid var(--hair);border-radius:18px;padding:20px;display:flex;gap:14px;align-items:flex-start}
.trust .ti2{width:42px;height:30px;border-radius:6px;overflow:hidden;flex:0 0 auto;display:grid;place-items:center;background:var(--s2);font-size:15px}
.trust .ti2 img{width:100%;height:100%;object-fit:cover}
.trust b{font-size:14px;display:block;margin-bottom:3px}
.trust span{color:var(--muted);font-size:12.5px;line-height:1.5}

/* vrai dashboard animé */
.dashreal{font-size:12px;color:var(--muted)}
.dashreal .dhello{display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:12px}
.dashreal .dhello b{font-family:var(--display);font-size:19px;color:#fff;letter-spacing:-.03em}
.dashreal .dkpis{display:grid;grid-template-columns:repeat(4,1fr);gap:9px;margin-bottom:13px}
.dashreal .dk{background:var(--s1);border:1px solid var(--hair);border-radius:13px;padding:12px;position:relative;overflow:hidden}
.dashreal .dk::before{content:"";position:absolute;top:0;left:0;right:0;height:2.5px;background:var(--kc)}
.dashreal .dk small{font-size:10.5px}
.dashreal .dk b{display:block;font-family:var(--display);font-size:21px;color:#fff;letter-spacing:-.03em;margin-top:3px}
.dashreal .dk .delta{font-size:10px;color:#48d97c;font-weight:700}
.dashreal .dcols{display:grid;grid-template-columns:1.25fr 1fr;gap:10px}
.dashreal .dcard{background:var(--s1);border:1px solid var(--hair);border-radius:14px;padding:13px}
.dashreal .dcard h5{font-size:11.5px;color:#fff;font-weight:700;margin-bottom:9px;font-family:var(--body)}
.dashreal .agrow{display:flex;gap:10px;align-items:center;padding:7px 0;border-bottom:1px solid var(--hair-soft)}
.dashreal .agrow:last-child{border-bottom:none}
.dashreal .agrow .ad{width:30px;text-align:center;flex:0 0 auto}
.dashreal .agrow .ad b{font-family:var(--display);font-size:15px;color:#fff;display:block;line-height:1}
.dashreal .agrow .ad small{font-size:8.5px;text-transform:uppercase}
.dashreal .topv{margin-bottom:9px}
.dashreal .topv .tvr{display:flex;justify-content:space-between;font-size:11px;margin-bottom:4px}
.dashreal .topv .tvb{height:6px;border-radius:100px;background:var(--s2);overflow:hidden}
.dashreal .topv .tvb i{display:block;height:100%;width:0;background:linear-gradient(90deg,#c9912b,#f5b43c);border-radius:100px;transition:width 1.2s var(--ease)}
.dashreal.played .topv .tvb i{width:var(--w)}

/* navigateur (vitrine résa en ligne) */
.browser{background:#101013;border:1px solid var(--hair);border-radius:16px;overflow:hidden;box-shadow:0 50px 110px rgba(0,0,0,.55)}
.browser .btop{display:flex;align-items:center;gap:8px;padding:11px 14px;border-bottom:1px solid var(--hair-soft)}
.browser .btop i{width:9px;height:9px;border-radius:50%;background:var(--s2)}
.browser .burl{flex:1;background:var(--s1);border:1px solid var(--hair);border-radius:100px;padding:5px 14px;font-size:11.5px;color:var(--muted);max-width:300px;margin:0 auto;text-align:center}
.browser .burl b{color:#fff}

/* partenaires */
.partners{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.partner{background:var(--s1);border:1px solid var(--hair);border-radius:18px;padding:22px;text-align:center;transition:.25s var(--ease)}
.partner:hover{transform:translateY(-4px);border-color:#3a3a3a}
.partner .pic{width:46px;height:46px;border-radius:14px;margin:0 auto 12px;display:grid;place-items:center;background:color-mix(in srgb,var(--pp,#0099ff) 13%,transparent);border:1px solid color-mix(in srgb,var(--pp,#0099ff) 35%,transparent);color:var(--pp,#0099ff);font-family:var(--display);font-weight:600;font-size:14px}
.partner b{font-family:var(--display);font-size:15.5px;font-weight:500;letter-spacing:-.02em;display:block;margin-bottom:5px}
.partner span{color:var(--muted);font-size:12.5px;line-height:1.5}

/* lab — contenus produits (mini-reels) */
.contentstrip{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.contentstrip .cphone{border-radius:18px;overflow:hidden;border:1px solid var(--hair);aspect-ratio:9/14;position:relative}
.contentstrip .cphone img,.contentstrip .cphone video{width:100%;height:100%;object-fit:cover}
.contentstrip .cphone .clab{position:absolute;left:10px;bottom:9px;font-size:10.5px;font-weight:700;background:rgba(9,9,9,.7);border-radius:100px;padding:4px 10px;backdrop-filter:blur(6px)}

@media(max-width:880px){
  .fprices,.trusts,.partners{grid-template-columns:1fr}
  .eu{grid-template-columns:1fr;gap:26px}
  .contentstrip{grid-template-columns:1fr 1fr}
  .dashreal .dkpis{grid-template-columns:1fr 1fr}
  .dashreal .dcols{grid-template-columns:1fr}
  .ia2{padding:32px 22px}
}

/* ============ FIX hero : la vidéo ne déborde plus du dégradé ============ */
.hero,.hero4{isolation:isolate}
.hero-bg{isolation:isolate;overflow:hidden}
.hero-bg video{position:relative;z-index:1;transform:scale(1.12)}
.hero-bg::after{z-index:5;background:linear-gradient(180deg,rgba(9,9,9,.55),rgba(9,9,9,.35) 42%,rgba(9,9,9,.92) 82%,var(--canvas) 94%)}
.hero-bg.duov::after{z-index:5;background:linear-gradient(180deg,rgba(28,12,64,.72),rgba(15,8,40,.55) 45%,rgba(9,9,9,.94) 84%,var(--canvas) 95%)}

/* ============ V9 ============ */
/* logos de formules */
.flogo{width:34px;height:34px;border-radius:10px;display:grid;place-items:center;margin-bottom:14px;background:color-mix(in srgb,var(--tc,#0099ff) 13%,transparent);border:1px solid color-mix(in srgb,var(--tc,#0099ff) 38%,transparent)}
.flogo svg{width:18px;height:18px;stroke:var(--tc,#0099ff);fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.fprice .tname{font-size:20px}

/* carte Ultra colorée */
.fprice.ultra{background:radial-gradient(130% 150% at 12% 0%,#ffb38d,#ff7a3d 46%,#9e3a10);border:none;color:#fff}
.fprice.ultra .tdesc,.fprice.ultra li,.fprice.ultra .tprice small{color:rgba(255,255,255,.85)}
.fprice.ultra li{border-bottom-color:rgba(255,255,255,.18)}
.fprice.ultra li::before{color:#fff}
.fprice.ultra .flogo{background:rgba(255,255,255,.16);border-color:rgba(255,255,255,.4)}
.fprice.ultra .flogo svg{stroke:#fff}
.fprice.ultra .tierdot{background:#fff}
.fprice.ultra .btn-d{background:rgba(9,9,9,.35);border-color:rgba(255,255,255,.3)}
.fprice.ultra .btn-d:hover{background:rgba(9,9,9,.5)}

/* testez en direct — mise en scène V9 */
.demo2{background:var(--s1);border:1px solid var(--hair);border-radius:30px;padding:34px;display:grid;grid-template-columns:1fr 420px;gap:30px;align-items:center;overflow:hidden;position:relative}
.demo2::before{content:"";position:absolute;inset:0;background:radial-gradient(560px 420px at 82% 50%,rgba(0,153,255,.10),transparent 65%)}
.demo2 .demo-tabs{flex-direction:column;gap:9px;margin:24px 0 0;position:relative}
.demo2 .demo-tabs button{display:flex;align-items:flex-start;gap:14px;text-align:left;border-radius:16px;padding:15px 17px;background:transparent;border:1px solid transparent;min-height:auto;white-space:normal}
.demo2 .demo-tabs button .dico{width:38px;height:38px;border-radius:11px;display:grid;place-items:center;background:var(--s2);border:1px solid var(--hair);font-size:15px;flex:0 0 auto;transition:.25s}
.demo2 .demo-tabs button b{display:block;font-family:var(--display);font-weight:500;font-size:15.5px;letter-spacing:-.02em;color:#fff}
.demo2 .demo-tabs button small{display:block;color:var(--muted);font-size:12.5px;font-weight:400;margin-top:3px;line-height:1.45}
.demo2 .demo-tabs button.on{background:var(--s2);border-color:var(--hair);box-shadow:none}
.demo2 .demo-tabs button.on .dico{background:rgba(0,153,255,.16);border-color:rgba(0,153,255,.55);color:#39aaff;box-shadow:0 0 20px rgba(0,153,255,.25)}
.demo2 .demo-tabs button.on::before{content:"";position:absolute;left:-34px;width:3px;height:38px;border-radius:3px;background:var(--blue);box-shadow:0 0 14px rgba(0,153,255,.6)}
.demo2 .stage{position:relative;display:flex;justify-content:center;padding:18px 0 34px}
.demo2 .stage::after{content:"";position:absolute;bottom:8px;left:50%;transform:translateX(-50%);width:240px;height:26px;border-radius:50%;background:radial-gradient(closest-side,rgba(0,153,255,.35),transparent);filter:blur(8px)}
.demo2 .stage .iphone{width:min(280px,70vw)}

/* IA — flash : néon tournant + faisceau */
.ia2{isolation:isolate}
.ia2::before{content:"";position:absolute;inset:-2px;border-radius:32px;padding:2px;background:conic-gradient(from var(--an,0deg),#0099ff,#d44df0,#ff5577,#8f7bff,#0099ff);-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask-composite:exclude;animation:neonspin 5s linear infinite;z-index:1}
@property --an{syntax:"<angle>";initial-value:0deg;inherits:false}
@keyframes neonspin{to{--an:360deg}}
.ia2 .beam{position:absolute;inset:0;z-index:1;overflow:hidden;border-radius:30px;pointer-events:none}
.ia2 .beam::after{content:"";position:absolute;top:-30%;bottom:-30%;width:90px;background:linear-gradient(90deg,transparent,rgba(255,255,255,.45),transparent);transform:rotate(14deg);left:-20%;animation:beam 4.2s var(--ease) infinite}
@keyframes beam{0%,55%{left:-20%}90%,100%{left:120%}}
.ia2 h2{background:linear-gradient(110deg,#fff 30%,#ffd9f6 45%,#fff 60%);background-size:220% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:shimmer 3.6s ease-in-out infinite}
@keyframes shimmer{0%,100%{background-position:0% 0}50%{background-position:100% 0}}

@media(max-width:880px){
  .demo2{grid-template-columns:1fr;padding:22px}
  .demo2 .demo-tabs button.on::before{display:none}
}
@media(prefers-reduced-motion:reduce){
  .ia2::before,.ia2 .beam::after,.ia2 h2{animation:none!important}
}

/* ============ V10 — retours ============ */
/* badge pilule premium */
.pillbadge{font-family:var(--display);font-size:13.5px;font-weight:500;letter-spacing:-.01em;padding:10px 22px;gap:10px;background:linear-gradient(180deg,rgba(255,255,255,.07),rgba(255,255,255,.02));border:1px solid rgba(255,255,255,.14);box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 10px 30px rgba(0,0,0,.35);backdrop-filter:blur(10px)}
.pillbadge .pdot{box-shadow:0 0 14px var(--hc,#0099ff),0 0 4px var(--hc,#0099ff)}

/* marquee raffiné */
.marquee{border:none;padding:26px 0;mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.marquee .track{font-family:var(--body);font-size:12.5px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:#777;gap:0;align-items:center}
.marquee .track span{display:inline-flex;align-items:center;gap:38px;padding-right:38px}
.marquee .track span::after{content:"◆";font-size:6px;color:rgba(0,153,255,.55)}

/* stats hero redessinées */
.ticker{border-top:none;gap:0;margin-top:50px;padding-top:0;display:flex;align-items:stretch}
.ticker>div{padding:4px 34px;border-left:1px solid rgba(255,255,255,.13)}
.ticker>div:first-child{padding-left:0;border-left:none}
.ticker b{font-size:30px;letter-spacing:-.04em;display:flex;align-items:center;gap:9px}
.ticker b img{height:21px}
.ticker span{margin-top:4px;display:block;color:rgba(255,255,255,.55)}
.ticker .stars{font-size:14px;letter-spacing:1px}
@media(max-width:880px){
  .ticker{flex-wrap:wrap;gap:18px}
  .ticker>div{border-left:none;padding:0;flex:1 1 40%}
  .ticker b{font-size:24px}
}

/* cartes formules V10 — sobres, accents fins (annule la carte orange pleine) */
.fprice.ultra{background:radial-gradient(260px 180px at 100% 0%,rgba(255,122,61,.13),transparent 70%),var(--s1);border:1px solid var(--hair);color:inherit}
.fprice.ultra .tdesc,.fprice.ultra li{color:var(--muted)}
.fprice.ultra .tprice small{color:var(--muted)}
.fprice.ultra li{border-bottom-color:var(--hair-soft)}
.fprice.ultra li::before{color:#ff7a3d}
.fprice.ultra .tierdot{background:#ff7a3d}
.fprice.ultra .btn-d{background:var(--s1);border-color:var(--hair)}
.fprice.feat{box-shadow:inset 0 1px 0 rgba(255,255,255,.10),0 0 0 1px rgba(0,153,255,.30),0 30px 70px rgba(0,0,0,.45)}
.fprice .flogo{width:auto;height:auto;background:none;border:none;margin:0 0 0 auto;order:2}
.fprice .flogo svg{width:22px;height:22px;opacity:.9}
.fprice .tname{display:flex;width:100%}
.fprice.ultra .flogo svg{stroke:#ff7a3d}

/* ============ V11 ============ */
/* personas — typo maison, sans pastilles */
.persona .pi{display:none}
.persona .ptag{font-family:var(--body);font-size:12px;font-weight:500;color:var(--muted);text-transform:none;letter-spacing:0;margin-bottom:10px}
.persona b{font-family:var(--display);font-size:21px;font-weight:500;letter-spacing:-.035em;margin-bottom:9px}
.persona span{font-size:14px}
.persona::before{height:1px;background:var(--hair);opacity:1}
.persona{background:var(--s1)}
.persona:hover{border-color:#333}

/* salles de classe (remplace flotte école) */
.classes{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.classe{position:relative;border-radius:24px;overflow:hidden;border:1px solid var(--hair);aspect-ratio:3/4;display:flex;align-items:flex-end;transition:transform .35s var(--ease)}
.classe:hover{transform:translateY(-6px)}
.classe img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .8s var(--ease)}
.classe:hover img{transform:scale(1.05)}
.classe::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 30%,rgba(9,9,9,.88) 88%)}
.classe .ctxt{position:relative;z-index:2;padding:24px}
.classe .cmod{font-size:11.5px;font-weight:600;color:var(--muted);text-transform:uppercase;letter-spacing:.08em;margin-bottom:8px;display:block}
.classe h3{font-size:23px;letter-spacing:-.035em;margin-bottom:7px}
.classe p{color:var(--muted);font-size:13.5px;line-height:1.5}

/* plateforme de formation (mock navigable) */
.labmock{background:#0c0c10;border:1px solid rgba(106,76,245,.35);border-radius:20px;overflow:hidden;box-shadow:0 50px 110px rgba(0,0,0,.55),0 0 70px rgba(106,76,245,.10);font-size:12px;color:var(--muted)}
.labmock .lmtop{display:flex;align-items:center;gap:10px;padding:12px 16px;border-bottom:1px solid var(--hair-soft)}
.labmock .lmtop .lmlogo{font-family:var(--display);font-weight:600;font-size:13px;color:#fff;letter-spacing:-.02em}
.labmock .lmtop .lmlogo span{color:#a18fff}
.labmock .lmgrid{display:grid;grid-template-columns:215px 1fr;min-height:330px}
.labmock .lmside{border-right:1px solid var(--hair-soft);padding:12px 10px;background:#0a0a0e}
.labmock .lmod{display:flex;align-items:center;gap:9px;padding:9px 11px;border-radius:10px;cursor:pointer;border:1px solid transparent;transition:.2s;margin-bottom:3px;font-weight:500}
.labmock .lmod .ln{width:22px;height:22px;border-radius:7px;background:var(--s2);display:grid;place-items:center;font-size:10px;flex:0 0 auto;color:var(--muted)}
.labmock .lmod.done .ln{background:rgba(34,197,94,.16);color:#48d97c}
.labmock .lmod:hover{background:var(--s1)}
.labmock .lmod.on{background:rgba(106,76,245,.12);border-color:rgba(106,76,245,.4);color:#fff}
.labmock .lmod.on .ln{background:#6a4cf5;color:#fff}
.labmock .lmmain{padding:18px 20px;display:flex;flex-direction:column;gap:13px}
.labmock .lmplayer{aspect-ratio:16/7.4;border-radius:13px;position:relative;overflow:hidden;background:radial-gradient(420px 240px at 30% 20%,rgba(143,123,255,.45),rgba(106,76,245,.2) 55%,#100b22);display:grid;place-items:center;transition:.3s}
.labmock .lmplayer .pl{width:54px;height:54px;border-radius:50%;background:rgba(255,255,255,.94);display:grid;place-items:center;color:#000;font-size:17px;padding-left:4px;box-shadow:0 14px 40px rgba(0,0,0,.5);animation:plpulse 2.4s infinite}
@keyframes plpulse{0%,100%{box-shadow:0 14px 40px rgba(0,0,0,.5),0 0 0 0 rgba(255,255,255,.35)}50%{box-shadow:0 14px 40px rgba(0,0,0,.5),0 0 0 14px rgba(255,255,255,0)}}
.labmock .lmplayer .lmtime{position:absolute;right:12px;bottom:10px;background:rgba(9,9,9,.7);border-radius:100px;padding:4px 11px;font-size:10.5px;color:#fff}
.labmock .lmtitle{font-family:var(--display);font-size:17px;color:#fff;letter-spacing:-.025em}
.labmock .lmbar{height:6px;border-radius:100px;background:var(--s2);overflow:hidden}
.labmock .lmbar i{display:block;height:100%;border-radius:100px;background:linear-gradient(90deg,#8f7bff,#6a4cf5);transition:width .6s var(--ease)}
.labmock .lmres{display:flex;gap:7px;flex-wrap:wrap}
.labmock .lmres span{background:var(--s1);border:1px solid var(--hair);border-radius:100px;padding:5px 12px;font-size:11px}

/* partenaires — logo wall */
.pwall{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.pcard{display:flex;align-items:center;gap:15px;background:var(--s1);border:1px solid var(--hair);border-radius:16px;padding:20px 22px;transition:.25s var(--ease)}
.pcard:hover{border-color:#333;transform:translateY(-3px)}
.pcard svg{width:26px;height:26px;stroke:#bbb;fill:none;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;flex:0 0 auto}
.pcard b{font-family:var(--display);font-weight:500;font-size:16px;letter-spacing:-.025em;display:block}
.pcard small{color:var(--muted);font-size:12px;display:block;margin-top:2px;font-weight:400}

/* réussite */
.success{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.suc{background:var(--s1);border:1px solid var(--hair);border-radius:20px;padding:28px 26px}
.suc b{font-family:var(--display);font-size:clamp(30px,3.4vw,44px);font-weight:500;letter-spacing:-.045em;display:block;line-height:1}
.suc span{color:var(--muted);font-size:13px;display:block;margin-top:8px;line-height:1.5}
.timelinec{display:flex;gap:0;margin-top:30px;overflow-x:auto;padding-bottom:6px}
.tstep{flex:1;min-width:150px;position:relative;padding:18px 18px 0 0}
.tstep::before{content:"";position:absolute;top:5px;left:0;right:0;height:2px;background:var(--hair)}
.tstep::after{content:"";position:absolute;top:0;left:0;width:12px;height:12px;border-radius:50%;background:var(--canvas);border:2.5px solid var(--tc,#0099ff)}
.tstep b{font-family:var(--display);font-size:15px;color:#fff;display:block;letter-spacing:-.02em}
.tstep span{font-size:12.5px;color:var(--muted)}

/* iframe corsiva.fr */
.siteframe{position:relative;aspect-ratio:16/10;background:#0a0a0a}
.siteframe iframe{position:absolute;inset:0;width:166%;height:166%;transform:scale(.6);transform-origin:0 0;border:0;pointer-events:none}
.siteframe .sfcover{position:absolute;inset:0;z-index:2}

/* carte de France — tracé plus long */
.fpath{stroke-dasharray:4400;stroke-dashoffset:4400}

@media(max-width:880px){
  .classes{grid-template-columns:1fr}
  .classe{aspect-ratio:16/11}
  .labmock .lmgrid{grid-template-columns:1fr}
  .labmock .lmside{display:flex;overflow-x:auto;border-right:none;border-bottom:1px solid var(--hair-soft)}
  .labmock .lmod{min-width:170px}
  .pwall,.success{grid-template-columns:1fr 1fr}
}

/* ============ V12 — logos officiels, parcours client, réussite bento, OS réel, Lab refondu ============ */

/* parcours client (home) — le fil Lab → OS → ville */
.jrail{display:grid;grid-template-columns:repeat(4,1fr);margin-bottom:18px;position:relative;height:14px}
.jrail::before{content:"";position:absolute;top:50%;left:12.5%;right:12.5%;height:2px;margin-top:-1px;border-radius:2px;background:linear-gradient(90deg,#bbb,#8f7bff 36%,#39aaff 66%,#ff7a3d)}
.jrail i{width:13px;height:13px;border-radius:50%;background:var(--canvas);border:2.5px solid var(--jc,#999);margin:0 auto;position:relative;z-index:1}
.journey{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.jstep{background:var(--s1);border:1px solid var(--hair);border-radius:22px;padding:26px 24px;display:flex;flex-direction:column;transition:transform .3s var(--ease),border-color .3s}
.jstep:hover{transform:translateY(-5px);border-color:color-mix(in srgb,var(--jc,#fff) 38%,var(--hair))}
.jstep .jk{font-size:12.5px;color:var(--muted);margin-bottom:14px}
.jstep img{height:15px;align-self:flex-start;margin-bottom:13px}
.jstep h3{font-size:20px;letter-spacing:-.035em;margin-bottom:8px}
.jstep p{color:var(--muted);font-size:13.5px;line-height:1.55;flex:1;margin-bottom:16px}
.jstep .jl{font-size:13px;font-weight:600;color:var(--jc,#fff)}
.jstep .jl::after{content:" →"}

/* réussite — bento moderne */
.bento{display:grid;grid-template-columns:repeat(12,1fr);gap:14px}
.bcard{background:var(--s1);border:1px solid var(--hair);border-radius:24px;padding:30px 28px;position:relative;overflow:hidden;display:flex;flex-direction:column;min-height:200px}
.bcard .bk{font-size:13px;font-weight:600;color:var(--muted);display:flex;align-items:center;gap:9px;margin-bottom:auto}
.bcard .bk .dot{width:7px;height:7px;border-radius:50%;background:var(--bc,#0099ff)}
.bcard b{font-family:var(--display);font-weight:500;font-size:clamp(40px,4.4vw,58px);letter-spacing:-.05em;line-height:.95;display:block;margin-top:22px}
.bcard .bl{font-size:14.5px;color:var(--muted);margin-top:10px;line-height:1.5;max-width:40ch}
.bcard.hero{grid-column:span 7;min-height:300px;background:radial-gradient(640px 380px at 12% 0%,rgba(245,180,60,.15),transparent 60%),var(--s1);border-color:rgba(245,180,60,.28)}
.bcard.hero b{font-size:clamp(60px,7.4vw,104px)}
.bcard.c5{grid-column:span 5}
.bcard.c4{grid-column:span 4}
.bcard .bspark{position:absolute;right:-8px;bottom:-6px;width:54%;opacity:.8;pointer-events:none}
.bcard .bspark path{fill:none;stroke:url(#bsg);stroke-width:2.5;stroke-linecap:round}
.bmiles{grid-column:span 12;display:grid;grid-template-columns:repeat(4,1fr);background:var(--s1);border:1px solid var(--hair);border-radius:24px;padding:28px}
.bmile{padding-right:24px}
.bmile+.bmile{padding-left:24px;border-left:1px solid var(--hair-soft)}
.bmile small{display:block;font-size:12.5px;color:#666;margin-bottom:9px}
.bmile b{font-family:var(--display);font-weight:500;font-size:19px;letter-spacing:-.03em;color:#fff;display:flex;align-items:center;gap:10px;margin-bottom:7px}
.bmile .mk{width:9px;height:9px;border-radius:3px;background:var(--mc,#999);flex:0 0 auto}
.bmile span{font-size:13.5px;color:var(--muted);line-height:1.55}

/* ============ Corsiva OS — réplique fidèle de la plateforme, animée ============ */
.osreal{position:relative}
.owin{background:#0d0d10;border:1px solid var(--hair);border-radius:18px;overflow:hidden;box-shadow:0 60px 130px rgba(0,0,0,.6),0 0 80px rgba(0,153,255,.07)}
.otop{display:flex;align-items:center;gap:8px;padding:11px 14px;border-bottom:1px solid var(--hair-soft)}
.otop i{width:9px;height:9px;border-radius:50%;background:var(--s2)}
.otop .ourl{flex:1;max-width:340px;margin:0 auto;text-align:center;background:var(--s1);border:1px solid var(--hair);border-radius:100px;padding:5px 14px;font-size:11px;color:var(--muted)}
.otop .ourl b{color:#fff}
.ogrid{display:grid;grid-template-columns:208px 1fr;min-height:480px}
.oside{background:#0a0a0d;border-right:1px solid var(--hair-soft);padding:13px 10px;font-size:11.5px;color:var(--muted)}
.oside .obrand{display:flex;align-items:center;gap:7px;padding:3px 8px 13px}
.oside .obrand img{height:12px}
.oside .obrand .osfx{color:var(--blue);font-family:var(--display);font-weight:600;font-size:12px;letter-spacing:-.02em}
.osub{margin:0 3px 12px;padding:9px;background:var(--s1);border:1px solid var(--hair);border-radius:11px}
.osub small{display:block;font-size:9.5px;color:#666;margin-bottom:7px}
.osub .otabs{display:flex;gap:3px}
.osub .otabs b{flex:1;text-align:center;font-size:9.5px;padding:5px 2px;border-radius:7px;background:var(--s2);color:var(--muted);font-weight:600}
.osub .otabs b.on{background:rgba(0,153,255,.16);color:#39aaff;box-shadow:inset 0 0 0 1px rgba(0,153,255,.45)}
.oglabel{font-size:9.5px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:#555;padding:10px 9px 5px}
.oit{display:flex;align-items:center;gap:9px;padding:6.5px 9px;border-radius:8px;margin-bottom:1px;font-weight:500;transition:.3s;cursor:default}
.oit i{font-style:normal;width:15px;text-align:center;font-size:11px;opacity:.8}
.oit.on{background:rgba(0,153,255,.13);color:#fff;box-shadow:inset 2px 0 0 var(--blue)}
.omain{position:relative;overflow:hidden}
.oview{position:absolute;inset:0;padding:18px 20px;opacity:0;transform:translateY(14px);transition:opacity .45s var(--ease),transform .45s var(--ease);display:flex;flex-direction:column;gap:11px;font-size:11.5px;color:var(--muted)}
.oview.on{opacity:1;transform:none}
.ohead{display:flex;justify-content:space-between;align-items:flex-end}
.ohead b{font-family:var(--display);font-size:19px;color:#fff;letter-spacing:-.035em;font-weight:500}
.ohead small{display:block;margin-top:3px;font-size:10.5px}
.ohead .obtn{background:#fff;color:#000;border-radius:100px;padding:6px 13px;font-size:10px;font-weight:700;white-space:nowrap}
.okpis{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.okpi{background:var(--s1);border:1px solid var(--hair);border-radius:12px;padding:11px;position:relative;overflow:hidden}
.okpi::before{content:"";position:absolute;top:0;left:0;right:0;height:2px;background:var(--kc,#0099ff)}
.okpi small{font-size:9.5px}
.okpi b{display:block;font-family:var(--display);font-size:19px;color:#fff;letter-spacing:-.03em;margin:3px 0 1px;font-weight:500}
.okpi em{font-style:normal;font-size:9px;color:#48d97c;font-weight:700}
.ocols{display:grid;grid-template-columns:1.3fr 1fr;gap:9px;flex:1;min-height:0}
.ocard{background:var(--s1);border:1px solid var(--hair);border-radius:12px;padding:12px;overflow:hidden}
.ocard h6{font-size:10.5px;color:#fff;margin-bottom:8px;font-family:var(--body);font-weight:700}
.orow{display:flex;align-items:center;gap:9px;padding:5.5px 0;border-bottom:1px solid var(--hair-soft);font-size:10.5px}
.orow:last-child{border:none}
.orow .ow{color:#fff;font-weight:600}
.orow .ort{margin-left:auto;white-space:nowrap}
.otag{padding:2px 8px;border-radius:100px;font-size:8.5px;font-weight:700;background:color-mix(in srgb,var(--tc,#0099ff) 16%,transparent);color:var(--tc,#0099ff);white-space:nowrap}
.obarw{height:5px;border-radius:100px;background:var(--s2);overflow:hidden;margin:3px 0 8px}
.obarw i{display:block;height:100%;width:0;background:linear-gradient(90deg,#c9912b,#f5b43c);border-radius:100px;transition:width 1.1s var(--ease)}
.oview.on .obarw i{width:var(--w)}
.ogantt{display:grid;grid-template-columns:104px repeat(14,1fr);gap:3px;align-items:center}
.ogantt .gl{font-size:9.5px;color:#fff;font-weight:600;white-space:nowrap;overflow:hidden;padding-right:4px}
.ogantt .gd{font-size:8px;text-align:center;color:#555}
.ogantt .gc{height:16px;border-radius:4px;background:rgba(255,255,255,.035)}
.ogantt .gc.b{background:linear-gradient(90deg,#0077cc,#0099ff)}
.ogantt .gc.g{background:linear-gradient(90deg,#16a34a,#22c55e)}
.ogantt .gc.a{background:linear-gradient(90deg,#d97706,#f59e0b)}
.ogantt .gc.v{background:linear-gradient(90deg,#5b3df0,#8f7bff)}
.osplit{height:8px;border-radius:100px;display:flex;overflow:hidden;background:var(--s2)}
.osplit i{height:100%}
.ocursor{position:absolute;z-index:6;left:0;top:0;width:20px;height:20px;pointer-events:none;transition:transform 1.1s var(--ease);will-change:transform;filter:drop-shadow(0 4px 10px rgba(0,0,0,.65));opacity:0}
.osreal.walking .ocursor{opacity:1}
.ocursor::before{content:"";position:absolute;inset:0;background:#fff;clip-path:polygon(0 0,100% 38%,46% 50%,38% 100%)}
.ocursor.click::after{content:"";position:absolute;left:-7px;top:-7px;width:32px;height:32px;border-radius:50%;border:2px solid rgba(0,153,255,.85);animation:ocl .55s var(--ease)}
@keyframes ocl{from{transform:scale(.35);opacity:1}to{transform:scale(1.4);opacity:0}}
.oslegend{display:flex;gap:10px;flex-wrap:wrap;justify-content:center;margin-top:18px}
.oslegend span{font-size:12.5px;color:var(--muted);background:var(--s1);border:1px solid var(--hair);border-radius:100px;padding:7px 15px;transition:.3s}
.oslegend span.on{color:#fff;border-color:rgba(0,153,255,.5);background:rgba(0,153,255,.08)}

/* ============ Lab V12 — page refondue, visuelle ============ */
.terrain{display:grid;grid-template-columns:1.3fr 1fr;gap:14px}
.tcell{position:relative;border-radius:24px;overflow:hidden;border:1px solid var(--hair);min-height:200px}
.tcell.big{grid-row:span 2;min-height:460px}
.tcell video,.tcell img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .8s var(--ease)}
.tcell:hover img{transform:scale(1.05)}
.tcell::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 45%,rgba(9,9,9,.78))}
.tcell .tcap{position:absolute;left:18px;bottom:16px;z-index:2}
.tcell .tcap b{font-family:var(--display);font-weight:500;font-size:17px;letter-spacing:-.025em;display:block;text-shadow:0 2px 14px rgba(0,0,0,.8)}
.tcell .tcap small{font-size:12px;color:rgba(255,255,255,.75)}
.tcol{display:grid;grid-template-rows:1fr 1fr;gap:14px}
.stepvis{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.svis{border-radius:24px;overflow:hidden;border:1px solid var(--hair);background:var(--s1);display:flex;flex-direction:column;transition:transform .3s var(--ease)}
.svis:hover{transform:translateY(-5px)}
.svis .svmedia{aspect-ratio:16/9.6;position:relative;overflow:hidden}
.svis .svmedia img,.svis .svmedia video{width:100%;height:100%;object-fit:cover;transition:transform .8s var(--ease)}
.svis:hover .svmedia img{transform:scale(1.05)}
.svis .svmedia::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 55%,rgba(20,20,20,.9))}
.svis .stx{padding:20px 22px 26px}
.svis .stx small{display:block;font-size:12.5px;color:var(--muted);margin-bottom:8px}
.svis h3{font-size:21px;letter-spacing:-.035em;margin-bottom:8px}
.svis p{color:var(--muted);font-size:13.5px;line-height:1.55}
.proof{position:relative;border-radius:30px;overflow:hidden;border:1px solid var(--hair);min-height:420px;display:flex;align-items:flex-end}
.proof video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.6}
.proof::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(9,9,9,.25),rgba(9,9,9,.9) 88%)}
.proof .pwz{position:relative;z-index:2;width:100%;padding:38px 40px;display:grid;grid-template-columns:1.2fr repeat(3,1fr);gap:26px;align-items:end}
.proof h3{font-size:clamp(24px,3vw,34px);letter-spacing:-.04em}
.proof .ps b{font-family:var(--display);font-size:30px;font-weight:500;letter-spacing:-.04em;display:block}
.proof .ps span{font-size:12.5px;color:rgba(255,255,255,.7)}
.months.three{grid-template-columns:repeat(3,1fr)}
.months.three .month{padding:22px 20px}
.months.three .month b{font-size:14px}
.months.three .month span{font-size:13px}

/* RGPD / logos */
.ti2.sq{width:36px;height:36px;border-radius:10px;background:#101014}
.ti2.sq img{object-fit:contain;padding:4px}

@media(max-width:880px){
  .journey,.stepvis{grid-template-columns:1fr}
  .jrail{display:none}
  .bento{grid-template-columns:1fr}
  .bcard,.bcard.hero,.bcard.c5,.bcard.c4{grid-column:span 1;min-height:0}
  .bmiles{grid-template-columns:1fr;gap:18px;grid-column:span 1}
  .bmile{padding:0}
  .bmile+.bmile{padding:18px 0 0;border-left:none;border-top:1px solid var(--hair-soft)}
  .ogrid{grid-template-columns:1fr;min-height:0}
  .oside{display:none}
  .omain{min-height:430px}
  .okpis{grid-template-columns:1fr 1fr}
  .ocols{grid-template-columns:1fr}
  .ogantt{grid-template-columns:84px repeat(8,1fr)}
  .ogantt .gc:nth-child(n+10){display:none}
  .terrain{grid-template-columns:1fr}
  .tcell.big{grid-row:span 1;min-height:300px}
  .proof .pwz{grid-template-columns:1fr 1fr;padding:26px 22px}
  .months.three{grid-template-columns:1fr}
}
@media(prefers-reduced-motion:reduce){
  .ocursor{display:none}
}

/* ============ V13 — offres duo, corsiva.fr capture, carte FR+BE, UI mobile réelle, pricing 1 an, nav mobile ============ */

/* hero — 3 stats verre */
.ticker3{display:flex;gap:12px;margin-top:46px;flex-wrap:wrap}
.tk{display:flex;align-items:center;gap:14px;background:rgba(12,12,12,.55);border:1px solid rgba(255,255,255,.13);border-radius:18px;padding:15px 22px;backdrop-filter:blur(12px);transition:transform .3s var(--ease),border-color .3s}
.tk:hover{transform:translateY(-4px);border-color:rgba(255,255,255,.26)}
.tk .ti{width:40px;height:40px;border-radius:12px;display:grid;place-items:center;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.13);font-size:16px;color:#fff}
.tk .ti img{height:18px}
.tk b{font-family:var(--display);font-size:23px;font-weight:500;letter-spacing:-.035em;display:flex;align-items:center;gap:8px;line-height:1.05}
.tk small{font-size:12px;color:rgba(255,255,255,.6);display:block;margin-top:2px}
.tk .stars{font-size:12px;letter-spacing:2px}

/* offres home — duo Lab / OS */
.duo{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.dcard2{border-radius:28px;overflow:hidden;position:relative;padding:40px 36px;min-height:400px;display:flex;flex-direction:column;color:#fff;transition:transform .3s var(--ease),box-shadow .3s}
.dcard2:hover{transform:translateY(-6px);box-shadow:0 34px 80px rgba(0,0,0,.5)}
.dcard2.lab{background:radial-gradient(130% 150% at 12% 0%,#8f7bff,#6a4cf5 46%,#2a1a7a)}
.dcard2.osd{background:radial-gradient(130% 150% at 88% 0%,#54b7ff,#0084dd 46%,#003a66)}
.dcard2 .dlogo{height:21px;align-self:flex-start}
.dcard2 .dk2{font-size:12.5px;color:rgba(255,255,255,.78);margin-top:14px;font-weight:600}
.dcard2 h3{font-size:clamp(24px,2.8vw,33px);letter-spacing:-.04em;margin:6px 0 10px}
.dcard2 .dprice{font-family:var(--display);font-size:clamp(40px,4.6vw,58px);letter-spacing:-.05em;line-height:1}
.dcard2 .dprice small{font-size:15px;font-family:var(--body);color:rgba(255,255,255,.78);letter-spacing:0}
.dcard2 ul{list-style:none;margin:20px 0 26px;display:flex;flex-direction:column;gap:9px;flex:1}
.dcard2 li{color:rgba(255,255,255,.88);font-size:14px;padding-left:24px;position:relative}
.dcard2 li::before{content:"";position:absolute;left:0;top:9px;width:13px;height:2px;background:rgba(255,255,255,.85);border-radius:2px}
.dcard2 .btn{align-self:flex-start}

/* corsiva.fr — capture réelle (cookies acceptés) qui défile */
.siteshot{position:relative;aspect-ratio:16/10;overflow:hidden;background:#0a0a0a}
.siteshot img{width:100%;height:auto;display:block;animation:siteglide 18s ease-in-out infinite alternate}
@keyframes siteglide{from{transform:translateY(0)}to{transform:translateY(-64%)}}
.siteshot::after{content:"";position:absolute;inset:auto 0 0 0;height:40px;background:linear-gradient(180deg,transparent,rgba(9,9,9,.5))}

/* carte France + Belgique — tout en SVG, plus de pins HTML */
.map2{position:relative;max-width:620px;margin:0 auto}
.map2 svg{width:100%;height:auto;filter:drop-shadow(0 30px 60px rgba(0,153,255,.10))}
.cpath{fill:rgba(0,153,255,.05);stroke:rgba(0,153,255,.45);stroke-width:2;stroke-linejoin:round;stroke-dasharray:1;stroke-dashoffset:1}
.cpath.be{fill:rgba(255,122,61,.05);stroke:rgba(255,122,61,.45)}
.map2.played .cpath{animation:cdraw 2.2s var(--ease) forwards}
.map2.played .cpath.be{animation-delay:1.4s}
@keyframes cdraw{to{stroke-dashoffset:0}}
.cline{fill:none;stroke:url(#lg2);stroke-width:1.7;stroke-linecap:round;stroke-dasharray:1;stroke-dashoffset:1;opacity:0}
.map2.played .cline{animation:ldraw2 1.1s var(--ease) forwards}
@keyframes ldraw2{1%{opacity:1}100%{opacity:.8;stroke-dashoffset:0}}
.spin2{opacity:0}
.map2.played .spin2{animation:pinin .55s var(--ease) forwards}
@keyframes pinin{from{opacity:0;transform:translateY(7px)}60%{opacity:1}to{opacity:1;transform:none}}
.spin2 .pc{stroke:#090909;stroke-width:2.5}
.spin2.o .pc{fill:#22c55e}
.spin2.n .pc{fill:#ff7a3d}
.spin2 text{font-family:var(--body);font-size:11px;font-weight:700;paint-order:stroke;stroke:rgba(9,9,9,.9);stroke-width:3.5px;letter-spacing:0}
.spin2.o text{fill:#7be3a3}
.spin2.n text{fill:#ffb38d}
.rdr{transform-box:fill-box;transform-origin:center;fill:none;stroke:rgba(0,153,255,.6);stroke-width:1.4;opacity:0}
.map2.played .rdr{animation:radar3 3s ease-out infinite}
@keyframes radar3{from{opacity:.9;transform:scale(1)}to{opacity:0;transform:scale(11)}}

/* salles de classe — panneaux extensibles */
.xpanels{display:flex;gap:12px;height:470px}
.xp{position:relative;flex:1;border-radius:24px;overflow:hidden;border:1px solid var(--hair);cursor:pointer;transition:flex .65s var(--ease)}
.xp.on{flex:2.7}
.xp img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .9s var(--ease)}
.xp.on img{transform:scale(1.04)}
.xp::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(9,9,9,.1) 30%,rgba(9,9,9,.9) 92%)}
.xp .xnum{position:absolute;top:18px;left:20px;z-index:2;font-family:var(--display);font-size:13px;color:rgba(255,255,255,.75);background:rgba(9,9,9,.55);border:1px solid rgba(255,255,255,.14);border-radius:100px;padding:5px 12px;backdrop-filter:blur(6px)}
.xp .xtt{position:absolute;left:22px;right:22px;bottom:20px;z-index:2}
.xp .cmod{font-size:11.5px;font-weight:600;color:rgba(255,255,255,.65);text-transform:uppercase;letter-spacing:.08em;margin-bottom:8px;display:block;white-space:nowrap}
.xp h3{font-size:24px;letter-spacing:-.035em;margin-bottom:7px;white-space:nowrap}
.xp p{color:rgba(255,255,255,.8);font-size:13.5px;line-height:1.55;max-width:48ch;opacity:0;transform:translateY(10px);transition:opacity .45s var(--ease) .18s,transform .45s var(--ease) .18s}
.xp.on p{opacity:1;transform:none}

/* ============ UI mobile réelle de l'OS (topbar burger + contenu) ============ */
.mui{display:flex;flex-direction:column;height:100%;background:var(--canvas);font-size:11px;color:var(--muted)}
.mui .mtop{display:flex;align-items:center;gap:10px;padding:58px 14px 11px;border-bottom:1px solid var(--hair-soft);flex:0 0 auto}
.mui .mtop .mbg{width:29px;height:29px;border-radius:9px;background:var(--s1);border:1px solid var(--hair);display:grid;place-items:center;color:#fff;flex:0 0 auto}
.mui .mtop .mbg::before{content:"";width:13px;height:1.6px;background:#fff;box-shadow:0 -4px 0 #fff,0 4px 0 #fff;display:block}
.mui .mtop h5{font-family:var(--display);font-weight:500;font-size:13.5px;color:#fff;letter-spacing:-.02em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mui .mtop .mck{margin-left:auto;background:rgba(0,153,255,.14);color:var(--blue);border-radius:100px;padding:3px 9px;font-weight:600;font-size:9.5px;flex:0 0 auto}
.mui .mbody{padding:11px 12px 14px;display:flex;flex-direction:column;gap:7px;flex:1;overflow:hidden}
.mui .mlbl{font-size:9px;text-transform:uppercase;letter-spacing:.07em;color:#666;font-weight:700;margin-top:2px}
.mrow{background:var(--s1);border:1px solid var(--hair);border-radius:11px;padding:8px 10px;display:flex;justify-content:space-between;align-items:center;gap:8px}
.mrow b{color:#fff;font-weight:600}
.mtag{padding:2px 8px;border-radius:100px;font-size:8.5px;font-weight:700;background:color-mix(in srgb,var(--tc,#0099ff) 16%,transparent);color:var(--tc,#0099ff);white-space:nowrap}
.mchk{display:flex;gap:9px;align-items:center;background:var(--s2);border:1px solid var(--hair);border-radius:11px;padding:7px 10px}
.mchk .ck{width:17px;height:17px;border-radius:6px;background:rgba(34,197,94,.18);color:#48d97c;display:grid;place-items:center;font-size:10px;flex:0 0 auto;font-weight:700}
.mchk b{color:#fff;font-weight:600;font-size:10.5px}
.mchk small{display:block;color:var(--muted);font-size:9px}
.mkpis{display:grid;grid-template-columns:1fr 1fr;gap:7px}
.mk2{background:var(--s1);border:1px solid var(--hair);border-radius:11px;padding:9px;position:relative;overflow:hidden}
.mk2::before{content:"";position:absolute;top:0;left:0;right:0;height:2px;background:var(--kc,#0099ff)}
.mk2 b{display:block;color:#fff;font-family:var(--display);font-size:15px;letter-spacing:-.02em;margin-top:2px;font-weight:500}
.mk2 small{font-size:9px}
.mphotos{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}
.mphotos i{aspect-ratio:4/3;border-radius:8px;background:var(--s2);border:1px solid var(--hair);display:grid;place-items:center;color:#555;font-style:normal;font-size:9px}
.mphotos i.full{background-size:cover;background-position:center;border-color:rgba(34,197,94,.4)}
.msig{background:#f2f2f2;border-radius:10px;padding:7px 10px;display:flex;align-items:center;justify-content:space-between}
.msig small{color:#666;font-size:9px;font-weight:700}
.msig svg{height:20px;width:84px}
.msig svg path{fill:none;stroke:#222;stroke-width:1.6;stroke-linecap:round}
.mbtn{background:#fff;color:#000;border-radius:100px;text-align:center;padding:9px;font-weight:700;font-size:10.5px;margin-top:auto}
.mbtn.tonal{background:rgba(0,153,255,.16);color:#39aaff;border:1px solid rgba(0,153,255,.4)}
.mbar2{display:flex;gap:5px}
.mbar2 i{flex:1;height:3px;border-radius:3px;background:var(--s2)}
.mbar2 i.done{background:var(--blue)}

/* ============ pricing OS — engagement 1 an −18 % ============ */
.billing{display:inline-flex;background:var(--s1);border:1px solid var(--hair);border-radius:100px;padding:5px;gap:4px;margin:4px 0 28px}
.billing button{border:none;background:none;color:var(--muted);font-size:13.5px;font-weight:600;padding:9px 18px;border-radius:100px;cursor:pointer;font-family:inherit;transition:.2s;display:inline-flex;gap:9px;align-items:center;min-height:42px}
.billing button.on{background:var(--s2);color:#fff;box-shadow:inset 0 0 0 1px rgba(0,153,255,.5)}
.billing .save{background:rgba(34,197,94,.16);color:#48d97c;font-size:10.5px;font-weight:700;border-radius:100px;padding:3px 9px}
.fprice .twas{font-size:14px;color:#666;text-decoration:line-through;font-family:var(--body);letter-spacing:0;font-weight:400;margin-left:10px}
.fprice .tnote{font-size:11.5px;color:var(--muted);margin-top:2px}

/* bande dégradé bleu (page OS) */
.blueband{border-radius:30px;padding:50px 46px;position:relative;overflow:hidden;color:#fff;background:radial-gradient(700px 420px at 12% 0%,rgba(124,196,255,.5),transparent 55%),linear-gradient(135deg,#00284a,#0077cc 58%,#0099ff)}
.blueband::before{content:"";position:absolute;inset:0;background-image:radial-gradient(rgba(255,255,255,.14) 1px,transparent 1px);background-size:24px 24px;mask-image:radial-gradient(640px 340px at 50% 0%,#000,transparent)}
.blueband h3{font-family:var(--display);font-size:clamp(24px,3.2vw,38px);letter-spacing:-.04em;position:relative}
.blueband .bbgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:22px;margin-top:30px;position:relative}
.blueband .bb b{font-family:var(--display);font-size:clamp(28px,3.4vw,42px);font-weight:500;letter-spacing:-.045em;display:block}
.blueband .bb span{font-size:12.5px;color:rgba(255,255,255,.78);display:block;margin-top:5px;line-height:1.5}
.spotcard.bleu{background:radial-gradient(130% 150% at 12% 0%,#7cc4ff,#0099ff 48%,#00355e)}
.spotcard.cyan{background:radial-gradient(130% 150% at 88% 0%,#7fe7e7,#19c6c6 48%,#0a4f4f)}

/* logo RGPD dans la confiance */
.ti2.rgpd{width:96px;height:40px;border-radius:9px;background:#0f1014;padding:5px}
.ti2.rgpd img{width:100%;height:100%;object-fit:contain;padding:0}

/* ============ nav mobile — transparente, overlay plein écran ============ */
.burger{position:relative;z-index:140}
.burger::before{content:"";width:16px;height:2px;border-radius:2px;background:#fff;box-shadow:0 -5px 0 #fff,0 5px 0 #fff;display:block;transition:.25s var(--ease)}
.burger.open::before{box-shadow:none;transform:rotate(45deg)}
.burger.open::after{content:"";position:absolute;width:16px;height:2px;border-radius:2px;background:#fff;transform:rotate(-45deg)}
@media(max-width:880px){
  nav{padding:12px 14px}
  nav .navpill{background:rgba(10,10,10,.38);backdrop-filter:blur(24px) saturate(1.5);border-color:rgba(255,255,255,.13);border-radius:24px;padding:8px 10px}
  nav.scrolled .navpill{background:rgba(10,10,10,.6)}
  nav .navpill>.btn{display:none}
  nav .links{position:fixed;inset:0;z-index:135;background:rgba(9,9,9,.72);backdrop-filter:blur(30px) saturate(1.4);display:none;flex-direction:column;justify-content:center;align-items:center;gap:6px;border:none;border-radius:0;padding:60px 24px;top:0;left:0;right:0}
  nav .links.open{display:flex;animation:navin .35s var(--ease)}
  @keyframes navin{from{opacity:0}}
  nav .links a{font-size:26px;font-family:var(--display);font-weight:500;letter-spacing:-.03em;padding:13px 26px;color:rgba(255,255,255,.8);background:none;border-radius:16px;opacity:0;transform:translateY(14px);animation:linkin .45s var(--ease) forwards}
  nav .links.open a:nth-child(1){animation-delay:.05s}nav .links.open a:nth-child(2){animation-delay:.1s}nav .links.open a:nth-child(3){animation-delay:.15s}nav .links.open a:nth-child(4){animation-delay:.2s}nav .links.open a:nth-child(5){animation-delay:.25s}
  @keyframes linkin{to{opacity:1;transform:none}}
  nav .links a.on{color:#fff;background:rgba(255,255,255,.08)}
  .duo{grid-template-columns:1fr}
  .dcard2{min-height:0;padding:30px 24px}
  .ticker3{gap:9px}
  .tk{padding:12px 16px;gap:11px;flex:1 1 44%}
  .tk b{font-size:19px}
  .xpanels{flex-direction:column;height:auto}
  .xp{min-height:210px;flex:none}
  .xp p{opacity:1;transform:none}
  .xp h3,.xp .cmod{white-space:normal}
  .blueband{padding:32px 22px}
  .blueband .bbgrid{grid-template-columns:1fr 1fr}
  .billing{width:100%;justify-content:center}
  .siteshot{aspect-ratio:16/12}
}
@media(prefers-reduced-motion:reduce){
  .siteshot img{animation:none}
  nav .links a{opacity:1;transform:none;animation:none}
}

/* photo reveal dans le tirage au sort */
.raffle .rimg2{position:absolute;right:0;top:0;bottom:0;width:44%;height:100%;object-fit:cover;object-position:60% 40%;mask-image:linear-gradient(90deg,transparent,#000 55%);-webkit-mask-image:linear-gradient(90deg,transparent,#000 55%);opacity:.85;pointer-events:none}
.raffle>*:not(.rimg2){position:relative}
@media(max-width:880px){.raffle .rimg2{width:100%;opacity:.22;mask-image:none;-webkit-mask-image:none}}

/* ============ V14 — retours complets ============ */
.btn{overflow:hidden}
.h-sec{font-weight:600}
.journey.three,.jrail.three{grid-template-columns:repeat(3,1fr)}
/* bento : courbe qui monte + villes */
.bspark path{stroke-dasharray:1;stroke-dashoffset:1}
.bento.played .bspark path{animation:sparkup 1.8s var(--ease) .4s forwards}
@keyframes sparkup{to{stroke-dashoffset:0}}
.bcities{display:flex;gap:7px;flex-wrap:wrap;margin-top:16px}
.bcity{font-size:11.5px;font-weight:600;border:1px solid rgba(34,197,94,.35);border-radius:100px;padding:5px 12px;background:rgba(34,197,94,.08);color:#7be3a3;opacity:0;transform:translateY(8px)}
.bento.played .bcity{animation:pinin .5s var(--ease) forwards}
.bk img{height:15px}
/* concrètement — grille 2x2 */
.recv{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}
.rcv{display:flex;gap:15px;background:var(--s1);border:1px solid var(--hair);border-radius:18px;padding:20px 22px;align-items:flex-start;transition:transform .25s var(--ease)}
.rcv:hover{transform:translateY(-3px)}
.rcv .ric{width:42px;height:42px;border-radius:13px;flex:0 0 auto;display:grid;place-items:center;background:color-mix(in srgb,var(--cc,#0099ff) 14%,transparent);color:var(--cc,#0099ff);border:1px solid color-mix(in srgb,var(--cc,#0099ff) 38%,transparent);font-size:16px}
.rcv b{font-family:var(--display);font-weight:500;font-size:16px;letter-spacing:-.02em;display:block;margin-bottom:4px}
.rcv small{color:var(--muted);font-size:13px;line-height:1.5}
/* marquee partenaires */
.marquee .track{font-size:15px;font-family:var(--display);font-weight:500;letter-spacing:.02em;text-transform:none;color:#888}
/* Google Meet badge */
.meet{display:inline-flex;align-items:center;gap:8px;margin-left:auto;font-weight:700;color:#fff;font-size:11px}
.meet svg{width:17px;height:17px}
/* avis — étoiles qui se rassemblent */
.ravg{text-align:center;margin:6px 0 30px}
.ravg .bign{font-family:var(--display);font-size:clamp(54px,7vw,86px);font-weight:600;letter-spacing:-.05em;line-height:1}
.bigstars{display:flex;gap:12px;justify-content:center;margin:12px 0 8px;font-size:clamp(28px,3.6vw,40px);color:#f5b43c;text-shadow:0 0 30px rgba(245,180,60,.45)}
.bigstars i{font-style:normal;opacity:0;transform:translateY(46px) scale(.2) rotate(-30deg)}
.ravg.played .bigstars i{animation:starin .65s var(--ease) forwards}
@keyframes starin{60%{transform:translateY(-6px) scale(1.15) rotate(6deg)}100%{opacity:1;transform:none}}
.ravg small{color:var(--muted);font-size:13px}
.minirevs{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.mrev{background:var(--s1);border:1px solid var(--hair);border-radius:14px;padding:15px 17px;font-size:12.5px;color:var(--muted);line-height:1.5}
.mrev .mrh{display:flex;align-items:center;gap:8px;margin-bottom:7px}
.mrev b{font-size:12.5px;color:#fff}
.mrev .rstars{font-size:10px;color:#f5b43c;letter-spacing:2px}
.mrev img{height:13px;margin-left:auto}
/* xpanels vidéo */
.xp video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
/* équipe */
.team{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.tmate{background:var(--s1);border:1px solid var(--hair);border-radius:20px;padding:26px 20px;text-align:center;transition:transform .25s var(--ease)}
.tmate:hover{transform:translateY(-4px)}
.tmate .tav{width:68px;height:68px;border-radius:50%;margin:0 auto 14px;display:grid;place-items:center;font-family:var(--display);font-weight:600;font-size:21px;color:#fff;background:linear-gradient(135deg,var(--c1,#39aaff),var(--c2,#0066bb));overflow:hidden}
.tmate .tav img{width:100%;height:100%;object-fit:cover}
.tmate b{font-family:var(--display);font-weight:500;font-size:16.5px;letter-spacing:-.02em;display:block}
.tmate span{font-size:12.5px;color:var(--muted);display:block;margin-top:4px;line-height:1.5}
/* DA des 3 parcours Lab */
.offer.ini{background:var(--canvas);border:1px dashed #333}
.offer.pro{background:var(--s2);border:none;box-shadow:inset 0 1px 0 rgba(255,255,255,.09),0 0 0 1px rgba(106,76,245,.45),0 30px 70px rgba(0,0,0,.5);transform:translateY(-6px)}
.offer.pro:hover{transform:translateY(-12px)}
.offer.pt{background:radial-gradient(280px 200px at 100% 0%,rgba(255,122,61,.15),transparent 70%),var(--s1)}
/* OS hero — tableau de bord qui se remplit */
.fillboard{max-width:640px;margin:50px auto 0;text-align:left;background:rgba(10,11,15,.8);backdrop-filter:blur(16px);border:1px solid rgba(0,153,255,.3);border-radius:20px;padding:16px 16px 14px;box-shadow:0 50px 110px rgba(0,0,0,.55),0 0 70px rgba(0,153,255,.10);font-size:11.5px;color:var(--muted);display:flex;flex-direction:column;gap:9px}
.fillboard [data-f]{opacity:0;transform:translateY(12px);transition:opacity .6s var(--ease),transform .6s var(--ease)}
.fillboard.fon [data-f]{opacity:1;transform:none}
/* gain de temps — bande */
.speed{display:grid;grid-template-columns:repeat(3,1fr);border:1px solid var(--hair);border-radius:24px;overflow:hidden;background:var(--s1)}
.sp{padding:38px 26px;text-align:center;border-left:1px solid var(--hair-soft);position:relative}
.sp:first-child{border-left:none}
.sp b{font-family:var(--display);font-weight:600;font-size:clamp(38px,4.6vw,58px);letter-spacing:-.05em;color:#fff;display:block;line-height:1}
.sp b em{font-style:normal;color:var(--blue)}
.sp span{font-size:13px;color:var(--muted);display:block;margin-top:10px;line-height:1.55}
/* IA — statique */
.ialines{margin-top:26px;display:flex;flex-direction:column;gap:12px;max-width:560px}
.ialine{display:flex;gap:12px;align-items:flex-start;font-size:15.5px;color:rgba(255,255,255,.92);border-left:2px solid rgba(255,255,255,.35);padding-left:14px}
.ialine b{color:#fff}
/* personas 2 colonnes */
.personas.two{grid-template-columns:1fr 1fr}
/* espaces clients */
.spaces{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.space{border-radius:24px;padding:28px 26px;border:1px solid var(--hair);background:var(--s1);display:flex;flex-direction:column;transition:transform .25s var(--ease),border-color .25s}
.space:hover{transform:translateY(-5px);border-color:color-mix(in srgb,var(--sc,#0099ff) 40%,var(--hair))}
.space .sic{width:44px;height:44px;border-radius:13px;display:grid;place-items:center;font-size:18px;background:color-mix(in srgb,var(--sc,#0099ff) 14%,transparent);color:var(--sc,#0099ff);border:1px solid color-mix(in srgb,var(--sc,#0099ff) 38%,transparent);margin-bottom:16px}
.space h3{font-size:20px;letter-spacing:-.03em;margin-bottom:6px}
.space .swho{font-size:12.5px;color:var(--muted);margin-bottom:14px}
.space ul{list-style:none;display:flex;flex-direction:column;gap:8px;flex:1;margin-bottom:18px}
.space li{color:var(--muted);font-size:13.5px;padding-left:22px;position:relative}
.space li::before{content:"";position:absolute;left:0;top:8px;width:12px;height:2px;background:var(--sc,#0099ff);border-radius:2px}
/* plateformes */
.plats{display:flex;gap:9px;align-items:center;justify-content:center;margin-top:8px}
.plats svg{width:20px;height:20px;stroke:#bbb;fill:none;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
@media(max-width:880px){
  .journey.three,.recv,.minirevs,.spaces{grid-template-columns:1fr}
  .team{grid-template-columns:1fr 1fr}
  .speed{grid-template-columns:1fr}
  .sp{border-left:none;border-top:1px solid var(--hair-soft)}
  .offer.pro{transform:none}
}

/* ============ V15 ============ */
/* contenus — grille sociale, lecture auto */
.socials{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.soc{position:relative;border-radius:22px;overflow:hidden;border:1px solid var(--hair);aspect-ratio:9/15;background:var(--s1)}
.soc video{width:100%;height:100%;object-fit:cover}
.soc::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(9,9,9,.4),transparent 26%,transparent 58%,rgba(9,9,9,.8))}
.soc .shd{position:absolute;top:12px;left:13px;right:13px;display:flex;align-items:center;gap:8px;z-index:2;font-size:11.5px;font-weight:700}
.soc .shd img{height:16px}
.soc .sft{position:absolute;left:15px;bottom:14px;z-index:2}
.soc .sft b{font-family:var(--display);font-size:20px;letter-spacing:-.03em;display:block;font-weight:500}
.soc .sft small{font-size:11px;color:rgba(255,255,255,.7)}
/* IA — commande vocale → résultats qui s'allument */
.ia3grid{display:grid;grid-template-columns:1fr .95fr;gap:38px;align-items:center;position:relative;z-index:2;margin-top:6px}
.iachips{display:flex;gap:8px;flex-wrap:wrap;margin-top:22px}
.iachip{border:1px solid rgba(255,255,255,.3);border-radius:100px;padding:7px 15px;font-size:12.5px;color:#fff;background:rgba(9,9,9,.25);font-weight:600}
.iacmd{background:rgba(9,9,9,.42);border:1px solid rgba(255,255,255,.35);border-radius:100px;padding:13px 20px;display:flex;align-items:center;gap:12px;font-size:14px;color:#fff;font-weight:600;box-shadow:0 0 36px rgba(212,77,240,.3)}
.iacmd .mic{width:10px;height:10px;border-radius:50%;background:#fff;animation:blinkdot 1.4s infinite;flex:0 0 auto}
.iares{display:flex;flex-direction:column;gap:9px;margin-top:13px}
.iare{display:flex;align-items:center;gap:11px;background:rgba(9,9,9,.38);border:1px solid rgba(255,255,255,.16);border-radius:14px;padding:11px 15px;font-size:13px;color:rgba(255,255,255,.85);opacity:.3;transform:translateX(12px);transition:.5s var(--ease)}
.iare.lit{opacity:1;transform:none;border-color:rgba(255,255,255,.45);background:rgba(255,255,255,.10)}
.iare .ok{width:18px;height:18px;border-radius:6px;background:rgba(34,197,94,.3);color:#7be3a3;display:grid;place-items:center;font-size:10px;flex:0 0 auto;font-weight:700}
/* pour qui — cartes photo */
.whoz{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.who2{position:relative;border-radius:26px;overflow:hidden;border:1px solid var(--hair);min-height:400px;display:flex;align-items:flex-end;transition:transform .3s var(--ease)}
.who2:hover{transform:translateY(-5px)}
.who2 img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .8s var(--ease)}
.who2:hover img{transform:scale(1.05)}
.who2::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(9,9,9,.15) 30%,rgba(9,9,9,.93))}
.who2 .wtt{position:relative;z-index:2;padding:30px 28px}
.who2 .wtag{display:inline-block;font-size:12px;color:var(--wc,#39aaff);font-weight:700;margin-bottom:9px}
.who2 h3{font-size:27px;letter-spacing:-.04em;margin-bottom:9px}
.who2 p{color:rgba(255,255,255,.84);font-size:14px;line-height:1.55;max-width:52ch}
/* espaces — boutons tonals colorés */
.space .btn-sp{margin-top:auto;display:inline-flex;align-items:center;justify-content:center;gap:8px;border-radius:100px;padding:12px 18px;font-size:13.5px;font-weight:600;background:color-mix(in srgb,var(--sc) 14%,transparent);color:var(--sc);border:1px solid color-mix(in srgb,var(--sc) 38%,transparent);transition:.25s var(--ease);min-height:44px}
.space .btn-sp::after{content:"→";transition:transform .25s var(--ease)}
.space .btn-sp:hover{background:color-mix(in srgb,var(--sc) 24%,transparent);transform:translateY(-2px)}
.space .btn-sp:hover::after{transform:translateX(4px)}
/* réplique OS : logo + mobile propre */
.otop .ologo{height:11px}
@media(max-width:880px){
  .omain{min-height:560px}
  .oview{overflow-y:auto;gap:8px;padding:14px}
  .oview .ohead b{font-size:15px}
  .ogantt{grid-template-columns:74px repeat(8,1fr)}
}
/* portail — onglets & calendrier (page espaces) */
.ptabs{display:flex;gap:5px}
.ptabs b{flex:1;text-align:center;font-size:9.5px;padding:6px 4px;border-radius:8px;background:var(--s2);color:var(--muted);font-weight:600}
.ptabs b.on{background:rgba(106,76,245,.2);color:#a18fff}
.mcal{display:grid;grid-template-columns:repeat(7,1fr);gap:3px}
.mcal i{aspect-ratio:1;border-radius:5px;background:var(--s2);display:grid;place-items:center;font-size:8px;color:#666;font-style:normal}
.mcal i.b{background:rgba(0,153,255,.32);color:#fff}
.mcal i.v{background:rgba(106,76,245,.32);color:#fff}
/* carte de France — 3D relief */
.map2{perspective:1200px}
.map2 svg{transform:rotateX(24deg);transform-origin:50% 66%;filter:drop-shadow(0 44px 60px rgba(0,0,0,.55)) drop-shadow(0 20px 50px rgba(0,153,255,.16))}
.map2 .extr{fill:#04121d;stroke:rgba(0,153,255,.2);stroke-width:2;stroke-linejoin:round}
.map2 .extr.be{fill:#160c04;stroke:rgba(255,122,61,.18)}
@media(max-width:880px){
  .socials{grid-template-columns:1fr 1fr}
  .whoz,.ia3grid{grid-template-columns:1fr}
  .map2 svg{transform:rotateX(16deg)}
}

/* ============ V16 ============ */
.cquoi{display:grid;grid-template-columns:1.05fr .95fr;gap:46px;align-items:center}
.cqviz{background:var(--s1);border:1px solid var(--hair);border-radius:24px;padding:26px;display:flex;flex-direction:column;gap:10px}
.cqrow{display:flex;align-items:center;gap:12px;background:var(--s2);border:1px solid var(--hair);border-radius:14px;padding:13px 16px;font-size:13.5px;color:var(--muted)}
.cqrow .ci{width:36px;height:36px;border-radius:11px;display:grid;place-items:center;flex:0 0 auto;background:color-mix(in srgb,var(--cc,#0099ff) 14%,transparent);color:var(--cc,#0099ff);border:1px solid color-mix(in srgb,var(--cc,#0099ff) 38%,transparent)}
.cqrow b{color:#fff}
.cqrev{background:radial-gradient(360px 200px at 15% 0%,rgba(34,197,94,.14),transparent),var(--s2);border:1px solid rgba(34,197,94,.35);border-radius:16px;padding:18px;text-align:center}
.cqrev b{font-family:var(--display);font-weight:600;font-size:clamp(34px,4vw,46px);letter-spacing:-.045em;color:#7be3a3;display:block}
.cqrev small{font-size:12px;color:var(--muted)}
.cqbar{height:9px;border-radius:100px;background:var(--canvas);overflow:hidden;margin-top:12px}
.cqbar i{display:block;height:100%;width:0;background:linear-gradient(90deg,#16a34a,#22c55e);transition:width 1.8s var(--ease)}
.cascade.played .cqbar i{width:70%}
.cqsplit{display:flex;justify-content:space-between;font-size:11.5px;color:var(--muted);margin-top:7px}
.recv.compact{grid-template-columns:repeat(4,1fr)}
.recv.compact .rcv{flex-direction:column;gap:11px;padding:18px}
.recv.compact small{font-size:12px}
.rlogo{font-family:var(--display);font-weight:600;letter-spacing:-.02em;color:#fff;background:var(--s2);border:1px solid #333;border-radius:9px;padding:3px 10px;font-size:13px}
@media(max-width:880px){.cquoi{grid-template-columns:1fr}}

/* ============ V17 ============ */
.rtag{transition:transform 2.4s var(--ease),opacity 2.4s}
.rtag:nth-child(2){transition-delay:.3s}.rtag:nth-child(3){transition-delay:.6s}.rtag:nth-child(4){transition-delay:.9s}.rtag:nth-child(5){transition-delay:1.2s}.rtag:nth-child(6){transition-delay:1.5s}.rtag:nth-child(7){transition-delay:1.8s}.rtag:nth-child(8){transition-delay:2.1s}.rtag:nth-child(9){transition-delay:2.4s}
.rlogo.turo{background:#fff;color:#121214;border:none;border-radius:100px;font-weight:800;text-transform:lowercase;letter-spacing:-.04em;padding:4px 13px}
.rlogo.roadstr{background:#17181c;color:#fff;border-color:#3a3a3a;font-weight:700;letter-spacing:.12em;font-size:11.5px}
@media(max-width:880px){
  nav .links{justify-content:center;align-items:center;text-align:center;gap:10px}
  nav .links a{width:min(320px,82vw);text-align:center}
}

/* ============ V18 ============ */
.wa{position:fixed;right:18px;bottom:18px;z-index:115;width:56px;height:56px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(135deg,#2bd366,#1faa52);box-shadow:0 10px 30px rgba(0,0,0,.4),0 0 0 0 rgba(37,211,102,.5);animation:waglow 2.6s infinite}
.wa svg{width:28px;height:28px;fill:#fff}
@keyframes waglow{0%,100%{box-shadow:0 10px 30px rgba(0,0,0,.4),0 0 0 0 rgba(37,211,102,.55)}50%{box-shadow:0 10px 30px rgba(0,0,0,.4),0 0 0 14px rgba(37,211,102,0)}}
@media(max-width:880px){nav .links{z-index:200}.burger{z-index:210}}

/* ============ V19 — cartes parcours sans carré, événements titre seul ============ */
.offer .planhead{background:none;aspect-ratio:auto;padding:24px 24px 14px;justify-content:flex-start;border-bottom:1px solid var(--hair-soft)}
.offer .planhead::before{display:none}
.offer .planhead .pmods{display:none}
.offer .planhead .otag{position:static;margin-right:auto}
.proof.solo{min-height:380px;align-items:center;justify-content:center;text-align:center}
.proof.solo .pwz{display:block;text-align:center}
.proof.solo h3{font-size:clamp(30px,4.6vw,54px)}

/* ============ V20 ============ */
.proof.solo small{display:block;font-size:14px;color:rgba(255,255,255,.8);margin-top:10px}
.spaces .space{padding:20px 19px;border-radius:18px;background:radial-gradient(220px 150px at 18% 0%,color-mix(in srgb,var(--sc) 12%,transparent),transparent 70%),var(--s1);border-color:color-mix(in srgb,var(--sc) 30%,var(--hair));box-shadow:0 0 44px color-mix(in srgb,var(--sc) 9%,transparent)}
.spaces .space h3{font-size:17px}
.spaces .space li{font-size:12.5px}
.spaces .space .sic{width:36px;height:36px;border-radius:11px;font-size:15px;margin-bottom:12px}
.popup{position:fixed;inset:0;z-index:300;display:none;place-items:center;background:rgba(9,9,9,.66);backdrop-filter:blur(10px);padding:20px}
.popup.on{display:grid}
.pop{width:min(420px,94vw);background:radial-gradient(360px 220px at 80% 0%,rgba(0,153,255,.16),transparent),var(--s1);border:1px solid rgba(0,153,255,.4);border-radius:24px;padding:30px 28px;position:relative;box-shadow:0 50px 120px rgba(0,0,0,.6)}
.pop .px{position:absolute;top:14px;right:14px;width:34px;height:34px;border-radius:50%;background:var(--s2);border:1px solid var(--hair);color:#fff;cursor:pointer;font-size:13px}
.pop h3{font-size:23px;letter-spacing:-.035em;margin-bottom:6px}
.pop p{color:var(--muted);font-size:13.5px;margin-bottom:16px}
.pop .gift{display:inline-flex;gap:8px;background:rgba(34,197,94,.14);border:1px solid rgba(34,197,94,.4);color:#7be3a3;border-radius:100px;padding:6px 14px;font-size:12px;font-weight:700;margin-bottom:14px}

/* ============ V21 — cartes parcours optimisées ============ */
.offer .obody{padding:18px 24px 24px}
.offer .oprice{font-size:33px;margin:8px 0 2px}
.offer ul{gap:7px;margin:8px 0 18px}
.offer li{font-size:13px}
.offer h3{font-size:19px}
.offer .odesc{font-size:13px;margin-bottom:10px}
.phonewrap{display:grid;grid-template-columns:1fr auto;gap:54px;align-items:center}
@media(max-width:880px){.phonewrap{grid-template-columns:1fr;gap:30px}.phonewrap .iphone{margin:0 auto}}

/* ============ V22 ============ */
.offer .planhead{gap:12px;flex-wrap:wrap;padding:20px 22px 14px}
.offer .planhead img{height:15px}
.offer .planhead .otag{font-size:10px;padding:5px 11px;flex:0 0 auto}
.cqrow{font-size:14px;letter-spacing:-.011em;line-height:1.5}
.cqrow b{font-weight:600;color:#fff}
.cqrev small{font-size:12px}
.jbtn{margin-top:auto;display:inline-flex;align-items:center;justify-content:center;gap:10px;border-radius:100px;padding:12px 20px;font-size:13.5px;font-weight:600;background:color-mix(in srgb,var(--jc,#fff) 13%,transparent);color:var(--jc,#fff);border:1px solid color-mix(in srgb,var(--jc,#fff) 36%,transparent);position:relative;overflow:hidden;transition:.3s var(--ease);min-height:46px}
.jbtn i{font-style:normal;transition:transform .3s var(--ease)}
.jbtn::before{content:"";position:absolute;inset:0;background:linear-gradient(110deg,transparent 30%,color-mix(in srgb,var(--jc,#fff) 24%,transparent) 50%,transparent 70%);transform:translateX(-130%);animation:jslide 2.8s var(--ease) infinite}
@keyframes jslide{55%,100%{transform:translateX(130%)}}
.jstep:hover .jbtn{background:color-mix(in srgb,var(--jc,#fff) 22%,transparent)}
.jstep:hover .jbtn i{transform:translateX(5px)}
.marquee .track span{font-size:16px}
.marquee .track .lg1{font-weight:800;letter-spacing:.05em;text-transform:uppercase;color:#ddd}
.marquee .track .lg2{font-family:Georgia,"Times New Roman",serif;font-style:italic;color:#ddd;text-transform:none}
.marquee .track .lg3{font-weight:600;border:1.5px solid #4a4a4a;border-radius:9px;padding:4px 12px;color:#eee}
.marquee .track .lg4{letter-spacing:.3em;font-weight:500;text-transform:uppercase;color:#ccc;font-size:13px}
.mui .mtop .mlogo{height:9px;margin-left:auto}
.mui .mtop .mlogo+.mck{margin-left:10px}
@media(prefers-reduced-motion:reduce){.jbtn::before{animation:none}}

/* ============ V23 ============ */
.hero-bg.duov::after{background:linear-gradient(180deg,rgba(9,9,9,.55),rgba(9,9,9,.4) 45%,rgba(9,9,9,.94) 84%,var(--canvas) 95%)!important}
.hero-bg.duov video{filter:none}
.feedhero .hero-glow{background:radial-gradient(700px 400px at 50% 105%,rgba(255,255,255,.05),transparent)!important}
.hero4 h1{animation:hin 1.1s var(--ease) both}
.hero4 .sub{animation:hin 1.1s .18s var(--ease) both}
@keyframes hin{from{opacity:0;transform:translateY(26px);filter:blur(6px)}to{opacity:1;transform:none;filter:none}}
.osreal .owin{transition:transform .3s var(--ease)}
.osreal:hover .owin{transform:perspective(1400px) rotateX(1.6deg) scale(1.004)}
@media(max-width:880px){
  nav .links{top:auto;left:0;right:0;bottom:0;height:auto;max-height:74svh;border-radius:28px 28px 0 0;background:rgba(12,12,12,.94);padding:34px 22px 44px;justify-content:flex-start}
  nav .links::before{content:"";width:44px;height:4px;border-radius:4px;background:#3a3a3a;margin-bottom:14px}
  nav .links.open{animation:sheetup .4s var(--ease)}
  @keyframes sheetup{from{transform:translateY(40%);opacity:0}}
  nav .links a{font-size:21px;padding:12px}
}

/* ============ V24 ============ */
.siteshot.fast img{animation:siteglide 9s ease-in-out infinite alternate}
.siteshot.fast{aspect-ratio:16/9}
@keyframes siteglide{from{transform:translateY(0)}to{transform:translateY(calc(-100% + 100cqh))}}
.siteshot{container-type:inline-size}
.proof.solo{border:none;background:#0b0d12;box-shadow:inset 0 0 0 1px rgba(245,180,60,.35),0 40px 100px rgba(0,0,0,.5),0 0 80px rgba(245,180,60,.07)}
.proof.solo::after{background:linear-gradient(200deg,rgba(9,9,9,.15),rgba(9,9,9,.86) 88%)}
.proof.solo .pwz{display:flex;flex-direction:column;align-items:center;gap:12px;padding:46px 30px}
.proof.solo .evb{display:inline-flex;align-items:center;gap:9px;background:linear-gradient(120deg,#f5b43c,#ff7a3d);color:#1d0f02;font-weight:800;font-size:11.5px;border-radius:100px;padding:7px 16px;letter-spacing:.05em;text-transform:uppercase}
.proof.solo h3{background:linear-gradient(110deg,#fff 30%,#ffe9c4 50%,#fff 70%);background-size:200% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:shimmer 4s ease-in-out infinite}
.proof.solo .evchips{display:flex;gap:8px;flex-wrap:wrap;justify-content:center}
.proof.solo .evchips span{font-size:12px;font-weight:600;color:rgba(255,255,255,.85);border:1px solid rgba(255,255,255,.25);background:rgba(9,9,9,.4);border-radius:100px;padding:6px 14px;backdrop-filter:blur(6px)}

/* V25 */
.jstep .jbtn{background:color-mix(in srgb,var(--jc,#fff) 20%,transparent);border-color:color-mix(in srgb,var(--jc,#fff) 52%,transparent);color:#fff}
.jstep:hover .jbtn{background:color-mix(in srgb,var(--jc,#fff) 32%,transparent)}

/* V26 — réplique OS interactive */
.oit[data-v]{cursor:pointer}
.oit[data-v]:hover{background:rgba(255,255,255,.05);color:#fff}
.oslegend span{cursor:pointer}

/* ============ V27 — nav mobile : menu déroulant vers le bas (définitif) ============ */
@media(max-width:880px){
  nav .links{position:fixed;inset:80px 12px auto 12px;top:80px;left:12px;right:12px;bottom:auto;height:auto;max-height:calc(100svh - 100px);overflow-y:auto;border-radius:24px;background:rgba(12,12,12,.97);border:1px solid rgba(255,255,255,.13);padding:12px;display:none;flex-direction:column;gap:4px;align-items:stretch;justify-content:flex-start;text-align:left;backdrop-filter:blur(26px);box-shadow:0 30px 80px rgba(0,0,0,.65);z-index:200}
  nav .links::before{display:none}
  nav .links.open{display:flex;animation:dropdn .32s var(--ease)}
  @keyframes dropdn{from{opacity:0;transform:translateY(-14px)}}
  nav .links a{font-size:17px;font-family:var(--display);padding:15px 18px;width:auto;min-height:52px;display:flex;align-items:center;text-align:left;border-radius:15px;opacity:1;transform:none;animation:none;color:rgba(255,255,255,.85)}
  nav .links a.on{background:rgba(255,255,255,.08);color:#fff}
  nav .links a:active{background:rgba(255,255,255,.12)}
}

/* V28 — menu déroulant coloré + bouton téléphone */
@media(max-width:880px){
  nav .links a[href="lab.html"]{background:rgba(106,76,245,.16);color:#b9a8ff;border:1px solid rgba(106,76,245,.4);margin-top:2px}
  nav .links a[href="os.html"]{background:rgba(0,153,255,.14);color:#7cc4ff;border:1px solid rgba(0,153,255,.4);margin:2px 0}
  nav .links a[href="lab.html"].on,nav .links a[href="os.html"].on{color:#fff}
  .navtel{display:grid!important}
}
.navtel{display:none;place-items:center;width:42px;height:42px;border-radius:13px;background:rgba(34,197,94,.15);border:1px solid rgba(34,197,94,.45);flex:0 0 auto}
.navtel svg{width:18px;height:18px;fill:#48d97c}

/* ============ V29 — bouton tel transparent intégré, menu à icônes, sans WhatsApp ============ */
.wa{display:none!important}
.navtel{display:grid;place-items:center;width:40px;height:40px;border-radius:50%;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.16);margin-left:6px;transition:.2s}
.navtel:hover{background:rgba(255,255,255,.12)}
.navtel svg{width:17px;height:17px;fill:#fff}
@media(max-width:880px){
  .navtel{display:grid!important;margin-left:auto;margin-right:6px}
  nav .navpill{gap:4px}
  /* menu : icônes de section, sans couleurs */
  nav .links a[href="lab.html"],nav .links a[href="os.html"]{background:none;border:none;color:rgba(255,255,255,.85);margin:0}
  nav .links a{gap:12px}
  nav .links a::before{content:"";width:22px;height:22px;flex:0 0 auto;background:center/contain no-repeat}
  nav .links a[href="index.html"]::before{background-image:url(assets/logo/mark-blue.svg)}
  nav .links a[href="lab.html"]::before{background-image:url(assets/logo/lab-appicon.svg)}
  nav .links a[href="os.html"]::before{background-image:url(assets/logo/os-appicon.svg)}
  nav .links a[href="tarifs.html"]::before{content:"€";background:none;display:grid;place-items:center;font-size:15px;color:#999;font-weight:600}
  nav .links a[href="contact.html"]::before{content:"✆";background:none;display:grid;place-items:center;font-size:16px;color:#999}
}

/* V30 */
@media(max-width:880px){nav .links a[href="index.html"]::before{background-image:url(assets/logo/mark-white.svg)}}
.osstat{display:inline-flex;align-items:center;gap:10px;margin-top:22px;background:rgba(34,197,94,.1);border:1px solid rgba(34,197,94,.35);border-radius:100px;padding:9px 18px;font-size:13.5px;font-weight:600;color:#7be3a3}
.osstat b{font-family:var(--display);font-size:17px;color:#fff;letter-spacing:-.02em}

/* V31 — badge avis sous le titre */
.gbadge{display:inline-flex;align-items:center;gap:11px;background:rgba(12,12,12,.55);border:1px solid rgba(255,255,255,.14);border-radius:100px;padding:10px 19px;backdrop-filter:blur(12px);margin-top:22px}
.gbadge img{height:17px}
.gbadge b{font-family:var(--display);font-weight:600;font-size:17px;letter-spacing:-.02em;color:#fff}
.gbadge .stars{font-size:12px;letter-spacing:2.5px}
.gbadge span{font-size:13px;color:rgba(255,255,255,.65);font-weight:500}
.gbadge i{font-style:normal;color:#555}
.gbadge strong{font-family:var(--display);font-weight:600;font-size:13.5px;color:#fff;letter-spacing:-.01em}
@media(max-width:880px){.gbadge{flex-wrap:wrap;gap:8px;padding:9px 14px}}

/* V32 — badge avis : intégration mobile */
@media(max-width:880px){
  .gbadge{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;text-align:center;width:100%;max-width:340px;border-radius:20px;padding:14px 18px 13px;gap:10px;row-gap:6px;margin-top:20px}
  .gbadge i{display:none}
  .gbadge b{font-size:19px}
  .gbadge .stars{font-size:13px}
  .gbadge span{flex-basis:100%;order:5;font-size:12.5px}
  .gbadge strong{flex-basis:100%;order:6;font-size:14px;margin-top:-2px}
}

/* ============ V33 — fallbacks navigateurs mobiles (color-mix / svh non supportés) ============ */
@supports not (color: color-mix(in srgb, red 50%, blue)) {
  .pillbadge{background:rgba(0,153,255,.10);border-color:rgba(0,153,255,.38)}
  .jstep:nth-child(1) .jbtn{background:rgba(255,255,255,.14);border-color:rgba(255,255,255,.45)}
  .jstep:nth-child(2) .jbtn{background:rgba(143,123,255,.18);border-color:rgba(143,123,255,.5)}
  .jstep:nth-child(3) .jbtn{background:rgba(57,170,255,.16);border-color:rgba(57,170,255,.5)}
  .jbtn::before{background:linear-gradient(110deg,transparent 30%,rgba(255,255,255,.22) 50%,transparent 70%)}
  .jstep:hover{border-color:#3a3a3a}
  .copt.on{border-color:rgba(0,153,255,.55);background:rgba(0,153,255,.07)}
  .copt.on .cbox{background:#0099ff;border-color:#0099ff}
  .otag,.mtag{background:rgba(255,255,255,.07)}
  .space .sic,.rcv .ric,.cqrow .ci{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.22)}
  .space{border-color:#2c2c2c;background:var(--s1);box-shadow:none}
  .space .btn-sp{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.25)}
  .show-item.on,.demo-tabs button.on{border-color:rgba(0,153,255,.55)}
  .fprice.feat{box-shadow:inset 0 1px 0 rgba(255,255,255,.10),0 0 0 1px rgba(0,153,255,.30),0 30px 70px rgba(0,0,0,.45)}
  .cart{border-color:#2f4a63;background:var(--s1)}
  .offer:hover{border-color:#3a3a3a}
  .pillar,.osbridge{border-color:#2c2c2c}
  .cta3d{background:radial-gradient(640px 360px at 18% 0%,rgba(0,153,255,.2),transparent 60%),var(--s1);border-color:rgba(0,153,255,.3)}
  .hero-glow{background:radial-gradient(700px 420px at 22% 80%,rgba(0,153,255,.09),transparent)}
  .cursor-glow{display:none}
  .navtel{background:rgba(255,255,255,.06)}
}
@supports not (height: 100svh) {
  .hero,.hero4{min-height:100vh}
  nav .links{max-height:calc(100vh - 100px)}
}
@supports not (height: 1cqh) {
  .siteshot.fast img{animation:siteglide2 9s ease-in-out infinite alternate}
  @keyframes siteglide2{from{transform:translateY(0)}to{transform:translateY(-70%)}}
}

/* ============ V34 — vitrine plateforme Lab (PC + mobile, mouvement) ============ */
.labshow{display:grid;grid-template-columns:1fr 300px;gap:34px;align-items:center}
.labshow .browser{box-shadow:0 60px 130px rgba(0,0,0,.6),0 0 90px rgba(106,76,245,.14)}
.labshow .browser img{display:block;width:100%}
.labshow .iphone{width:min(270px,70vw);margin:0 auto}
.labshow .iphone .screen img{width:100%;height:100%;object-fit:cover;object-position:top}
.fopts{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:34px}
.fopt{background:var(--s1);border:1px solid var(--hair);border-radius:18px;padding:20px 22px;display:flex;gap:14px;align-items:flex-start;transition:transform .25s var(--ease),border-color .25s}
.fopt:hover{transform:translateY(-4px);border-color:rgba(106,76,245,.45)}
.fopt i{font-style:normal;width:40px;height:40px;border-radius:12px;display:grid;place-items:center;font-size:16px;flex:0 0 auto;background:color-mix(in srgb,var(--fc,#8f7bff) 14%,transparent);color:var(--fc,#8f7bff);border:1px solid color-mix(in srgb,var(--fc,#8f7bff) 38%,transparent)}
.fopt b{font-family:var(--display);font-weight:500;font-size:15.5px;letter-spacing:-.02em;display:block;margin-bottom:4px}
.fopt small{color:var(--muted);font-size:12.5px;line-height:1.5}
@media(max-width:880px){.labshow{grid-template-columns:1fr}.fopts{grid-template-columns:1fr}}
@supports not (color: color-mix(in srgb, red 50%, blue)){.fopt i{background:rgba(143,123,255,.14);border-color:rgba(143,123,255,.38)}}

/* ============ V35 — OS loueurs-first : morph de logo ============ */
.morph{position:relative;height:64px;display:flex;align-items:center;justify-content:center;overflow:hidden}
.morph img{height:22px;position:absolute;animation:mout 5.6s var(--ease) infinite}
.morph .yours{position:absolute;font-family:var(--display);font-weight:600;font-size:24px;letter-spacing:-.03em;color:#fff;animation:min2 5.6s var(--ease) infinite;display:flex;align-items:center;gap:10px}
.morph .yours i{font-style:normal;width:26px;height:26px;border-radius:8px;background:linear-gradient(135deg,#f5b43c,#ff7a3d);display:inline-block}
@keyframes mout{0%,38%{opacity:1;filter:blur(0)}50%,88%{opacity:0;filter:blur(14px)}100%{opacity:1;filter:blur(0)}}
@keyframes min2{0%,38%{opacity:0;filter:blur(14px)}50%,88%{opacity:1;filter:blur(0)}100%{opacity:0;filter:blur(14px)}}

/* ============ V36 — modèles animés loueurs ============ */
.anim3{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.acard{background:var(--s1);border:1px solid var(--hair);border-radius:22px;padding:24px;display:flex;flex-direction:column;gap:12px;position:relative;overflow:hidden}
.acard h3{font-size:19px;letter-spacing:-.03em}
.acard>p{color:var(--muted);font-size:13px;line-height:1.55}
.fcstep{display:flex;align-items:center;gap:10px;background:var(--s2);border:1px solid var(--hair);border-radius:12px;padding:10px 13px;font-size:12.5px;color:var(--muted);opacity:.3;animation:stepl 8s var(--ease) infinite}
.fcstep b{color:#fff;font-weight:600}
.fcstep .fck{width:18px;height:18px;border-radius:6px;background:rgba(0,153,255,.16);color:#39aaff;display:grid;place-items:center;font-size:10px;flex:0 0 auto;font-weight:700}
.fcstep:nth-child(2){animation-delay:0s}.fcstep:nth-child(3){animation-delay:1.5s}.fcstep:nth-child(4){animation-delay:3s}.fcstep:nth-child(5){animation-delay:4.5s}
@keyframes stepl{0%{opacity:.3;transform:translateX(6px)}8%,82%{opacity:1;transform:none}92%,100%{opacity:.3;transform:translateX(6px)}}
.chrono{position:absolute;top:18px;right:18px;background:rgba(34,197,94,.12);border:1px solid rgba(34,197,94,.4);color:#7be3a3;border-radius:100px;padding:5px 13px;font-size:11px;font-weight:700;animation:blinkdot 2s infinite}
.timewrap{margin-top:6px}
.timewrap small{font-size:11.5px;color:var(--muted)}
.timebar{height:14px;border-radius:100px;background:var(--s2);overflow:hidden;margin:7px 0}
.timebar i{display:block;height:100%;border-radius:100px;background:linear-gradient(90deg,#0077cc,#0099ff);animation:shrink 6s var(--ease) infinite}
@keyframes shrink{0%,15%{width:100%}55%,85%{width:14%}100%{width:100%}}
.timebig{font-family:var(--display);font-weight:600;font-size:clamp(28px,3vw,38px);letter-spacing:-.045em}
.timebig em{font-style:normal;color:#39aaff}
.starline{display:flex;gap:10px;font-size:34px;color:#f5b43c;text-shadow:0 0 26px rgba(245,180,60,.4);margin:4px 0}
.starline i{font-style:normal;opacity:.18;animation:starl 7s var(--ease) infinite}
.starline i:nth-child(1){animation-delay:.0s}.starline i:nth-child(2){animation-delay:.5s}.starline i:nth-child(3){animation-delay:1s}.starline i:nth-child(4){animation-delay:1.5s}.starline i:nth-child(5){animation-delay:2s}
@keyframes starl{0%{opacity:.18;transform:scale(.7)}9%,80%{opacity:1;transform:scale(1)}90%,100%{opacity:.18;transform:scale(.7)}}
/* upsell */
.upsell{display:grid;grid-template-columns:1fr .95fr;gap:44px;align-items:center}
.uprow{display:flex;justify-content:space-between;align-items:center;background:var(--s1);border:1px solid var(--hair);border-radius:13px;padding:12px 15px;font-size:13px;color:var(--muted);opacity:.25;animation:stepl 9s var(--ease) infinite}
.uprow b{color:#fff;font-weight:600}
.uprow .upv{color:#7be3a3;font-weight:700}
.uprow:nth-child(1){opacity:1;animation:none}
.uprow:nth-child(2){animation-delay:.6s}.uprow:nth-child(3){animation-delay:1.8s}.uprow:nth-child(4){animation-delay:3s}.uprow:nth-child(5){animation-delay:4.2s}
.uptotal{display:flex;justify-content:space-between;align-items:center;border-top:1px solid var(--hair);padding-top:14px;margin-top:6px}
.uptotal span{font-size:13px;color:var(--muted)}
.upnum{position:relative;height:38px;width:130px;overflow:hidden}
.upnum b{position:absolute;right:0;font-family:var(--display);font-weight:600;font-size:30px;letter-spacing:-.04em;opacity:0;animation:upn 9s var(--ease) infinite}
.upnum b:nth-child(1){animation-delay:0s}.upnum b:nth-child(2){animation-delay:1.8s}.upnum b:nth-child(3){animation-delay:3s}.upnum b:nth-child(4){animation-delay:4.2s}
@keyframes upn{0%{opacity:0;transform:translateY(14px)}4%,16%{opacity:1;transform:none}22%,100%{opacity:0;transform:translateY(-14px)}}
.upnum b:nth-child(4){animation-name:upnl}
@keyframes upnl{0%{opacity:0;transform:translateY(14px)}4%,88%{opacity:1;transform:none}96%,100%{opacity:0;transform:translateY(-14px)}}
.up30{display:inline-flex;align-items:baseline;gap:10px;background:rgba(34,197,94,.1);border:1px solid rgba(34,197,94,.4);border-radius:16px;padding:12px 20px;margin-top:18px}
.up30 b{font-family:var(--display);font-weight:600;font-size:30px;color:#7be3a3;letter-spacing:-.04em}
.up30 span{font-size:12px;color:var(--muted)}
@media(max-width:880px){.anim3{grid-template-columns:1fr}.upsell{grid-template-columns:1fr}}

/* ============ V37 — OS loueurs : avant/après, mails, ranking, comparatif ============ */
/* avant / après animé */
.vs{display:grid;grid-template-columns:1fr 64px 1fr;gap:0;align-items:stretch}
.vscol{border-radius:26px;padding:30px 28px;border:1px solid var(--hair);background:var(--s1)}
.vscol.bad{background:linear-gradient(180deg,rgba(224,49,75,.06),transparent 55%),var(--s1)}
.vscol.good{background:radial-gradient(560px 340px at 82% 0%,rgba(0,153,255,.16),transparent 62%),var(--s1);border-color:rgba(0,153,255,.45);box-shadow:0 0 80px rgba(0,153,255,.10)}
.vscol h3{font-size:21px;letter-spacing:-.03em;margin-bottom:16px;display:flex;align-items:center;gap:11px}
.vscol h3 .vsi{width:30px;height:30px;border-radius:10px;display:grid;place-items:center;font-size:13px;flex:0 0 auto;font-style:normal}
.bad h3 .vsi{background:rgba(224,49,75,.14);color:#ff8ba3;border:1px solid rgba(224,49,75,.4)}
.good h3 .vsi{background:rgba(0,153,255,.15);color:#39aaff;border:1px solid rgba(0,153,255,.45)}
.vsrow{display:flex;gap:11px;align-items:flex-start;padding:12px 2px;border-bottom:1px solid var(--hair-soft);font-size:14px;color:var(--muted);line-height:1.5;opacity:0}
.vsrow:last-child{border-bottom:none}
.vsrow b{color:#fff;font-weight:600}
.vsrow .vk{flex:0 0 auto;width:20px;height:20px;border-radius:7px;display:grid;place-items:center;font-size:11px;font-weight:800;margin-top:1px}
.bad .vsrow .vk{background:rgba(224,49,75,.13);color:#ff8ba3}
.good .vsrow .vk{background:rgba(0,153,255,.15);color:#39aaff}
.vs.played .bad .vsrow{animation:vsin .6s var(--ease) forwards,vsfade .7s var(--ease) forwards}
.vs.played .good .vsrow{animation:vsin .6s var(--ease) forwards}
.vs.played .bad .vsrow:nth-child(2){animation-delay:.15s,3.4s}.vs.played .bad .vsrow:nth-child(3){animation-delay:.35s,3.6s}.vs.played .bad .vsrow:nth-child(4){animation-delay:.55s,3.8s}.vs.played .bad .vsrow:nth-child(5){animation-delay:.75s,4s}.vs.played .bad .vsrow:nth-child(6){animation-delay:.95s,4.2s}.vs.played .bad .vsrow:nth-child(7){animation-delay:1.15s,4.4s}
.vs.played .good .vsrow:nth-child(2){animation-delay:3.6s}.vs.played .good .vsrow:nth-child(3){animation-delay:3.85s}.vs.played .good .vsrow:nth-child(4){animation-delay:4.1s}.vs.played .good .vsrow:nth-child(5){animation-delay:4.35s}.vs.played .good .vsrow:nth-child(6){animation-delay:4.6s}.vs.played .good .vsrow:nth-child(7){animation-delay:4.85s}
@keyframes vsin{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
@keyframes vsfade{to{opacity:.32;filter:grayscale(1)}}
.vsmid{display:flex;align-items:center;justify-content:center}
.vsmid i{width:46px;height:46px;border-radius:50%;background:var(--s2);border:1px solid rgba(0,153,255,.5);display:grid;place-items:center;color:#39aaff;font-size:18px;font-style:normal;box-shadow:0 0 30px rgba(0,153,255,.25);animation:pulsevs 2.4s infinite}
@keyframes pulsevs{0%,100%{box-shadow:0 0 0 0 rgba(0,153,255,.4)}50%{box-shadow:0 0 0 14px rgba(0,153,255,0)}}
/* mail automatisé — grand visuel */
.mailwrap{display:grid;grid-template-columns:1fr .95fr;gap:46px;align-items:center}
.mailcard{background:#101013;border:1px solid var(--hair);border-radius:22px;overflow:hidden;box-shadow:0 50px 110px rgba(0,0,0,.55);position:relative;animation:mailfloat 8s ease-in-out infinite}
@keyframes mailfloat{0%,100%{transform:translateY(0) rotate(-.4deg)}50%{transform:translateY(-10px) rotate(.4deg)}}
.mailcard .mh{display:flex;align-items:center;gap:11px;padding:15px 19px;border-bottom:1px solid var(--hair-soft);font-size:12px;color:var(--muted)}
.mailcard .mh .mav2{width:32px;height:32px;border-radius:50%;background:linear-gradient(135deg,#39aaff,#0066bb);display:grid;place-items:center;font-family:var(--display);font-weight:600;font-size:11px;color:#fff}
.mailcard .mh b{color:#fff;font-size:13px;display:block}
.mailcard .mb2{padding:19px;font-size:13px;color:var(--muted);line-height:1.65}
.mailcard .mb2 b{color:#fff}
.mailbtns{display:flex;gap:9px;margin-top:16px;flex-wrap:wrap}
.mailbtns .mb-pay{background:#fff;color:#000;border-radius:100px;padding:10px 18px;font-size:12.5px;font-weight:700}
.mailbtns .mb-tel{background:rgba(0,153,255,.14);color:#39aaff;border:1px solid rgba(0,153,255,.4);border-radius:100px;padding:10px 18px;font-size:12.5px;font-weight:600}
.stamp{position:absolute;top:16px;right:-8px;background:rgba(0,153,255,.92);color:#fff;font-size:10.5px;font-weight:800;letter-spacing:.06em;padding:7px 16px;border-radius:8px 0 0 8px;transform:rotate(2deg);animation:stampin 6s var(--ease) infinite}
@keyframes stampin{0%,8%{opacity:0;transform:rotate(2deg) scale(1.6)}14%,86%{opacity:1;transform:rotate(2deg) scale(1)}94%,100%{opacity:0}}
.cancel70{display:inline-flex;align-items:baseline;gap:10px;background:rgba(0,153,255,.1);border:1px solid rgba(0,153,255,.4);border-radius:16px;padding:13px 22px;margin-top:18px}
.cancel70 b{font-family:var(--display);font-weight:600;font-size:32px;letter-spacing:-.04em;color:#7cc4ff}
.cancel70 span{font-size:12px;color:var(--muted)}
/* ranking client */
.rankcard{background:var(--s1);border:1px solid var(--hair);border-radius:22px;padding:22px;display:flex;flex-direction:column;gap:9px}
.rkrow{display:flex;align-items:center;gap:12px;background:var(--s2);border:1px solid var(--hair);border-radius:13px;padding:11px 14px;font-size:13px;color:var(--muted);animation:rkpulse 9s var(--ease) infinite}
.rkrow:nth-child(2){animation-delay:0s}.rkrow:nth-child(3){animation-delay:3s}.rkrow:nth-child(4){animation-delay:6s}
@keyframes rkpulse{0%,28%,100%{border-color:var(--hair);transform:none}8%,18%{border-color:rgba(0,153,255,.55);transform:translateX(5px)}}
.rkrow b{color:#fff;font-weight:600}
.rknote{margin-left:auto;width:38px;height:38px;border-radius:50%;display:grid;place-items:center;font-family:var(--display);font-weight:600;font-size:15px;flex:0 0 auto}
.rknote.a{background:rgba(0,153,255,.15);color:#39aaff;border:1.5px solid rgba(0,153,255,.5)}
.rknote.b{background:rgba(245,180,60,.14);color:#f5b43c;border:1.5px solid rgba(245,180,60,.45)}
.rknote.c{background:rgba(224,49,75,.12);color:#ff8ba3;border:1.5px solid rgba(224,49,75,.45)}
/* comparatif abonnements */
.compare th .tn2{display:flex;flex-direction:column;align-items:center;gap:4px}
.compare th svg{width:18px;height:18px;stroke-width:2;fill:none;stroke-linecap:round;stroke-linejoin:round}
.compare td.y{color:#39aaff}
.compare td.opt2{color:#f5b43c;font-size:11px;font-weight:700}
@media(max-width:880px){
  .vs{grid-template-columns:1fr}
  .vsmid{padding:10px 0}
  .vsmid i{transform:rotate(90deg)}
  .mailwrap{grid-template-columns:1fr}
}

/* ============ V37b — "tout-en-un" plus lent ============ */
.rtag{transition:transform 3.4s var(--ease),opacity 3.4s}
.rtag:nth-child(2){transition-delay:.55s}.rtag:nth-child(3){transition-delay:1.1s}.rtag:nth-child(4){transition-delay:1.65s}.rtag:nth-child(5){transition-delay:2.2s}.rtag:nth-child(6){transition-delay:2.75s}.rtag:nth-child(7){transition-delay:3.3s}
/* options.html — fiches options */
.optcards{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.optcard{background:var(--s1);border:1px solid var(--hair);border-radius:24px;padding:30px 28px;position:relative;overflow:hidden}
.optcard::before{content:"";position:absolute;inset:0;background:radial-gradient(420px 240px at 14% 0%,color-mix(in srgb,var(--oc,#0099ff) 12%,transparent),transparent 62%);pointer-events:none}
.optcard h3{font-size:21px;letter-spacing:-.03em;display:flex;align-items:center;gap:11px;flex-wrap:wrap}
.optcard .oprice{margin-left:auto;background:color-mix(in srgb,var(--oc,#0099ff) 15%,transparent);color:var(--oc,#0099ff);border:1px solid color-mix(in srgb,var(--oc,#0099ff) 40%,transparent);border-radius:100px;padding:6px 14px;font-size:12px;font-weight:700;font-family:var(--body)}
.optcard>p{color:var(--muted);font-size:13.5px;line-height:1.6;margin:10px 0 14px}
.optcard ul{list-style:none;display:flex;flex-direction:column;gap:8px}
.optcard li{color:var(--muted);font-size:13.5px;padding-left:22px;position:relative;line-height:1.5}
.optcard li::before{content:"";position:absolute;left:0;top:9px;width:12px;height:2px;background:var(--oc,#0099ff);border-radius:2px}
.optcard li b{color:#fff;font-weight:600}
.optcard .oincl{display:inline-block;margin-top:14px;font-size:11.5px;font-weight:700;color:#ffb38d;background:rgba(255,122,61,.12);border:1px solid rgba(255,122,61,.4);border-radius:100px;padding:5px 13px}
@supports not (color: color-mix(in srgb, red 50%, blue)){.optcard .oprice{background:rgba(0,153,255,.15);border-color:rgba(0,153,255,.4)}}
@media(max-width:880px){.optcards{grid-template-columns:1fr}}

/* ============ V38 — le parcours d'une location (01→06) ============ */
.jwrap{position:relative;display:flex;flex-direction:column;gap:10px;margin-top:10px}
.jline{position:absolute;left:50%;top:40px;bottom:40px;width:2px;transform:translateX(-50%);background:linear-gradient(180deg,#39aaff,#5fd9d9 22%,#7cc4ff 42%,#ffb38d 62%,#a18fff 82%,#f5b43c);opacity:.2;border-radius:2px}
.jwrap .jstep{display:grid;grid-template-columns:1fr 1fr;gap:clamp(28px,5vw,70px);align-items:center;position:relative;padding:34px 0}
.jwrap .jstep::after{content:"";position:absolute;left:50%;top:50%;width:13px;height:13px;border-radius:50%;transform:translate(-50%,-50%);background:var(--jc);box-shadow:0 0 0 5px color-mix(in srgb,var(--jc) 16%,transparent),0 0 26px color-mix(in srgb,var(--jc) 50%,transparent)}
.jwrap .jstep.alt .jtxt{order:2}
.jnum{font-family:var(--display);font-weight:600;font-size:clamp(58px,7vw,96px);letter-spacing:-.05em;line-height:.9;color:transparent;-webkit-text-stroke:1.5px var(--jc);opacity:.9}
.jchip{display:inline-flex;align-items:center;gap:8px;font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--jc);background:color-mix(in srgb,var(--jc) 12%,transparent);border:1px solid color-mix(in srgb,var(--jc) 36%,transparent);border-radius:100px;padding:6px 13px;margin:14px 0 0}
.jtxt h3{font-size:clamp(23px,2.7vw,32px);letter-spacing:-.035em;margin:12px 0 12px}
.jtxt>p{color:var(--muted);font-size:14.5px;line-height:1.65;max-width:48ch}
.jtxt>p b{color:#fff;font-weight:600}
.jcard{background:radial-gradient(460px 280px at 18% 0%,color-mix(in srgb,var(--jc) 10%,transparent),transparent 62%),var(--s1);border:1px solid color-mix(in srgb,var(--jc) 26%,var(--hair));border-radius:26px;padding:24px;position:relative;overflow:hidden;display:flex;flex-direction:column;gap:9px}
.jcard .jlab{font-size:11.5px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:var(--jc);margin-bottom:4px}
.jcard .fcstep .fck{background:color-mix(in srgb,var(--jc) 16%,transparent);color:var(--jc)}
.jcard .rkrow{animation-duration:10s}
@supports not (color: color-mix(in srgb, red 50%, blue)){
  .jcard{background:var(--s1);border-color:var(--hair)}
  .jchip{background:rgba(0,153,255,.12);border-color:rgba(0,153,255,.36)}
  .jcard .fcstep .fck{background:rgba(0,153,255,.16);color:#39aaff}
  .jstep::after{box-shadow:0 0 26px rgba(0,153,255,.5)}
}
@supports not (-webkit-text-stroke: 1px #000){.jnum{color:var(--jc);opacity:.45}}
@media(max-width:880px){
  .jline{left:8px;transform:none;top:20px;bottom:20px}
  .jwrap .jstep{grid-template-columns:1fr;gap:18px;padding:20px 0 20px 28px}
  .jwrap .jstep::after{left:8px;top:42px;transform:translate(-50%,0)}
  .jwrap .jstep.alt .jtxt{order:0}
  .jnum{font-size:52px}
}
/* moins de vert — upsell en or (finance) */
.up30{background:rgba(245,180,60,.1);border-color:rgba(245,180,60,.4)}
.up30 b{color:#f5b43c}
.uprow .upv{color:#f5b43c}
@media(max-width:880px){.stamp{font-size:9px;padding:5px 10px;top:10px}.mailcard .mh{padding-right:120px}}

/* ============================================================
   V39 — APERÇU OS « GALERIE » (or + bleu, éditorial sombre)
   Reproduction fidèle du produit dans la page marketing.
   Scopé .osgal — tokens locaux, ne fuit pas sur le reste du site.
   ============================================================ */
.osgal{
  --o-bg:#0a0a0a;--o-panel:#101010;--o-card:#121212;--o-card2:#141414;
  --o-line:#1c1c1c;--o-line2:#242424;--o-tx:#fff;--o-mut:#9a9a9a;--o-faint:#6f6f6f;
  --o-blue:#0099ff;--o-blue-tx:#66c2ff;--o-gold:#f5b43c;--o-gold-lbl:#c9a25a;
  --o-green:#22c55e;--o-green-tx:#6ee7a0;--o-amber:#f59e0b;--o-violet:#8b73f7;--o-violet-tx:#b3a1f9;--o-red:#ff7a7a;
  font-variant-numeric:tabular-nums;
}
/* cadre application */
.osframe{position:relative;border-radius:20px;border:1px solid var(--o-line2);overflow:hidden;
  background:radial-gradient(1100px 520px at 80% -10%,rgba(245,180,60,.06),transparent),radial-gradient(800px 460px at -5% 110%,rgba(0,153,255,.05),transparent),var(--o-bg);
  box-shadow:0 50px 120px rgba(0,0,0,.6)}
/* barre fenêtre */
.osbar{display:flex;align-items:center;gap:8px;padding:11px 16px;border-bottom:1px solid var(--o-line);background:#0c0c0c}
.osbar .dots{display:flex;gap:6px}
.osbar .dots i{width:10px;height:10px;border-radius:50%;background:#2a2a2a}
.osbar .barurl{margin-left:10px;font-size:11px;color:var(--o-faint);font-family:var(--body)}
.osbar .barurl b{color:var(--o-gold-lbl);font-weight:600}
/* top-nav OS */
.osnav{display:flex;align-items:center;gap:8px;padding:11px 16px;border-bottom:1px solid var(--o-line)}
.osnav .oslogo{display:flex;align-items:center;gap:7px;margin-right:8px}
.osnav .oslogo img{height:14px}
.osnav .oslogo .os{font-family:var(--display);font-weight:600;font-size:13px;color:var(--o-gold);letter-spacing:-.02em}
.osnav .npill{font-size:12px;color:#888;padding:7px 13px;border-radius:100px;white-space:nowrap;font-weight:500}
.osnav .npill.on{background:#181818;color:#fff}
.osnav .nspace{margin-left:auto}
.osnav .nsearch{display:flex;align-items:center;gap:7px;background:var(--o-card2);border:1px solid var(--o-line2);border-radius:100px;padding:7px 13px;font-size:11.5px;color:var(--o-faint)}
.osnav .nbell{position:relative;width:30px;height:30px;border-radius:50%;background:var(--o-card2);border:1px solid var(--o-line2);display:grid;place-items:center;color:var(--o-mut);font-size:13px}
.osnav .nbell::after{content:"";position:absolute;top:5px;right:6px;width:6px;height:6px;border-radius:50%;background:var(--o-red)}
.osnav .navat{width:30px;height:30px;border-radius:50%;background:linear-gradient(135deg,#f5b43c,#ff7a3d);display:grid;place-items:center;font-family:var(--display);font-weight:600;font-size:11px;color:#2a1500;flex:0 0 auto}
/* sous-pills de section */
.ossub{display:flex;gap:7px;padding:11px 16px;border-bottom:1px solid var(--o-line);flex-wrap:wrap}
.ossub .spill{font-size:11.5px;color:#8a8a8a;padding:6px 13px;border-radius:100px;border:1px solid transparent}
.ossub .spill.on{background:rgba(245,180,60,.12);color:var(--o-gold);border-color:rgba(245,180,60,.4)}
/* corps */
.osbody{padding:20px}
.osd-head{display:flex;align-items:flex-end;justify-content:space-between;gap:14px;margin-bottom:18px}
.osd-head .oseyebrow{font-size:11px;color:var(--o-mut);letter-spacing:.02em}
.osd-head h3{font-family:var(--display);font-weight:600;font-size:clamp(20px,2.4vw,26px);letter-spacing:-.03em;margin-top:3px;color:#fff}
.os-cta{background:linear-gradient(120deg,#ffd9a0,#fff);color:#000;font-family:var(--body);font-weight:700;font-size:12.5px;border-radius:100px;padding:9px 16px;white-space:nowrap;flex:0 0 auto}
.os-cta2{background:#161616;border:1px solid #2a2a2a;color:#ddd;font-weight:600;font-size:12.5px;border-radius:100px;padding:9px 16px;white-space:nowrap}
/* grille héros dashboard */
.osd-hero{display:grid;grid-template-columns:1.55fr 1fr;gap:14px;margin-bottom:16px}
.osrev{background:linear-gradient(160deg,#16120a,#111);border:1px solid #2a2118;border-radius:18px;padding:22px;position:relative;overflow:hidden;min-height:230px;display:flex;flex-direction:column}
.osrev .rlbl{font-size:10px;font-weight:700;letter-spacing:.07em;color:var(--o-gold-lbl);text-transform:uppercase}
.osrev .rbig{font-family:var(--display);font-weight:600;font-size:clamp(34px,4.6vw,46px);letter-spacing:-.04em;color:#fff;margin:8px 0 6px;line-height:1}
.osrev .rmeta{display:flex;gap:14px;font-size:12px;align-items:center}
.osrev .rmeta .up{color:var(--o-green-tx)}
.osrev .rmeta .wait{color:var(--o-gold)}
.osrev .rcurve{position:absolute;left:0;right:0;bottom:0;height:120px;width:100%}
.osrev .rcurve path.line{fill:none;stroke:var(--o-gold);stroke-width:2.5;stroke-linecap:round;stroke-dasharray:1;stroke-dashoffset:1}
.osframe.in .osrev .rcurve path.line{animation:os-draw 1.8s var(--ease) .35s forwards}
.osrev .rcurve path.fill{fill:url(#osgrad);opacity:0;transition:opacity .9s ease 1s}
.osframe.in .osrev .rcurve path.fill{opacity:1}
.osrev .raxis{position:absolute;left:22px;right:22px;bottom:8px;display:flex;justify-content:space-between;font-size:9px;color:var(--o-faint);font-family:var(--display)}
@keyframes os-draw{to{stroke-dashoffset:0}}
.osd-side{display:flex;flex-direction:column;gap:14px}
.oscard{background:var(--o-card);border:1px solid var(--o-line2);border-radius:18px;padding:18px}
.oscard .clbl{font-size:10px;font-weight:700;letter-spacing:.06em;color:var(--o-mut);text-transform:uppercase;margin-bottom:12px}
.osocc{display:flex;align-items:center;gap:16px}
.osring{width:84px;height:84px;flex:0 0 auto;transform:rotate(-90deg)}
.osring circle{fill:none;stroke-width:9;stroke-linecap:round}
.osring .trk{stroke:#202020}
.osring .val{stroke:var(--o-blue);stroke-dasharray:267;stroke-dashoffset:267}
.osframe.in .osring .val{transition:stroke-dashoffset 1.6s var(--ease) .4s;stroke-dashoffset:59}
.osocc .occn{font-family:var(--display);font-weight:600;font-size:26px;letter-spacing:-.03em;color:#fff}
.osocc .occs{font-size:11.5px;color:var(--o-mut);margin-top:2px}
.ospipe .pn{font-family:var(--display);font-weight:600;font-size:26px;letter-spacing:-.03em;color:#fff;margin-bottom:8px}
.ospbar{height:8px;border-radius:100px;background:#1c1c1c;overflow:hidden;display:flex}
.ospbar i{height:100%;width:0;transition:width 1.3s var(--ease) .5s}
.ospbar i.b{background:var(--o-blue)}.ospbar i.a{background:var(--o-amber)}
.osframe.in .ospbar i.b{width:62%}.osframe.in .ospbar i.a{width:23%}
.ospleg{display:flex;gap:14px;font-size:11px;color:var(--o-mut);margin-top:9px}
.ospleg .d{display:inline-block;width:7px;height:7px;border-radius:50%;margin-right:5px;vertical-align:middle}
/* flotte */
.osd-sub{font-size:13px;color:var(--o-mut);margin:18px 0 10px;font-weight:600}
.osfleet{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.osveh{background:var(--o-card);border:1px solid var(--o-line2);border-radius:14px;overflow:hidden}
.osveh .vph{position:relative;aspect-ratio:16/10;overflow:hidden;background:repeating-linear-gradient(135deg,#161616,#161616 8px,#1b1b1b 8px,#1b1b1b 16px)}
.osveh .vph img{width:100%;height:100%;object-fit:cover}
.osveh .vbadge{position:absolute;top:8px;left:8px;font-size:9.5px;font-weight:700;padding:4px 9px;border-radius:100px;background:rgba(10,10,10,.72);backdrop-filter:blur(4px)}
.osveh .vbadge.green{color:var(--o-green-tx);border:1px solid rgba(34,197,94,.45)}
.osveh .vbadge.blue{color:var(--o-blue-tx);border:1px solid rgba(0,153,255,.45)}
.osveh .vbadge.amber{color:var(--o-amber);border:1px dashed rgba(245,158,11,.55)}
.osveh .vbadge.gray{color:#9a9a9a;border:1px solid #2a2a2a}
.osveh .vmeta{padding:11px 12px}
.osveh .vmeta b{display:block;font-size:12.5px;color:#fff;font-weight:600;letter-spacing:-.01em}
.osveh .vmeta small{font-size:10.5px;color:var(--o-faint)}
/* === PLANNING === */
.osplan{overflow-x:auto}
.osplan-inner{min-width:760px}
.osplan-tb{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px;gap:10px}
.osnavp{display:flex;align-items:center;gap:8px;font-family:var(--display);font-weight:500;font-size:14px;color:#fff;letter-spacing:-.02em}
.osnavp i{width:26px;height:26px;border-radius:8px;background:var(--o-card2);border:1px solid var(--o-line2);display:grid;place-items:center;color:var(--o-mut);font-style:normal;font-size:12px}
.osleg{display:flex;gap:14px;flex-wrap:wrap;font-size:10.5px;color:var(--o-mut);margin-bottom:10px}
.osleg span .d{display:inline-block;width:9px;height:9px;border-radius:3px;margin-right:5px;vertical-align:middle}
.osgridrow{display:grid;grid-template-columns:170px 1fr;gap:0;border-top:1px solid var(--o-line)}
.osgridrow.head{border-top:none}
.osgcell-v{display:flex;align-items:center;gap:9px;padding:9px 10px}
.osgcell-v img{width:38px;height:28px;object-fit:cover;border-radius:6px;flex:0 0 auto}
.osgcell-v b{font-size:11.5px;color:#fff;font-weight:600;display:block;line-height:1.2}
.osgcell-v small{font-size:9px;color:var(--o-faint);font-family:var(--display)}
.osgdays{display:grid;grid-template-columns:repeat(14,1fr);position:relative}
.osgday{font-size:9px;color:var(--o-faint);text-align:center;padding:7px 0;border-left:1px solid var(--o-line)}
.osgday.today{background:rgba(245,180,60,.08);color:var(--o-gold)}
.osgday.we{background:#0f0d09}
.osgtrack{position:relative;height:42px;border-left:1px solid var(--o-line)}
.osbar-b{position:absolute;top:7px;height:28px;border-radius:8px;padding:0 9px;display:flex;align-items:center;font-size:10.5px;color:#fff;white-space:nowrap;overflow:hidden;font-weight:600;transform:scaleX(0);transform-origin:left;opacity:0}
.osframe.in .osbar-b{animation:os-bar .6s var(--ease) forwards}
.osbar-b.green{background:rgba(34,197,94,.16);border:1px solid rgba(34,197,94,.5);color:var(--o-green-tx)}
.osbar-b.blue{background:rgba(0,153,255,.14);border:1px solid rgba(0,153,255,.5);color:var(--o-blue-tx)}
.osbar-b.amber{background:rgba(245,158,11,.1);border:1px dashed rgba(245,158,11,.55);color:var(--o-amber)}
.osbar-b.gray{background:repeating-linear-gradient(135deg,#161616,#161616 6px,#1c1c1c 6px,#1c1c1c 12px);border:1px solid #2a2a2a;color:#9a9a9a}
@keyframes os-bar{to{transform:scaleX(1);opacity:1}}
.osnow{position:absolute;top:0;bottom:0;width:2px;background:var(--o-gold);opacity:.6;z-index:3}
.osnow::before{content:"";position:absolute;top:-3px;left:-3px;width:8px;height:8px;border-radius:50%;background:var(--o-gold)}
/* === DOSSIER RÉSERVATION === */
.osresa{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.osrlist{display:flex;flex-direction:column;gap:8px}
.osrrow{display:flex;align-items:center;gap:11px;background:var(--o-card);border:1px solid var(--o-line2);border-radius:12px;padding:10px 12px}
.osrrow.sel{background:#16120a;border-color:#3a2e16}
.osrrow img{width:46px;height:34px;object-fit:cover;border-radius:7px;flex:0 0 auto}
.osrrow .ri{flex:1;min-width:0}
.osrrow .ri b{font-size:12px;color:#fff;font-weight:600;display:block}
.osrrow .ri small{font-size:10px;color:var(--o-faint)}
.osrrow .rprog{height:3px;border-radius:100px;background:#222;margin-top:6px;overflow:hidden}
.osrrow .rprog i{display:block;height:100%;width:0;transition:width 1s var(--ease) .4s}
.osframe.in .osrrow .rprog i{width:var(--pw,50%)}
.osrrow .ramt{font-family:var(--display);font-weight:600;font-size:13px;color:#fff;text-align:right}
.osrrow .rtag{font-size:9px;font-weight:700;padding:3px 8px;border-radius:100px;white-space:nowrap}
.osdoss{background:var(--o-panel);border:1px solid var(--o-line2);border-radius:16px;overflow:hidden}
.osstep{padding:13px 16px;border-bottom:1px solid var(--o-line);background:rgba(34,197,94,.05)}
.osstep .sl{font-size:10px;font-weight:700;letter-spacing:.05em;color:var(--o-green-tx);text-transform:uppercase}
.osstep .sbar{height:5px;border-radius:100px;background:#1c1c1c;margin:8px 0 6px;overflow:hidden}
.osstep .sbar i{display:block;height:100%;width:0;background:var(--o-green);transition:width 1.2s var(--ease) .4s}
.osframe.in .osstep .sbar i{width:57%}
.osstep .snext{font-size:10.5px;color:var(--o-mut)}
.osdcover{position:relative;height:120px;overflow:hidden}
.osdcover img{width:100%;height:100%;object-fit:cover}
.osdcover::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 40%,rgba(16,16,16,.95))}
.osdcover .dc-t{position:absolute;left:14px;bottom:10px;font-family:var(--display);font-weight:600;font-size:15px;color:#fff;z-index:2}
.osdbody{padding:14px 16px}
.osdclient{display:flex;align-items:center;gap:10px;margin-bottom:12px}
.osdclient .av{width:34px;height:34px;border-radius:50%;background:linear-gradient(135deg,#f5b43c,#ff7a3d);display:grid;place-items:center;font-family:var(--display);font-weight:600;font-size:12px;color:#2a1500}
.osdclient b{font-size:12.5px;color:#fff;display:block}
.osdclient small{font-size:10px;color:var(--o-gold-lbl)}
.osdamt{background:#161106;border:1px solid #2a2012;border-radius:12px;padding:13px 15px;display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}
.osdamt .at{font-family:var(--display);font-weight:600;font-size:22px;color:var(--o-gold);letter-spacing:-.03em}
.osdamt small{font-size:10px;color:var(--o-mut);display:block}
.osdchips{display:flex;gap:7px;margin-bottom:13px;flex-wrap:wrap}
.osdchip{font-size:10px;padding:5px 10px;border-radius:100px;display:flex;align-items:center;gap:5px}
.osdchip.ok{background:rgba(34,197,94,.1);border:1px solid rgba(34,197,94,.4);color:var(--o-green-tx)}
.osdchip.wait{background:rgba(245,158,11,.1);border:1px dashed rgba(245,158,11,.5);color:var(--o-amber)}
.osdcta{display:block;text-align:center;background:linear-gradient(120deg,#ffd9a0,#fff);color:#000;font-weight:700;font-size:12.5px;border-radius:100px;padding:11px}
/* === TARIF DYNAMIQUE === */
.ostarif{background:var(--o-card);border:1px solid var(--o-line2);border-radius:16px;padding:20px}
.ostk{display:flex;flex-direction:column;gap:9px}
.ostk-row{display:flex;justify-content:space-between;align-items:center;background:var(--o-card2);border:1px solid var(--o-line);border-radius:11px;padding:11px 14px;font-size:12.5px;color:var(--o-mut)}
.ostk-row b{color:#fff;font-weight:600}
.ostk-row .pv{font-family:var(--display);font-weight:600;font-size:14px;color:var(--o-gold)}
.ostk-row.base .pv{color:#fff}
.ostk-row.up .pv{color:var(--o-green-tx)}
.ostk-tot{display:flex;justify-content:space-between;align-items:center;border-top:1px solid var(--o-line2);margin-top:6px;padding-top:13px}
.ostk-tot span{font-size:12px;color:var(--o-mut)}
.ostk-tot .tv{font-family:var(--display);font-weight:600;font-size:24px;color:var(--o-gold);letter-spacing:-.03em}
/* responsive aperçus OS */
@media(max-width:920px){
  .osd-hero{grid-template-columns:1fr}
  .osfleet{grid-template-columns:repeat(2,1fr)}
  .osresa{grid-template-columns:1fr}
  .osnav .nsearch{display:none}
}
@media(max-width:520px){
  .osbody{padding:14px}
  .osnav{gap:5px;padding:10px}
  .osnav .npill{padding:6px 9px;font-size:11px}
  .osnav .npill:not(.on){display:none}
  .osd-head{flex-direction:column;align-items:flex-start}
}
/* === BANDE VALEUR (Europe / RGPD / coffre-fort) === */
.valgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.valc{background:var(--s1);border:1px solid var(--hair);border-radius:22px;padding:26px 24px;position:relative;overflow:hidden}
.valc::before{content:"";position:absolute;inset:0;background:radial-gradient(360px 220px at 16% 0%,color-mix(in srgb,var(--vc,#0099ff) 13%,transparent),transparent 60%);pointer-events:none}
.valc .vi{width:46px;height:46px;border-radius:13px;display:grid;place-items:center;background:color-mix(in srgb,var(--vc,#0099ff) 14%,transparent);border:1px solid color-mix(in srgb,var(--vc,#0099ff) 40%,transparent);color:var(--vc,#0099ff);margin-bottom:16px}
.valc .vi svg{width:23px;height:23px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.valc h3{font-family:var(--display);font-weight:500;font-size:18px;letter-spacing:-.02em;margin-bottom:8px}
.valc p{color:var(--muted);font-size:13.5px;line-height:1.6}
.valc .vtag{display:inline-block;margin-top:14px;font-size:11px;font-weight:700;color:var(--vc,#0099ff);background:color-mix(in srgb,var(--vc,#0099ff) 12%,transparent);border:1px solid color-mix(in srgb,var(--vc,#0099ff) 38%,transparent);border-radius:100px;padding:5px 12px}
@supports not (color: color-mix(in srgb, red 50%, blue)){.valc .vi{background:rgba(0,153,255,.14);border-color:rgba(0,153,255,.4)}}
@media(max-width:880px){.valgrid{grid-template-columns:1fr}}
/* étiquette d'outil numérotée (façon home, pas timeline) */
.toolnum{display:inline-flex;align-items:center;gap:10px;font-family:var(--display);font-weight:600;font-size:13px;color:var(--muted);letter-spacing:-.01em;margin-bottom:14px}
.toolnum em{font-style:normal;width:30px;height:30px;border-radius:9px;display:grid;place-items:center;background:color-mix(in srgb,var(--tac,#0099ff) 15%,transparent);color:var(--tac,#0099ff);border:1px solid color-mix(in srgb,var(--tac,#0099ff) 40%,transparent);font-size:13px}
@supports not (color: color-mix(in srgb, red 50%, blue)){.toolnum em{background:rgba(0,153,255,.15);border-color:rgba(0,153,255,.4)}}
/* V39b — petits ajustements aperçu OS */
.anim3 .acard h3{padding-right:96px}
.anim3 .acard .chrono{top:22px}
@media(max-width:560px){.anim3 .acard h3{padding-right:0}.anim3 .acard .chrono{position:static;display:inline-block;margin-bottom:8px}}

/* ============ V40 — multi-écrans (PC + iPad/mobile), trust, vidéo ============ */
/* bande de confiance sous le hero */
.herotrust{display:flex;align-items:center;justify-content:center;gap:10px 20px;flex-wrap:wrap;margin-top:26px}
.herotrust .ht{display:inline-flex;align-items:center;gap:8px;font-size:12px;color:var(--muted);font-weight:500}
.herotrust .ht img{height:14px;opacity:.9}
.herotrust .ht .rgpdlogo{height:15px;filter:brightness(0) invert(1);opacity:.85}
.herotrust .sep{width:1px;height:16px;background:var(--hair)}
@media(max-width:620px){.herotrust .sep{display:none}}
/* logo rgpd dans la carte valeur */
.valc .vi.rgpdbox{background:#fff;border-color:#fff}
.valc .vi.rgpdbox img{height:22px;width:auto}
/* carte vidéo Corsiva locations */
.vidcard{position:relative;border-radius:24px;overflow:hidden;border:1px solid var(--hair);background:#000;aspect-ratio:16/10}
.vidcard video{width:100%;height:100%;object-fit:cover;opacity:.9}
.vidcard .vlabel{position:absolute;left:16px;bottom:14px;z-index:2;display:flex;align-items:center;gap:9px}
.vidcard .vlabel .vdot{width:9px;height:9px;border-radius:50%;background:#ff5577;box-shadow:0 0 0 0 rgba(255,85,119,.6);animation:vlive 2s infinite}
.vidcard .vlabel b{font-size:13px;color:#fff;font-weight:600}
.vidcard::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 50%,rgba(0,0,0,.55));pointer-events:none}
@keyframes vlive{0%{box-shadow:0 0 0 0 rgba(255,85,119,.55)}70%{box-shadow:0 0 0 9px rgba(255,85,119,0)}100%{box-shadow:0 0 0 0 rgba(255,85,119,0)}}
/* === multi-écrans === */
.devshow{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:center}
.devstage{position:relative;padding-bottom:34px}
/* laptop */
.devpc{position:relative;border:1px solid #262626;border-radius:14px 14px 0 0;overflow:hidden;background:#0a0a0a;box-shadow:0 44px 100px rgba(0,0,0,.6)}
.devpc .pctop{display:flex;align-items:center;gap:6px;padding:8px 12px;border-bottom:1px solid #181818;background:#0c0c0c}
.devpc .pctop i{width:8px;height:8px;border-radius:50%;background:#2a2a2a}
.devpc .pctop span{margin-left:8px;font-size:9.5px;color:#666}
.devpc .pctop b{color:#c9a25a;font-weight:600}
.devpcbase{height:13px;background:linear-gradient(180deg,#1f1f1f,#0b0b0b);border:1px solid #262626;border-top:none;border-radius:0 0 16px 16px;position:relative}
.devpcbase::after{content:"";position:absolute;top:0;left:50%;transform:translateX(-50%);width:90px;height:5px;background:#000;border-radius:0 0 7px 7px}
.pcwrap{padding:14px;background:radial-gradient(640px 280px at 82% -10%,rgba(245,180,60,.07),transparent),#0a0a0a}
.pcnav{display:flex;align-items:center;gap:6px;margin-bottom:11px}
.pcnav .lg{display:flex;align-items:center;gap:5px;margin-right:4px}
.pcnav .lg img{height:11px}
.pcnav .lg .os{color:#f5b43c;font-family:var(--display);font-weight:600;font-size:11px}
.pcnav .p{font-size:9.5px;color:#7a7a7a;padding:4px 8px;border-radius:100px}
.pcnav .p.on{background:#181818;color:#fff}
.pcrev{background:linear-gradient(160deg,#16120a,#111);border:1px solid #2a2118;border-radius:12px;padding:13px 15px;margin-bottom:9px;position:relative;overflow:hidden}
.pcrev .l{font-size:8px;font-weight:700;letter-spacing:.07em;color:#c9a25a;text-transform:uppercase}
.pcrev .n{font-family:var(--display);font-weight:600;font-size:25px;color:#fff;letter-spacing:-.04em;margin-top:2px}
.pcrev .u{font-size:9.5px;color:#6ee7a0;margin-top:2px}
.pcrev svg{position:absolute;right:0;bottom:0;width:55%;height:46px}
.pcrow{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.pcmini{background:#121212;border:1px solid #242424;border-radius:10px;padding:11px 12px}
.pcmini .l{font-size:8px;font-weight:700;letter-spacing:.06em;color:#9a9a9a;text-transform:uppercase}
.pcmini .v{font-family:var(--display);font-weight:600;font-size:18px;color:#fff;margin-top:4px;letter-spacing:-.02em}
.pcmini .bar{height:5px;border-radius:100px;background:#1c1c1c;margin-top:7px;overflow:hidden}
.pcmini .bar i{display:block;height:100%;width:0;background:#0099ff;transition:width 1.3s var(--ease) .5s}
.devshow .osgal.in .pcmini .bar i,.osgal.in .pcmini .bar i{width:78%}
/* phone iPad/mobile signature */
.devphone{position:absolute;right:-4px;bottom:0;width:152px;border:6px solid #161616;border-radius:28px;overflow:hidden;background:#0a0a0a;box-shadow:0 30px 60px rgba(0,0,0,.65);z-index:3}
.devphone .pnotch{height:18px;display:flex;align-items:center;justify-content:center}
.devphone .pnotch::after{content:"";width:42px;height:5px;border-radius:100px;background:#000}
.devphone .pbody{padding:0 11px 13px}
.devphone .phead{font-size:9px;color:#9a9a9a;display:flex;justify-content:space-between;align-items:center;margin-bottom:9px}
.devphone .phead b{color:#fff;font-size:10px}
.devphone .phead .pc{color:#f5b43c;font-weight:700}
.devphone .pchk{display:flex;align-items:center;gap:6px;font-size:9px;color:#bbb;background:#121212;border:1px solid #222;border-radius:8px;padding:6px 8px;margin-bottom:5px}
.devphone .pchk .k{width:13px;height:13px;border-radius:4px;background:rgba(34,197,94,.18);color:#6ee7a0;display:grid;place-items:center;font-size:8px;flex:0 0 auto}
.devphone .signpad{background:#f4f4f4;border-radius:9px;height:66px;margin:7px 0 9px;position:relative;overflow:hidden}
.devphone .signpad svg{position:absolute;inset:0;width:100%;height:100%}
.devphone .signpad path{fill:none;stroke:#1a1a1a;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:1;stroke-dashoffset:1}
.osgal.in .devphone .signpad path{animation:os-draw 2.4s var(--ease) .6s forwards}
.devphone .signlbl{font-size:8px;color:#888;text-align:center;margin-top:-4px;margin-bottom:8px}
.devphone .pcta{display:block;text-align:center;background:linear-gradient(120deg,#ffd9a0,#fff);color:#000;font-weight:700;font-size:9.5px;border-radius:100px;padding:8px}
@media(max-width:920px){
  .devshow{grid-template-columns:1fr;gap:24px}
  .devstage{max-width:520px;margin:0 auto;width:100%}
}
@media(max-width:480px){
  .devphone{width:120px;right:-2px}
}
/* === section RDV mise en avant === */
.rdvband{position:relative;overflow:hidden;border-radius:30px;padding:48px 40px;text-align:center;background:radial-gradient(700px 360px at 50% -10%,rgba(0,153,255,.20),transparent 60%),linear-gradient(180deg,#0f1620,#0b0d12);border:1px solid rgba(0,153,255,.28)}
.rdvband h2{font-family:var(--display);font-weight:500;font-size:clamp(28px,3.6vw,44px);letter-spacing:-.04em;line-height:1.04}
.rdvband p{color:var(--muted);font-size:15.5px;max-width:54ch;margin:14px auto 0}
.rdvband .ctas{justify-content:center;margin-top:26px}
.rdvband .rdvfeat{display:flex;gap:10px 26px;justify-content:center;flex-wrap:wrap;margin-top:26px}
.rdvband .rdvfeat span{font-size:12.5px;color:var(--muted);display:inline-flex;align-items:center;gap:7px}
.rdvband .rdvfeat span::before{content:"✓";color:#39aaff;font-weight:700}

/* ============ V41 — section valeur « charte Framer » (monochrome + 1 spotlight) ============ */
.fvgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.fvcard{background:var(--s1);border:1px solid var(--hair);border-radius:20px;padding:30px 28px;display:flex;flex-direction:column}
.fvcard .fvi{width:44px;height:44px;border-radius:50%;display:grid;place-items:center;background:var(--s2);border:1px solid var(--hair);margin-bottom:20px}
.fvcard .fvi svg{width:21px;height:21px;fill:none;stroke:#fff;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.fvcard h3{font-family:var(--display);font-weight:500;font-size:22px;letter-spacing:-.04em;margin-bottom:10px;color:#fff}
.fvcard p{color:var(--muted);font-size:14px;line-height:1.6}
.fvcard p b{color:#fff;font-weight:500}
.fvcard .fvmeta{margin-top:auto;padding-top:18px;font-size:13px;color:var(--muted);font-weight:500;display:flex;align-items:center;gap:8px;letter-spacing:-.01em}
.fvcard .fvmeta img{height:13px;border-radius:2px;flex:0 0 auto}
.fvcard .fvmeta .rg{font-family:var(--display);font-weight:600;color:#fff;letter-spacing:0;border:1px solid var(--hair);border-radius:5px;padding:2px 6px;font-size:10.5px}
/* la carte spotlight — seul moment couleur (charte Framer : le dégradé est une carte) */
.fvspot{border-radius:20px;padding:30px 28px;display:flex;flex-direction:column;color:#fff;position:relative;overflow:hidden;background:radial-gradient(130% 150% at 14% 0%,#3aacff,#0099ff 46%,#073a7a)}
.fvspot .fvi{width:44px;height:44px;border-radius:50%;display:grid;place-items:center;background:rgba(255,255,255,.16);border:1px solid rgba(255,255,255,.32);margin-bottom:20px}
.fvspot .fvi svg{width:21px;height:21px;fill:none;stroke:#fff;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.fvspot h3{font-family:var(--display);font-weight:500;font-size:22px;letter-spacing:-.04em;margin-bottom:10px}
.fvspot p{color:rgba(255,255,255,.86);font-size:14px;line-height:1.6}
.fvspot .fvmeta{margin-top:auto;padding-top:18px;font-size:13px;color:rgba(255,255,255,.82);font-weight:600;letter-spacing:-.01em}
@media(max-width:880px){.fvgrid{grid-template-columns:1fr}}

/* ============ V42 — section valeur éditoriale (sans carte) + email réel ============ */
/* valeur : poster à gauche, liste numérotée à droite — aucune carte */
.fvedit{display:grid;grid-template-columns:1.04fr .96fr;gap:clamp(30px,5vw,70px);align-items:center}
.fvlogo{height:22px;display:block;margin-bottom:22px}
.fvposter .eyebrow{margin-bottom:18px}
.fvposter h2{margin-bottom:18px}
.fvmarks{display:flex;align-items:center;gap:16px;margin-top:24px;flex-wrap:wrap}
.fvmarks span{display:inline-flex;align-items:center;gap:8px;font-size:12.5px;color:var(--muted);font-weight:500;letter-spacing:-.01em}
.fvmarks img{height:14px;border-radius:2px}
.fvmarks .rg{font-family:var(--display);font-weight:600;color:#fff;border:1px solid var(--hair);border-radius:5px;padding:2px 7px;font-size:11px}
.fvlist{display:flex;flex-direction:column}
.fvrow{display:flex;gap:22px;padding:24px 4px;border-top:1px solid var(--hair);align-items:flex-start;transition:padding-left .3s var(--ease)}
.fvlist .fvrow:last-child{border-bottom:1px solid var(--hair)}
.fvrow .n{font-family:var(--display);font-weight:500;font-size:34px;letter-spacing:-.04em;line-height:.9;color:transparent;-webkit-text-stroke:1.3px var(--ink-soft,#3a3a3a);min-width:46px;transition:-webkit-text-stroke-color .35s,color .35s}
.fvrow:hover{padding-left:10px}
.fvrow:hover .n{-webkit-text-stroke-color:#0099ff;color:rgba(0,153,255,.08)}
.fvrow h3{font-family:var(--display);font-weight:500;font-size:20px;letter-spacing:-.03em;color:#fff;margin-bottom:7px}
.fvrow p{color:var(--muted);font-size:14px;line-height:1.55;max-width:46ch}
@supports not (-webkit-text-stroke:1px #000){.fvrow .n{color:#3a3a3a;-webkit-text-stroke:0}.fvrow:hover .n{color:#0099ff}}
@media(max-width:880px){.fvedit{grid-template-columns:1fr;gap:30px}.fvrow .n{font-size:28px;min-width:40px}}
/* email réel Corsiva (reproduction fidèle de l'email chauffeur) */
.cmailwrap{display:flex;justify-content:center;position:relative}
.cmail{width:100%;max-width:440px;background:#111;border-radius:16px;overflow:hidden;border:1px solid #1e1e1e;box-shadow:0 44px 100px rgba(0,0,0,.6);position:relative}
.cmail .cstamp{position:absolute;top:14px;right:-6px;z-index:4;background:rgba(0,153,255,.95);color:#fff;font-size:9.5px;font-weight:800;letter-spacing:.05em;padding:6px 14px;border-radius:8px 0 0 8px;transform:rotate(2deg);animation:stampin 6s var(--ease) infinite}
.cmail-hd{background:#0057ff;padding:24px 28px 18px;text-align:center}
.cmail-hd img{height:20px;display:block;margin:0 auto 10px;filter:brightness(0) invert(1)}
.cmail-hd .k{color:rgba(255,255,255,.8);font-size:9px;letter-spacing:3px;text-transform:uppercase;font-weight:600}
.cmail-hero{display:block;width:100%;height:140px;object-fit:cover}
.cmail-bd{padding:22px 26px 4px}
.cmail .key{color:#4d8bff;font-size:10px;letter-spacing:2.5px;text-transform:uppercase;font-weight:700;margin-bottom:10px}
.cmail h4{font-size:16px;font-weight:700;color:#fff;margin:0 0 12px;letter-spacing:-.01em;font-family:var(--body)}
.cmail-bd p{font-size:12.5px;color:rgba(255,255,255,.6);line-height:1.7;margin:0}
.cmail-bd p b{color:#fff;font-weight:600}
.cmail-tbl{border:1px solid rgba(0,87,255,.25);border-radius:12px;overflow:hidden;margin:18px 0 4px;background:#0d0d0d}
.cmail-r{display:flex;justify-content:space-between;align-items:center;padding:10px 16px;border-bottom:1px solid rgba(255,255,255,.05);font-size:11.5px}
.cmail-r .l{color:rgba(255,255,255,.42)}
.cmail-r .v{color:#e8dcc4;font-weight:600;text-align:right}
.cmail-r.tot{padding:13px 16px;border-bottom:none}
.cmail-r.tot .l{color:#fff;font-weight:700;font-size:13px}
.cmail-r.tot .v{color:#e8dcc4;font-size:17px;font-weight:800}
.cmail-cf{background:#0d0d0d;border-left:3px solid #0057ff;border-radius:0 3px 3px 0;padding:16px 18px;margin:8px 26px 0}
.cmail-cf .key{margin-bottom:6px}
.cmail-cf p{font-size:12px;color:#ccc;line-height:1.6;margin:0}
.cmail-cta-wrap{text-align:center;padding:18px 26px 24px}
.cmail-cta{display:inline-block;background:#0057ff;color:#fff;font-size:11px;font-weight:700;letter-spacing:2px;text-transform:uppercase;text-decoration:none;padding:14px 34px;border-radius:8px}
.cmail-ft{background:#0d0d0d;border-top:1px solid #1e1e1e;padding:18px 26px;display:flex;justify-content:space-between;align-items:flex-start}
.cmail-ft b{color:#fff;font-size:11.5px;font-weight:700;display:block;margin-bottom:3px}
.cmail-ft .rolelbl{color:#555;font-size:9.5px;letter-spacing:1px;text-transform:uppercase}
.cmail-ft .r{text-align:right;color:#888;font-size:10.5px;line-height:1.7}
.cmail-bar{background:#0057ff;padding:9px;text-align:center}
.cmail-bar span{font-size:9px;letter-spacing:2px;color:#fff;text-transform:uppercase;font-weight:600}
@media(max-width:880px){.cmail{max-width:420px}}

/* ============ V43 — typo des titres « poster » (charte Framer, site-wide) ============ */
/* tracking serré qui suit la taille + interlignage plus dense, sur tous les titres display */
h1,h2,h3{letter-spacing:-.045em}
.h-display{font-size:clamp(40px,7.2vw,92px);line-height:.9;letter-spacing:-.05em}
.hero4 h1{font-size:clamp(42px,6.9vw,90px);line-height:.92;letter-spacing:-.052em}
.h-sec{font-size:clamp(35px,4.9vw,60px);line-height:.98;letter-spacing:-.05em}
@media(max-width:600px){
  .h-display,.hero4 h1{letter-spacing:-.04em}
  .h-sec{letter-spacing:-.04em;line-height:1.02}
}

/* ============================================================
   V44 — reworks : ranking, marque blanche, abonnements, configurateur
   ============================================================ */
/* --- 1. RANKING CLIENT — fiche score + recontact --- */
.rkfiche{background:var(--s1);border:1px solid var(--hair);border-radius:22px;padding:24px;display:flex;flex-direction:column;gap:15px}
.rkf-head{display:flex;align-items:center;gap:12px}
.rkf-head .av{width:44px;height:44px;border-radius:50%;background:linear-gradient(135deg,#f5b43c,#ff7a3d);display:grid;place-items:center;font-family:var(--display);font-weight:600;color:#2a1500;font-size:15px;flex:0 0 auto}
.rkf-head b{font-size:15px;color:#fff;display:block;letter-spacing:-.01em}
.rkf-head small{color:#c9a25a;font-size:12px}
.rkf-head .grade{margin-left:auto;font-family:var(--display);font-weight:600;font-size:34px;letter-spacing:-.05em;color:#6ee7a0;line-height:1}
.rkmeter{position:relative;height:8px;border-radius:100px;background:linear-gradient(90deg,#ff7a7a,#f5b43c 50%,#22c55e);margin:2px 0 6px}
.rkmeter .mk{position:absolute;top:50%;width:15px;height:15px;border-radius:50%;background:#fff;border:3px solid #22c55e;transform:translate(-50%,-50%);left:6%;box-shadow:0 0 0 4px rgba(34,197,94,.18);transition:left 1.3s var(--ease) .3s}
.rkfiche.in .rkmeter .mk{left:92%}
.rkmlbl{display:flex;justify-content:space-between;font-size:10.5px;color:var(--faint,#777)}
.rkstats{display:flex;gap:8px;flex-wrap:wrap}
.rkstat{background:var(--s2);border:1px solid var(--hair);border-radius:10px;padding:8px 12px;font-size:12px;color:var(--muted)}
.rkstat b{color:#fff;font-weight:600}
.rkrc-wrap{border-top:1px solid var(--hair);padding-top:14px;margin-top:2px}
.rkrc-t{font-size:10.5px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);margin-bottom:10px}
.rkrc{display:flex;align-items:center;gap:10px;font-size:12.5px;color:var(--muted);padding:8px 0;border-bottom:1px solid var(--hair-soft)}
.rkrc:last-child{border-bottom:none}
.rkrc .ic{width:24px;height:24px;border-radius:7px;background:rgba(0,153,255,.14);color:#39aaff;display:grid;place-items:center;font-size:11px;flex:0 0 auto}
.rkrc b{color:#fff;font-weight:600}
.rkrc .st{margin-left:auto;font-size:10px;font-weight:700;padding:3px 9px;border-radius:100px;white-space:nowrap}
.rkrc .st.ok{background:rgba(34,197,94,.14);color:#6ee7a0}
.rkrc .st.go{background:rgba(0,153,255,.14);color:#66c2ff}

/* --- 2. MARQUE BLANCHE — showcase personnalisation --- */
.wlab{display:grid;grid-template-columns:1fr 1fr;gap:clamp(28px,5vw,60px);align-items:center}
.wlab .tag39{display:inline-flex;align-items:center;gap:8px;margin-top:22px;background:rgba(245,180,60,.1);border:1px solid rgba(245,180,60,.4);color:#f5b43c;border-radius:100px;padding:9px 18px;font-size:13px;font-weight:700}
.wlab .tag39 em{font-style:normal;color:var(--muted);font-weight:500}
.wlabviz{background:radial-gradient(520px 300px at 50% -10%,rgba(0,153,255,.12),transparent),var(--s1);border:1px solid var(--hair);border-radius:24px;padding:26px 24px}
.wlabviz .morph{height:58px;margin-bottom:6px}
.wlcap{text-align:center;font-size:11px;color:var(--faint,#777);margin-bottom:16px}
.wlproof{display:flex;flex-direction:column;gap:9px}
.wlp{display:flex;align-items:center;gap:12px;background:var(--s2);border:1px solid var(--hair);border-radius:12px;padding:12px 14px}
.wlp .ic{width:32px;height:32px;border-radius:9px;background:rgba(255,255,255,.05);border:1px solid var(--hair);display:grid;place-items:center;color:#fff;flex:0 0 auto}
.wlp .ic svg{width:16px;height:16px;fill:none;stroke:#fff;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.wlp .tx{min-width:0}
.wlp .tx b{font-size:12.5px;color:#fff;display:block;font-weight:600}
.wlp .tx small{font-size:11px;color:var(--muted)}
.wlp .yb{color:#7cc4ff;font-weight:600;animation:ybglow 4s var(--ease) infinite}
@keyframes ybglow{0%,100%{opacity:.7}50%{opacity:1}}
.wlp .no{margin-left:auto;font-size:9.5px;color:var(--faint,#777);white-space:nowrap;border:1px solid var(--hair);border-radius:100px;padding:3px 8px}
@media(max-width:880px){.wlab{grid-template-columns:1fr;gap:26px}}

/* --- 3. ABONNEMENTS — meilleure apparition + packs --- */
.fprices.cascade > .fprice{opacity:0;transform:none;transition:box-shadow .3s var(--ease),border-color .3s}
.fprices.cascade.played > .fprice{animation:price-in .75s var(--ease) both}
.fprices.cascade.played > .fprice:nth-child(2){animation-delay:.13s}
.fprices.cascade.played > .fprice:nth-child(3){animation-delay:.26s}
@keyframes price-in{0%{opacity:0;transform:translateY(48px) scale(.93)}100%{opacity:1;transform:none}}
.fprice::after{content:"";position:absolute;top:0;left:0;height:3px;width:0;background:var(--tc,#0099ff);border-radius:3px 3px 0 0}
.fprices.played .fprice::after{transition:width .9s var(--ease) .45s;width:100%}
.fprice:hover{box-shadow:0 26px 64px rgba(0,0,0,.45);border-color:color-mix(in srgb,var(--tc,#0099ff) 45%,var(--hair))}
@supports not (color: color-mix(in srgb, red 50%, blue)){.fprice:hover{border-color:#3a3a3a}}
/* packs d'options */
.opacks{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:16px}
.opack{position:relative;background:var(--s1);border:1px dashed color-mix(in srgb,var(--pc,#0099ff) 45%,var(--hair));border-radius:18px;padding:22px 22px 20px;display:flex;flex-direction:column;overflow:hidden}
.opack::before{content:"";position:absolute;inset:0;background:radial-gradient(300px 160px at 90% 0%,color-mix(in srgb,var(--pc,#0099ff) 12%,transparent),transparent 60%);pointer-events:none}
.opack .pkk{font-size:10px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:var(--pc,#0099ff);margin-bottom:8px}
.opack h4{font-family:var(--display);font-weight:500;font-size:18px;letter-spacing:-.03em;color:#fff;margin-bottom:6px}
.opack .pk-sub{font-size:12.5px;color:var(--muted);line-height:1.5;margin-bottom:14px}
.opack .pk-price{font-family:var(--display);font-weight:600;font-size:26px;letter-spacing:-.04em;color:#fff;margin-bottom:2px}
.opack .pk-price small{font-size:13px;color:var(--muted);font-family:var(--body);font-weight:400}
.opack .pk-was{font-size:12px;color:var(--faint,#777);text-decoration:line-through;margin-bottom:14px}
.opack .pk-save{position:absolute;top:16px;right:16px;background:rgba(34,197,94,.14);border:1px solid rgba(34,197,94,.4);color:#6ee7a0;font-size:10.5px;font-weight:700;border-radius:100px;padding:4px 10px}
.opack a{margin-top:auto}
@media(max-width:880px){.opacks{grid-template-columns:1fr}}

/* --- 4. CONFIGURATEUR — feedback d'ajout --- */
.copt{transition:border-color .2s,background .2s,transform .15s var(--ease)}
.copt:hover{transform:translateX(4px)}
.copt.on .cbox{animation:cbox-pop .38s var(--ease)}
@keyframes cbox-pop{0%{transform:scale(.4)}55%{transform:scale(1.18)}100%{transform:scale(1)}}
.cart-lines > *{animation:cartline-in .42s var(--ease) both}
@keyframes cartline-in{0%{opacity:0;transform:translateX(14px)}100%{opacity:1;transform:none}}
.cart .ctot .v{transition:transform .25s var(--ease)}
.config .cprix{transition:color .2s}
.copt.on .cprix{color:var(--cc,#0099ff)}
/* carte 01 : logo Europe dans la case */
.fvcard .fvi.flag{background:#fff;border-color:#fff;overflow:hidden}
.fvcard .fvi.flag img{width:30px;height:30px;border-radius:50%;object-fit:cover}

/* ============================================================
   V45 — charte Framer : cartes offres sans liseré couleur,
   drapeau carré, email façon Gmail, carte tarif dynamique
   ============================================================ */
/* --- cartes d'offre : pas de liséré couleur en haut, lift neutre, entrée douce --- */
.fprice::after{display:none!important}
.fprices.cascade > .fprice{opacity:0;transform:none;transition:box-shadow .35s var(--ease),border-color .35s,transform .35s var(--ease)}
.fprices.cascade.played > .fprice{animation:price-in2 .42s var(--ease) both}
.fprices.cascade.played > .fprice:nth-child(1){animation-delay:.02s}
.fprices.cascade.played > .fprice:nth-child(2){animation-delay:.07s}
.fprices.cascade.played > .fprice:nth-child(3){animation-delay:.12s}
@keyframes price-in2{0%{opacity:0;transform:translateY(30px) scale(.975)}100%{opacity:1;transform:none}}
.fprice:hover{box-shadow:0 24px 60px rgba(0,0,0,.45);border-color:var(--hair);transform:translateY(-5px)}
@media(prefers-reduced-motion:reduce){.fprices.cascade.played > .fprice{animation:none}.fprices.cascade > .fprice{opacity:1}}

/* --- carte 01 valeur : drapeau Europe CARRÉ (pas rond) --- */
.fvcard .fvi.flag{border-radius:10px;background:transparent;border:1px solid var(--hair);padding:0;overflow:hidden}
.fvcard .fvi.flag img{width:100%;height:100%;border-radius:9px;object-fit:cover}

/* --- email façon Gmail --- */
.gmsg{width:100%;max-width:480px;margin:0 auto;background:var(--s1);border:1px solid var(--hair);border-radius:18px;overflow:hidden;box-shadow:0 44px 100px rgba(0,0,0,.55)}
.gm-top{display:flex;align-items:center;gap:16px;padding:11px 16px;border-bottom:1px solid var(--hair-soft);color:var(--faint,#777)}
.gm-top svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.gm-top .gsp{margin-left:auto}
.gm-sub{padding:15px 18px 2px}
.gm-sub h4{font-size:17px;color:#fff;font-weight:600;letter-spacing:-.02em;line-height:1.25;margin:0}
.gm-sub .lbl{display:inline-block;margin-top:9px;font-size:10.5px;color:var(--muted);background:var(--s2);border:1px solid var(--hair);border-radius:6px;padding:3px 9px}
.gm-from{display:flex;align-items:center;gap:11px;padding:13px 18px 15px}
.gm-from .av{width:38px;height:38px;border-radius:50%;background:linear-gradient(135deg,#0099ff,#0057ff);display:grid;place-items:center;color:#fff;font-weight:600;font-family:var(--display);font-size:15px;flex:0 0 auto}
.gm-from .who{min-width:0;flex:1}
.gm-from .who .nm{font-size:13.5px;color:#fff;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.gm-from .who .nm span{color:var(--muted);font-weight:400}
.gm-from .who .to{font-size:11.5px;color:var(--faint,#777)}
.gm-from .rgt{display:flex;align-items:center;gap:13px;color:var(--faint,#777);font-size:11.5px;flex:0 0 auto}
.gm-from .rgt svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.gm-body{padding:0 14px 16px;position:relative}
.gm-stamp{position:absolute;top:-2px;right:18px;z-index:4;background:rgba(0,153,255,.95);color:#fff;font-size:9.5px;font-weight:800;letter-spacing:.05em;padding:6px 13px;border-radius:0 0 8px 8px;animation:stampin 6s var(--ease) infinite}
.gmsg .cmail{max-width:none;border-radius:12px;box-shadow:none;border:1px solid var(--hair-soft)}
.gmsg .cmail .cstamp{display:none}
@media(max-width:880px){.gmsg{max-width:440px}}

/* --- carte tarif dynamique (Le bon prix, au bon moment) --- */
.ost2{display:flex;flex-direction:column;gap:14px}
.ost2-lbl{font-size:10px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:var(--o-mut)}
.ost2-scen{display:flex;gap:6px}
.ost2-scen span{flex:1;text-align:center;font-size:11px;font-weight:600;padding:9px 6px;border-radius:10px;border:1px solid var(--o-line);color:var(--o-mut);background:var(--o-card2);transition:.3s}
.ost2-scen span.on{border-color:rgba(245,180,60,.5);color:var(--o-gold);background:rgba(245,180,60,.1)}
.ost2-rows{display:flex;flex-direction:column;gap:9px}
.ost2-r{display:flex;justify-content:space-between;align-items:baseline;font-size:12.5px;color:var(--o-mut)}
.ost2-r b{color:#fff;font-weight:600}
.ost2-r .v{font-family:var(--display);font-weight:500;color:#fff;font-variant-numeric:tabular-nums;letter-spacing:-.02em}
.ost2-r.add{opacity:0}
.osframe.in .ost2-r.add{animation:os2add .5s var(--ease) forwards}
.osframe.in .ost2-r.add:nth-of-type(2){animation-delay:.5s}
.osframe.in .ost2-r.add:nth-of-type(3){animation-delay:.85s}
@keyframes os2add{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.ost2-r.add .v{color:var(--o-green-tx)}
.ost2-tot{border-top:1px solid var(--o-line2);padding-top:15px;display:flex;justify-content:space-between;align-items:flex-end}
.ost2-tot .tl{font-size:11px;color:var(--o-mut);max-width:14ch;line-height:1.4}
.ost2-tot .tv{font-family:var(--display);font-weight:600;font-size:32px;letter-spacing:-.045em;color:var(--o-gold);font-variant-numeric:tabular-nums;line-height:1}

/* ============ V46 — email Gmail en format téléphone + typo −70 % ============ */
.gmphone{width:340px;max-width:100%;margin:0 auto;border:9px solid #161616;border-radius:42px;background:#0a0a0a;box-shadow:0 44px 100px rgba(0,0,0,.62);overflow:hidden}
.gmphone .gmnotch{height:26px;display:flex;align-items:center;justify-content:center;background:var(--s1)}
.gmphone .gmnotch::after{content:"";width:48px;height:5px;border-radius:100px;background:#000}
.gmphone .gmsg{max-width:none;border:0;border-radius:0;box-shadow:none;margin:0}
.gmphone .gm-top{padding:9px 14px;gap:13px}
.gmphone .gm-top svg{width:15px;height:15px}
.gmphone .gm-sub{padding:12px 15px 2px}
.gmphone .gm-sub h4{font-size:14.5px;line-height:1.28}
.gmphone .gm-sub .lbl{font-size:9.5px;margin-top:7px}
.gmphone .gm-from{padding:11px 15px 13px;gap:9px}
.gmphone .gm-from .av{width:32px;height:32px;font-size:13px}
.gmphone .gm-from .who .nm{font-size:12px}
.gmphone .gm-from .who .to{font-size:10.5px}
.gmphone .gm-from .rgt{gap:11px}
.gmphone .gm-from .rgt svg{width:15px;height:15px}
.gmphone .gm-body{padding:0 9px 11px}
.gmphone .gm-stamp{right:14px;font-size:8.5px;padding:5px 11px}
.gmphone .cmail-hd{padding:17px 18px 13px}
.gmphone .cmail-hd img{height:17px}
.gmphone .cmail-hd .k{font-size:8px}
.gmphone .cmail-hero{height:112px}
.gmphone .cmail-bd{padding:15px 17px 2px}
.gmphone .cmail .key{font-size:9px;margin-bottom:8px}
.gmphone .cmail h4{font-size:13.5px;margin-bottom:10px}
.gmphone .cmail-bd p{font-size:11px;line-height:1.6}
.gmphone .cmail-tbl{margin:14px 0 2px}
.gmphone .cmail-r{padding:8px 13px;font-size:10.5px}
.gmphone .cmail-r.tot{padding:11px 13px}
.gmphone .cmail-r.tot .l{font-size:12px}
.gmphone .cmail-r.tot .v{font-size:15px}
.gmphone .cmail-cf{margin:8px 17px 0;padding:13px 14px}
.gmphone .cmail-cf p{font-size:11px}
.gmphone .cmail-cta-wrap{padding:14px 17px 18px}
.gmphone .cmail-cta{padding:12px 24px;font-size:10px;letter-spacing:1.5px}
.gmphone .cmail-ft{padding:14px 17px}
.gmphone .cmail-ft b{font-size:11px}
.gmphone .cmail-ft .r{font-size:10px}
.gmphone .cmail-bar{padding:8px}
.gmphone .cmail-bar span{font-size:8.5px}
@media(max-width:880px){.gmphone{width:320px}}
/* typo −70 % retravaillée */
.cancel70{display:inline-flex;align-items:center;gap:15px;background:rgba(0,153,255,.07);border:1px solid rgba(0,153,255,.32);border-radius:18px;padding:15px 22px;margin-top:18px}
.cancel70 b{font-family:var(--display);font-weight:600;font-size:clamp(38px,4.4vw,46px);letter-spacing:-.055em;color:#7cc4ff;line-height:.85}
.cancel70 span{font-size:13px;color:var(--muted);line-height:1.45;letter-spacing:-.01em;text-align:left}

/* ============================================================
   V47 — mail compact PC, marque blanche sans orange,
   coches vertes validées, tarif dynamique (bleu), eyebrows bleus
   ============================================================ */
/* mail : format ordi compact */
.gmsg{max-width:400px}
.gmsg .cmail-hero{height:120px}
.gmsg .cmail-bd{padding:18px 22px 4px}
.gmsg .cmail-hd{padding:18px 22px 14px}

/* marque blanche : plus d'orange + bloc 39 € retravaillé */
.morph .yours i{background:linear-gradient(135deg,#39aaff,#0066cc)!important}
.wlab .tag39{display:flex;align-items:center;gap:14px;margin-top:24px;background:var(--s1);border:1px solid rgba(0,153,255,.3);color:#fff;border-radius:16px;padding:16px 20px;font-size:13px;font-weight:500;max-width:max-content}
.wlab .tag39 .pr{font-family:var(--display);font-weight:600;font-size:24px;letter-spacing:-.04em;color:#7cc4ff;line-height:1}
.wlab .tag39 .pl b{color:#fff;font-weight:600;display:block;font-size:13.5px;letter-spacing:-.01em}
.wlab .tag39 .pl em{font-style:normal;color:var(--muted);font-size:12px}

/* « Des process carrés » : coches vertes qui se valident */
.vchk{display:flex;flex-direction:column;gap:11px;margin-top:8px}
.vci{display:flex;align-items:center;gap:12px;font-size:13px;color:var(--muted);line-height:1.4}
.vci b{color:#fff;font-weight:600}
.vci .vbox{width:24px;height:24px;border-radius:50%;border:1.6px solid var(--hair);display:grid;place-items:center;color:transparent;font-size:12px;font-weight:800;flex:0 0 auto}
.vci .vbox::after{content:"✓"}
.vchk.in .vci .vbox{animation:vtick 5.6s var(--ease) infinite}
.vchk.in .vci:nth-child(1) .vbox{animation-delay:0s}
.vchk.in .vci:nth-child(2) .vbox{animation-delay:.5s}
.vchk.in .vci:nth-child(3) .vbox{animation-delay:1s}
.vchk.in .vci:nth-child(4) .vbox{animation-delay:1.5s}
@keyframes vtick{0%,7%{border-color:var(--hair);background:transparent;color:transparent}13%{transform:scale(1.22)}19%,90%{border-color:#22c55e;background:#22c55e;color:#08230f;transform:scale(1)}100%{border-color:var(--hair);background:transparent;color:transparent}}
@media(prefers-reduced-motion:reduce){.vchk.in .vci .vbox{animation:none;border-color:#22c55e;background:#22c55e;color:#08230f}}

/* tarif dynamique : prix par période, accent bleu (pas d'orange) */
.ost3{display:flex;flex-direction:column;gap:9px}
.ost3-lbl{font-size:10px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:var(--o-mut);margin-bottom:2px}
.ost3-row{display:flex;align-items:center;justify-content:space-between;background:var(--o-card2);border:1px solid var(--o-line);border-radius:12px;padding:13px 16px}
.ost3-row .pd{font-size:11px;color:var(--o-faint)}
.ost3-row .pd b{color:#fff;display:block;font-size:13px;font-weight:600;margin-bottom:1px;letter-spacing:-.01em}
.ost3-row .pp{font-family:var(--display);font-weight:600;font-size:19px;color:#fff;letter-spacing:-.035em;font-variant-numeric:tabular-nums}
.ost3-row.on{border-color:rgba(0,153,255,.55);background:rgba(0,153,255,.1)}
.ost3-row.on .pp{color:#39aaff}
.ost3-row .now{display:inline-block;margin-left:9px;font-size:9px;font-weight:700;letter-spacing:.04em;color:#39aaff;background:rgba(0,153,255,.16);border:1px solid rgba(0,153,255,.4);border-radius:100px;padding:2px 8px;vertical-align:middle}
.ost3-note{font-size:11px;color:var(--o-mut);text-align:center;margin-top:6px;display:flex;align-items:center;justify-content:center;gap:7px}
.ost3-note .pulse{width:7px;height:7px;border-radius:50%;background:#39aaff;animation:blinkdot 2s infinite}

/* ============================================================
   V48 — ranking client v2 (violet/relation) + configurateur nouvelle DA
   ============================================================ */
/* --- ranking v2 : carte relation violette --- */
.rkv2{background:radial-gradient(440px 240px at 85% 0%,rgba(139,115,247,.13),transparent),var(--s1);border:1px solid var(--hair);border-radius:22px;padding:24px;display:flex;flex-direction:column;gap:16px}
.rkv2-top{display:flex;align-items:center;gap:13px}
.rkv2-top .av{width:46px;height:46px;border-radius:50%;background:linear-gradient(135deg,#b3a1f9,#6a4cf5);display:grid;place-items:center;font-family:var(--display);font-weight:600;font-size:15px;color:#fff;flex:0 0 auto}
.rkv2-top .id b{font-size:15.5px;color:#fff;display:block;letter-spacing:-.02em}
.rkv2-top .id small{font-size:12px;color:#b3a1f9}
.rkv2-top .ring{margin-left:auto;position:relative;width:56px;height:56px;flex:0 0 auto}
.rkv2-top .ring svg{width:56px;height:56px;transform:rotate(-90deg)}
.rkv2-top .ring circle{fill:none;stroke-width:5}
.rkv2-top .ring .trk{stroke:#2a2440}
.rkv2-top .ring .val{stroke:#8b73f7;stroke-linecap:round;stroke-dasharray:151;stroke-dashoffset:151}
.rkv2.in .ring .val{transition:stroke-dashoffset 1.3s var(--ease) .35s;stroke-dashoffset:20}
.rkv2-top .ring .g{position:absolute;inset:0;display:grid;place-items:center;font-family:var(--display);font-weight:600;font-size:20px;color:#fff;letter-spacing:-.04em}
.rkv2-stats{display:flex;gap:10px}
.rkv2-stat{flex:1;background:var(--s2);border:1px solid var(--hair);border-radius:13px;padding:12px 10px;text-align:center}
.rkv2-stat b{display:block;font-family:var(--display);font-weight:600;font-size:20px;color:#fff;letter-spacing:-.03em;line-height:1}
.rkv2-stat span{font-size:10.5px;color:var(--muted);display:block;margin-top:5px}
.rkv2-tl-t{font-size:10.5px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.rkv2-tl{position:relative;padding-left:24px;display:flex;flex-direction:column;gap:2px}
.rkv2-tl::before{content:"";position:absolute;left:9px;top:14px;bottom:14px;width:2px;background:linear-gradient(180deg,#8b73f7,rgba(139,115,247,.15))}
.rkv2-step{position:relative;padding:9px 0;font-size:12.5px;color:var(--muted);display:flex;align-items:center;gap:8px}
.rkv2-step::before{content:"";position:absolute;left:-20px;top:50%;transform:translateY(-50%);width:11px;height:11px;border-radius:50%;background:#8b73f7;box-shadow:0 0 0 4px rgba(139,115,247,.14)}
.rkv2-step b{color:#fff;font-weight:600}
.rkv2-step .st{margin-left:auto;font-size:10px;font-weight:700;padding:3px 9px;border-radius:100px;white-space:nowrap;background:rgba(139,115,247,.16);color:#b3a1f9;border:1px solid rgba(139,115,247,.34)}

/* --- configurateur : nouvelle DA en cartes colorées --- */
.config.cfg2{grid-template-columns:1.15fr .85fr}
.cfg2 .cglbl{font-size:11px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:var(--muted);margin:0 0 12px}
.cfg2 .cglbl.mt{margin-top:24px}
.cfg2 .coptrow{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.cfg2 .coptg{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.cfg2 .copt{display:flex;flex-direction:column;align-items:flex-start;gap:5px;margin:0;border-radius:16px;padding:16px 16px 15px;min-height:126px;background:linear-gradient(165deg,color-mix(in srgb,var(--oc,#0099ff) 8%,var(--s1)),var(--s1));border:1px solid var(--hair);position:relative;overflow:hidden;transition:transform .2s var(--ease),border-color .2s,box-shadow .2s}
.cfg2 .copt::before{content:"";position:absolute;inset:0;opacity:0;transition:opacity .25s;background:radial-gradient(220px 130px at 88% 0%,color-mix(in srgb,var(--oc,#0099ff) 20%,transparent),transparent 62%);pointer-events:none}
.cfg2 .copt:hover{transform:translateY(-3px);border-color:color-mix(in srgb,var(--oc,#0099ff) 35%,var(--hair))}
.cfg2 .copt .cbox{position:absolute;top:13px;right:13px;margin:0}
.cfg2 .copt > span:nth-child(2){padding-right:30px;display:block}
.cfg2 .copt b{font-size:14.5px;display:block}
.cfg2 .copt small{font-size:11.5px;line-height:1.45;display:block;margin-top:4px;color:var(--muted)}
.cfg2 .copt .cprix{margin:auto 0 0;font-size:15px;padding-top:10px;color:var(--oc,#0099ff);align-self:flex-start}
.cfg2 .copt.on{border-color:color-mix(in srgb,var(--oc,#0099ff) 55%,transparent);background:linear-gradient(165deg,color-mix(in srgb,var(--oc,#0099ff) 17%,var(--s1)),var(--s1));box-shadow:0 18px 44px rgba(0,0,0,.34);animation:optpop .36s var(--ease)}
.cfg2 .copt.on::before{opacity:1}
.cfg2 .copt.on .cbox{background:var(--oc,#0099ff);border-color:var(--oc,#0099ff)}
@keyframes optpop{0%{transform:scale(.975)}55%{transform:scale(1.018)}100%{transform:scale(1)}}
@supports not (color: color-mix(in srgb, red 50%, blue)){.cfg2 .copt{background:var(--s1)}.cfg2 .copt.on{background:rgba(0,153,255,.1);border-color:rgba(0,153,255,.55)}}
@media(max-width:880px){
  .config.cfg2{grid-template-columns:1fr}
  .cfg2 .coptrow,.cfg2 .coptg{grid-template-columns:1fr}
  .config.cfg2 .cart{position:static;margin-top:6px}
}

/* ============================================================
   V49 — titres outils secondaires, mail AVANT/APRÈS (VS), config monochrome
   ============================================================ */
/* mail : comparaison VS avant/après */
.mvs{display:grid;grid-template-columns:1fr 54px 1fr;align-items:center;gap:0}
.mvs-col .mvs-lbl{display:inline-flex;align-items:center;gap:8px;font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;margin-bottom:13px}
.mvs-lbl .d{width:8px;height:8px;border-radius:50%}
.mvs-lbl.bad{color:#ff8ba3}.mvs-lbl.bad .d{background:#ff7a7a}
.mvs-lbl.good{color:#6ee7a0}.mvs-lbl.good .d{background:#22c55e}
.mvs-mid{display:flex;align-items:center;justify-content:center}
.mvs-mid i{width:46px;height:46px;border-radius:50%;background:var(--s2);border:1px solid rgba(0,153,255,.5);display:grid;place-items:center;color:#39aaff;font-style:normal;font-weight:800;font-size:13px;box-shadow:0 0 30px rgba(0,153,255,.25);animation:pulsevs 2.4s infinite}
/* email gmail "classic" brouillon (pas sérieux) */
.gmc{background:var(--s1);border:1px solid var(--hair);border-radius:16px;overflow:hidden}
.gmc-top{display:flex;align-items:center;gap:10px;padding:13px 15px;border-bottom:1px solid var(--hair-soft)}
.gmc-top .av{width:34px;height:34px;border-radius:50%;background:#33373d;display:grid;place-items:center;color:#aab;font-weight:600;font-family:var(--display);font-size:13px;flex:0 0 auto}
.gmc-top .s{min-width:0}.gmc-top .s b{color:#fff;font-size:12.5px;display:block}.gmc-top .s span{font-size:11px;color:var(--faint,#777)}
.gmc-top .time{margin-left:auto;font-size:10.5px;color:var(--faint,#777);flex:0 0 auto}
.gmc-sub{padding:12px 15px 0;font-size:13px}
.gmc-sub.empty{color:var(--faint,#777);font-style:italic}
.gmc-body{padding:8px 15px 16px;font-size:12.5px;color:#8a8a8a;line-height:1.75}
.gmc-flags{display:flex;gap:7px;flex-wrap:wrap;padding:0 15px 15px}
.gmc-flags span{font-size:10px;color:#ff8ba3;background:rgba(239,68,68,.08);border:1px solid rgba(239,68,68,.28);border-radius:100px;padding:3px 9px}
.mvs .gmsg,.mvs .cmail{max-width:none}
.mvs .cmail{box-shadow:none}
@media(max-width:880px){
  .mvs{grid-template-columns:1fr}
  .mvs-mid{padding:14px 0}
  .mvs-mid i{transform:rotate(90deg)}
}
/* configurateur : monochrome (moins « IA »), un seul accent bleu */
.cfg2 .copt{background:linear-gradient(180deg,#171717,var(--s1))!important}
.cfg2 .copt::before{background:radial-gradient(220px 130px at 88% 0%,rgba(0,153,255,.12),transparent 62%)}
.cfg2 .copt:hover{border-color:#333}
.cfg2 .copt .cprix{color:var(--muted)}
.cfg2 .copt.on{border-color:rgba(0,153,255,.55)!important;background:linear-gradient(180deg,rgba(0,153,255,.1),var(--s1))!important;box-shadow:0 16px 42px rgba(0,0,0,.34)!important}
.cfg2 .copt.on .cprix{color:#39aaff}
.cfg2 .copt.on .cbox{background:#0099ff!important;border-color:#0099ff!important}

/* ============ V50 — page découverte OS ============ */
.optcard .osee{display:flex;align-items:center;gap:6px;margin-top:15px;padding-top:14px;border-top:1px solid var(--hair);font-size:12.5px;font-weight:600;color:var(--oc,#0099ff)}
.freemonth{display:inline-flex;align-items:center;gap:8px;background:rgba(34,197,94,.1);border:1px solid rgba(34,197,94,.4);color:#6ee7a0;border-radius:100px;padding:9px 18px;font-size:13px;font-weight:700}
.osonline-cta{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;margin-top:22px}

/* ============================================================
   V51 — options monochrome (doc), carte tarif animée sans contour
   ============================================================ */
/* options : monochrome + un seul accent bleu (charte) — fini les pastilles fondu multicolores */
.optcard{background:var(--s1);border-color:var(--hair)}
.optcard::before{background:radial-gradient(420px 240px at 14% 0%,rgba(0,153,255,.06),transparent 62%)}
.optcard .oprice{background:var(--s2);color:#fff;border:1px solid var(--hair)}
.optcard li::before{background:#0099ff}
.optcard .oincl{color:var(--muted);background:var(--s2);border:1px solid var(--hair)}

/* carte tarif dynamique : animation (prix qui s'ajuste), aucun contour de couleur */
.ost4{display:flex;flex-direction:column;gap:14px}
.ost4-lbl{font-size:10px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:var(--o-mut)}
.ost4-chips{display:flex;gap:7px}
.ost4-chips span{flex:1;text-align:center;font-size:11px;font-weight:600;padding:9px 6px;border-radius:10px;border:1px solid var(--o-line);color:var(--o-mut);background:var(--o-card2)}
.osframe.in .ost4-chips span{animation:ost4chip 9s var(--ease) infinite}
.osframe.in .ost4-chips span:nth-child(2){animation-delay:3s}
.osframe.in .ost4-chips span:nth-child(3){animation-delay:6s}
@keyframes ost4chip{0%,28%{background:rgba(0,153,255,.16);color:#39aaff;border-color:var(--o-line)}33%,100%{background:var(--o-card2);color:var(--o-mut);border-color:var(--o-line)}}
.ost4-big{display:flex;align-items:baseline;gap:14px;margin-top:6px}
.ost4-price{position:relative;height:48px;width:172px;flex:0 0 auto}
.ost4-price b{position:absolute;left:0;top:0;font-family:var(--display);font-weight:600;font-size:42px;letter-spacing:-.045em;color:#fff;opacity:0;font-variant-numeric:tabular-nums;line-height:1}
.osframe.in .ost4-price b{animation:ost4cyc 9s var(--ease) infinite}
.osframe.in .ost4-price b:nth-child(2){animation-delay:3s}
.osframe.in .ost4-price b:nth-child(3){animation-delay:6s}
@keyframes ost4cyc{0%{opacity:0;transform:translateY(14px)}5%,28%{opacity:1;transform:none}33%,100%{opacity:0;transform:translateY(-14px)}}
.ost4-sub{font-size:11.5px;color:var(--o-mut);max-width:15ch;line-height:1.4}
.ost4-note{font-size:11.5px;color:var(--o-mut);display:flex;align-items:center;gap:8px;margin-top:4px;border-top:1px solid var(--o-line2);padding-top:14px;line-height:1.4}
.ost4-note .pulse{width:7px;height:7px;border-radius:50%;background:#39aaff;flex:0 0 auto;animation:blinkdot 2s infinite}
@media(prefers-reduced-motion:reduce){
  .osframe.in .ost4-price b,.osframe.in .ost4-chips span{animation:none}
  .ost4-price b:nth-child(2){opacity:1}
  .ost4-chips span:nth-child(2){background:rgba(0,153,255,.13);color:#39aaff;border-color:rgba(0,153,255,.42)}
}

/* ============ V52 — section mail mieux animée ============ */
.mailanim .cmail{opacity:0}
.mailanim.in .cmail{animation:mailarrive .85s var(--ease) both}
@keyframes mailarrive{0%{opacity:0;transform:translateY(46px) scale(.96)}100%{opacity:1;transform:none}}
.mailanim .cmail-hero{transform:scale(1.08);transition:transform 1.2s var(--ease)}
.mailanim.in .cmail-hero{transform:scale(1)}
.mailanim .cmail-r{opacity:0}
.mailanim.in .cmail-r{animation:mrowin .5s var(--ease) both}
.mailanim.in .cmail-r:nth-child(1){animation-delay:.7s}
.mailanim.in .cmail-r:nth-child(2){animation-delay:.82s}
.mailanim.in .cmail-r:nth-child(3){animation-delay:.94s}
.mailanim.in .cmail-r:nth-child(4){animation-delay:1.06s}
@keyframes mrowin{from{opacity:0;transform:translateX(12px)}to{opacity:1;transform:none}}
/* tampon « envoyé automatiquement » */
.cmail .estamp{position:absolute;top:14px;right:-7px;z-index:5;background:#22c55e;color:#06240f;font-size:10px;font-weight:800;letter-spacing:.03em;padding:6px 13px;border-radius:8px 0 0 8px;box-shadow:0 8px 22px rgba(34,197,94,.3);opacity:0}
.mailanim.in .cmail .estamp{animation:estamppop .55s var(--ease) 1.15s both}
@keyframes estamppop{0%{opacity:0;transform:translateX(14px) scale(1.5)}60%{opacity:1;transform:translateX(0) scale(1)}100%{opacity:1;transform:none}}
/* sweep sur le CTA */
.mailanim .cmail-cta{position:relative;overflow:hidden}
.mailanim.in .cmail-cta::after{content:"";position:absolute;top:0;bottom:0;width:40%;left:-50%;transform:skewX(-18deg);background:linear-gradient(105deg,transparent,rgba(255,255,255,.45),transparent);animation:ctasweep 3.4s var(--ease) 1.6s infinite}
@keyframes ctasweep{0%{left:-50%}40%,100%{left:130%}}
/* pop du −70 % */
.mailanim .cancel70{opacity:0}
.mailanim.in .cancel70{animation:c70in .6s var(--ease) .35s both}
@keyframes c70in{0%{opacity:0;transform:translateY(14px) scale(.94)}100%{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){
  .mailanim.in .cmail,.mailanim.in .cmail-r,.mailanim .cmail .estamp,.mailanim.in .cancel70{animation:none;opacity:1;transform:none}
  .mailanim .cmail-hero{transform:none}
  .mailanim.in .cmail-cta::after{display:none}
}

/* ============ V53 — avis Google + offre 30 € ; configurateur formules dégradé ============ */
/* avis */
.gavis-h{display:flex;align-items:center;gap:11px;margin-bottom:6px}
.gavis-h img{height:22px}
.gavis-h b{font-family:var(--display);font-weight:500;font-size:19px;letter-spacing:-.025em;color:#fff}
.offer30{background:radial-gradient(440px 260px at 82% 0%,rgba(34,197,94,.13),transparent),var(--s1);border:1px solid rgba(34,197,94,.32)}
.offer30 h3{font-size:20px;letter-spacing:-.03em}
.coupon{display:flex;align-items:center;gap:16px;margin-top:auto;background:var(--s2);border:1px dashed rgba(34,197,94,.5);border-radius:14px;padding:15px 18px}
.coupon .amt{font-family:var(--display);font-weight:600;font-size:38px;letter-spacing:-.045em;color:#6ee7a0;line-height:.9;flex:0 0 auto}
.coupon .ct{font-size:12.5px;color:var(--muted);line-height:1.5}
.coupon .ct b{color:#fff;font-weight:600}
/* configurateur : cartes formules en dégradé + animation d'apparition */
.cfg2 .coptrow > .copt{background:radial-gradient(240px 170px at 86% 0%,color-mix(in srgb,var(--oc,#0099ff) 24%,transparent),transparent 60%),linear-gradient(180deg,color-mix(in srgb,var(--oc,#0099ff) 13%,var(--s1)),var(--s1))!important;border-color:color-mix(in srgb,var(--oc,#0099ff) 28%,var(--hair));opacity:0;transform:translateY(22px)}
.cfg2.in .coptrow > .copt{animation:cardrise .6s var(--ease) forwards}
.cfg2.in .coptrow > .copt:nth-child(2){animation-delay:.1s}
.cfg2.in .coptrow > .copt:nth-child(3){animation-delay:.2s}
@keyframes cardrise{to{opacity:1;transform:none}}
.cfg2 .coptrow > .copt .cprix{color:#fff}
.cfg2 .coptrow > .copt.on{border-color:color-mix(in srgb,var(--oc,#0099ff) 60%,transparent)!important;background:radial-gradient(260px 190px at 86% 0%,color-mix(in srgb,var(--oc,#0099ff) 34%,transparent),transparent 62%),linear-gradient(180deg,color-mix(in srgb,var(--oc,#0099ff) 20%,var(--s1)),var(--s1))!important;box-shadow:0 18px 46px rgba(0,0,0,.4)}
.cfg2 .coptrow > .copt.on .cbox{background:var(--oc,#0099ff)!important;border-color:var(--oc,#0099ff)!important}
@supports not (color: color-mix(in srgb, red 50%, blue)){.cfg2 .coptrow > .copt{background:var(--s1)!important;border-color:var(--hair)}}
@media(prefers-reduced-motion:reduce){.cfg2 .coptrow > .copt{opacity:1;transform:none;animation:none}}

/* ============ V54 — mail en vrai Gmail (animé, centré mobile) ============ */
.mailanim{display:flex;justify-content:center}
.mailanim .gmsg{opacity:0;margin:0}
.mailanim.in .gmsg{animation:mailarrive .85s var(--ease) both}
.mailanim .cmail{opacity:1!important;animation:none!important;border:0;border-radius:0;box-shadow:none}
.gmsg .gm-body .cmail{border:1px solid var(--hair-soft);border-radius:12px}
@media(max-width:880px){.mailanim .gmsg{max-width:420px;width:100%}}

/* ============ V55 — page tarifs : section « le projet » / confiance ============ */
.proj-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.proj-stat{background:var(--s1);border:1px solid var(--hair);border-radius:18px;padding:24px 24px 22px;position:relative;overflow:hidden}
.proj-stat::before{content:"";position:absolute;inset:0;background:radial-gradient(280px 150px at 88% 0%,rgba(0,153,255,.07),transparent 60%);pointer-events:none}
.proj-stat .pk{font-size:10.5px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.proj-stat b{font-family:var(--display);font-weight:600;font-size:clamp(26px,3.2vw,38px);letter-spacing:-.045em;color:#fff;display:block;margin:8px 0 6px;line-height:1}
.proj-stat .pl{font-size:13px;color:var(--muted);line-height:1.55}
.proj-stat .pl b{display:inline;font-size:inherit;color:#fff;margin:0}
.partner{display:flex;align-items:center;justify-content:center;gap:clamp(18px,4vw,40px);flex-wrap:wrap;background:radial-gradient(640px 300px at 50% 0%,rgba(0,153,255,.08),transparent),var(--s1);border:1px solid var(--hair);border-radius:22px;padding:30px 26px;margin-top:16px}
.partner .pp-lo{display:flex;align-items:center;gap:clamp(16px,3vw,30px)}
.partner .pp-lo img{height:28px}
.partner .pp-lo .x{color:var(--faint,#777);font-size:20px;font-weight:300}
.partner .pp-tx{max-width:42ch;color:var(--muted);font-size:13.5px;line-height:1.6;text-align:center}
.partner .pp-tx b{color:#fff;font-weight:600}
@media(max-width:880px){.proj-stats{grid-template-columns:1fr 1fr}.partner{flex-direction:column;gap:18px}}
@media(max-width:520px){.proj-stats{grid-template-columns:1fr}}

/* ============================================================
   V57 — mail « envoi automatique » + fix mobile · pop-up RDV ·
   configurateur interactif (maquette qui s'allume) · 3D du lourd
   ============================================================ */

/* ---------- 57.1 · MAIL : bandeau « envoi automatique » ---------- */
.gmsg{position:relative}
.osband{display:flex;align-items:center;gap:9px;padding:9px 14px;background:linear-gradient(180deg,rgba(0,153,255,.10),transparent),var(--s2);border-bottom:1px solid var(--hair-soft);font-family:var(--body);font-size:11.5px;font-weight:600;letter-spacing:.01em;color:#7cc5ff;position:relative;overflow:hidden}
.osband .ob-dot{width:7px;height:7px;border-radius:50%;background:var(--blue);flex:0 0 auto}
.osband .ob-lbl{display:inline-flex;align-items:center;gap:6px;white-space:nowrap;min-width:0}
.osband .ob-lbl svg{width:13px;height:13px;fill:none;stroke:currentColor;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round;flex:0 0 auto}
.osband .ob-sent{position:absolute;left:30px;color:#6ee7a0;opacity:0}
.osband .ob-bar{margin-left:auto;flex:1 1 auto;max-width:120px;height:4px;border-radius:100px;background:var(--hair);overflow:hidden}
.osband .ob-bar > i{display:block;height:100%;width:0;border-radius:inherit;background:linear-gradient(90deg,#0077cc,#39aaff)}
.mailanim.in .osband .ob-bar > i{animation:obfill 7s var(--ease) infinite}
.mailanim.in .osband .ob-dot{animation:obpulse 7s var(--ease) infinite}
.mailanim.in .osband .ob-sending{animation:obswap 7s steps(1) infinite}
.mailanim.in .osband .ob-sent{animation:obswapin 7s steps(1) infinite}
.mailanim.in .gmsg{animation:mailarrive .85s var(--ease) both, gmwhoosh 7s var(--ease) .85s infinite}
@keyframes obfill{0%{width:0}42%{width:100%}52%,100%{width:100%}}
@keyframes obpulse{0%,42%{box-shadow:0 0 0 0 rgba(0,153,255,.5)}21%{box-shadow:0 0 0 5px rgba(0,153,255,0)}46%,100%{background:#22c55e;box-shadow:none}}
@keyframes obswap{0%,45%{opacity:1}46%,100%{opacity:0}}
@keyframes obswapin{0%,45%{opacity:0}48%,100%{opacity:1}}
@keyframes gmwhoosh{0%,40%{transform:translateY(0);opacity:1}46%{transform:translateY(-10px);opacity:.55}54%{transform:translateY(0);opacity:1}100%{transform:translateY(0);opacity:1}}
.mailanim.in .cmail .estamp{animation:estamppop .55s var(--ease) 1.15s both, estamploop 7s var(--ease) 7s infinite}
@keyframes estamploop{0%,44%{opacity:1;transform:none}46%{opacity:0;transform:translateX(10px)}52%{opacity:1;transform:none}100%{opacity:1;transform:none}}

/* ---------- 57.2 · MAIL : fix mobile (≤480px) ---------- */
@media(max-width:480px){
  .mailanim{width:100%;padding:0}
  .mailanim .gmsg{max-width:100%;width:100%;margin:0 auto;border-radius:14px}
  .gmsg .gm-body .cmail{max-width:100%}
  .mailanim .gmsg *{max-width:100%}
  .cmail-r{min-width:0}
  .gm-from{padding:11px 14px 13px;gap:9px}
  .gm-from .av{width:32px;height:32px;font-size:13px}
  .gm-from .who{min-width:0;flex:1 1 auto}
  .gm-from .who .nm{font-size:13px}
  .gm-from .who .nm span{display:none}
  .gm-from .rgt{gap:0}
  .gm-from .rgt svg:first-child{display:none}
  .gm-sub{padding:13px 14px 2px}
  .gm-sub h4{font-size:15px}
  .gmsg .cmail-hd{padding:18px 18px 14px}
  .gmsg .cmail-hero{height:118px}
  .gmsg .cmail-bd{padding:18px 16px 4px}
  .cmail-tbl{margin:14px 0 4px}
  .cmail-r{padding:9px 13px;font-size:11px;gap:10px}
  .cmail-r .l{flex:1 1 auto;min-width:0}
  .cmail-r .v{flex:0 0 auto;text-align:right;white-space:nowrap}
  .cmail-r.tot .v{font-size:15px}
  .cmail-cta-wrap{padding:16px 16px 22px}
  .cmail-cta{padding:13px 22px;letter-spacing:.06em;font-size:12.5px;max-width:100%;white-space:normal}
  .cmail-ft{padding:16px;gap:10px;flex-wrap:wrap}
  .cmail .estamp{right:0;border-radius:8px 0 0 8px;font-size:9.5px;padding:5px 10px}
  .gm-body{overflow:hidden}
  .osband{padding:8px 12px;font-size:10.5px;gap:7px}
  .osband .ob-bar{max-width:84px}
  .osband .ob-sent{left:26px}
}

/* ---------- 57.3 · POP-UP RDV lead-capture ---------- */
.rdvpop{opacity:0}
.rdvpop.on{opacity:1;animation:rdvfade .26s var(--ease) both}
.rdvpop.out{animation:rdvfadeout .22s var(--ease) both}
.rdvpop .pop{animation:rdvpopin .34s var(--ease) both}
.rdvpop.out .pop{animation:rdvpopout .22s var(--ease) both}
@keyframes rdvfade{from{opacity:0}to{opacity:1}}
@keyframes rdvfadeout{from{opacity:1}to{opacity:0}}
@keyframes rdvpopin{from{opacity:0;transform:translateY(14px) scale(.97)}to{opacity:1;transform:none}}
@keyframes rdvpopout{from{opacity:1;transform:none}to{opacity:0;transform:translateY(10px) scale(.98)}}
.poprdv{width:min(440px,94vw);max-height:90vh;overflow-y:auto;overscroll-behavior:contain}
.poprdv:focus,.poprdv:focus-visible{outline:none}
.poprdv .gift{background:rgba(0,153,255,.14);border-color:rgba(0,153,255,.38);color:#7cc8ff}
.poplist{list-style:none;margin:4px 0 20px;padding:0;display:grid;gap:11px}
.poplist li{display:flex;gap:12px;align-items:flex-start;text-align:left}
.poplist b{display:block;font-size:14px;color:#fff;letter-spacing:-.012em}
.poplist span{display:block;color:var(--muted);font-size:12.5px;line-height:1.45}
.poplist .pli{flex:0 0 auto;width:9px;height:9px;border-radius:3px;margin-top:5px}
.poplist .pli-b{background:var(--blue)}
.poplist .pli-v{background:var(--violet)}
.poplist .pli-g{background:#22c55e}
.popcta{display:grid;gap:10px}
.popcta .btn{width:100%;min-height:48px}
.btn-tonal-b{display:inline-flex;align-items:center;justify-content:center;gap:8px;background:rgba(0,153,255,.16);color:#62bcff;border:1px solid rgba(0,153,255,.38);border-radius:100px;font-size:14px;font-weight:600;text-decoration:none;transition:.2s var(--ease)}
.btn-tonal-b:hover{background:rgba(0,153,255,.24);border-color:rgba(0,153,255,.5)}
.poplegal{margin:14px 0 0;text-align:center;font-size:11px;color:var(--muted)}
@media(max-width:560px){
  .rdvpop{place-items:end center;padding:0}
  .poprdv{width:100%;max-width:100%;max-height:90vh;overflow-y:auto;border-radius:24px 24px 0 0;border-left:none;border-right:none;border-bottom:none;padding:24px 20px calc(22px + env(safe-area-inset-bottom))}
  .poprdv .px{width:40px;height:40px;top:12px;right:12px}
  .rdvpop.on .pop{animation:rdvsheetin .34s var(--ease) both}
  .rdvpop.out .pop{animation:rdvsheetout .24s var(--ease) both}
}
@keyframes rdvsheetin{from{transform:translateY(100%)}to{transform:translateY(0)}}
@keyframes rdvsheetout{from{transform:translateY(0)}to{transform:translateY(100%)}}

/* ---------- 57.4 · CONFIGURATEUR INTERACTIF (.osc) ---------- */
.osc{display:grid;grid-template-columns:minmax(0,1fr) 1.2fr minmax(0,.82fr);gap:20px;align-items:start}
.osc .cglbl{font-size:11px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:var(--muted);margin:0 0 11px}
.osc .cglbl.mt{margin-top:22px}
.osc-plans{display:grid;gap:9px}
.osc-plan{position:relative;display:flex;flex-direction:column;align-items:flex-start;gap:2px;width:100%;text-align:left;background:var(--s1);border:1px solid var(--hair);border-radius:14px;padding:14px 15px;cursor:pointer;transition:transform .2s var(--ease),border-color .2s,box-shadow .2s;color:var(--muted)}
.osc-plan b{font-family:var(--display);font-size:16px;color:#fff;letter-spacing:-.02em}
.osc-plan small{font-size:11.5px;color:var(--muted)}
.osc-plan .osc-pp{margin-top:6px;font-family:var(--display);font-size:15px;color:#fff}
.osc-plan .osc-pp i{font-style:normal;font-size:11px;color:var(--muted)}
.osc-plan .osc-tag{position:absolute;top:11px;right:11px;font-size:9px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--muted);background:var(--s2);border:1px solid var(--hair);border-radius:100px;padding:3px 9px}
.osc-plan:hover{border-color:#3a3a3a;transform:translateY(-1px)}
.osc-plan.on{border-color:color-mix(in srgb,var(--oc) 55%,transparent);background:linear-gradient(165deg,color-mix(in srgb,var(--oc) 16%,var(--s1)),var(--s1));box-shadow:0 14px 34px rgba(0,0,0,.34)}
.osc-plan.on .osc-pp,.osc-plan.on .osc-tag{color:var(--oc)}
.osc-plan.on .osc-tag{border-color:color-mix(in srgb,var(--oc) 40%,transparent);background:color-mix(in srgb,var(--oc) 12%,var(--s2))}
.osc-plan:focus-visible{outline:2px solid var(--blue);outline-offset:2px}
.osc-opts{display:grid;gap:8px}
.osc-opt{position:relative;display:flex;align-items:center;gap:12px;width:100%;text-align:left;background:var(--s1);border:1px solid var(--hair);border-radius:13px;padding:12px 14px;cursor:pointer;transition:border-color .2s,background .2s;color:var(--muted)}
.osc-opt:hover{border-color:#3a3a3a}
.osc-opt .osc-otxt{flex:1 1 auto;min-width:0}
.osc-opt .osc-otxt b{display:block;font-size:13.5px;color:#fff}
.osc-opt .osc-otxt small{display:block;font-size:11px;color:var(--muted);margin-top:1px}
.osc-opt .osc-op{flex:0 0 auto;font-family:var(--display);font-size:14px;color:var(--oc)}
.osc-opt .osc-op i{font-style:normal;font-size:10px;color:var(--muted)}
.osc-opt .osc-incl{display:none;flex:0 0 auto;font-size:10.5px;font-weight:600;color:#22c55e;background:rgba(34,197,94,.12);border:1px solid rgba(34,197,94,.38);border-radius:100px;padding:4px 10px}
.osc-sw{flex:0 0 auto;width:42px;height:24px;border-radius:100px;background:var(--s2);border:1px solid var(--hair);position:relative;transition:.2s var(--ease)}
.osc-sw::after{content:"";position:absolute;top:2px;left:2px;width:18px;height:18px;border-radius:50%;background:#666;transition:.2s var(--ease)}
.osc-opt.on{background:color-mix(in srgb,var(--oc) 10%,var(--s1));border-color:color-mix(in srgb,var(--oc) 45%,transparent)}
.osc-opt.on .osc-sw{background:color-mix(in srgb,var(--oc) 28%,var(--s2));border-color:color-mix(in srgb,var(--oc) 50%,transparent)}
.osc-opt.on .osc-sw::after{transform:translateX(18px);background:var(--oc)}
.osc-opt.incl{cursor:default;background:rgba(34,197,94,.07);border-color:rgba(34,197,94,.25)}
.osc-opt.incl .osc-op{display:none}
.osc-opt.incl .osc-incl{display:inline-block}
.osc-opt.incl .osc-sw{background:rgba(34,197,94,.3);border-color:rgba(34,197,94,.5)}
.osc-opt.incl .osc-sw::after{transform:translateX(18px);background:#22c55e}
.osc-opt:focus-visible{outline:2px solid var(--blue);outline-offset:2px}
/* maquette */
.osc-stage{display:flex;flex-direction:column;gap:10px}
.osc-app{background:linear-gradient(180deg,#161616,#101010);border:1px solid var(--hair);border-radius:18px;overflow:hidden;box-shadow:0 40px 90px rgba(0,0,0,.5);transition:transform .35s var(--ease)}
.osc-topbar{display:flex;align-items:center;gap:10px;padding:11px 14px;border-bottom:1px solid var(--hair-soft);background:var(--s1)}
.osc-dots{display:inline-flex;gap:5px}
.osc-dots i{width:8px;height:8px;border-radius:50%;background:var(--s2)}
.osc-brand{font-family:var(--display);font-size:13px;color:#fff;letter-spacing:-.02em}
.osc-brand b{color:var(--blue)}
.osc-chip{margin-left:auto;font-size:10.5px;font-weight:600;color:#7cc5ff;background:rgba(0,153,255,.14);border:1px solid rgba(0,153,255,.36);border-radius:100px;padding:3px 10px}
.osc-body{display:grid;grid-template-columns:142px 1fr;min-height:300px}
.osc-nav{border-right:1px solid var(--hair-soft);padding:12px 9px;display:flex;flex-direction:column;gap:3px;background:#0e0e0e}
.osc-navi{display:flex;align-items:center;gap:9px;font-size:11.5px;color:#777;padding:7px 9px;border-radius:9px;transition:.25s var(--ease)}
.osc-navi i{width:7px;height:7px;border-radius:50%;background:#333;flex:0 0 auto;transition:.25s var(--ease)}
.osc-navi.on{color:#fff;background:var(--s1)}
.osc-navi.on i{background:var(--blue);box-shadow:0 0 9px var(--blue)}
.osc-work{padding:14px;display:grid;grid-template-columns:1fr 1fr;gap:10px;align-content:start}
.osc-tile{background:var(--s1);border:1px solid var(--hair);border-radius:13px;padding:13px;opacity:.32;filter:grayscale(.6);transform:scale(.97);transition:opacity .35s var(--ease),filter .35s var(--ease),transform .35s var(--ease),border-color .35s,box-shadow .35s}
.osc-tile .ti{display:inline-grid;place-items:center;width:30px;height:30px;border-radius:9px;background:var(--s2);color:var(--mc,#0099ff);font-size:15px;margin-bottom:7px}
.osc-tile b{display:block;font-size:12.5px;color:#fff;letter-spacing:-.01em}
.osc-tile small{display:block;font-size:10.5px;color:var(--muted);margin-top:2px}
.osc-tile-wide{grid-column:1/-1}
.osc-tile.lit{opacity:1;filter:none;transform:none;border-color:color-mix(in srgb,var(--mc) 45%,var(--hair));background:radial-gradient(220px 130px at 85% 0%,color-mix(in srgb,var(--mc) 16%,transparent),transparent 60%),var(--s1);box-shadow:0 0 0 1px color-mix(in srgb,var(--mc) 30%,transparent),0 14px 30px rgba(0,0,0,.35)}
.osc-tile.lit .ti{background:color-mix(in srgb,var(--mc) 18%,var(--s2));color:var(--mc)}
.osc-tile.justlit{animation:osc-pop .45s var(--ease)}
@keyframes osc-pop{0%{transform:scale(.9)}55%{transform:scale(1.04)}100%{transform:scale(1)}}
.osc-hint{text-align:center;font-size:11.5px;color:var(--muted)}
/* panier */
.osc-cart{position:sticky;top:84px;background:radial-gradient(420px 260px at 80% 0%,rgba(0,153,255,.14),transparent),var(--s1);border:1px solid color-mix(in srgb,var(--blue) 35%,var(--hair));border-radius:var(--r-card);padding:22px}
.osc-cart h3{font-size:17px;letter-spacing:-.02em;margin-bottom:5px}
.osc-cart > .legal{margin-bottom:14px}
.osc-bill{position:relative;display:grid;grid-template-columns:1fr 1fr;background:var(--s2);border:1px solid var(--hair);border-radius:100px;padding:4px;margin-bottom:14px}
.osc-bill-knob{position:absolute;top:4px;bottom:4px;left:4px;width:calc(50% - 4px);border-radius:100px;background:rgba(0,153,255,.22);border:1px solid rgba(0,153,255,.45);transition:transform .28s var(--ease)}
.osc-bill[data-mode=n] .osc-bill-knob{transform:translateX(100%)}
.osc-bill button{position:relative;z-index:1;background:none;border:none;color:var(--muted);font-size:12px;font-weight:600;padding:7px 4px;cursor:pointer;border-radius:100px;transition:color .2s}
.osc-bill button.on{color:#fff}
.osc-bill button em{font-style:normal;color:#7cc5ff;font-size:11px}
.osc-value{margin-bottom:12px}
.osc-value-top{display:flex;justify-content:space-between;font-size:12px;color:var(--muted);margin-bottom:6px}
.osc-value-top b{color:#fff;font-family:var(--display)}
.osc-value-bar{height:6px;border-radius:var(--pill);background:var(--s2);overflow:hidden}
.osc-value-bar i{display:block;height:100%;width:16%;background:linear-gradient(90deg,#0099ff,#19c6c6);transition:width .5s var(--ease)}
.osc-lines{display:flex;flex-direction:column}
.osc-line{display:flex;justify-content:space-between;gap:10px;align-items:baseline;padding:8px 0;border-bottom:1px solid var(--hair-soft);font-size:13px;color:var(--muted);overflow:hidden}
.osc-line b{color:#fff;font-weight:500;white-space:nowrap}
.osc-line.incl b{color:#22c55e}
.osc-line.is-in{animation:osc-linein .42s var(--ease) both}
.osc-line.is-out{animation:osc-lineout .3s var(--ease) both}
@keyframes osc-linein{0%{opacity:0;transform:translateX(12px);max-height:0;padding-top:0;padding-bottom:0}100%{opacity:1;transform:none;max-height:64px}}
@keyframes osc-lineout{0%{opacity:1;max-height:64px}100%{opacity:0;max-height:0;padding:0;border:0;transform:translateX(-8px)}}
.osc-tot{display:flex;justify-content:space-between;align-items:baseline;padding-top:14px}
.osc-tot-l{color:var(--muted);font-size:13px}
.osc-tot-v{font-family:var(--display);font-size:32px;letter-spacing:-.04em}
.osc-tot-v i{font-style:normal;font-size:14px;color:var(--muted);-webkit-text-fill-color:var(--muted)}
.osc-tot-v.bump{animation:bump .35s var(--ease)}
.osc-once-row{display:flex;justify-content:space-between;font-size:13px;color:var(--muted);margin:4px 0 16px}
.osc-once-row b{color:#fff}
.osc-cart .btn{width:100%}
.osc-cart .btn-d{margin-top:8px}
/* delta volant + dock mobile */
.osc-fly{position:fixed;z-index:60;font-family:var(--display);font-weight:600;font-size:15px;color:var(--oc,#0099ff);pointer-events:none;animation:osc-fly .85s var(--ease) forwards}
@keyframes osc-fly{0%{opacity:0;transform:translate(0,0) scale(.8)}15%{opacity:1}100%{opacity:0;transform:translate(var(--dx,0),var(--dy,0)) scale(.55)}}
.osc-dock{position:fixed;left:12px;right:12px;bottom:0;z-index:40;display:none;align-items:center;gap:12px;justify-content:space-between;background:rgba(18,18,18,.92);backdrop-filter:blur(12px);border:1px solid var(--hair);border-bottom:none;border-radius:16px 16px 0 0;padding:12px 16px calc(12px + env(safe-area-inset-bottom));box-shadow:0 -14px 40px rgba(0,0,0,.5)}
.osc-dock-t small{display:block;font-size:10px;color:var(--muted);text-transform:uppercase;letter-spacing:.05em}
.osc-dock-t b{font-family:var(--display);font-size:20px;color:#fff;letter-spacing:-.03em}
.osc-dock-t b i{font-style:normal;font-size:12px;color:var(--muted)}
.osc-dock .btn{flex:0 0 auto}
@media(max-width:1080px){.osc{grid-template-columns:1fr 1fr;gap:16px}.osc-stage{grid-column:1/-1;order:-1}}
@media(max-width:920px){.osc{grid-template-columns:1fr}.osc-stage{grid-column:auto}.osc-cart{position:static}.osc-app{transform:none!important}.osc-dock{display:flex}}
@media(max-width:560px){.osc-body{grid-template-columns:92px 1fr}.osc-work{grid-template-columns:1fr}.osc-tot-v{font-size:28px}}
@media(hover:none){.osc-app{transform:none!important}}
@media(prefers-reduced-motion:reduce){
  .osc-tile,.osc-plan,.osc-opt,.osc-sw,.osc-sw::after,.osc-bill-knob,.osc-value-bar i{transition:none}
  .osc-tile.justlit,.osc-line.is-in,.osc-line.is-out,.osc-fly,.osc-tot-v.bump{animation:none!important}
  .osc-tile{opacity:1;filter:none;transform:none}
  .osc-tile:not(.lit){opacity:.5}
}
@supports not (color: color-mix(in srgb, red 50%, blue)){
  .osc-plan.on{background:rgba(0,153,255,.12);border-color:rgba(0,153,255,.55)}
  .osc-opt.on{background:rgba(0,153,255,.1);border-color:rgba(0,153,255,.45)}
  .osc-tile.lit{background:var(--s1);border-color:#2f4a63}
}

/* ---------- 57.5 · 3D « DU LOURD » (tarifs / projet) ---------- */
.scene3d{perspective:1400px;perspective-origin:50% 40%}
.depth{transform-style:preserve-3d}
.thero{position:relative;overflow:hidden}
.thero .thero-bg{position:absolute;inset:0;z-index:-2;overflow:hidden}
.thero .thero-bg video{width:100%;height:100%;object-fit:cover;opacity:.16;filter:saturate(.85)}
.thero .thero-bg::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(9,9,9,.72),rgba(9,9,9,.5) 40%,var(--canvas) 96%)}
.thero .aurora{position:absolute;inset:-20% 0 auto 0;height:120%;z-index:-1;background:radial-gradient(620px 360px at 22% 18%,rgba(0,153,255,.18),transparent 70%),radial-gradient(520px 300px at 82% 8%,rgba(106,76,245,.12),transparent 72%);filter:blur(8px);animation:auroraDrift 22s ease-in-out infinite alternate}
@keyframes auroraDrift{0%{transform:translate3d(-3%,0,0) scale(1)}100%{transform:translate3d(4%,2%,0) scale(1.08)}}
.thero .grid-floor{position:absolute;left:0;right:0;bottom:0;height:42%;z-index:-1;opacity:.45;background-image:linear-gradient(rgba(0,153,255,.10) 1px,transparent 1px),linear-gradient(90deg,rgba(0,153,255,.10) 1px,transparent 1px);background-size:60px 60px;-webkit-mask-image:linear-gradient(transparent,#000);mask-image:linear-gradient(transparent,#000);transform:perspective(560px) rotateX(60deg);transform-origin:bottom}
.signature3d{perspective:1500px;display:flex;justify-content:center}
.sig-obj{transform-style:preserve-3d;transition:transform .12s linear;will-change:transform;width:min(640px,90vw);border-radius:var(--r-big);position:relative}
.sig-face{border-radius:var(--r-big);overflow:hidden;border:1px solid var(--hair);background:var(--s1);box-shadow:0 50px 110px rgba(0,0,0,.6),0 0 70px rgba(0,153,255,.12)}
.sig-face img{width:100%;display:block}
.sig-edge{position:absolute;inset:0;border-radius:var(--r-big);transform:translateZ(-22px);background:linear-gradient(180deg,#101418,#0a0c0f);border:1px solid #0e1216}
.sig-badge{position:absolute;top:14px;left:14px;transform:translateZ(46px);display:inline-flex;align-items:center;gap:7px;background:rgba(0,153,255,.16);border:1px solid rgba(0,153,255,.4);color:#7cc5ff;border-radius:100px;padding:5px 13px;font-size:11.5px;font-weight:600}
.sig-spec{position:absolute;right:-10px;bottom:18px;transform:translateZ(60px);background:var(--s2);border:1px solid var(--hair);border-radius:14px;padding:10px 13px;box-shadow:0 18px 40px rgba(0,0,0,.5)}
.sig-spec b{font-family:var(--display);color:#fff;font-size:18px;display:block;letter-spacing:-.02em}
.sig-spec span{font-size:11px;color:var(--muted)}
.optcard{position:relative;overflow:hidden}
.optmedia{position:absolute;inset:0;z-index:0;opacity:0;transform:scale(1.06);transition:opacity .4s var(--ease),transform .6s var(--ease)}
.optmedia video,.optmedia img{width:100%;height:100%;object-fit:cover}
.optmedia::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(9,9,9,.62),rgba(9,9,9,.88))}
.optcard:hover .optmedia{opacity:.5;transform:scale(1)}
.optcard > *:not(.optmedia){position:relative;z-index:1}
.vidcard.tilt{transition:transform .3s var(--ease)}
.rdvband{position:relative;overflow:hidden}
.rdvband .rdv-bg{position:absolute;inset:0;z-index:0;overflow:hidden;border-radius:inherit}
.rdvband .rdv-bg video{width:100%;height:100%;object-fit:cover;opacity:.22}
.rdvband .rdv-bg::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(9,12,18,.78),rgba(9,9,9,.9)),radial-gradient(620px 280px at 50% 0%,rgba(0,153,255,.18),transparent 70%)}
.rdvband > *:not(.rdv-bg){position:relative;z-index:1}
@media(hover:none){
  .scene3d,.signature3d{perspective:none}
  .sig-obj{transform:none!important}
  .optcard:hover .optmedia{opacity:0}
}
@media(prefers-reduced-motion:reduce){
  .thero .aurora{animation:none}
  .sig-obj{transform:rotateY(-16deg) rotateX(4deg)!important;transition:none}
  .thero .thero-bg video,.rdvband .rdv-bg video{display:none}
}
/* fix mobile : bande partenaire (logo HPO large) qui débordait */
@media(max-width:560px){
  .partner .pp-lo{flex-wrap:wrap;justify-content:center;gap:14px}
  .partner .pp-lo img{height:22px;max-width:100%}
}

/* ============ V58 — conciergerie « calculateur » (barre 70/30 + typo) · Lab mobile ============ */
.cqrev .cqlbl{font-size:10.5px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:var(--muted);display:block}
.cqrev .cqbig{font-family:var(--display);font-weight:600;font-size:clamp(38px,4.8vw,52px);letter-spacing:-.05em;color:#fff;display:block;margin:7px 0 2px;line-height:1}
.cqrev .cqbig i{font-style:normal;font-size:15px;color:var(--muted)}
.cqbar.split{display:flex;gap:3px}
.cqbar.split i{height:100%;width:0;border-radius:100px;transition:width 1s var(--ease)}
.cqbar.split .cqo{background:linear-gradient(90deg,#6a4cf5,#8f7bff)}
.cqbar.split .cqy{background:linear-gradient(90deg,#0077cc,#39aaff)}
.cascade.played .cqbar.split .cqo{width:70%}
.cascade.played .cqbar.split .cqy{width:30%}
.cqsplit span{display:inline-flex;align-items:center;gap:6px}
.cqsplit .cqd{width:8px;height:8px;border-radius:50%;display:inline-block;flex:0 0 auto}
@media(prefers-reduced-motion:reduce){.cqbar.split i{transition:none}.cascade .cqbar.split .cqo{width:70%}.cascade .cqbar.split .cqy{width:30%}}
/* Lab mobile : aperçu capé + fondu (au lieu d'une longue capture verticale) */
@media(max-width:680px){
  .labshow .labshot .m{height:470px;width:100%;max-width:100%;margin:0;object-fit:cover;object-position:top center;-webkit-mask-image:linear-gradient(#000 76%,transparent);mask-image:linear-gradient(#000 76%,transparent)}
}

/* ============ V59 — sélecteur de langue (nav) + blog ============ */
.navpill .navlang{display:inline-grid;place-items:center;min-width:32px;height:30px;padding:0 8px;border-radius:100px;border:1px solid var(--hair);background:var(--s1);color:var(--muted);font-size:11px;font-weight:700;letter-spacing:.05em;text-decoration:none;transition:.2s var(--ease);flex:0 0 auto}
.navpill .navlang:hover{color:#fff;border-color:#3a3a3a;background:var(--s2)}
/* article de blog : confort de lecture */
.post{max-width:760px;margin:0 auto}
.post h1{font-family:var(--display);font-weight:600;letter-spacing:-.035em;font-size:clamp(30px,4.6vw,46px);line-height:1.05;margin:10px 0 14px}
.post h2{font-family:var(--display);font-weight:600;letter-spacing:-.025em;font-size:clamp(22px,3vw,30px);margin:34px 0 12px}
.post h3{font-size:19px;font-weight:600;margin:24px 0 8px;color:#fff}
.post p,.post li{color:var(--muted);font-size:16px;line-height:1.7}
.post p{margin:0 0 14px}
.post ul,.post ol{margin:0 0 18px;padding-left:22px;display:grid;gap:7px}
.post a{color:#7cc4ff;text-decoration:underline;text-underline-offset:2px}
.post strong,.post b{color:#fff;font-weight:600}
.post .lead{font-size:18px;color:#cfcfcf}
.bloglist{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
@media(max-width:880px){.bloglist{grid-template-columns:1fr}}
.bcardlink{display:flex;flex-direction:column;gap:8px;background:var(--s1);border:1px solid var(--hair);border-radius:var(--r-card);padding:24px;transition:transform .25s var(--ease),border-color .25s}
.bcardlink:hover{transform:translateY(-4px);border-color:#3a3a3a}
.bcardlink .bk{font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:#7cc4ff}
.bcardlink h3{font-family:var(--display);font-weight:600;letter-spacing:-.02em;font-size:19px;color:#fff;line-height:1.2}
.bcardlink p{font-size:13.5px;color:var(--muted);line-height:1.55;margin:0}
.bcardlink .more{margin-top:auto;font-size:13px;color:#fff;font-weight:600}

/* ============ V56 — home : ouverture hero, conciergerie (DA bleu), communauté, vraie plateforme Lab, carte site ============ */
/* --- Hero : poster (paint instantané) + ouverture cinématique --- */
.hero-open .hero-bg video{animation:heroZoom 2.2s var(--ease) both}
.hero-reveal{position:absolute;inset:0;z-index:6;background:var(--canvas);pointer-events:none;overflow:hidden;animation:heroCurtain .9s var(--ease) both}
.hero-reveal::before{content:"";position:absolute;top:-10%;bottom:-10%;left:-50%;width:42%;background:linear-gradient(100deg,transparent,rgba(0,153,255,.18),transparent);filter:blur(10px);transform:skewX(-12deg);animation:heroSweep 1.15s var(--ease) .12s both}
@keyframes heroZoom{from{transform:scale(1.34);opacity:0}to{transform:scale(1.12);opacity:.5}}
@keyframes heroCurtain{0%{opacity:1}100%{opacity:0}}
@keyframes heroSweep{0%{left:-50%;opacity:0}28%{opacity:1}100%{left:120%;opacity:0}}

/* --- Conciergerie : icônes propres, DA bleu (plus de vert) --- */
.cqrow .ci svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.cqrev{background:radial-gradient(360px 200px at 15% 0%,rgba(0,153,255,.13),transparent),var(--s2);border-color:rgba(0,153,255,.32)}
.cqrev b{color:#fff}
.cqbar i{background:linear-gradient(90deg,#0077cc,#39aaff)}

/* --- Bento Communauté : gros logos Insta + TikTok --- */
.bcomm .bsocials{display:flex;gap:10px;flex-wrap:wrap;margin-top:16px}
.bcomm .bsoc{display:inline-flex;align-items:center;gap:10px;background:var(--s2);border:1px solid var(--hair);border-radius:100px;padding:9px 16px;font-size:13px;font-weight:600;color:#fff;transition:.2s}
.bcomm .bsoc:hover{background:var(--s3);border-color:rgba(255,255,255,.22);transform:translateY(-1px)}
.bcomm .bsoc img{height:26px;width:auto;filter:brightness(0) invert(1)}

/* --- Photo marquee : filmstrip uniforme, mobile + pc --- */
.pmarquee img{height:220px;width:330px;object-fit:cover}
@media(max-width:680px){.pmarquee img{height:148px;width:222px}}

/* --- Espace formation : vraie plateforme Lab --- */
.labshow{position:relative;max-width:1080px;margin:0 auto}
.labshow .browser{box-shadow:0 60px 130px rgba(0,0,0,.6),0 0 90px rgba(106,76,245,.14);border-color:rgba(106,76,245,.35)}
.labshow .browser .btop .bvisit.pl{margin-left:auto;display:inline-flex;align-items:center;gap:6px;font-size:11px;font-weight:600;color:#7be3a3}
.labshot{position:relative;overflow:hidden;background:#0a0a0e}
.labshow .labshot img{display:block;width:100%}
.labshow .labshot .m{display:none}
.labshow.in .labshot img{animation:labreveal 1s var(--ease) both}
@keyframes labreveal{from{transform:scale(1.045);opacity:.35}to{transform:scale(1);opacity:1}}
@media(max-width:680px){.labshow .labshot .d{display:none}.labshow .labshot .m{display:block;max-width:420px;margin:0 auto}}

/* --- Notre site web : belle carte cliquable --- */
.sitecard{display:block;position:relative;max-width:900px;margin:0 auto;border-radius:18px;transition:transform .3s var(--ease)}
.sitecard:hover{transform:translateY(-4px)}
.sitecard .browser{transition:box-shadow .3s var(--ease)}
.sitecard:hover .browser{box-shadow:0 60px 130px rgba(0,0,0,.6),0 0 80px rgba(0,153,255,.18)}
.sitecard .bvisit{margin-left:auto;background:rgba(0,153,255,.16);border:1px solid rgba(0,153,255,.4);color:#7cc5ff;border-radius:100px;padding:4px 13px;font-size:11.5px;font-weight:600;white-space:nowrap}
.sitehero{aspect-ratio:16/9.5;overflow:hidden;background:#0a0a0a}
.sitehero img{width:100%;height:100%;object-fit:cover;object-position:top center}
.sitefeats{display:flex;justify-content:center;gap:10px;flex-wrap:wrap;margin-top:18px}
.sitefeats span{display:inline-flex;align-items:center;gap:7px;background:var(--s1);border:1px solid var(--hair);border-radius:100px;padding:8px 15px;font-size:12.5px;color:var(--muted)}
.sitefeats span b{color:#fff;font-weight:600}
@media(max-width:680px){.sitehero{aspect-ratio:3/4}}

@media(prefers-reduced-motion:reduce){
  .hero-open .hero-bg video{animation:none;transform:scale(1.12);opacity:.5}
  .hero-reveal{display:none}
  .labshow.in .labshot img{animation:none}
}

/* ============ V61 — cartes abonnement : effet métallique (sweep clippé, sans rogner le badge) ============ */
.fprice{box-shadow:inset 0 1px 0 rgba(255,255,255,.06)}
.fprice::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;z-index:3;background:linear-gradient(115deg,transparent 38%,rgba(255,255,255,.14) 47%,rgba(255,255,255,.05) 52%,transparent 62%);background-size:250% 100%;background-position:210% 0;opacity:0}
.fprices.cascade.played .fprice::after{animation:metalsweep 2.2s var(--ease) .5s 1}
.fprice:hover::after{animation:metalsweep 1s var(--ease) 1}
.fprice:hover{box-shadow:inset 0 1px 0 rgba(255,255,255,.12),0 24px 60px rgba(0,0,0,.45)}
@keyframes metalsweep{0%{background-position:210% 0;opacity:0}12%{opacity:1}88%{opacity:1}100%{background-position:-70% 0;opacity:0}}
@media(prefers-reduced-motion:reduce){.fprices.cascade.played .fprice::after,.fprice:hover::after{animation:none;opacity:0}}

/* ============ V62 — section Nos intégrations / Connectivité ============ */
.intgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.intcard{display:flex;flex-direction:column;align-items:center;text-align:center;gap:7px;background:radial-gradient(220px 120px at 50% 0%,rgba(255,255,255,.04),transparent 70%),var(--s1);border:1px solid var(--hair);border-radius:18px;padding:26px 16px 22px;transition:transform .25s var(--ease),border-color .25s,box-shadow .25s}
.intcard:hover{transform:translateY(-4px);border-color:#3a3a3a;box-shadow:0 18px 44px rgba(0,0,0,.4)}
.intcard .intlogo{height:40px;display:grid;place-items:center;margin-bottom:5px}
.intcard .intlogo svg{height:34px;width:auto;display:block}
.intcard .intlogo img{height:30px;width:auto;display:block}
.intcard .intword{font-family:var(--display);font-weight:600;font-size:22px;letter-spacing:-.02em;color:#fff}
.intcard b{font-size:14px;color:#fff;font-family:var(--display);font-weight:500;letter-spacing:-.01em}
.intcard small{font-size:11.5px;color:var(--muted);line-height:1.4}
@media(max-width:880px){.intgrid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:380px){.intgrid{grid-template-columns:1fr 1fr;gap:10px}.intcard{padding:20px 10px 18px}}

/* ============ V63 — images blog (vignette hub + hero article) ============ */
.bcardlink{overflow:hidden}
.bthumb{display:block;margin:-24px -24px 4px;aspect-ratio:16/9;overflow:hidden;background:#0a0a0a}
.bthumb img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .45s var(--ease)}
.bcardlink:hover .bthumb img{transform:scale(1.05)}
.posthero{margin:0 auto 8px}
.postimg{width:100%;display:block;border-radius:18px;border:1px solid var(--hair);box-shadow:0 30px 70px rgba(0,0,0,.45)}
@media(prefers-reduced-motion:reduce){.bcardlink:hover .bthumb img{transform:none}}

/* ============ V64 — orbite intégrations · programme fidélité · emblèmes formules ============ */
.vh{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* ---- Orbite connectivité : tout converge dans l'OS ---- */
.orbit{position:relative;width:min(540px,84vw);margin:40px auto 4px;--r:198px}
.orbit::before{content:"";display:block;padding-top:100%}
.orbit>*{position:absolute}
.orbit .orbit-rail{top:50%;left:50%;width:calc(var(--r) * 2);height:calc(var(--r) * 2);transform:translate(-50%,-50%);border-radius:50%;border:1px solid rgba(255,255,255,.055);z-index:0}
.orbit .orbit-rail.r2{width:calc(var(--r) * 2 - 60px);height:calc(var(--r) * 2 - 60px);border-style:dashed;border-color:rgba(255,255,255,.035)}
.orbit .orbit-core{top:50%;left:50%;width:118px;height:118px;transform:translate(-50%,-50%);border-radius:24px;display:grid;place-items:center;background:radial-gradient(120% 120% at 30% 18%,#1a1a1a,#0d0d0d);border:1px solid rgba(0,153,255,.32);box-shadow:0 0 30px rgba(0,153,255,.16),inset 0 1px 0 rgba(255,255,255,.07);z-index:6}
.orbit .orbit-core img{width:74px;height:auto;position:relative;z-index:2}
.orbit .orbit-ringpulse{position:absolute;inset:0;border-radius:24px;border:1px solid rgba(0,153,255,.34);animation:corepulse 3.6s var(--ease) infinite}
.orbit .orbit-ringpulse.p2{animation-delay:1.8s}
@keyframes corepulse{0%{transform:scale(1);opacity:.4}100%{transform:scale(2);opacity:0}}
.orbit .orbit-node{top:50%;left:50%;width:0;height:0;transform:rotate(var(--a)) translate(0,calc(-1 * var(--r)))}
.orbit .spoke{position:absolute;left:50%;top:0;width:1.5px;height:var(--r);transform:translateX(-50%);background:linear-gradient(to bottom,rgba(0,153,255,0),rgba(0,153,255,.22) 60%,rgba(0,153,255,.42));z-index:1}
.orbit .spoke::after{content:"";position:absolute;left:50%;top:0;width:5px;height:5px;border-radius:50%;transform:translate(-50%,-50%);background:#3ab0ff;box-shadow:0 0 6px rgba(0,153,255,.7);animation:flowin 3s linear infinite;animation-delay:var(--d)}
@keyframes flowin{0%{top:0;opacity:0}16%{opacity:1}84%{opacity:1}100%{top:100%;opacity:0}}
.orbit .oni{position:absolute;left:50%;top:0;transform:translate(-50%,-50%) rotate(calc(-1 * var(--a)));display:flex;flex-direction:column;align-items:center;gap:8px;z-index:4}
.orbit .onl{width:58px;height:58px;border-radius:15px;display:grid;place-items:center;background:#101010;border:1px solid #2a2a2a;box-shadow:0 6px 16px rgba(0,0,0,.5),inset 0 1px 0 rgba(255,255,255,.04);animation:onfloat 6.4s var(--ease) infinite;animation-delay:var(--d)}
.orbit .onl img{max-height:30px;max-width:44px;width:auto;height:auto;object-fit:contain;display:block}
.orbit .onl img.inv{filter:brightness(0) invert(1)}
.orbit .onl svg{height:30px;width:auto;display:block}
.orbit .onl .ow{font-family:var(--display);font-weight:600;font-size:15px;letter-spacing:-.01em;color:#fff}
.orbit .onn{font-size:11px;font-weight:600;color:#9aa3ad;font-family:var(--body);letter-spacing:.01em}
@keyframes onfloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-5px)}}
@media(max-width:560px){
  .orbit{--r:122px;width:90vw;margin-top:30px}
  .orbit .orbit-core{width:94px;height:94px;border-radius:20px}
  .orbit .orbit-core img{width:58px}
  .orbit .onl{width:44px;height:44px;border-radius:12px}
  .orbit .onl img{height:21px}.orbit .onl svg{height:22px}.orbit .onl .ow{font-size:12px}
  .orbit .onn{display:none}
}
@media(prefers-reduced-motion:reduce){.orbit .orbit-ringpulse,.orbit .spoke::after,.orbit .onl{animation:none}}

/* ---- Programme fidélité (remplace l'offre 30 €) ---- */
.loyalty{background:radial-gradient(440px 260px at 82% 0%,rgba(245,180,60,.12),transparent),var(--s1);border:1px solid rgba(245,180,60,.30)}
.loyalty .loy-h{display:flex;align-items:center;gap:11px}
.loyalty .loy-ic{width:34px;height:34px;border-radius:10px;display:grid;place-items:center;background:rgba(245,180,60,.16);border:1px solid rgba(245,180,60,.42);color:#f5b43c;font-size:16px;flex:0 0 auto}
.loyalty h3{font-size:20px;letter-spacing:-.03em}
.loybar{position:relative;margin-top:auto;padding:24px 6px 10px;display:flex;justify-content:space-between}
.loybar::before{content:"";position:absolute;left:14px;right:14px;top:14px;height:3px;border-radius:3px;background:#232323}
.loyfill{position:absolute;left:14px;top:14px;height:3px;border-radius:3px;width:9%;background:linear-gradient(90deg,#cd7f32,#d9d9d9,#f5b43c);box-shadow:0 0 12px rgba(245,180,60,.55)}
.loytier{position:relative;display:flex;flex-direction:column;align-items:center;gap:9px;font-size:11px;color:var(--muted);font-weight:600;letter-spacing:.02em;z-index:2}
.loytier i{width:13px;height:13px;border-radius:50%;background:#232323;border:2px solid #3a3a3a;transition:background .4s var(--ease),border-color .4s var(--ease),box-shadow .4s var(--ease)}
.loytier.t1 i{background:#cd7f32;border-color:#cd7f32}
.loyalty.in .loyfill{animation:loyfill 1.6s var(--ease) .3s forwards}
@keyframes loyfill{from{width:9%}to{width:72%}}
.loyalty.in .loytier.t2 i{background:#d9d9d9;border-color:#d9d9d9;transition-delay:.75s}
.loyalty.in .loytier.t3 i{animation:loyor 2.4s var(--ease) 1.6s infinite}
@keyframes loyor{0%,100%{box-shadow:0 0 0 0 rgba(245,180,60,0)}50%{box-shadow:0 0 15px 2px rgba(245,180,60,.6)}}
.loychips{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px}
.loychips span{font-size:11.5px;color:#f5cf86;background:rgba(245,180,60,.12);border:1px solid rgba(245,180,60,.3);border-radius:100px;padding:5px 11px;font-weight:600}
@media(prefers-reduced-motion:reduce){.loyalty.in .loyfill{animation:none;width:72%}.loyalty.in .loytier.t3 i{animation:none}}

/* ---- Emblèmes colorés par formule + surbrillance animée ---- */
.fprice .temblem{position:relative;width:46px;height:46px;border-radius:14px;display:grid;place-items:center;margin-bottom:16px;background:color-mix(in srgb,var(--tc,#0099ff) 15%,#0b0b0b);border:1px solid color-mix(in srgb,var(--tc,#0099ff) 42%,transparent);overflow:hidden;animation:emblemglow 3.6s var(--ease) infinite}
.fprice:nth-child(2) .temblem{animation-delay:.5s}.fprice:nth-child(3) .temblem{animation-delay:1s}
.fprice .temblem svg{position:relative;z-index:3;width:24px;height:24px;stroke:var(--tc,#0099ff);fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.fprice .temblem::before{content:"";position:absolute;inset:-45%;z-index:1;background:conic-gradient(from 0deg,transparent 0deg,color-mix(in srgb,var(--tc,#0099ff) 60%,transparent) 28deg,transparent 70deg,transparent 360deg);animation:emblemspin 4.6s linear infinite}
.fprice .temblem::after{content:"";position:absolute;inset:1.5px;z-index:2;border-radius:12px;background:color-mix(in srgb,var(--tc,#0099ff) 14%,#0b0b0b)}
@keyframes emblemspin{to{transform:rotate(360deg)}}
@keyframes emblemglow{0%,100%{box-shadow:0 0 0 0 color-mix(in srgb,var(--tc,#0099ff) 0%,transparent)}50%{box-shadow:0 0 18px 0 color-mix(in srgb,var(--tc,#0099ff) 40%,transparent)}}
@supports not (background:conic-gradient(from 0deg,red,blue)){.fprice .temblem::before{display:none}.fprice .temblem::after{display:none}}
@media(prefers-reduced-motion:reduce){.fprice .temblem,.fprice .temblem::before{animation:none}}

/* ============ V65 — panneau intégrations produit « Connecté ✓ » (remplace l'orbite) ============ */
.intpanel{max-width:560px;margin:34px auto 6px;background:linear-gradient(180deg,#161616,#0f0f0f);border:1px solid var(--hair);border-radius:18px;overflow:hidden;box-shadow:0 30px 80px rgba(0,0,0,.5),inset 0 1px 0 rgba(255,255,255,.05)}
.intpanel .ipbar{display:flex;align-items:center;gap:7px;padding:13px 16px;border-bottom:1px solid var(--hair);background:rgba(255,255,255,.02)}
.intpanel .ipbar .ipd{width:10px;height:10px;border-radius:50%;background:#333;flex:0 0 auto}
.intpanel .ipbar .ipd.r{background:#ff5f57}.intpanel .ipbar .ipd.y{background:#febc2e}.intpanel .ipbar .ipd.g{background:#28c840}
.intpanel .ipbar .iptitle{margin-left:9px;display:inline-flex;align-items:center;gap:7px;font-family:var(--display);font-weight:500;font-size:13.5px;color:#cdd4db;letter-spacing:-.01em}
.intpanel .ipbar .iptitle img{height:13px}
.intpanel .ipbar .ipcount{margin-left:auto;font-size:11px;color:var(--muted);font-family:"Geist Mono",ui-monospace,monospace}
.intpanel .ipbody{padding:4px 0}
.iprow{display:flex;align-items:center;gap:13px;padding:13px 18px;position:relative;border-bottom:1px solid var(--hair-soft)}
.iprow:last-child{border-bottom:none}
.iprow::before{content:"";position:absolute;left:0;top:0;bottom:0;width:2px;background:var(--blue,#0099ff);transform:scaleY(0);transform-origin:top}
.iprow .iplogo{width:38px;height:38px;border-radius:10px;display:grid;place-items:center;background:#0c0c0c;border:1px solid var(--hair);flex:0 0 auto}
.iprow .iplogo img{height:20px;width:auto;display:block}
.iprow .iplogo svg{height:22px;width:auto;display:block}
.iprow .iplogo .ow{font-family:var(--display);font-weight:600;font-size:12px;color:#fff;letter-spacing:-.02em}
.iprow .ipinfo{flex:1 1 auto;min-width:0}
.intpanel .ipbar .iptitle{min-width:0;overflow:hidden}
.iprow .ipinfo b{display:block;font-family:var(--display);font-weight:500;font-size:14.5px;color:#fff;letter-spacing:-.01em}
.iprow .ipinfo small{display:block;font-size:12px;color:var(--muted)}
.ipstatus{flex:0 0 auto;display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:600;padding:5px 10px 5px 11px;border-radius:100px;border:1px solid var(--hair);color:var(--muted);background:#0c0c0c;white-space:nowrap}
.ipstatus .chk{width:14px;height:14px;border-radius:50%;display:grid;place-items:center;background:#22c55e;color:#06210f;font-size:9px;font-weight:900;transform:scale(.3);opacity:0}
/* séquence de connexion au reveal */
.intpanel.in .iprow::before{transform:scaleY(1);transition:transform .45s var(--ease);transition-delay:var(--d)}
.intpanel.in .ipstatus{color:#7ee0a3;border-color:rgba(34,197,94,.42);background:rgba(34,197,94,.10);transition:color .4s,border-color .4s,background .4s;transition-delay:var(--d)}
.intpanel.in .ipstatus .chk{opacity:1;transform:scale(1);transition:opacity .35s var(--ease),transform .35s var(--ease);transition-delay:calc(var(--d) + .12s)}
.intpanel.in .iprow{animation:iprowin .55s var(--ease) both;animation-delay:var(--d)}
@keyframes iprowin{0%{background:rgba(0,153,255,.09)}100%{background:transparent}}
@media(max-width:560px){.intpanel{margin-top:24px}.intpanel .ipbar .ipcount{display:none}.intpanel .ipbar .iptitle{font-size:12.5px;white-space:nowrap;text-overflow:ellipsis}.iprow{padding:12px 14px;gap:10px}.iprow .iplogo{width:34px;height:34px}.iprow .ipinfo small{font-size:11px}.ipstatus{font-size:11px;padding:4px 7px}.ipstatus .ipst-t{display:none}}
@media(prefers-reduced-motion:reduce){.intpanel.in .iprow{animation:none}.intpanel.in .iprow::before,.intpanel.in .ipstatus,.intpanel.in .ipstatus .chk{transition:none}}

/* ============ V66 — tableau comparatif Corsiva OS vs autres logiciels ============ */
.cmpwrap{overflow-x:auto;border:1px solid var(--hair);border-radius:16px;margin-top:8px;-webkit-overflow-scrolling:touch}
.cmptable{width:100%;border-collapse:collapse;min-width:720px;font-size:13.5px}
.cmptable th,.cmptable td{padding:13px 16px;text-align:left;border-bottom:1px solid var(--hair-soft);vertical-align:middle}
.cmptable thead th{font-family:var(--display);font-weight:500;color:#fff;font-size:14px;letter-spacing:-.01em;background:var(--s2)}
.cmptable thead th.cmp-us{color:#fff;background:rgba(0,153,255,.14);border-bottom-color:rgba(0,153,255,.4)}
.cmptable tbody th{font-weight:500;color:#cdd4db;font-family:var(--body)}
.cmptable td{color:var(--muted)}
.cmptable td.cmp-us{color:#fff;background:rgba(0,153,255,.06);font-weight:500}
.cmptable .yes{color:#22c55e;font-weight:700}
.cmptable .na{color:#666}
.cmptable .bad{color:#e0867f}
.cmptable td.cmp-them{background:rgba(239,68,68,.04)}
.cmptable thead th.cmp-them{color:#cdd4db}
.cmptable tbody tr:last-child td,.cmptable tbody tr:last-child th{border-bottom:none}

/* ============ V67 — menu déroulant Options (nav) + chips page /options ============ */
.navdrop{position:relative;display:inline-flex;align-items:center}
.navdrop>.navdrop-t{display:inline-flex;align-items:center;gap:5px}
.navdrop>.navdrop-t svg{width:9px;height:6px;fill:none;stroke:currentColor;stroke-width:1.7;opacity:.65;transition:transform .2s var(--ease)}
.navdrop:hover>.navdrop-t svg{transform:rotate(180deg)}
.navdrop-menu{position:absolute;top:100%;left:50%;transform:translateX(-50%) translateY(4px);min-width:216px;background:rgba(17,17,17,.97);backdrop-filter:blur(14px);border:1px solid var(--hair);border-radius:14px;padding:7px;display:flex;flex-direction:column;gap:2px;opacity:0;visibility:hidden;transition:opacity .18s var(--ease),transform .18s var(--ease);box-shadow:0 24px 60px rgba(0,0,0,.55);z-index:60}
.navdrop:hover .navdrop-menu,.navdrop:focus-within .navdrop-menu{opacity:1;visibility:visible;transform:translateX(-50%) translateY(9px)}
.navdrop-menu a{padding:9px 12px;border-radius:9px;font-size:13.5px;color:var(--muted);white-space:nowrap;background:none}
.navdrop-menu a:hover{background:var(--s1);color:#fff}
nav .links a .navico{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;vertical-align:-2.5px;margin-right:5px;opacity:.78}
nav .links a:hover .navico,nav .links a.on .navico{opacity:1}
/* chips d'ancrage sur /options */
.optchip{display:inline-flex;align-items:center;padding:9px 15px;border-radius:100px;border:1px solid var(--hair);background:var(--s1);color:#cdd4db;font-size:13px;font-weight:500;transition:transform .2s var(--ease),border-color .2s,color .2s}
.optchip:hover{border-color:#3a3a3a;color:#fff;transform:translateY(-2px)}
.oincl{font-size:12px;font-weight:600;color:#7cc4ff;background:rgba(0,153,255,.12);border:1px solid rgba(0,153,255,.32);border-radius:100px;padding:6px 13px}
@media(max-width:900px){
  .navdrop{display:block;width:100%}
  .navdrop>.navdrop-t{width:100%}
  .navdrop>.navdrop-t svg{margin-left:auto}
  .navdrop-menu{position:static;transform:none!important;opacity:1;visibility:visible;min-width:0;background:transparent;border:none;backdrop-filter:none;box-shadow:none;padding:2px 0 4px 14px;gap:0}
  .navdrop-menu a{padding:7px 10px;font-size:13px}
}

/* ============ V68 — composants éditoriaux articles (TL;DR · sommaire · encadré · FAQ) ============ */
.artbody{max-width:760px}
.tldr{max-width:760px;margin:22px auto 0;background:radial-gradient(420px 200px at 80% 0%,rgba(0,153,255,.10),transparent),var(--s1);border:1px solid rgba(0,153,255,.28);border-radius:16px;padding:20px 22px}
.tldr .tldr-h{display:inline-flex;align-items:center;gap:8px;font-family:"Quicksand",ui-rounded,system-ui,sans-serif;font-weight:600;text-transform:uppercase;letter-spacing:.1em;font-size:12px;color:#7cc4ff;margin-bottom:9px}
.tldr .tldr-h::before{content:"";width:7px;height:7px;border-radius:50%;background:#0099ff;box-shadow:0 0 9px rgba(0,153,255,.7)}
.tldr p{color:#dfe4ea;font-size:15px;line-height:1.6;margin:0}
.toc{max-width:760px;margin:22px auto 0;background:var(--s1);border:1px solid var(--hair);border-radius:16px;padding:18px 22px}
.toc b{display:block;font-family:var(--display);font-weight:500;font-size:14px;color:#fff;letter-spacing:-.01em;margin-bottom:10px}
.toc ol{margin:0;padding:0;list-style:none;counter-reset:toc;display:grid;gap:7px}
.toc li{counter-increment:toc}
.toc a{display:flex;gap:10px;align-items:baseline;color:var(--muted);font-size:14px;transition:color .2s}
.toc a::before{content:counter(toc,decimal-leading-zero);font-family:"Geist Mono",monospace;font-size:11px;color:#0099ff;flex:0 0 auto}
.toc a:hover{color:#fff}
.keybox{max-width:760px;margin:22px auto;background:var(--s1);border:1px solid var(--hair);border-left:3px solid #0099ff;border-radius:12px;padding:16px 20px;display:flex;gap:13px;align-items:flex-start}
.keybox .kb-i{flex:0 0 auto;width:26px;height:26px;border-radius:8px;display:grid;place-items:center;background:rgba(0,153,255,.14);border:1px solid rgba(0,153,255,.34);color:#7cc4ff;font-weight:800;font-size:14px}
.keybox p{margin:0;color:#dfe4ea;font-size:14.5px;line-height:1.6}
.keybox b{color:#fff}
.faqlist{max-width:760px;margin:8px auto 0;display:flex;flex-direction:column;gap:10px}
.faqlist details{background:var(--s1);border:1px solid var(--hair);border-radius:13px;padding:0 18px;transition:border-color .2s}
.faqlist details[open]{border-color:#3a3a3a}
.faqlist summary{list-style:none;cursor:pointer;padding:15px 0;font-family:var(--display);font-weight:500;font-size:15.5px;color:#fff;letter-spacing:-.01em;display:flex;justify-content:space-between;align-items:center;gap:14px}
.faqlist summary::-webkit-details-marker{display:none}
.faqlist summary::after{content:"+";font-family:var(--body);font-weight:400;font-size:22px;color:#0099ff;flex:0 0 auto;transition:transform .25s var(--ease)}
.faqlist details[open] summary::after{transform:rotate(45deg)}
.faqlist details > p{margin:0 0 16px;color:var(--muted);font-size:14.5px;line-height:1.65}
@media(prefers-reduced-motion:reduce){.faqlist summary::after{transition:none}}

article section[id]{scroll-margin-top:88px}

/* ============ V69 — carte certification NF525 (clean : surface + hairline, zéro halo bleu) ============ */
.nfcard{background:var(--s1);border:1px solid var(--hair);border-radius:20px;padding:26px;display:flex;flex-direction:column;gap:14px}
.nfcard .nf-top{display:flex;align-items:center;gap:12px}
.nfcard .nf-seal{flex:0 0 auto;width:70px;height:70px;border-radius:15px;display:grid;place-items:center;background:#fff;border:1px solid var(--hair);padding:8px;box-shadow:0 6px 18px rgba(0,0,0,.35)}
.nfcard .nf-seal img{width:100%;height:100%;object-fit:contain;display:block}
.nfcard .nf-badge{font-family:"Geist Mono",ui-monospace,monospace;font-size:11px;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:#cdd4db;border:1px solid var(--hair);border-radius:100px;padding:6px 13px}
.nfcard h3{font-family:var(--display);font-size:21px;font-weight:500;letter-spacing:-.03em;color:#fff;margin:0}
.nfcard > p{color:var(--muted);font-size:14px;line-height:1.6;margin:0}
.nfcard .nf-pillars{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin-top:auto}
.nfcard .nf-p{display:flex;align-items:center;gap:9px;background:var(--s2);border:1px solid var(--hair);border-radius:11px;padding:11px 13px;font-size:13px;font-weight:500;color:#fff}
.nfcard .nf-p svg{flex:0 0 auto;width:15px;height:15px;fill:none;stroke:#34d27b;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
@media(max-width:480px){.nfcard .nf-pillars{grid-template-columns:1fr}}

/* ============ V70 — section Avis Google : flow animé + carte résultat (zéro halo) ============ */
.revflow{background:var(--s1);border:1px solid var(--hair);border-radius:20px;padding:28px}
.rfsteps{position:relative;display:flex;flex-direction:column;gap:22px}
.rfsteps .rfline{position:absolute;left:18px;top:16px;bottom:16px;width:2px;background:var(--hair);overflow:hidden}
.rfsteps .rfline::after{content:"";position:absolute;inset:0 0 auto 0;height:0;background:linear-gradient(#0099ff,#39aaff)}
.revflow.in .rfsteps .rfline::after{animation:rffill 1.7s var(--ease) .3s forwards}
@keyframes rffill{to{height:100%}}
.rfstep{position:relative;display:flex;gap:15px;align-items:flex-start;opacity:0}
.revflow.in .rfstep{animation:rfin .55s var(--ease) both}
.revflow.in .rfstep:nth-child(2){animation-delay:.25s}
.revflow.in .rfstep:nth-child(3){animation-delay:.7s}
.revflow.in .rfstep:nth-child(4){animation-delay:1.15s}
@keyframes rfin{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
.rfnum{flex:0 0 auto;position:relative;z-index:1;width:38px;height:38px;border-radius:11px;display:grid;place-items:center;background:var(--s2);border:1px solid var(--hair);color:var(--muted);font-family:var(--display);font-weight:600;font-size:15px;transition:color .45s var(--ease),border-color .45s var(--ease)}
.revflow.in .rfnum{color:#fff;border-color:#0099ff}
.revflow.in .rfstep:nth-child(2) .rfnum{transition-delay:.45s}
.revflow.in .rfstep:nth-child(3) .rfnum{transition-delay:.9s}
.revflow.in .rfstep:nth-child(4) .rfnum{transition-delay:1.35s}
.rftx b{display:block;font-family:var(--display);font-weight:500;font-size:15.5px;color:#fff;letter-spacing:-.01em}
.rftx small{display:block;font-size:13px;color:var(--muted);margin-top:3px}
.rcard{background:var(--s1);border:1px solid var(--hair);border-radius:20px;padding:28px;display:flex;flex-direction:column;justify-content:center;gap:18px}
.rcard-notif{display:flex;align-items:center;gap:12px;background:var(--s2);border:1px solid var(--hair);border-radius:14px;padding:14px 16px;opacity:0}
.rcard.in .rcard-notif{animation:rfin .6s var(--ease) .4s both}
.rcard-notif img{height:24px;flex:0 0 auto}
.rcard-notif b{display:block;font-family:var(--display);font-weight:500;font-size:14.5px;color:#fff}
.rcard-notif small{font-size:12.5px;color:var(--muted)}
.rcard-notif .rcard-chk{margin-left:auto;flex:0 0 auto;width:24px;height:24px;border-radius:50%;background:#22c55e;color:#06210f;display:grid;place-items:center;font-weight:900;font-size:12px;transform:scale(0)}
.rcard.in .rcard-notif .rcard-chk{animation:rfpop .45s var(--ease) 1s both}
@keyframes rfpop{0%{transform:scale(0)}70%{transform:scale(1.25)}100%{transform:scale(1)}}
.rcard-stars{display:flex;gap:8px;font-size:34px}
.rcard-stars i{font-style:normal;color:#2a2a2a}
.rcard.in .rcard-stars i{animation:rfstar .45s var(--ease) both}
.rcard.in .rcard-stars i:nth-child(1){animation-delay:1.15s}
.rcard.in .rcard-stars i:nth-child(2){animation-delay:1.3s}
.rcard.in .rcard-stars i:nth-child(3){animation-delay:1.45s}
.rcard.in .rcard-stars i:nth-child(4){animation-delay:1.6s}
.rcard.in .rcard-stars i:nth-child(5){animation-delay:1.75s}
@keyframes rfstar{from{color:#2a2a2a;transform:scale(.6)}60%{transform:scale(1.25)}to{color:#f5b43c;transform:scale(1)}}
.rcard-big{font-family:var(--display);font-weight:600;font-size:clamp(34px,4vw,46px);letter-spacing:-.045em;color:#fff;line-height:1}
.rcard-big em{font-style:normal;font-size:15px;color:#39aaff;letter-spacing:0}
.rcard-sub{font-size:13px;color:var(--muted)}
@media(prefers-reduced-motion:reduce){.revflow.in .rfsteps .rfline::after{height:100%;animation:none}.revflow.in .rfstep,.rcard.in .rcard-notif{opacity:1;animation:none}.rcard.in .rcard-stars i{color:#f5b43c;animation:none}.rcard.in .rcard-notif .rcard-chk{transform:scale(1);animation:none}}

/* ============ V71 — comparatif : 4 points clés (couleur + anim) ============ */
.cmp4{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:18px}
.cmp4card{background:var(--s1);border:1px solid var(--hair);border-radius:16px;padding:20px;position:relative;overflow:hidden;transition:transform .25s var(--ease),border-color .25s}
.cmp4card::before{content:"";position:absolute;top:0;left:0;right:0;height:2px;background:var(--cc,#0099ff)}
.cmp4card:hover{transform:translateY(-4px);border-color:color-mix(in srgb,var(--cc,#0099ff) 45%,var(--hair))}
.cmp4card .c4i{width:38px;height:38px;border-radius:11px;display:grid;place-items:center;background:color-mix(in srgb,var(--cc,#0099ff) 13%,transparent);border:1px solid color-mix(in srgb,var(--cc,#0099ff) 36%,transparent);margin-bottom:13px}
.cmp4card .c4i svg{width:20px;height:20px;fill:none;stroke:var(--cc,#0099ff);stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.cmp4card b{display:block;font-family:var(--display);font-weight:500;font-size:16px;color:#fff;letter-spacing:-.02em;margin-bottom:6px}
.cmp4card > p{font-size:13px;color:var(--muted);line-height:1.55;margin:0 0 13px}
.cmp4card .c4vs{display:flex;flex-direction:column;gap:6px;font-size:12.5px;border-top:1px solid var(--hair-soft);padding-top:11px}
.cmp4card .c4vs span{display:flex;gap:8px;align-items:baseline}
.cmp4card .c4vs i{font-style:normal;flex:0 0 auto;font-weight:800}
.cmp4card .c4ok{color:#e7ebf0}.cmp4card .c4ok i{color:#22c55e}
.cmp4card .c4no{color:#7a7a7a}.cmp4card .c4no i{color:#e0867f}
@media(max-width:900px){.cmp4{grid-template-columns:1fr 1fr}}
@media(max-width:520px){.cmp4{grid-template-columns:1fr}}

/* ============ V72 — page contact : actions rapides + agenda Calendly ============ */
.actrow{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.actcard{display:flex;flex-direction:column;gap:7px;background:var(--s1);border:1px solid var(--hair);border-radius:16px;padding:22px;transition:transform .25s var(--ease),border-color .25s}
.actcard:hover{transform:translateY(-4px);border-color:color-mix(in srgb,var(--cc,#0099ff) 48%,var(--hair))}
.actcard .aci{width:44px;height:44px;border-radius:12px;display:grid;place-items:center;background:color-mix(in srgb,var(--cc,#0099ff) 14%,transparent);border:1px solid color-mix(in srgb,var(--cc,#0099ff) 36%,transparent);margin-bottom:6px}
.actcard .aci svg{width:22px;height:22px;fill:none;stroke:var(--cc,#0099ff);stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.actcard b{font-family:var(--display);font-weight:500;font-size:17px;color:#fff;letter-spacing:-.02em}
.actcard small{font-size:13.5px;color:var(--muted);line-height:1.5}
.actcard .acmore{margin-top:auto;font-size:13px;font-weight:600;color:var(--cc,#0099ff);padding-top:8px}
@media(max-width:820px){.actrow{grid-template-columns:1fr}}
.cal-wrap{background:#141414;border:1px solid var(--hair);border-radius:20px;padding:8px;overflow:hidden}
.cal-wrap .calendly-inline-widget{min-width:320px;height:700px;border-radius:13px;overflow:hidden}
@media(max-width:560px){.cal-wrap .calendly-inline-widget{height:780px}}

/* ============ V73 — CTA animé (contact) : pulse sobre sur la pill primaire ============ */
.ctapulse{position:relative}
.ctapulse::after{content:"";position:absolute;inset:0;border-radius:999px;box-shadow:0 0 0 0 rgba(255,255,255,.4);animation:ctapulse 2.6s var(--ease) infinite;pointer-events:none}
@keyframes ctapulse{0%{box-shadow:0 0 0 0 rgba(255,255,255,.34)}70%{box-shadow:0 0 0 13px rgba(255,255,255,0)}100%{box-shadow:0 0 0 0 rgba(255,255,255,0)}}
.ctapulse:hover::after{animation:none}
@media(prefers-reduced-motion:reduce){.ctapulse::after{animation:none}}

/* ============ V74 — site OS multi-pages : badge NF525 vectoriel · hero de page · tableau comparatif détaillé · options & packs · paiement Stripe · texture ============ */

/* — Badge NF525 (vectoriel, transparent, sur fond sombre — remplace l'ancien ovale blanc) — */
.nfseal{display:inline-flex;align-items:center;gap:14px}
.nfseal .nf-flag{position:relative;flex:0 0 auto;width:58px;height:44px;border-radius:9px;overflow:hidden;display:grid;grid-template-columns:1fr 1fr 1fr;border:1px solid rgba(255,255,255,.16);box-shadow:0 8px 22px rgba(0,0,0,.5)}
.nfseal .nf-flag i{display:block}
.nfseal .nf-flag i:nth-child(1){background:#13388f}
.nfseal .nf-flag i:nth-child(2){background:#f3f4f6}
.nfseal .nf-flag i:nth-child(3){background:#e0162b}
.nfseal .nf-flag em{position:absolute;inset:0;display:grid;place-items:center;font-family:var(--display);font-style:normal;font-weight:700;font-size:16px;letter-spacing:-.02em;color:#0e1320;mix-blend-mode:normal}
.nfseal .nf-wm{display:flex;flex-direction:column;line-height:1.05}
.nfseal .nf-wm b{font-family:var(--display);font-weight:600;font-size:28px;letter-spacing:-.045em;color:#fff}
.nfseal .nf-wm small{font-size:10px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);margin-top:7px}

/* — Hero de page (sous-pages tarifs / comparatif / articles) — */
.pghero{padding:150px 0 24px;position:relative;overflow:hidden}
.pghero .pgglow{position:absolute;inset:0;pointer-events:none;background:radial-gradient(760px 460px at 50% 0%,rgba(0,153,255,.13),transparent)}
.pghero .wrap{position:relative}
.pgcrumb{display:inline-flex;gap:8px;align-items:center;font-size:12.5px;color:var(--muted);margin-bottom:14px}
.pgcrumb a{color:var(--muted)}.pgcrumb a:hover{color:#fff}.pgcrumb span{color:#444}

/* — Texture pointillée subtile (sections) — */
.texgrid{position:relative}
.texgrid::before{content:"";position:absolute;inset:0;background-image:radial-gradient(rgba(255,255,255,.045) 1px,transparent 1px);background-size:23px 23px;pointer-events:none;-webkit-mask-image:radial-gradient(82% 64% at 50% 0%,#000,transparent);mask-image:radial-gradient(82% 64% at 50% 0%,#000,transparent)}
.texgrid > *{position:relative}

/* — Tableau comparatif détaillé (Corsiva OS vs autres) — */
.cmptable2{margin-top:10px;border:1px solid var(--hair);border-radius:var(--r-big,20px);overflow:hidden;background:var(--s1)}
.cmprow{display:grid;grid-template-columns:1.5fr 1fr 1fr;align-items:stretch}
.cmprow + .cmprow{border-top:1px solid var(--hair-soft)}
.cmprow.head > div{padding:16px 18px;font-family:var(--display);font-weight:500;font-size:14px;letter-spacing:-.01em;color:#fff;background:var(--s2)}
.cmprow.head .corsiva{color:#39aaff;display:flex;align-items:center;gap:8px}
.cmprow.head .corsiva img{height:15px}
.cmprow.head .other{color:var(--muted)}
.cmprow > div{padding:15px 18px;font-size:13.5px;display:flex;align-items:center}
.cmprow .crit{color:#dfe4ea;font-weight:500}
.cmprow .corsiva{color:#eef2f6;border-left:1px solid var(--hair-soft);background:linear-gradient(90deg,rgba(0,153,255,.07),transparent)}
.cmprow .other{color:#7a7a7a;border-left:1px solid var(--hair-soft)}
.cmprow .ck{display:inline-flex;align-items:center;gap:9px}
.cmprow .ck svg{flex:0 0 auto;width:16px;height:16px;fill:none;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
.cmprow .corsiva .ck svg{stroke:#22c55e}
.cmprow .other .ck svg{stroke:#e0867f}
@media(max-width:640px){.cmprow{grid-template-columns:1fr}.cmprow.head{display:none}.cmprow > div{padding:10px 16px}.cmprow .crit{font-weight:600;color:#fff;padding-bottom:0}.cmprow .corsiva,.cmprow .other{border-left:none;background:none;padding-top:3px}.cmprow .other{padding-bottom:13px}.cmprow .corsiva::before{content:"Corsiva OS — ";color:#39aaff;font-weight:600;margin-right:4px}.cmprow .other::before{content:"Autres — ";color:#666;font-weight:600;margin-right:4px}}

/* — Options à la carte & packs (page tarifs) — */
.optgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.optcard{background:var(--s1);border:1px solid var(--hair);border-radius:15px;padding:18px;transition:transform .25s var(--ease),border-color .25s}
.optcard:hover{transform:translateY(-4px);border-color:rgba(0,153,255,.4)}
.optcard .oon{font-family:var(--display);font-weight:500;font-size:15px;color:#fff;letter-spacing:-.02em}
.optcard .oop{font-family:var(--display);font-weight:500;font-size:23px;letter-spacing:-.04em;color:#39aaff;margin:9px 0 5px}
.optcard .oop small{font-size:12px;color:var(--muted);font-family:var(--body);letter-spacing:0;font-weight:400}
.optcard .ood{font-size:12.5px;color:var(--muted);line-height:1.5}
@media(max-width:820px){.optgrid{grid-template-columns:1fr 1fr}}
@media(max-width:430px){.optgrid{grid-template-columns:1fr}}

/* — Paiement sécurisé Stripe — */
.strust{display:grid;grid-template-columns:1.25fr 1fr;gap:22px;align-items:center;background:var(--s1);border:1px solid var(--hair);border-radius:var(--r-big,20px);padding:28px;position:relative;overflow:hidden}
.strust::before{content:"";position:absolute;top:0;left:0;right:0;height:2px;background:linear-gradient(90deg,#635bff,#0099ff)}
.strust h3{font-family:var(--display);font-weight:500;font-size:clamp(20px,2.4vw,26px);letter-spacing:-.03em;color:#fff;margin:0 0 10px;display:flex;align-items:center;gap:11px;flex-wrap:wrap}
.strust .stripe-wm{font-family:var(--display);font-weight:700;font-size:.85em;color:#a8a2ff;letter-spacing:-.02em;background:rgba(99,91,255,.14);border:1px solid rgba(99,91,255,.4);border-radius:8px;padding:2px 9px}
.strust p{color:var(--muted);font-size:14px;line-height:1.6;margin:0}
.strust .stbadges{display:flex;flex-wrap:wrap;gap:9px}
.stchip{display:inline-flex;align-items:center;gap:8px;background:var(--s2);border:1px solid var(--hair);border-radius:100px;padding:9px 15px;font-size:12.5px;font-weight:500;color:#dfe4ea}
.stchip svg{flex:0 0 auto;width:14px;height:14px;fill:none;stroke:#34d27b;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
@media(max-width:760px){.strust{grid-template-columns:1fr;gap:16px;padding:22px}}

/* — Teasers home (sections déplacées vers pages dédiées) — */
.teaserband{display:grid;grid-template-columns:1fr auto;gap:20px;align-items:center;background:var(--s1);border:1px solid var(--hair);border-radius:var(--r-big,20px);padding:26px 30px}
.teaserband .tb-prices{display:flex;gap:22px;flex-wrap:wrap;margin-top:12px}
.teaserband .tb-pr{display:flex;flex-direction:column;line-height:1.1}
.teaserband .tb-pr b{font-family:var(--display);font-weight:500;font-size:24px;letter-spacing:-.04em;color:#fff}
.teaserband .tb-pr b small{font-size:12px;color:var(--muted);font-weight:400;font-family:var(--body)}
.teaserband .tb-pr span{font-size:12px;color:var(--muted);margin-top:3px}
@media(max-width:680px){.teaserband{grid-template-columns:1fr;text-align:left}}

/* ============ V75 — section Abonnements (handoff : Lite · Business phare dégradé · Ultra) ============ */
.formules{max-width:1180px;margin:0 auto;padding:64px 22px}
.formules-head{text-align:center;max-width:680px;margin:0 auto 48px}
.formules-head h2{font-family:var(--display);font-weight:600;font-size:clamp(34px,4.6vw,56px);letter-spacing:-.045em;line-height:1.02;margin:14px 0 0}
.formules-head .lead{margin-top:14px}
.formules-grid{display:grid;grid-template-columns:1fr 1.06fr 1fr;gap:18px;align-items:stretch}
.plan{position:relative;display:flex;flex-direction:column;background:var(--s1,#141414);border:1px solid var(--hair,#262626);border-radius:30px;padding:34px 30px;transition:transform .3s var(--ease),box-shadow .3s var(--ease),border-color .3s var(--ease)}
.plan:hover{transform:translateY(-7px);border-color:color-mix(in srgb,var(--pa) 45%,var(--hair,#262626));box-shadow:0 30px 70px rgba(0,0,0,.5),0 0 60px color-mix(in srgb,var(--pa) 16%,transparent)}
.plan.featured{background:radial-gradient(130% 150% at 88% 0%,#54b7ff,#0084dd 46%,#003a66);border:none;color:#fff;transform:translateY(-16px);box-shadow:0 34px 80px rgba(0,0,0,.5),0 0 80px rgba(0,153,255,.22);padding-top:40px}
.plan.featured:hover{transform:translateY(-22px)}
.plan.featured .plan-name{color:#fff}
.plan.featured .plan-tag,.plan.featured .plan-price small,.plan.featured .plan-engage{color:rgba(255,255,255,.82)}
.plan.featured .plan-price{color:#fff}
.plan.featured .plan-price .was{color:rgba(255,255,255,.5)}
.plan.featured .plan-engage .save{background:rgba(255,255,255,.16);color:#fff}
.plan.featured .plan-emblem{background:rgba(255,255,255,.16);border-color:rgba(255,255,255,.32)}
.plan.featured .plan-feats li{color:rgba(255,255,255,.9)}
.plan.featured .plan-feats li.lead{color:#fff}
.plan.featured .plan-feats li::before{background:#fff}
.plan.featured .btn-w{background:#fff;color:#06243f}
.plan.featured .btn-d{background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.3);color:#fff}
.plan-badge{position:absolute;top:-13px;left:50%;transform:translateX(-50%);z-index:3;font-size:11.5px;font-weight:700;border-radius:100px;padding:7px 15px;white-space:nowrap;box-shadow:0 8px 24px rgba(0,0,0,.4)}
.plan-badge--w{background:#fff;color:#06243f}
.plan-badge--o{background:linear-gradient(120deg,#ffb38d,#ff7a3d);color:#1d0f02}
.plan-emblem{width:48px;height:48px;border-radius:13px;display:grid;place-items:center;margin-bottom:20px;background:color-mix(in srgb,var(--pa) 16%,transparent);border:1px solid color-mix(in srgb,var(--pa) 40%,transparent)}
.plan-emblem img{width:25px;height:25px;display:block}
.plan-name{font-family:var(--display);font-weight:600;font-size:26px;letter-spacing:-.03em;margin:0;color:var(--pa)}
.plan-tag{color:var(--muted,#999);font-size:13.5px;margin:9px 0 0;line-height:1.5;min-height:38px}
.plan-price{font-family:var(--display);font-weight:500;font-size:50px;letter-spacing:-.05em;line-height:1;margin:24px 0 3px;display:flex;align-items:baseline;gap:10px;color:#fff}
.plan-price small{font-size:15px;color:var(--muted);font-weight:400;letter-spacing:0}
.plan-price .was{font-size:15px;color:#666;text-decoration:line-through;letter-spacing:0}
.plan-engage{font-size:11.5px;color:var(--muted);display:flex;align-items:center;gap:7px;margin-bottom:22px}
.plan-engage .save{background:rgba(34,197,94,.16);color:#6ee7a0;font-size:10.5px;font-weight:700;border-radius:100px;padding:3px 9px}
.plan-incl{display:flex;align-items:center;gap:12px;background:var(--s2,#1c1c1c);border:1px solid var(--hair,#262626);border-radius:12px;padding:13px 15px;margin:-2px 0 22px}
.plan-incl .iv{font-family:var(--display);font-weight:600;font-size:20px;letter-spacing:-.03em;color:var(--pa);white-space:nowrap}
.plan-incl small{font-size:11.5px;color:var(--muted);line-height:1.35}
.plan-feats{list-style:none;padding:0;margin:0 0 24px;display:flex;flex-direction:column;gap:12px;flex:1}
.plan-feats li{font-size:13.5px;color:var(--muted);padding-left:27px;position:relative;line-height:1.45}
.plan-feats li::before{content:"";position:absolute;left:0;top:1px;width:16px;height:16px;background:var(--pa);-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 12.5 9 17.5 20 6.5'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 12.5 9 17.5 20 6.5'/%3E%3C/svg%3E") center/contain no-repeat}
.plan-feats li.lead{color:#fff;font-weight:600}
.plan-cta{display:flex;flex-direction:column;gap:10px}
.plan-cta .btn{min-height:46px;display:flex;align-items:center;justify-content:center}
@media(max-width:920px){
  .formules-grid{grid-template-columns:1fr;gap:30px;max-width:420px;margin-inline:auto}
  .plan.featured{transform:none}
  .plan.featured:hover{transform:translateY(-7px)}
}

/* ============ V76 — abonnements : sélecteur mois/année (calcul auto) + apparition carte par carte ============ */
.billrow{display:flex;justify-content:center;margin:-16px 0 34px}
.billtoggle{display:inline-flex;gap:4px;padding:5px;background:var(--s1,#141414);border:1px solid var(--hair,#262626);border-radius:100px}
.billtoggle .bt{font-family:var(--body);font-size:13.5px;font-weight:600;color:var(--muted,#999);background:transparent;border:none;border-radius:100px;padding:10px 22px;cursor:pointer;min-height:42px;letter-spacing:-.01em;transition:color .2s var(--ease),background .25s var(--ease)}
.billtoggle .bt.on{background:#fff;color:#06243f}
.billtoggle .bt:hover:not(.on){color:#fff}
.billtoggle .bt .bt-save{font-size:10.5px;font-weight:700;color:#6ee7a0;margin-left:6px}
.billtoggle .bt.on .bt-save{color:#1c7a45}
/* apparition carte par carte — via translate (indépendant du transform de survol) */
.formules-grid .plan{opacity:0;translate:0 34px;transition:opacity .55s var(--ease) var(--rd,0s),translate .6s var(--ease) var(--rd,0s),transform .3s var(--ease),box-shadow .3s var(--ease),border-color .3s var(--ease)}
.formules-grid .plan.show{opacity:1;translate:0 0}
.formules-grid .plan:nth-child(2){--rd:.16s}
.formules-grid .plan:nth-child(3){--rd:.32s}
@media(prefers-reduced-motion:reduce){.formules-grid .plan{opacity:1;translate:0 0;transition:none}}

/* ============ V77 — tarifs : inclusions détaillées par formule (couleurs) + options & packs ============ */
.incgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:10px}
.inccol{background:var(--s1);border:1px solid var(--hair);border-radius:22px;padding:28px 26px;border-top:3px solid var(--c,#0099ff);display:flex;flex-direction:column;position:relative;overflow:hidden;transition:transform .25s var(--ease),border-color .25s var(--ease),box-shadow .25s var(--ease)}
.inccol::before{content:"";position:absolute;top:0;left:0;right:0;height:120px;background:radial-gradient(120% 130% at 12% 0%,color-mix(in srgb,var(--c) 14%,transparent),transparent 70%);pointer-events:none}
.inccol:hover{transform:translateY(-6px);border-color:color-mix(in srgb,var(--c) 50%,var(--hair));box-shadow:0 24px 60px rgba(0,0,0,.42),0 0 50px color-mix(in srgb,var(--c) 12%,transparent)}
.inccol.feat{background:radial-gradient(130% 150% at 88% 0%,#123150,#0d2138 50%,#0a1626)}
.inccol .ic-name{font-family:var(--display);font-weight:600;font-size:23px;letter-spacing:-.03em;color:var(--c);display:flex;align-items:center;gap:9px;position:relative}
.inccol .ic-dot{width:9px;height:9px;border-radius:50%;background:var(--c);box-shadow:0 0 0 4px color-mix(in srgb,var(--c) 22%,transparent)}
.inccol .ic-price{font-family:var(--display);font-weight:500;font-size:32px;letter-spacing:-.045em;color:#fff;margin:14px 0 2px;position:relative}
.inccol .ic-price small{font-size:13px;color:var(--muted);font-weight:400;font-family:var(--body);letter-spacing:0}
.inccol .ic-prev{font-size:12.5px;color:var(--muted);margin-bottom:20px;position:relative}
.inccol ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:12px;flex:1;position:relative}
.inccol li{font-size:13.5px;color:#dfe4ea;padding-left:28px;position:relative;line-height:1.45}
.inccol li.h{color:#fff;font-weight:600;padding-left:0;letter-spacing:-.01em}
.inccol li:not(.h)::before{content:"";position:absolute;left:0;top:1px;width:17px;height:17px;background:var(--c);-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 12.5 9 17.5 20 6.5'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 12.5 9 17.5 20 6.5'/%3E%3C/svg%3E") center/contain no-repeat}
@media(max-width:880px){.incgrid{grid-template-columns:1fr;max-width:440px;margin-inline:auto}}

.optsband{background:var(--s1);border:1px solid var(--hair);border-radius:20px;padding:26px;margin-top:16px}
.optsband .ob-h{display:flex;align-items:baseline;gap:11px;flex-wrap:wrap;margin-bottom:4px}
.optsband .ob-h b{font-family:var(--display);font-weight:500;font-size:18px;letter-spacing:-.025em;color:#fff;display:flex;align-items:center;gap:9px}
.optsband .ob-h .ob-dot{width:9px;height:9px;border-radius:50%;background:var(--oc,#19c6c6)}
.optsband .ob-h small{font-size:12.5px;color:var(--muted)}
.optgrid2{display:grid;grid-template-columns:repeat(auto-fit,minmax(184px,1fr));gap:12px;margin-top:16px}
.optchip{background:var(--s2);border:1px solid var(--hair);border-radius:14px;padding:15px 16px;transition:transform .22s var(--ease),border-color .22s var(--ease)}
.optchip:hover{transform:translateY(-4px);border-color:color-mix(in srgb,var(--oc,#19c6c6) 46%,var(--hair))}
.optchip .oc-n{font-family:var(--display);font-weight:500;font-size:14.5px;color:#fff;letter-spacing:-.01em}
.optchip .oc-p{font-family:"Geist Mono",monospace;font-size:13px;font-weight:500;color:var(--oc,#19c6c6);margin-top:6px}
.optchip .oc-d{font-size:12px;color:var(--muted);margin-top:6px;line-height:1.45}
@media(max-width:480px){.optgrid2{grid-template-columns:1fr}}

/* ============ V78 — nav mobile : logo à gauche, contrôles groupés à droite (fix scatter avec puce langue) ============ */
@media(max-width:880px){
  nav .navpill{justify-content:flex-start}
  nav .navpill .navlang{margin-left:auto;margin-right:0}
  nav .navpill .navtel{margin-left:0;margin-right:0}
}

/* ============ V79 — pop-up offre nouveaux clients : compte à rebours ============ */
.nc-timer{display:flex;flex-direction:column;align-items:center;gap:6px;margin:20px 0}
.nc-timer .nc-tlbl{font-family:var(--body);font-size:11px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.nc-timer .nc-time{font-family:"Geist Mono",ui-monospace,monospace;font-size:34px;font-weight:500;letter-spacing:.06em;color:#fff;background:var(--s2);border:1px solid var(--hair);border-radius:13px;padding:9px 20px;min-width:134px;font-variant-numeric:tabular-nums}

/* ============ V80 — pop-up offre nouveaux clients : design dédié (couleurs + timer animé) ============ */
.ncoffer .pop{background:radial-gradient(135% 120% at 82% -12%,#15233f,#0d1421 52%,#090b10);border:1px solid rgba(0,153,255,.32);box-shadow:0 44px 120px rgba(0,0,0,.62),0 0 90px rgba(0,153,255,.16)}
.ncoffer .pop::before{content:"";position:absolute;top:0;left:0;right:0;height:3px;border-radius:20px 20px 0 0;background:linear-gradient(90deg,#39aaff,#0099ff 45%,#635bff)}
.ncoffer .gift{display:inline-flex;align-items:center;gap:7px;background:rgba(0,153,255,.14);border:1px solid rgba(0,153,255,.42);color:#8ccbff;font-family:var(--body);font-size:11px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;border-radius:100px;padding:8px 15px}
.ncoffer .gift::before{content:"";width:7px;height:7px;border-radius:50%;background:#0099ff;box-shadow:0 0 0 4px rgba(0,153,255,.2)}
.ncoffer h3{font-family:var(--display);font-weight:600;font-size:clamp(32px,7vw,44px);letter-spacing:-.045em;color:#fff;margin:18px 0 10px;line-height:.98}
.ncoffer p{color:#c0c6cf;font-size:14.5px;line-height:1.6;margin:0}
.ncoffer .nc-timer{margin:22px 0}
.ncoffer .nc-timer .nc-tlbl{color:#7cc4ff}
.ncoffer .nc-timer .nc-time{font-size:38px;color:#fff;background:rgba(0,153,255,.1);border:1px solid rgba(0,153,255,.34);box-shadow:0 0 30px rgba(0,153,255,.16);padding:11px 22px;min-width:148px}
.ncoffer .popcta{margin-top:6px}
.ncoffer .popcta .btn-w{box-shadow:0 10px 30px rgba(0,153,255,.28)}
.ncoffer .poplegal{margin-top:14px;color:#6a7280}
@media(prefers-reduced-motion:no-preference){.ncoffer .nc-timer .nc-time{animation:ncpulse 2.4s var(--ease) infinite}}
@keyframes ncpulse{0%,100%{box-shadow:0 0 22px rgba(0,153,255,.1)}50%{box-shadow:0 0 34px rgba(0,153,255,.26)}}

/* ============ V81 — footer redesigné (brand + badges + colonnes + barre légale) ============ */
.ftr{border-top:1px solid var(--hair);margin-top:44px;padding:56px 0 30px;background:linear-gradient(180deg,transparent,rgba(0,153,255,.035))}
.ftr-top{display:grid;grid-template-columns:1.35fr 1.65fr;gap:44px;align-items:start}
.ftr-brand img{height:24px;margin-bottom:14px;display:block}
.ftr-brand p{color:var(--muted);font-size:14px;line-height:1.6;max-width:44ch;margin:0}
.ftr-badges{display:flex;flex-wrap:wrap;gap:8px;margin-top:18px}
.ftr-b{display:inline-flex;align-items:center;gap:7px;font-size:12px;font-weight:500;color:#cbd2da;background:var(--s1);border:1px solid var(--hair);border-radius:100px;padding:7px 13px}
.ftr-b img{height:13px;margin:0;display:block}
.ftr-cols{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.ftr-cols h4{font-family:var(--display);font-weight:500;font-size:14px;letter-spacing:-.01em;color:#fff;margin:0 0 15px}
.ftr-cols a{display:block;color:var(--muted);font-size:13.5px;margin-bottom:11px;transition:color .2s var(--ease);text-decoration:none}
.ftr-cols a:hover{color:#fff}
.ftr-bottom{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-top:42px;padding-top:22px;border-top:1px solid var(--hair-soft,#1e1e1e);font-size:12.5px;color:#6a7280}
@media(max-width:760px){.ftr-top{grid-template-columns:1fr;gap:30px}.ftr-cols{grid-template-columns:1fr 1fr;gap:18px}.ftr-bottom{flex-direction:column;gap:6px}}

/* ============ V82 — bannière cookies + pop-ups (slide depuis le bas, palette neutre, sans bleu électrique) ============ */
/* Bannière cookies */
.ckbanner{position:fixed;left:0;right:0;bottom:0;z-index:380;display:flex;align-items:center;justify-content:center;gap:14px 26px;flex-wrap:wrap;background:#fff;color:#1a1a1a;padding:15px 24px;box-shadow:0 -12px 44px rgba(0,0,0,.45);transform:translateY(115%);transition:transform .55s var(--ease)}
.ckbanner.in{transform:translateY(0)}
.ckbanner p{margin:0;font-size:13.5px;line-height:1.5;color:#333;max-width:64ch}
.ckbanner p a{color:#0066cc;text-decoration:underline}
.ckbanner .ck-act{display:flex;gap:12px;align-items:center;flex:0 0 auto}
.ckbanner .ck-ok{background:#0099ff;color:#fff;border:none;border-radius:100px;padding:11px 26px;font-family:var(--body);font-weight:600;font-size:13.5px;cursor:pointer;transition:background .2s var(--ease)}
.ckbanner .ck-ok:hover{background:#0080dd}
.ckbanner .ck-no{background:none;border:none;color:#777;font-family:var(--body);font-size:13px;cursor:pointer;text-decoration:underline;padding:6px}
@media(max-width:620px){.ckbanner{flex-direction:column;text-align:center;gap:12px;padding:16px 18px}.ckbanner .ck-act{width:100%;justify-content:center}}
@media(prefers-reduced-motion:reduce){.ckbanner{transition:none}}
/* Pop-ups : ancrés en bas, glissent depuis le bas */
.popup{place-items:end center}
.popup{padding-bottom:max(22px,env(safe-area-inset-bottom))}
.popup.on .pop{animation:popslideup .5s var(--ease)}
@keyframes popslideup{from{transform:translateY(90px);opacity:0}to{transform:translateY(0);opacity:1}}
@media(prefers-reduced-motion:reduce){.popup.on .pop{animation:none}}
/* Palette neutre (plus de bleu électrique) sur la carte */
.pop{background:radial-gradient(360px 220px at 80% 0%,rgba(255,255,255,.05),transparent),#141414;border:1px solid #2b2b2b;box-shadow:0 40px 110px rgba(0,0,0,.62)}
/* Pop-up offre nouveaux clients : neutraliser le bleu de V80 */
.ncoffer .pop::before{background:linear-gradient(90deg,#fff,rgba(255,255,255,.35))}
.ncoffer .gift{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.22);color:#fff}
.ncoffer .gift::before{background:#fff;box-shadow:0 0 0 4px rgba(255,255,255,.14)}
.ncoffer .grad-blue{background:linear-gradient(110deg,#fff,#c8ced6);-webkit-background-clip:text;background-clip:text;color:transparent}
.ncoffer .nc-timer .nc-tlbl{color:rgba(255,255,255,.6)}
.ncoffer .nc-timer .nc-time{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.2);color:#fff;box-shadow:none;animation:none}
.ncoffer .popcta .btn-w{box-shadow:0 14px 32px rgba(0,0,0,.45)}

/* ============ V83 — Pop-up offre : DA chaude (or/ambre, ZÉRO bleu) + bottom-sheet par le bas ============ */
.popup.ncoffer{place-items:end center;padding:0}
.ncoffer .pop{width:min(460px,100%);border-radius:26px 26px 0 0;border-bottom:none;padding:32px 28px calc(30px + env(safe-area-inset-bottom));background:radial-gradient(160% 130% at 80% -15%,#2c1e11,#1a1310 46%,#0d0b09);border:1px solid rgba(245,166,75,.34);box-shadow:0 -28px 90px rgba(0,0,0,.6),0 0 90px rgba(245,166,75,.12)}
.ncoffer .pop::before{background:linear-gradient(90deg,#ffd9a3,#f5a64b 50%,#ff7a3d)}
.ncoffer .gift{background:rgba(245,166,75,.14);border:1px solid rgba(245,166,75,.42);color:#f3b878}
.ncoffer .gift::before{background:#f5a64b;box-shadow:0 0 0 4px rgba(245,166,75,.2)}
.ncoffer .grad-blue{background:linear-gradient(110deg,#ffe6c4,#f5a64b);-webkit-background-clip:text;background-clip:text;color:transparent}
.ncoffer .nc-timer .nc-tlbl{color:#d8a875}
.ncoffer .nc-timer .nc-time{font-family:var(--display);font-variant-numeric:tabular-nums;letter-spacing:.01em;background:rgba(245,166,75,.1);border:1px solid rgba(245,166,75,.32);color:#fff;box-shadow:0 0 30px rgba(245,166,75,.14);animation:none}
.ncoffer .popcta .btn-w{box-shadow:0 14px 34px rgba(245,166,75,.26)}
.popup.ncoffer.on .pop{animation:ncsheetin .44s var(--ease) both}
@keyframes ncsheetin{from{transform:translateY(100%)}to{transform:translateY(0)}}
@media(prefers-reduced-motion:reduce){.popup.ncoffer.on .pop{animation:none}}

/* ============ V84 — Nav OS mobile : logo Corsiva OS (wordmark) à sa taille normale, en haut à gauche, comme à l'origine ============ */
@media(max-width:600px){
  nav .navpill .brand img{display:block!important;height:20px!important;width:auto!important;background:none!important}
}

/* ============ V85 — fil d'Ariane masqué (Accueil › …) sur toutes les pages OS ============ */
.pgcrumb{display:none!important}

/* ============ V86 — cancel70 : fond bleu plein ============ */
.cancel70{background:#0099ff!important;border:1px solid #0099ff!important;box-shadow:0 16px 40px rgba(0,153,255,.32)!important}
.cancel70 b{color:#fff!important}
.cancel70 span{color:rgba(255,255,255,.92)!important}

/* ============ V87 — nav PC sans icône Contact + cookie agrandi + scroll-snap PC ============ */
/* icône (✉) du lien Contact masquée sur PC (conservée dans le menu mobile) */
nav .navpill .links a .navico{display:none}   /* icône nav retirée partout (PC + mobile) */

/* bannière cookies agrandie */
.ckbanner{padding:24px 32px!important;gap:18px 34px!important}
.ckbanner p{font-size:16px!important;line-height:1.55!important;max-width:74ch!important}
.ckbanner .ck-ok{padding:15px 40px!important;font-size:15.5px!important}
.ckbanner .ck-no{font-size:14.5px!important}



/* ============ V88 — footer plus travaillé (bandeau CTA + mise en page) ============ */
.ftr{padding-top:0!important}
.ftr-cta{display:flex;flex-direction:column;align-items:center;text-align:center;gap:22px;padding:46px 0;border-bottom:1px solid var(--hair)}
.ftr-cta .ftr-eyebrow{display:block;font-family:var(--body);font-size:11.5px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:#39aaff;margin-bottom:9px}
.ftr-cta h3{font-family:var(--display);font-weight:500;font-size:clamp(22px,2.7vw,30px);letter-spacing:-.035em;color:#fff;margin:0;max-width:26ch;line-height:1.12}
.ftr-cta-btn{display:flex;gap:12px;flex-wrap:wrap}
.ftr-top{padding-top:46px}
.ftr-bottom{display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap;margin-top:40px;padding-top:22px;border-top:1px solid var(--hair);font-size:12.5px;color:var(--muted)}
.ftr-bottom .ftr-legal{color:#777}
@media(max-width:760px){.ftr-cta{gap:18px}.ftr-bottom{flex-direction:column;gap:8px}}


/* ============ V89 — en-têtes de section alignés à gauche en mobile ============ */
@media(max-width:600px){
  .sechead,.formules-head{text-align:left}
  .sechead .eyebrow,.formules-head .eyebrow{margin-left:0;margin-right:auto;justify-content:flex-start}
  .sechead .lead,.sechead .h-sec,.formules-head h2{text-align:left}
}

/* langsel */
.langsel{position:relative;display:inline-block;margin:0 4px}
.langsel>summary{list-style:none;cursor:pointer;display:inline-flex;align-items:center;gap:6px;padding:7px 11px;border:1px solid #262626;border-radius:100px;background:#141414;color:#fff;font-size:12.5px;font-family:var(--display,inherit);letter-spacing:-.01em;transition:background .15s,border-color .15s}
.langsel>summary::-webkit-details-marker{display:none}
.langsel>summary:hover{background:#1c1c1c;border-color:#3a3a3a}
.langsel>summary svg{opacity:.6;transition:transform .2s}
.langsel[open]>summary svg{transform:rotate(180deg)}
.langsel .lsf{font-size:14px;line-height:1}
.langsel-menu{position:absolute;top:calc(100% + 8px);right:0;min-width:236px;background:#141414;border:1px solid #262626;border-radius:14px;padding:6px;display:flex;flex-direction:column;gap:1px;box-shadow:0 18px 50px rgba(0,0,0,.55);z-index:120}
.langsel-menu a{display:flex;align-items:center;gap:10px;padding:9px 11px;border-radius:9px;color:#fff;font-size:13px;text-decoration:none;white-space:nowrap}
.langsel-menu a:hover{background:#1f1f1f}
.langsel-menu .lsn{font-weight:500}
.langsel-menu .lsl{margin-left:auto;color:#777;font-size:11.5px}
@media(max-width:640px){.langsel-menu{position:fixed;left:50%;right:auto;transform:translateX(-50%);top:62px;min-width:0;width:min(92vw,300px);max-height:72vh;overflow-y:auto}}
@media(prefers-reduced-motion:reduce){.langsel>summary,.langsel>summary svg{transition:none}}

/* dark-lock : préserver les titres dégradés contre forced-colors / recolorateurs */
.grad-blue,.grad-violet,.tcost-title{forced-color-adjust:none}

/* hero image d'article */
.artbhero{margin:0 0 30px;border-radius:18px;overflow:hidden;border:1px solid var(--hair);box-shadow:0 26px 60px rgba(0,0,0,.4)}
.artbhero img{display:block;width:100%;max-height:440px;object-fit:cover}

/* Samsung Internet (mode sombre forcé) : TOUT dégradé clippé -> couleur pleine lisible (titres + chiffres) */
html.nogradclip:not(.theme-light) .grad-blue,html.nogradclip:not(.theme-light) .ncoffer .grad-blue,html.nogradclip:not(.theme-light) .jnum,html.nogradclip:not(.theme-light) .fvrow .n,html.nogradclip:not(.theme-light) .vci .vbox{background:none!important;background-image:none!important;-webkit-text-fill-color:#7cc4ff!important;color:#7cc4ff!important}
html.nogradclip:not(.theme-light) .grad-violet{background:none!important;background-image:none!important;-webkit-text-fill-color:#a594ff!important;color:#a594ff!important}
html.nogradclip:not(.theme-light) .tcost-title,html.nogradclip:not(.theme-light) .ia2 h2,html.nogradclip:not(.theme-light) .proof.solo h3{background:none!important;background-image:none!important;-webkit-text-fill-color:#fff!important;color:#fff!important;animation:none!important}

/* mode sombre forcé : ré-imposer les couleurs de la prévisualisation du logiciel (maquette OSR + osframe) */
html.nogradclip:not(.theme-light) body{background-color:#090909!important}
html.nogradclip:not(.theme-light) .owin{background:#0d0d10!important}
html.nogradclip:not(.theme-light) .oside,html.nogradclip:not(.theme-light) .otop,html.nogradclip:not(.theme-light) .osbar,html.nogradclip:not(.theme-light) .osnav{background:#0a0a0d!important}
html.nogradclip:not(.theme-light) .osrev{background:linear-gradient(160deg,#16120a,#111)!important;border-color:#2a2118!important}
html.nogradclip:not(.theme-light) .oscard,html.nogradclip:not(.theme-light) .osveh,html.nogradclip:not(.theme-light) .osframe,html.nogradclip:not(.theme-light) .osbody,html.nogradclip:not(.theme-light) .ocard{background:#141414!important}
html.nogradclip:not(.theme-light) .obtn,html.nogradclip:not(.theme-light) .os-cta,html.nogradclip:not(.theme-light) .obtn *{background:#fff!important;color:#000!important;-webkit-text-fill-color:#000!important}
html.nogradclip:not(.theme-light) .owin h3,html.nogradclip:not(.theme-light) .owin h6,html.nogradclip:not(.theme-light) .osd-head h3,html.nogradclip:not(.theme-light) .rbig,html.nogradclip:not(.theme-light) .occn,html.nogradclip:not(.theme-light) .pn,html.nogradclip:not(.theme-light) .ow,html.nogradclip:not(.theme-light) .vmeta b{color:#fff!important;-webkit-text-fill-color:#fff!important}

/* MOBILE en mode sombre système (tout navigateur, y compris webviews in-app) : le navigateur reteinte la page -> on fige les couleurs */
@media (prefers-color-scheme: dark) and (hover: none){
  html:not(.theme-light) .grad-blue,html:not(.theme-light) .ncoffer .grad-blue,html:not(.theme-light) .jnum,html:not(.theme-light) .fvrow .n,html:not(.theme-light) .vci .vbox{background:none!important;background-image:none!important;-webkit-text-fill-color:#7cc4ff!important;color:#7cc4ff!important}
  html:not(.theme-light) .grad-violet{background:none!important;background-image:none!important;-webkit-text-fill-color:#a594ff!important;color:#a594ff!important}
  html:not(.theme-light) .tcost-title,html:not(.theme-light) .ia2 h2,html:not(.theme-light) .proof.solo h3{background:none!important;background-image:none!important;-webkit-text-fill-color:#fff!important;color:#fff!important;animation:none!important}
  html:not(.theme-light) body{background-color:#090909!important}
  html:not(.theme-light) .owin{background:#0d0d10!important}
  html:not(.theme-light) .oside,html:not(.theme-light) .otop,html:not(.theme-light) .osbar,html:not(.theme-light) .osnav{background:#0a0a0d!important}
  html:not(.theme-light) .osrev{background:linear-gradient(160deg,#16120a,#111)!important;border-color:#2a2118!important}
  html:not(.theme-light) .oscard,html:not(.theme-light) .osveh,html:not(.theme-light) .osframe,html:not(.theme-light) .osbody,html:not(.theme-light) .ocard{background:#141414!important}
  html:not(.theme-light) .obtn,html:not(.theme-light) .os-cta{background:#fff!important;color:#000!important;-webkit-text-fill-color:#000!important}
}

/* ============ WHYX2 — Index éditorial « 4 différences » (manifeste imprimé) ============
   Réutilise les tokens globaux de styles.css :
   --display --ink --muted --hair --s1 --blue --ease
   Geist Mono déjà chargé (cf .ipcount). Classes préfixées .whyx2. Bleu = seul accent, rare. */
.whyx2{padding-top:24px}

/* — En-tête type « ours » de magazine : titre à gauche, méta index à droite — */
.whyx2-head{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;
  margin-bottom:44px;padding-bottom:26px;border-bottom:1px solid var(--hair)}
.whyx2-head .sechead{text-align:left;max-width:none;margin:0}
.whyx2-head .sechead .eyebrow{justify-content:flex-start;margin:0 0 18px}
.whyx2-head .h-sec{margin:0}
.whyx2-meta{font-family:"Geist Mono",ui-monospace,monospace;font-size:11px;font-weight:500;
  letter-spacing:.18em;text-transform:uppercase;color:#666;white-space:nowrap;padding-bottom:7px;
  font-variant-numeric:tabular-nums}
.whyx2-meta b{color:#cdd4db;font-weight:500}

/* — La liste : un index, pas une grille. Filets 1px, colonnes asymétriques — */
.whyx2-list{display:flex;flex-direction:column}
.whyx2-row{position:relative;display:grid;
  grid-template-columns:minmax(0,1.55fr) minmax(0,2.45fr);
  gap:clamp(22px,5vw,72px);align-items:start;
  padding:38px 0;border-top:1px solid var(--hair)}
.whyx2-row:first-child{border-top:0}

/* Tick bleu signal — déployé à l'entrée en vue puis renforcé au survol */
.whyx2-row::before{content:"";position:absolute;left:0;top:-1px;width:34px;height:1px;
  background:var(--blue);transform:scaleX(0);transform-origin:left;
  transition:transform .45s var(--ease),width .3s var(--ease)}
.whyx2-row.in::before{transform:scaleX(1)}

/* Ordinal géant Geist : élément graphique, pas un badge. Un point bleu signal en tête. */
.whyx2-num{font-family:var(--display);font-weight:500;
  font-size:clamp(46px,6vw,72px);line-height:.85;letter-spacing:-.05em;
  color:#262626;font-variant-numeric:tabular-nums;
  display:flex;align-items:flex-start;gap:13px;
  transition:color .4s var(--ease)}
.whyx2-num .sig{width:8px;height:8px;border-radius:50%;background:#3a3a3a;margin-top:.34em;
  flex:0 0 auto;transition:background .4s var(--ease),box-shadow .4s var(--ease)}
.whyx2-row.in .whyx2-num{color:#4a4f55}
.whyx2-row.in .whyx2-num .sig{background:var(--blue);box-shadow:0 0 10px rgba(0,153,255,.7)}

/* Contenu : micro-label monospace (greffe Concept 2) + titre Geist + phrase */
.whyx2-body{padding-top:8px;min-width:0}
.whyx2-tag{font-family:"Geist Mono",ui-monospace,monospace;font-size:10px;font-weight:500;
  letter-spacing:.2em;text-transform:uppercase;color:#666;display:block;margin:0 0 11px;
  transition:color .3s var(--ease)}
.whyx2-t{font-family:var(--display);font-weight:500;
  font-size:clamp(20px,2.2vw,26px);letter-spacing:-.03em;line-height:1.1;
  color:var(--ink);margin:0 0 11px}
.whyx2-p{font-size:14.5px;color:var(--muted);line-height:1.62;margin:0;max-width:50ch}
.whyx2-p em{font-style:normal;color:#cdd2d8}
/* L'aparté « — pas un… » en gris tertiaire : détail éditorial */
.whyx2-p .whyx2-cut{color:#666}

/* — Survol PAR LIGNE — uniquement sur périphériques à pointeur fin — */
@media(hover:hover) and (pointer:fine){
  .whyx2-row:hover::before{transform:scaleX(1);width:50px}
  .whyx2-row:hover .whyx2-num{color:#7a8088}
  .whyx2-row:hover .whyx2-num .sig{background:var(--blue);box-shadow:0 0 12px rgba(0,153,255,.85)}
  .whyx2-row:hover .whyx2-tag{color:#9aa0a8}
}
/* Accessibilité clavier : même état au focus à l'intérieur de la ligne */
.whyx2-row:focus-within::before{transform:scaleX(1);width:50px}
.whyx2-row:focus-within .whyx2-num{color:#7a8088}
.whyx2-row:focus-within .whyx2-num .sig{background:var(--blue);box-shadow:0 0 12px rgba(0,153,255,.85)}
.whyx2-row:focus-within .whyx2-tag{color:#9aa0a8}

/* — Mobile 360–430px : une colonne, ordinal inline au-dessus du titre — */
@media(max-width:760px){
  .whyx2{padding-top:14px}
  .whyx2-head{flex-direction:column;align-items:flex-start;gap:0;margin-bottom:30px;padding-bottom:22px}
  .whyx2-meta{display:none}
  .whyx2-row{grid-template-columns:1fr;gap:14px;padding:30px 0}
  .whyx2-num{font-size:44px;gap:11px}
  .whyx2-num .sig{width:7px;height:7px}
  .whyx2-row::before{width:28px}
  .whyx2-row.in .whyx2-num{color:#5a5f66}
  .whyx2-body{padding-top:0}
}

/* — Accessibilité mouvement : neutralise tick + transitions, états finaux lisibles — */
@media(prefers-reduced-motion:reduce){
  .whyx2-row::before,.whyx2-num,.whyx2-num .sig,.whyx2-tag{transition:none}
  .whyx2-row::before{transform:scaleX(1)}
  .whyx2-row.in .whyx2-num .sig{background:var(--blue)}
}


/* Confirmation de formulaire (envoi réel par mail) */
.fok{text-align:center;padding:18px 8px}
.fok-check{width:54px;height:54px;border-radius:50%;margin:0 auto 16px;background:rgba(0,153,255,.14);border:1px solid rgba(0,153,255,.42);position:relative}
.fok-check::after{content:"";position:absolute;left:19px;top:13px;width:11px;height:21px;border:solid var(--blue);border-width:0 3px 3px 0;transform:rotate(45deg)}
.fok h3{font-family:var(--display);font-weight:500;font-size:22px;letter-spacing:-.02em;color:#fff;margin:0 0 8px}
.fok p{color:var(--muted);font-size:15px;line-height:1.55;margin:0}
.form-err{color:var(--red,#ef4444)!important;text-align:center;margin-top:10px!important}
.form-err a{color:var(--blue);text-decoration:underline}
button[disabled]{opacity:.65;cursor:default}


/* ============ THÈME CLAIR — pages d'articles OS (lecture + liste) ============
   theme-light sur <html>. On bascule les tokens (flippe la majorité) + corrections ciblées. */
html.theme-light{color-scheme:light}
html.theme-light, html.theme-light body{
  --canvas:#ffffff; --s1:#f6f7f9; --s2:#eef1f4; --hair:#e6e9ee; --hair-soft:#edf0f4;
  --ink:#0e1116; --muted:#566070;
  background:#ffffff; color:var(--ink);
}
/* Hero d'article/liste */
html.theme-light .pghero .pgglow{background:radial-gradient(760px 460px at 50% 0%,rgba(0,153,255,.09),transparent)}
html.theme-light .pgcrumb, html.theme-light .pgcrumb a, html.theme-light .pgcrumb span{color:#828a95}
html.theme-light .pgcrumb a:hover{color:#0a7fd6}
html.theme-light .eyebrow{color:#566070;background:#eef1f5;border-color:#e2e6ec;box-shadow:none}
html.theme-light .lead{color:#454e5b}
/* Titres dégradés -> solides lisibles sur blanc */
html.theme-light .grad-blue{-webkit-text-fill-color:initial!important;background:none!important;color:#0a7fd6!important}
html.theme-light .h-display, html.theme-light .h-sec{color:#0e1116}
html.theme-light .h-display{font-weight:600}
/* Corps d'article */
html.theme-light .post h1, html.theme-light .post h2{color:#0e1116}
html.theme-light .post h3{color:#0e1116}
html.theme-light .post p, html.theme-light .post li{color:#3b4350}
html.theme-light .post .lead{color:#454e5b}
html.theme-light .post a{color:#0a7fd6}
html.theme-light .post strong, html.theme-light .post b{color:#0e1116}
html.theme-light .artbhero{border-color:#e6e9ee;box-shadow:0 18px 50px rgba(12,30,60,.12)}
/* Liste : cartes + filtres */
html.theme-light .bcardlink{background:#ffffff;border-color:#e6e9ee;box-shadow:0 1px 3px rgba(12,24,48,.05)}
html.theme-light .bcardlink:hover{border-color:#bcd9f5;box-shadow:0 16px 38px rgba(12,30,60,.12)}
html.theme-light .bcardlink h3{color:#0e1116}
html.theme-light .bcardlink p{color:#566070}
html.theme-light .bcardlink .bk, html.theme-light .bk{color:#6b7480}
html.theme-light .more{color:#0a7fd6}
html.theme-light .bfchip{background:#f1f4f8;border-color:#e2e6ec;color:#3b4350}
html.theme-light .bfchip:hover{border-color:#bcd9f5}
html.theme-light .bfchip.on{background:#0e1116;color:#ffffff;border-color:#0e1116}
/* FAQ / accordéons (s'ils utilisent surfaces tokens c'est déjà flippé ; on assure les bordures/texte) */
html.theme-light .faq, html.theme-light .acc, html.theme-light details{border-color:#e6e9ee}
html.theme-light summary{color:#0e1116}
/* Footer clair */
html.theme-light footer{border-top-color:#e6e9ee}
html.theme-light footer h4{color:#9aa2ad}
html.theme-light footer a, html.theme-light footer p{color:#566070}
html.theme-light footer a:hover{color:#0e1116}
/* Légal / petites mentions */
html.theme-light .legal{color:#8a929d}


/* ---- Nav CLAIRE sur le thème blanc (barre visible + sélecteur langue lisible) ---- */
html.theme-light nav .navpill{background:rgba(255,255,255,.86)!important;border-color:rgba(15,23,42,.10)!important;box-shadow:0 10px 34px rgba(15,30,60,.13)!important}
html.theme-light nav.scrolled .navpill{background:rgba(255,255,255,.94)!important;border-color:rgba(15,23,42,.13)!important}
html.theme-light nav .links a{color:#3b4350}
html.theme-light nav .links a:hover,html.theme-light nav .links a.on{color:#0e1116;background:rgba(15,23,42,.06)}
/* sélecteur de langue (résumé + menu) */
html.theme-light .langsel>summary{background:#fff;color:#3b4350;border-color:rgba(15,23,42,.12)}
html.theme-light .langsel>summary:hover{background:#f1f4f8;border-color:rgba(15,23,42,.22)}
html.theme-light .langsel-menu{background:#fff;border-color:rgba(15,23,42,.10);box-shadow:0 18px 50px rgba(15,30,60,.16)}
html.theme-light .langsel-menu a{color:#1e242c}
html.theme-light .langsel-menu a:hover{background:#f1f4f8}
html.theme-light .langsel-menu .lsl{color:#9aa2ad}
/* CTA "Demander une démo" : sombre pour ressortir sur nav claire */
html.theme-light nav .navpill>.btn.btn-w{background:#0e1116;color:#fff;border-color:#0e1116}
/* bouton téléphone */
html.theme-light .navtel{background:rgba(15,23,42,.05)!important;border-color:rgba(15,23,42,.15)!important}
/* burger (mobile) : icône sombre sur barre claire */
html.theme-light .burger{background:#eef1f5;border-color:#e2e6ec;color:#0e1116}
html.theme-light .burger::before{background:#0e1116;box-shadow:0 -5px 0 #0e1116,0 5px 0 #0e1116}
html.theme-light .burger.open::before{box-shadow:none}
html.theme-light .burger.open::after{background:#0e1116}

/* menu burger OUVERT en clair (sinon liens sombres sur overlay sombre = invisibles) */
html.theme-light nav .links.open{background:rgba(255,255,255,.97)!important;backdrop-filter:blur(22px) saturate(1.2)!important;border-color:rgba(15,23,42,.10)!important;box-shadow:0 30px 80px rgba(15,30,60,.20)!important}
html.theme-light nav .links.open a{color:#1e242c}
html.theme-light nav .links.open a.on{color:#0e1116;background:rgba(15,23,42,.06)}