/* ============================================================
OXO SPA — édition cinématographique « fond clair »
palette : blanc chaud showroom + encre + or champagne + eau
============================================================ */
:root{
--paper:#F5F6F8; /* blanc froid net */
--paper-2:#FFFFFF;
--panel:#EAECF1; /* panneau clair bleuté */
--ink:#0E1A2B; /* encre bleu marine */
--ink-2:#223A52;
--ink-3:#2E4258;
--smoke:#7C8A99; /* gris bleuté */
--bone:#F5F6F8; /* clair (texte sur sections marine) */
--bone-dim:#B9C3CE;
--line:rgba(14,26,43,.13);
--line-2:rgba(14,26,43,.07);
--gold:#B0883A; /* or plein, lisible sur clair */
--gold-hi:#CBA456; /* or clair (sur marine / survol) */
--gold-deep:#B0883A; /* identique : plus de fondu */
--aqua:#244B6E; /* bleu acier (nuance de marine) */
--aqua-hi:#7FA8CC; /* bleu acier clair */
--dark:#0B1E33; /* bleu marine foncé (sections sombres) */
--dark-2:#102A45;
--grad-gold:#B0883A; /* or PLEIN (plus de dégradé fondu) */
--ease:cubic-bezier(.16,1,.3,1);
--pad:clamp(20px,5vw,88px);
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{
background:var(--paper);color:var(--ink);
font-family:"Archivo",system-ui,sans-serif;font-weight:400;line-height:1.6;
overflow-x:hidden;-webkit-font-smoothing:antialiased;
}
body.lock{overflow:hidden;height:100vh}
img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
::selection{background:var(--gold);color:#fff}
h1,h2,h3{font-weight:900;line-height:.92;letter-spacing:-.02em}
.display{font-stretch:118%}
.eyebrow{font-family:"Space Mono",monospace;font-size:clamp(10px,1.05vw,12.5px);
letter-spacing:.42em;text-transform:uppercase;color:var(--gold);font-weight:400}
.mono{font-family:"Space Mono",monospace}
.gold-text{background:var(--grad-gold);-webkit-background-clip:text;background-clip:text;color:transparent;background-size:200% auto}
/* film grain + vignette légère (discrète sur clair) */
.grain{position:fixed;inset:0;z-index:9000;pointer-events:none;opacity:.022;
background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");}
.vignette{position:fixed;inset:0;z-index:8999;pointer-events:none;
box-shadow:inset 0 0 240px 30px rgba(14,26,43,.10)}
/* ============ CURTAIN (sombre → révèle le clair) ============ */
#curtain{position:fixed;inset:0;z-index:10000;background:var(--dark);
display:grid;place-items:center;transition:opacity .8s var(--ease),visibility .8s}
#curtain.gone{opacity:0;visibility:hidden}
.curtain-mark{width:clamp(96px,15vw,150px);height:auto}
.curtain-mark .ring{fill:none;stroke:var(--gold);stroke-width:2.2;
stroke-dasharray:1;stroke-dashoffset:1;animation:draw 1.5s var(--ease) forwards}
.curtain-mark .ring.r2{animation-delay:.18s;stroke:var(--aqua-hi)}
.curtain-mark .wm{fill:var(--bone);opacity:0;animation:fadein .6s ease 1s forwards}
@keyframes draw{to{stroke-dashoffset:0}}
@keyframes fadein{to{opacity:1}}
.curtain-load{position:absolute;bottom:34px;font-family:"Space Mono",monospace;
font-size:11px;letter-spacing:.4em;color:var(--smoke);text-transform:uppercase}
/* ============ NAV ============ */
.nav{position:fixed;top:0;left:0;right:0;z-index:7000;display:flex;align-items:center;
justify-content:space-between;gap:18px;padding:18px var(--pad);
transition:background .5s,padding .5s,border-color .5s,box-shadow .5s;border-bottom:1px solid transparent}
.nav.scrolled{background:rgba(245,246,248,.88);backdrop-filter:blur(16px) saturate(140%);
padding-top:13px;padding-bottom:13px;border-bottom:1px solid var(--line);box-shadow:0 10px 40px -28px rgba(14,26,43,.5)}
.nav__brand{display:flex;align-items:center;gap:11px;font-weight:900;letter-spacing:.04em;
font-size:15px;text-transform:uppercase;font-stretch:112%}
.nav__brand svg{width:30px;height:30px;flex:none}
.nav__brand .tag{color:var(--gold);font-family:"Space Mono",monospace;font-weight:700;font-size:11px;letter-spacing:.18em}
body.photo-hero .nav:not(.scrolled) .nav__brand{color:var(--bone)}
body.photo-hero .nav:not(.scrolled) .nav__brand .tag{color:var(--gold-hi)}
body.photo-hero .nav:not(.scrolled) .nav__brand svg circle:nth-of-type(2){stroke:var(--aqua-hi)}
.nav__links{display:flex;gap:30px;align-items:center}
.nav__links a{font-size:13px;letter-spacing:.06em;color:var(--ink-2);text-transform:uppercase;
font-weight:600;transition:color .3s;position:relative}
.nav__links a::after{content:"";position:absolute;left:0;bottom:-6px;height:1px;width:0;
background:var(--gold);transition:width .35s var(--ease)}
.nav__links a:hover{color:var(--ink)}
.nav__links a:hover::after{width:100%}
.nav__links a.nav__sell{color:var(--gold);font-weight:700}
.nav__links a.nav__sell::before{content:"";display:inline-block;width:6px;height:6px;border-radius:50%;
background:var(--gold);margin-right:8px;vertical-align:middle;box-shadow:0 0 8px var(--gold)}
.nav__cta{display:inline-flex;align-items:center;gap:9px;font-family:"Space Mono",monospace;
font-size:12.5px;font-weight:700;letter-spacing:.06em;padding:11px 18px;border:1px solid var(--gold);
border-radius:2px;color:var(--gold);transition:background .35s var(--ease),color .35s,box-shadow .35s}
.nav__cta:hover{background:var(--gold);color:#fff;box-shadow:0 0 30px -8px var(--gold)}
.nav__cta svg{width:14px;height:14px}
.nav__burger{display:none;width:44px;height:38px;flex-direction:column;gap:5px;align-items:center;justify-content:center;border:1px solid var(--line);border-radius:2px}
.nav__burger span{width:18px;height:1.6px;background:var(--ink);transition:.3s}
@media(max-width:920px){.nav__links{display:none}.nav__burger{display:flex}}
/* mobile menu */
.mnav{position:fixed;inset:0;z-index:6900;background:var(--dark);transform:translateY(-100%);
transition:transform .55s var(--ease);display:flex;flex-direction:column;justify-content:center;padding:0 var(--pad)}
.mnav.show{transform:none}
.mnav a{font-family:"Archivo";font-weight:900;font-stretch:115%;text-transform:uppercase;
font-size:clamp(28px,7vw,46px);color:var(--bone);padding:14px 0;border-bottom:1px solid rgba(245,246,248,.12);letter-spacing:-.01em}
.mnav a .n{font-family:"Space Mono",monospace;font-size:12px;color:var(--gold);font-weight:700;margin-right:16px;letter-spacing:.1em;vertical-align:middle}
.mnav__close{position:absolute;top:22px;right:var(--pad);width:46px;height:46px;border:1px solid rgba(245,246,248,.2);
border-radius:2px;display:grid;place-items:center;color:var(--bone)}
.mnav__close svg{width:20px;height:20px}
/* ============ BUTTONS ============ */
.btn{display:inline-flex;align-items:center;gap:11px;font-weight:700;font-size:14px;letter-spacing:.04em;
padding:15px 26px;border-radius:2px;text-transform:uppercase;cursor:pointer;
transition:transform .35s var(--ease),background .35s,color .35s,box-shadow .35s,border-color .35s}
.btn svg{width:16px;height:16px;transition:transform .35s var(--ease)}
.btn--gold{background:var(--gold);color:#0B1E33;box-shadow:0 12px 34px -18px rgba(176,136,58,.9)}
.btn--gold:hover{background:var(--gold-hi);transform:translateY(-3px)}
.btn--gold:hover svg{transform:translateX(4px)}
.btn--ink{background:var(--ink);color:#fff}
.btn--ink:hover{transform:translateY(-3px);box-shadow:0 18px 44px -18px rgba(11,30,51,.85)}
.btn--ink svg{transform:none}
.btn--ink:hover svg{transform:translateX(4px)}
.btn--ghost{border:1px solid var(--line);color:var(--ink);background:transparent}
.btn--ghost:hover{border-color:var(--gold);color:var(--gold);transform:translateY(-3px)}
.btn--ghost-light{border:1px solid rgba(245,246,248,.25);color:var(--bone);background:rgba(245,246,248,.03)}
.btn--ghost-light:hover{border-color:var(--gold-hi);color:var(--gold-hi);transform:translateY(-3px)}
/* ============ HERO (clair, produit en lévitation) ============ */
.hero{position:relative;min-height:100svh;display:grid;grid-template-columns:1.05fr .95fr;
align-items:center;gap:clamp(20px,4vw,60px);padding:clamp(96px,14vh,150px) var(--pad) clamp(40px,6vh,70px);
max-width:1640px;margin:0 auto}
.hero__copy{position:relative;z-index:3}
.hero__eyebrow{margin-bottom:clamp(18px,2.4vh,30px);display:flex;align-items:center;gap:16px;
opacity:0;transform:translateY(20px);transition:.9s var(--ease) .2s}
.hero__eyebrow .rule{height:1px;width:54px;background:var(--gold);opacity:.8}
.hero h1{font-size:clamp(38px,6.4vw,88px);text-transform:uppercase;letter-spacing:-.035em}
.hero h1 .line{display:block;overflow:hidden;padding-bottom:.04em}
.hero h1 .ink{display:block;transform:translateY(115%);transition:transform 1.1s var(--ease)}
.hero__tag{max-width:42ch;font-size:clamp(15px,1.45vw,18.5px);color:var(--ink-2);line-height:1.55;
margin-top:clamp(20px,3vh,32px);opacity:0;transform:translateY(20px);transition:.9s var(--ease) .9s}
.hero__tag b{font-weight:700}
.hero__ctas{display:flex;gap:14px;flex-wrap:wrap;margin-top:clamp(22px,3vh,34px);
opacity:0;transform:translateY(20px);transition:.9s var(--ease) 1.05s}
.hero__stats{display:flex;gap:clamp(24px,3vw,46px);margin-top:clamp(34px,5vh,54px);flex-wrap:wrap;
opacity:0;transform:translateY(20px);transition:.9s var(--ease) 1.2s}
.hstat .v{font-family:"Space Mono",monospace;font-weight:700;font-size:clamp(26px,3vw,38px);line-height:1;letter-spacing:-.02em}
.hstat .v small{font-size:.5em;color:var(--gold)}
.hstat .k{font-family:"Space Mono",monospace;font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--smoke);margin-top:8px}
.hero__art{position:relative;z-index:2;align-self:center}
.hero__art .glow{position:absolute;inset:-12% -6% -6% -12%;z-index:0;
background:radial-gradient(60% 60% at 55% 42%,rgba(11,30,51,.13),transparent 62%),
radial-gradient(50% 50% at 60% 70%,rgba(176,136,58,.16),transparent 60%);filter:blur(8px)}
.hero__art img{position:relative;z-index:1;width:100%;transform:scale(1.04);
filter:drop-shadow(0 50px 60px rgba(14,26,43,.28));animation:floatIn 1.4s var(--ease) .3s both}
@keyframes floatIn{from{opacity:0;transform:translateY(26px) scale(1.02)}to{opacity:1;transform:scale(1.04)}}
.hero__art .shadow{position:absolute;left:8%;right:8%;bottom:2%;height:34px;z-index:0;
background:radial-gradient(closest-side,rgba(14,26,43,.30),transparent 78%);filter:blur(7px)}
.hero__hud{position:absolute;top:clamp(92px,12vh,120px);right:var(--pad);z-index:3;
font-family:"Space Mono",monospace;font-size:10.5px;letter-spacing:.18em;color:var(--smoke);
text-align:right;line-height:2.1;text-transform:uppercase;display:none}
.hero__hud span{color:var(--gold)}
@media(min-width:1180px){.hero__hud{display:block}}
.hero__scroll{position:absolute;left:50%;bottom:18px;transform:translateX(-50%);z-index:3;
display:flex;flex-direction:column;align-items:center;gap:9px;opacity:0;transition:opacity 1s ease 1.6s}
.hero__scroll .lbl{font-family:"Space Mono",monospace;font-size:9.5px;letter-spacing:.34em;text-transform:uppercase;color:var(--smoke)}
.hero__scroll .bar{width:1px;height:46px;background:linear-gradient(var(--gold),transparent);position:relative;overflow:hidden}
.hero__scroll .bar::after{content:"";position:absolute;top:-50%;left:0;width:100%;height:50%;background:var(--gold-hi);animation:scrollDot 1.8s ease-in-out infinite}
@keyframes scrollDot{0%{top:-50%}60%,100%{top:100%}}
body.loaded .hero__eyebrow,body.loaded .hero__tag,body.loaded .hero__ctas,body.loaded .hero__stats{opacity:1;transform:none}
body.loaded .hero h1 .ink{transform:translateY(0)}
body.loaded .hero h1 .l2 .ink{transition-delay:.34s}
body.loaded .hero h1 .l3 .ink{transition-delay:.5s}
body.loaded .hero__scroll{opacity:1}
/* fond hero travaillé */
.hero__bg{position:absolute;top:0;bottom:0;left:50%;width:100vw;transform:translateX(-50%);z-index:0;overflow:hidden;pointer-events:none}
.hero__bg .mesh{position:absolute;inset:-12%;
background:
radial-gradient(40% 46% at 14% 18%,rgba(16,42,69,.12),transparent 60%),
radial-gradient(44% 50% at 90% 24%,rgba(176,136,58,.13),transparent 62%),
radial-gradient(55% 55% at 72% 94%,rgba(16,42,69,.10),transparent 60%);
animation:meshDrift 20s ease-in-out infinite alternate}
@keyframes meshDrift{from{transform:translate3d(0,0,0) scale(1)}to{transform:translate3d(0,-2.4%,0) scale(1.06)}}
.hero__bubbles{position:absolute;inset:0}
.hero__bubbles .bub{position:absolute;bottom:-44px;border-radius:50%;
background:radial-gradient(circle at 32% 28%,rgba(255,255,255,.95),rgba(176,136,58,.16) 58%,rgba(176,136,58,.04) 100%);
border:1px solid rgba(176,136,58,.26);box-shadow:0 0 10px rgba(176,136,58,.10);
animation:rise linear infinite}
@keyframes rise{
0%{transform:translateY(0) translateX(0) scale(.5);opacity:0}
8%{opacity:.85}
50%{transform:translateY(-48vh) translateX(16px) scale(1)}
88%{opacity:.5}
100%{transform:translateY(-102vh) translateX(-12px) scale(1);opacity:0}}
/* pastille verte "En stock" shiny */
.hero__instock{position:absolute;top:4%;right:1%;z-index:4;display:inline-flex;align-items:center;gap:9px;
font-family:"Space Mono",monospace;font-weight:700;font-size:12px;letter-spacing:.12em;text-transform:uppercase;
color:#fff;padding:10px 17px;border-radius:40px;overflow:hidden;
background:linear-gradient(135deg,#16A34A,#2BD46B 52%,#138A41);
box-shadow:0 12px 28px -10px rgba(16,163,74,.75),inset 0 1px 0 rgba(255,255,255,.45)}
.hero__instock .d{width:8px;height:8px;border-radius:50%;background:#ecfff2;box-shadow:0 0 9px 2px rgba(255,255,255,.85);animation:isPulse 1.8s ease-in-out infinite}
.hero__instock::after{content:"";position:absolute;top:0;left:-60%;width:55%;height:100%;
background:linear-gradient(100deg,transparent,rgba(255,255,255,.6),transparent);transform:skewX(-18deg);animation:shine 3.4s ease-in-out infinite}
@keyframes shine{0%,52%{left:-60%}82%,100%{left:140%}}
@keyframes isPulse{0%,100%{opacity:.55;transform:scale(.82)}50%{opacity:1;transform:scale(1.12)}}
/* ---- variante hero avec photo de fond (TEST) ---- */
.hero.is-photo .hero__photo{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 58%}
.hero.is-photo .hero__scrim{position:absolute;inset:0;background:
linear-gradient(90deg,rgba(8,18,30,.88) 0%,rgba(8,18,30,.6) 30%,rgba(8,18,30,.18) 56%,rgba(8,18,30,0) 74%),
linear-gradient(0deg,rgba(8,18,30,.8) 2%,rgba(8,18,30,.22) 40%,rgba(8,18,30,0) 62%)}
.hero.is-photo .mesh,.hero.is-photo .hero__art{display:none}
.hero.is-photo .hero__bubbles .bub{background:radial-gradient(circle at 32% 28%,rgba(255,255,255,.96),rgba(196,220,238,.30) 55%,rgba(196,220,238,.05) 100%);border-color:rgba(255,255,255,.42);box-shadow:0 0 13px rgba(205,228,248,.28)}
.hero.is-photo .hero__eyebrow .rule{background:var(--gold-hi)}
.hero.is-photo .hero__eyebrow .eyebrow{color:var(--gold-hi)}
.hero.is-photo h1{color:var(--bone)}
.hero.is-photo .gold-text{background:none;-webkit-text-fill-color:var(--gold-hi);color:var(--gold-hi)}
.hero.is-photo .hero__tag{color:var(--bone-dim)}
.hero.is-photo .hero__tag b{color:#fff}
.hero.is-photo .hstat .v{color:var(--bone)}
.hero.is-photo .hstat .v small{color:var(--gold-hi)}
.hero.is-photo .hstat .k{color:var(--bone-dim)}
.hero.is-photo .hero__hud{color:rgba(244,239,230,.72)}
.hero.is-photo .hero__hud b{color:var(--gold-hi)}
.hero.is-photo .hero__hud span{color:var(--gold-hi)}
.hero.is-photo .hero__scroll .lbl{color:var(--bone-dim)}
.hero.is-photo .hero__scroll .line{background:rgba(244,239,230,.4)}
.hero.is-photo .btn--ghost{border-color:rgba(244,239,230,.34);color:var(--bone)}
.hero.is-photo .btn--ghost:hover{border-color:var(--gold-hi);color:var(--gold-hi);background:rgba(244,239,230,.05)}
@media(max-width:980px){.hero.is-photo .hero__scrim{background:linear-gradient(0deg,rgba(8,18,30,.9) 6%,rgba(8,18,30,.5) 46%,rgba(8,18,30,.32) 100%)}}
@media(prefers-reduced-motion:reduce){.hero__bg .mesh,.hero__bubbles .bub,.hero__instock::after,.hero__instock .d{animation:none}}
@media(max-width:980px){
.hero{grid-template-columns:1fr;text-align:center;padding-top:clamp(110px,16vh,150px)}
.hero__eyebrow{justify-content:center}
.hero__tag{margin-left:auto;margin-right:auto}
.hero__ctas,.hero__stats{justify-content:center}
.hero__art{order:-1;max-width:520px;margin:0 auto}
}
/* ============ TICKER ============ */
.ticker{border-top:1px solid var(--line);border-bottom:1px solid var(--line);overflow:hidden;background:var(--panel);padding:12px 0}
.ticker__track{display:flex;white-space:nowrap;width:max-content;animation:slide 40s linear infinite}
.ticker:hover .ticker__track{animation-play-state:paused}
.ticker__item{display:inline-flex;align-items:center;font-weight:700;font-stretch:104%;
font-size:clamp(13px,1.4vw,18px);text-transform:uppercase;letter-spacing:.02em;color:var(--ink);padding:0 24px}
.ticker__item .dot{width:5px;height:5px;border-radius:50%;background:var(--gold);margin-left:24px}
.ticker__item.dim{color:transparent;-webkit-text-stroke:1px rgba(14,26,43,.3)}
@keyframes slide{to{transform:translateX(-50%)}}
/* ============ SECTION generics ============ */
.section{padding:clamp(80px,12vh,150px) var(--pad);position:relative}
.shell{max-width:1500px;margin:0 auto}
.divider{height:1px;background:var(--line);margin:0 var(--pad)}
.reveal{opacity:0;transform:translateY(34px);transition:opacity 1s var(--ease),transform 1s var(--ease)}
.reveal.is-in{opacity:1;transform:none}
:focus-visible{outline:2px solid var(--gold);outline-offset:3px;border-radius:2px}
:where(#top,#apropos,#collection,#tech,#garanties,#parcours,#livraison,#avis,#contact){scroll-margin-top:84px}
/* ============ MANIFESTO + GAUGE (température) ============ */
.manifesto{display:grid;grid-template-columns:1.12fr .88fr;gap:clamp(40px,6vw,90px);align-items:center}
.manifesto__copy h2{font-size:clamp(32px,5vw,72px);text-transform:uppercase;margin-top:18px}
.manifesto__copy h2 em{font-style:normal;color:var(--gold)}
.manifesto__copy p{margin-top:24px;max-width:50ch;color:var(--ink-2);font-size:clamp(15px,1.35vw,18px)}
.manifesto__copy .sig{margin-top:30px;font-family:"Space Mono",monospace;font-size:12px;letter-spacing:.16em;color:var(--smoke);text-transform:uppercase}
.thermo{display:flex;align-items:center;justify-content:center;gap:clamp(20px,3vw,40px);max-width:430px;margin:0 auto}
.thermo__art{width:clamp(120px,16vw,168px);height:auto;flex:none;overflow:visible}
.thermo .t-tube{fill:rgba(14,26,43,.05)}
.thermo .t-outline{fill:none;stroke:var(--ink);stroke-width:3}
.thermo .t-merc{fill:var(--gold)}
.thermo #merc{transform-box:fill-box;transform-origin:bottom;transform:scaleY(0);transition:transform 1.9s var(--ease)}
.thermo.run #merc{transform:scaleY(var(--fill,.7))}
.thermo .t-scale line{stroke:rgba(14,26,43,.34)}
.thermo .t-scale line.major{stroke:var(--ink)}
.thermo .t-scale text{fill:var(--smoke);font-family:"Space Mono",monospace;font-size:13px}
.thermo .t-scale text.hot{fill:var(--gold)}
.thermo .t-steam{fill:none;stroke:var(--gold);stroke-width:1.4;stroke-linecap:round;opacity:.4;animation:steamSway 4.2s ease-in-out infinite}
.thermo .t-steam:nth-of-type(2){animation-delay:.7s}
.thermo .t-steam:nth-of-type(3){animation-delay:1.4s}
.thermo .t-bub{fill:rgba(176,136,58,.4);animation:tFloat 5s ease-in-out infinite}
@keyframes steamSway{0%,100%{transform:translateY(0);opacity:.32}50%{transform:translateY(-5px);opacity:.7}}
@keyframes tFloat{0%,100%{transform:translateY(0);opacity:.3}50%{transform:translateY(-8px);opacity:.62}}
@media(prefers-reduced-motion:reduce){.thermo .t-steam,.thermo .t-bub{animation:none}}
.thermo__read{display:flex;flex-direction:column;gap:6px;min-width:0}
.thermo__read .big{font-family:"Space Mono",monospace;font-weight:700;font-size:clamp(44px,6vw,62px);line-height:1;color:var(--ink);letter-spacing:-.02em;margin:4px 0}
.thermo__read .big small{font-size:.4em;color:var(--smoke);font-weight:400}
.thermo__read .lbl-top{font-family:"Space Mono",monospace;font-size:10px;letter-spacing:.26em;color:var(--gold);text-transform:uppercase}
.thermo__read .lbl-bot{font-family:"Space Mono",monospace;font-size:11px;letter-spacing:.16em;color:var(--ink-2);text-transform:uppercase}
.thermo__read .sub{font-family:"Space Mono",monospace;font-size:9.5px;letter-spacing:.1em;color:var(--smoke);text-transform:uppercase}
@media(max-width:880px){.manifesto{grid-template-columns:1fr;gap:50px}.thermo{max-width:360px}}
/* ============ COLLECTION (pinned horizontal) ============ */
.collection{position:relative;background:var(--paper);border-top:1px solid var(--line)}
.collection__head{padding:clamp(70px,9vh,120px) var(--pad) clamp(30px,4vh,46px);display:flex;
align-items:flex-end;justify-content:space-between;gap:28px;flex-wrap:wrap;max-width:1500px;margin:0 auto}
.collection__head h2{font-size:clamp(40px,6.5vw,104px);text-transform:uppercase}
.collection__head .sub{max-width:38ch;color:var(--ink-2);font-size:clamp(14px,1.3vw,17px)}
.collection__hint{font-family:"Space Mono",monospace;font-size:11px;letter-spacing:.22em;color:var(--gold);text-transform:uppercase;display:flex;align-items:center;gap:10px}
.collection__hint svg{width:30px;height:12px}
.pin{position:relative;height:460vh}
.pin__stage{position:sticky;top:0;height:100svh;display:flex;align-items:center;overflow:hidden}
.pin__track{display:flex;gap:clamp(18px,2vw,30px);padding:0 var(--pad);will-change:transform}
.card{position:relative;flex:none;width:min(80vw,560px);height:min(76svh,720px);border-radius:5px;overflow:hidden;
border:1px solid var(--line);background:var(--paper-2);display:flex;flex-direction:column;
box-shadow:0 30px 70px -50px rgba(14,26,43,.5)}
.card__media{position:relative;flex:1;overflow:hidden;
background:radial-gradient(120% 90% at 50% 22%,#fff,var(--panel) 96%);display:grid;place-items:center}
.card__media img{width:88%;height:88%;object-fit:contain;
filter:drop-shadow(0 30px 36px rgba(14,26,43,.26));transition:transform 1.1s var(--ease)}
.card:hover .card__media img{transform:scale(1.05)}
.card__badge{position:absolute;top:16px;left:16px;z-index:3;font-family:"Space Mono",monospace;font-size:10px;
letter-spacing:.12em;text-transform:uppercase;padding:7px 12px;border-radius:2px;display:flex;align-items:center;gap:7px;font-weight:700}
.card__badge.stock{background:linear-gradient(135deg,#16A34A,#2BD46B 52%,#138A41);color:#fff;border:1px solid rgba(20,120,60,.5);overflow:hidden;box-shadow:0 8px 20px -8px rgba(16,163,74,.6),inset 0 1px 0 rgba(255,255,255,.4)}
.card__badge.stock .d{background:#ecfff2;box-shadow:0 0 7px rgba(255,255,255,.85);animation:isPulse 1.8s ease-in-out infinite}
.card__badge.stock::after{content:"";position:absolute;top:0;left:-60%;width:55%;height:100%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.6),transparent);transform:skewX(-18deg);animation:shine 3.4s ease-in-out infinite}
.card__badge.order{background:rgba(154,115,39,.13);color:var(--gold);border:1px solid rgba(154,115,39,.36)}
.card__badge .d{width:6px;height:6px;border-radius:50%;background:currentColor}
.card__num{position:absolute;top:18px;right:18px;z-index:3;font-family:"Space Mono",monospace;font-size:12px;letter-spacing:.2em;color:var(--smoke)}
.card__body{padding:clamp(20px,2.4vw,30px);border-top:1px solid var(--line);background:var(--paper-2)}
.card__marque{font-family:"Space Mono",monospace;font-size:11px;letter-spacing:.28em;color:var(--gold);text-transform:uppercase;margin-bottom:8px}
.card__model{font-size:clamp(26px,3.2vw,40px);font-weight:900;text-transform:uppercase;line-height:.95;font-stretch:112%}
.card__specs{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}
.card__chip{font-family:"Space Mono",monospace;font-size:11px;letter-spacing:.04em;color:var(--ink-2);
border:1px solid var(--line);padding:6px 11px;border-radius:2px;background:#fff}
.card__foot{margin-top:18px;display:flex;align-items:center;justify-content:space-between;gap:14px}
.card__price{display:flex;flex-direction:column}
.card__price .from{font-family:"Space Mono",monospace;font-size:9.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--smoke)}
.card__price .p{font-weight:900;font-size:clamp(20px,2.2vw,26px);font-stretch:108%}
.card__go{display:inline-flex;align-items:center;gap:8px;font-family:"Space Mono",monospace;font-size:11.5px;
font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--ink);border:1px solid var(--line);
padding:11px 15px;border-radius:2px;transition:.35s var(--ease)}
.card__go:hover{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.card__go svg{width:14px;height:14px}
.card--cta{display:flex;align-items:center;justify-content:center;text-align:center;
background:linear-gradient(155deg,var(--ink-3),var(--ink));border:1px solid var(--gold)}
.card--cta .inner{padding:34px}
.card--cta h3{font-size:clamp(26px,3.2vw,40px);text-transform:uppercase;margin-bottom:14px;color:var(--bone)}
.card--cta p{color:var(--bone-dim);max-width:24ch;margin:0 auto 24px;font-size:15px}
.pin__progress{position:absolute;left:var(--pad);right:var(--pad);bottom:30px;height:2px;background:var(--line);z-index:5}
.pin__progress i{display:block;height:100%;width:0;background:var(--grad-gold)}
.pin.no-pin{height:auto}
.pin.no-pin .pin__stage{position:static;height:auto;overflow:visible;display:block}
.pin.no-pin .pin__track{flex-direction:column;transform:none!important;align-items:stretch;gap:22px;padding-bottom:20px}
.pin.no-pin .card{width:auto;height:auto;min-height:520px}
.pin.no-pin .card__media{min-height:340px}
.pin.no-pin .pin__progress{display:none}
/* ============ HEURE BLEUE (section sombre cinématographique) ============ */
.nuit{position:relative;background:var(--dark);color:var(--bone);overflow:hidden;border-top:1px solid var(--line)}
.nuit::before{content:"";position:absolute;inset:0;z-index:0;
background:radial-gradient(70% 90% at 78% 30%,rgba(44,155,159,.18),transparent 60%),
radial-gradient(50% 60% at 20% 80%,rgba(201,162,75,.10),transparent 60%)}
.nuit__grid{position:relative;z-index:2;max-width:1500px;margin:0 auto;display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(34px,5vw,76px);align-items:center}
.nuit__copy .eyebrow{color:var(--gold-hi)}
.nuit__copy h2{font-size:clamp(34px,5vw,76px);text-transform:uppercase;margin-top:16px}
.nuit__copy h2 em{font-style:normal;color:var(--gold-hi)}
.nuit__copy p{margin-top:24px;max-width:46ch;color:var(--bone-dim);font-size:clamp(15px,1.35vw,18px)}
.nuit__leds{margin-top:26px;display:flex;gap:11px;flex-wrap:wrap;align-items:center}
.nuit__leds .leds-hint{font-family:"Space Mono",monospace;font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--bone-dim);margin-right:4px}
.led-dot{width:30px;height:30px;border-radius:50%;border:1px solid rgba(245,246,248,.2);position:relative;cursor:pointer;
transition:transform .25s var(--ease),box-shadow .25s}
.led-dot::after{content:"";position:absolute;inset:5px;border-radius:50%;background:var(--c);box-shadow:0 0 14px 2px var(--c)}
.led-dot:hover{transform:scale(1.12)}
.led-dot.active{transform:scale(1.18);box-shadow:0 0 0 2px var(--dark),0 0 0 4px var(--c)}
.nuit__art{position:relative}
.nuit__glow{position:absolute;inset:-6% -4% -4% -6%;z-index:0;border-radius:30px;filter:blur(46px);opacity:.55;
background:var(--gc,#3E78C9);transition:background .6s ease}
.nuit__art img{position:relative;z-index:1;width:100%;border-radius:6px;filter:drop-shadow(0 40px 60px rgba(0,0,0,.6));transition:filter .6s ease}
.nuit__cta{margin-top:34px;display:flex;gap:14px;flex-wrap:wrap}
@media(max-width:920px){.nuit__grid{grid-template-columns:1fr;gap:40px}.nuit__art{order:-1}}
/* ============ TECHNOLOGIE (grid bordée) ============ */
.tech__head{max-width:1500px;margin:0 auto clamp(40px,5vh,64px);display:flex;justify-content:space-between;align-items:flex-end;gap:28px;flex-wrap:wrap}
.tech__head h2{font-size:clamp(34px,5vw,72px);text-transform:uppercase}
.tech__head .lead{max-width:36ch;color:var(--ink-2);font-size:clamp(14px,1.25vw,17px)}
.tech__grid{max-width:1500px;margin:0 auto;display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--line);border-left:1px solid var(--line)}
.tcell{padding:clamp(28px,3vw,44px);border-right:1px solid var(--line);border-bottom:1px solid var(--line);position:relative;overflow:hidden;transition:background .4s}
.tcell:hover{background:var(--paper-2)}
.tcell__no{font-family:"Space Mono",monospace;font-size:12px;color:var(--gold);letter-spacing:.16em}
.tcell__ico{width:38px;height:38px;margin:22px 0;color:var(--gold)}
.tcell__ico svg{width:100%;height:100%;stroke:currentColor;fill:none;stroke-width:1.4}
.tcell h3{font-size:clamp(19px,1.8vw,24px);text-transform:uppercase;font-stretch:108%}
.tcell p{margin-top:12px;color:var(--ink-2);font-size:14.5px;max-width:34ch}
.tcell__line{position:absolute;left:0;bottom:0;height:2px;width:0;background:var(--gold);transition:width .5s var(--ease)}
.tcell:hover .tcell__line{width:100%}
@media(max-width:880px){.tech__grid{grid-template-columns:1fr}}
@media(min-width:881px) and (max-width:1180px){.tech__grid{grid-template-columns:repeat(2,1fr)}}
/* ============ GARANTIES / CONFIANCE (split) ============ */
.garanties{position:relative;background:var(--panel);border-top:1px solid var(--line);border-bottom:1px solid var(--line);
display:grid;grid-template-columns:minmax(280px,42%) 1fr;align-items:stretch;overflow:hidden}
.garanties__photo{position:relative;min-height:clamp(380px,48vh,560px);overflow:hidden;background:#fff}
.garanties__photo img{width:100%;height:100%;object-fit:cover;object-position:center;transform:scale(1.02)}
.garanties__photo::after{content:"";position:absolute;top:0;right:-1px;bottom:0;width:42%;background:linear-gradient(to right,transparent,var(--panel) 94%)}
.garanties__seam{position:absolute;top:0;right:0;bottom:0;width:3px;background:var(--grad-gold);z-index:3;opacity:.9}
.garanties__plate{position:absolute;left:18px;bottom:18px;z-index:4;font-family:"Space Mono",monospace;font-size:11px;
letter-spacing:.16em;text-transform:uppercase;color:var(--ink);background:rgba(245,246,248,.82);padding:7px 12px;border-radius:2px;border:1px solid var(--line)}
.garanties__body{padding:clamp(46px,6vw,84px) var(--pad) clamp(46px,6vw,84px) clamp(30px,4vw,64px);display:flex;flex-direction:column;justify-content:center}
.garanties__body h2{margin-top:16px;font-size:clamp(26px,3vw,46px);text-transform:uppercase;font-stretch:114%;line-height:1.02;max-width:18ch}
.garanties__body h2 em{font-style:normal;color:var(--gold)}
.garanties__grid{margin-top:clamp(28px,4vh,42px);display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--line);border-left:1px solid var(--line)}
.gcell{padding:clamp(20px,2vw,28px);border-right:1px solid var(--line);border-bottom:1px solid var(--line);transition:background .35s}
.gcell:hover{background:var(--paper-2)}
.gcell .gv{font-weight:900;font-size:clamp(26px,3vw,40px);font-stretch:110%;line-height:1;color:var(--ink)}
.gcell .gv small{font-size:.42em;color:var(--gold);font-weight:700;font-family:"Space Mono",monospace}
.gcell .gv .pre{display:block;font-family:"Space Mono",monospace;font-size:.30em;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--smoke);margin-bottom:2px}
.gcell .gk{font-family:"Space Mono",monospace;font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-2);margin-top:9px;line-height:1.5}
.reassure{display:flex;flex-wrap:wrap;gap:10px 12px;margin-top:24px}
.reassure span{display:inline-flex;align-items:center;gap:8px;font-family:"Space Mono",monospace;font-size:10.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-2);border:1px solid var(--line);background:var(--paper-2);padding:9px 13px;border-radius:40px;transition:border-color .3s,color .3s}
.reassure span:hover{border-color:var(--gold);color:var(--ink)}
.reassure svg{width:15px;height:15px;stroke:var(--gold);fill:none;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;flex:none}
@media(max-width:1080px){
.garanties{grid-template-columns:1fr}.garanties__photo{min-height:300px}.garanties__photo::after{display:none}
.garanties__seam{top:auto;left:0;right:0;bottom:0;width:auto;height:3px}
}
@media(max-width:560px){.garanties__grid{grid-template-columns:1fr}}
/* ============ LIVRAISON & PAIEMENT (steps) ============ */
.parcours{background:var(--paper);border-top:1px solid var(--line)}
.parcours__banner{position:relative;max-width:1500px;margin:0 auto;border-radius:6px;overflow:hidden;border:1px solid var(--line);aspect-ratio:21/8;min-height:300px;background:#fff}
.parcours__banner img{width:100%;height:100%;object-fit:cover;object-position:center 46%}
.parcours__banner::after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(11,30,51,.78) 2%,rgba(11,30,51,.25) 46%,rgba(11,30,51,.45))}
.parcours__eyebrow{position:absolute;left:clamp(22px,4vw,54px);top:clamp(20px,3vw,36px);z-index:2;color:var(--gold-hi)}
.parcours__title{position:absolute;left:clamp(22px,4vw,54px);right:clamp(22px,4vw,54px);bottom:clamp(22px,4vw,46px);z-index:2;
font-size:clamp(24px,3.5vw,52px);text-transform:uppercase;line-height:1;font-weight:900;letter-spacing:-.01em;max-width:22ch;color:var(--bone)}
.parcours__grid{max-width:1500px;margin:clamp(20px,2.4vw,34px) auto 0;display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(14px,1.6vw,22px)}
.pcard{position:relative;overflow:hidden;background:var(--paper-2);border:1px solid var(--line);border-radius:5px;
padding:clamp(28px,2.8vw,40px);min-height:clamp(230px,24vw,300px);transition:border-color .4s,transform .4s var(--ease)}
.pcard:hover{border-color:rgba(154,115,39,.42);transform:translateY(-4px)}
.pcard__no,.pcard h3,.pcard p,.pcard .pcard__meta{position:relative;z-index:2}
.pcard__no{font-family:"Space Mono",monospace;font-size:13px;color:var(--gold);letter-spacing:.2em}
.pcard h3{margin-top:clamp(30px,4vw,52px);font-size:clamp(18px,1.6vw,23px);text-transform:uppercase;font-stretch:108%;max-width:18ch}
.pcard p{margin-top:13px;color:var(--ink-2);font-size:14.5px;line-height:1.55;max-width:36ch}
.pcard__meta{margin-top:16px;font-family:"Space Mono",monospace;font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--aqua)}
.pcard__ghost{position:absolute;right:-4px;bottom:-34px;font-family:"Space Mono",monospace;font-weight:700;
font-size:clamp(120px,15vw,200px);line-height:1;color:transparent;-webkit-text-stroke:1px rgba(154,115,39,.16);z-index:0;pointer-events:none;user-select:none}
.pcard.is-bonus{background:linear-gradient(150deg,rgba(154,115,39,.12),var(--paper-2) 60%);border-color:rgba(154,115,39,.36)}
.pcard.is-bonus .pcard__ghost{-webkit-text-stroke-color:rgba(154,115,39,.26)}
.pcard.is-bonus h3{color:var(--gold-deep)}
@media(max-width:980px){.parcours__grid{grid-template-columns:1fr}.parcours__banner{aspect-ratio:4/3}.pcard{min-height:0}}
/* ============ CRAFT (mosaïque détails) ============ */
.craft{background:var(--panel);border-top:1px solid var(--line)}
.craft__head{max-width:1500px;margin:0 auto clamp(40px,6vh,70px)}
.craft__head h2{font-size:clamp(34px,5vw,72px);text-transform:uppercase;max-width:16ch}
.craft__head p{margin-top:20px;max-width:54ch;color:var(--ink-2);font-size:clamp(15px,1.3vw,18px)}
.craft__grid{max-width:1500px;margin:0 auto;display:grid;grid-template-columns:1.3fr 1fr;grid-template-rows:repeat(2,1fr);gap:clamp(14px,1.6vw,22px);height:clamp(560px,80vh,840px)}
.cframe{position:relative;border-radius:5px;overflow:hidden;border:1px solid var(--line);background:#fff}
.cframe img{width:100%;height:100%;object-fit:cover}
.cframe.tall{grid-row:span 2}
.cframe__cap{position:absolute;left:18px;bottom:16px;z-index:2;font-family:"Space Mono",monospace;font-size:11px;
letter-spacing:.16em;text-transform:uppercase;color:var(--bone);background:rgba(11,30,51,.6);padding:7px 12px;border-radius:2px;border:1px solid rgba(245,246,248,.14)}
.cframe::after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(11,30,51,.42),transparent 52%)}
@media(max-width:880px){.craft__grid{grid-template-columns:1fr 1fr;grid-template-rows:auto;height:auto}
.cframe{aspect-ratio:4/5}.cframe.tall{grid-row:span 1;grid-column:span 2;aspect-ratio:16/10}}
/* ============ CONTACT ============ */
.contact{background:var(--paper);border-top:1px solid var(--line)}
.contact__grid{max-width:1500px;margin:0 auto;display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(34px,5vw,72px);align-items:stretch}
.contact__copy h2{font-size:clamp(40px,6vw,90px);text-transform:uppercase;line-height:.9}
.contact__copy h2 .gold-text{display:block}
.contact__copy p{margin-top:24px;max-width:42ch;color:var(--ink-2);font-size:clamp(15px,1.35vw,18px)}
.contact__rows{margin-top:36px;border-top:1px solid var(--line)}
.crow{display:flex;align-items:center;gap:18px;padding:20px 0;border-bottom:1px solid var(--line);transition:padding-left .35s var(--ease)}
.crow:hover{padding-left:10px}
.crow__ico{width:22px;height:22px;color:var(--gold);flex:none}
.crow__ico svg{width:100%;height:100%;stroke:currentColor;fill:none;stroke-width:1.5}
.crow__k{font-family:"Space Mono",monospace;font-size:10.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--smoke);margin-bottom:3px}
.crow__v{font-size:16px;font-weight:600;color:var(--ink)}
.contact__ctas{margin-top:32px;display:flex;gap:14px;flex-wrap:wrap}
.contact__map{position:relative;border-radius:6px;overflow:hidden;border:1px solid var(--line);min-height:430px;background:var(--ink)}
.map-frame{position:absolute;inset:0;width:100%;height:100%;border:0;z-index:0;
filter:invert(.91) hue-rotate(178deg) saturate(.78) contrast(.9) brightness(.96)}
.map-tint{position:absolute;inset:0;z-index:1;pointer-events:none;
background:radial-gradient(60% 70% at 88% 14%,rgba(176,136,58,.16),transparent 60%),
linear-gradient(180deg,rgba(11,30,51,.10),transparent 30%);
box-shadow:inset 0 0 0 1px rgba(176,136,58,.18)}
.map-card{position:absolute;left:18px;bottom:18px;z-index:4;background:rgba(11,30,51,.92);border:1px solid rgba(245,246,248,.14);padding:16px 20px;border-radius:4px;max-width:260px}
.map-card .t{font-weight:900;text-transform:uppercase;font-size:15px;letter-spacing:.02em;color:var(--bone)}
.map-card .a{margin-top:6px;font-size:13px;color:var(--bone-dim);font-family:"Space Mono",monospace;letter-spacing:.04em}
@media(max-width:920px){.contact__grid{grid-template-columns:1fr}.contact__map{min-height:340px}}
/* ============ FOOTER ============ */
.footer{background:var(--dark);color:var(--bone);padding:clamp(60px,8vh,90px) var(--pad) 40px}
.footer__top{max-width:1500px;margin:0 auto;display:flex;justify-content:space-between;align-items:flex-end;gap:30px;flex-wrap:wrap;padding-bottom:46px;border-bottom:1px solid rgba(245,246,248,.12)}
.footer__mark{display:flex;align-items:center;gap:16px}
.footer__mark svg{width:54px;height:54px}
.footer__mark .txt h3{font-size:clamp(26px,4vw,44px);text-transform:uppercase;font-stretch:115%}
.footer__mark .txt .tag{font-family:"Space Mono",monospace;font-size:11px;letter-spacing:.28em;color:var(--gold-hi);text-transform:uppercase;margin-top:4px}
.footer__nav{display:flex;gap:26px;flex-wrap:wrap}
.footer__nav a{font-size:13px;color:var(--bone-dim);text-transform:uppercase;letter-spacing:.06em;font-weight:600;transition:color .3s}
.footer__nav a:hover{color:var(--gold-hi)}
.footer__bot{max-width:1500px;margin:26px auto 0;display:flex;justify-content:space-between;gap:18px;flex-wrap:wrap;
font-family:"Space Mono",monospace;font-size:11px;letter-spacing:.1em;color:var(--smoke);text-transform:uppercase}
.footer__bot a{color:var(--bone-dim)}.footer__bot a:hover{color:var(--gold-hi)}
.footer__sign{max-width:1500px;margin:clamp(30px,5vh,52px) auto 0;padding-top:clamp(22px,3vh,30px);
border-top:1px solid rgba(245,246,248,.10);display:flex;flex-direction:column;align-items:center;gap:12px;text-align:center}
.footer__sign .lbl{font-family:"Space Mono",monospace;font-size:10.5px;letter-spacing:.28em;text-transform:uppercase;color:var(--smoke)}
.footer__sign a{display:inline-block;transition:transform .35s var(--ease)}
.footer__sign a:hover{transform:translateY(-2px)}
.footer__sign img{height:clamp(48px,7vw,74px);width:auto;display:block;mix-blend-mode:screen;opacity:.62;transition:opacity .35s ease}
.footer__sign a:hover img{opacity:1}
/* ============ MODAL (callback) ============ */
.overlay{position:fixed;inset:0;background:rgba(11,30,51,.6);backdrop-filter:blur(5px);z-index:8000;opacity:0;visibility:hidden;transition:.35s}
.overlay.show{opacity:1;visibility:visible}
.modal{position:fixed;inset:0;z-index:8100;display:none;align-items:center;justify-content:center;padding:24px}
.modal.show{display:flex}
.modal__card{background:var(--paper);border:1px solid var(--line);border-radius:6px;width:min(540px,96vw);max-height:92vh;overflow-y:auto;position:relative;animation:mUp .5s var(--ease)}
@keyframes mUp{from{transform:translateY(28px);opacity:0}to{transform:none;opacity:1}}
.modal__head{padding:30px 32px 0;display:flex;justify-content:space-between;align-items:flex-start}
.modal__head h3{font-size:clamp(24px,3vw,32px);text-transform:uppercase;margin-top:8px}
.modal__close{width:42px;height:42px;border:1px solid var(--line);border-radius:2px;display:grid;place-items:center;transition:.3s;flex:none}
.modal__close:hover{background:var(--ink);color:var(--paper)}
.modal__close svg{width:18px;height:18px}
.modal__body{padding:22px 32px 32px}
.modal__body p.sub{color:var(--ink-2);margin-bottom:22px;font-size:15px}
.field{margin-bottom:16px}
.field label{font-family:"Space Mono",monospace;font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--smoke);display:block;margin-bottom:8px}
.field input,.field select,.field textarea{width:100%;padding:14px 15px;border:1px solid var(--line);border-radius:2px;background:var(--paper-2);font-family:inherit;font-size:15px;color:var(--ink);transition:border .3s,box-shadow .3s}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:var(--gold);box-shadow:0 0 0 3px rgba(154,115,39,.14)}
.field textarea{resize:vertical;min-height:84px}
.field-row{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.modal__success{display:none;text-align:center;padding:24px 0}
.modal__success.show{display:block;animation:mUp .5s var(--ease)}
.modal__success .ok{width:66px;height:66px;border-radius:50%;background:rgba(11,30,51,.10);display:grid;place-items:center;margin:0 auto 20px}
.modal__success .ok svg{width:30px;height:30px;stroke:var(--gold);fill:none;stroke-width:2}
.modal__success h3{text-transform:uppercase;font-size:26px}
.modal__success p{color:var(--ink-2);margin-top:10px}
@media(max-width:480px){.field-row{grid-template-columns:1fr}}
/* back to top */
.totop{position:fixed;right:24px;bottom:24px;width:48px;height:48px;border-radius:2px;background:var(--ink);color:var(--paper);
z-index:6000;display:grid;place-items:center;opacity:0;visibility:hidden;transform:translateY(12px);transition:.4s var(--ease)}
.totop.show{opacity:1;visibility:visible;transform:none}
.totop:hover{background:var(--gold);color:#1A1304;transform:translateY(-4px)}
.totop svg{width:20px;height:20px}
@media(prefers-reduced-motion:reduce){
*{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;scroll-behavior:auto!important}
.reveal{opacity:1;transform:none}
.hero__art img{animation:none;transform:scale(1.04)}
}
/* ============ LIVRAISON · ZONES ============ */
.livz{background:var(--panel)}
.livz__sub{margin-top:14px;color:var(--ink-2);font-size:clamp(14px,1.3vw,17.5px);max-width:60ch}
.livz__sub b{color:var(--gold);font-weight:700}
.livz__grid{margin-top:clamp(30px,4vw,52px);display:grid;grid-template-columns:.92fr 1.08fr;gap:clamp(32px,5vw,68px);align-items:center}
.livz__map img{width:100%;max-width:460px;margin:0 auto;display:block;filter:drop-shadow(0 30px 54px rgba(14,26,43,.18))}
.livz__rows{display:flex;flex-direction:column;gap:10px}
.zrow{display:flex;align-items:center;gap:16px;padding:14px 18px;border:1px solid var(--line);border-radius:4px;background:var(--paper-2);transition:transform .3s var(--ease),border-color .3s}
.zrow:hover{transform:translateX(5px);border-color:var(--gold)}
.zsw{width:18px;height:18px;border-radius:4px;background:var(--z);flex:none;box-shadow:inset 0 0 0 1px rgba(14,26,43,.12)}
.zname{font-weight:800;text-transform:uppercase;letter-spacing:.02em;font-size:14px;color:var(--ink)}
.zprice{margin-left:auto;font-family:"Space Mono",monospace;font-weight:700;font-size:clamp(16px,1.6vw,20px);color:var(--ink);white-space:nowrap}
.zprice small{font-size:.6em;color:var(--gold);margin-left:3px}
.zrow--alt{background:var(--ink);border-color:var(--ink)}
.zrow--alt .zname{color:var(--bone)}
.zrow--alt .zprice{color:var(--gold-hi);font-size:14px;font-weight:700}
@media(max-width:880px){.livz__grid{grid-template-columns:1fr;gap:38px}}
/* ============ AVIS CLIENTS ============ */
.avis__head{display:flex;justify-content:space-between;align-items:flex-end;gap:30px;flex-wrap:wrap}
.avis__head h2{font-size:clamp(30px,4.4vw,64px);text-transform:uppercase;margin-top:14px}
.avis__head h2 em{font-style:normal;color:var(--gold)}
.avis__score{text-align:right}
.avis__score .stars{color:var(--gold);letter-spacing:3px;font-size:18px}
.avis__score-n{font-family:"Space Mono",monospace;font-weight:700;font-size:clamp(28px,3vw,40px);color:var(--ink);line-height:1.1}
.avis__score-n span{font-size:.45em;color:var(--smoke)}
.avis__score-l{font-family:"Space Mono",monospace;font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--smoke)}
.avis__grid{margin-top:clamp(30px,4vw,48px);display:grid;grid-template-columns:repeat(auto-fit,minmax(248px,1fr));gap:18px}
.avis__card{padding:26px 24px;border:1px solid var(--line);border-radius:5px;background:var(--paper-2);display:flex;flex-direction:column;gap:14px;transition:transform .3s var(--ease),box-shadow .3s}
.avis__card:hover{transform:translateY(-4px);box-shadow:0 24px 50px -28px rgba(14,26,43,.32)}
.avis__card .stars{color:var(--gold);letter-spacing:2px;font-size:15px}
.avis__card p{color:var(--ink-2);font-size:14.5px;line-height:1.62;flex:1}
.avis__card .who{display:flex;flex-direction:column;gap:2px;border-top:1px solid var(--line);padding-top:13px}
.avis__card .who .nm{font-weight:800;text-transform:uppercase;font-size:12.5px;letter-spacing:.04em;color:var(--ink)}
.avis__card .who .loc{font-family:"Space Mono",monospace;font-size:11px;color:var(--smoke);letter-spacing:.04em}
/* ============================================================
PAGES PRODUIT (PDP) + cartes-liens
============================================================ */
a.card{text-decoration:none;color:inherit;cursor:pointer}
.card__go{cursor:pointer}
.pdp__crumb{max-width:1500px;margin:0 auto;padding:clamp(92px,12vh,128px) var(--pad) 0;
font-family:"Space Mono",monospace;font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--smoke)}
.pdp__crumb a{color:var(--smoke);transition:color .3s}.pdp__crumb a:hover{color:var(--gold)}
.pdp__crumb span{color:var(--ink-2)}
.pdp__hero{max-width:1500px;margin:0 auto;padding:24px var(--pad) clamp(46px,6vh,72px);
display:grid;grid-template-columns:1.04fr .96fr;gap:clamp(30px,5vw,70px);align-items:start}
.pdp__gallery{position:relative}
.pdp__main{position:relative;border-radius:9px;overflow:hidden;background:var(--panel);border:1px solid var(--line);box-shadow:0 40px 70px -40px rgba(14,26,43,.4)}
.pdp__main img{width:100%;display:block;aspect-ratio:4/3;object-fit:cover}
.pdp__pic-badge{position:absolute;top:16px;left:16px;z-index:3;font-family:"Space Mono",monospace;font-size:10px;
letter-spacing:.12em;text-transform:uppercase;padding:8px 13px;border-radius:40px;display:inline-flex;align-items:center;gap:8px;font-weight:700;overflow:hidden}
.pdp__pic-badge.stock{background:linear-gradient(135deg,#16A34A,#2BD46B 52%,#138A41);color:#fff;box-shadow:0 8px 20px -8px rgba(16,163,74,.6),inset 0 1px 0 rgba(255,255,255,.4)}
.pdp__pic-badge.stock .d{width:7px;height:7px;border-radius:50%;background:#ecfff2;box-shadow:0 0 7px rgba(255,255,255,.85);animation:isPulse 1.8s ease-in-out infinite}
.pdp__pic-badge.stock::after{content:"";position:absolute;top:0;left:-60%;width:55%;height:100%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.6),transparent);transform:skewX(-18deg);animation:shine 3.4s ease-in-out infinite}
.pdp__pic-badge.order{background:rgba(176,136,58,.14);color:var(--gold);border:1px solid rgba(176,136,58,.4)}
.pdp__pic-badge.order .d{width:7px;height:7px;border-radius:50%;background:currentColor}
.pdp__thumbs{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-top:12px}
.pdp__thumbs button{border:1px solid var(--line);border-radius:6px;overflow:hidden;background:none;cursor:pointer;padding:0;aspect-ratio:1;transition:border-color .3s,transform .3s}
.pdp__thumbs button:hover{transform:translateY(-2px)}
.pdp__thumbs img{width:100%;height:100%;object-fit:cover;display:block}
.pdp__thumbs button.active{border-color:var(--gold);box-shadow:0 0 0 1px var(--gold)}
.pdp__info{position:sticky;top:100px}
.pdp__info .eyebrow{display:inline-flex;align-items:center;gap:9px}
.pdp__info h1{font-family:"Archivo";font-weight:900;font-stretch:118%;font-size:clamp(40px,5.4vw,72px);line-height:.95;text-transform:uppercase;letter-spacing:-.03em;margin:14px 0 6px}
.pdp__sub{color:var(--ink-2);font-size:clamp(15px,1.4vw,18px);margin-bottom:22px}
.pdp__price{display:flex;align-items:baseline;gap:10px;margin-bottom:6px}
.pdp__price .from{font-family:"Space Mono",monospace;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--smoke)}
.pdp__price .p{font-family:"Archivo";font-weight:900;font-size:clamp(30px,3.6vw,44px);color:var(--ink);letter-spacing:-.02em}
.pdp__price .tax{font-family:"Space Mono",monospace;font-size:12px;color:var(--smoke)}
.pdp__finance{font-family:"Space Mono",monospace;font-size:12px;color:var(--ink-2);margin-bottom:26px}
.pdp__finance b{color:var(--gold)}
.pdp__chips{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:28px}
.pdp__chips span{font-family:"Space Mono",monospace;font-size:11px;letter-spacing:.04em;color:var(--ink-2);border:1px solid var(--line);background:var(--paper-2);padding:8px 12px;border-radius:40px}
.pdp__cta{display:flex;gap:12px;flex-wrap:wrap;margin-bottom:26px}
.pdp__facts{display:flex;flex-direction:column;gap:0;border-top:1px solid var(--line)}
.pdp__facts div{display:flex;align-items:center;gap:13px;padding:14px 0;border-bottom:1px solid var(--line)}
.pdp__facts svg{width:18px;height:18px;stroke:var(--gold);fill:none;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;flex:none}
.pdp__facts .ft{font-weight:700;text-transform:uppercase;font-size:12px;letter-spacing:.04em;color:var(--ink)}
.pdp__facts .fv{margin-left:auto;font-family:"Space Mono",monospace;font-size:12px;color:var(--ink-2)}
.pdp__block{max-width:1500px;margin:0 auto;padding:clamp(40px,6vh,72px) var(--pad)}
.pdp__block.alt{background:var(--panel)}
.pdp__block h2{font-family:"Archivo";font-weight:900;font-stretch:116%;font-size:clamp(26px,3.4vw,44px);text-transform:uppercase;letter-spacing:-.02em;margin-bottom:8px}
.pdp__block h2 em{font-style:normal;color:var(--gold)}
.pdp__block .lead{color:var(--ink-2);max-width:62ch;margin-bottom:30px;font-size:clamp(14px,1.3vw,16.5px)}
.spec-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:0 40px}
.spec-grid .row{display:flex;justify-content:space-between;gap:16px;padding:15px 0;border-bottom:1px solid var(--line)}
.spec-grid .row .k{font-family:"Space Mono",monospace;font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--smoke)}
.spec-grid .row .v{font-weight:700;color:var(--ink);text-align:right}
.feat-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:18px}
.feat{border:1px solid var(--line);background:var(--paper-2);border-radius:6px;padding:24px;transition:transform .3s,box-shadow .3s}
.feat:hover{transform:translateY(-4px);box-shadow:0 24px 50px -28px rgba(14,26,43,.3)}
.feat svg{width:26px;height:26px;stroke:var(--gold);fill:none;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;margin-bottom:14px}
.feat h3{font-family:"Archivo";font-weight:800;font-size:17px;text-transform:uppercase;letter-spacing:-.01em;margin-bottom:8px}
.feat p{color:var(--ink-2);font-size:14px;line-height:1.6}
.pdp__incl{display:grid;grid-template-columns:1fr 1fr;gap:14px 40px}
.pdp__incl div{display:flex;align-items:flex-start;gap:11px;font-size:14.5px;color:var(--ink-2);padding:7px 0}
.pdp__incl svg{width:17px;height:17px;stroke:var(--gold);fill:none;stroke-width:2;flex:none;margin-top:2px}
.pdp__cross{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px}
.xcard{position:relative;border:1px solid var(--line);border-radius:7px;overflow:hidden;background:var(--paper-2);text-decoration:none;color:inherit;transition:transform .3s,box-shadow .3s}
.xcard:hover{transform:translateY(-5px);box-shadow:0 30px 56px -30px rgba(14,26,43,.34)}
.xcard img{width:100%;aspect-ratio:4/3;object-fit:cover;display:block}
.xcard .xb{padding:16px 18px}
.xcard .xm{font-family:"Archivo";font-weight:900;font-size:18px;text-transform:uppercase}
.xcard .xp{font-family:"Space Mono",monospace;font-size:12px;color:var(--gold);margin-top:3px}
.pdp__band{background:var(--dark);color:var(--bone);text-align:center;padding:clamp(48px,8vh,86px) var(--pad)}
.pdp__band h2{font-family:"Archivo";font-weight:900;font-stretch:116%;font-size:clamp(28px,4vw,56px);text-transform:uppercase;letter-spacing:-.02em;margin-bottom:14px}
.pdp__band h2 em{font-style:normal;color:var(--gold-hi)}
.pdp__band p{color:var(--bone-dim);max-width:54ch;margin:0 auto 28px}
.pdp__band .pdp__cta{justify-content:center}
@media(max-width:920px){
.pdp__hero{grid-template-columns:1fr;gap:32px}
.pdp__info{position:static}
.pdp__incl{grid-template-columns:1fr}
}
/* ============================================================
PAGES INTÉRIEURES (catalogue, contenu, contact, légal)
============================================================ */
.page-hero{max-width:1500px;margin:0 auto;padding:clamp(112px,15vh,164px) var(--pad) clamp(30px,5vh,56px)}
.page-hero .crumb{font-family:"Space Mono",monospace;font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--smoke);margin-bottom:22px}
.page-hero .crumb a{color:var(--smoke);transition:color .3s}.page-hero .crumb a:hover{color:var(--gold)}
.page-hero .crumb span{color:var(--ink-2)}
.page-hero h1{font-family:"Archivo";font-weight:900;font-stretch:116%;font-size:clamp(38px,6vw,84px);line-height:.96;text-transform:uppercase;letter-spacing:-.03em}
.page-hero h1 em{font-style:normal;color:var(--gold)}
.page-hero .intro{margin-top:20px;max-width:66ch;color:var(--ink-2);font-size:clamp(15px,1.4vw,19px);line-height:1.6}
.block{max-width:1500px;margin:0 auto;padding:clamp(40px,6vh,76px) var(--pad)}
.block.alt{background:var(--panel)}
.block.dark{background:var(--dark);color:var(--bone)}
.block>h2{font-family:"Archivo";font-weight:900;font-stretch:116%;font-size:clamp(26px,3.6vw,48px);text-transform:uppercase;letter-spacing:-.02em;margin-bottom:10px}
.block>h2 em{font-style:normal;color:var(--gold)}
.block.dark>h2 em{color:var(--gold-hi)}
.block .lead{color:var(--ink-2);max-width:64ch;margin-bottom:32px;font-size:clamp(14px,1.3vw,16.5px);line-height:1.65}
.block.dark .lead{color:var(--bone-dim)}
.prose p{color:var(--ink-2);line-height:1.75;font-size:clamp(14.5px,1.3vw,16.5px);max-width:70ch;margin-bottom:18px}
.prose h3{font-family:"Archivo";font-weight:800;font-size:clamp(18px,2vw,24px);text-transform:uppercase;letter-spacing:-.01em;margin:30px 0 12px}
/* split image + texte */
.split{display:grid;grid-template-columns:1fr 1fr;gap:clamp(30px,5vw,64px);align-items:center;max-width:1500px;margin:0 auto;padding:clamp(36px,5vh,64px) var(--pad)}
.split.alt{background:var(--panel)}
.split.rev .split__media{order:2}
.split__media img{width:100%;border-radius:9px;display:block;box-shadow:0 40px 70px -40px rgba(14,26,43,.42);aspect-ratio:4/3;object-fit:cover}
.split__txt h2{font-family:"Archivo";font-weight:900;font-stretch:114%;font-size:clamp(24px,3.2vw,42px);text-transform:uppercase;letter-spacing:-.02em;margin-bottom:14px}
.split__txt h2 em{font-style:normal;color:var(--gold)}
.split__txt p{color:var(--ink-2);line-height:1.7;margin-bottom:14px}
@media(max-width:860px){.split{grid-template-columns:1fr;gap:28px}.split.rev .split__media{order:0}}
/* catalogue */
.cat{max-width:1500px;margin:0 auto;padding:clamp(30px,4vh,52px) var(--pad)}
.cat h2{font-family:"Archivo";font-weight:900;font-stretch:116%;font-size:clamp(22px,2.8vw,34px);text-transform:uppercase;letter-spacing:-.02em;margin:0 0 6px}
.cat .sub{font-family:"Space Mono",monospace;font-size:12px;letter-spacing:.06em;color:var(--smoke);text-transform:uppercase;margin-bottom:26px}
.cat-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:20px}
.cat-card{position:relative;display:flex;flex-direction:column;border:1px solid var(--line);border-radius:9px;overflow:hidden;background:var(--paper-2);text-decoration:none;color:inherit;transition:transform .35s var(--ease),box-shadow .35s}
.cat-card:hover{transform:translateY(-6px);box-shadow:0 34px 64px -34px rgba(14,26,43,.4)}
.cat-card__media{position:relative;aspect-ratio:4/3;overflow:hidden;background:var(--panel)}
.cat-card__media img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .6s var(--ease)}
.cat-card:hover .cat-card__media img{transform:scale(1.05)}
.cat-card__badge{position:absolute;top:14px;left:14px;z-index:2;font-family:"Space Mono",monospace;font-size:10px;letter-spacing:.12em;text-transform:uppercase;padding:7px 12px;border-radius:40px;display:inline-flex;align-items:center;gap:7px;font-weight:700;overflow:hidden}
.cat-card__badge.stock{background:linear-gradient(135deg,#16A34A,#2BD46B 52%,#138A41);color:#fff;box-shadow:0 8px 20px -8px rgba(16,163,74,.6),inset 0 1px 0 rgba(255,255,255,.4)}
.cat-card__badge.stock .d{width:7px;height:7px;border-radius:50%;background:#ecfff2;box-shadow:0 0 7px rgba(255,255,255,.85);animation:isPulse 1.8s ease-in-out infinite}
.cat-card__badge.stock::after{content:"";position:absolute;top:0;left:-60%;width:55%;height:100%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.6),transparent);transform:skewX(-18deg);animation:shine 3.4s ease-in-out infinite}
.cat-card__badge.order{background:rgba(176,136,58,.14);color:var(--gold);border:1px solid rgba(176,136,58,.4)}
.cat-card__badge.order .d{width:7px;height:7px;border-radius:50%;background:currentColor}
.cat-card__body{padding:20px 20px 22px;display:flex;flex-direction:column;gap:9px;flex:1}
.cat-card__name{font-family:"Archivo";font-weight:900;font-size:22px;text-transform:uppercase;letter-spacing:-.01em}
.cat-card__spec{font-family:"Space Mono",monospace;font-size:12px;color:var(--ink-2);letter-spacing:.02em;line-height:1.5}
.cat-card__foot{margin-top:auto;display:flex;align-items:baseline;justify-content:space-between;gap:12px;padding-top:12px;border-top:1px solid var(--line)}
.cat-card__price{font-family:"Archivo";font-weight:900;font-size:20px;color:var(--ink)}
.cat-card__price small{font-family:"Space Mono",monospace;font-size:11px;color:var(--smoke);font-weight:400;margin-left:4px}
.cat-card__go{font-family:"Space Mono",monospace;font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--gold);display:inline-flex;align-items:center;gap:6px}
.cat-card__go svg{width:15px;height:15px;stroke:currentColor;fill:none;stroke-width:2;transition:transform .3s}
.cat-card:hover .cat-card__go svg{transform:translateX(4px)}
/* contact */
.contactp{display:grid;grid-template-columns:1fr 1fr;gap:clamp(30px,5vw,60px);max-width:1500px;margin:0 auto;padding:clamp(20px,3vh,40px) var(--pad) clamp(40px,6vh,72px)}
.cinfo{display:flex;flex-direction:column;gap:0}
.cinfo .row{display:flex;gap:15px;padding:18px 0;border-bottom:1px solid var(--line)}
.cinfo .row svg{width:20px;height:20px;stroke:var(--gold);fill:none;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;flex:none;margin-top:2px}
.cinfo .row .k{font-family:"Space Mono",monospace;font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--smoke);margin-bottom:4px}
.cinfo .row .v{color:var(--ink);font-weight:600;line-height:1.5}
.cinfo .row .v a{color:var(--ink);border-bottom:1px solid var(--gold)}
.cinfo .row .v a.btn--call{color:#0B1E33;border-bottom:0;padding:9px 18px;font-size:12.5px;margin-top:6px;gap:8px}
.cinfo .row .v a.btn--call svg{width:15px;height:15px;stroke:#0B1E33;margin-top:0}
.form{border:1px solid var(--line);border-radius:10px;background:var(--paper-2);padding:clamp(24px,3vw,34px)}
.form h2{font-family:"Archivo";font-weight:900;font-size:clamp(20px,2.4vw,28px);text-transform:uppercase;margin-bottom:8px}
.form p.sub{color:var(--ink-2);font-size:14px;margin-bottom:22px}
.form label{display:block;font-family:"Space Mono",monospace;font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-2);margin:14px 0 7px}
.form input,.form textarea{width:100%;border:1px solid var(--line);border-radius:6px;background:var(--paper);padding:13px 14px;font:inherit;color:var(--ink);transition:border-color .3s}
.form input:focus,.form textarea:focus{outline:none;border-color:var(--gold)}
.form textarea{min-height:120px;resize:vertical}
.form button{margin-top:22px;width:100%}
.map-embed{position:relative;border-radius:10px;overflow:hidden;border:1px solid var(--line);min-height:340px;margin-top:24px}
@media(max-width:860px){.contactp{grid-template-columns:1fr}}
/* FAQ */
.faq{max-width:900px}
.faq details{border-bottom:1px solid var(--line);padding:4px 0}
.faq summary{cursor:pointer;list-style:none;padding:18px 0;font-family:"Archivo";font-weight:700;font-size:clamp(15px,1.6vw,18px);color:var(--ink);display:flex;justify-content:space-between;align-items:center;gap:16px}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";font-family:"Space Mono",monospace;color:var(--gold);font-size:22px;transition:transform .3s}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq details p{color:var(--ink-2);line-height:1.7;padding:0 0 20px;max-width:74ch}
/* légal */
.legal{max-width:820px;margin:0 auto;padding:clamp(30px,4vh,52px) var(--pad) clamp(50px,8vh,90px)}
.legal h2{font-family:"Archivo";font-weight:800;font-size:clamp(18px,2vw,24px);text-transform:uppercase;margin:34px 0 12px}
.legal p,.legal li{color:var(--ink-2);line-height:1.75;font-size:15px;margin-bottom:12px}
.legal ul{padding-left:20px;margin-bottom:14px}
.legal .note{background:var(--panel);border-left:3px solid var(--gold);padding:16px 18px;border-radius:0 6px 6px 0;font-size:14px;color:var(--ink-2);margin:16px 0}
.legal__date{font-family:"Space Mono",monospace;font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--smoke);margin-bottom:8px}
.legal__date+h2{margin-top:8px}
/* footer legal row */
.footer__legal{max-width:1500px;margin:18px auto 0;display:flex;gap:22px;flex-wrap:wrap;justify-content:center}
.footer__legal a{font-family:"Space Mono",monospace;font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--smoke);transition:color .3s}
.footer__legal a:hover{color:var(--gold-hi)}
/* bandeau CTA générique */
.cta-band{background:var(--dark);color:var(--bone);text-align:center;padding:clamp(48px,8vh,88px) var(--pad)}
.cta-band h2{font-family:"Archivo";font-weight:900;font-stretch:116%;font-size:clamp(26px,4vw,54px);text-transform:uppercase;letter-spacing:-.02em;margin-bottom:14px}
.cta-band h2 em{font-style:normal;color:var(--gold-hi)}
.cta-band p{color:var(--bone-dim);max-width:56ch;margin:0 auto 28px}
.cta-band .row{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}
/* ============================================================
AJOUTS : simulateur financement, cartes-liens, centrage, etc.
============================================================ */
/* mensualité + bouton simuler */
.fin-badge{font-family:"Space Mono",monospace;font-size:12px;color:var(--ink-2);letter-spacing:.02em;line-height:1.4}
.fin-badge b{color:var(--ink);font-size:14px}
.fin-badge small{display:block;color:var(--smoke);font-size:10.5px;margin-top:2px}
.sim-btn{display:inline-flex;align-items:center;gap:7px;font-family:"Space Mono",monospace;font-size:12px;letter-spacing:.05em;text-transform:uppercase;
color:var(--gold);background:none;border:1px solid rgba(176,136,58,.42);border-radius:40px;padding:9px 15px;cursor:pointer;transition:background .3s,border-color .3s,color .3s}
.sim-btn::before{content:"";width:14px;height:14px;flex:none;background:currentColor;-webkit-mask:url("data:image/svg+xml;utf8,") center/contain no-repeat;mask:url("data:image/svg+xml;utf8,") center/contain no-repeat}
.sim-btn:hover{background:rgba(176,136,58,.1);border-color:var(--gold);color:var(--gold-deep)}
.sim-btn--sm{position:relative;z-index:2;width:100%;justify-content:center;font-size:11px;padding:8px 12px;margin-top:12px}
.pdp__fin{display:flex;align-items:center;gap:16px;flex-wrap:wrap;margin-bottom:24px}
/* modale simulateur */
.sim{position:fixed;inset:0;z-index:200;display:none;align-items:center;justify-content:center;padding:20px}
.sim.show{display:flex}
.sim__backdrop{position:absolute;inset:0;background:rgba(8,18,30,.62);backdrop-filter:blur(3px)}
.sim__panel{position:relative;z-index:1;width:min(460px,100%);max-height:92vh;overflow:auto;background:var(--paper-2);border:1px solid var(--line);border-radius:14px;padding:clamp(26px,4vw,38px);box-shadow:0 50px 100px -30px rgba(8,18,30,.55)}
.sim__x{position:absolute;top:15px;right:15px;width:36px;height:36px;display:grid;place-items:center;border:1px solid var(--line);background:none;border-radius:50%;cursor:pointer;color:var(--ink);transition:border-color .3s}
.sim__x:hover{border-color:var(--gold)}.sim__x svg{width:16px;height:16px}
.sim__title{font-family:"Archivo";font-weight:900;font-size:clamp(22px,3vw,30px);text-transform:uppercase;letter-spacing:-.02em;margin:8px 0 22px}
.sim label{display:block;font-family:"Space Mono",monospace;font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-2);margin:16px 0 8px}
.sim label b{color:var(--gold);font-family:inherit}
.sim__amount{display:flex;align-items:center;gap:8px;border:1px solid var(--line);border-radius:8px;padding:2px 14px;background:var(--paper)}
.sim__amount input{flex:1;border:none;background:none;font:900 22px/1 "Archivo";color:var(--ink);padding:12px 0}
.sim__amount input:focus{outline:none}
.sim__amount span{font-family:"Space Mono",monospace;color:var(--smoke);font-size:16px}
.sim input[type=range]{width:100%;accent-color:var(--gold);margin-top:4px}
.sim__scale{display:flex;justify-content:space-between;font-family:"Space Mono",monospace;font-size:10px;color:var(--smoke);margin-top:2px}
.sim__out{margin-top:22px;border-top:1px solid var(--line);padding-top:20px}
.sim__big{display:flex;align-items:baseline;gap:6px}
.sim__big #simMonthly{font-family:"Archivo";font-weight:900;font-size:clamp(38px,7vw,52px);color:var(--gold);letter-spacing:-.02em}
.sim__big small{font-family:"Space Mono",monospace;font-size:14px;color:var(--smoke)}
.sim__rows{margin-top:14px}
.sim__rows div{display:flex;justify-content:space-between;padding:11px 0;border-bottom:1px solid var(--line);font-size:14px}
.sim__rows span{color:var(--ink-2)}.sim__rows b{font-family:"Space Mono",monospace;color:var(--ink)}
.sim__legal{font-size:11px;color:var(--smoke);line-height:1.55;margin:18px 0}
.sim__panel .btn{width:100%}
/* cartes à lien étiré (home + catalogue) */
.card{position:relative}
.card__link,.cat-card__link{position:absolute;inset:0;z-index:1}
.card .card__badge,.cat-card__badge{z-index:3}
.card__fin{margin:10px 0 2px}
/* centrage de page */
main.center .page-hero{text-align:center}
main.center .page-hero .intro{margin-left:auto;margin-right:auto}
main.center .cat h2,main.center .cat .sub,main.center .block>h2,main.center .block .lead{text-align:center}
main.center .block .lead{margin-left:auto;margin-right:auto}
main.center .cat-grid{justify-content:center}
main.center .feat{text-align:center}
main.center .feat svg{margin-left:auto;margin-right:auto}
main.center .reassure{justify-content:center}
main.center .faq{margin-left:auto;margin-right:auto}
main.center .faq summary{text-align:left}
/* grille 6 points sur une ligne */
.feat-grid.six{grid-template-columns:repeat(6,1fr);gap:14px}
.feat-grid.six .feat{padding:20px 16px}
.feat-grid.six .feat svg{width:24px;height:24px;margin-bottom:10px}
.feat-grid.six .feat h3{font-size:15px}
.feat-grid.six .feat p{font-size:12.5px;line-height:1.5}
@media(max-width:1180px){.feat-grid.six{grid-template-columns:repeat(3,1fr)}}
@media(max-width:720px){.feat-grid.six{grid-template-columns:repeat(2,1fr)}}
@media(max-width:460px){.feat-grid.six{grid-template-columns:1fr}}
/* air autour du bloc tarifs (page livraison) */
.livz--solo{padding:clamp(40px,7vh,80px) 0}
.livz--solo .shell{padding-left:var(--pad);padding-right:var(--pad)}
/* thermomètre : glow animé pour combler le vide */
.thermo{position:relative}
.thermo::before{content:"";position:absolute;left:2%;top:50%;width:clamp(150px,20vw,220px);height:clamp(150px,20vw,220px);transform:translateY(-50%);
background:radial-gradient(circle,rgba(176,136,58,.20),rgba(176,136,58,.06) 45%,transparent 72%);filter:blur(6px);z-index:0;animation:thermoGlow 4.5s ease-in-out infinite}
@keyframes thermoGlow{0%,100%{opacity:.5;transform:translateY(-50%) scale(1)}50%{opacity:.95;transform:translateY(-50%) scale(1.12)}}
.thermo__art,.thermo__read{position:relative;z-index:1}
@media(prefers-reduced-motion:reduce){.thermo::before{animation:none}}
/* ---- mensualité mise en avant (typo neutre) + catalogue centré ---- */
.price__mo{font-family:"Archivo";font-weight:700;font-size:15px;color:var(--gold-deep);letter-spacing:-.005em;white-space:nowrap}
.price__mo b{font-weight:900}
/* catalogue : prix + mensualité empilés, alignés en bas avec "Découvrir" */
.cat-card__foot{align-items:flex-end}
.cat-card__price{display:flex;flex-direction:column;gap:3px;font-family:"Archivo";font-weight:900;font-size:22px;color:var(--ink)}
.cat-card__price .amt{font-weight:900;font-size:22px;color:var(--ink)}
.cat-card__price .amt small{font-family:"Archivo";font-weight:600;font-size:11px;color:var(--smoke);margin-left:4px}
/* accueil : mensualité sous le prix */
.card__price .price__mo{margin-top:3px}
/* fiche produit : mensualité à côté du prix */
.pdp__price{flex-wrap:wrap}
.pdp__price .price__mo{font-size:17px}
/* cartes du catalogue centrées */
main.center .cat-grid{grid-template-columns:repeat(auto-fit,minmax(250px,330px));justify-content:center}
/* ---- photo bloc "Qui sommes-nous" + pastilles de couleur ---- */
.manifesto__photo{width:100%;display:block;border-radius:12px;aspect-ratio:1/1;object-fit:cover;box-shadow:0 44px 84px -44px rgba(14,26,43,.5)}
.card__media{position:relative}
.color-dots{display:flex;gap:8px;align-items:center}
.color-dots--media{position:absolute;left:12px;bottom:12px;z-index:4;padding:5px 7px;background:rgba(11,30,51,.34);backdrop-filter:blur(4px);border-radius:40px}
.cdot{width:22px;height:22px;border-radius:50%;border:2px solid #fff;background:var(--c,#ccc);cursor:pointer;padding:0;box-shadow:0 2px 8px rgba(0,0,0,.28);transition:transform .2s;position:relative;z-index:2}
.cdot:hover{transform:scale(1.12)}
.cdot.active{outline:2px solid var(--gold-hi);outline-offset:2px}
.pdp__colors{display:flex;align-items:center;gap:14px;margin:2px 0 22px}
.pdp__colors .clabel{font-family:"Space Mono",monospace;font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--smoke)}
.pdp__colors .cdot{width:26px;height:26px}
/* ============================================================
HEADER ACTIONS · BOUTONS · OPTIONS · AVIS · FORMULAIRE · PANIER
============================================================ */
/* header : devis + icône tel + panier */
.nav__actions{display:flex;align-items:center;gap:10px}
.nav__icon{position:relative;width:42px;height:42px;display:grid;place-items:center;border:1px solid var(--line);border-radius:50%;color:var(--ink);transition:border-color .3s,color .3s,background .3s}
.nav__icon svg{width:18px;height:18px}
.nav__icon:hover{border-color:var(--gold);color:var(--gold)}
.nav.scrolled .nav__icon{border-color:rgba(245,246,248,.28);color:var(--bone)}
.nav.scrolled .nav__icon:hover{border-color:var(--gold-hi);color:var(--gold-hi)}
.nav__badge{position:absolute;top:-4px;right:-4px;min-width:18px;height:18px;padding:0 4px;display:none;place-items:center;background:var(--gold);color:#fff;font-family:"Archivo";font-weight:800;font-size:10.5px;border-radius:40px;line-height:1}
.tel-link{color:inherit;border-bottom:1px solid var(--gold);transition:color .3s}
.tel-link:hover{color:var(--gold-hi)}
@media(max-width:900px){.nav__actions .nav__cta{display:none}}
/* boutons ghost visibles sur fond sombre */
.cta-band .btn--ghost,.pdp__band .btn--ghost,.block.dark .btn--ghost{color:var(--bone);border-color:rgba(245,246,248,.5)}
.cta-band .btn--ghost:hover,.pdp__band .btn--ghost:hover,.block.dark .btn--ghost:hover{color:var(--dark);background:var(--gold-hi);border-color:var(--gold-hi)}
.btn--dark{border-color:var(--ink);color:var(--ink)}
.btn--dark:hover{background:var(--ink);color:var(--bone);border-color:var(--ink)}
/* titre livraison (home + blocs réutilisés) */
.livz .shell>h2,.livz__h{font-family:"Archivo";font-weight:900;font-stretch:116%;font-size:clamp(28px,4vw,54px);text-transform:uppercase;letter-spacing:-.02em;line-height:1.02;margin-top:12px}
.livz .shell>h2 em,.livz__h em{font-style:normal;color:var(--gold)}
/* catalogue : photos non coupées */
.cat-card__media{aspect-ratio:1/1;background:var(--paper-2)}
.cat-card__media img{object-fit:contain;padding:16px}
/* fiche produit : options sélectionnables */
.pdp__options{margin:6px 0 22px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:14px 0}
.pdp__options .opt-label{display:block;font-family:"Space Mono",monospace;font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--smoke);margin-bottom:12px}
.opt{display:flex;align-items:center;gap:12px;padding:9px 0;cursor:pointer;font-size:15px}
.opt input{width:18px;height:18px;accent-color:var(--gold);flex:none;cursor:pointer}
.opt__n{flex:1;color:var(--ink)}
.opt__p{font-family:"Archivo";font-weight:800;color:var(--gold-deep);white-space:nowrap}
/* avis clients (blocs produit/catalogue) */
.reviews{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:18px}
.review{border:1px solid var(--line);border-radius:10px;background:var(--paper-2);padding:22px 22px 20px}
.review__stars{color:var(--gold);letter-spacing:2px;font-size:15px;margin-bottom:10px}
.review p{color:var(--ink-2);line-height:1.6;font-size:14.5px;margin-bottom:14px}
.review__who{display:flex;flex-direction:column;gap:1px}
.review__who b{font-family:"Archivo";font-weight:800;color:var(--ink)}
.review__who span{font-family:"Space Mono",monospace;font-size:11px;color:var(--smoke)}
/* portrait (Laurent) */
.split__media.portrait img{aspect-ratio:4/5;object-fit:cover;object-position:center 12%}
/* formulaire enrichi */
.form__row{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.form__row>div{min-width:0}
.form select{width:100%;border:1px solid var(--line);border-radius:6px;background:var(--paper);padding:13px 14px;font:inherit;color:var(--ink);cursor:pointer;transition:border-color .3s}
.form select:focus{outline:none;border-color:var(--gold)}
.form__check{display:flex;align-items:flex-start;gap:10px;margin-top:16px;cursor:pointer;font-family:inherit!important;font-size:13.5px!important;letter-spacing:0!important;text-transform:none!important;color:var(--ink-2)!important}
.form__check input{width:18px;height:18px;accent-color:var(--gold);flex:none;margin-top:1px}
@media(max-width:560px){.form__row{grid-template-columns:1fr}}
/* page panier */
.cartwrap{max-width:760px;margin:0 auto}
.cart-items{display:flex;flex-direction:column}
.ci{display:flex;align-items:center;gap:16px;padding:20px 0;border-bottom:1px solid var(--line)}
.ci__name{flex:1}
.ci__name b{font-family:"Archivo";font-weight:800;font-size:18px;color:var(--ink)}
.ci__opts{font-family:"Space Mono",monospace;font-size:12px;color:var(--smoke);margin-top:6px;line-height:1.6}
.ci__price{font-family:"Archivo";font-weight:900;font-size:20px;color:var(--ink)}
.ci__rm{width:34px;height:34px;border:1px solid var(--line);background:none;border-radius:50%;cursor:pointer;font-size:20px;color:var(--smoke);line-height:1;transition:border-color .3s,color .3s}
.ci__rm:hover{border-color:#c0392b;color:#c0392b}
.cart-empty{text-align:center;color:var(--ink-2);padding:40px 0;line-height:1.8}
.cart-empty a{color:var(--gold);font-weight:600}
.cart-foot{margin-top:26px}
.cart-total{display:flex;justify-content:space-between;align-items:baseline;padding:16px 0;border-top:2px solid var(--ink)}
.cart-total span{font-family:"Space Mono",monospace;font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--smoke)}
.cart-total b{font-family:"Archivo";font-weight:900;font-size:30px;color:var(--ink)}
.cart-note{font-size:12px;color:var(--smoke);margin:6px 0 20px}
.cart-cta{display:flex;gap:12px;flex-wrap:wrap}
/* ============================================================
HEADER SELON LE FOND · STORY STICKY · BLOG
============================================================ */
/* icônes dorées sur fond clair (défaut + scrollé) */
.nav__icon{color:var(--gold);border-color:rgba(176,136,58,.35)}
.nav__icon:hover{color:var(--gold-deep);border-color:var(--gold)}
.nav.scrolled .nav__icon{color:var(--gold);border-color:rgba(176,136,58,.35)}
.nav.scrolled .nav__icon:hover{color:var(--gold-deep);border-color:var(--gold)}
/* sur le hero photo (home, non scrollé) : liens & icônes en blanc */
body.photo-hero .nav:not(.scrolled) .nav__links a{color:rgba(255,255,255,.92)}
body.photo-hero .nav:not(.scrolled) .nav__links a:hover{color:#fff}
body.photo-hero .nav:not(.scrolled) .nav__links a.nav__sell{color:var(--gold-hi)}
body.photo-hero .nav:not(.scrolled) .nav__icon{color:var(--bone);border-color:rgba(245,246,248,.42)}
body.photo-hero .nav:not(.scrolled) .nav__icon:hover{color:#fff;border-color:#fff}
body.photo-hero .nav:not(.scrolled) .nav__burger span{background:var(--bone)}
.nav__links{gap:26px}
/* story sticky (page Qui sommes-nous) */
.story{max-width:1500px;margin:0 auto;padding:clamp(36px,5vh,64px) var(--pad)}
.story__inner{display:grid;grid-template-columns:.82fr 1.18fr;gap:clamp(30px,5vw,70px);align-items:start}
.story__inner--solo{grid-template-columns:.72fr 1.28fr;max-width:1200px;margin:0 auto;gap:clamp(30px,5vw,80px)}
.story__head{position:sticky;top:104px}
.story__head .eyebrow{color:var(--gold)}
.story__head h2{font-family:"Archivo";font-weight:900;font-stretch:114%;font-size:clamp(28px,3.6vw,50px);text-transform:uppercase;letter-spacing:-.02em;margin:12px 0 0;line-height:1.02}
.story__head h2 em{font-style:normal;color:var(--gold)}
.story__body{padding-top:6px}
.story__body p{margin-bottom:22px}
.story__lead{font-size:clamp(18px,1.9vw,22px)!important;line-height:1.65!important;color:var(--ink)!important;font-weight:500;max-width:none!important;padding-bottom:22px;border-bottom:1px solid var(--line);margin-bottom:26px!important}
@media(max-width:860px){.story__inner--solo{grid-template-columns:1fr;gap:22px}.story__head{position:static}}
.story__media{position:sticky;top:100px}
.story__media img{width:100%;display:block;border-radius:12px;aspect-ratio:4/5;object-fit:cover;object-position:center 12%;box-shadow:0 44px 84px -44px rgba(14,26,43,.5)}
.story__text{padding-top:6px}
.story__text .eyebrow{color:var(--gold)}
.story__text h2{font-family:"Archivo";font-weight:900;font-stretch:114%;font-size:clamp(26px,3.4vw,46px);text-transform:uppercase;letter-spacing:-.02em;margin:10px 0 20px;line-height:1.04}
.story__text h2 em{font-style:normal;color:var(--gold)}
.story__text p{color:var(--ink-2);line-height:1.8;font-size:clamp(15px,1.4vw,17px);margin-bottom:20px;max-width:62ch}
@media(max-width:860px){.story__inner{grid-template-columns:1fr;gap:24px}.story__media{position:static}.story__media img{aspect-ratio:4/3}}
/* blog — index */
.blog-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:22px}
.post-card{display:flex;flex-direction:column;border:1px solid var(--line);border-radius:11px;overflow:hidden;background:var(--paper-2);text-decoration:none;color:inherit;transition:transform .35s var(--ease),box-shadow .35s}
.post-card:hover{transform:translateY(-6px);box-shadow:0 34px 64px -34px rgba(14,26,43,.4)}
.post-card__media{aspect-ratio:16/10;overflow:hidden;background:var(--panel)}
.post-card__media img{width:100%;height:100%;object-fit:cover;transition:transform .6s var(--ease)}
.post-card:hover .post-card__media img{transform:scale(1.05)}
.post-card__body{padding:22px 22px 24px;display:flex;flex-direction:column;gap:10px;flex:1}
.post-card__cat{font-family:"Space Mono",monospace;font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--gold)}
.post-card__title{font-family:"Archivo";font-weight:800;font-size:clamp(18px,1.9vw,22px);line-height:1.16;color:var(--ink)}
.post-card__ex{color:var(--ink-2);font-size:14.5px;line-height:1.6;flex:1}
.post-card__go{font-family:"Space Mono",monospace;font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--gold);display:inline-flex;align-items:center;gap:7px;margin-top:4px}
.post-card__go svg{width:15px;height:15px;transition:transform .3s}
.post-card:hover .post-card__go svg{transform:translateX(4px)}
/* blog — article */
.post__hero{position:relative;min-height:clamp(340px,52vh,520px);display:flex;align-items:flex-end;overflow:hidden}
.post__hero img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.post__shade{position:absolute;inset:0;background:linear-gradient(to top,rgba(8,18,30,.88),rgba(8,18,30,.32) 55%,rgba(8,18,30,.5))}
.post__head{position:relative;z-index:1;max-width:900px;margin:0 auto;width:100%;padding:0 var(--pad) clamp(34px,5vh,54px);color:var(--bone)}
.post__head .crumb{font-family:"Space Mono",monospace;font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:rgba(245,246,248,.75);margin-bottom:16px}
.post__head .crumb a{color:rgba(245,246,248,.75)}.post__head .crumb a:hover{color:var(--gold-hi)}
.post__head .crumb span{color:var(--gold-hi)}
.post__cat{display:inline-block;font-family:"Space Mono",monospace;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--dark);background:var(--gold-hi);padding:5px 11px;border-radius:40px;margin-bottom:14px}
.post__head h1{font-family:"Archivo";font-weight:900;font-stretch:112%;font-size:clamp(28px,4.6vw,56px);line-height:1.03;text-transform:uppercase;letter-spacing:-.02em;max-width:22ch}
.post__meta{margin-top:16px;font-family:"Space Mono",monospace;font-size:12px;color:var(--bone-dim);letter-spacing:.04em}
.post__body{max-width:760px;margin:0 auto;padding:clamp(36px,5vh,60px) var(--pad)}
.post__body h2{font-family:"Archivo";font-weight:800;font-size:clamp(20px,2.4vw,28px);text-transform:uppercase;letter-spacing:-.01em;margin:34px 0 12px;color:var(--ink)}
.post__body p{color:var(--ink-2);line-height:1.8;font-size:clamp(15px,1.35vw,17px);margin-bottom:18px}
.post__body p em{color:var(--smoke)}
.post__cta{display:flex;gap:12px;flex-wrap:wrap;margin-top:36px;padding-top:28px;border-top:1px solid var(--line)}
/* ============================================================
FIX PHOTO PRODUIT · BLOG 3+1 · TIROIR PANIER
============================================================ */
/* fiche produit : image complète (renders carrés) */
.pdp__main{background:var(--paper-2)}
.pdp__main img{aspect-ratio:1/1;object-fit:contain}
/* blog : titres réduits + 3 par ligne, 4e en pleine largeur */
.blog-grid{grid-template-columns:repeat(3,1fr)}
.blog-grid .post-card__title{font-size:clamp(14px,1.2vw,16.5px);line-height:1.22}
.post-card--wide{grid-column:1/-1;flex-direction:row}
.post-card--wide .post-card__media{aspect-ratio:auto;width:42%;min-height:250px}
.post-card--wide .post-card__body{justify-content:center;padding:clamp(24px,3vw,40px)}
.post-card--wide .post-card__title{font-size:clamp(17px,1.8vw,22px)}
.post-card--wide .post-card__ex{max-width:62ch}
@media(max-width:900px){.blog-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:700px){.post-card--wide{flex-direction:column}.post-card--wide .post-card__media{width:100%;min-height:0;aspect-ratio:16/10}}
@media(max-width:600px){.blog-grid{grid-template-columns:1fr}}
/* tiroir panier (drawer latéral) */
.cart{position:fixed;inset:0;z-index:210;visibility:hidden}
.cart.show{visibility:visible}
.cart__backdrop{position:absolute;inset:0;background:rgba(8,18,30,.5);opacity:0;transition:opacity .35s}
.cart.show .cart__backdrop{opacity:1}
.cart__panel{position:absolute;top:0;right:0;height:100%;width:min(420px,100%);background:var(--paper-2);box-shadow:-30px 0 80px -30px rgba(8,18,30,.5);display:flex;flex-direction:column;transform:translateX(100%);transition:transform .42s var(--ease)}
.cart.show .cart__panel{transform:none}
.cart__top{display:flex;align-items:center;justify-content:space-between;padding:22px 24px;border-bottom:1px solid var(--line)}
.cart__top h3{font-family:"Archivo";font-weight:900;font-size:22px;text-transform:uppercase;letter-spacing:-.01em}
.cart__x{width:36px;height:36px;display:grid;place-items:center;border:1px solid var(--line);background:none;border-radius:50%;cursor:pointer;color:var(--ink);transition:border-color .3s}
.cart__x:hover{border-color:var(--gold)}.cart__x svg{width:16px;height:16px}
.cart__items{flex:1;overflow:auto;padding:6px 24px}
.cart__items .ci__name b{font-size:16px}
.cart__foot{padding:20px 24px 24px;border-top:1px solid var(--line)}
.cart__total{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:6px}
.cart__total span{font-family:"Space Mono",monospace;font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--smoke)}
.cart__total b{font-family:"Archivo";font-weight:900;font-size:26px;color:var(--ink)}
.cart__note{font-size:11.5px;color:var(--smoke);margin-bottom:16px;line-height:1.5}
.cart__foot .btn{width:100%;margin-bottom:10px}
.cart__foot .btn:last-child{margin-bottom:0}
/* indicateur de page active dans le header */
.nav__links a[aria-current="page"]{color:var(--gold)}
.nav__links a[aria-current="page"]::after{width:100%;height:2px;background:var(--gold)}
.nav__links a.nav__sell[aria-current="page"]::after{background:var(--gold)}
body.photo-hero .nav:not(.scrolled) .nav__links a[aria-current="page"]{color:var(--gold-hi)}
body.photo-hero .nav:not(.scrolled) .nav__links a[aria-current="page"]::after{background:var(--gold-hi)}
/* ============================================================
FIX Z-INDEX PANIER · IMAGE COLLECTION · BTN PANIER CARTE · PDP STICKY
============================================================ */
/* le tiroir panier et la modale passent AU-DESSUS du header */
.cart{z-index:9000}
.sim{z-index:9000}
/* cartes collection (home) : image complète et plus grande */
.card__media img{width:auto;height:auto;max-width:94%;max-height:90%;object-fit:contain}
/* bouton "Ajouter au panier" sur les cartes collection */
.card__add{position:relative;z-index:2;width:100%;margin-top:16px;display:inline-flex;align-items:center;justify-content:center;gap:8px;
font-family:"Space Mono",monospace;font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;
padding:13px 16px;border:1px solid var(--gold);border-radius:2px;background:var(--gold);color:#fff;cursor:pointer;
transition:background .3s,box-shadow .3s}
.card__add:hover{background:var(--gold-deep);box-shadow:0 0 30px -8px var(--gold)}
.card__add.added{background:#16A34A;border-color:#16A34A}
.card__add+.sim-btn--sm{margin-top:10px}
/* fiche produit : galerie sticky, le texte scrolle à côté */
.pdp__gallery{position:sticky;top:96px;align-self:start}
@media(max-width:920px){.pdp__gallery{position:static}}
/* collection (home) : cartes plus hautes + marge autour des photos -> spas jamais coupés */
.card{height:min(84svh,840px)}
.card__media{padding:clamp(14px,2vw,28px)}
.card__media img{width:auto;height:auto;max-width:88%;max-height:82%;object-fit:contain}
/* ============================================================
RETOUCHES MOBILE
============================================================ */
/* menu burger AU-DESSUS du header -> la croix de fermeture est visible */
.mnav{z-index:7500}
/* burger sur le hero : juste 3 traits blancs, sans cadre blanc */
body.photo-hero .nav:not(.scrolled) .nav__burger{border-color:transparent;background:transparent}
/* équilibrage des titres (évite un "?" seul sur une ligne) */
h1,h2,h3{text-wrap:balance}
/* pas d'animation d'apparition au scroll sur mobile (évite le saccadement) */
@media(max-width:820px){
.reveal{opacity:1!important;transform:none!important;transition:none!important}
}
/* bloc confiance : 2 colonnes de 3 stats + pastilles centrées */
@media(max-width:640px){
.garanties__grid{grid-template-columns:1fr 1fr}
.reassure{justify-content:center}
}
/* avis clients : contenu centré */
@media(max-width:820px){
.avis__head{justify-content:center;text-align:center}
.avis__score{text-align:center;width:100%}
.avis__card{text-align:center;align-items:center}
}
/* showroom (bloc contact home) : texte centré */
@media(max-width:820px){
.contact__copy{text-align:center}
.contact__copy p{margin-left:auto;margin-right:auto}
.contact__rows{max-width:420px;margin-left:auto;margin-right:auto}
.crow{justify-content:center}
}
/* catalogue Nos Spas : 2 produits par ligne */
@media(max-width:640px){
main.center .cat-grid,.cat-grid{grid-template-columns:1fr 1fr!important;gap:12px}
.cat-card__name{font-size:18px}
.cat-card__body{padding:14px 14px 16px;gap:7px}
.cat-card__price,.cat-card__price .amt{font-size:18px}
.cat-card__spec{font-size:11px}
.sim-btn--sm{font-size:10px;padding:7px 8px}
.fin-badge small,.price__mo{font-size:12px}
}
/* collection (home) : carrousel horizontal sur mobile (swipe sans ouvrir la fiche) */
@media(max-width:820px){
.pin.no-pin .pin__track{flex-direction:row;overflow-x:auto;-webkit-overflow-scrolling:touch;
scroll-snap-type:x mandatory;gap:14px;padding-bottom:16px;scroll-padding-left:var(--pad)}
.pin.no-pin .card{width:min(84vw,340px);min-height:0;height:auto;flex:none;scroll-snap-align:center}
.pin.no-pin .card__media{min-height:230px;padding:14px}
}
/* logo : "Toulouse" sous "OXO Spa" */
.nav__brand-t{display:flex;flex-direction:column;line-height:1.02;gap:1px}
.nav__brand-t .tag{margin-top:1px}
/* page contact : formulaire en premier, infos ensuite */
.contactp .form{order:-1}
/* ---- retouches mobile (suite) ---- */
/* bloc showroom : boutons centrés sur mobile */
@media(max-width:820px){
.contact__ctas{justify-content:center}
}
/* menu burger : liens plus petits pour tenir sur une ligne */
@media(max-width:560px){
.mnav a{font-size:clamp(18px,5.2vw,32px)}
.mnav a .n{margin-right:12px;font-size:11px}
}
/* catalogue Nos Spas : 1 produit par ligne (annule le 2 colonnes) */
@media(max-width:640px){
main.center .cat-grid,.cat-grid{grid-template-columns:1fr!important;gap:20px}
.cat-card__name{font-size:22px}
.cat-card__body{padding:20px 20px 22px;gap:9px}
.cat-card__price,.cat-card__price .amt{font-size:22px}
.cat-card__spec{font-size:12px}
.sim-btn--sm{font-size:11px;padding:8px 12px}
.price__mo{font-size:14px}
}
/* ============================================================
Tunnel de commande (commande.html / confirmation.html)
============================================================ */
.checkout{max-width:1120px;margin:0 auto}
.co__empty{text-align:center;color:var(--ink-2);padding:60px 0}
.co__empty a{color:var(--gold);border-bottom:1px solid var(--gold)}
.co__grid{display:grid;grid-template-columns:1.25fr .85fr;gap:clamp(22px,3vw,40px);align-items:start}
.co__grid .form{margin:0}
.co__pay{grid-column:1}
.co__recap{grid-column:2;grid-row:1/span 2;position:sticky;top:104px;border:1px solid var(--line);border-radius:10px;background:var(--paper-2);padding:clamp(20px,2.4vw,28px)}
.co__recap h2{font-family:"Archivo";font-weight:900;font-size:clamp(18px,2vw,22px);text-transform:uppercase;margin-bottom:16px}
.co__lines .ci{display:flex;gap:12px;align-items:flex-start;padding:14px 0;border-bottom:1px solid var(--line)}
.co__lines .ci__name{flex:1;min-width:0}
.co__lines .ci__price{font-weight:800;white-space:nowrap}
.co__tag{font-family:"Space Mono",monospace;font-size:9.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--gold);border:1px solid rgba(154,115,39,.4);border-radius:20px;padding:2px 7px;margin-left:6px;white-space:nowrap}
.co__row{display:flex;justify-content:space-between;align-items:baseline;gap:14px;padding:12px 0;border-bottom:1px solid var(--line)}
.co__row span{color:var(--ink-2);font-size:14px}
.co__row b{font-weight:800;font-size:17px}
.co__row--due b{font-size:24px;color:var(--gold)}
.co__row--muted b{font-weight:600;color:var(--ink-2);font-size:15px}
.co__note{color:var(--smoke);font-size:12.5px;line-height:1.6;margin-top:14px}
.co__note b{color:var(--ink-2)}
.co__error{margin-top:16px;padding:12px 14px;border-radius:6px;background:rgba(214,88,79,.09);border:1px solid rgba(214,88,79,.35);color:#8f2f28;font-size:14px;line-height:1.5}
.co__paybox{border:1px solid var(--line);border-radius:10px;background:var(--paper-2);padding:clamp(20px,2.4vw,30px)}
.co__pay h2{font-family:"Archivo";font-weight:900;font-size:clamp(20px,2.4vw,28px);text-transform:uppercase;margin-bottom:16px}
.co__paybox .btn{width:100%;justify-content:center;margin-top:20px}
.co__back{margin-top:10px!important}
.co__secure{text-align:center;color:var(--smoke);font-family:"Space Mono",monospace;font-size:10.5px;letter-spacing:.08em;text-transform:uppercase;margin-top:16px}
@media(max-width:900px){
.co__grid{grid-template-columns:1fr}
.co__recap{grid-column:1;grid-row:auto;position:static;order:-1}
.co__pay{grid-column:1}
}
/* confirmation */
.cf{max-width:620px;margin:0 auto;text-align:center;border:1px solid var(--line);border-radius:12px;background:var(--paper-2);padding:clamp(30px,4vw,48px)}
.cf__ico{width:64px;height:64px;border-radius:50%;display:grid;place-items:center;margin:0 auto 22px}
.cf__ico svg{width:30px;height:30px}
.cf--ok .cf__ico{background:linear-gradient(135deg,#16A34A,#2BD46B 60%,#138A41);color:#fff}
.cf--pending .cf__ico{background:rgba(154,115,39,.14);color:var(--gold)}
.cf--error .cf__ico{background:rgba(214,88,79,.12);color:#b8433a}
.cf__msg{color:var(--ink-2);line-height:1.75;font-size:15px}
.cf__ref{margin:24px auto;padding:14px 18px;border:1px dashed var(--line);border-radius:8px;display:inline-flex;flex-direction:column;gap:5px}
.cf__ref span{font-family:"Space Mono",monospace;font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--smoke)}
.cf__ref b{font-family:"Space Mono",monospace;font-size:13px;color:var(--ink);word-break:break-all}
.cf__next{color:var(--smoke);font-size:13px;line-height:1.65;margin-bottom:26px}
.cf .cart-cta{justify-content:center}