@font-face{ font-family:'Inter'; font-style:normal; font-weight:100 900; font-display:swap; src:url(fonts/inter-var.woff2) format('woff2'); }
@font-face{ font-family:'Source Serif 4'; font-style:normal; font-weight:600; font-display:swap; src:url(fonts/source-serif-600.woff2) format('woff2'); }
@font-face{ font-family:'Source Serif 4'; font-style:normal; font-weight:700; font-display:swap; src:url(fonts/source-serif-700.woff2) format('woff2'); }
:root{
  --bg:#f5f4f0; --surface:#ffffff; --surface-2:#eceae4; --line:#d9d6cd;
  --ink:#16213a; --ink-2:#4a5468; --ink-3:#586278;
  --brand:#0c606f; --brand-hover:#094a57; --on-brand:#ffffff;
  --yellow:#fdcd05; --yellow-hover:#e6b800; --on-yellow:#16213a;
  --pre:#a8281f; --pre-bg:#fbeceb;
  --gold:#8a5a00; --gold-bg:#fbf1da;
  --ok:#1f6b3a; --ok-bg:#e6f3ea; --low:#8a5a00; --low-bg:#fbf1da; --out:#586278; --out-bg:#eceae4;
  --shadow:0 1px 2px rgba(22,33,58,.06), 0 4px 14px rgba(22,33,58,.05);
  --serif:'Source Serif 4', Georgia, 'Times New Roman', serif;
  --sans:'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  --radius:8px;
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --bg:#0e131c; --surface:#161d29; --surface-2:#1d2634; --line:#2a3445;
    --ink:#e9edf4; --ink-2:#b4bdcc; --ink-3:#8d97aa;
    --brand:#4fb4c6; --brand-hover:#79c8d7; --on-brand:#06141a;
    --pre:#ff8c84; --pre-bg:#2c1a1b;
    --gold:#e6b756; --gold-bg:#2a2314;
    --ok:#6fd08f; --ok-bg:#15281d; --low:#e6b756; --low-bg:#2a2314; --out:#8d97aa; --out-bg:#1d2634;
    --shadow:none;
  }
}
:root[data-theme="dark"]{
  --bg:#0e131c; --surface:#161d29; --surface-2:#1d2634; --line:#2a3445;
  --ink:#e9edf4; --ink-2:#b4bdcc; --ink-3:#8d97aa;
  --brand:#4fb4c6; --brand-hover:#79c8d7; --on-brand:#06141a;
  --pre:#ff8c84; --pre-bg:#2c1a1b;
  --gold:#e6b756; --gold-bg:#2a2314;
  --ok:#6fd08f; --ok-bg:#15281d; --low:#e6b756; --low-bg:#2a2314; --out:#8d97aa; --out-bg:#1d2634;
  --shadow:none;
}
*{ box-sizing:border-box; margin:0; padding:0; }
html{ scroll-behavior:smooth; scroll-padding-top:76px; }
body{ background:var(--bg); color:var(--ink); font-family:var(--sans); font-size:16px; line-height:1.6; -webkit-font-smoothing:antialiased; }
img{ max-width:100%; height:auto; display:block; }
::selection{ background:var(--yellow); color:var(--on-yellow); }
body.lock{ overflow:hidden; }
.svg-defs{ position:absolute; width:0; height:0; overflow:hidden; }
.sr-only{ position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }
a{ color:var(--brand); }
:focus-visible{ outline:3px solid var(--brand); outline-offset:2px; border-radius:4px; }
.wrap{ max-width:1160px; margin:0 auto; padding:0 24px; }
h1,h2,h3,h4{ font-family:var(--serif); font-weight:700; line-height:1.2; color:var(--ink); letter-spacing:-.01em; }
.skip{ position:absolute; left:-999px; top:8px; background:var(--brand); color:var(--on-brand); padding:8px 14px; border-radius:6px; z-index:200; }
.skip:focus{ left:8px; }

/* barre d'information (banderole) */
.topbar{ position:relative; background:var(--ink); color:#fff; font-size:.86rem; overflow:hidden; white-space:nowrap; }
.marquee{ display:flex; width:max-content; animation:scroll 40s linear infinite; padding:9px 0; will-change:transform; }
.topbar:hover .marquee, .topbar.paused .marquee, .topbar:focus-within .marquee{ animation-play-state:paused; }
.marquee .set{ display:flex; flex:none; align-items:center; }
.marquee .set > span{ display:inline-flex; align-items:center; padding:0 22px; }
.marquee b{ color:var(--yellow); font-weight:600; margin-right:.35em; }
.marquee i{ width:6px; height:6px; background:var(--yellow); transform:rotate(45deg); display:inline-block; margin-left:44px; }
.marq-pause{ position:absolute; right:0; top:0; bottom:0; width:42px; border:0; background:linear-gradient(90deg, transparent, var(--ink) 40%); color:#fff; cursor:pointer; font-size:.8rem; }
@keyframes scroll{ to{ transform:translateX(-50%); } }
@media (prefers-color-scheme: dark){ :root:not([data-theme="light"]) .topbar{ background:#05080d; } :root:not([data-theme="light"]) .marq-pause{ background:linear-gradient(90deg, transparent, #05080d 40%); } }
:root[data-theme="dark"] .topbar{ background:#05080d; }
:root[data-theme="dark"] .marq-pause{ background:linear-gradient(90deg, transparent, #05080d 40%); }
@media (prefers-reduced-motion: reduce){ .marquee{ animation:none; width:auto; justify-content:center; flex-wrap:wrap; } .marquee .set + .set, .marq-pause{ display:none; } }

/* en-tête */
header.site{ position:sticky; top:0; z-index:50; background:var(--surface); border-bottom:1px solid var(--line); }
header.site .wrap{ display:flex; align-items:center; justify-content:space-between; height:68px; gap:16px; }
.logo{ font-family:var(--sans); font-weight:800; font-size:1.45rem; line-height:1; color:var(--brand); text-decoration:none; letter-spacing:.03em; white-space:nowrap; }
.logo .x{ color:var(--yellow); text-shadow:0 0 1px rgba(80,60,0,.55); }
nav.main{ display:flex; align-items:center; gap:20px; }
nav.main a.link{ white-space:nowrap; color:var(--ink-2); text-decoration:none; font-weight:500; font-size:.95rem; }
nav.main a.link:hover{ color:var(--brand); }
.btn{ white-space:nowrap; display:inline-flex; align-items:center; justify-content:center; gap:8px; font-family:var(--sans); font-weight:600; font-size:.95rem; padding:11px 20px; border-radius:var(--radius); text-decoration:none; border:1.5px solid transparent; cursor:pointer; transition:background .15s, border-color .15s; }
.btn-primary{ background:var(--yellow); color:var(--on-yellow); }
.btn-primary:hover{ background:var(--yellow-hover); }
.btn-blue{ background:var(--brand); color:var(--on-brand); }
.btn-blue:hover{ background:var(--brand-hover); }
.btn-outline{ background:transparent; color:var(--ink); border-color:var(--line); }
.btn-outline:hover{ border-color:var(--ink-2); }
.icon-btn{ width:40px; height:40px; border-radius:var(--radius); border:1px solid var(--line); background:transparent; color:var(--ink-2); cursor:pointer; display:inline-flex; align-items:center; justify-content:center; }
.icon-btn:hover{ border-color:var(--ink-2); color:var(--ink); }
.burger{ display:none; }
.mobile-menu{ display:none; background:var(--surface); border-bottom:1px solid var(--line); }
.mobile-menu.open{ display:block; }
.mobile-menu a{ display:block; padding:14px 24px; color:var(--ink); text-decoration:none; font-weight:500; border-top:1px solid var(--line); }

/* hero */
.hero{ padding:64px 0 56px; }
.hero .wrap{ display:grid; grid-template-columns:1.1fr .9fr; gap:56px; align-items:center; }
.eyebrow{ display:inline-block; font-size:.78rem; font-weight:600; letter-spacing:.12em; text-transform:uppercase; color:var(--on-yellow); background:var(--yellow); padding:5px 11px; border-radius:4px; margin-bottom:16px; }
.hero h1{ font-size:clamp(2rem,4.2vw,3.1rem); margin-bottom:18px; }
.hl{ background:linear-gradient(transparent 62%, var(--yellow) 62%); padding:0 2px; }
.hero p.lead{ font-size:1.08rem; color:var(--ink-2); max-width:54ch; margin-bottom:28px; }
.cta-row{ display:flex; gap:12px; flex-wrap:wrap; }
.hero-photo{ margin:0; min-width:0; }
.carousel{ position:relative; border:1px solid var(--line); border-radius:var(--radius); overflow:hidden; box-shadow:var(--shadow); background:var(--surface-2); }
.car-track{ display:flex; overflow-x:auto; scroll-snap-type:x mandatory; scrollbar-width:none; -webkit-overflow-scrolling:touch; }
.car-track::-webkit-scrollbar{ display:none; }
.car-slide{ flex:0 0 100%; scroll-snap-align:center; aspect-ratio:4/3; display:flex; align-items:center; justify-content:center; }
.car-slide img{ width:100%; height:100%; object-fit:contain; cursor:zoom-in; }
.car-btn{ position:absolute; top:50%; transform:translateY(-50%); width:42px; height:42px; border-radius:50%; border:0; background:var(--yellow); color:var(--on-yellow); font-size:1.3rem; font-weight:700; cursor:pointer; box-shadow:0 2px 8px rgba(0,0,0,.25); display:flex; align-items:center; justify-content:center; }
.car-btn:hover{ background:var(--yellow-hover); }
.car-btn.prev{ left:10px; } .car-btn.next{ right:10px; }
.car-dots{ position:absolute; left:0; right:0; bottom:10px; display:flex; justify-content:center; gap:7px; pointer-events:none; }
.car-dots i{ width:8px; height:8px; border-radius:50%; background:rgba(22,33,58,.35); border:1px solid rgba(255,255,255,.7); }
.car-dots i.on{ background:var(--yellow); border-color:var(--on-yellow); }
.hero-photo figcaption{ font-size:.85rem; color:var(--ink-3); margin-top:10px; }

/* bandeau de réassurance */
.assure{ background:var(--surface); border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.assure .wrap{ display:grid; grid-template-columns:repeat(4,1fr); gap:24px; padding-top:26px; padding-bottom:26px; }
.assure-item{ display:flex; gap:14px; align-items:flex-start; }
.assure-item svg{ flex:none; width:42px; height:42px; padding:9px; border-radius:50%; background:var(--yellow); color:var(--on-yellow); }
.assure-item b{ display:block; font-size:.95rem; font-weight:600; }
.assure-item span{ font-size:.86rem; color:var(--ink-2); line-height:1.45; display:block; }

/* sections */
section.block{ padding:72px 0; }
.sec-head{ margin-bottom:32px; max-width:70ch; }
.sec-head h2{ font-size:clamp(1.6rem,3vw,2.1rem); margin-bottom:14px; }
.sec-head h2::after{ content:''; display:block; width:56px; height:5px; background:var(--yellow); border-radius:3px; margin-top:10px; }
.sec-head p{ color:var(--ink-2); }

/* boutique */
.toolbar{ display:flex; gap:16px; flex-wrap:wrap; align-items:center; margin-bottom:12px; }
.search{ position:relative; flex:1 1 280px; max-width:420px; }
.search svg{ position:absolute; left:14px; top:50%; transform:translateY(-50%); width:18px; height:18px; color:var(--ink-3); }
.search input{ width:100%; padding:12px 14px 12px 42px; border:1px solid var(--line); background:var(--surface); color:var(--ink); border-radius:var(--radius); font:inherit; font-size:.97rem; }
.search input::placeholder{ color:var(--ink-3); }
.filters{ display:flex; gap:8px; flex-wrap:wrap; }
.chip{ display:inline-flex; align-items:center; gap:8px; padding:9px 14px; border:1px solid var(--line); background:var(--surface); color:var(--ink-2); border-radius:999px; font:inherit; font-size:.9rem; font-weight:500; cursor:pointer; }
.chip:hover{ border-color:var(--ink-2); }
.chip.active{ background:var(--brand); border-color:var(--brand); color:var(--on-brand); }
.search-hint{ font-size:.9rem; color:var(--ink-3); margin-bottom:28px; }
.count{ font-size:.9rem; color:var(--ink-3); margin-bottom:16px; }

.grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(250px,1fr)); gap:22px; }
.card{ position:relative; background:var(--surface); border:1px solid var(--line); border-radius:var(--radius); display:flex; flex-direction:column; box-shadow:var(--shadow); overflow:hidden; }
.card.anniv{ border-color:var(--yellow); border-width:2px; }
.card.pre{ border-color:var(--pre); border-width:2px; }
.ribbon{ position:absolute; top:12px; left:12px; z-index:2; font-size:.72rem; font-weight:600; letter-spacing:.08em; padding:4px 9px; border-radius:4px; }
.ribbon.anniv{ background:var(--yellow); color:var(--on-yellow); border:1px solid rgba(22,33,58,.25); font-weight:700; }
.ribbon.pre{ background:var(--pre-bg); color:var(--pre); border:1px solid var(--pre); }
.thumb{ position:relative; aspect-ratio:1/1; background:var(--surface-2); display:flex; align-items:center; justify-content:center; font-size:3rem; color:var(--ink-3); }
.thumb img{ width:100%; height:100%; object-fit:contain; cursor:zoom-in; }
.thumb .zoom{ position:absolute; right:10px; bottom:10px; background:rgba(22,33,58,.78); color:#fff; font-size:.74rem; padding:3px 8px; border-radius:4px; pointer-events:none; }
.card-body{ padding:16px 18px 18px; display:flex; flex-direction:column; gap:10px; flex:1; }
.meta{ display:flex; justify-content:space-between; align-items:center; gap:8px; flex-wrap:wrap; }
.lang{ display:inline-flex; align-items:center; gap:7px; font-size:.84rem; color:var(--ink-2); font-weight:500; }
.lang svg{ border:1px solid var(--line); border-radius:2px; }
.stock{ font-size:.76rem; font-weight:600; padding:3px 9px; border-radius:999px; }
.stock.high{ background:var(--ok-bg); color:var(--ok); }
.stock.low{ background:var(--low-bg); color:var(--low); }
.stock.out{ background:var(--out-bg); color:var(--out); }
.card h3{ font-family:var(--serif); font-size:1.08rem; font-weight:600; line-height:1.3; flex:1; }
.prices{ display:flex; flex-direction:column; gap:3px; margin-top:2px; }
.price-row{ display:flex; align-items:center; gap:8px; }
.price-row svg{ border:1px solid var(--line); border-radius:2px; flex:none; }
.price{ font-weight:600; font-size:1.25rem; font-variant-numeric:tabular-nums; }
.price.chf{ font-size:.92rem; font-weight:500; color:var(--ink-2); }
.card .btn{ width:100%; margin-top:6px; }
.card.soldout .thumb, .card.soldout h3, .card.soldout .prices{ opacity:.55; }
.card.soldout .thumb img{ filter:grayscale(.8); }
.no-results{ display:none; text-align:center; padding:48px 16px; color:var(--ink-2); border:1px dashed var(--line); border-radius:var(--radius); }
.no-results a{ display:inline-block; margin-top:10px; font-weight:600; }
.loading-msg{ color:var(--ink-3); grid-column:1/-1; }


/* promos / déstockage */
.promo{ background:var(--ink); color:#fff; padding:64px 0; position:relative; overflow:hidden; }
@media (prefers-color-scheme: dark){ :root:not([data-theme="light"]) .promo{ background:#101a2b; } }
:root[data-theme="dark"] .promo{ background:#101a2b; }
.promo::before{ content:''; position:absolute; inset:0 0 auto 0; height:6px; background:repeating-linear-gradient(135deg, var(--yellow) 0 16px, #16213a 16px 32px); }
.promo-head{ display:flex; justify-content:space-between; align-items:flex-end; gap:20px; flex-wrap:wrap; margin-bottom:28px; }
.promo-kicker{ display:inline-block; background:var(--yellow); color:var(--on-yellow); font-weight:700; font-size:.76rem; letter-spacing:.14em; text-transform:uppercase; padding:5px 11px; border-radius:4px; margin-bottom:12px; }
.promo h2{ color:#fff; font-size:clamp(1.7rem,3.4vw,2.4rem); }
.promo-head p{ color:#c3cbdb; max-width:52ch; margin-top:8px; }
.promo-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(250px,1fr)); gap:22px; }
.pcard{ position:relative; background:var(--surface); color:var(--ink); border-radius:var(--radius); overflow:hidden; display:flex; flex-direction:column; border:2px solid var(--yellow); }
.off{ position:absolute; top:0; right:0; z-index:2; background:var(--pre); color:#fff; font-weight:800; font-size:1.05rem; padding:9px 14px 9px 16px; border-bottom-left-radius:var(--radius); letter-spacing:.01em; }
.pcard .thumb{ aspect-ratio:1/1; }
.pcard .card-body{ padding:16px 18px 18px; }
.old{ color:var(--ink-3); text-decoration:line-through; font-size:.95rem; font-variant-numeric:tabular-nums; }
.price.promo-price{ color:var(--pre); font-size:1.5rem; font-weight:800; }
.save{ font-size:.82rem; font-weight:600; color:var(--ok); }
.last{ font-size:.78rem; font-weight:700; color:var(--pre); background:var(--pre-bg); padding:3px 9px; border-radius:999px; }


#about{ background:var(--surface); border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
/* avis */
.reviews{ background:var(--bg); }
.rev-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(260px,1fr)); gap:20px; }
.rev{ background:var(--surface); border:1px solid var(--line); border-radius:var(--radius); padding:22px; display:flex; flex-direction:column; gap:12px; box-shadow:var(--shadow); }
.stars{ display:flex; gap:3px; color:#fbbc04; }
.stars svg{ width:20px; height:20px; }
.rev blockquote{ color:var(--ink); font-size:.98rem; line-height:1.6; flex:1; }
.rev-by{ display:flex; justify-content:space-between; align-items:center; gap:10px; font-size:.88rem; color:var(--ink-2); font-weight:600; }
.rev-by span{ font-weight:500; color:var(--ink-3); display:inline-flex; align-items:center; gap:6px; }
.rating{ display:inline-flex; align-items:center; gap:18px; background:var(--surface); border:1px solid var(--line); border-radius:var(--radius); padding:16px 24px; text-decoration:none; color:var(--ink); margin-bottom:24px; box-shadow:var(--shadow); }
.rating:hover{ border-color:var(--ink-2); }
.rating-num{ font-family:var(--serif); font-weight:700; font-size:2.6rem; line-height:1; }
.rating-main{ display:flex; flex-direction:column; gap:4px; }
.rating-sub{ font-size:.9rem; color:var(--ink-2); font-weight:500; }
.rev-link{ margin-top:22px; font-weight:600; }


/* fenêtre de commande */
.modal{ position:fixed; inset:0; background:rgba(8,12,20,.7); z-index:250; display:flex; align-items:center; justify-content:center; padding:16px; }
.modal[hidden]{ display:none; }
.modal-box{ position:relative; background:var(--surface); color:var(--ink); width:100%; max-width:520px; max-height:92vh; overflow:auto; border-radius:var(--radius); padding:26px 24px 22px; border-top:6px solid var(--yellow); }
.modal-close{ position:absolute; top:10px; right:10px; width:36px; height:36px; border-radius:50%; border:1px solid var(--line); background:transparent; color:var(--ink-2); cursor:pointer; }
.modal h3{ font-size:1.3rem; margin-right:30px; margin-bottom:6px; }
.om-sub{ color:var(--ink-2); font-size:.94rem; margin-bottom:14px; }
.om-qty{ display:flex; align-items:center; gap:10px; font-weight:600; font-size:.92rem; margin-bottom:10px; }
.om-qty input{ width:72px; padding:8px 10px; border:1px solid var(--line); border-radius:6px; background:var(--bg); color:var(--ink); font:inherit; }
#omText{ width:100%; padding:12px; border:1px solid var(--line); border-radius:var(--radius); background:var(--bg); color:var(--ink); font:inherit; font-size:.9rem; line-height:1.5; resize:none; }
.om-steps{ margin:14px 0 16px 20px; color:var(--ink-2); font-size:.9rem; }
.om-steps li{ margin-bottom:5px; }
.om-actions{ display:flex; gap:10px; flex-wrap:wrap; }
.om-actions .btn{ flex:1 1 auto; }
.om-note{ min-height:1.3em; margin-top:10px; font-size:.88rem; font-weight:600; color:var(--ok); }

/* à propos */
.about-grid{ display:grid; grid-template-columns:1fr 1fr; gap:48px; align-items:start; }
.about-grid .text p{ color:var(--ink-2); margin-bottom:14px; }
.facts{ list-style:none; margin-top:18px; display:grid; gap:10px; }
.facts li{ display:flex; gap:10px; font-size:.95rem; }
.facts svg{ flex:none; width:20px; height:20px; color:var(--ok); margin-top:2px; }
.stock-gallery{ display:grid; grid-template-columns:repeat(3,1fr); gap:10px; }
.stock-photo{ position:relative; border-radius:var(--radius); overflow:hidden; border:1px solid var(--line); aspect-ratio:1/1; background:var(--surface-2); }
.stock-photo img{ width:100%; height:100%; object-fit:cover; cursor:zoom-in; }
.gallery-note{ font-size:.85rem; color:var(--ink-3); margin-top:10px; }

/* où */
.where{ background:var(--surface); border-top:1px solid var(--line); }
.where .wrap{ display:grid; grid-template-columns:1fr 1fr; gap:48px; align-items:center; }
.where img{ width:100%; border-radius:var(--radius); border:1px solid var(--line); }
.machine{ margin:0; display:flex; justify-content:center; }
.machine img{ width:auto; max-width:100%; max-height:560px; cursor:zoom-in; box-shadow:var(--shadow); }
.where-map{ grid-column:1/-1; }
.where p{ color:var(--ink-2); }

/* pied */
footer{ background:var(--ink); color:#cfd6e4; padding:48px 0 28px; font-size:.92rem; }
@media (prefers-color-scheme: dark){ :root:not([data-theme="light"]) footer{ background:#05080d; } }
:root[data-theme="dark"] footer{ background:#05080d; }
footer .cols{ display:grid; grid-template-columns:1.4fr 1fr 1fr; gap:32px; margin-bottom:28px; }
footer h4{ font-family:var(--sans); font-size:.8rem; letter-spacing:.12em; text-transform:uppercase; color:#fff; margin-bottom:12px; }
footer a{ color:#cfd6e4; display:block; margin-bottom:6px; text-decoration:none; }
footer a:hover{ color:#fff; text-decoration:underline; }
footer .brand{ font-family:var(--sans); font-weight:800; font-size:1.5rem; color:#6cc3d3; letter-spacing:.03em; line-height:1; margin-bottom:12px; }
footer .brand span{ color:var(--yellow); }
.social{ display:flex; gap:10px; }
.social a{ width:40px; height:40px; border-radius:var(--radius); border:1px solid var(--line); display:inline-flex; align-items:center; justify-content:center; color:var(--ink); background:var(--surface); text-decoration:none; transition:border-color .15s, transform .15s; }
.social a:hover{ border-color:var(--ink-2); transform:translateY(-1px); }
.social svg{ width:19px; height:19px; }
footer .social a{ border-color:rgba(255,255,255,.25); background:rgba(255,255,255,.06); color:#fff; margin:0; }
footer .social a:hover{ border-color:#fff; }
footer .legal{ border-top:1px solid rgba(255,255,255,.14); padding-top:18px; font-size:.82rem; color:#9aa5bb; }

.lightbox{ display:none; position:fixed; inset:0; background:rgba(8,12,20,.88); z-index:300; align-items:center; justify-content:center; padding:24px; }
.lightbox.open{ display:flex; }
.lightbox img{ max-width:100%; max-height:90vh; border-radius:6px; background:#fff; }
.lightbox-close{ position:absolute; top:16px; right:16px; width:42px; height:42px; border-radius:50%; border:0; background:#fff; color:#111; font-size:1.2rem; cursor:pointer; }
.back-to-top{ position:fixed; right:18px; bottom:18px; width:44px; height:44px; border-radius:50%; border:1px solid var(--line); background:var(--surface); color:var(--ink); cursor:pointer; opacity:0; pointer-events:none; transition:opacity .2s; box-shadow:var(--shadow); z-index:40; }
.back-to-top.visible{ opacity:1; pointer-events:auto; }

@media (max-width: 1080px){
  nav.main a.link, nav.main .btn, nav.main > .social{ display:none; }
  .burger{ display:inline-flex; }
}
@media (max-width: 900px){
  .hero .wrap, .about-grid, .where .wrap{ grid-template-columns:1fr; gap:32px; }
  .assure .wrap{ grid-template-columns:1fr 1fr; }
  .steps{ grid-template-columns:1fr; gap:20px; }
  footer .cols{ grid-template-columns:1fr; }
  nav.main a.link, nav.main .btn, nav.main > .social{ display:none; }
  .burger{ display:inline-flex; }
}
@media (max-width: 560px){
  .wrap{ padding:0 16px; }
  .hero{ padding:36px 0 36px; }
  section.block{ padding:48px 0; }
  .assure .wrap{ grid-template-columns:1fr; }
  .grid{ grid-template-columns:1fr 1fr; gap:12px; }
  .card-body{ padding:12px; }
  .card h3{ font-size:.95rem; }
  .price{ font-size:1.1rem; }
  .meta{ flex-direction:column; align-items:flex-start; }
}
@media (max-width: 380px){ .grid{ grid-template-columns:1fr; } }
@media (prefers-reduced-motion: reduce){ html{ scroll-behavior:auto; } *{ transition:none !important; } }

/* ---- utilitaires (remplacent les styles en ligne) ---- */
.sec-head.tight{ margin-bottom:16px; }
.btn-row{ margin-top:20px; }
.mobile-social{ padding:14px 24px; border-top:1px solid var(--line); }
footer h4.spaced{ margin-top:16px; }
.legal-id{ color:#9aa5bb; margin-top:10px; font-size:.86rem; }

/* ---- fluidité ---- */
.btn:active{ transform:translateY(1px); }
@media (hover:hover){
  .card, .pcard{ transition:transform .18s ease, box-shadow .18s ease; }
  .card:hover, .pcard:hover{ transform:translateY(-3px); box-shadow:0 2px 4px rgba(22,33,58,.08), 0 12px 28px rgba(22,33,58,.12); }
}
.card, .pcard{ animation:rise .35s ease both; }
@keyframes rise{ from{ opacity:0; transform:translateY(8px); } to{ opacity:1; transform:none; } }
.skeleton{ border-radius:var(--radius); min-height:360px; background:linear-gradient(100deg, var(--surface-2) 30%, var(--surface) 50%, var(--surface-2) 70%); background-size:200% 100%; animation:shimmer 1.3s linear infinite; border:1px solid var(--line); }
@keyframes shimmer{ to{ background-position:-200% 0; } }
.notice{ grid-column:1/-1; padding:28px 20px; text-align:center; border:1px dashed var(--line); border-radius:var(--radius); color:var(--ink-2); }
.notice a{ font-weight:600; }
.car-track{ overscroll-behavior-x:contain; }
#about, #avis, #where{ content-visibility:auto; contain-intrinsic-size:auto 600px; }
.chf-note{ font-size:.82rem; color:var(--ink-3); margin-top:6px; }
noscript .notice{ margin:24px; display:block; }
@media (prefers-reduced-motion: reduce){ .card, .pcard, .skeleton{ animation:none; } .card:hover, .pcard:hover{ transform:none; } }
.om-qty[hidden]{ display:none; }
.marq-pause .i-play{ display:none; }
.marq-pause[aria-pressed="true"] .i-play{ display:inline; }
.marq-pause[aria-pressed="true"] .i-pause{ display:none; }
.nf{ padding-top:20vh; text-align:center; }
.nf h1{ margin:18px 0 10px; font-size:1.8rem; }
.nf .lead{ color:var(--ink-2); }

/* ---- v40 : mobile, icônes, surlignage ---- */
.hl{ background:none; text-decoration:underline; text-decoration-color:var(--yellow); text-decoration-thickness:5px; text-underline-offset:7px; text-decoration-skip-ink:none; }
.social a.ig-link, .social a:first-child{ border:0; }
.social a:first-child{ background:#000; }
.social a:first-child svg{ color:#fff; }
.social a.ig-link{ background:linear-gradient(45deg,#feda75,#fa7e1e 30%,#d62976 60%,#962fbf 85%,#4f5bd5); }
.social a.ig-link svg{ color:#fff; }
footer .social a:first-child, footer .social a.ig-link{ border:0; }
.more-btn{ display:flex; margin:26px auto 0; }
.more-btn[hidden]{ display:none; }
.chip-promo{ border-color:var(--pre); color:var(--pre); font-weight:600; }
.chip-promo.active{ background:var(--pre); border-color:var(--pre); color:#fff; }
@media (max-width:560px){
  .filters{ flex-wrap:nowrap; overflow-x:auto; margin:0 -16px; padding:2px 16px 6px; scrollbar-width:none; scroll-snap-type:x proximity; }
  .filters::-webkit-scrollbar{ display:none; }
  .chip{ flex:none; white-space:nowrap; }
  .search{ max-width:none; flex-basis:100%; }
  .toolbar{ gap:10px; }
  .search-hint{ margin-bottom:16px; }
  .card .thumb{ aspect-ratio:1/.85; }
  .card-body{ gap:6px; padding:10px; }
  .card h3{ font-size:.88rem; }
  .price{ font-size:1rem; } .price.chf{ font-size:.78rem; }
  .card .btn{ padding:9px 8px; font-size:.84rem; }
  .meta{ font-size:.74rem; }
  .promo-grid{ display:flex; overflow-x:auto; scroll-snap-type:x mandatory; gap:12px; margin:0 -16px; padding:0 16px 10px; scrollbar-width:none; }
  .promo-grid::-webkit-scrollbar{ display:none; }
  .promo-grid .pcard{ flex:0 0 74%; scroll-snap-align:center; }
  .promo{ padding:48px 0; }
}
.mobile-menu .social a{ display:inline-flex; padding:0; width:44px; height:44px; border-top:0; }
.mobile-menu .social svg{ width:22px; height:22px; }