/* Cloudier — feuille de style. Mobile d'abord (390 px), élargie ensuite.
   Refonte du 21/10/2026 : mêmes sections et mêmes proportions que DreamsStudio
   (mesurées à 390 et 1280 px, voir inventaire/), avec l'identité de Cloudier :
   couleurs claires et polices de DreamsStudio, bleu clair à la place de leur
   rose (demande de Simon, 21/10/2026) ; logo Unbounded ; sticker 1/1.
   Mouvement : coupé sous prefers-reduced-motion (ici pour le CSS, dans site.js
   pour les défilements pilotés en JavaScript). */
/* Polices de DreamsStudio (demande de Simon, 21/10/2026) : Poppins pour le
   texte, Amiri pour les titres, toutes deux sous licence libre OFL et servies
   par le site. Unbounded ne reste que pour le logo « cloudier. ». */
@font-face{font-family:"Poppins";src:url("/fonts/Poppins-latin-400-normal.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"Poppins";src:url("/fonts/Poppins-latin-400-italic.woff2") format("woff2");font-weight:400;font-style:italic;font-display:swap}
@font-face{font-family:"Poppins";src:url("/fonts/Poppins-latin-700-normal.woff2") format("woff2");font-weight:500 900;font-style:normal;font-display:swap}
@font-face{font-family:"Poppins";src:url("/fonts/Poppins-latin-700-italic.woff2") format("woff2");font-weight:500 900;font-style:italic;font-display:swap}
@font-face{font-family:"Amiri";src:url("/fonts/Amiri-latin-400-normal.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"Amiri";src:url("/fonts/Amiri-latin-400-italic.woff2") format("woff2");font-weight:400;font-style:italic;font-display:swap}
@font-face{font-family:"Amiri";src:url("/fonts/Amiri-latin-700-normal.woff2") format("woff2");font-weight:500 900;font-style:normal;font-display:swap}
@font-face{font-family:"Amiri";src:url("/fonts/Amiri-latin-700-italic.woff2") format("woff2");font-weight:500 900;font-style:italic;font-display:swap}
@font-face{font-family:"Unbounded";src:url("/fonts/Unbounded-latin.woff2") format("woff2");font-weight:500 900;font-display:swap}

/* Couleurs claires de DreamsStudio, avec un BLEU CLAIR à la place de leur rose
   (#EB91C7 → #8EC5EC : même clarté, même saturation, teinte bleue). Sur le bleu
   clair, le texte est foncé (#2E2A39, 7,5:1) : le blanc n'y tiendrait que
   1,85:1. --acc-ink : un bleu plus soutenu pour le TEXTE (prix, mots
   en couleur), 5,4:1 sur blanc. Thème clair uniquement, comme DreamsStudio. */
:root{color-scheme:light;--ground:#FFFFFF;--panel:#F4F9FD;--panel2:#E8E8E8;--ink:#2E2A39;--ink2:#5E5A69;--line:#E1E1E1;--acc:#8EC5EC;--acc-tint:#EAF5FD;--pale:#F4F9FD;--nuit:#0D2538;--ok:#1E9E5A;--ok-tint:rgba(30,158,90,.12);--warn:#8A5A00;--warnbg:#FFF4D6;--r:24px;--r2:16px;
  --acc-ink:#1F6FA8;--ok-ink:#167543;--on-acc:#2E2A39;--etoile:#FFC107;
  --d:"Amiri",Georgia,"Times New Roman",serif;--b:"Poppins",-apple-system,"Segoe UI",Roboto,Arial,sans-serif;--logo:"Unbounded",system-ui,sans-serif;--ease:cubic-bezier(.2,.8,.2,1);
  --ombre:2px 6px 15px rgba(46,42,57,.1);--hd-vis:0px;--sb-h:0px}
*{box-sizing:border-box}
[hidden]{display:none!important}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-bottom:var(--sb-h);overscroll-behavior-y:none;background:var(--ground)}
body{margin:0;min-height:100dvh;display:flex;flex-direction:column;background:var(--ground);color:var(--ink);font:16px/1.55 var(--b);letter-spacing:0;-webkit-font-smoothing:antialiased}
body>main{flex:1}
/* En colonne flexible, un enfant prend la largeur de son CONTENU : sans cette
   règle, la page débordait sur un écran de 390 (mesuré le 16/09/2026). */
body>header,body>main,body>footer,body>.bd,body>.vague{width:100%;min-width:0}
img{max-width:100%;display:block}a{color:inherit}button{font-family:inherit;letter-spacing:inherit}
.wrap{padding:0 16px;max-width:1280px;margin:0 auto}
@media(min-width:750px){.wrap{padding:0 50px}}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
:focus-visible{outline:3px solid var(--acc-ink);outline-offset:3px;border-radius:6px}
.skip{position:absolute;left:8px;top:-60px;z-index:60;background:var(--ink);color:var(--ground);padding:10px 16px;border-radius:999px;font-weight:700;text-decoration:none}
.skip:focus{top:8px}

/* Apparition au défilement, comme DS : fondu + léger flou, en cascade. */

/* ---------- Bandeau d'annonce (DS : custom_liquid_hXtRhU) ---------- */
.bd{position:relative;display:flex;align-items:center;justify-content:center;min-height:44px;background:var(--acc);color:var(--on-acc);overflow:hidden;text-align:center}
.bd__msg{display:flex;align-items:center;justify-content:center;width:100%;min-height:44px;margin:0;padding:0 44px;border:0;background:none;color:inherit;font:700 13px/1.2 var(--b);text-transform:uppercase;letter-spacing:.05em;cursor:default}
button.bd__msg{cursor:pointer}
.bd__msg b{display:inline-block;background:var(--nuit);color:var(--acc);border-radius:4px;padding:.35em .55em .3em;margin-left:.3em}
.bd__lang{display:flex;align-items:center;width:100%;min-height:44px}
.bd__lien{flex:1;display:flex;align-items:center;justify-content:center;min-height:44px;padding-left:44px;font:700 13px/1.2 var(--b);text-transform:uppercase;letter-spacing:.05em;color:inherit;text-decoration:none}
.bd__x{flex:0 0 44px;width:44px;height:44px;border:0;background:none;color:inherit;display:grid;place-items:center;cursor:pointer}
.bd :focus-visible{outline-color:var(--on-acc);outline-offset:-4px}
@media(min-width:750px){.bd__msg,.bd__lien{font-size:14px}}
/* Habillage Halloween, retiré tout seul après HALLOWEEN_FIN (build + script) */
.bd__toile{position:absolute;top:0;width:20px;height:20px;color:rgba(13,37,56,.35);pointer-events:none}
.bd__toile--g{left:0}.bd__toile--d{right:0;transform:scaleX(-1)}
.bd__chauve{position:absolute;left:-40px;width:16px;height:8px;color:var(--nuit);opacity:.45;pointer-events:none;animation:vol 15s linear infinite}
.bd__chauve--1{top:5px}
.bd__chauve--2{top:28px;width:12px;height:6px;animation-duration:21s;animation-delay:7s}
@keyframes vol{0%{transform:translateX(0) translateY(0)}25%{transform:translateX(30vw) translateY(-2px)}50%{transform:translateX(55vw) translateY(2px)}100%{transform:translateX(calc(100vw + 80px)) translateY(0)}}
.bd--halloween .bd__txt{animation:lueur 6s infinite}
@keyframes lueur{0%,92%,100%{opacity:1}93%{opacity:.55}95%{opacity:1}96%{opacity:.7}}
@media(min-width:750px){.bd__toile{width:26px;height:26px}}

/* ---------- En-tête (DS : header) ---------- */
.hd{position:sticky;top:0;z-index:20;background:var(--ground);border-bottom:1px solid var(--line);transition:transform .15s ease-out}
.hd--cache{transform:translateY(-100%)}
.hd__in{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;max-width:1280px;margin:0 auto;padding:3px 4px}
.hd__menu{justify-self:start}
.hd__nav{display:none}
.hd__logo{grid-column:2;display:flex;align-items:center;min-height:44px;font:800 23px/1 var(--logo);letter-spacing:-.045em;color:var(--ink);text-decoration:none;padding:0 4px}
.hd__logo i{font-style:normal;color:var(--acc)}
.hd__droite{grid-column:3;justify-self:end;display:flex;align-items:center;gap:2px}
.hd__ic{position:relative;width:44px;height:44px;border:0;background:none;border-radius:999px;color:var(--ink);display:grid;place-items:center;cursor:pointer;transition:transform .2s var(--ease),background .2s}
.hd__ic:active{transform:scale(.92)}
.hd__cons{display:inline-flex;align-items:center;min-height:44px;padding:0 10px;border-radius:999px;color:var(--ink);text-decoration:none;font:400 14px var(--b)}
.hd__cons[aria-current=page]{font-weight:700}
@media(min-width:1200px){.hd__cons{display:none}}
.hd__n{position:absolute;top:4px;right:2px;background:var(--acc);color:var(--on-acc);font:700 11px/18px var(--b);letter-spacing:0;min-width:18px;height:18px;border-radius:9px;text-align:center;padding:0 4px}
.hd__n.bump{animation:bump .45s var(--ease)}
.hd__lang{display:none}
@media(hover:hover){.hd__ic:hover{background:var(--panel)}}
@media(min-width:990px){
  .hd__in{padding:10px 50px;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);column-gap:24px}
  .hd__lang{display:inline-flex;align-items:center;min-height:44px;padding:0 14px;border-radius:999px;font:700 13px var(--b);text-decoration:none;color:var(--ink)}
  .hd__lang:hover{background:var(--panel)}
}
/* Menu en ligne seulement quand il tient à côté du logo (sinon il le touchait et le
   décentrait, mesuré de 990 à 1440 px) ; en dessous, le menu ☰. */
@media(min-width:1200px){
  .hd__menu{display:none}
  .hd__nav{display:flex;align-items:center;gap:2px;grid-column:1;grid-row:1;justify-self:start}
  .hd__lien{display:inline-flex;align-items:center;min-height:44px;padding:0 10px;border-radius:999px;color:var(--ink);text-decoration:none;font:400 14px var(--b);letter-spacing:.03em;white-space:nowrap;transition:color .2s,background .2s}
  .hd__lien:hover{color:var(--acc-ink)}
  .hd__lien[aria-current=page]{background:var(--acc);color:var(--on-acc);font-weight:700}
}

/* ---------- Menu en tiroir (DS : header-drawer) ---------- */
.mn{position:fixed;inset:0;z-index:35}
.mn__ov{position:absolute;inset:0;background:rgba(46,42,57,.5);opacity:0;transition:opacity .2s}
.mn__panel{position:absolute;top:0;bottom:0;left:0;width:min(360px,calc(100vw - 40px));background:var(--ground);border-right:1px solid var(--line);display:flex;flex-direction:column;transform:translateX(-100%);transition:transform .25s var(--ease);outline:0}
.mn.on .mn__ov{opacity:1}.mn.on .mn__panel{transform:none}
.mn__t{display:flex;align-items:center;justify-content:space-between;padding:10px 8px 10px 20px;border-bottom:1px solid var(--line);font:400 22.1px var(--d);letter-spacing:.04em}
.mn__x{width:44px;height:44px;border:0;background:none;border-radius:999px;color:var(--ink);display:grid;place-items:center;cursor:pointer}
.mn__l{list-style:none;margin:0;padding:8px 0}
.mn__l a{display:flex;align-items:center;min-height:48px;padding:0 20px;font:400 18px var(--b);color:var(--ink);text-decoration:none}
.mn__l a[aria-current=page]{background:var(--panel)}
.mn__bas{border-top:1px solid var(--line);padding:12px 20px calc(16px + env(safe-area-inset-bottom));display:flex;flex-direction:column;gap:8px}
.mn__lang{display:inline-flex;align-items:center;min-height:44px;font:600 14px var(--b);color:var(--ink)}
.mn__soc{display:flex;justify-content:center;gap:4px}
.mn__soc a{width:44px;height:44px;display:grid;place-items:center;color:var(--ink)}

/* ---------- Hero (DS : custom_liquid ds-hero) ---------- */
.hero{position:relative;height:clamp(290px,40vh,400px);overflow:hidden;background:#2E2A39}
.hero__img img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 36%;background-size:cover;background-position:50% 36%}
/* Comme DS : titre et bouton en bas, centrés, sans plaque. La console est cadrée
   au centre, dans le haut de l'image (catalogue/vitrine.json) ; un dégradé sombre
   monte du bas pour que le titre blanc reste lisible sur l'herbe. */
.hero::after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(13,37,56,.74),rgba(13,37,56,.42) 40%,rgba(13,37,56,0) 68%);pointer-events:none}
.hero__c{position:absolute;left:0;right:0;bottom:0;z-index:1;display:flex;flex-direction:column;align-items:center;gap:14px;padding:0 16px 22px;text-align:center}
.hero h1{margin:0;font:italic 700 clamp(26px,7vw,38px)/1.1 var(--d);letter-spacing:.01em;color:#fff;text-shadow:0 2px 12px rgba(0,0,0,.5)}
.hero__e{font-style:normal;text-shadow:none}
.hero__cta{display:inline-flex;align-items:center;gap:8px;min-height:48px;padding:0 30px;border-radius:999px;background:#E0F0FF;color:#1F6FA8;font:italic 700 16px var(--b);text-decoration:none;box-shadow:0 4px 16px rgba(0,0,0,.15);transition:transform .15s,background .15s}
.hero__cta:active{transform:scale(.96)}
@media(hover:hover){.hero__cta:hover{background:#FFFFFF}}
.hero__cta:focus-visible{outline:3px solid #FFFFFF;outline-offset:2px;box-shadow:0 0 0 6px #2E2A39}
/* Desktop : titre et bouton sur une ligne, sous la console plutôt que dessus. */
@media(min-width:750px){.hero{height:clamp(320px,46vh,460px)}.hero__c{flex-direction:row;flex-wrap:wrap;justify-content:center;gap:12px 28px;padding:0 32px 26px}.hero h1{font-size:clamp(27px,3.2vw,38px)}}
/* Image bandeau (mêmes conditions que HERO_LARGE dans build.mjs) : console au tiers haut. */
@media(min-width:750px) and (min-aspect-ratio:5/4){.hero__img img{object-position:50% 35%;background-position:50% 35%}}
#gammes{scroll-margin-top:60px}

/* ---------- Rangées de consoles (DS : featured-collection) ---------- */
.rg{padding:9px 0 0}
.rg__t{margin:12px 16px 20px;text-align:center;font:400 26px/1.23 var(--d);letter-spacing:.06rem}
.rg__t em,.ins h2 em,.fq__t em,.it h2 em,.ug h2 em,.page h1 em{font-style:normal;color:var(--acc-ink)}
.sl{position:relative}
.sl__track{display:flex;gap:15px;overflow-x:auto;scroll-snap-type:x mandatory;margin:0;padding:9px 24px 21px;list-style:none;scrollbar-width:none;scroll-padding:0 24px}
.sl__track::-webkit-scrollbar{display:none}
.sl__item{flex:0 0 calc((100% - 15px)/2);min-width:0;scroll-snap-align:start}
.sl__ctl{display:flex;align-items:center;justify-content:center;gap:2px;margin-top:-12px;padding-bottom:6px}
.sl__fl{width:44px;height:44px;border:0;background:none;color:var(--ink);opacity:.75;display:grid;place-items:center;cursor:pointer;border-radius:999px}
.sl__fl[disabled]{opacity:.3;cursor:default}
.sl__dots{display:flex;align-items:center;gap:0}
.sl__dots i{width:18px;height:18px;display:grid;place-items:center}
.sl__dots i::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--ink);opacity:.4;transition:all .2s}
.sl__dots i.on::before{width:9px;height:9px;opacity:1}
@media(min-width:750px){
  .rg{padding-top:12px;padding-bottom:16px}
  .rg__t{font-size:31.2px;margin:16px 50px 30px}
  .rg:not(.rg--glisse) .sl__track{display:flex;flex-wrap:wrap;justify-content:center;gap:40px;overflow:visible;max-width:1280px;margin:0 auto;padding:9px 50px 21px}
  .rg:not(.rg--glisse) .sl__item{flex:0 0 calc((100% - 80px)/3)}
  .rg:not(.rg--glisse) .sl__ctl{display:none}
  .rg--glisse .sl__track{gap:40px;padding:9px 50px 21px;max-width:1280px;margin:0 auto;scroll-padding:0 50px;clip-path:inset(0 40px)}
  .rg--glisse .sl__item{flex-basis:calc((100% - 80px)/3)}
}

/* Carte (DS : carte blanche, ombre douce, image carrée, texte centré) */
.cd{position:relative;display:flex;flex-direction:column;height:100%;background:var(--ground);border-radius:14px;box-shadow:var(--ombre)}
.cd__m{position:relative;aspect-ratio:4/3;overflow:hidden;border-radius:14px 14px 0 0;background:var(--panel)}
.cd__m picture,.cd__m img{width:100%;height:100%}
.cd__m img{object-fit:cover;background-size:cover;transition:transform .5s var(--ease)}
.cd__survol{position:absolute;inset:0;opacity:0;transition:opacity .3s}
@media(hover:hover){.cd:hover .cd__survol{opacity:1}.cd:hover .cd__m img{transform:scale(1.03)}.cd:hover .cd__a{text-decoration:underline;text-underline-offset:3px}}
.stk{position:absolute;top:10px;left:10px;z-index:1;background:var(--ink);color:var(--ground);font:700 11px/1 var(--b);letter-spacing:.02em;padding:6px 8px;border-radius:8px;transform:rotate(-6deg);box-shadow:0 4px 12px rgba(0,0,0,.18);pointer-events:none}
.cd__badge{position:absolute;left:8px;bottom:8px;z-index:1;background:var(--acc);color:var(--on-acc);font:700 10px/1 var(--b);letter-spacing:.02em;padding:6px 8px;border-radius:999px;pointer-events:none}
.cd.vendu .cd__badge{background:var(--ink);color:var(--ground)}
.cd.vendu .cd__m img{filter:grayscale(1);opacity:.6}
.cd__b{display:flex;flex-direction:column;align-items:center;gap:2px;flex:1;padding:8px 8px 10px;text-align:center}
.cd__fam{margin:0;font:400 12px/1.3 var(--b);letter-spacing:.02em;color:var(--ink2)}
.cd__n{margin:0;font:400 14px/1.35 var(--b);letter-spacing:0}
.cd__a{color:inherit;text-decoration:none}
.cd__a::after{content:"";position:absolute;inset:0;z-index:1;border-radius:14px}
.cd__a:focus-visible{outline:0}
.cd__a:focus-visible::after{outline:3px solid var(--acc-ink);outline-offset:3px}
.cd__p{margin:auto 0 0}
.cd__qa{position:relative;z-index:2;width:100%;min-height:44px;margin-top:8px;border:0;border-radius:999px;background:var(--acc);color:var(--on-acc);font:700 12.5px/1.25 var(--b);letter-spacing:0;padding:6px 8px;cursor:pointer;transition:transform .15s}
@media(min-width:1100px){.cd__qa{min-height:48px;font-size:15px;letter-spacing:.04em}}
.cd__qa:active{transform:scale(.96)}
.cd__qa[disabled]{background:var(--panel2);color:var(--ink2);cursor:default}
.prix{font:700 16px/1.4 var(--b);letter-spacing:0;color:var(--acc-ink);font-variant-numeric:tabular-nums}
.prix.avenir{font:600 13px/1.3 var(--b);color:var(--ink2);letter-spacing:0}
.prix.big{font-size:25px}
.prix.big.avenir{font-size:17px}
@media(min-width:750px){.cd__n{font-size:15px}.prix.big{font-size:25px}.cd__badge{font-size:11px}}

/* ---------- Ticker (DS : horizontal-ticker) ---------- */
.tk{background:var(--acc);color:var(--on-acc)}
/* Une seule ligne, courte : sur un petit écran elle glisse du doigt au lieu de passer sur 4 lignes */
.tk__l{display:flex;flex-wrap:nowrap;justify-content:flex-start;gap:16px;max-width:1280px;margin:0 auto;padding:8px 16px;list-style:none;overflow-x:auto;scrollbar-width:none}
.tk__l::-webkit-scrollbar{display:none}
.tk__l li{display:inline-flex;align-items:center;gap:5px;flex:0 0 auto;white-space:nowrap;font:700 12.5px/1.4 var(--b)}
.tk__k svg{width:38px;height:20px;padding:2px 6px;border-radius:5px;background:#FFB3C7}
@media(min-width:600px){.tk__l{justify-content:center}}
.tk__l svg{flex:0 0 auto}

/* ---------- Carrousels (DS : Community Thoughts / Send Us Your Decor) ----------
   Mêmes titres, textes et commandes que le reste du site (Amiri, Poppins, ‹ • ›) :
   DS y mettait du Georgia et du Courier New, que Simon trouvait hors sujet. */
.ug{background:var(--pale);padding:36px 0 24px}
.ug__h{max-width:520px;margin:0 auto 22px;padding:0 16px;text-align:center}
.ug h2{margin:0;font:400 26px/1.23 var(--d);letter-spacing:.06rem}
.ug__s{margin:8px 0 0;font-size:14px;line-height:1.5;color:var(--ink2);letter-spacing:.02em}
.ug__tampon{display:inline-block;margin:0 0 10px;padding:5px 14px;border-radius:999px;background:#FFFFFF;box-shadow:inset 0 0 0 1px rgba(31,111,168,.22);color:var(--acc-ink);font:400 13px/1.2 var(--b);letter-spacing:.03em}
.ug__zone{position:relative}
.ug__piste{display:flex;gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;margin:0;padding:4px 40px 8px;list-style:none;scrollbar-width:none;scroll-padding:0 40px}
.ug__piste::-webkit-scrollbar{display:none}
.ug__c{flex:0 0 42%;max-width:165px;aspect-ratio:9/16;border-radius:14px;overflow:hidden;background:var(--ground);box-shadow:0 4px 16px rgba(0,0,0,.1);border:1px solid rgba(0,0,0,.06);scroll-snap-align:center}
.ug--atelier .ug__piste{gap:14px;padding:4px 16px 8px;scroll-padding:0 16px}
.ug--atelier .ug__c{flex-basis:62%;max-width:240px;aspect-ratio:1/1}
.ug__photo{position:relative;display:block;height:100%}
.ug__photo picture,.ug__photo img{width:100%;height:100%}
.ug__photo img{object-fit:cover;background-size:cover}
.ug__leg{position:absolute;left:50%;bottom:10px;transform:translateX(-50%);width:max-content;max-width:calc(100% - 20px);background:rgba(255,255,255,.94);color:var(--ink);font:400 15px/1.3 var(--d);letter-spacing:.04em;padding:5px 12px;border-radius:14px;box-shadow:0 2px 8px rgba(46,42,57,.12);text-align:center}
/* Commandes sous la piste, comme les rangées de produits ; pause à droite. */
.ug__ctl{position:relative;margin-top:4px;flex-wrap:wrap}
@media(min-width:600px){.ug__c{flex-basis:19%;max-width:190px}.ug--atelier .ug__c{flex-basis:24%;max-width:260px}}
@media(min-width:600px){.ug__c{scroll-snap-align:start}}
@media(min-width:750px){.ug h2{font-size:31.2px}.ug--atelier .ug__piste{padding:4px 50px 8px;scroll-padding:0 50px}}

/* ---------- Garantie (DS : rich_text, bande pleine largeur) ---------- */
.ga{background:var(--acc);color:var(--on-acc);padding:32px 0 36px;text-align:center}
.ga h2{margin:0 0 20px;font:400 26px/1.23 var(--d);letter-spacing:.06rem}
.ga h2 em{font-style:italic}
.ga__sous{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin:0 0 18px;padding:0;list-style:none}
.ga__sous li{padding:6px 14px;border-radius:999px;background:rgba(255,255,255,.55);font:400 13px/1.35 var(--b);letter-spacing:.02em}
.ga__p{margin:0 auto 10px;max-width:72ch;font:400 15px/27px var(--b);text-wrap:pretty}
.ga__droits{margin:0;font-size:13px}
.ga__droits a{color:inherit;font-weight:700}
.ga__lien{display:inline-flex;align-items:center;min-height:44px}
@media(min-width:750px){.ga{padding:40px 0 44px}.ga h2{font-size:31.2px}.ga__p{font-size:16px;line-height:28.8px}}

/* ---------- FAQ et accordéons (DS : collapsible-content) ---------- */
.fq,.acc{padding:27px 0}
.fq__in{max-width:734px;margin:0 auto;padding:0 20px}
.fq__t{margin:0 0 20px;text-align:center;font:400 29.25px/1.23 var(--d);letter-spacing:.06rem}
details.q{border-bottom:1px solid var(--line)}
details.q:first-child{border-top:1px solid var(--line)}
details.q summary{display:flex;align-items:center;gap:10px;min-height:44px;padding:12.5px 0;cursor:pointer;list-style:none;font:400 15px/1.4 var(--b);letter-spacing:0}
details.q summary::-webkit-details-marker{display:none}
.q__t{flex:1}
.q__ic{display:grid;place-items:center;color:var(--acc-ink)}
.q__caret{display:grid;place-items:center;color:var(--ink2);transition:transform .2s var(--ease)}
details.q[open] .q__caret{transform:rotate(180deg)}
@media(hover:hover){details.q summary:hover .q__t{text-decoration:underline;text-underline-offset:.3rem}}
details.q .a{padding:0 6px 15px;color:var(--ink2);font-size:15px;line-height:1.75}
details.q .a p{margin:0 0 10px}
details.q .a ul{margin:0 0 10px;padding-left:20px}
details.q .a h2{font:400 18px var(--d);color:var(--ink);margin:12px 0 6px}
.spec{overflow-x:auto}
.spec table{width:100%;border-collapse:collapse;font-size:14px}
.spec th,.spec td{padding:9px 8px;border-bottom:1px solid var(--line);text-align:left;vertical-align:top}
.spec thead th{font-weight:800;color:var(--ink)}
.spec .spec__ici{color:var(--acc-ink)}
@media(min-width:750px){.fq,.acc{padding:36px 0}.fq__t{font-size:39px;margin-bottom:30px}}

/* ---------- Témoignages (DS : testimonials) ---------- */
/* Étoiles décoratives, note lue dans un .sr : le parent positionné garde ce .sr
   dans le carrousel (sinon il en sort et la page déborde sur le côté). */

/* ---------- Avis (DS : widget Judge.me) ---------- */
.av{padding:27px 0}
.av__t{margin:0 0 10px;text-align:center;font:400 29.25px/1.23 var(--d);letter-spacing:.06rem}
.av__res{text-align:center;margin-bottom:20px}
.av__res p{margin:2px 0}
.av__e{color:var(--etoile);font-size:22px;letter-spacing:3px}
.av__l{list-style:none;margin:0;padding:0;display:grid;gap:12px}
.av__c{display:flex;gap:12px;background:var(--ground);border:1px solid rgba(46,42,57,.06);border-radius:var(--r2);box-shadow:var(--ombre);padding:16px}
.av__c>div{min-width:0;overflow-wrap:anywhere}   /* texte à 200 % : un mot long ne pousse plus la carte hors de l'écran */
.av__i{flex:0 0 40px;height:40px;border-radius:50%;background:var(--acc-tint);color:var(--acc-ink);display:grid;place-items:center;font:700 16px var(--b);letter-spacing:0}
.av__e2{margin:0;color:var(--etoile);font-size:12px;letter-spacing:1px}
.av__n{margin:2px 0;font-weight:700;font-size:14px}
.av__n span{font-weight:400;color:var(--ink2)}
.av__x{margin:0;font:italic 400 17px/1.45 var(--d);letter-spacing:.01em}
.av__plus{margin:16px 0 0;text-align:center;font-size:13px;color:var(--ink2)}
@media(min-width:750px){.av{padding:36px 0}.av__t{font-size:39px}.av__l{grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}}

/* ---------- Pied de page (DS : footer) — noir, logo géant ---------- */
.ft{background:var(--acc);color:var(--on-acc);padding:24px 0 calc(15px + env(safe-area-inset-bottom))}
.ft h2{margin:0 0 20px;font:400 20.8px/1.23 var(--d);letter-spacing:.06em}
.ft__haut{display:grid;gap:32px;padding-bottom:28px}
.ft__but p{margin:0 0 10px;color:var(--on-acc);font-size:15px;line-height:1.8}
.ft__liens ul{list-style:none;margin:0;padding:0}
.ft__liens a{display:flex;align-items:center;min-height:44px;color:var(--on-acc);text-decoration:none;font:400 14px var(--b)}
.ft__liens a:hover{text-decoration:underline;text-underline-offset:.3rem}
.ft__insta p{margin:0 0 12px;color:var(--on-acc);font-size:15px}
.ft__btn{display:inline-flex;align-items:center;min-height:49px;padding:0 24px;border-radius:999px;background:#FFFFFF;color:var(--acc-ink);font:700 16px var(--b);text-decoration:none}
.ft__soc{display:flex;justify-content:center;gap:4px;padding-bottom:16px}
.ft__soc a{width:44px;height:44px;display:grid;place-items:center;color:var(--on-acc)}
.ft__bas{border-top:1px solid rgba(46,42,57,.15);padding-top:16px;text-align:center}
.ft__langue{margin:0 0 8px;font-size:13px}
.ft__langue a{display:inline-flex;align-items:center;min-height:44px;color:var(--on-acc);font-weight:700}
.ft__copy{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:0 14px;margin:0;font-size:12px;color:var(--on-acc)}
.ft__copy a{display:inline-flex;align-items:center;min-height:44px;padding:0 4px;color:var(--on-acc)}
.ft small{display:block;max-width:72ch;margin:12px auto 0;opacity:.85;font-size:12px;line-height:1.5;text-wrap:balance}
@media(min-width:990px){.ft__haut{grid-template-columns:minmax(0,1.6fr) minmax(0,1fr) minmax(0,1fr)}}
/* /mission : le pied répétait le texte de la page juste au-dessus. */
body[data-page="mission"] .ft__but{display:none}
@media(min-width:750px){body[data-page="mission"] .ft__haut{grid-template-columns:1fr 1fr}}
.ft__logo{margin:24px 0 0;font:800 clamp(52px,15vw,130px)/.9 var(--logo);letter-spacing:-.06em;text-align:center}
.ft__logo i{font-style:normal;color:var(--acc-ink)}
.pay{display:flex;flex-wrap:wrap;justify-content:center;gap:5px;list-style:none;margin:12px 0;padding:0}
.pay__i{display:grid;place-items:center;width:40px;height:28px;border-radius:6px;background:#FFFFFF;box-shadow:inset 0 0 0 1px rgba(46,42,57,.14)}
.pay__i svg{width:28px;height:18px}
.pay__i--k{background:#FFB3C7;box-shadow:none}
@media(min-width:750px){
  .ft{padding:32px 0 calc(20px + env(safe-area-inset-bottom))}
  .ft__haut{grid-template-columns:1fr 1.3fr 1.3fr;gap:40px;padding-bottom:50px}
  .ft__liens ul{margin-top:-8px}
  .ft__soc{justify-content:flex-end}
}
body.sb-on .ft{padding-bottom:calc(90px + env(safe-area-inset-bottom))}

/* Bouton retour en haut (DS : scroll-to-top-btn) */
.haut{position:fixed;right:15px;bottom:calc(15px + var(--sb-h) + env(safe-area-inset-bottom));z-index:14;width:44px;height:44px;border:0;border-radius:50%;background:var(--acc);color:var(--on-acc);box-shadow:0 0 0 2px #FFFFFF,0 4px 14px rgba(46,42,57,.25);display:grid;place-items:center;cursor:pointer;transition:bottom .15s}
@media(min-width:750px){.haut{right:20px;bottom:calc(20px + var(--sb-h))}}

/* Vague avant le pied de page (DS : section-divider waves) */
.vague{line-height:0;background:var(--ground);overflow:hidden}
.vague svg{display:block;width:calc(100% + 300px);height:30px}
.vague path{fill:var(--acc)}
.vague__2{opacity:.4}.vague__3{opacity:.2}
@keyframes houle{to{transform:translateX(-300px)}}
@media(min-width:750px){.vague svg{height:60px}}

/* ---------- Fiche produit (DS : main-product, gabarit 3DS XL) ---------- */
.pr__gal{position:relative}
.gl{position:relative}
.gal{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;outline-offset:-3px}
.gal::-webkit-scrollbar{display:none}
/* min-width:0 : sans lui, l'image (800 px d'attribut) étirait la galerie. */
.gal figure{position:relative;flex:0 0 100%;width:100%;min-width:0;margin:0;scroll-snap-align:center}
.gal img{display:block;aspect-ratio:1/1;width:100%;height:auto;object-fit:cover;background-size:cover;background-color:var(--panel)}
.gal .stk{top:16px;left:16px;font-size:13px;padding:8px 10px;border-radius:10px}
.gl__ctl{position:absolute;inset:0;display:flex;align-items:center;justify-content:space-between;padding:0 12px;pointer-events:none}
.gl__ctl>*{pointer-events:auto}
.gl__fl{width:44px;height:44px;border:0;border-radius:50%;background:rgba(46,42,57,.85);color:#fff;display:grid;place-items:center;cursor:pointer}
.th{display:flex;align-items:center;gap:2px;padding:7.5px 4px}
.th__fl{flex:0 0 44px;width:44px;height:44px;border:0;background:none;color:var(--ink);display:grid;place-items:center;cursor:pointer}
.thumbs{flex:1;min-width:0;display:flex;gap:7.5px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none}
.thumbs::-webkit-scrollbar{display:none}
.thumbs button{flex:0 0 calc((100% - 22.5px)/4);aspect-ratio:1;padding:0;border:0;border-radius:8px;overflow:hidden;background:var(--panel);cursor:pointer;scroll-snap-align:start;box-shadow:0 0 0 1px transparent;transition:opacity .2s}
.thumbs button{position:relative}
.thumbs button[aria-current=true]::after{content:"";position:absolute;inset:0;border:2px solid var(--ink);border-radius:8px;pointer-events:none}
.thumbs img{width:100%;height:100%;object-fit:cover}
@media(hover:hover){.thumbs button:hover{opacity:.7}}
.pr__info{padding:15px 16px 0}
.ur{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:6px 10px;max-width:360px;margin:10px auto;padding:9px 16px;background:var(--pale);border:1px solid rgba(142,197,236,.5);border-radius:12px;font:400 13px/1.3 var(--b);color:var(--ink)}
.ur b{font-weight:700;color:var(--acc-ink)}
@media(min-width:990px){.ur{max-width:none;margin:0 0 8px}}
.ur__ic{display:flex;color:var(--acc-ink)}
.ur__tag{background:var(--acc);color:var(--on-acc);font:700 11px var(--b);padding:3px 10px;border-radius:999px;white-space:nowrap}
.ur--off .ur__ic,.ur--off .ur__tag{display:none}
.nt{display:inline-flex;align-items:center;gap:8px;min-height:44px;color:var(--ink);text-decoration:none}
.nt__e{display:inline-flex;gap:1px}
.nt__e i{font-style:normal;color:var(--etoile);font-size:15px;display:inline-block}
.nt__x{font:400 14px var(--b);letter-spacing:.02em}
.nt__x b{font-weight:700}
.nt__sep{color:var(--ink2);margin:0 6px;font-style:normal}
.pr__t{margin:8px 0;font:400 26px/1.23 var(--d);letter-spacing:.06rem}
.pr__prix{margin:9px 0 2px}
.klarna{margin:0 0 4px;font-size:13px;color:var(--ink2)}
.sw{display:flex;flex-wrap:wrap;gap:8px;list-style:none;margin:0 0 12px;padding:0}
.sw__i{position:relative;display:block;width:58px;height:58px;border-radius:50%;overflow:hidden;border:3px solid var(--ground);box-shadow:0 0 0 1px var(--line)}
.sw__i[aria-current=page]{box-shadow:0 0 0 2px var(--ink)}
.sw__i img{width:100%;height:100%;object-fit:cover}
.sw__i--vendu img{filter:grayscale(1);opacity:.6}
.sw__i--vendu::after{content:"";position:absolute;inset:0;background:linear-gradient(to top right,transparent calc(50% - 1px),var(--ink) 50%,transparent calc(50% + 1px))}
.pr__etat{margin:0 0 4px;font-size:14px;line-height:1.6;color:var(--ink2)}
.pr__etat b{color:var(--ok-ink)}
.in{margin:21px 0}
.in__t{margin:18px 0 9px;text-align:center;font:400 16px/1.3 var(--d);letter-spacing:.06em}
@media(min-width:750px){.in__t{font-size:20px;margin-bottom:12px}}
.in__l{display:grid;gap:0;list-style:none;margin:0;padding:0;background:var(--ground);border:1px solid rgba(46,42,57,.06);border-radius:var(--r2);box-shadow:var(--ombre);overflow:hidden}
.in__r{display:flex;align-items:center;gap:10px;min-height:56px;padding:8px 14px 8px 10px;background:none}
.in__r+.in__r{border-top:1px solid var(--line)}
.in__ic{flex:0 0 40px;height:40px;border-radius:10px;background:var(--acc-tint);color:var(--acc-ink);display:grid;place-items:center}
.in__x{flex:1;min-width:0;font:400 14px/1.4 var(--b);letter-spacing:.02em}
.in__ok{font:700 12px var(--b);color:var(--acc-ink);background:var(--acc-tint);border-radius:999px;padding:4px 10px;white-space:nowrap}
.cta{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;min-height:52px;border:0;border-radius:999px;background:var(--ink);color:var(--ground);font:700 16px var(--b);text-decoration:none;cursor:pointer;margin-top:12px;transition:transform .2s var(--ease),background .2s,color .2s}
.cta:active{transform:scale(.97)}
.cta[disabled]{background:var(--panel2);color:var(--ink2);cursor:default;transform:none}
.cta--acc{background:var(--acc);color:var(--on-acc);font-weight:700}
.cta--ligne{background:transparent;color:var(--ink);box-shadow:inset 0 0 0 2px var(--ink)}
#buy{margin-top:20px}
#add{margin-top:10px}
/* Fiche : remise annoncée sous le prix, état de CETTE console, réassurance à coches */
.pr__mp{margin:12px 0 0}
.pr__etat-bloc{margin:16px 0 0;padding:14px 16px;background:var(--ground);border:1px solid rgba(46,42,57,.06);border-radius:var(--r2);box-shadow:var(--ombre)}
.pr__etat-bloc .pr__etat{margin:0}
#etat-detail p{margin:8px 0 0;font-size:14px;line-height:1.5}
#etat-detail p:empty{display:none}
.ras{list-style:none;margin:12px 0 0;padding:0;display:grid;gap:8px}
.ras li{display:flex;align-items:flex-start;gap:8px;font-size:14px;line-height:1.5;color:var(--ink)}
.ras svg{flex:0 0 16px;margin-top:3px;color:var(--acc-ink)}
.ras a{color:inherit}
.pr__q{margin-top:8px}
.pr__contact{margin:12px 0 0;font-size:14px;line-height:1.5;color:var(--ink2)}
.sw__t{margin:20px 0 8px;font-size:14px;color:var(--ink2)}
.pr__note{margin:8px 0 0;font-size:13.5px;color:var(--ink2)}
.pr__note:empty{display:none}
.bloc{margin-top:18px}
.bloc>h2{font:400 20px/1.2 var(--d);letter-spacing:.04em;margin:0 0 8px}
.bloc p{color:var(--ink2);margin:0 0 6px}
@media(min-width:750px){.thumbs button{flex-basis:calc((100% - 30px)/5)}.pr__t{font-size:31.2px}}
@media(min-width:990px){
  .pr__main{display:grid;grid-template-columns:minmax(0,55fr) minmax(0,45fr);column-gap:40px;align-items:start;max-width:1280px;margin:0 auto;padding:36px 50px}
  .pr__gal,.pr__info{position:sticky;top:calc(var(--hd-vis) + 30px)}
  .gal{border-radius:var(--r);overflow:hidden}
  .gl__ctl{display:none}
  .pr__info{padding:0}
}

/* Barre d'achat fixe (DS : sticky-atc) */
.sb{position:fixed;left:0;right:0;bottom:0;z-index:16;background:var(--ground);box-shadow:none;padding:10px 16px calc(15px + env(safe-area-inset-bottom));transform:translateY(100%);transition:transform .15s}
.sb.on{transform:none;box-shadow:0 -2px 15px rgba(46,42,57,.1)}
.sb__in{display:flex;align-items:center;gap:10px;max-width:1280px;margin:0 auto}
.sb__img{display:none;width:52px;height:52px;border-radius:8px;object-fit:cover}
.sb__x{flex:1;min-width:0}
.sb__t{margin:0;font:400 14px/1.3 var(--b);letter-spacing:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sb__p{margin:2px 0 0}
.sb__p .prix{font-size:18px}
.sb__btn{min-height:44px;padding:0 18px;border:0;border-radius:999px;background:var(--acc);color:var(--on-acc);font:700 15px var(--b);white-space:nowrap;cursor:pointer}
.sb__btn[disabled]{background:var(--panel2);color:var(--ink2)}
@media(min-width:750px){.sb{padding:10px 50px calc(10px + env(safe-area-inset-bottom))}.sb__img{display:block}.sb__t{font-size:16px}.sb__btn{min-height:52px;padding:0 28px;font-size:16px}}

/* Bloc image + texte (DS : image-with-text, rendu blanc) */
.it{padding:20px 0 16px}
.it__in{display:grid;gap:20px}
.it__txt{text-align:center;padding:20px 0}
.it h2{margin:0 0 12px;font:400 26px/1.23 var(--d);letter-spacing:.06rem}
.it p{margin:0 0 10px;color:var(--ink2);font-size:15px;line-height:1.8}
.it__img img{width:100%;height:auto;aspect-ratio:1;object-fit:cover;border-radius:var(--r);background-size:cover}
@media(min-width:750px){.it{padding:36px 0}.it__in{grid-template-columns:1fr 1fr;gap:0}.it__img{order:-1}.it__in{align-items:center}.it__txt{text-align:left;padding:0 0 0 70px}.it h2{font-size:31.2px}.it p{font-size:16px}}

/* ---------- Collection : /consoles (DS : collections/all) ---------- */
.ban{background:var(--acc);color:var(--on-acc);text-align:center;padding:28px 16px}
.ban h1{margin:0;font:400 29.25px/1.23 var(--d);letter-spacing:.06rem}
@media(min-width:750px){.ban{padding:30px 50px}.ban h1{font-size:39px}}
.ins{background:var(--pale);padding:52px 0 68px;text-align:center}
.ins h2{margin:0 0 10px;font:400 26px/1.23 var(--d);letter-spacing:.06rem}
.ins h2 em{white-space:nowrap}
@media(min-width:750px){.ins h2{font-size:31.2px}}
.ins p{margin:0 0 16px;color:var(--ink2)}
.ins__btn{display:inline-flex;width:auto;padding:0 28px}

/* ---------- Panier (DS : cart-drawer et cart/) ---------- */
.ov{position:fixed;inset:0;background:rgba(46,42,57,.5);z-index:30;opacity:0;transition:opacity .25s}
.ov.on{opacity:1}
.dr{position:fixed;top:0;right:0;bottom:0;width:min(400px,100%);background:var(--ground);color:var(--ink);z-index:31;transform:translateX(calc(100% + 80px));transition:transform .25s var(--ease);display:flex;flex-direction:column;box-shadow:-10px 0 40px rgba(0,0,0,.2)}
.dr.on{transform:none}
.dr__h{display:flex;align-items:center;justify-content:space-between;padding:10px 12px 10px 16px;border-bottom:1px solid var(--line)}
.dr__h h2{margin:0;font:400 26px var(--d);letter-spacing:.04em}
.dr__h h2 span{font:400 14px var(--b);color:var(--ink2);letter-spacing:0}
.dr__x{width:44px;height:44px;border:0;background:var(--panel);border-radius:999px;color:var(--ink);display:grid;place-items:center;cursor:pointer}
.dr__corps{flex:1;overflow-y:auto;display:flex;flex-direction:column}
.pn__res{background:#2E2A39;color:#FFFFFF;font:700 13px/1.4 var(--b);padding:12px 16px;text-align:center}
.pn__items{padding:6px 16px}
.it-l{display:flex;align-items:center;gap:12px;padding:10px 0;border-bottom:1px solid var(--line)}
.it-l img{width:72px;height:72px;border-radius:12px;object-fit:cover;background:var(--panel)}
.it-l__i{flex:1;min-width:0}.it-l__i b{display:block;font:400 15px/1.35 var(--b);letter-spacing:0;overflow-wrap:anywhere}.it-l__i span{font-size:13px;color:var(--ink2)}.it-l__i .it-l__px{font-weight:700;color:var(--acc-ink)}
.pn__items .it-l:last-child{border-bottom:0}
.it-l__rm{width:44px;height:44px;border:0;background:none;color:var(--ink2);border-radius:999px;display:grid;place-items:center;cursor:pointer}
.pn__foot{padding:12px 16px calc(12px + env(safe-area-inset-bottom));border-top:1px solid var(--line);display:grid;gap:10px;margin-top:auto}
.pn__vide{padding:40px 16px;text-align:center}
.pn__vide p{margin:0 0 8px;font:400 26px/1.23 var(--d);letter-spacing:.04em}
.pn__vide .cta{display:inline-flex;width:auto;padding:0 28px}
.pn__info{display:flex;align-items:center;gap:8px;margin:0;padding:10px 12px;background:var(--acc-tint);border-radius:14px;font:400 13.5px var(--b)}
.pn__info svg{color:var(--acc-ink);flex-shrink:0}
.pn__msg{margin:0;font-size:13.5px;color:var(--warn)}.pn__msg:empty{display:none}
.liv{border:0;padding:0;margin:0;display:grid;gap:6px}
.liv legend{font:400 14px var(--b);letter-spacing:.02em;color:var(--ink);margin-bottom:6px}
.liv label{display:flex;align-items:center;gap:10px;background:var(--ground);border:1px solid var(--line);border-radius:14px;padding:9px 13px;font-size:14px;cursor:pointer;min-height:44px}
.liv label:has(input:checked){border:2px solid var(--acc-ink);background:var(--acc-tint);padding:8px 12px}
.liv small{display:block;color:var(--ink2);font-size:12.5px}
.liv input{width:18px;height:18px;margin:0;flex-shrink:0;accent-color:var(--acc-ink)}
.liv__off{margin:0;font-size:12.5px;color:var(--ink2);padding:2px 2px 0}
.tot{display:flex;justify-content:space-between;align-items:baseline;font-size:18px}
.tot b{font:700 20px var(--b);letter-spacing:.04em}
.tot small{display:block;font-size:12.5px;color:var(--ink2);font-weight:500}
.tot .rem{font:500 13px var(--b);color:var(--ink2);text-decoration:line-through;margin-right:8px;letter-spacing:0}
.pn__code details summary{cursor:pointer;font-size:13.5px;font-weight:700;color:var(--acc-ink);list-style:none;min-height:44px;display:flex;align-items:center}
.pn__code details summary::-webkit-details-marker{display:none}
.pn__code .row{display:flex;gap:6px;margin-top:6px}
.pn__code input{flex:1;min-width:0;font:inherit;border:2px solid var(--line);border-radius:999px;padding:0 14px;min-height:44px;text-transform:uppercase;background:var(--ground);color:var(--ink)}
.pn__code input:focus{border-color:var(--acc-ink);outline:0}
.pn__code .row button{border:0;border-radius:999px;background:var(--acc);color:var(--on-acc);font:700 13px var(--b);padding:0 18px;min-height:44px;cursor:pointer}
.pn__code .on{display:flex;justify-content:space-between;align-items:center;gap:8px;background:var(--acc-tint);border-radius:12px;padding:4px 4px 4px 12px;font-size:13.5px}
.pn__code .on b{color:var(--ink);letter-spacing:.03em}
.pn__code .on button{border:0;background:none;color:var(--ink);cursor:pointer;font:700 13px var(--b);min-height:44px;padding:0 10px;text-decoration:underline}
.pp{padding-top:28px;padding-bottom:28px}
.pp__h{display:flex;justify-content:space-between;align-items:baseline;gap:12px;flex-wrap:wrap;max-width:640px;margin:0 auto 12px}
.pp__h h1{margin:0;font:400 29.25px var(--d);letter-spacing:.04em}
.pp__h a{display:inline-flex;align-items:center;min-height:44px;color:var(--ink2)}
.pp__corps{max-width:640px;margin:0 auto;border:1px solid rgba(46,42,57,.06);border-radius:var(--r);box-shadow:var(--ombre);overflow:hidden}

/* ---------- Pages de texte ---------- */
.page{padding-bottom:28px}
@media(min-width:750px){.page.wrap{max-width:834px}}
[data-ds="main-contact"],[data-ds="rich_text-mission"]{text-align:center}
.page h1{font:400 clamp(29px,7vw,39px)/1.23 var(--d);letter-spacing:.04em;margin:24px 0 12px}
.page h2{font:400 23.4px/1.23 var(--d);letter-spacing:.04em;margin:22px 0 6px}
.page p,.page li{color:var(--ink2)}
.page__intro{font-size:17px;color:var(--ink)!important}
.page .avalider{background:var(--warnbg);color:var(--warn);border-radius:14px;padding:10px 14px;font-size:14px;margin:10px 0 18px}
.ph{background:var(--warnbg);color:var(--warn);border-radius:6px;padding:0 5px;font-weight:700}
.ct{display:grid;gap:10px;max-width:440px;margin:18px auto 40px}
.ct .cta{margin-top:0}
.fq--page{padding:24px 0 0}
.page .fq__t{font-size:29.25px;margin:0 0 20px;text-align:center}
@media(min-width:750px){.page .fq__t{font-size:39px;margin-bottom:30px}}
.sv__f{display:grid;gap:8px;max-width:480px;margin-top:18px}
.sv__f label{font:600 14px var(--b)}
.sv__f input{width:100%;min-width:0;font:inherit;min-height:48px;border:2px solid var(--line);border-radius:999px;padding:0 16px;background:var(--ground);color:var(--ink)}
.sv__f input:focus{border-color:var(--ink);outline:0}
.sv__f .cta{margin-top:0}
.sv__msg{margin:0;font-size:13.5px;color:var(--warn)}.sv__msg:empty{display:none}
.sv__res{background:var(--panel);border-radius:var(--r);padding:16px;margin:18px 0 0}
.sv__res p{margin:0 0 6px;color:var(--ink)}
.merci{text-align:center;padding:30px 0}
.merci .big{font-size:56px;line-height:1}
.relais{background:var(--panel);border-radius:var(--r);padding:16px;margin:18px 0;text-align:left}
.relais h2{font:400 20px var(--d);letter-spacing:.04em;margin:0 0 8px}
.relais .row{display:flex;gap:8px}
.relais input{flex:1;min-width:0;font:inherit;border:2px solid var(--line);border-radius:999px;padding:0 14px;min-height:46px;background:var(--ground);color:var(--ink)}
.relais .row button{border:0;border-radius:999px;background:var(--ink);color:var(--ground);font:700 14px var(--b);padding:0 18px;min-height:46px;cursor:pointer}
.relais ul{list-style:none;padding:0;margin:12px 0 0;display:grid;gap:8px}
.relais li button{width:100%;text-align:left;background:var(--ground);border:2px solid var(--line);border-radius:14px;padding:10px 12px;cursor:pointer;font:inherit;color:var(--ink)}
.relais li b{display:block;font-size:14.5px}
.relais li span{font-size:12.5px;color:var(--ink2)}
.relais__ok{background:var(--ok-tint);color:var(--ok-ink);border-radius:12px;padding:10px 12px;font-size:14px;font-weight:600}

/* ---------- Roue des remises (inchangée) ---------- */
.rw{position:fixed;inset:0;z-index:40}
.rw__ov{position:absolute;inset:0;background:rgba(0,0,0,.5)}
.rw__sheet{position:absolute;left:0;right:0;bottom:0;background:var(--ground);color:var(--ink);border-radius:28px 28px 0 0;padding:22px 18px calc(20px + env(safe-area-inset-bottom));max-height:94vh;overflow-y:auto;animation:rwup .45s var(--ease)}
@keyframes rwup{from{transform:translateY(40px);opacity:0}}
@media(min-width:720px){.rw{display:grid;place-items:center}.rw__sheet{position:relative;width:min(460px,92vw);border-radius:28px;padding:28px}}
.rw__x{position:absolute;top:10px;right:10px;width:44px;height:44px;border:0;border-radius:999px;background:var(--panel);cursor:pointer;color:var(--ink);display:grid;place-items:center}
.rw__eyebrow{margin:0;font:700 12px var(--b);letter-spacing:.08em;text-transform:uppercase;color:var(--ink2)}
.rw__t{font:400 clamp(26px,7vw,34px)/1.15 var(--d);letter-spacing:.03em;margin:8px 0 14px}
.rw__t em{font-style:normal;color:var(--acc-ink)}
.rw__wheel{position:relative;width:min(250px,66vw);margin:0 auto 16px}
.rw__wheel svg{width:100%;height:auto;display:block;border-radius:50%;box-shadow:0 12px 30px rgba(0,0,0,.2);transition:transform 4.6s cubic-bezier(.12,.75,.15,1)}
.rw__wheel svg text{font-family:var(--b)}
.rw__pin{position:absolute;top:-10px;left:50%;transform:translateX(-50%);width:0;height:0;border-left:13px solid transparent;border-right:13px solid transparent;border-top:24px solid var(--acc-ink);z-index:2;filter:drop-shadow(0 2px 3px rgba(0,0,0,.35))}
.rw__form{display:grid;gap:8px}
.rw__form input{font:inherit;border:2px solid var(--line);border-radius:999px;padding:0 16px;min-height:50px;width:100%;background:var(--ground);color:var(--ink)}
.rw__form input:focus{border-color:var(--ink);outline:0}
.rw__form .cta{margin-top:0}
.rw__msg{margin:8px 0 0;font-size:13.5px;color:var(--warn)}.rw__msg:empty{display:none}
.rw__legal{margin:10px 0 0;font-size:12px;color:var(--ink2);line-height:1.45}
.rw__legal a{display:inline-block;padding:4px 0}
.rw__code{display:flex;align-items:center;justify-content:space-between;gap:10px;background:var(--panel);border-radius:16px;padding:12px 14px;margin:14px 0 8px}
.rw__code b{font:700 22px var(--b);letter-spacing:.04em}
.rw__code button{border:0;border-radius:999px;background:var(--ink);color:var(--ground);font:700 13px var(--b);min-height:44px;padding:0 16px;cursor:pointer;flex-shrink:0}
.rw__info{margin:0 0 6px;font-size:13.5px;color:var(--ink2)}

/* Micro-animations : une réponse à un geste */
.mi-tick{animation:tick .3s var(--ease)}
@keyframes tick{from{transform:translateY(40%);opacity:.3}}
.bump{animation:bump .45s var(--ease)}
@keyframes bump{35%{transform:scale(1.4)}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}html{scroll-behavior:auto}.js .rv{opacity:1;filter:none}.bd__chauve{display:none}}

/* Texte agrandi à 200 % (zoom Safari « aA ») : un iPhone de 390 px n'offre
   plus que 195 px. Tout passe sur une colonne, rien ne doit déborder. */
@media(max-width:319px){
  .bd__msg,.bd__lien{padding:6px 8px;font-size:10px}
  .hd__in{grid-template-columns:auto 1fr auto}
  .hd__logo{grid-column:1/-1;grid-row:2;justify-self:center;font-size:18px}
  .in__r{flex-wrap:wrap}
  .in__x{flex-basis:calc(100% - 60px)}
  .sb__in{flex-wrap:wrap}
  .sb__btn{width:100%}
  .q__t{min-width:0;overflow-wrap:anywhere}
  .hero h1{font-size:20px}
  .sl__item{flex-basis:100%}
  .ug__c,.ug--atelier .ug__c{flex-basis:80%;max-width:none}
  .ur{flex-direction:column}
  .sb__t{white-space:normal}
  .ft__logo{font-size:15vw}
  .rg__t,.fq__t,.av__t,.pr__t,.page h1{hyphens:auto;overflow-wrap:anywhere}
}
.cd__n,.pr__t,.it-l__i b{overflow-wrap:anywhere}

/* Coupures de ligne : titres équilibrés, pas de mot seul en fin de paragraphe. */
.rg__t,.ug h2,.it h2,.fq__t,.av__t,.ga h2,.ins h2,.page h1{text-wrap:balance}
.it p,.ga__p,.ft__but p,.in__x,.av__x,.page__intro{text-wrap:pretty}

/* Cartes : l'état de la console sous son nom */
.cd__fam{display:flex;align-items:center;justify-content:center;gap:0 3px;max-width:100%;white-space:nowrap;overflow:hidden;font-size:11px;letter-spacing:0}
.cd__logo{width:12px;height:12px;fill:currentColor;flex:0 0 auto}
.cd__k{display:flex;align-items:center;justify-content:center;gap:4px;max-width:100%;margin:0;font-size:11px;line-height:1.3;letter-spacing:0;white-space:nowrap;color:var(--ink2)}
.k{width:22px;height:14px;padding:1px 3px;border-radius:3px;background:#FFB3C7;flex:0 0 auto}
/* Petits écrans et texte agrandi : on laisse passer à la ligne plutôt que de couper le texte */
@media(max-width:379px){.cd__fam,.cd__k{white-space:normal;flex-wrap:wrap;overflow:visible}}
.klarna{display:flex;align-items:center;gap:6px}
.klarna .k{width:26px;height:16px}
/* /consoles : grille de 2 cartes sur mobile, sans glissière (3 par rangée dès 750 px) */
@media(max-width:749px){.rg--grille .sl__track{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;overflow:visible;padding:9px 16px 21px}.rg--grille .sl__ctl{display:none}}
.ban__s{margin:10px auto 0;max-width:60ch;font-size:15px;line-height:1.5}
/* Avis : les 3 premiers, les autres repliés */
.av__plus-d{margin-top:12px}
.av__plus-d summary{display:flex;align-items:center;justify-content:center;min-height:44px;cursor:pointer;list-style:none;font-weight:700;color:var(--acc-ink)}
.av__plus-d summary::-webkit-details-marker{display:none}
.av__plus-d[open] summary{margin-bottom:12px}
