:root{
  --night:#141618;--deep:#1A1D20;--card:#1F242A;--card-2:#262D35;
  --edge:rgba(120,200,235,.17);--edge-2:rgba(120,200,235,.36);
  --cream:#EDF4F8;--lilac:#9FC6DB;--lilac-dim:#7A93A2;
  --flare:#00A0E0;--orchid:#2070C0;--butter:#66D2F2;--jade:#34D9B4;
  --disp:'Bricolage Grotesque',Georgia,serif;
  --sans:'Manrope',system-ui,-apple-system,'Segoe UI',sans-serif;
  --r-xs:12px;--r-sm:18px;--r:26px;--r-lg:38px;--pill:999px;
  --wrap:1300px;--gut:clamp(18px,4.4vw,46px);
  --shadow:0 30px 70px -34px rgba(0,0,0,.85);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;color:var(--cream);font-family:var(--sans);font-size:16px;line-height:1.6;
  -webkit-font-smoothing:antialiased;overflow-x:hidden;
  background:radial-gradient(1100px 780px at 78% -8%,rgba(0,160,224,.28),transparent 62%),
    radial-gradient(900px 700px at 4% 22%,rgba(32,112,192,.18),transparent 60%),
    radial-gradient(1000px 900px at 50% 112%,rgba(52,217,180,.10),transparent 62%),var(--night);
  background-attachment:fixed}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
a:hover{color:var(--butter)}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
h1,h2,h3,h4{font-family:var(--disp);font-weight:700;margin:0;letter-spacing:-.03em;line-height:1.08}
.wrap{width:100%;max-width:var(--wrap);margin-inline:auto;padding-inline:var(--gut)}

/* ── utility bar ── */
.util{border-bottom:1px solid var(--edge);background:rgba(0,0,0,.24);font-size:12px}
.util .wrap{display:flex;align-items:center;gap:18px;flex-wrap:wrap;min-height:40px}
.util a{color:var(--lilac-dim);font-weight:600}
.util .sp{margin-left:auto}

/* ── masthead ── */
.mast{position:sticky;top:0;z-index:60;backdrop-filter:blur(16px);
  background:rgba(20,22,24,.86);border-bottom:1px solid var(--edge)}
.mast .wrap{display:flex;align-items:center;gap:clamp(14px,2.4vw,32px);padding-block:14px}
.mast .logo img{height:clamp(38px,4vw,52px);width:auto}
.srch{display:flex;flex:1;min-width:0;align-items:center;gap:10px;padding:5px 5px 5px 18px;
  border-radius:var(--pill);background:rgba(255,255,255,.055);border:1px solid var(--edge);
  transition:border-color .3s,background .3s}
.srch:focus-within{border-color:var(--edge-2);background:rgba(255,255,255,.085)}
.srch input{flex:1;min-width:0;border:0;background:none;color:var(--cream);font-size:14px;outline:none}
.srch input::placeholder{color:var(--lilac-dim)}
.srch button{padding:10px 20px;border-radius:var(--pill);font-size:12.5px;font-weight:800;
  letter-spacing:.06em;color:#fff;background:linear-gradient(135deg,var(--flare),var(--orchid));
  transition:transform .3s cubic-bezier(.3,1.4,.4,1)}
.srch button:hover{transform:translateY(-2px)}
.mcall{display:flex;flex-direction:column;line-height:1.25;white-space:nowrap}
.mcall span{font-size:10.5px;font-weight:800;letter-spacing:.14em;color:var(--lilac-dim)}
.mcall a{font-size:14.5px;font-weight:800;color:var(--butter)}

/* ── category nav ── */
.cnav{border-bottom:1px solid var(--edge);background:rgba(255,255,255,.022);
  overflow-x:auto;scrollbar-width:none}
.cnav::-webkit-scrollbar{display:none}
.cnav .wrap{display:flex;gap:8px;padding-block:11px;width:max-content;min-width:100%}
.cnav a{padding:8px 17px;border-radius:var(--pill);font-size:13px;font-weight:700;
  color:var(--lilac);background:rgba(255,255,255,.05);border:1px solid transparent;
  white-space:nowrap;transition:.25s}
.cnav a:hover{background:rgba(255,255,255,.1);color:#fff}
.cnav a.on{background:linear-gradient(135deg,var(--flare),var(--orchid));color:#fff;
  box-shadow:0 12px 26px -14px rgba(0,160,224,.9)}

/* ── breadcrumb + hero ── */
.crumb{display:flex;gap:9px;align-items:center;flex-wrap:wrap;
  padding-top:clamp(20px,2.6vw,34px);font-size:12px;color:var(--lilac-dim)}
.crumb b{color:var(--lilac);font-weight:700}
.chead{display:grid;grid-template-columns:1.25fr .75fr;gap:clamp(20px,3vw,44px);
  align-items:end;padding-block:clamp(16px,2.2vw,26px)}
.chead h1{font-size:clamp(34px,6vw,70px)}
.chead .sub{margin-top:14px;font-size:clamp(14px,1.15vw,17px);color:var(--lilac);max-width:52ch}
.chead .cnt{justify-self:end;text-align:right}
.chead .cnt b{display:block;font-family:var(--disp);font-size:clamp(38px,5vw,62px);
  color:var(--butter);line-height:1}
.chead .cnt span{font-size:11px;font-weight:800;letter-spacing:.16em;color:var(--lilac-dim)}

/* ── brand logo rail (the pick-by-logo control) ── */
.brands{margin-top:clamp(10px,1.6vw,18px)}
.brands h2{font-family:var(--sans);font-size:11px;font-weight:800;letter-spacing:.18em;
  color:var(--lilac-dim);margin-bottom:14px}
.brail{display:grid;grid-template-columns:repeat(auto-fill,minmax(146px,1fr));
  gap:clamp(9px,1.1vw,13px)}
.btile{position:relative;display:grid;place-items:center;min-height:86px;padding:16px 14px;
  border-radius:var(--r-sm);background:rgba(255,255,255,.04);border:1px solid var(--edge);
  overflow:hidden;transition:transform .35s cubic-bezier(.3,1.25,.4,1),border-color .3s,background .3s}
.btile::before{content:"";position:absolute;inset:0;opacity:0;transition:opacity .4s;
  background:radial-gradient(120% 90% at 50% 120%,rgba(0,160,224,.4),transparent 70%)}
.btile:hover{transform:translateY(-5px);border-color:var(--edge-2);background:rgba(255,255,255,.075)}
.btile:hover::before{opacity:1}
.btile img{position:relative;max-width:100%;width:auto;
  filter:brightness(0) invert(1);opacity:.55;
  transition:opacity .35s,transform .35s cubic-bezier(.3,1.25,.4,1)}
.btile:hover img{opacity:1;transform:scale(1.07)}
.btile em{position:relative;font-style:normal;font-family:var(--disp);font-size:17px;
  letter-spacing:-.02em;color:var(--lilac);transition:color .3s}
.btile:hover em{color:#fff}
.btile i{position:absolute;top:8px;right:11px;font-style:normal;font-size:10.5px;
  font-weight:800;color:var(--lilac-dim);transition:color .3s}
.btile:hover i{color:var(--butter)}
.btile.on{border-color:transparent;background:rgba(0,160,224,.16);
  box-shadow:0 0 0 2px var(--flare) inset,0 18px 40px -20px rgba(0,160,224,.95)}
.btile.on img{opacity:1}
.btile.on em,.btile.on i{color:#fff}

/* ── toolbar ── */
.tools{display:flex;align-items:center;gap:12px;flex-wrap:wrap;
  margin-top:clamp(24px,3vw,40px);padding-bottom:16px;border-bottom:1px solid var(--edge)}
.subs{display:flex;gap:8px;flex-wrap:wrap;flex:1}
.subs button{padding:8px 16px;border-radius:var(--pill);font-size:12.5px;font-weight:700;
  color:var(--lilac);background:rgba(255,255,255,.05);border:1px solid var(--edge);transition:.25s}
.subs button:hover{background:rgba(255,255,255,.1);color:#fff}
.subs button.on{background:var(--butter);color:#0E1113;border-color:transparent}
.tools select{padding:9px 15px;border-radius:var(--pill);font-size:12.5px;font-weight:700;
  color:var(--cream);background:var(--card);border:1px solid var(--edge);outline:none;cursor:pointer}
.shown{font-size:12px;color:var(--lilac-dim);white-space:nowrap}

/* ── grid ── */
.pgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(236px,1fr));
  gap:clamp(12px,1.5vw,20px);margin-top:clamp(20px,2.6vw,32px)}
.pc{position:relative;display:flex;flex-direction:column;overflow:hidden;border-radius:var(--r);
  border:1px solid var(--edge);background:rgba(255,255,255,.035);
  animation:pin .5s cubic-bezier(.2,.8,.2,1) both;
  transition:transform .35s cubic-bezier(.3,1.2,.4,1),box-shadow .35s,border-color .3s}
@keyframes pin{from{opacity:0;translate:0 16px}to{opacity:1;translate:0 0}}
.pc:hover{transform:translateY(-7px);border-color:var(--edge-2);
  box-shadow:0 32px 66px -32px rgba(32,112,192,.9)}
/* every tile shares one light studio ground, so white product JPEGs and
   brand plates read as the same object rather than two different treatments */
.pc .ph{position:relative;aspect-ratio:1;overflow:hidden;
  background:linear-gradient(180deg,#F4F8FA,#DCE6EC)}
/* direct child only — the plate's logo is nested deeper and must not inherit
   this padding, background or transform */
.pc .ph>img{position:absolute;inset:0;z-index:1;width:100%;height:100%;object-fit:contain;
  padding:13px;background:linear-gradient(180deg,#F4F8FA,#DCE6EC);
  transition:transform .6s cubic-bezier(.3,1.2,.4,1)}
.pc:hover .ph>img{transform:scale(1.07)}
.pc .off{position:absolute;top:12px;left:12px;z-index:3;padding:5px 12px;border-radius:var(--pill);
  font-size:10.5px;font-weight:800;letter-spacing:.08em;color:#F4F8FA;background:#12171B}
.pc>.bmark{position:absolute;top:13px;right:13px;z-index:4;width:auto;
  max-width:76px;object-fit:contain;filter:brightness(0);opacity:.34;transition:opacity .3s}
.pc:hover>.bmark{opacity:.62}

/* brand plate — shown when we have no product photograph yet */
.pc .plate{position:absolute;inset:0;z-index:0;display:flex;flex-direction:column;
  align-items:center;justify-content:center;gap:15px;padding:20px;text-align:center;
  background:radial-gradient(120% 96% at 50% 6%,rgba(0,120,180,.11),transparent 70%)}
.pc .plate::after{content:"";position:absolute;inset:13px;border-radius:var(--r-sm);
  border:1px dashed rgba(18,40,56,.2)}
/* height comes per logo from the aspect table in shop-data.js, not a flat cap,
   so a square mark carries the same optical weight as a long wordmark */
.pc .plate img{position:relative;max-width:88%;width:auto;
  filter:brightness(0);opacity:.6;
  transition:opacity .4s,transform .4s cubic-bezier(.3,1.2,.4,1)}
.pc:hover .plate img{opacity:.88;transform:scale(1.05)}
.pc .plate b{position:relative;font-family:var(--disp);font-size:21px;letter-spacing:-.025em;
  color:#20323E;transition:color .3s}
.pc:hover .plate b{color:#0E1113}
.pc .plate em{position:relative;font-style:normal;font-size:9.5px;font-weight:800;
  letter-spacing:.16em;color:rgba(30,56,72,.6)}
.pc .tx{display:flex;flex-direction:column;flex:1;gap:8px;padding:16px 17px 18px}
.pc .cat{font-size:10px;font-weight:800;letter-spacing:.14em;color:var(--lilac-dim)}
.pc h3{font-family:var(--sans);font-size:14.5px;font-weight:700;line-height:1.34;
  letter-spacing:-.005em;transition:color .3s}
.pc:hover h3{color:var(--flare)}
.pc .spec{flex:1;font-size:11.5px;line-height:1.55;color:var(--lilac-dim);
  display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.pc .pr{display:flex;align-items:baseline;gap:9px;flex-wrap:wrap;padding-top:4px}
.pc .pr b{font-size:16px;font-weight:800;color:var(--butter);font-variant-numeric:tabular-nums}
.pc .pr s{font-size:12px;color:var(--lilac-dim)}
.pc .pr em{font-style:normal;font-size:11.5px;font-weight:700;color:var(--jade)}
.pc .go{display:flex;align-items:center;gap:7px;margin-top:4px;font-size:11.5px;
  font-weight:800;letter-spacing:.08em;color:var(--flare);opacity:0;
  transform:translateY(5px);transition:.35s}
.pc:hover .go{opacity:1;transform:none}
.empty{grid-column:1/-1;padding:clamp(40px,7vw,90px) 20px;text-align:center;
  border-radius:var(--r);border:1px dashed var(--edge);color:var(--lilac-dim)}
.empty b{display:block;font-family:var(--disp);font-size:24px;color:var(--cream);margin-bottom:10px}

/* ── talk strip ── */
.talk{display:grid;grid-template-columns:1.1fr .9fr;gap:clamp(22px,3.4vw,52px);align-items:center;
  margin-top:clamp(38px,5vw,74px);padding:clamp(24px,3.6vw,48px);border-radius:var(--r-lg);
  border:1px solid var(--edge);
  background:linear-gradient(150deg,rgba(255,255,255,.08),rgba(255,255,255,.02))}
.talk h2{font-size:clamp(24px,3vw,38px)}
.talk p{color:var(--lilac);margin:14px 0 0;max-width:46ch}
.acts{display:flex;gap:11px;flex-wrap:wrap;margin-top:24px}
.btn{display:inline-flex;align-items:center;gap:9px;padding:14px 26px;border-radius:var(--pill);
  font-size:14px;font-weight:800;transition:transform .3s cubic-bezier(.3,1.3,.4,1),box-shadow .3s}
.btn.fill{color:#fff;background:linear-gradient(135deg,var(--flare),var(--orchid));
  box-shadow:0 18px 40px -20px rgba(0,160,224,.95)}
.btn.line{color:var(--cream);border:1px solid var(--edge-2)}
.btn:hover{transform:translateY(-3px)}
.talk .ph{position:relative;aspect-ratio:4/3;border-radius:var(--r);overflow:hidden;
  border:1px solid var(--edge);--mx:50%;--my:50%;--tx:0deg;--ty:0deg;perspective:1000px}
.talk .ph .pane{position:absolute;inset:0;transform:rotateX(var(--ty)) rotateY(var(--tx));
  transition:transform .5s cubic-bezier(.2,.8,.2,1)}
.talk .ph img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.talk .ph .gl{position:absolute;inset:0;opacity:0;transition:opacity .45s;mix-blend-mode:screen;
  background:radial-gradient(300px circle at var(--mx) var(--my),rgba(102,210,242,.3),transparent 66%)}
.talk .ph:hover .gl{opacity:1}

/* ── footer ── */
footer{border-top:1px solid var(--edge);margin-top:clamp(44px,6vw,86px);
  padding-block:clamp(38px,5vw,64px)}
.fgrid{display:grid;grid-template-columns:1.6fr repeat(3,1fr);gap:clamp(22px,3vw,44px)}
footer h5{font-family:var(--sans);font-size:11.5px;letter-spacing:.18em;color:var(--lilac-dim);
  font-weight:800;margin:0 0 16px}
footer ul{list-style:none;margin:0;padding:0;display:grid;gap:10px}
footer li a{font-size:13.5px;color:var(--lilac);transition:.25s}
footer li a:hover{color:var(--butter);padding-left:6px}
footer .blurb{font-size:13.5px;color:var(--lilac-dim);margin-top:16px;max-width:38ch}
footer .logo img{height:54px;width:auto}
.legal{margin-top:40px;padding-top:22px;border-top:1px solid var(--edge);display:flex;
  justify-content:space-between;gap:18px;flex-wrap:wrap;font-size:12.5px;color:var(--lilac-dim)}

/* ── contact page ── */
.cgrid{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(24px,4vw,56px);
  align-items:start;margin-top:clamp(20px,2.6vw,34px)}
.addr{font-family:var(--disp);font-size:clamp(20px,2.3vw,29px);line-height:1.34;letter-spacing:-.025em}
.calls{display:grid;gap:10px;margin-top:26px}
.call{display:flex;align-items:center;gap:14px;padding:15px 22px;border-radius:var(--pill);
  background:rgba(255,255,255,.05);border:1px solid var(--edge);font-weight:700;font-size:15px;
  transition:.3s cubic-bezier(.3,1.2,.4,1)}
.call:hover{background:rgba(102,210,242,.14);border-color:var(--butter);transform:translateX(7px)}
.call em{font-style:normal;font-size:12px;font-weight:600;color:var(--lilac-dim);margin-left:auto}
.info{display:grid;gap:12px;margin-top:8px}
.irow{display:grid;grid-template-columns:auto 1fr;gap:16px;padding:17px 20px;
  border-radius:var(--r-sm);background:rgba(255,255,255,.035);border:1px solid var(--edge)}
.irow span{font-size:10.5px;font-weight:800;letter-spacing:.14em;color:var(--lilac-dim);
  align-self:center;white-space:nowrap}
.irow b{font-weight:700;font-size:14.5px;line-height:1.5}
.hrs{display:grid;gap:9px;margin-top:8px}
.hrow{display:flex;justify-content:space-between;gap:16px;padding:12px 0;
  border-bottom:1px solid var(--edge);font-size:14px}
.hrow:last-child{border:0}
.hrow b{color:var(--butter);font-variant-numeric:tabular-nums}

.rev{opacity:0;transform:translateY(14px);transition:opacity .7s,transform .7s cubic-bezier(.3,1.1,.4,1)}
.rev.seen{opacity:1;transform:none}

@media (max-width:1080px){
  .chead,.talk,.cgrid{grid-template-columns:1fr}
  .chead .cnt{justify-self:start;text-align:left}
  .fgrid{grid-template-columns:1fr 1fr}
}
@media (max-width:620px){
  .pgrid{grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px}
  .pc .tx{padding:13px 13px 15px;gap:7px}
  .pc h3{font-size:13px}
  .brail{grid-template-columns:repeat(auto-fill,minmax(104px,1fr))}
  .btile{min-height:74px;padding:12px 10px}
  .btile img{max-height:38px}
  .fgrid{grid-template-columns:1fr}
  .mast .wrap{flex-wrap:wrap}
  .srch{order:3;flex-basis:100%}
  .mcall{display:none}
}
@media (hover:none){.talk .ph .gl{display:none}}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}


/* ───────── search ───────── */
.sbig{display:flex;gap:10px;margin-top:clamp(18px,2.2vw,26px);max-width:620px}
.sbig input{flex:1;min-width:0;padding:15px 20px;border-radius:var(--pill);
  border:1px solid var(--edge);background:rgba(255,255,255,.05);color:var(--cream);
  font:600 15px/1 var(--sans);transition:border-color .3s,background .3s}
.sbig input::placeholder{color:var(--lilac-dim)}
.sbig input:focus{outline:none;border-color:var(--flare);background:rgba(255,255,255,.08)}
.sbig button{padding:15px 26px;border-radius:var(--pill);border:none;
  font:800 12.5px/1 var(--sans);letter-spacing:.1em;color:#fff;
  background:linear-gradient(135deg,var(--flare),var(--orchid));
  transition:transform .3s cubic-bezier(.3,1.4,.4,1),box-shadow .3s}
.sbig button:hover{transform:translateY(-2px);box-shadow:0 14px 30px -12px rgba(0,160,224,.9)}
.sbrowse{margin-top:clamp(34px,4vw,54px);padding-top:clamp(26px,3vw,38px);
  border-top:1px solid var(--edge)}
.sbrowse h2{font-family:var(--sans);font-size:11px;font-weight:800;letter-spacing:.2em;
  color:var(--lilac-dim);margin-bottom:16px}
.srail{display:flex;flex-wrap:wrap;gap:10px}
.srail a{display:inline-flex;align-items:center;gap:9px;padding:11px 19px;
  border-radius:var(--pill);border:1px solid var(--edge);background:rgba(255,255,255,.04);
  font-size:13.5px;font-weight:700;color:var(--lilac);
  transition:transform .3s cubic-bezier(.3,1.4,.4,1),background .3s,color .3s,border-color .3s}
.srail a:hover{transform:translateY(-3px);color:#fff;background:rgba(255,255,255,.09);
  border-color:var(--edge-2)}
.srail a i{font-style:normal;font-size:11px;font-weight:800;color:var(--lilac-dim)}
.srail a:hover i{color:var(--butter)}

/* ───────── product detail ───────── */
.pdp{display:grid;grid-template-columns:minmax(0,1.04fr) minmax(0,1fr);
  gap:clamp(22px,3.4vw,54px);align-items:start;margin-top:clamp(18px,2.4vw,30px)}
.pdp-ph{perspective:1200px}
.pdp-ph .pane{position:relative;aspect-ratio:1;overflow:hidden;border-radius:var(--r-lg);
  border:1px solid var(--edge);background:linear-gradient(180deg,#F4F8FA,#DCE6EC);
  transform:rotateY(var(--tx,0deg)) rotateX(var(--ty,0deg));
  transition:transform .5s cubic-bezier(.2,.8,.2,1),box-shadow .5s}
.pdp-ph .pane:hover{box-shadow:0 44px 90px -40px rgba(32,112,192,.7)}
.pdp-ph .pane>img{position:absolute;inset:0;z-index:1;width:100%;height:100%;
  object-fit:contain;padding:clamp(20px,3vw,44px);
  background:linear-gradient(180deg,#F4F8FA,#DCE6EC)}
.pdp-ph .plate{position:absolute;inset:0;z-index:0;display:flex;flex-direction:column;
  align-items:center;justify-content:center;gap:16px;text-align:center;
  background:radial-gradient(120% 96% at 50% 6%,rgba(0,120,180,.11),transparent 70%)}
.pdp-ph .plate img{filter:brightness(0);opacity:.6;max-width:70%;width:auto}
.pdp-ph .plate b{font-family:var(--disp);font-size:28px;color:#20323E}
.pdp-ph .plate em{font-style:normal;font-size:10px;font-weight:800;letter-spacing:.16em;
  color:rgba(30,56,72,.6)}
.pdp-ph .off{position:absolute;top:16px;left:16px;z-index:3;padding:6px 14px;
  border-radius:var(--pill);font-size:11px;font-weight:800;letter-spacing:.08em;
  color:#F4F8FA;background:#12171B}
.pdp-ph .gl{position:absolute;inset:0;z-index:2;pointer-events:none;border-radius:var(--r-lg);
  background:radial-gradient(38% 30% at var(--mx,50%) var(--my,50%),
    rgba(255,255,255,.5),transparent 70%);opacity:0;transition:opacity .4s;mix-blend-mode:overlay}
.pdp-ph .pane:hover .gl{opacity:1}
.pdp-tx .blogo{display:block;width:auto;filter:brightness(0) invert(1);opacity:.62;
  margin-bottom:18px}
.pdp-tx>.cat{display:inline-block;margin-bottom:14px;font-size:10.5px;font-weight:800;
  letter-spacing:.18em;color:var(--butter)}
.pdp-tx h1{font-size:clamp(25px,3.1vw,40px);letter-spacing:-.035em;line-height:1.08;
  text-wrap:pretty}
.pdp-tx .spec{margin-top:15px;font-size:clamp(14px,1.1vw,16px);line-height:1.62;
  color:var(--lilac);max-width:52ch}
.pdp-pr{display:flex;align-items:baseline;flex-wrap:wrap;gap:12px;
  margin-top:clamp(20px,2.4vw,28px);padding-bottom:clamp(20px,2.4vw,28px);
  border-bottom:1px solid var(--edge)}
.pdp-pr b{font-family:var(--disp);font-size:clamp(30px,3.4vw,44px);letter-spacing:-.03em;
  color:var(--butter);font-variant-numeric:tabular-nums}
.pdp-pr s{font-size:17px;color:var(--lilac-dim)}
.pdp-pr span{font-size:12px;color:var(--lilac-dim)}
.facts{display:grid;grid-template-columns:auto 1fr;gap:1px 20px;
  margin-top:clamp(18px,2.2vw,26px)}
.facts dt{padding:9px 0;font-size:11px;font-weight:800;letter-spacing:.12em;
  color:var(--lilac-dim);border-bottom:1px solid rgba(120,200,235,.08)}
.facts dd{padding:9px 0;font-size:14px;font-weight:600;color:var(--cream);
  border-bottom:1px solid rgba(120,200,235,.08);font-variant-numeric:tabular-nums}
.pdp-tx .acts{display:flex;flex-wrap:wrap;gap:11px;margin-top:clamp(22px,2.6vw,30px)}
.pdp-note{margin-top:18px;font-size:12.5px;line-height:1.7;color:var(--lilac-dim);max-width:54ch}
.pdp-note a{color:var(--butter)}
#rel:not(:empty){margin-top:clamp(46px,5.4vw,80px);padding-top:clamp(28px,3.2vw,44px);
  border-top:1px solid var(--edge)}
#rel .head{display:flex;align-items:baseline;justify-content:space-between;gap:18px;
  flex-wrap:wrap;margin-bottom:clamp(18px,2.2vw,26px)}
#rel h2{font-size:clamp(20px,2.3vw,30px);letter-spacing:-.03em}
@media(max-width:820px){
  .pdp{grid-template-columns:1fr;gap:24px}
  .pdp-ph .pane{transform:none}
}
@media(max-width:600px){
  .sbig{flex-direction:column}
  .sbig button{padding:14px 20px}
}

.sscope:not(:empty){display:flex;flex-wrap:wrap;gap:10px;align-items:baseline;
  margin-top:13px;font-size:12.5px;color:var(--lilac-dim)}
.sscope b{color:var(--cream)}
.sscope a{color:var(--butter);font-weight:700}

/* ───────── wishlist ───────── */
.wish{position:absolute;bottom:12px;right:12px;z-index:5;
  display:grid;place-items:center;width:38px;height:38px;border-radius:50%;
  background:rgba(12,18,24,.62);backdrop-filter:blur(7px);
  border:1px solid var(--edge);color:var(--lilac);cursor:pointer;
  opacity:0;transform:translateY(5px);
  transition:opacity .22s,transform .22s,color .22s,border-color .22s,background .22s}
.pc:hover .wish,.wish:focus-visible,.wish.on{opacity:1;transform:none}
.wish svg{width:19px;height:19px;transition:fill .22s}
.wish:hover{color:var(--butter);border-color:var(--edge-2);background:rgba(12,18,24,.85)}
.wish.on{color:#FF5C7A;border-color:rgba(255,92,122,.45)}
.wish.on svg{fill:currentColor}
.wish:focus-visible{outline:2px solid var(--butter);outline-offset:2px}
/* touch devices have no hover, so the heart is always visible there */
@media (hover:none){ .wish{opacity:1;transform:none} }

/* bigger variant on the product page, sits beside the buttons */
.wish.wbig{position:static;width:46px;height:46px;border-radius:var(--pill);
  opacity:1;transform:none;flex:0 0 auto}
.wish.wbig svg{width:22px;height:22px}

.util .wcount{font-style:normal;margin-left:6px;padding:1px 7px;border-radius:var(--pill);
  background:var(--butter);color:#06131C;font-size:11px;font-weight:800;line-height:1.5}

.wishbar{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;
  gap:18px;margin:0 0 26px;padding:20px 24px;border-radius:var(--r);
  border:1px solid var(--edge);background:rgba(120,200,235,.05)}
.wishbar .wtot{font-family:'Bricolage Grotesque',system-ui,sans-serif;
  font-size:27px;font-weight:800;color:var(--cream);line-height:1.15}
.wishbar .wtot span{display:block;font-family:'Manrope',system-ui,sans-serif;
  font-size:12.5px;font-weight:600;letter-spacing:.05em;color:var(--lilac-dim);
  text-transform:uppercase;margin-top:5px}
.wishbar .acts{display:flex;flex-wrap:wrap;gap:11px}
@media (max-width:620px){
  .wishbar{padding:17px 18px}
  .wishbar .acts{width:100%}
  .wishbar .acts .btn{flex:1 1 auto;text-align:center}
}

/* ───────── product description + spec sheet (from shop-info.js) ───────── */
.pinfo{display:grid;grid-template-columns:minmax(0,1.04fr) minmax(0,1fr);
  gap:clamp(22px,3.4vw,54px);align-items:start;
  margin-top:clamp(46px,5.4vw,80px);padding-top:clamp(28px,3.2vw,44px);
  border-top:1px solid var(--edge)}
.pinfo h2{font-size:clamp(20px,2.3vw,30px);letter-spacing:-.03em}
.pinfo-about p{margin-top:15px;font-size:clamp(14px,1.1vw,16px);line-height:1.7;
  color:var(--lilac);max-width:62ch}
.pinfo-specs .facts{margin-top:14px}
.pinfo-specs .facts dd{overflow-wrap:anywhere}
.pinfo-src{margin-top:14px;font-size:12px;line-height:1.6;color:var(--lilac-dim)}
@media(max-width:820px){
  .pinfo{grid-template-columns:1fr;gap:30px}
}