/* ─────────────────────────────────────────────────────────────────────────
   ai-subscription.io — design system « Prism Pass » (refonte du 22/09/2026).
   Identité : chaque abonnement est un PASS (carte de membre : puce, statut
   « ● Active », perforation à encoches). Scène de nuit (encre #0A0C16)
   traversée d'un prisme (menthe, cyan, lilas, pêche). UN accent de marque :
   la menthe « signal » #3CF2A5, couleur de l'état ACTIF.
   Titres Bricolage Grotesque (axe opsz), texte Inter, étiquettes JetBrains
   Mono — les trois auto-hébergés (font-src 'self').
   Règle des boutons : ENCRE sur fond clair, MENTHE sur fond sombre.
   [!] CSP `style-src 'self'` : AUCUN <style> ni attribut style= ne s'applique
       (le JS écrit en CSSOM, que la CSP autorise).
   [!] Relever ASSET_V (inc/config.php) à chaque modification : le bord cache
       ce fichier 30 jours.
   [!] Un composant réservé au mobile est caché PAR DÉFAUT et montré dans sa
       requête de média — jamais l'inverse.
   [!] Sous 700 px, rien d'insécable plus large que l'écran : Chrome mobile
       élargit la vue à la largeur minimale du contenu, même clippé. Les
       rubans défilants portent `contain: inline-size`.
   [!] Polices : U+2192 (→) et U+2713 (✓) sont HORS des sous-ensembles
       latins ; flèches et coches sont des icônes SVG, jamais du texte.
   ───────────────────────────────────────────────────────────────────────── */

@font-face{font-family:'Inter';font-style:normal;font-weight:100 900;font-display:swap;src:url(/assets/fonts/inter-latin-wght-normal.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Bricolage';font-style:normal;font-weight:200 800;font-display:swap;src:url(/assets/fonts/bricolage-latin-opsz-wght.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'JB Mono';font-style:normal;font-weight:100 800;font-display:swap;src:url(/assets/fonts/jetbrains-mono-latin-wght.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}

/* ── 1. Jetons ────────────────────────────────────────────────────────── */
:root{
  --ink-950:#05060C; --ink-900:#0A0C16; --ink-850:#0E111D; --ink-800:#141826; --ink-700:#1D2234; --ink-600:#2A3046;
  --tx:#0B0D17; --tx-2:#3A3F52; --tx-3:#62687C; --tx-4:#8F94A7;
  --bg:#FFFFFF; --bg-2:#F4F5F9; --bg-3:#EAECF2;
  --line:#E3E5ED; --line-2:#CFD3DF;
  --mint:#3CF2A5; --mint-hi:#7DF8C4; --mint-ink:#08744E; --mint-soft:#E0FAEE; --mint-line:#A6ECCB;
  --lilac:#A58BFF; --cyan:#5CE1F0; --peach:#FFB48C;
  --od:#F3F5FA; --od-2:#B6BCCE; --od-3:#858CA3;
  --lnd:rgba(255,255,255,.08); --lnd-2:rgba(255,255,255,.15);
  --holo:linear-gradient(100deg,#3CF2A5 0%,#5CE1F0 34%,#A58BFF 68%,#FFB48C 100%);
  --font:'Inter',system-ui,-apple-system,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;
  --display:'Bricolage','Inter',system-ui,-apple-system,'Segoe UI',sans-serif;
  --mono:'JB Mono',ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  --wrap:1280px; --gut:24px;
  --r-sm:10px; --r:14px; --r-lg:20px; --r-xl:26px; --pill:999px;
  --sh-1:0 1px 2px rgba(10,12,22,.05),0 8px 22px -14px rgba(10,12,22,.2);
  --sh-2:0 2px 6px rgba(10,12,22,.05),0 26px 50px -24px rgba(10,12,22,.38);
  --sh-pop:0 34px 80px -26px rgba(5,6,12,.6),0 2px 10px rgba(5,6,12,.14);
  --top-h:36px; --bar-h:68px;
  --ease:cubic-bezier(.2,.7,.2,1);
  --notch-bg:#fff;
}

/* ── 2. Base ──────────────────────────────────────────────────────────── */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:calc(var(--bar-h) + 16px)}
html.has-menu{overflow:hidden}
/* [!] Garde-fou : overflow-x:clip (et non hidden) ne crée pas de conteneur de
   défilement, donc position:sticky continue de fonctionner. */
html,body{overflow-x:clip}
body{margin:0;background:var(--bg);color:var(--tx-2);font-family:var(--font);font-size:16px;line-height:1.6;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility;font-feature-settings:"cv11","ss01"}
img,svg,picture,video{display:block;max-width:100%}
img{height:auto}
a{color:inherit;text-decoration:none}
p{margin:0 0 1em}
h1,h2,h3,h4{margin:0}
ul,ol{margin:0;padding:0;list-style:none}
b,strong{font-weight:600}
small{font-size:.85em}
s{text-decoration-thickness:1px}
button,input,select,textarea{font:inherit;color:inherit}
button{cursor:pointer;background:none;border:0;padding:0}
kbd{font:inherit}
:focus-visible{outline:2px solid var(--mint-ink);outline-offset:3px;border-radius:8px}
.on-dark :focus-visible,.hd :focus-visible,.brands :focus-visible,.mnu :focus-visible,.msrch :focus-visible{outline-color:var(--mint)}
[hidden]{display:none !important}
[id]{scroll-margin-top:calc(var(--bar-h) + 16px)}
.sr{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.skip{position:absolute;left:12px;top:-80px;z-index:100;background:var(--mint);color:var(--ink-900);padding:10px 16px;border-radius:var(--pill);font-weight:700}
.skip:focus{top:12px}
.wrap{width:100%;max-width:var(--wrap);margin:0 auto;padding:0 var(--gut)}
.ic{width:20px;height:20px;flex:none;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.ic--lg{width:24px;height:24px}
.ic--sm{width:16px;height:16px}
.ic--xs{width:14px;height:14px}
.sprite{position:absolute;width:0;height:0;overflow:hidden}
.logo{display:inline-block;flex:none;color:var(--tx);vertical-align:middle}
.logo--canva{color:#00C4CC}
.on-dark .logo,.hd .logo,.brands .logo,.mnu .logo{color:#fff}
.on-dark .logo--canva,.hd .logo--canva,.brands .logo--canva,.mnu .logo--canva{color:#00C4CC}
.on-dark{color:var(--od)}

/* ── 3. Typographie, liens, boutons, pastilles ────────────────────────── */
.kicker{display:inline-flex;align-items:center;gap:.6rem;margin:0 0 1rem;font-family:var(--mono);font-size:.76rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--mint-ink)}
.kicker::before{content:"";width:7px;height:7px;border-radius:50%;background:currentColor;box-shadow:0 0 0 4px rgba(8,116,78,.14)}
.on-dark .kicker{color:var(--mint)}
.on-dark .kicker::before{box-shadow:0 0 0 4px rgba(60,242,165,.18)}
.h1,.h2,.hero__h,.cta__h{font-family:var(--display);font-weight:700;color:var(--tx);text-wrap:balance;font-optical-sizing:auto}
.h1{font-size:clamp(2.1rem,2.4vw + 1.2rem,3.2rem);line-height:1.04;letter-spacing:-.034em;margin:0 0 .45em}
.h2{font-size:clamp(1.85rem,1.5vw + 1.2rem,2.7rem);line-height:1.06;letter-spacing:-.032em;margin:0 0 .5em;max-width:24ch}
.on-dark .h2{color:#fff}
.lead{font-size:1.07rem;line-height:1.6;color:var(--tx-3);max-width:60ch;text-wrap:pretty;margin:0}
.lead a{color:var(--tx);font-weight:600;text-decoration:underline;text-decoration-color:var(--mint);text-decoration-thickness:2px;text-underline-offset:4px}
.on-dark .lead{color:var(--od-2)}
.hl{background:var(--holo);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-box-decoration-break:clone;box-decoration-break:clone}
.lnk{display:inline-flex;align-items:center;gap:.4rem;font-weight:600;font-size:.94rem;color:var(--tx);text-decoration:underline;text-decoration-color:var(--mint);text-decoration-thickness:2px;text-underline-offset:6px;transition:text-decoration-color .15s,color .15s}
.lnk:hover{text-decoration-color:currentColor}
.lnk .ic{transition:translate .18s var(--ease)}
.lnk:hover .ic{translate:3px 0}
.on-dark .lnk{color:#fff}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;height:46px;padding:0 1.3rem;border-radius:var(--pill);border:1px solid transparent;font-weight:600;font-size:.95rem;line-height:1;white-space:nowrap;cursor:pointer;transition:background-color .18s,border-color .18s,color .18s,box-shadow .18s}
.btn .ic{transition:translate .18s var(--ease)}
.btn:hover .ic--arrow{translate:3px 0}
.btn--ink{background:var(--ink-900);color:#fff}
.btn--ink:hover{background:var(--ink-600);color:#fff}
.btn--mint{background:var(--mint);color:var(--ink-900);box-shadow:0 10px 30px -12px rgba(60,242,165,.7),inset 0 -2px 0 rgba(0,0,0,.1)}
.btn--mint:hover{background:var(--mint-hi);color:var(--ink-900)}
.btn--line{background:#fff;border-color:var(--line-2);color:var(--tx)}
.btn--line:hover{background:var(--bg-2);border-color:var(--tx-4);color:var(--tx)}
.btn--glass{background:rgba(255,255,255,.07);border-color:rgba(255,255,255,.24);color:#fff}
.btn--glass:hover{background:rgba(255,255,255,.14);border-color:rgba(255,255,255,.45);color:#fff}
.btn--sm{height:40px;padding:0 1rem;font-size:.89rem}
.btn--lg{height:54px;padding:0 1.65rem;font-size:1rem}
.btn--block{width:100%}
.btns{display:flex;flex-wrap:wrap;gap:.75rem}
.dot{display:inline-block;flex:none;width:8px;height:8px;border-radius:50%;background:var(--mint);animation:pulse 2.4s var(--ease) infinite}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(60,242,165,.55)}70%{box-shadow:0 0 0 8px rgba(60,242,165,0)}100%{box-shadow:0 0 0 0 rgba(60,242,165,0)}}
.badge{display:inline-flex;align-items:center;gap:.3rem;height:24px;padding:0 .6rem;border-radius:var(--pill);font-size:.75rem;font-weight:700;letter-spacing:.01em;line-height:1;white-space:nowrap}
.badge--mint{background:var(--mint);color:var(--ink-900)}
.badge--soft{background:var(--mint-soft);color:var(--mint-ink)}
.badge--ink{background:var(--ink-900);color:#fff}
.badge--warn{background:#FFEFE5;color:#8A3309}
.note{display:flex;align-items:flex-start;gap:.5rem;margin:0;font-size:.85rem;line-height:1.55;color:var(--tx-3);max-width:74ch}
.note .ic{color:var(--tx-4);margin-top:.2rem}
.chip{display:inline-flex;align-items:center;gap:.45rem;height:34px;padding:0 .8rem 0 .55rem;border-radius:var(--pill);font-size:.86rem;font-weight:600;white-space:nowrap;transition:background-color .15s,border-color .15s,color .15s}

/* ── 4. En-tête ───────────────────────────────────────────────────────── */
.hd{position:sticky;top:calc(-1 * var(--top-h));z-index:50;background:var(--ink-900);color:var(--od)}
.hd__top{height:var(--top-h);background:var(--ink-950);border-bottom:1px solid var(--lnd);font-size:.8rem;color:var(--od-3)}
.hd__top-in{height:100%;display:flex;align-items:center;justify-content:space-between;gap:1.5rem}
.hd__usp,.hd__util{display:flex;align-items:center;white-space:nowrap}
.hd__usp li{display:inline-flex;align-items:center;gap:.5rem}
.hd__usp li + li{margin-left:1.1rem;padding-left:1.1rem;border-left:1px solid var(--lnd-2)}
.hd__usp li:first-child{color:var(--od-2);font-weight:500}
.hd__usp .ic{color:var(--mint)}
.hd__util{gap:1.35rem}
.hd__util a{color:var(--od-2);transition:color .15s}
.hd__util a:hover{color:#fff}
.hd__cur{display:inline-flex;align-items:center;gap:.4rem;padding-left:1.35rem;border-left:1px solid var(--lnd-2);color:var(--od-2);letter-spacing:.03em}
.hd__bar{height:var(--bar-h);border-bottom:1px solid var(--lnd);transition:box-shadow .2s}
.hd.is-scrolled .hd__bar{box-shadow:0 12px 30px -14px rgba(0,0,0,.7)}
.hd__bar-in{position:relative;height:100%;display:flex;align-items:center;gap:1rem}
.brand{display:inline-flex;align-items:center;gap:.65rem;flex:none;padding:.35rem 0;color:#fff}
.brand:hover{color:#fff}
.mark{width:32px;height:32px;flex:none}
.brand__name{font-family:var(--display);font-weight:700;font-size:1.15rem;letter-spacing:-.025em;white-space:nowrap}
.brand__name i{font-style:normal;color:var(--od-3);font-weight:500}
.nav{display:flex;margin-left:.6rem}
.nav__list{display:flex;align-items:center;gap:.1rem}
.nav__item{position:static}
.nav__item--dd{position:relative}
.nav__link,.nav__btn{display:inline-flex;align-items:center;gap:.3rem;height:40px;padding:0 .8rem;border-radius:var(--pill);color:var(--od-2);font-weight:500;font-size:.93rem;white-space:nowrap;transition:background-color .15s,color .15s}
.nav__link:hover,.nav__btn:hover,.nav__item.is-open .nav__btn{color:#fff;background:rgba(255,255,255,.07)}
.nav__link.is-on,.nav__btn.is-on{color:#fff}
.nav__btn--shop{color:#fff;font-weight:600}
.nav__btn--shop .ic:first-child{color:var(--mint)}
.nav__chev{color:var(--od-3);transition:rotate .2s var(--ease)}
.nav__item.is-open .nav__chev{rotate:180deg}
@media (hover:hover){
  .nav__item--mega:hover .nav__btn,.nav__item--dd:hover .nav__btn{color:#fff;background:rgba(255,255,255,.07)}
  .nav__item--mega:not(.is-shut):hover .nav__chev,.nav__item--dd:not(.is-shut):hover .nav__chev{rotate:180deg}
}

/* Recherche (barre) + suggestions */
.srch{position:relative;flex:1 1 300px;max-width:430px;margin-left:auto}
.srch__ic{position:absolute;left:15px;top:50%;translate:0 -50%;color:var(--od-3);pointer-events:none}
.srch__in{width:100%;height:44px;padding:0 2.75rem 0 2.6rem;border-radius:var(--pill);border:1px solid rgba(255,255,255,.1);background:rgba(255,255,255,.06);color:#fff;font-size:.92rem;-webkit-appearance:none;appearance:none;transition:background-color .15s,border-color .15s,box-shadow .15s}
.srch__in::placeholder{color:var(--od-3);opacity:1}
.srch__in:hover{background:rgba(255,255,255,.09)}
.srch__in:focus{outline:none;background:rgba(255,255,255,.1);border-color:rgba(60,242,165,.65);box-shadow:0 0 0 4px rgba(60,242,165,.14)}
.srch__in::-webkit-search-cancel-button,.srch__in::-webkit-search-decoration{-webkit-appearance:none;appearance:none}
.srch__kbd{position:absolute;right:12px;top:50%;translate:0 -50%;display:grid;place-items:center;min-width:24px;height:24px;padding:0 6px;border-radius:7px;border:1px solid rgba(255,255,255,.18);font-family:var(--mono);font-size:.75rem;color:var(--od-3);pointer-events:none}
.srch__in:focus ~ .srch__kbd,.srch__in:not(:placeholder-shown) ~ .srch__kbd{display:none}
.pop{position:absolute;left:0;right:0;top:calc(100% + 10px);z-index:70;min-width:380px;padding:.45rem;background:#fff;color:var(--tx);border:1px solid var(--line);border-radius:var(--r-lg);box-shadow:var(--sh-pop)}
.pop__h{margin:0;padding:.55rem .75rem .35rem;font-family:var(--mono);font-size:.75rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--tx-3)}
.pop__o{display:flex;align-items:center;gap:.8rem;min-height:52px;padding:.45rem .75rem;border-radius:14px;color:var(--tx);cursor:pointer}
.pop__o[aria-selected="true"],.pop__o:hover{background:var(--bg-2);color:var(--tx)}
.pop__lg{display:grid;place-items:center;width:34px;height:34px;border-radius:10px;border:1px solid var(--line);background:#fff;flex:none}
.pop__lg .logo{color:var(--tx)}
.pop__t{display:flex;flex-direction:column;min-width:0;line-height:1.25}
.pop__t b{font-weight:600;font-size:.93rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pop__t small{font-size:.8rem;color:var(--tx-3)}
.pop__p{margin-left:auto;padding-left:.5rem;font-weight:700;font-size:.92rem;white-space:nowrap;font-variant-numeric:tabular-nums}
.pop__p small{font-weight:500;color:var(--tx-3)}
.pop mark{background:none;color:inherit;text-decoration:underline;text-decoration-color:var(--mint);text-decoration-thickness:2px;text-underline-offset:3px}
.pop__all{display:flex;align-items:center;justify-content:space-between;gap:.5rem;margin-top:.35rem;padding:.75rem .75rem .55rem;border-top:1px solid var(--line);font-weight:600;font-size:.9rem;color:var(--tx)}
.pop__all:hover{color:var(--mint-ink)}
.pop__none{margin:0;padding:.9rem .75rem;font-size:.92rem;color:var(--tx-3)}

/* Boutons d'icône, panier, burger */
.hd__acts{display:flex;align-items:center;gap:.2rem;flex:none}
.ibtn{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:.45rem;min-width:44px;height:44px;padding:0 .65rem;border-radius:var(--pill);color:var(--od-2);font-weight:500;font-size:.9rem;white-space:nowrap;transition:background-color .15s,color .15s}
.ibtn:hover,.ibtn[aria-expanded="true"]{background:rgba(255,255,255,.08);color:#fff}
.ibtn__l{display:none}
.ibtn--search{display:none}
.ibtn__n{position:absolute;top:3px;right:1px;min-width:19px;height:19px;padding:0 5px;border-radius:var(--pill);background:var(--mint);color:var(--ink-900);font-size:.75rem;font-weight:800;line-height:19px;text-align:center;box-shadow:0 0 0 2px var(--ink-900)}
.burger{display:none;place-items:center;width:44px;height:44px;border-radius:var(--pill);color:#fff;border:1px solid var(--lnd-2)}
.burger .ic:last-child{display:none}
.burger[aria-expanded="true"] .ic:first-child{display:none}
.burger[aria-expanded="true"] .ic:last-child{display:block}

/* Méga-menu « Shop » : ouvert au survol (délai d'intention en CSS), au clic
   (.is-open) et, sans JavaScript seulement, au focus. */
.mm{position:absolute;left:var(--gut);right:var(--gut);top:calc(100% + 10px);z-index:60;color:var(--tx);background:#fff;border-radius:var(--r-xl);box-shadow:var(--sh-pop);opacity:0;visibility:hidden;translate:0 -6px;transition:opacity .18s var(--ease),translate .18s var(--ease),visibility 0s linear .18s}
.mm::before{content:"";position:absolute;left:0;right:0;top:-16px;height:16px}
.nav__item.is-open .mm,html:not(.js) .nav__item--mega:focus-within .mm{opacity:1;visibility:visible;translate:0 0;transition-delay:0s}
@media (hover:hover){.nav__item--mega:not(.is-shut):hover .mm{opacity:1;visibility:visible;translate:0 0;transition-delay:.09s}}
.mm__in{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1.5rem 2rem;padding:1.6rem 1.75rem 1.35rem}
.mm__col{min-width:0}
.mm__h{display:flex;align-items:center;gap:.6rem;margin:0 0 .55rem;padding:.2rem 0;font-family:var(--display);font-weight:700;font-size:1rem;letter-spacing:-.01em;color:var(--tx);transition:color .15s}
.mm__h:hover{color:var(--mint-ink)}
.mm__h small{font-family:var(--mono);font-weight:600;font-size:.75rem;color:var(--tx-3);letter-spacing:0}
.mm__ico{display:grid;place-items:center;width:30px;height:30px;border-radius:10px;background:var(--mint-soft);color:var(--mint-ink);flex:none}
.mm__list{display:grid;gap:.05rem}
.mm__item{display:flex;align-items:center;gap:.7rem;min-height:54px;padding:.45rem .6rem;margin:0 -.6rem;border-radius:12px;font-size:.87rem;color:var(--tx-2);transition:background-color .12s,color .12s}
.mm__item:hover{background:var(--bg-2);color:var(--tx)}
.mm__item .logo{color:var(--tx)}
.mm__item .logo--canva{color:#00C4CC}
.mm__t{display:flex;flex-direction:column;min-width:0;line-height:1.3}
.mm__name{min-width:0;font-weight:600;font-size:.92rem;color:var(--tx);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mm__t small{font-size:.78rem;color:var(--tx-3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mm__price{margin-left:auto;padding-left:.25rem;font-variant-numeric:tabular-nums;font-size:.84rem;font-weight:600;color:var(--tx-2);white-space:nowrap}
.mm__price small{font-size:.75rem;font-weight:500;color:var(--tx-3)}
.mm__foot{display:flex;align-items:center;flex-wrap:wrap;gap:.35rem 1.4rem;padding:.85rem 1.6rem;border-top:1px solid var(--line);background:var(--bg-2);border-radius:0 0 var(--r-xl) var(--r-xl)}
.mm__fl{display:inline-flex;align-items:center;gap:.5rem;padding:.35rem 0;font-weight:600;font-size:.89rem;color:var(--tx);transition:color .15s}
.mm__fl:hover{color:var(--mint-ink)}
.mm__fl .ic{color:var(--mint-ink)}
.mm__fl b{color:var(--mint-ink);font-weight:700}
.mm__note{margin-left:auto;font-size:.8rem;color:var(--tx-3)}

/* Menu « Help » */
.dd{position:absolute;right:-10px;top:calc(100% + 14px);z-index:60;width:560px;max-width:calc(100vw - 2 * var(--gut));color:var(--tx);background:#fff;border-radius:var(--r-xl);box-shadow:var(--sh-pop);opacity:0;visibility:hidden;translate:0 -6px;transition:opacity .18s var(--ease),translate .18s var(--ease),visibility 0s linear .18s}
.dd::before{content:"";position:absolute;left:0;right:0;top:-18px;height:18px}
.nav__item.is-open .dd,html:not(.js) .nav__item--dd:focus-within .dd{opacity:1;visibility:visible;translate:0 0;transition-delay:0s}
@media (hover:hover){.nav__item--dd:not(.is-shut):hover .dd{opacity:1;visibility:visible;translate:0 0;transition-delay:.09s}}
.dd__grid{display:grid;grid-template-columns:1fr 1fr;gap:.15rem;padding:.75rem}
.dd__i{display:flex;align-items:flex-start;gap:.75rem;padding:.7rem .75rem;border-radius:14px;transition:background-color .12s}
.dd__i:hover{background:var(--bg-2)}
.dd__i .ic{color:var(--mint-ink);margin-top:.15rem}
.dd__i b{display:block;font-weight:600;font-size:.92rem;line-height:1.3;color:var(--tx)}
.dd__i small{display:block;margin-top:.15rem;font-size:.8rem;line-height:1.4;color:var(--tx-3)}
.dd__foot{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.85rem 1.1rem .85rem 1.3rem;border-top:1px solid var(--line);background:var(--bg-2);border-radius:0 0 var(--r-xl) var(--r-xl)}
.dd__foot p{display:flex;align-items:center;gap:.6rem;margin:0;font-size:.87rem;color:var(--tx-2)}
.dd__foot b{color:var(--tx)}

/* ── 5. Ruban des marques (sous l'en-tête, défile avec la page) ────────── */
.brands{background:var(--ink-900);border-bottom:1px solid var(--lnd);color:var(--od-2)}
.brands__in{display:flex;align-items:center;gap:.75rem;height:52px}
.brands__h{flex:none;font-family:var(--mono);font-size:.75rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--od-3)}
.brands__list{flex:1;min-width:0;display:flex;align-items:center;gap:.1rem;margin-left:-.72rem;overflow-x:auto;scrollbar-width:none;contain:inline-size;-webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 48px),transparent);mask-image:linear-gradient(90deg,#000 calc(100% - 48px),transparent)}
.brands__list::-webkit-scrollbar{display:none}
.brands__a{display:inline-flex;align-items:center;gap:.5rem;height:36px;padding:0 .72rem;border-radius:var(--pill);font-size:.875rem;font-weight:500;white-space:nowrap;color:var(--od-2);transition:background-color .15s,color .15s}
.brands__a:hover,.brands__a.is-on{background:rgba(255,255,255,.07);color:#fff}
.brands__a small{font-family:var(--mono);font-size:.75rem;color:var(--od-3)}
.brands__all{flex:none;display:inline-flex;align-items:center;gap:.4rem;height:36px;padding:0 .2rem 0 .6rem;font-size:.88rem;font-weight:600;color:#fff;white-space:nowrap}
.brands__all .ic{color:var(--mint)}
.brands__all:hover{color:var(--mint)}

/* ── 6. Recherche mobile et tiroir (cachés par défaut) ─────────────────── */
.msrch{position:fixed;left:0;right:0;top:var(--bar-h);z-index:48;background:var(--ink-900);border-bottom:1px solid var(--lnd);box-shadow:0 24px 40px -20px rgba(0,0,0,.7);padding:12px 0 14px;opacity:0;translate:0 -6px;visibility:hidden;transition:opacity .18s var(--ease),translate .18s var(--ease),visibility 0s linear .18s}
.msrch.is-open{opacity:1;translate:0 0;visibility:visible;transition-delay:0s}
.msrch__f{position:relative;max-width:640px;margin:0 auto}
.msrch__f .srch__ic{left:16px;top:25px}
.msrch__in{width:100%;height:50px;padding:0 1rem 0 2.75rem;border-radius:var(--pill);border:1px solid rgba(60,242,165,.55);background:rgba(255,255,255,.08);color:#fff;font-size:16px;-webkit-appearance:none;appearance:none}
.msrch__in:focus{outline:none;box-shadow:0 0 0 4px rgba(60,242,165,.16)}
.msrch__in::placeholder{color:var(--od-3);opacity:1}
.msrch__in::-webkit-search-cancel-button{-webkit-appearance:none;appearance:none}
.msrch .pop{position:static;min-width:0;margin-top:10px;max-height:calc(100dvh - var(--bar-h) - 110px);overflow:auto}
.mnu{position:fixed;left:0;right:0;top:var(--bar-h);bottom:0;z-index:49;background:var(--ink-900);color:var(--od);overflow:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;opacity:0;translate:0 -8px;visibility:hidden;transition:opacity .2s var(--ease),translate .2s var(--ease),visibility 0s linear .2s}
.mnu.is-open{opacity:1;translate:0 0;visibility:visible;transition-delay:0s}
.mnu__in{padding:1rem var(--gut) 2.5rem}
.mnu__search{position:relative;display:flex;margin-bottom:1.25rem}
.mnu__q{flex:1;height:50px;padding:0 3.4rem 0 1.1rem;border-radius:var(--pill);border:1px solid var(--lnd-2);background:rgba(255,255,255,.06);color:#fff;font-size:16px;-webkit-appearance:none;appearance:none}
.mnu__q::placeholder{color:var(--od-3);opacity:1}
.mnu__q:focus{outline:none;border-color:rgba(60,242,165,.6);box-shadow:0 0 0 4px rgba(60,242,165,.14)}
.mnu__go{position:absolute;right:5px;top:5px;width:40px;height:40px;border-radius:50%;display:grid;place-items:center;background:var(--mint);color:var(--ink-900)}
.mnu__h{margin:0 0 .35rem;font-family:var(--mono);font-size:.75rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--od-3)}
.mnu__cat{border-bottom:1px solid var(--lnd)}
.mnu__cat summary{display:flex;align-items:center;gap:.7rem;min-height:56px;padding:.6rem 0;list-style:none;cursor:pointer;font-weight:600;font-size:1rem;color:#fff}
.mnu__cat summary::-webkit-details-marker{display:none}
.mnu__cat summary > span:not(.mnu__ci){flex:1}
.mnu__cat summary small{font-family:var(--mono);font-weight:600;font-size:.75rem;color:var(--od-3)}
.mnu__ci{display:grid;place-items:center;width:32px;height:32px;border-radius:10px;background:rgba(60,242,165,.1);color:var(--mint);flex:none}
.mnu__chev{color:var(--od-3);transition:rotate .2s var(--ease)}
.mnu__cat[open] .mnu__chev{rotate:180deg}
.mnu__list{padding:0 0 .6rem}
.mnu__item{display:flex;align-items:center;justify-content:space-between;gap:.75rem;min-height:48px;padding:.4rem .25rem;font-size:.95rem;color:var(--od)}
.mnu__il{display:inline-flex;align-items:center;gap:.7rem;min-width:0}
.mnu__il > span{display:flex;flex-direction:column;min-width:0;line-height:1.3}
.mnu__il small{font-size:.78rem;color:var(--od-3)}
.mnu__item b{font-weight:600;font-size:.92rem;color:#fff;white-space:nowrap}
.mnu__item b small{font-weight:500;color:var(--od-3);font-size:.78rem}
.mnu__more{display:inline-flex;align-items:center;gap:.4rem;min-height:44px;padding:.4rem .25rem;font-weight:600;font-size:.9rem;color:var(--mint)}
.mnu__links{display:grid;grid-template-columns:1fr 1fr;gap:.5rem;margin:1.4rem 0 1.25rem}
.mnu__links a{display:flex;align-items:center;gap:.6rem;min-height:52px;padding:.5rem .85rem;border-radius:var(--r);background:rgba(255,255,255,.04);border:1px solid var(--lnd);color:#fff;font-weight:600;font-size:.92rem}
.mnu__links .ic{color:var(--mint)}
.mnu__cta{margin-bottom:1.1rem}
.mnu__note{display:flex;align-items:center;gap:.6rem;margin:0;font-size:.84rem;color:var(--od-3)}

/* ── 7. Héros ─────────────────────────────────────────────────────────── */
.hero{position:relative;isolation:isolate;overflow:hidden;background:#06070F;color:var(--od)}
.hero__bg{position:absolute;inset:0;z-index:-2}
.hero__bg img{width:100%;height:100%;object-fit:cover;object-position:62% 50%}
.hero::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(90deg,rgba(6,7,15,.94) 0%,rgba(6,7,15,.82) 30%,rgba(6,7,15,.35) 56%,rgba(6,7,15,0) 78%),linear-gradient(180deg,rgba(6,7,15,.55) 0%,rgba(6,7,15,0) 22%,rgba(6,7,15,0) 70%,rgba(6,7,15,.55) 100%)}
.hero__in{display:grid;grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr);gap:2.5rem;align-items:center;padding-top:3.4rem;padding-bottom:3rem}
.hero__copy{max-width:640px}
.hero__kicker{display:inline-flex;align-items:center;gap:.6rem;margin:0 0 1.35rem;padding:.4rem .9rem .4rem .7rem;border-radius:var(--pill);background:rgba(255,255,255,.06);border:1px solid var(--lnd-2);font-size:.84rem;font-weight:500;color:var(--od-2)}
.hero__kicker b{color:#fff;font-weight:600}
.hero__h{font-size:clamp(2.25rem,2.2vw + 1.3rem,3.3rem);line-height:1.02;letter-spacing:-.038em;color:#fff;margin:0 0 1.1rem;max-width:15.5em}
.hero__p{font-size:1.08rem;line-height:1.62;color:var(--od-2);max-width:35em;text-wrap:pretty;margin:0}
.hero__p b{color:#fff;font-weight:600}
.hero__p-short{display:none}
@media (max-width:700px){.hero__p-long{display:none}.hero__p-short{display:inline}}
.hero .btns{margin-top:1.9rem}
.hero__quick{display:flex;align-items:center;gap:.5rem;margin-top:1.6rem;min-width:0}
.hero__qh{flex:none;font-family:var(--mono);font-size:.75rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--od-3);margin-right:.25rem}
.hero__ql{display:flex;gap:.45rem;flex-wrap:wrap;flex:1;min-width:0}
.hero__ql .chip{background:rgba(255,255,255,.06);border:1px solid var(--lnd-2);color:var(--od)}
.hero__ql .chip:hover{background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.35);color:#fff}
/* La pile de pass */
.hero__stack{position:relative;height:430px;max-width:560px;width:100%;justify-self:end}
.hpass{position:absolute;width:344px;animation:float 8s ease-in-out infinite}
.hpass--1{top:222px;right:200px;rotate:1deg;animation-delay:-6s;z-index:3}
.hpass--2{top:112px;right:104px;rotate:-4deg;animation-delay:-4s;z-index:2}
.hpass--3{top:0;right:0;rotate:5deg;animation-delay:-1.5s;z-index:1}
.hpass:hover,.hpass:focus-visible{z-index:5}
@keyframes float{0%,100%{translate:0 0}50%{translate:0 -10px}}
.hpass__card{position:relative;display:flex;flex-direction:column;height:212px;padding:18px 20px 16px;border-radius:22px;overflow:hidden;color:#fff;background:linear-gradient(150deg,rgba(255,255,255,.18) 0%,rgba(255,255,255,.05) 48%,rgba(255,255,255,.1) 100%),linear-gradient(rgba(8,10,20,.4),rgba(8,10,20,.4));border:1px solid rgba(255,255,255,.24);box-shadow:0 34px 60px -26px rgba(0,0,0,.85),inset 0 1px 0 rgba(255,255,255,.3);-webkit-backdrop-filter:blur(20px) saturate(160%);backdrop-filter:blur(20px) saturate(160%);transition:translate .28s var(--ease),border-color .28s,box-shadow .28s}
.hpass__card::before{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(112deg,transparent 28%,rgba(255,255,255,.16) 44%,transparent 58%)}
.hpass__card::after{content:"";position:absolute;right:-60px;bottom:-80px;width:220px;height:220px;border-radius:50%;pointer-events:none;background:radial-gradient(closest-side,rgba(60,242,165,.28),transparent)}
.hpass:hover .hpass__card,.hpass:focus-visible .hpass__card{translate:0 -8px;border-color:rgba(255,255,255,.5);box-shadow:0 40px 70px -26px rgba(0,0,0,.9),0 0 0 1px rgba(60,242,165,.25),inset 0 1px 0 rgba(255,255,255,.35)}
.hpass:focus-visible{outline:none}
.hpass__top{position:relative;display:flex;align-items:center;gap:.6rem}
.hpass__lg{display:grid;place-items:center;width:36px;height:36px;border-radius:11px;background:rgba(255,255,255,.94);flex:none}
.hpass__lg .logo{color:var(--tx)}
.hpass__v{font-size:.85rem;font-weight:500;color:rgba(255,255,255,.78)}
.hpass__st .dot{animation:none;box-shadow:0 0 0 3px rgba(60,242,165,.2)}
.hpass__st{margin-left:auto;display:inline-flex;align-items:center;gap:.45rem;font-family:var(--mono);font-size:.75rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--mint)}
.hpass__chip{position:absolute;right:20px;top:64px;width:42px;height:31px;border-radius:7px;background:repeating-linear-gradient(90deg,transparent 0 13px,rgba(10,12,22,.28) 13px 14px),repeating-linear-gradient(0deg,transparent 0 9.5px,rgba(10,12,22,.28) 9.5px 10.5px),var(--holo);opacity:.88;box-shadow:inset 0 0 0 1px rgba(255,255,255,.35)}
.hpass__name{position:relative;margin-top:.95rem;padding-right:56px;font-family:var(--display);font-weight:700;font-size:1.55rem;line-height:1.05;letter-spacing:-.025em}
.hpass__sub{position:relative;margin:.3rem 0 0;font-size:.82rem;color:rgba(255,255,255,.74)}
@media (min-width:1061px){.hpass--2 .hpass__sub,.hpass--3 .hpass__sub{visibility:hidden}.hpass--2:hover .hpass__sub,.hpass--3:hover .hpass__sub{visibility:visible}}
.hpass__foot{position:relative;display:flex;align-items:baseline;gap:.55rem;margin-top:auto;padding-top:.75rem;border-top:1px dashed rgba(255,255,255,.3)}
.hpass__price{font-family:var(--display);font-weight:700;font-size:1.45rem;letter-spacing:-.02em;line-height:1}
.hpass__price small{margin-left:.15rem;font-family:var(--font);font-size:.8rem;font-weight:500;color:rgba(255,255,255,.72);letter-spacing:0}
.hpass__off{font-size:.82rem;color:rgba(255,255,255,.62)}
.hpass__foot .badge{margin-left:auto;align-self:center}
/* Les engagements, au pied du héros */
.hero__trust{position:relative;border-top:1px solid var(--lnd);background:linear-gradient(180deg,rgba(5,6,12,.3),rgba(5,6,12,.72))}
.hero__facts{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1rem 2rem;padding-top:1.15rem;padding-bottom:1.15rem}
.hero__facts li{display:flex;align-items:center;gap:.85rem;min-width:0}
.hero__fi{display:grid;place-items:center;width:42px;height:42px;border-radius:13px;background:rgba(60,242,165,.12);border:1px solid rgba(60,242,165,.3);color:var(--mint);flex:none}
.hero__fi .ic,.ft__hi .ic,.mnu__ci .ic,.mm__ico .ic{stroke-width:2}
.hero__facts b{display:block;font-size:.94rem;font-weight:600;line-height:1.3;color:#fff}
.hero__facts b + span{display:block;font-size:.83rem;line-height:1.4;color:var(--od-3)}

/* ── 8. Sections, catalogue ───────────────────────────────────────────── */
.sec{padding:5.5rem 0;--notch-bg:#fff}
.sec--alt{background:var(--bg-2);--notch-bg:var(--bg-2)}
.sec__head{margin-bottom:2rem}
.sec__head--row{display:flex;align-items:flex-end;justify-content:space-between;gap:1.5rem 3rem;flex-wrap:wrap}
.sec__head--row > div{max-width:720px}
.fbar{display:flex;align-items:center;gap:1rem;margin-bottom:1.75rem;min-width:0}
.tabs{display:flex;gap:.45rem;overflow-x:auto;scrollbar-width:none;contain:inline-size;min-width:0;flex:1 1 auto;padding:2px}
.tabs::-webkit-scrollbar{display:none}
.tab{flex:none;display:inline-flex;align-items:center;gap:.45rem;height:42px;padding:0 1.05rem;border-radius:var(--pill);border:1px solid var(--line-2);background:#fff;color:var(--tx-2);font-weight:600;font-size:.9rem;white-space:nowrap;transition:background-color .15s,border-color .15s,color .15s}
.tab:hover{border-color:var(--tx-4);color:var(--tx)}
.tab small{font-family:var(--mono);font-size:.75rem;font-weight:600;color:var(--tx-3)}
.tab.is-on{background:var(--ink-900);border-color:var(--ink-900);color:#fff}
.tab.is-on small{color:var(--mint)}
.plans{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1.25rem}
/* La carte-pass */
.pc{position:relative;display:flex;flex-direction:column;background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);box-shadow:var(--sh-1);transition:translate .25s var(--ease),box-shadow .25s,border-color .25s;--tint:#8F94A7}
.pc:hover{translate:0 -4px;box-shadow:var(--sh-2);border-color:var(--line-2)}
.pc[hidden]{display:none !important}
.pc__glow{position:absolute;inset:0 0 auto 0;height:150px;border-radius:var(--r-lg) var(--r-lg) 0 0;pointer-events:none;background:radial-gradient(110% 100% at 100% 0%,color-mix(in srgb,var(--tint) 17%,transparent) 0%,transparent 62%)}
.pc__body{display:flex;flex-direction:column;flex:1;padding:1.25rem 1.25rem 1.1rem}
.pc__top{display:flex;align-items:center;gap:.65rem;min-height:40px}
.pc__lg{display:grid;place-items:center;width:40px;height:40px;border-radius:12px;background:#fff;border:1px solid var(--line);box-shadow:0 1px 2px rgba(10,12,22,.06);flex:none}
.pc__vendor{font-size:.84rem;font-weight:500;color:var(--tx-3);min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pc__tag{margin-left:auto}
.pc__name{margin:1rem 0 .35rem;font-family:var(--display);font-weight:700;font-size:1.3rem;line-height:1.12;letter-spacing:-.022em;color:var(--tx)}
.pc__name a::after{content:"";position:absolute;inset:0;z-index:1;border-radius:var(--r-lg)}
.pc__blurb{margin:0 0 1rem;font-size:.9rem;line-height:1.5;color:var(--tx-3)}
.pc__offers{position:relative;z-index:2;display:flex;flex-wrap:wrap;gap:.35rem;margin-top:auto}
.pc__chip{display:inline-flex;align-items:center;gap:.4rem;height:30px;padding:0 .65rem;border-radius:var(--pill);border:1px solid var(--line-2);background:#fff;font-size:.8rem;font-weight:600;color:var(--tx-2);white-space:nowrap;transition:border-color .15s,color .15s,background-color .15s}
.pc__chip b{font-weight:600;color:var(--tx-3)}
.pc__chip:hover{border-color:var(--ink-900);color:var(--tx)}
.pc__chip:hover b{color:var(--tx)}
.pc__del{display:flex;align-items:center;gap:.5rem;margin:0;font-size:.82rem;color:var(--tx-3)}
.pc__del::before{content:"";width:7px;height:7px;border-radius:50%;flex:none;background:var(--mint);box-shadow:0 0 0 3px rgba(60,242,165,.2)}
.pc__perf{position:relative;height:0;margin:0 1.25rem;border-top:1.5px dashed var(--line-2)}
.pc__perf::before,.pc__perf::after{content:"";position:absolute;top:-11px;width:22px;height:22px;border-radius:50%;background:var(--notch-bg);box-shadow:inset 0 0 0 1px var(--line)}
.pc__perf::before{left:calc(-1.25rem - 12px);clip-path:inset(0 0 0 50%)}
.pc__perf::after{right:calc(-1.25rem - 12px);clip-path:inset(0 50% 0 0)}
.pc:hover .pc__perf::before,.pc:hover .pc__perf::after{box-shadow:inset 0 0 0 1px var(--line-2)}
.pc__buy{position:relative;padding:1rem 1.25rem 1.25rem}
.pc__row{display:flex;align-items:center;justify-content:space-between;gap:.75rem}
.pc__now{margin:0;font-family:var(--display);font-weight:700;font-size:1.85rem;line-height:1;letter-spacing:-.03em;color:var(--tx);font-variant-numeric:tabular-nums}
.pc__now small{margin-left:.15rem;font-family:var(--font);font-size:.84rem;font-weight:500;letter-spacing:0;color:var(--tx-3)}
.pc__now .pc__from{margin:0 .3rem 0 0}
.pc__n{font-family:var(--mono);font-size:.75rem;font-weight:600;color:var(--tx-3);white-space:nowrap}
.pc__buy .pc__del{margin:.6rem 0 0}
.pc__acts{position:relative;z-index:2;display:flex;gap:.5rem;margin-top:.9rem}
.pc__acts .btn{flex:1}
.pc__acts .btn--line{flex:0 0 auto}
.plans__foot{display:flex;align-items:center;justify-content:space-between;gap:1rem 2rem;flex-wrap:wrap;margin-top:1.75rem}
.plans__acts{display:flex;gap:.6rem;flex-wrap:wrap}
.plans__empty{margin:1rem 0 0;padding:1.25rem;border:1px dashed var(--line-2);border-radius:var(--r);color:var(--tx-3);text-align:center}
/* Teinte discrète de l'éditeur, en haut à droite de la carte */
.pc[data-v="chatgpt"]{--tint:#10A37F}
.pc[data-v="claude"]{--tint:#D97757}
.pc[data-v="gemini"]{--tint:#4285F4}
.pc[data-v="grok"]{--tint:#6B7280}
.pc[data-v="perplexity"]{--tint:#20B8CD}
.pc[data-v="cursor"]{--tint:#6B7280}
.pc[data-v="copilot"]{--tint:#8957E5}
.pc[data-v="devin"]{--tint:#21C19A}
.pc[data-v="midjourney"]{--tint:#7C6CF2}
.pc[data-v="suno"]{--tint:#F2703C}
.pc[data-v="elevenlabs"]{--tint:#8F94A7}
.pc[data-v="runway"]{--tint:#8F94A7}
.pc[data-v="canva"]{--tint:#00C4CC}
.pc[data-v="notion"]{--tint:#8F94A7}
.pc[data-v="manus"]{--tint:#8F94A7}
.pc[data-v="lovart"]{--tint:#E14D8F}


/* ── 9. Fiche produit ─────────────────────────────────────────────────── */
.pp{padding:1.25rem 0 4.5rem}
.pp__in{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:3.5rem;align-items:start}
.pp__media{position:sticky;top:calc(var(--bar-h) + 20px);isolation:isolate;overflow:hidden;display:flex;flex-direction:column;min-height:560px;padding:1.5rem;border-radius:var(--r-xl);background-color:#06070F;background-image:url(/assets/img/hero/hero-1280.webp);background-image:image-set(url(/assets/img/hero/hero-1280.avif) type("image/avif"),url(/assets/img/hero/hero-1280.webp) type("image/webp"));background-size:cover;background-position:72% 50%}
.pp__media::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(165deg,rgba(6,7,15,.5) 0%,rgba(6,7,15,.1) 45%,rgba(6,7,15,.72) 100%)}
.pp__stage{flex:1;display:grid;place-items:center;padding:2.5rem .5rem 2rem}
.pp__pass{width:min(430px,100%);height:auto;aspect-ratio:1.6;padding:24px 26px 20px;animation:float 8s ease-in-out infinite}
.pp__pass .hpass__chip{top:74px;right:26px;width:48px;height:36px}
.pp__pass .hpass__name{margin-top:1.1rem;padding-right:64px;font-size:clamp(1.6rem,1.2vw + 1.1rem,2.1rem)}
.pp__pass .hpass__price{font-size:1.9rem}
.pp__facts{display:flex;flex-wrap:wrap;gap:.5rem}
.pp__facts li{display:inline-flex;align-items:center;gap:.45rem;height:36px;padding:0 .85rem;border-radius:var(--pill);background:rgba(255,255,255,.08);border:1px solid var(--lnd-2);font-size:.84rem;font-weight:500;color:#fff;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
.pp__facts .ic{color:var(--mint)}
.pp__buy{padding-top:.25rem}
.pp__brand{display:flex;align-items:center;gap:.6rem;margin:0 0 .9rem;font-size:.9rem;font-weight:500;color:var(--tx-3)}
.pp__brand a{margin-left:auto;font-size:.84rem;color:var(--tx-3);text-decoration:underline;text-decoration-color:var(--line-2);text-underline-offset:4px}
.pp__brand a:hover{color:var(--tx);text-decoration-color:var(--mint)}
.pp__h{margin:0 0 .6rem;font-family:var(--display);font-weight:700;font-size:clamp(2.3rem,2.4vw + 1.3rem,3.4rem);line-height:1.02;letter-spacing:-.04em;color:var(--tx)}
.pp__lead{margin:0 0 1rem;max-width:52ch;font-size:1.04rem;line-height:1.6;color:var(--tx-3)}
.pp__flags{display:flex;flex-wrap:wrap;gap:.4rem;margin:0 0 1.4rem}
.pp__flags .badge{height:28px;padding:0 .7rem;gap:.35rem}
.pp__form{display:grid;gap:1.1rem;margin-top:1.4rem}
.pp__flags + .pp__form{margin-top:0}
.pp__sub{display:block;margin:0 0 .55rem;font-family:var(--mono);font-size:.75rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--tx-3)}
.pp__offer[hidden]{display:none !important}
.pp__inc{display:grid;gap:.5rem;font-size:.96rem;color:var(--tx-2)}
.pp__inc li{display:flex;align-items:flex-start;gap:.55rem}
.pp__inc .ic{color:var(--mint-ink);margin-top:.22rem}
/* Liste déroulante des offres (combobox + listbox) */
.ofr{position:relative}
.ofr__label{display:flex;align-items:baseline;justify-content:space-between;gap:1rem;margin:0 0 .5rem;font-weight:700;font-size:.97rem;color:var(--tx)}
.ofr__label small{font-family:var(--mono);font-size:.75rem;font-weight:600;letter-spacing:.04em;color:var(--tx-3)}
.ofr__btn,.ofr__one{width:100%;display:flex;align-items:center;gap:1rem;min-height:74px;padding:.8rem 1rem .8rem 1.15rem;border-radius:var(--r-lg);border:1.5px solid var(--line-2);background:#fff;text-align:left;transition:border-color .15s,box-shadow .15s}
.ofr__btn{cursor:pointer}
.ofr__btn:hover{border-color:var(--tx-4)}
.ofr__btn[aria-expanded="true"]{border-color:var(--ink-900);box-shadow:0 0 0 4px rgba(10,12,22,.07)}
.ofr__btn:focus-visible{outline:none;border-color:var(--ink-900);box-shadow:0 0 0 4px rgba(60,242,165,.4)}
.ofr__one{background:var(--bg-2);border-color:var(--line)}
.ofr__v{display:flex;flex-direction:column;flex:1;min-width:0;line-height:1.3}
.ofr__v b{font-size:1.06rem;font-weight:700;color:var(--tx)}
.ofr__v small{margin-top:.15rem;font-size:.86rem;color:var(--tx-3)}
.ofr__p{font-family:var(--display);font-weight:700;font-size:1.3rem;letter-spacing:-.02em;color:var(--tx);white-space:nowrap}
.ofr__p small{font-family:var(--font);font-size:.8rem;font-weight:500;letter-spacing:0;color:var(--tx-3)}
.ofr__chev{width:20px;height:20px;flex:none;color:var(--tx-3);transition:rotate .2s var(--ease)}
.ofr__btn[aria-expanded="true"] .ofr__chev{rotate:180deg}
.ofr__list{position:absolute;left:0;right:0;top:calc(100% + 8px);z-index:30;max-height:min(440px,62vh);overflow:auto;overscroll-behavior:contain;padding:.4rem;background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);box-shadow:var(--sh-pop)}
.ofr__list:focus{outline:none}
.ofr__o{display:grid;grid-template-columns:minmax(0,1fr) auto 20px;align-items:center;gap:.9rem;min-height:66px;padding:.6rem .8rem .6rem .95rem;border-radius:14px;cursor:pointer;transition:background-color .12s}
.ofr__o:hover,.ofr__o.is-act{background:var(--bg-2)}
.ofr__o[aria-selected="true"]{background:var(--mint-soft)}
.ofr__o[aria-selected="true"].is-act{box-shadow:inset 0 0 0 1.5px var(--mint-ink)}
.ofr__ot{display:flex;flex-direction:column;min-width:0;line-height:1.3}
.ofr__ot b{font-weight:700;font-size:.98rem;color:var(--tx)}
.ofr__ot small{margin-top:.1rem;font-size:.84rem;color:var(--tx-3)}
.ofr__tag{margin-left:.3rem;padding:.12rem .45rem;border-radius:var(--pill);background:var(--ink-900);color:#fff;font-style:normal;font-size:.75rem;font-weight:700;white-space:nowrap}
.ofr__op{font-weight:700;font-size:1rem;color:var(--tx);white-space:nowrap}
.ofr__op small{font-weight:500;font-size:.78rem;color:var(--tx-3)}
.ofr__ok{width:20px;height:20px;color:var(--mint-ink);opacity:0}
.ofr__o[aria-selected="true"] .ofr__ok{opacity:1}
.ofr__nojs{display:grid;gap:.4rem;margin-top:.5rem}
.ofr__nojs a{display:flex;justify-content:space-between;gap:1rem;padding:.8rem 1rem;border-radius:var(--r);border:1px solid var(--line-2);color:var(--tx)}
.ofr__nojs a[aria-current]{border-color:var(--ink-900);background:var(--mint-soft)}
/* Total, conditions, achat */
.pp__total{display:flex;align-items:baseline;justify-content:space-between;flex-wrap:wrap;gap:.25rem 1rem;padding-top:1.1rem;border-top:1.5px dashed var(--line-2)}
.pp__amt{margin:0;font-family:var(--display);font-weight:700;font-size:2.7rem;line-height:1;letter-spacing:-.04em;color:var(--tx)}
.pp__amt small{margin-left:.35rem;font-family:var(--font);font-size:.95rem;font-weight:500;letter-spacing:0;color:var(--tx-3)}
.pp__term{margin:0;font-size:.86rem;color:var(--tx-3)}
.terms{padding:1rem 1.15rem 1.05rem;border-radius:var(--r);background:#FFF8F3;border:1px solid #F5D6C2}
.terms__h{display:flex;align-items:center;gap:.5rem;margin:0 0 .6rem;font-weight:700;font-size:.96rem;color:#7A2E07}
.terms__l{display:grid;gap:.4rem;margin:0 0 .9rem;padding-left:1.15rem;list-style:disc;font-size:.88rem;line-height:1.5;color:var(--tx-2)}
.terms__l li::marker{color:#C2410C}
.terms__ban{font-weight:700;color:var(--tx)}
.terms__x{color:#7A2E07}
.terms__ok{display:flex;align-items:flex-start;gap:.7rem;padding-top:.85rem;border-top:1px solid #F5D6C2;font-size:.9rem;line-height:1.45;color:var(--tx);cursor:pointer}
.terms__ok input{flex:none;width:20px;height:20px;margin:.1rem 0 0;font-size:16px;accent-color:var(--ink-900);cursor:pointer}
.terms__ok b{font-weight:700}
.pp__cta{height:58px;font-size:1.05rem}
.pp__assure{display:flex;flex-wrap:wrap;gap:.5rem 1.25rem;margin:1.1rem 0 0;font-size:.86rem;color:var(--tx-2)}
.pp__assure li{display:inline-flex;align-items:center;gap:.4rem}
.pp__assure .ic{color:var(--mint-ink)}
.pp__pay{display:flex;align-items:center;flex-wrap:wrap;gap:.75rem;margin-top:1rem;padding-top:1rem;border-top:1px solid var(--line);font-size:.84rem;color:var(--tx-3)}
.pp__coins{display:flex;flex-wrap:wrap;gap:.35rem}
.pp__coins img{width:22px;height:22px}
/* Comparer les offres */
.ocs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1.25rem}
.ocs--2{grid-template-columns:repeat(2,minmax(0,1fr));max-width:880px}
.oc{position:relative;display:flex;flex-direction:column;padding:1.5rem;border-radius:var(--r-lg);background:#fff;border:1.5px solid var(--line);box-shadow:var(--sh-1);transition:border-color .2s,box-shadow .2s,translate .25s var(--ease)}
.oc:hover{translate:0 -3px;box-shadow:var(--sh-2)}
.oc.is-sel{border-color:var(--ink-900);box-shadow:0 0 0 4px rgba(60,242,165,.28),var(--sh-2)}
.oc__top{display:flex;align-items:center;gap:.5rem;min-height:26px;margin:0 0 .8rem}
.oc__cur{display:none;margin-left:auto;align-items:center;gap:.3rem;font-size:.8rem;font-weight:700;color:var(--mint-ink)}
.oc.is-sel .oc__cur{display:inline-flex}
.oc__h{margin:0;font-family:var(--display);font-weight:700;font-size:1.35rem;letter-spacing:-.02em;color:var(--tx)}
.oc__b{margin:.3rem 0 1rem;font-size:.9rem;color:var(--tx-3)}
.oc__p{margin:0 0 1rem;padding-bottom:1rem;border-bottom:1.5px dashed var(--line-2)}
.oc__p b{font-family:var(--display);font-size:2rem;font-weight:700;letter-spacing:-.03em;color:var(--tx)}
.oc__p small{margin-left:.3rem;font-size:.85rem;color:var(--tx-3)}
.oc__inc{display:grid;gap:.45rem;margin:0 0 1rem;font-size:.9rem;color:var(--tx-2)}
.oc__inc li{display:flex;align-items:flex-start;gap:.5rem}
.oc__inc .ic{color:var(--mint-ink);margin-top:.2rem}
.oc__d{margin:auto 0 1rem}
.oc__sel{width:100%}
/* Ce que reçoit l'acheteur (fiche produit) */
.pp__rcv{display:flex;align-items:flex-start;gap:.85rem;margin:0;padding:.9rem 1rem;border-radius:var(--r);background:var(--bg-2);border:1px solid var(--line)}
.pp__rcv-i{display:grid;place-items:center;width:38px;height:38px;border-radius:12px;background:var(--mint-soft);color:var(--mint-ink);flex:none}
.pp__rcv p{display:flex;flex-direction:column;gap:.15rem;margin:0;font-size:.88rem;line-height:1.5;color:var(--tx-3)}
.pp__rcv b{font-size:.95rem;color:var(--tx)}
/* Après le paiement : frise, aperçu de la livraison, avantages (section sombre) */
.dlvs{position:relative;isolation:isolate;overflow:hidden;padding:5.5rem 0;background:var(--ink-900)}
.dlvs::before{content:"";position:absolute;z-index:-1;right:-240px;top:-280px;width:760px;height:760px;border-radius:50%;background:radial-gradient(closest-side,rgba(92,225,240,.16),transparent);pointer-events:none}
.dlvs::after{content:"";position:absolute;z-index:-1;left:-260px;bottom:-340px;width:760px;height:760px;border-radius:50%;background:radial-gradient(closest-side,rgba(60,242,165,.12),transparent);pointer-events:none}
.dlvs__grid{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:4rem;align-items:center}
.dlvs .h2{max-width:20ch}
.tl{position:relative;display:grid;gap:1.6rem;margin-top:2rem}
.tl__i{position:relative;display:grid;grid-template-columns:48px minmax(0,1fr);gap:1.1rem;align-items:start}
.tl__i:not(:last-child)::before{content:"";position:absolute;left:23px;top:54px;bottom:calc(-1.6rem + 6px);width:2px;border-radius:2px;background:linear-gradient(180deg,rgba(60,242,165,.7),rgba(92,225,240,.35))}
.tl__ic{display:grid;place-items:center;width:48px;height:48px;border-radius:15px;background:rgba(60,242,165,.1);border:1px solid rgba(60,242,165,.3);color:var(--mint)}
.tl__ic .ic{stroke-width:2}
.tl__t{display:flex;align-items:center;flex-wrap:wrap;gap:.4rem .7rem;margin:.55rem 0 .35rem;font-family:var(--display);font-weight:700;font-size:1.18rem;letter-spacing:-.015em;color:#fff}
.tl__time{display:inline-flex;align-items:center;height:26px;padding:0 .65rem;border-radius:var(--pill);background:rgba(60,242,165,.12);border:1px solid rgba(60,242,165,.3);font-family:var(--mono);font-size:.75rem;font-weight:600;letter-spacing:.02em;color:var(--mint)}
.tl__d{margin:0;max-width:48ch;font-size:.95rem;line-height:1.6;color:var(--od-2)}
.tl__d b{color:#fff;font-weight:600}
.rcpt{position:relative;padding:1.3rem 1.35rem 1.2rem;border-radius:var(--r-lg);background:#fff;color:var(--tx);box-shadow:0 40px 80px -30px rgba(0,0,0,.8),0 0 0 1px rgba(255,255,255,.08)}
.rcpt__top{display:flex;align-items:center;gap:.75rem;padding-bottom:1rem;border-bottom:1px solid var(--line)}
.rcpt__lg{display:grid;place-items:center;width:42px;height:42px;border-radius:13px;border:1px solid var(--line);background:#fff;flex:none}
.rcpt__h{display:flex;flex-direction:column;min-width:0;line-height:1.25}
.rcpt__h small{font-family:var(--mono);font-size:.75rem;color:var(--tx-3)}
.rcpt__h b{font-family:var(--display);font-size:1.12rem;font-weight:700;letter-spacing:-.01em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rcpt .status{margin-left:auto;flex:none}
.rcpt__k{margin:1rem 0 .35rem;font-family:var(--mono);font-size:.75rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--tx-3)}
.rcpt__rows{display:grid;gap:.1rem;margin:0}
.rcpt__rows > div{display:grid;grid-template-columns:78px minmax(0,1fr) auto;align-items:center;gap:.6rem;padding:.5rem .7rem;border-radius:10px;background:var(--bg-2)}
.rcpt__rows > div + div{margin-top:.3rem}
.rcpt__rows dt{font-size:.8rem;font-weight:600;color:var(--tx-3)}
.rcpt__rows dd{margin:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rcpt__mono{font-family:var(--mono);font-size:.84rem;color:var(--tx)}
.rcpt__cp{display:grid;place-items:center;width:28px;height:28px;border-radius:8px;border:1px solid var(--line-2);background:#fff;color:var(--tx-3)}
.rcpt__foot{display:flex;align-items:center;justify-content:space-between;gap:.5rem 1rem;flex-wrap:wrap;margin:1rem 0 0;padding-top:.9rem;border-top:1px solid var(--line);font-size:.8rem;color:var(--tx-3)}
.rcpt__foot span{display:inline-flex;align-items:center;gap:.35rem}
.rcpt__foot .ic{color:var(--mint-ink)}
.bnf{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.75rem;margin-top:3.5rem}
.bnf li{display:flex;align-items:center;gap:.8rem;padding:1rem 1.1rem;border-radius:var(--r-lg);background:rgba(255,255,255,.04);border:1px solid var(--lnd)}
.bnf__i{display:grid;place-items:center;width:40px;height:40px;border-radius:12px;background:rgba(60,242,165,.1);color:var(--mint);flex:none}
.bnf__i .ic{stroke-width:2}
.bnf li > span:last-child{display:flex;flex-direction:column;min-width:0;line-height:1.3}
.bnf b{font-size:.95rem;font-weight:600;color:#fff}
.bnf small{font-size:.82rem;color:var(--od-3)}
/* Barre d'achat collante (apparaît quand le bouton principal sort de l'écran) */
.sbar{position:fixed;left:0;right:0;bottom:0;z-index:45;padding:.7rem 0 calc(.7rem + env(safe-area-inset-bottom));background:rgba(10,12,22,.94);border-top:1px solid var(--lnd-2);color:#fff;translate:0 110%;transition:translate .3s var(--ease)}
.sbar.is-on{translate:0 0}
.sbar__in{display:flex;align-items:center;gap:.9rem}
.sbar__lg{display:grid;place-items:center;width:40px;height:40px;border-radius:12px;background:#fff;flex:none}
.sbar__lg .logo{color:var(--tx)}
.sbar__t{display:flex;flex-direction:column;min-width:0;line-height:1.25}
.sbar__t b{font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sbar__t small{font-size:.84rem;color:var(--od-2)}
.sbar__chg{margin-left:auto;font-size:.88rem;font-weight:600;color:var(--od-2);text-decoration:underline;text-underline-offset:4px;white-space:nowrap}
.sbar__chg:hover{color:#fff}
.sbar__t + .sbar__btn{margin-left:auto}
.sbar__btn{flex:none}
.p-product .ft{padding-bottom:calc(2rem + 80px)}
/* Commande (récapitulatif) */
.co__warn{display:flex;align-items:flex-start;gap:.6rem;margin:0 0 1.25rem;padding:.9rem 1rem;border-radius:var(--r);background:#FFF8F3;border:1px solid #F5D6C2;color:#7A2E07;font-size:.92rem}
.co__warn .ic{margin-top:.2rem}
.co__warn a{font-weight:700;text-decoration:underline;text-underline-offset:3px}
.co__terms{margin-top:.25rem}
.soon__terms .co__total{background:rgba(60,242,165,.1);border-color:rgba(60,242,165,.35)}
.soon__terms .co__total b{font-size:1.2rem}

/* ── Catalogue (/subscriptions, catégories, recherche) ────────────────── */
.cl-head{padding:1.4rem 0 1.6rem}
.cl-head__in{display:flex;align-items:flex-end;justify-content:space-between;gap:1.25rem 3rem;flex-wrap:wrap}
.cl-head__h{margin-bottom:.3em}
.cl-head .lead{max-width:62ch}
.cl-facts{display:flex;flex-wrap:wrap;gap:.45rem}
.cl-facts li{display:inline-flex;align-items:center;gap:.45rem;height:36px;padding:0 .85rem;border-radius:var(--pill);background:var(--bg-2);border:1px solid var(--line);font-size:.84rem;color:var(--tx-2);white-space:nowrap}
.cl-facts .ic{color:var(--mint-ink)}
.cl-facts b{color:var(--tx)}
.cl-bar{position:sticky;top:var(--bar-h);z-index:40;background:rgba(255,255,255,.95);border-top:1px solid var(--line);border-bottom:1px solid var(--line);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}
.cl-bar__in{display:grid;grid-template-columns:minmax(240px,320px) minmax(0,1fr);grid-template-areas:"q cats" "row row";gap:.7rem 1rem;padding-top:.8rem;padding-bottom:.8rem}
.cl-q{position:relative;grid-area:q}
.cl-q__ic{position:absolute;left:15px;top:50%;translate:0 -50%;color:var(--tx-3);pointer-events:none}
.cl-q__in{width:100%;height:44px;padding:0 1rem 0 2.6rem;border-radius:var(--pill);border:1.5px solid var(--line-2);background:#fff;font-size:.95rem;color:var(--tx);-webkit-appearance:none;appearance:none;transition:border-color .15s,box-shadow .15s}
.cl-q__in::placeholder{color:var(--tx-4);opacity:1}
.cl-q__in:focus{outline:none;border-color:var(--ink-900);box-shadow:0 0 0 4px rgba(60,242,165,.3)}
.cl-cats{grid-area:cats;display:flex;gap:.4rem;overflow-x:auto;scrollbar-width:none;contain:inline-size;min-width:0;padding:2px}
.cl-cats::-webkit-scrollbar{display:none}
.cl-cat{flex:none;display:inline-flex;align-items:center;gap:.45rem;height:44px;padding:0 1rem;border-radius:var(--pill);border:1px solid var(--line-2);background:#fff;font-weight:600;font-size:.9rem;color:var(--tx-2);white-space:nowrap;transition:background-color .15s,border-color .15s,color .15s}
.cl-cat small{font-family:var(--mono);font-size:.75rem;font-weight:600;color:var(--tx-3)}
.cl-cat .ic{color:var(--tx-3)}
.cl-cat:hover{border-color:var(--tx-4);color:var(--tx)}
.cl-cat.is-on{background:var(--ink-900);border-color:var(--ink-900);color:#fff}
.cl-cat.is-on small,.cl-cat.is-on .ic{color:var(--mint)}
.cl-row2{grid-area:row;display:flex;align-items:center;justify-content:space-between;gap:.6rem 1rem;flex-wrap:wrap}
.cl-meta{display:flex;align-items:center;gap:.4rem 1.1rem;flex-wrap:wrap}
.cl-count{margin:0;font-size:.92rem;color:var(--tx-3)}
.cl-count b{font-size:1.02rem;color:var(--tx)}
.cl-clear{margin:0}
.cl-clear .lnk{font-size:.88rem}
.cl-opts{display:flex;align-items:center;gap:.45rem;flex-wrap:wrap}
.cl-sel select{height:40px;padding:0 2.3rem 0 .95rem;border-radius:var(--pill);border:1px solid var(--line-2);background-color:#fff;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2362687C' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9.5l6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right .8rem center;background-size:16px;font-size:.88rem;font-weight:600;color:var(--tx);-webkit-appearance:none;appearance:none;cursor:pointer;transition:border-color .15s}
.cl-sel select:hover{border-color:var(--tx-4)}
.cl-sel select:focus-visible{outline:none;border-color:var(--ink-900);box-shadow:0 0 0 4px rgba(60,242,165,.3)}
.cl-view{display:inline-flex;padding:3px;border-radius:var(--pill);background:var(--bg-3)}
.cl-view__b{display:grid;place-items:center;width:38px;height:34px;border-radius:var(--pill);color:var(--tx-3);transition:background-color .15s,color .15s}
.cl-view__b:hover{color:var(--tx)}
.cl-view__b.is-on{background:#fff;color:var(--tx);box-shadow:0 1px 2px rgba(10,12,22,.1)}
.cl-res{padding:1.75rem 0 4rem;--notch-bg:#fff}
.cl-grid[hidden],.cl-plans[hidden]{display:none !important}
.cl-empty{padding:2.75rem 1.5rem;border:1.5px dashed var(--line-2);border-radius:var(--r-lg);text-align:center}
.cl-empty__h{margin:0 0 .4rem;font-family:var(--display);font-weight:700;font-size:1.3rem;color:var(--tx)}
.cl-empty p{margin:0;color:var(--tx-3)}
.cl-empty .btns{justify-content:center;margin-top:1.1rem}
.cl-note{margin-top:1.75rem}
.cl-req{padding-bottom:5rem}
.cl-tbl{width:100%;border-collapse:separate;border-spacing:0;border:1px solid var(--line);border-radius:var(--r-lg);overflow:hidden;background:#fff;font-size:.92rem}
.cl-tbl th,.cl-tbl td{padding:.8rem 1rem;text-align:left;vertical-align:middle;border-bottom:1px solid var(--line)}
.cl-tbl thead th{font-family:var(--mono);font-size:.75rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--tx-3);background:var(--bg-2)}
.cl-tbl tbody tr{transition:background-color .12s}
.cl-tbl tbody tr:hover{background:var(--bg-2)}
.cl-tbl td{color:var(--tx-2)}
.cl-plan{display:flex;align-items:center;gap:.75rem;color:var(--tx)}
.cl-plan__lg{display:grid;place-items:center;width:38px;height:38px;border-radius:11px;border:1px solid var(--line);background:#fff;flex:none}
.cl-plan > span:last-child{display:flex;flex-direction:column;min-width:0;line-height:1.3}
.cl-plan b{font-weight:700}
.cl-plan small{font-size:.8rem;font-weight:400;color:var(--tx-3)}
.cl-plan:hover b{text-decoration:underline;text-decoration-color:var(--mint);text-decoration-thickness:2px;text-underline-offset:3px}
.cl-tbl__p{text-align:right !important;white-space:nowrap}
.cl-tbl__p b{font-family:var(--display);font-size:1.1rem;font-weight:700;color:var(--tx)}
.cl-tbl__p small{font-size:.8rem;color:var(--tx-3)}
.cl-tbl__a{width:1%;text-align:right !important}

/* ── 10. Trois étapes + maquette de la page de commande ──────────────── */
.how{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:4rem;align-items:center}
.steps{position:relative;display:grid;gap:1.6rem;margin-top:2rem}
.step:not(:last-child)::before{content:"";position:absolute;left:21px;top:50px;bottom:calc(-1.6rem + 6px);width:2px;border-radius:2px;background:linear-gradient(180deg,var(--mint),var(--cyan) 60%,var(--lilac));opacity:.5}
.step{position:relative;display:grid;grid-template-columns:44px 1fr;gap:1.1rem;align-items:start}
.step__n{position:relative;display:grid;place-items:center;width:44px;height:44px;border-radius:50%;background:var(--ink-900);color:var(--mint);font-family:var(--display);font-weight:700;font-size:1.05rem;box-shadow:0 0 0 6px #fff}
.step__h{margin:.35rem 0 .35rem;font-family:var(--display);font-weight:700;font-size:1.18rem;letter-spacing:-.015em;color:var(--tx)}
.step__p{margin:0;font-size:.95rem;color:var(--tx-3);max-width:46ch}
.step__coins{display:flex;flex-wrap:wrap;gap:.35rem;margin-top:.75rem}
.step__coins img{width:26px;height:26px}
.how__more{margin-top:2rem}
.shot{position:relative;background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);box-shadow:0 40px 80px -40px rgba(10,12,22,.45),0 2px 8px rgba(10,12,22,.06);overflow:hidden;font-size:.88rem}
.shot::before{content:"";position:absolute;inset:-40% -30% auto auto;width:420px;height:420px;background:radial-gradient(closest-side,rgba(60,242,165,.18),transparent);pointer-events:none}
.shot__bar{position:relative;display:flex;align-items:center;gap:.4rem;padding:.7rem .9rem;background:var(--bg-2);border-bottom:1px solid var(--line)}
.shot__bar span{width:10px;height:10px;border-radius:50%;background:var(--line-2)}
.shot__bar i{margin-left:.6rem;flex:1;display:flex;align-items:center;gap:.4rem;padding:.35rem .7rem;border-radius:var(--pill);background:#fff;border:1px solid var(--line);font-style:normal;font-family:var(--mono);font-size:.75rem;color:var(--tx-3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.shot__body{position:relative;padding:1.25rem 1.4rem 1.3rem}
.shot__head{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding-bottom:1rem;border-bottom:1px solid var(--line)}
.shot__k{margin:0;font-family:var(--mono);font-size:.75rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--tx-3)}
.shot__id{margin:.15rem 0 0;font-family:var(--mono);font-weight:700;font-size:1.1rem;color:var(--tx)}
.status{display:inline-flex;align-items:center;gap:.45rem;height:30px;padding:0 .8rem;border-radius:var(--pill);background:var(--mint-soft);color:var(--mint-ink);font-size:.8rem;font-weight:700}
.shot__steps{display:grid;grid-template-columns:repeat(3,1fr);gap:.6rem;padding:1rem 0;border-bottom:1px solid var(--line)}
.shot__steps li{position:relative;display:flex;flex-direction:column;gap:.1rem;padding-left:1.8rem;line-height:1.3}
.shot__steps i{position:absolute;left:0;top:.05rem;display:grid;place-items:center;width:20px;height:20px;border-radius:50%;background:var(--mint);color:var(--ink-900)}
.shot__steps b{font-weight:600;font-size:.86rem;color:var(--tx)}
.shot__steps small{font-size:.78rem;color:var(--tx-3)}
.shot__fields{display:grid;gap:.1rem;margin:.8rem 0 0}
.shot__f{display:grid;grid-template-columns:84px minmax(0,1fr) auto;align-items:center;gap:.6rem;padding:.55rem 0}
.shot__f dt{font-size:.8rem;font-weight:600;color:var(--tx-3)}
.shot__f dd{margin:0;font-weight:600;color:var(--tx);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.shot__sub{font-weight:400;color:var(--tx-3)}
.shot__mono{font-family:var(--mono);font-size:.84rem;letter-spacing:.01em}
.shot__copy{display:inline-flex;align-items:center;gap:.3rem;height:30px;padding:0 .65rem;border:1px solid var(--line-2);border-radius:var(--pill);font-size:.78rem;font-weight:600;color:var(--tx-2);background:#fff}
.shot__foot{display:flex;align-items:center;justify-content:space-between;gap:1rem;margin-top:.8rem;padding-top:.9rem;border-top:1px solid var(--line);font-size:.82rem;color:var(--tx-3)}
.shot__foot span:first-child{display:inline-flex;align-items:center;gap:.4rem}
.shot__foot .ic{color:var(--mint-ink)}
.shot__lnk{font-weight:600;color:var(--tx);text-decoration:underline;text-decoration-color:var(--mint);text-decoration-thickness:2px;text-underline-offset:4px}

/* ── 11. Pourquoi nous : comparaison (section sombre) ────────────────── */
.why{position:relative;isolation:isolate;overflow:hidden;padding:6rem 0;background:var(--ink-900)}
.why::before{content:"";position:absolute;z-index:-1;right:-220px;top:-260px;width:760px;height:760px;border-radius:50%;background:radial-gradient(closest-side,rgba(165,139,255,.2),transparent);pointer-events:none}
.why::after{content:"";position:absolute;z-index:-1;left:-260px;bottom:-320px;width:760px;height:760px;border-radius:50%;background:radial-gradient(closest-side,rgba(60,242,165,.14),transparent);pointer-events:none}
.why__grid{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:4rem;align-items:start}
.why__copy .lead{margin-bottom:1.75rem}
.why__save{display:flex;align-items:baseline;gap:.75rem;margin:0 0 1.5rem}
.why__save b{font-family:var(--display);font-weight:700;font-size:clamp(3.2rem,4vw + 1rem,4.6rem);line-height:.9;letter-spacing:-.05em;background:var(--holo);-webkit-background-clip:text;background-clip:text;color:transparent}
.why__save span{font-size:.95rem;line-height:1.4;color:var(--od-2);max-width:14ch}
.cmp{width:100%;border-collapse:separate;border-spacing:0;border:1px solid var(--lnd-2);border-radius:var(--r-xl);overflow:hidden;background:rgba(255,255,255,.025);font-size:.92rem}
.cmp th,.cmp td{padding:1rem 1.15rem;text-align:left;vertical-align:top;border-bottom:1px solid var(--lnd)}
.cmp tr:last-child th,.cmp tr:last-child td{border-bottom:0}
.cmp thead th{padding-top:1.1rem;padding-bottom:1.1rem;font-family:var(--mono);font-size:.75rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--od-3);background:rgba(255,255,255,.03)}
.cmp thead .cmp__us{color:var(--mint)}
.cmp tbody th{width:26%;font-weight:600;color:#fff}
.cmp td{color:var(--od-3)}
.cmp .cmp__us{position:relative;color:#fff;background:rgba(60,242,165,.06);box-shadow:inset 1px 0 0 rgba(60,242,165,.35)}
.cmp td.cmp__us{font-weight:500}
.cmp__v{display:flex;align-items:flex-start;gap:.5rem}
.cmp__v .ic{margin-top:.2rem;color:var(--mint)}
.guar{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem;margin-top:3.5rem}
.guar__i{display:flex;flex-direction:column;gap:.45rem;padding:1.35rem 1.4rem;border-radius:var(--r-lg);background:rgba(255,255,255,.04);border:1px solid var(--lnd)}
.guar__i h3{display:flex;align-items:center;gap:.6rem;margin:0;font-family:var(--display);font-weight:700;font-size:1.1rem;color:#fff}
.guar__i h3 .ic{color:var(--mint)}
.guar__i p{margin:0 0 .4rem;font-size:.9rem;color:var(--od-3)}
.guar__i .lnk{margin-top:auto;font-size:.9rem}
.guar--4{grid-template-columns:repeat(4,minmax(0,1fr))}
.guar__i--ban{background:rgba(255,180,140,.07);border-color:rgba(255,180,140,.32)}
.guar__i--ban h3 .ic{color:var(--peach)}

/* ── 12. Entreprises ──────────────────────────────────────────────────── */
.biz{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:3.5rem;align-items:center}
.biz .btns{margin-top:1.75rem}
.biz__list{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
.biz__list li{display:flex;flex-direction:column;gap:.35rem;padding:1.25rem;border-radius:var(--r-lg);background:#fff;border:1px solid var(--line);box-shadow:var(--sh-1)}
.biz__list .ic{color:var(--mint-ink);margin-bottom:.35rem}
.biz__list b{font-weight:600;color:var(--tx);font-size:.97rem}
.biz__list span{font-size:.88rem;line-height:1.5;color:var(--tx-3)}

/* ── 13. FAQ ──────────────────────────────────────────────────────────── */
.faqw{display:grid;grid-template-columns:minmax(0,.78fr) minmax(0,1.22fr);gap:4rem;align-items:start}
.faqw__side{position:sticky;top:calc(var(--bar-h) + 32px)}
.help{margin-top:2rem;padding:1.35rem 1.4rem;border-radius:var(--r-lg);background:var(--ink-900);color:var(--od)}
.help__h{display:flex;align-items:center;gap:.6rem;margin:0 0 .35rem;font-weight:600;color:#fff}
.help p{margin:0 0 1rem;font-size:.9rem;color:var(--od-3)}
.help .help__h{margin:0 0 .35rem;color:#fff;font-size:1rem}
.help .btns{gap:.5rem}
.faq{border-top:1px solid var(--line)}
.faq__i{border-bottom:1px solid var(--line)}
.faq__i summary{display:flex;align-items:center;justify-content:space-between;gap:1rem;min-height:64px;padding:1.05rem 0;list-style:none;cursor:pointer;font-family:var(--display);font-weight:600;font-size:1.08rem;letter-spacing:-.01em;color:var(--tx)}
.faq__i summary::-webkit-details-marker{display:none}
.faq__i summary:hover{color:var(--mint-ink)}
.faq__pm{position:relative;display:grid;place-items:center;width:32px;height:32px;border-radius:50%;border:1px solid var(--line-2);flex:none;transition:background-color .2s,border-color .2s}
.faq__pm::before,.faq__pm::after{content:"";position:absolute;width:12px;height:2px;border-radius:2px;background:var(--tx);transition:rotate .25s var(--ease),opacity .2s}
.faq__pm::after{rotate:90deg}
.faq__i[open] .faq__pm{background:var(--ink-900);border-color:var(--ink-900)}
.faq__i[open] .faq__pm::before{background:var(--mint)}
.faq__i[open] .faq__pm::after{rotate:0deg;opacity:0}
.faq__i p{margin:0 0 1.25rem;max-width:68ch;font-size:.97rem;color:var(--tx-3)}

/* ── 14. Appel final ──────────────────────────────────────────────────── */
.cta{padding:0 0 5.5rem}
.cta__card{position:relative;isolation:isolate;overflow:hidden;display:flex;align-items:center;justify-content:space-between;gap:2rem 3rem;flex-wrap:wrap;padding:3.25rem 3.5rem;border-radius:var(--r-xl);background-color:#06070F;background-image:url(/assets/img/hero/hero-1280.webp);background-image:image-set(url(/assets/img/hero/hero-1280.avif) type("image/avif"),url(/assets/img/hero/hero-1280.webp) type("image/webp"));background-size:cover;background-position:70% 50%;color:var(--od)}
.cta__card::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(6,7,15,.95) 0%,rgba(6,7,15,.8) 45%,rgba(6,7,15,.25) 100%)}
.cta__h{margin:0 0 .5rem;font-size:clamp(1.8rem,1.8vw + 1rem,2.6rem);line-height:1.06;letter-spacing:-.032em;color:#fff;max-width:20ch}
.cta__p{margin:0;font-size:1.02rem;color:var(--od-2)}
.cta__p b{color:#fff}

/* ── 15. Pied de page ─────────────────────────────────────────────────── */
.ft{background:var(--ink-950);color:var(--od-2);padding:0 0 2rem}
.ft__help{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem;padding:2.5rem 0;border-bottom:1px solid var(--lnd)}
.ft__hc{display:flex;align-items:center;gap:1rem;padding:1.1rem 1.2rem;border-radius:var(--r-lg);background:rgba(255,255,255,.035);border:1px solid var(--lnd);color:var(--od-2);transition:background-color .15s,border-color .15s}
.ft__hc:hover{background:rgba(255,255,255,.07);border-color:var(--lnd-2);color:var(--od-2)}
.ft__hi{display:grid;place-items:center;width:46px;height:46px;border-radius:14px;background:rgba(60,242,165,.1);border:1px solid rgba(60,242,165,.2);color:var(--mint);flex:none}
.ft__hc b{display:block;font-weight:600;color:#fff;line-height:1.3}
.ft__hc small{display:block;font-size:.84rem;color:var(--od-3);line-height:1.4}
.ft__hc > .ic:last-child{margin-left:auto;color:var(--od-3);transition:translate .18s var(--ease),color .15s}
.ft__hc:hover > .ic:last-child{translate:3px 0;color:var(--mint)}
.ft__grid{display:grid;grid-template-columns:1.55fr repeat(5,minmax(0,1fr));gap:2.5rem 2rem;padding:3.25rem 0 2.75rem}
.ft__desc{margin:1.1rem 0 1.2rem;max-width:36ch;font-size:.9rem;line-height:1.6;color:var(--od-3)}
.ft__status{display:inline-flex;align-items:center;gap:.55rem;margin:0 0 1.5rem;padding:.4rem .85rem .4rem .7rem;border-radius:var(--pill);background:rgba(60,242,165,.08);border:1px solid rgba(60,242,165,.2);font-size:.84rem;font-weight:500;color:#fff}
.ft__pay-h{margin:0 0 .6rem;font-family:var(--mono);font-size:.75rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--od-3)}
.coins{display:flex;flex-wrap:wrap;gap:.4rem}
.coin{display:inline-flex;align-items:center;gap:.4rem;height:32px;padding:0 .7rem 0 .4rem;border-radius:var(--pill);background:rgba(255,255,255,.05);border:1px solid var(--lnd);font-size:.78rem;font-weight:600;color:var(--od-2)}
.coin img{width:20px;height:20px}
.ft__h{margin:0 0 1rem;font-family:var(--mono);font-size:.75rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:#fff}
.ft__col ul{display:grid;gap:.55rem}
.ft__col a{display:inline-block;font-size:.9rem;color:var(--od-2);transition:color .15s}
.ft__col a:hover{color:#fff}
.ft__bottom{display:flex;align-items:center;justify-content:space-between;gap:.75rem 2rem;flex-wrap:wrap;padding-top:1.5rem;border-top:1px solid var(--lnd);font-size:.84rem;color:var(--od-3)}
.ft__copy{margin:0}
.ft__legal{display:flex;align-items:center;gap:.5rem 1.4rem;flex-wrap:wrap}
.ft__legal a{color:var(--od-2);font-weight:500}
.ft__legal a:hover{color:#fff}
.ft__loc{display:inline-flex;align-items:center;gap:.4rem;color:var(--od-2)}
.ft__tm{margin:1.25rem 0 0;max-width:124ch;font-size:.78rem;line-height:1.6;color:var(--od-3)}

/* ── 16. Pages génériques (à venir, 404), fil d'Ariane ────────────────── */
.crumbs{padding:1.2rem 0 0;font-size:.85rem;color:var(--tx-3)}
.crumbs ol{display:flex;flex-wrap:wrap;gap:.4rem}
.crumbs li{display:inline-flex;align-items:center;gap:.4rem}
.crumbs li + li::before{content:"/";color:var(--line-2)}
.crumbs a{color:var(--tx-3)}
.crumbs a:hover{color:var(--tx)}
.crumbs [aria-current]{color:var(--tx);font-weight:600}
.soon{padding:2.25rem 0 5.5rem;min-height:60vh;--notch-bg:#fff}
.soon__in{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);gap:3.5rem;align-items:start}
.soon .kicker{margin-bottom:1.1rem}
.soon__pb{display:grid;place-items:center;width:56px;height:56px;margin:0 0 1rem;border-radius:17px;background:#fff;border:1px solid var(--line);box-shadow:var(--sh-1)}
.soon__h{margin:2rem 0 .6rem;font-family:var(--mono);font-size:.75rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--tx-3)}
.soon .btns{margin-top:2rem}
.ticks{display:grid;gap:.6rem;color:var(--tx-2);font-size:.96rem}
.ticks li{display:flex;align-items:flex-start;gap:.55rem}
.ticks .ic{color:var(--mint-ink);margin-top:.22rem}
.soon__links{display:grid;gap:.5rem;margin-top:.4rem}
.soon__links a{display:flex;align-items:center;gap:.8rem;padding:.75rem 1rem;border-radius:var(--r);border:1px solid var(--line);background:#fff;color:var(--tx);font-weight:600;transition:border-color .15s,box-shadow .15s}
.soon__links a:hover{border-color:var(--line-2);box-shadow:var(--sh-1)}
.soon__links a > span{display:flex;flex-direction:column;min-width:0;line-height:1.3}
.soon__links a > span small{font-size:.8rem;font-weight:500;color:var(--tx-3)}
.soon__links b{margin-left:auto;font-weight:700;font-variant-numeric:tabular-nums;white-space:nowrap}
.soon__links small{font-weight:500;color:var(--tx-3)}
.soon__card{position:relative;overflow:hidden;padding:1.5rem;border-radius:var(--r-lg);background:var(--ink-900);color:var(--od);box-shadow:var(--sh-2)}
.soon__card::after{content:"";position:absolute;right:-80px;top:-90px;width:260px;height:260px;border-radius:50%;background:radial-gradient(closest-side,rgba(60,242,165,.22),transparent);pointer-events:none}
.soon__ck{display:flex;align-items:center;gap:.5rem;margin:0 0 .6rem;font-family:var(--mono);font-size:.75rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--mint)}
.soon__cn{margin:0;font-family:var(--display);font-weight:700;font-size:1.5rem;letter-spacing:-.02em;color:#fff}
.soon__cv{margin:.15rem 0 1.1rem;font-size:.87rem;color:var(--od-3)}
.soon__terms{display:grid;gap:.45rem;margin-bottom:1.1rem}
.soon__terms li{display:flex;align-items:center;gap:.6rem;padding:.7rem .9rem;border-radius:var(--r-sm);background:rgba(255,255,255,.05);border:1px solid var(--lnd);font-size:.93rem}
.soon__terms b{margin-left:auto;color:#fff;font-variant-numeric:tabular-nums}
.soon__terms small{font-weight:700;font-size:.75rem;color:var(--mint)}
.soon__cf{margin:0;font-size:.85rem;color:var(--od-3)}
.soon__search{display:flex;gap:.5rem;margin-top:1.6rem;max-width:560px}
.soon__q{flex:1;min-width:0;height:48px;padding:0 1.1rem;border-radius:var(--pill);border:1px solid var(--line-2);background:#fff;font-size:16px;color:var(--tx);-webkit-appearance:none;appearance:none}
.soon__q:focus{outline:none;border-color:var(--mint-ink);box-shadow:0 0 0 4px rgba(8,116,78,.12)}
.soon__search .btn{height:48px}

/* ── 17. Réactif ──────────────────────────────────────────────────────── */
@media (min-width:1280px){.ibtn__l{display:inline}}
@media (max-width:1240px){
  .hd__usp li:nth-child(3){display:none}
  .mm__in{gap:1.25rem 1.5rem;padding:1.4rem 1.5rem 1.2rem}
}
@media (max-width:1180px){
  .srch{display:none}
  .ibtn--search{display:inline-flex}
  .hd__acts{margin-left:auto}
  .plans{grid-template-columns:repeat(3,minmax(0,1fr))}
  .hpass{width:320px}
  .hpass--2{right:170px}
}
@media (max-width:1060px){
  :root{--bar-h:62px}
  .hd{top:0}
  .hd__top{display:none}
  .nav,.ibtn--acct{display:none}
  .burger{display:grid}
  .brands__h{display:none}
  .hero__in{grid-template-columns:1fr;gap:2rem;padding-top:2.5rem;padding-bottom:2.25rem}
  .hero__copy{max-width:720px}
  .hero__stack{justify-self:stretch;max-width:none;height:auto;display:flex;gap:14px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding-inline:var(--gut);scrollbar-width:none;contain:inline-size;margin:0 calc(-1 * var(--gut));padding:6px var(--gut) 10px}
  .hero__stack::-webkit-scrollbar{display:none}
  .hpass{position:relative;top:auto;right:auto;rotate:none;animation:none;flex:0 0 300px;width:300px;scroll-snap-align:start}
  .hpass__card{height:192px}
  .hero__facts{grid-template-columns:repeat(2,minmax(0,1fr))}
  .how,.why__grid,.biz,.faqw{grid-template-columns:1fr;gap:2.5rem}
  .pp__in{grid-template-columns:1fr;gap:1.75rem}
  .pp__media{position:relative;top:auto;min-height:0}
  .pp__stage{padding:1.25rem 0 1.25rem}
  .ocs,.ocs--2{grid-template-columns:repeat(2,minmax(0,1fr))}
  .guar--4{grid-template-columns:repeat(2,minmax(0,1fr))}
  .dlvs__grid{grid-template-columns:1fr;gap:2.5rem}
  .rcpt{max-width:520px}
  .bnf{grid-template-columns:repeat(2,minmax(0,1fr))}
  .cl-bar{position:static;-webkit-backdrop-filter:none;backdrop-filter:none;background:#fff}
  .cl-bar__in{grid-template-columns:1fr;grid-template-areas:"q" "cats" "row"}
  .faqw__side{position:static}
  .ft__grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .ft__brand{grid-column:1 / -1}
  .ft__desc{max-width:60ch}
  .soon__in{grid-template-columns:1fr;gap:2.5rem}
}
@media (max-width:900px){
  .plans{grid-template-columns:repeat(2,minmax(0,1fr))}
  .guar{grid-template-columns:1fr}
  .sec{padding:4rem 0}
  .why{padding:4.5rem 0}
  .cta{padding-bottom:4rem}
  .cta__card{padding:2.5rem 2rem}
  .ft__help{grid-template-columns:1fr}
  .fbar{align-items:stretch}
}
@media (max-width:700px){
  :root{--gut:18px}
  .hd__bar-in{gap:.4rem}
  .brand__name{font-size:1.05rem}
  .mark{width:30px;height:30px}
  .brands__in{height:50px}
  .brands__all{display:none}
  .brands__list{-webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 36px),transparent);mask-image:linear-gradient(90deg,#000 calc(100% - 36px),transparent)}
  .tabs{-webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 36px),transparent);mask-image:linear-gradient(90deg,#000 calc(100% - 36px),transparent);margin-right:calc(-1 * var(--gut));padding-right:var(--gut)}
  .hero__in{padding-top:1.9rem;padding-bottom:1.75rem;gap:1.6rem}
  .hero__kicker{font-size:.8rem;margin-bottom:1rem}
  .hero__h{font-size:clamp(2rem,7.4vw + .3rem,2.5rem);margin-bottom:.85rem}
  .hero__p{font-size:1rem}
  .hero .btns{margin-top:1.4rem;display:grid;grid-template-columns:1fr 1fr;gap:.6rem}
  .hero .btns .btn{padding:0 .8rem}
  .hero__quick{margin-top:1.25rem;flex-wrap:nowrap}
  .hero__ql{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;contain:inline-size;min-width:0;margin-right:calc(-1 * var(--gut));padding-right:var(--gut)}
  .hero__ql::-webkit-scrollbar{display:none}
  .hpass{flex-basis:272px;width:272px}
  .hpass__card{height:176px;padding:15px 16px 14px}
  .hpass__name{font-size:1.32rem}
  .hpass__chip{top:58px;right:16px;width:36px;height:27px}
  .hpass__price{font-size:1.25rem}
  .hero__facts{gap:.9rem 1rem;padding-top:1rem;padding-bottom:1rem}
  .hero__facts li{gap:.65rem;align-items:flex-start}
  .hero__fi{width:36px;height:36px;border-radius:11px}
  .hero__facts li{align-items:center}
  .hero__facts b + span{display:none}
  .hero__facts b{font-size:.86rem}
  .sec{padding:3.25rem 0}
  .sec__head{margin-bottom:1.5rem}
  .plans{grid-template-columns:1fr;gap:1rem}
  .pc__body{padding:1rem 1.05rem .9rem}
  .pc__name{font-size:1.2rem;margin:.75rem 0 .25rem}
  .pc__del{margin-bottom:.7rem}
  .pc__perf{margin:0 1.05rem}
  .pc__perf::before{left:calc(-1.05rem - 12px)}
  .pc__perf::after{right:calc(-1.05rem - 12px)}
  .pc__buy{padding:.85rem 1.05rem 1.05rem}
  .pc__now{font-size:1.65rem}
  .pc__acts{margin-top:.75rem}
  .pc__acts .btn{min-height:46px}
  .plans__acts{width:100%}
  .plans__acts .btn{flex:1}
  .step:not(:last-child)::before{left:19px;top:46px}
  .step{grid-template-columns:40px 1fr;gap:.9rem}
  .step__n{width:40px;height:40px}
  .shot__steps{grid-template-columns:1fr;gap:.55rem;padding:.8rem 0}
  .shot__f{grid-template-columns:72px minmax(0,1fr) auto}
  .shot__f dd:not(.shot__mono){white-space:normal}
  .shot__foot{flex-wrap:wrap}
  .shot__body{padding:1.1rem 1.1rem 1.15rem}
  .why__save{flex-direction:column;gap:.4rem}
  .why__save span{max-width:none}
  .cmp,.cmp tbody,.cmp tr,.cmp th,.cmp td{display:block}
  .cmp{border:0;border-radius:0;background:none;overflow:visible}
  .cmp thead{display:none}
  .cmp tbody{display:grid;gap:.75rem}
  .cmp tr{display:grid;grid-template-columns:1fr 1fr;gap:.6rem;padding:.95rem;border-radius:var(--r-lg);border:1px solid var(--lnd-2);background:rgba(255,255,255,.03)}
  .cmp th,.cmp td{padding:0;border:0}
  .cmp tbody th{grid-column:1 / -1;width:auto;font-size:.98rem}
  .cmp td{display:flex;gap:.3rem;flex-direction:column;padding:.6rem .7rem;border-radius:var(--r-sm);font-size:.86rem;line-height:1.45;background:rgba(255,255,255,.03)}
  .cmp td::before{content:attr(data-l);font-family:var(--mono);font-size:.75rem;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--od-3)}
  .cmp .cmp__us{box-shadow:none;background:rgba(60,242,165,.07);border:1px solid rgba(60,242,165,.25)}
  .cmp td.cmp__us::before{color:var(--mint)}
  .cmp__v .ic{display:none}
  .guar{margin-top:2.25rem}
  .biz__list{grid-template-columns:1fr}
  .faq__i summary{font-size:1rem;min-height:58px}
  .cta__card{padding:2rem 1.4rem;border-radius:var(--r-lg);background-position:62% 50%}
  .cta__card::before{background:linear-gradient(180deg,rgba(6,7,15,.9),rgba(6,7,15,.72))}
  .cta .btns{width:100%;display:grid;grid-template-columns:1fr;gap:.6rem}
  .ft__grid{grid-template-columns:1fr 1fr;gap:2rem 1.25rem;padding-top:2.5rem}
  .ft__bottom{flex-direction:column;align-items:flex-start}
  .mnu__links{grid-template-columns:1fr}
  .soon__search{flex-direction:column}
  .pp{padding-top:.75rem}
  .pp__media{padding:1rem;border-radius:var(--r-lg)}
  .pp__pass{width:min(340px,100%);padding:18px 18px 16px}
  .pp__pass .hpass__chip{top:62px;right:18px;width:40px;height:30px}
  .pp__pass .hpass__price{font-size:1.5rem}
  .pp__facts{gap:.35rem}
  .pp__facts li{height:32px;padding:0 .7rem;font-size:.78rem}
  .ofr__btn,.ofr__one{min-height:68px;padding:.7rem .85rem .7rem 1rem;gap:.7rem}
  .ofr__p{font-size:1.15rem}
  .ofr__o{grid-template-columns:minmax(0,1fr) auto;padding:.6rem .75rem}
  .ofr__ok{display:none}
  .pp__amt{font-size:2.3rem}
  .ocs,.ocs--2,.guar--4{grid-template-columns:1fr}
  .dlvs{padding:3.75rem 0}
  .tl{gap:1.3rem;margin-top:1.5rem}
  .tl__i{grid-template-columns:42px minmax(0,1fr);gap:.9rem}
  .tl__i:not(:last-child)::before{left:20px;top:48px;bottom:calc(-1.3rem + 6px)}
  .tl__ic{width:42px;height:42px;border-radius:13px}
  .tl__t{font-size:1.08rem;margin-top:.4rem}
  .rcpt{display:none}
  .bnf{grid-template-columns:1fr 1fr;gap:.5rem;margin-top:2.25rem}
  .bnf li{flex-direction:column;align-items:flex-start;gap:.55rem;padding:.9rem}
  .sbar__chg{display:none}
  .sbar__t small{font-size:.8rem}
  .cl-head{padding:1rem 0 1.25rem}
  .cl-facts li{height:32px;font-size:.8rem;padding:0 .7rem}
  .cl-cats{margin-right:calc(-1 * var(--gut));padding-right:var(--gut);-webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 36px),transparent);mask-image:linear-gradient(90deg,#000 calc(100% - 36px),transparent)}
  .cl-q__in,.cl-sel select{font-size:16px}
  .cl-row2{align-items:flex-start}
  .cl-opts{width:100%}
  .cl-sel{flex:1 1 140px}
  .cl-sel select{width:100%}
  .cl-tbl,.cl-tbl tbody,.cl-tbl tr,.cl-tbl th,.cl-tbl td{display:block}
  .cl-tbl{border:0;border-radius:0;background:none;overflow:visible}
  .cl-tbl thead{display:none}
  .cl-tbl tbody{display:grid;gap:.75rem}
  .cl-tbl tbody tr{display:grid;grid-template-columns:1fr 1fr;gap:.55rem .9rem;padding:1rem;border:1px solid var(--line);border-radius:var(--r-lg);background:#fff}
  .cl-tbl tbody tr[hidden]{display:none}
  .cl-tbl th,.cl-tbl td{padding:0;border:0}
  .cl-tbl tbody th{grid-column:1 / -1;padding-bottom:.65rem;border-bottom:1px solid var(--line)}
  .cl-tbl td::before{content:attr(data-l);display:block;margin-bottom:.1rem;font-family:var(--mono);font-size:.75rem;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--tx-3)}
  .cl-tbl__p{text-align:left !important}
  .cl-tbl__a{width:auto;grid-column:1 / -1;text-align:left !important}
  .cl-tbl__a .btn{width:100%;min-height:44px}
}
@media (max-width:420px){
  .brand__name{font-size:.98rem}
  .brand{gap:.5rem}
  .hpass{flex-basis:258px;width:258px}
}
/* Écrans tactiles et mobiles : aucune cible sous 40 px (puces, durée, liens de pied de page, fil d'Ariane). */
@media (pointer:coarse),(max-width:700px){
  .brands__a,.chip{height:40px}
  .tab{height:44px}
  .ft__col ul{gap:.1rem}
  .ft__col a,.ft__legal a{padding:.55rem 0}
  .crumbs a{display:inline-block;padding:.6rem 0}
  .soon__links a{min-height:48px}
  .lnk{min-height:40px}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none !important;transition:none !important;scroll-behavior:auto !important}
}

/* ── 18. Commun à tout le site (23/09/2026) ───────────────────────────── */
/* Logos monochromes sur les cartes BLANCHES posées dans une section sombre
   (reçu de livraison) : la règle .on-dark .logo les passait en blanc. */
.on-dark .rcpt .logo{color:var(--tx)}
.note a{color:var(--tx-2);font-weight:600;text-decoration:underline;text-decoration-color:var(--mint);text-decoration-thickness:2px;text-underline-offset:3px}
.note a:hover{color:var(--tx)}
/* Notification éphémère (ajout au panier, copie) */
.toast{position:fixed;left:50%;bottom:calc(24px + env(safe-area-inset-bottom));z-index:80;display:flex;align-items:center;gap:.9rem;max-width:calc(100vw - 32px);padding:.7rem .75rem .7rem 1.05rem;border-radius:var(--pill);background:var(--ink-900);color:#fff;box-shadow:var(--sh-pop);font-size:.92rem;font-weight:500;translate:-50% 20px;opacity:0;visibility:hidden;transition:opacity .2s var(--ease),translate .2s var(--ease),visibility 0s linear .2s}
.toast.is-on{opacity:1;translate:-50% 0;visibility:visible;transition-delay:0s}
.toast .ic{color:var(--mint);flex:none}
.toast__t{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.toast__a{flex:none;display:inline-flex;align-items:center;height:36px;padding:0 1rem;border-radius:var(--pill);background:var(--mint);color:var(--ink-900);font-weight:700;font-size:.88rem;cursor:pointer}
.toast__a:hover{background:var(--mint-hi)}
.p-product .toast.is-up{bottom:calc(96px + env(safe-area-inset-bottom))}
/* Fiche produit : ajout au panier, à côté de « Buy now » */
.pp__add{margin-top:-.35rem}
