/* =====================================================================================================================
   v9 (2026-10-17) — owner: "un truc simple où on paie et on reçoit, rien de fou" + "pas de gradient, pas que ça se voie fait par l'IA".
   Loaded LAST, on every page (body.v9). Flat surfaces, thin borders, one accent (the brand violet) for buttons and links,
   Inter everywhere in sentence case. No gradients, glows, glass, cut corners, uppercase mono labels or decorative lines.
   ===================================================================================================================== */
:root{
  --z-bg:#0c0c0e;--z-s:#141417;--z-s2:#1a1a1e;--z-ln:#26262c;--z-ln2:#34343b;
  --z-tx:#ededef;--z-mu:#a1a1aa;--z-fa:#71717a;
  --z-ac:#8d8d8d;--z-ac2:#747474;--z-ac-tx:#cbcbcb;
  --z-r:10px;--z-f:"Inter","Segoe UI",system-ui,sans-serif;
}
body.v9{
  /* re-point every older token so the other pages follow */
  --k:var(--z-bg);--k2:var(--z-bg);--s:var(--z-s);--s2:var(--z-s2);--ln:var(--z-ln);--ln2:var(--z-ln2);--tx:var(--z-tx);--mu:var(--z-mu);--fa:var(--z-fa);
  --ac:var(--z-ac);--ac2:var(--z-ac2);--ac3:var(--z-ac-tx);--on-ac:#fff;--ac-soft:rgba(141,141,141,.1);--ac-line:rgba(141,141,141,.4);--gl:transparent;
  --banner:var(--z-s);--card:var(--z-s);--D:var(--z-f);--M:var(--z-f);--B:var(--z-f);
  --bg:var(--z-bg);--bg2:var(--z-bg);--panel:var(--z-s);--panel2:var(--z-s2);--panel3:var(--z-s2);--line:var(--z-ln);--line2:var(--z-ln2);
  --text:var(--z-tx);--muted:var(--z-mu);--dim:var(--z-fa);--accent:var(--z-ac);--accent-h:var(--z-ac2);--accent-l:var(--z-ac-tx);--acc:var(--z-ac);--glow:transparent;
  background:var(--z-bg)!important;color:var(--z-tx);font-family:var(--z-f);font-size:16px;-webkit-font-smoothing:antialiased;padding-bottom:0!important}

/* ---- flatten everything: no gradients, glows, glass, text effects ---- */
/* v10 (2026-10-18): the vtweaks-style blocks (.vx) keep their light effects */
.v9 *:not(.vx,.vx *),.v9 *:not(.vx,.vx *)::before,.v9 *:not(.vx,.vx *)::after{background-image:none!important;box-shadow:none!important;text-shadow:none!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important;clip-path:none!important}
.v9 .glow,.v9 .x-final-glow,.v9 .v6-glow,.v9 .glare,.v9 .progress,.v9 .totop,.v9 .pp,.v9 .pp-bubble,.v9 .dcpop,.v9 .t-bar,.v9 .v6-dock{display:none!important}
.v9 .hl,.v9 h1 em,.v9 h2 em,.v9 .v6-head em{color:inherit!important;-webkit-text-fill-color:currentColor!important;font-style:normal}

/* ---- type: Inter, sentence case ---- */
.v9 h1,.v9 h2,.v9 h3,.v9 h4,.v9 .h-sm,.v9 .t-plan h3,.v9 .t-extra h3,.v9 .gd-card h2,.v9 .step h3,.v9 .fix h3,.v9 .panel>h2,.v9 .panel>h3,.v9 .x-ft h3,.v9 .pp-box h3,.v9 .dcpop h3{
  font-family:var(--z-f)!important;text-transform:none!important;letter-spacing:-.015em!important;font-weight:650;line-height:1.15}
.v9 .page-head h1,.v9 .t-head h1{font-size:clamp(32px,4.4vw,48px);line-height:1.1}
.v9 .x-kick,.v9 .kicker,.v9 .eb{font:500 13px var(--z-f)!important;letter-spacing:0!important;text-transform:none!important;color:var(--z-fa)!important}
.v9 .x-kick::before,.v9 .kicker::before,.v9 .eb::before{display:none!important}
.v9 a{color:inherit}
.v9 ::selection{background:rgba(141,141,141,.35);color:#fff}
.v9 :focus-visible{outline:2px solid var(--z-ac);outline-offset:2px}
.v9 .lead,.v9 p.lead{color:var(--z-mu)}
.v9 .tw-rank,.v9 .rank,.v9 .v6-tier,.v9 .dm-risk,.v9 .dm-lock,.v9 .v6-tag,.v9 .chip,.v9 .t-badge,.v9 .pill{font-family:var(--z-f)!important;letter-spacing:0!important;text-transform:none!important}

/* ---- buttons: one flat violet, one outline ---- */
.s9-btn,.v9 .v6-btn,.v9 .btn-accent,.v9 .btn-primary,.v9 .btn-light,.v9 .btn-discord{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:44px;padding:0 20px;
  border:1px solid var(--z-ac);border-radius:8px;background:var(--z-ac)!important;color:#fff!important;font:600 15px/1 var(--z-f)!important;letter-spacing:0!important;text-transform:none!important;cursor:pointer;transition:background .15s,border-color .15s}
.s9-btn:hover,.v9 .v6-btn:hover,.v9 .btn-accent:hover,.v9 .btn-primary:hover,.v9 .btn-light:hover,.v9 .btn-discord:hover{background:var(--z-ac2)!important;border-color:var(--z-ac2)}
.s9-btn-2,.v9 .v6-btn-line,.v9 .btn-glass,.v9 .btn-ghost{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:44px;padding:0 20px;border:1px solid var(--z-ln2)!important;border-radius:8px;
  background:transparent!important;color:var(--z-tx)!important;font:500 15px/1 var(--z-f)!important;letter-spacing:0!important;text-transform:none!important;cursor:pointer}
.s9-btn-2:hover,.v9 .v6-btn-line:hover,.v9 .btn-glass:hover,.v9 .btn-ghost:hover{border-color:var(--z-mu)!important;background:var(--z-s2)!important}
.s9-btn-sm,.v9 .btn-sm,.v9 .v6-btn-sm{height:36px;padding:0 14px;font-size:14px!important}
.v9 .btn-lg{height:48px}
.v9 .btn-block{width:100%}
.v9 .btn .ic,.v9 .v6-btn .ic{width:16px;height:16px}
.v9 button:disabled{opacity:.5;cursor:not-allowed}

/* ---- header ---- */
.v9 .nav{position:sticky;top:0;z-index:50;background:var(--z-bg)!important;border-bottom:1px solid var(--z-ln)}
.v9 .nav-in{display:flex;align-items:center;gap:28px;height:60px}
.v9 .brand{display:inline-flex;align-items:center;gap:9px}
.v9 .brand::before{display:none!important}
.v9 .brand img{width:28px;height:28px;padding:0;filter:none;border-radius:50%}
.v9 .brand span{font:650 17px var(--z-f)!important;letter-spacing:-.01em!important;text-transform:none!important;color:var(--z-tx)}
.v9 .links{display:flex;gap:22px;margin:0;padding:0;background:transparent!important;border:0}
.v9 .links>a{height:auto;padding:0;font:500 14.5px var(--z-f)!important;letter-spacing:0!important;text-transform:none!important;color:var(--z-mu);background:none!important;border-radius:0}
.v9 .links>a:hover,.v9 .links>a.on{color:var(--z-tx)}
.v9 .nav-r{margin-left:auto;display:flex;align-items:center;gap:10px}
.v9 .t-acc,.v9 .me{height:36px;border:1px solid var(--z-ln2);border-radius:8px;background:transparent;color:var(--z-tx);display:inline-flex;align-items:center;justify-content:center}
.v9 .t-acc{width:36px}
.v9 .t-acc .ic{width:17px;height:17px}
.v9 .me{padding:0 10px 0 4px;gap:8px;font-size:14px}
.v9 .me img{width:26px;height:26px;border-radius:6px}
.v9 .burger{border-radius:8px;background:transparent;border:1px solid var(--z-ln2)}
@media (max-width:860px){
  .v9 .links{display:none;position:absolute;left:0;right:0;top:60px;flex-direction:column;gap:0;padding:8px 16px 14px;background:var(--z-bg)!important;border-bottom:1px solid var(--z-ln)}
  .v9 .links.open{display:flex}
  .v9 .links>a{padding:12px 0;font-size:16px!important;border-bottom:1px solid var(--z-ln)}
  .v9 .links>a:last-child{border-bottom:0}
  .v9 .burger{display:inline-flex}
  .v9 .me span{display:none}
}

/* ---- footer ---- */
.v9 .s9-foot{margin-top:40px;padding:48px 0 28px;border-top:1px solid var(--z-ln);background:var(--z-bg)!important}
.s9-foot-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:32px}
.s9-foot-grid p{margin-top:12px;max-width:300px;color:var(--z-mu);font-size:14px;line-height:1.6}
.s9-foot-grid p a{color:var(--z-ac-tx)}
.v9 .s9-foot h4{margin-bottom:12px;font:600 13px var(--z-f)!important;color:var(--z-tx)}
.s9-foot-grid div>a:not(.brand){display:block;padding:4px 0;font-size:14px;color:var(--z-mu)}
.s9-foot-grid div>a:not(.brand):hover{color:var(--z-tx)}
.s9-foot-bot{margin-top:36px;padding-top:20px;border-top:1px solid var(--z-ln);font-size:13px;color:var(--z-fa)}
@media (max-width:760px){.s9-foot-grid{grid-template-columns:1fr 1fr}.s9-foot-grid>div:first-child{grid-column:1/-1}}

/* ---- home (one page) ---- */
.s9-hero{padding:72px 0 64px;border-bottom:1px solid var(--z-ln)}
.s9-hero-in{display:grid;grid-template-columns:1fr 1.15fr;gap:56px;align-items:center}
.s9-hero h1{font-size:clamp(36px,4.6vw,54px);line-height:1.05;font-weight:700;letter-spacing:-.03em!important}
.s9-lead{margin-top:20px;max-width:520px;font-size:18px;line-height:1.6;color:var(--z-mu)}
.s9-alert{margin-top:18px;padding:10px 14px;border:1px solid var(--z-ln2);border-radius:8px;font-size:14px;color:var(--z-tx);max-width:520px}
.s9-cta{display:flex;align-items:center;gap:18px;flex-wrap:wrap;margin-top:28px}
.s9-cta .s9-btn{height:48px;padding:0 24px;font-size:16px!important}
.s9-link{font-size:15px;color:var(--z-mu);text-decoration:underline;text-underline-offset:3px;text-decoration-color:var(--z-ln2)}
.s9-link:hover{color:var(--z-tx);text-decoration-color:var(--z-mu)}
.s9-meta{margin-top:18px;font-size:14px;color:var(--z-fa)}
.s9-shot{margin:0;border:1px solid var(--z-ln);border-radius:var(--z-r);overflow:hidden;background:var(--z-s)}
.s9-shot img{display:block;width:100%;height:auto}

.s9-sec{padding:72px 0;border-bottom:1px solid var(--z-ln)}
.s9-sec:last-of-type{border-bottom:0}
.s9-head{display:flex;align-items:baseline;justify-content:space-between;gap:16px;margin-bottom:28px}
.s9-head h2{font-size:clamp(26px,3vw,32px);font-weight:650}
.s9-head a{font-size:15px;color:var(--z-ac-tx)}
.s9-head a:hover{text-decoration:underline;text-underline-offset:3px}
.s9-narrow{max-width:780px}

.s9-what{display:grid;grid-template-columns:repeat(3,1fr);gap:0;margin:0;border-top:1px solid var(--z-ln)}
.s9-what>div{padding:22px 24px 24px 0;border-bottom:1px solid var(--z-ln)}
.s9-what dt{font-weight:600;font-size:16.5px}
.s9-what dd{margin:8px 0 0;color:var(--z-mu);font-size:15px;line-height:1.6}

.s9-plans{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.s9-plan{display:flex;flex-direction:column;padding:24px;border:1px solid var(--z-ln);border-radius:var(--z-r);background:var(--z-s)}
.s9-plan.main{border-color:var(--z-ac)}
.s9-plan h3{font-size:17px;font-weight:600}
.s9-price{margin-top:14px;font-size:38px;font-weight:700;letter-spacing:-.03em;line-height:1}
.s9-note{margin-top:6px;font-size:14px;color:var(--z-fa)}
.s9-plan ul{list-style:none;margin:20px 0 24px;padding:0;flex:1}
.s9-plan li{padding:7px 0 7px 22px;position:relative;font-size:15px;color:var(--z-mu);line-height:1.45}
.s9-plan li::before{content:"";position:absolute;left:2px;top:13px;width:10px;height:6px;border-left:2px solid var(--z-ac-tx);border-bottom:2px solid var(--z-ac-tx);transform:rotate(-45deg)}
.s9-plan .s9-btn{width:100%}
.s9-os{margin-top:20px;font-size:15px;color:var(--z-mu)}
.s9-inline{margin-left:6px;padding:0;border:0;background:none!important;color:var(--z-ac-tx);font:500 15px var(--z-f);cursor:pointer;text-decoration:underline;text-underline-offset:3px}
.s9-small{margin-top:10px;font-size:14px;color:var(--z-fa);line-height:1.6}
.s9-small b{color:var(--z-tx);font-weight:600}
.s9-small a{color:var(--z-ac-tx)}

.s9-steps{list-style:none;counter-reset:s;display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin:0 0 20px;padding:0}
.s9-steps li{counter-increment:s;padding:22px;border:1px solid var(--z-ln);border-radius:var(--z-r)}
.s9-steps li::before{content:counter(s);display:inline-grid;place-items:center;width:28px;height:28px;margin-bottom:14px;border:1px solid var(--z-ln2);border-radius:50%;font-size:14px;font-weight:600;color:var(--z-tx)}
.s9-steps b{display:block;font-weight:600;font-size:16px}
.s9-steps span{display:block;margin-top:8px;color:var(--z-mu);font-size:15px;line-height:1.6}

.s9-reviews{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.s9-reviews figure{margin:0;display:flex;flex-direction:column;justify-content:space-between;gap:18px;padding:22px;border:1px solid var(--z-ln);border-radius:var(--z-r)}
.s9-reviews blockquote{margin:0;font-size:15px;line-height:1.6;color:var(--z-tx);display:-webkit-box;-webkit-line-clamp:7;-webkit-box-orient:vertical;overflow:hidden}
.s9-reviews figcaption{display:flex;align-items:center;gap:10px;font-size:14px;color:var(--z-mu)}
.s9-reviews figcaption img{border-radius:50%}
.s9-reviews time{margin-left:auto;color:var(--z-fa);font-size:13px}

/* FAQ (all pages) */
.v9 .faq{border-top:1px solid var(--z-ln)}
.v9 .faq details{border:0!important;border-bottom:1px solid var(--z-ln)!important;background:transparent!important;border-radius:0!important;padding:0}
.v9 .faq summary{padding:18px 32px 18px 0;font:600 16px var(--z-f)!important;position:relative;cursor:pointer;list-style:none}
.v9 .faq summary::-webkit-details-marker{display:none}
.v9 .faq p{padding:0 0 18px;margin:0;color:var(--z-mu);font-size:15px;line-height:1.65}
.v9 .x-plus{position:absolute;right:4px;top:50%;width:12px;height:12px;margin-top:-6px}
.v9 .x-plus::before,.v9 .x-plus::after{background:var(--z-mu)!important}

/* ---- every other page: flat cards, square-ish corners, no colour washes ---- */
.v9 .t-plan,.v9 .t-extra,.v9 .t-why-card,.v9 .t-barbox,.v9 .rv,.v9 .t-rv-score,.v9 .t-rv-filters,.v9 .t-order,.v9 .panel,.v9 .lic,.v9 .kpi,.v9 .step,.v9 .fix,.v9 .tw,.v9 .gd-card,.v9 .tl-tile,.v9 .tl-bar,.v9 .gd-toc,
.v9 .t-pay-strip,.v9 .svc-row,.v9 .overall,.v9 .note,.v9 .empty,.v9 .login,.v9 .t-ben,.v9 .x-cmpt,.v9 .ck-box,.v9 .gd-hk,.v9 .gd-tip,.v9 .alert,.v9 .tl-search,.v9 .lg-lang,.v9 .shot,.v9 .x-feat,.v9 .upd-note,.v9 .lb-stage{
  background-color:var(--z-s)!important;border:1px solid var(--z-ln)!important;border-radius:var(--z-r)!important}
.v9 .t-plan.best,.v9 .gd-hk{border-color:var(--z-ac)!important}
.v9 .shot-bar{border-radius:0;background:var(--z-s2)!important}
.v9 .t-plan-ic,.v9 .t-ben-ic,.v9 .picon,.v9 .ticon,.v9 .t-order-ic,.v9 .v6-ic,.v9 .v8-ic{background:transparent!important;border:1px solid var(--z-ln2)!important;border-radius:8px!important;color:var(--z-tx)!important}
.v9 .chip,.v9 .tl-chips button,.v9 .t-rv-filters button,.v9 .upd-filters .chip,.v9 .lg-more a{border-radius:999px!important;background:transparent!important;border:1px solid var(--z-ln2)!important;color:var(--z-mu)!important}
.v9 .chip.on,.v9 .tl-chips button.on,.v9 .t-rv-filters button.on,.v9 .lg-lang a.on{background:var(--z-tx)!important;border-color:var(--z-tx)!important;color:var(--z-bg)!important}
.v9 .t-badge,.v9 .pp-tag,.v9 .v6-best{background:var(--z-s2)!important;color:var(--z-tx)!important;border:1px solid var(--z-ln2);border-radius:6px!important}
.v9 .rv-play{background:var(--z-ac)!important;color:#fff!important}
.v9 input:not([type=checkbox]):not([type=radio]),.v9 select,.v9 textarea{background:var(--z-bg)!important;border:1px solid var(--z-ln2)!important;border-radius:8px!important;color:var(--z-tx)}
.v9 .legal .panel a,.v9 .gd-body a,.v9 a.ulink,.v9 .ck-tos a,.v9 .ck-fr a,.v9 .ck-link,.v9 .gd-go{color:var(--z-ac-tx)!important}
.v9 .page-head,.v9 .t-head{padding-top:64px!important}
.v9 .t-sec,.v9 .x-sec{border-top:1px solid var(--z-ln)}
.v9 .t-alt{background:transparent!important}
.v9 .tw-rank.r2,.v9 .rank.r2{background-color:var(--z-ac)!important;color:#fff!important;border-color:var(--z-ac)!important}
.v9 .tw-rank.r1,.v9 .rank.r1{background-color:transparent!important;color:var(--z-ac-tx)!important}
.v9 .tw-rank.r0,.v9 .rank.r0{background-color:transparent!important}
.v9 .dm-sw{background:#2a2a30!important}.v9 .dm-row.is-on .dm-sw{background:var(--z-ac)!important}

/* checkout modal */
.v9 .ck{background:rgba(0,0,0,.7)!important}
.v9 .ck-m,.v9 .ck-prod,.v9 .ck-acc,.v9 .ck-login,.v9 .ck-tos,.v9 .ck-promo,.v9 .ck-code-row input{border-radius:8px!important;background-color:var(--z-bg)!important;border-color:var(--z-ln2)!important}
.v9 .ck-m:has(input:checked){border-color:var(--z-ac)!important}
.v9 .ck-login{border-color:var(--z-ln2)!important}
.v9 .ck-tos input:checked+.ck-box-c{background:var(--z-ac)!important;border-color:var(--z-ac)!important}

/* reveal-on-scroll animations are part of the "made by a template" feel: show everything at once */
.v9 .reveal{opacity:1!important;transform:none!important;transition:none!important}

@media (max-width:980px){
  .s9-hero-in{grid-template-columns:1fr;gap:40px}
  .s9-what,.s9-plans,.s9-steps,.s9-reviews{grid-template-columns:1fr 1fr}
}
@media (max-width:640px){
  .s9-hero{padding:44px 0 44px}
  .s9-sec{padding:52px 0}
  .s9-what,.s9-plans,.s9-steps,.s9-reviews{grid-template-columns:1fr}
  .s9-what>div{padding-right:0}
  .s9-cta{flex-direction:column;align-items:stretch;gap:12px}
  .s9-cta .s9-link{text-align:center}
  .v9 .nav-r .s9-btn-sm{display:none}
  .v9 .nav-in{gap:12px}
}
@media (max-width:560px){.v9 .nav .brand span{display:inline!important}}

/* ---- 2026-10-17 "ajoute du violet": flat violet accents only (no gradients, no glow) ---- */
.s9-v{color:var(--z-ac)}
.s9-hero{background:#100e17!important;border-bottom-color:#241f36}
.s9-sec:nth-of-type(odd){background:#0f0d15!important}
.s9-sec{border-bottom-color:#211d30}
.s9-head h2{position:relative;padding-left:16px}
.s9-head h2::before{content:"";position:absolute;left:0;top:.18em;bottom:.18em;width:4px;border-radius:2px;background:var(--z-ac)}
.s9-what{border-top-color:#2d2d2d}
.s9-what>div{border-bottom-color:#2d2d2d}
.s9-what dt{display:flex;align-items:center;gap:10px;color:#fff}
.s9-what dt::before{content:"";width:8px;height:8px;border-radius:2px;background:var(--z-ac);flex:none}
.s9-plan{position:relative}
.s9-plan.main{border:2px solid var(--z-ac);background:#17132a!important}
.s9-plan.main .s9-price{color:#fff}
.s9-tag{position:absolute;top:-12px;left:22px;padding:4px 10px;border-radius:6px;background:var(--z-ac);color:#fff;font-size:12.5px;font-weight:600}
.s9-steps li{background:var(--z-s)}
.s9-steps li::before{background:var(--z-ac);border-color:var(--z-ac);color:#fff}
.s9-reviews figure{background:var(--z-s);border-left:3px solid var(--z-ac)}
.v9 .faq summary:hover{color:var(--z-ac-tx)}
.v9 .faq details[open] summary{color:var(--z-ac-tx)}
.v9 .x-plus::before,.v9 .x-plus::after{background:var(--z-ac)!important}
.v9 .links>a.on{color:#fff;box-shadow:inset 0 -2px 0 var(--z-ac)!important;padding-bottom:4px}
.v9 .links>a:hover{color:var(--z-ac-tx)}
.v9 .nav{border-bottom-color:#241f36}
.s9-meta{color:var(--z-ac-tx)}
.v9 .s9-foot{border-top:2px solid var(--z-ac)}
.v9 .s9-foot h4{color:var(--z-ac-tx)!important}

/* ---- 2026-10-17 "ajoute plus d'effets et d'animations": motion, still flat (no glow, no gradient) ---- */
@keyframes s9up{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
@keyframes s9fade{from{opacity:0;transform:translateY(10px) scale(.985)}to{opacity:1;transform:none}}
/* hero: text lines arrive one after the other, the app window right after */
.s9-hero-txt>*{animation:s9up .6s cubic-bezier(.2,.7,.2,1) both}
.s9-hero-txt>*:nth-child(2){animation-delay:.08s}.s9-hero-txt>*:nth-child(3){animation-delay:.16s}
.s9-hero-txt>*:nth-child(4){animation-delay:.24s}.s9-hero-txt>*:nth-child(5){animation-delay:.32s}
.s9-shot{animation:s9fade .8s .2s cubic-bezier(.2,.7,.2,1) both}
/* blocks that rise in on scroll (classes added by site.js, so no JS = everything visible) */
.v9 .s9-r{transition:opacity .55s cubic-bezier(.2,.7,.2,1) var(--d,0ms),transform .55s cubic-bezier(.2,.7,.2,1) var(--d,0ms),border-color .2s,background-color .2s!important}
.v9 .s9-r:not(.s9-in){opacity:0!important;transform:translateY(16px)!important}
/* section title bar grows in */
.s9-head h2::before{transform-origin:50% 100%;transition:transform .5s .1s cubic-bezier(.2,.7,.2,1)}
.s9-head.s9-r:not(.s9-in) h2::before{transform:scaleY(0)}

/* hero slideshow */
.s9-shot{display:flex;flex-direction:column;gap:0}
.s9-shot-stage{position:relative;aspect-ratio:1600/1032;transition:transform .35s cubic-bezier(.2,.7,.2,1);transform-style:preserve-3d}
.s9-shot-stage img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transform:scale(1.015);transition:opacity .6s ease,transform 1.2s ease}
.s9-shot-stage img.on{opacity:1;transform:none}
.s9-shot-tabs{display:flex;gap:4px;padding:8px;border-top:1px solid var(--z-ln);background:var(--z-s)}
.s9-shot-tabs button{flex:1;height:30px;border:0;border-radius:6px;background:transparent;color:var(--z-fa);font:500 13px var(--z-f);cursor:pointer;position:relative;overflow:hidden;transition:color .2s,background .2s}
.s9-shot-tabs button:hover{color:var(--z-tx);background:var(--z-s2)}
.s9-shot-tabs button.on{color:#fff;background:var(--z-s2)}
.s9-shot-tabs button.on::after{content:"";position:absolute;left:0;bottom:0;height:2px;width:100%;background:var(--z-ac);transform-origin:left;animation:s9bar 4.5s linear both}
.s9-shot:hover .s9-shot-tabs button.on::after{animation-play-state:paused}
@keyframes s9bar{from{transform:scaleX(0)}to{transform:scaleX(1)}}

/* hovers: cards lift a little and their border turns violet */
.s9-plan,.s9-steps li,.s9-reviews figure,.v9 .step,.v9 .fix,.v9 .gd-card,.v9 .tw,.v9 .rv{transition:transform .25s cubic-bezier(.2,.7,.2,1),border-color .2s,background-color .2s}
.s9-plan:hover,.s9-steps li:hover,.s9-reviews figure:hover,.v9 .gd-card:hover,.v9 .tw:hover{transform:translateY(-4px)!important;border-color:#505050!important}
.s9-plan.main:hover{border-color:#aeaeae!important}
.s9-what>div{transition:padding-left .25s cubic-bezier(.2,.7,.2,1)}
.s9-what>div:hover{padding-left:8px}
.s9-what>div:hover dt{color:var(--z-ac-tx)}
.s9-what dt::before{transition:transform .25s}
.s9-what>div:hover dt::before{transform:rotate(45deg) scale(1.15)}
.s9-steps li::before{transition:transform .3s cubic-bezier(.2,.7,.2,1)}
.s9-steps li:hover::before{transform:scale(1.12)}

/* buttons: lift on hover, press on click; links slide */
.s9-btn,.v9 .v6-btn,.v9 .btn-accent,.v9 .btn-primary,.v9 .btn-discord,.s9-btn-2,.v9 .v6-btn-line,.v9 .btn-glass{transition:background .15s,border-color .15s,transform .15s cubic-bezier(.2,.7,.2,1)!important}
.s9-btn:hover,.v9 .v6-btn:hover,.v9 .btn-accent:hover,.v9 .btn-primary:hover,.v9 .btn-discord:hover,.s9-btn-2:hover,.v9 .v6-btn-line:hover,.v9 .btn-glass:hover{transform:translateY(-2px)}
.s9-btn:active,.v9 .v6-btn:active,.v9 .btn-accent:active,.s9-btn-2:active,.v9 .btn-glass:active{transform:translateY(0) scale(.98)}
.s9-head a{display:inline-flex;align-items:center;gap:6px}
.s9-head a::after{content:"→";transition:transform .2s}
.s9-head a:hover::after{transform:translateX(4px)}
.s9-link,.s9-inline{transition:color .2s,text-decoration-color .2s}

/* FAQ: the answer slides in when a question opens, the + turns into × */
.v9 .faq details[open] p{animation:s9up .35s cubic-bezier(.2,.7,.2,1)}
.v9 .x-plus{transition:transform .25s cubic-bezier(.2,.7,.2,1)}
.v9 .faq details[open] .x-plus{transform:rotate(45deg)}

/* header line + scroll progress */
.s9-prog{position:fixed;left:0;top:0;right:0;height:2px;z-index:60;background:var(--z-ac);transform-origin:left;transform:scaleX(0);pointer-events:none}
.v9 .nav{transition:background-color .2s,border-color .2s}
.v9 .links>a{transition:color .2s}

/* checkout window opens with a small rise */
.v9 .ck.on .ck-box{animation:s9fade .3s cubic-bezier(.2,.7,.2,1)}

/* ---- 2026-10-17 "plus d'effets, d'animations, de couleur" — still flat: solid violets, no gradient / glow ---- */
:root{--z-v1:#8d8d8d;--z-v2:#aeaeae;--z-v3:#cbcbcb;--z-v4:#747474;--z-vbg:#1d1d1d;--z-vbg2:#262626}
/* hero: rotating last word */
.s9-rot{display:inline-grid;vertical-align:bottom;overflow:hidden;padding-bottom:.08em}
.s9-rot b{grid-area:1/1;font-weight:inherit;transition:transform .5s cubic-bezier(.2,.7,.2,1),opacity .5s}
.s9-rot b.in{transform:translateY(100%);opacity:0}
.s9-rot b.out{transform:translateY(-100%);opacity:0}
/* hero: small counters */
.s9-stats{display:flex;flex-wrap:wrap;gap:8px;margin-top:18px}
.s9-stats span{display:inline-flex;align-items:baseline;gap:6px;padding:7px 12px;border-radius:8px;background:var(--z-vbg);border:1px solid #3e3e3e;font-size:13.5px;color:var(--z-v3);transition:transform .2s,border-color .2s,background-color .2s}
.s9-stats b{font-size:15px;font-weight:700;color:#fff;font-variant-numeric:tabular-nums}
.s9-stats span:hover{transform:translateY(-2px);border-color:var(--z-v1);background:var(--z-vbg2)}
.s9-hero-txt>*:nth-child(6){animation-delay:.4s}
/* hero: flat violet block offset behind the app window + slow growth on scroll */
.s9-shot{position:relative;overflow:visible!important;isolation:isolate;border:0!important;background:transparent!important;scale:var(--grow,1);transition:scale .15s linear}
.s9-shot::before{content:"";position:absolute;inset:0;z-index:-1;border-radius:var(--z-r);background:var(--z-v1);transform:translate(14px,14px);transition:transform .4s cubic-bezier(.2,.7,.2,1)}
.s9-shot:hover::before{transform:translate(18px,18px)}
.s9-shot-stage{border:1px solid #3e3e3e;border-bottom:0;border-radius:var(--z-r) var(--z-r) 0 0;overflow:hidden;background:var(--z-s)}
.s9-shot-tabs{border:1px solid #3e3e3e;border-radius:0 0 var(--z-r) var(--z-r)}
.s9-shot-tabs button.on{background:var(--z-vbg2)}
/* primary buttons: the magnetic move + an arrow that slides in */
.s9-btn{transition:background .15s,border-color .15s,transform .15s cubic-bezier(.2,.7,.2,1),translate .25s cubic-bezier(.2,.7,.2,1)!important}
.s9-cta .s9-btn::after,.s9-plan.main .s9-btn::after{content:"→";display:inline-block;margin-left:2px;transition:transform .2s}
.s9-cta .s9-btn:hover::after,.s9-plan.main .s9-btn:hover::after{transform:translateX(4px)}
/* what's in it: numbers, and a violet fill that slides in on hover */
.s9-what dt::before{display:none!important}
.s9-n{display:inline-grid;place-items:center;min-width:30px;height:22px;margin-right:10px;padding:0 6px;border-radius:6px;background:var(--z-vbg2);color:var(--z-v2);font-size:12px;font-weight:700;font-variant-numeric:tabular-nums;transition:background-color .25s,color .25s}
.s9-what>div{position:relative;isolation:isolate;padding-left:12px!important;padding-right:20px;border-radius:0}
.s9-what>div::before{content:"";position:absolute;inset:0;z-index:-1;background:var(--z-vbg);transform:scaleX(0);transform-origin:left;transition:transform .35s cubic-bezier(.2,.7,.2,1)}
.s9-what>div:hover{padding-left:20px!important}
.s9-what>div:hover::before{transform:scaleX(1)}
.s9-what>div:hover .s9-n{background:var(--z-v1);color:#fff}
/* price: Premium card more violet, its tag breathes */
.s9-plan.main{background:var(--z-vbg)!important}
.s9-plan.main .s9-price{color:var(--z-v3)}
.s9-plan.main li::before{border-color:var(--z-v2)}
.s9-tag{animation:s9tag 2.4s ease-in-out infinite}
@keyframes s9tag{0%,100%{transform:translateY(0)}50%{transform:translateY(-3px)}}
.s9-plan:not(.main):hover{background:#17131f!important}
/* steps: the number fills on hover, a violet line under each card draws in */
.s9-steps li{position:relative;overflow:hidden}
.s9-steps li::after{content:"";position:absolute;left:0;right:0;bottom:0;height:3px;background:var(--z-v1);transform:scaleX(0);transform-origin:left;transition:transform .4s cubic-bezier(.2,.7,.2,1)}
.s9-steps li:hover::after,.s9-steps li.s9-in::after{transform:scaleX(1)}
.s9-steps li.s9-in::after{transition-delay:calc(var(--d,0ms) + .35s)}
/* reviews: quote mark in violet */
.s9-reviews blockquote::before{content:"\201C";display:block;height:.5em;margin-bottom:6px;font-size:44px;line-height:1;color:var(--z-v1);font-family:Georgia,serif}
/* section colours: alternate flat violet-black backgrounds */
.s9-sec:nth-of-type(even){background:#0c0b10!important}
.s9-sec:nth-of-type(odd){background:#110d1c!important}
.s9-head h2::before{width:5px;background:var(--z-v1)}
/* FAQ: open question gets a violet bar on the left */
.v9 .faq details{position:relative}
.v9 .faq details::before{content:"";position:absolute;left:-14px;top:18px;bottom:18px;width:3px;border-radius:2px;background:var(--z-v1);transform:scaleY(0);transition:transform .3s cubic-bezier(.2,.7,.2,1)}
.v9 .faq details[open]::before{transform:scaleY(1)}
/* header + footer links: violet underline that grows */
.v9 .links>a{position:relative}
.v9 .links>a::after{content:"";position:absolute;left:0;right:0;bottom:-6px;height:2px;background:var(--z-v1);transform:scaleX(0);transition:transform .25s cubic-bezier(.2,.7,.2,1)}
.v9 .links>a:hover::after{transform:scaleX(1)}
.s9-foot-grid div>a:not(.brand){transition:color .2s,padding-left .2s}
.s9-foot-grid div>a:not(.brand):hover{color:var(--z-v3);padding-left:4px}
.v9 .s9-btn-sm{background:var(--z-v1)!important}
@media (max-width:860px){.v9 .links>a::after{display:none}}
@media (max-width:640px){.s9-shot::before{transform:translate(8px,8px)}.s9-what>div:hover{padding-left:12px!important}}

/* ---- 2026-10-17 hero app window, redone ("super moche, refais-le de A à Z"): one clean window, small tabs in its title bar,
   no violet block behind, no growth on scroll, no big tab bar underneath. Overrides the earlier .s9-shot rules. ---- */
.s9-shot{position:relative;overflow:hidden!important;isolation:auto;scale:none!important;transition:none;
  border:1px solid #303030!important;border-radius:12px;background:#0e0c15!important}
.s9-shot::before{content:none!important;display:none!important}
.s9-win-bar{display:flex;align-items:center;gap:12px;height:40px;padding:0 8px 0 14px;border-bottom:1px solid #272727;background:#13111c}
.s9-win-t{display:inline-flex;align-items:center;gap:8px;font-size:13px;font-weight:600;color:var(--z-tx);white-space:nowrap}
.s9-win-t img{width:16px;height:16px;border-radius:50%}
.s9-shot .s9-shot-tabs{display:flex;gap:2px;margin-left:auto;padding:0;border:0!important;border-radius:0!important;background:none!important}
.s9-shot .s9-shot-tabs button{flex:none;height:26px;padding:0 10px;border:0;border-radius:6px;background:transparent!important;color:var(--z-fa);font:500 12px var(--z-f);cursor:pointer;position:relative;overflow:hidden;transition:color .2s,background-color .2s}
.s9-shot .s9-shot-tabs button:hover{color:var(--z-tx);background:#1d1a2b!important}
.s9-shot .s9-shot-tabs button.on{color:#fff;background:#262626!important}
.s9-shot .s9-shot-tabs button.on::after{content:"";position:absolute;left:8px;right:8px;bottom:3px;height:2px;border-radius:1px;background:var(--z-v1);transform-origin:left;animation:s9bar 4.5s linear both}
.s9-shot .s9-shot-stage{border:0!important;border-radius:0!important;background:#0e0c15}
.s9-shot:hover .s9-shot-tabs button.on::after{animation-play-state:paused}
@media (max-width:640px){
  .s9-win-t span,.s9-win-t{font-size:12px}
  .s9-shot .s9-shot-tabs button{padding:0 7px;font-size:11px}
  .s9-win-t{font-size:0;gap:0}.s9-win-bar{gap:6px;padding:0 6px 0 10px}
}

/* ---- 2026-10-17 header full width ("tout à gauche, le truc Discord et Buy à droite"): logo + links hug the left edge, account + Buy the right edge ---- */
.v9 .nav .wrap.nav-in{max-width:none;width:100%;padding:0 32px}
@media (max-width:640px){.v9 .nav .wrap.nav-in{padding:0 16px}}

/* ---- 2026-10-17 "améliore ×100": supported games, Free vs Premium table, closing block, phone buy bar — flat violets only ---- */
/* games strip */
.s9-games{padding:28px 0;border-bottom:1px solid #211d30;background:#0c0b10!important}
.s9-games-in{display:flex;align-items:center;gap:28px;flex-wrap:wrap;justify-content:space-between}
.s9-games p{display:flex;flex-direction:column;gap:2px;font-size:14px;color:var(--z-fa);max-width:260px}
.s9-games p b{font-size:15px;color:var(--z-tx);font-weight:600}
.s9-games ul{display:flex;flex-wrap:wrap;gap:8px;margin:0;padding:0;list-style:none}
.s9-games li{width:48px;height:48px;display:grid;place-items:center;border:1px solid var(--z-ln);border-radius:10px;background:var(--z-s);transition:transform .2s cubic-bezier(.2,.7,.2,1),border-color .2s,background-color .2s}
.s9-games li img{width:30px;height:30px;border-radius:6px;object-fit:contain;filter:grayscale(.35);opacity:.9;transition:filter .2s,opacity .2s}
.s9-games li:hover{transform:translateY(-3px);border-color:var(--z-v1);background:var(--z-vbg)}
.s9-games li:hover img{filter:none;opacity:1}
.s9-games li.s9-in{transition-delay:0s}
/* Free vs Premium (folded under the plans) */
.s9-cmp{margin-top:22px;border:1px solid var(--z-ln);border-radius:var(--z-r);background:var(--z-s);overflow:hidden}
.s9-cmp summary{padding:14px 18px;font-weight:600;font-size:15px;cursor:pointer;list-style:none;display:flex;align-items:center;justify-content:space-between}
.s9-cmp summary::-webkit-details-marker{display:none}
.s9-cmp summary::after{content:"+";font-size:20px;line-height:1;color:var(--z-v2);transition:transform .25s}
.s9-cmp[open] summary::after{transform:rotate(45deg)}
.s9-cmp summary:hover{color:var(--z-v3)}
.s9-cmp table{width:100%;border-collapse:collapse;font-size:14.5px}
.s9-cmp th,.s9-cmp td{padding:10px 18px;text-align:left;border-top:1px solid var(--z-ln)}
.s9-cmp th{font-size:13px;color:var(--z-fa);font-weight:600}
.s9-cmp th:nth-child(n+2),.s9-cmp td:nth-child(n+2){text-align:center;width:22%}
.s9-cmp th:last-child{color:var(--z-v3)}
.s9-cmp td:last-child{background:#191919}
.s9-cmp tr.g td{padding-top:16px;font-size:12.5px;font-weight:700;color:var(--z-v2);text-transform:uppercase;letter-spacing:.05em!important;background:transparent}
.s9-cmp tr.p td{font-weight:700;color:#fff}
.s9-cmp .y{display:inline-grid;place-items:center;width:22px;height:22px;border-radius:50%;background:var(--z-vbg2);color:var(--z-v2)}
.s9-cmp .y .ic{width:13px;height:13px}
.s9-cmp .n{color:#4d4d4d}
.s9-cmp[open] table{animation:s9up .35s cubic-bezier(.2,.7,.2,1)}
/* closing block */
.s9-end{padding:64px 0;background:var(--z-v1)!important}
.s9-end-in{display:flex;align-items:center;justify-content:space-between;gap:32px;flex-wrap:wrap}
.s9-end h2{font-size:clamp(26px,3.2vw,36px);font-weight:700;color:#fff;letter-spacing:-.025em!important}
.s9-end p{margin-top:10px;max-width:560px;color:#ede9fe;font-size:16px;line-height:1.6}
.s9-end-cta{display:flex;align-items:center;gap:18px;flex-wrap:wrap}
.s9-end .s9-btn{height:50px;padding:0 26px;background:#fff!important;border-color:#fff;color:#2c2c2c!important;font-size:16px!important}
.s9-end .s9-btn:hover{background:#ede9fe!important;border-color:#ede9fe}
.s9-end .s9-link{color:#ede9fe;text-decoration-color:rgba(255,255,255,.5)}
.s9-end .s9-link:hover{color:#fff}
.v9 .s9-end+.s9-dock+.ck,.v9 main>.s9-end:last-child{margin-bottom:0}
.v9 .s9-foot{margin-top:0}
/* phone buy bar */
.s9-dock{display:none}
@media (max-width:760px){
  .s9-dock{position:fixed;left:12px;right:12px;bottom:12px;z-index:55;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 10px 10px 16px;
    border:1px solid #3e3e3e;border-radius:12px;background:#15111f;font-size:14px;color:var(--z-v3);transform:translateY(140%);transition:transform .35s cubic-bezier(.2,.7,.2,1)}
  .s9-dock b{color:#fff}
  .s9-dock.on{transform:none}
  .s9-dock .s9-btn-sm{display:inline-flex!important;height:38px;padding:0 18px}
  .s9-games-in{gap:14px}
  .s9-games ul{gap:6px}
  .s9-games li{width:42px;height:42px}
  .s9-games li img{width:26px;height:26px}
  .s9-cmp th,.s9-cmp td{padding:9px 10px;font-size:13px}
  .s9-end{padding:48px 0}
}
/* games strip: one line of text, the logos spread over the full width below */
.s9-games-in{flex-direction:column;align-items:stretch;gap:16px}
.s9-games p{flex-direction:row;flex-wrap:wrap;gap:6px;max-width:none;align-items:baseline}
.s9-games ul{justify-content:space-between}
@media (max-width:760px){.s9-games ul{justify-content:flex-start}}
