/* ═══════════════════════════════════════════════════════════════
   EUROPE PEPTIDES: shop, pens and bundles pages. Loaded after ep.css.
   Builds on ep.css tokens (--ep-*, --c-* and --w-*). Upright type only.
   ═══════════════════════════════════════════════════════════════ */

/* shared.css sets overflow-x:hidden on html and body, which breaks position:sticky
   (header and filter bar). clip hides sideways overflow without creating a scroll box. */

/* ── Page intro ── */
.sp-hero{ padding:clamp(34px,5vw,64px) 0 clamp(18px,2.6vw,30px); }
.sp-hero-row{ display:flex; align-items:flex-end; justify-content:space-between; gap:28px; flex-wrap:wrap; }
.sp-chips{ display:flex; gap:8px; flex-wrap:wrap; margin-bottom:22px; }
.sp-chips .ep-chip b{ font-weight:650; }
.sp-title{ font:620 clamp(42px,6.2vw,80px)/.96 var(--ep-font); letter-spacing:-.05em; color:var(--ep-ink); }
.sp-title .accent{ color:var(--c-longevity); }
.sp-title .accent-graphite{ color:#8A8A8A; }
.sp-lede{ font:400 clamp(16px,1.4vw,18px)/1.55 var(--ep-font); color:var(--ep-muted); max-width:560px; margin-top:18px; }
.sp-hero-cta{ display:flex; gap:10px; flex-wrap:wrap; }

/* ── Format cards (Vials / Pens / Cartridges / Nasal sprays) ── */
.sp-formats{ display:grid; grid-template-columns:repeat(4,1fr); gap:16px; margin-top:clamp(24px,3vw,36px); }
.sp-format{ position:relative; display:grid; grid-template-columns:1fr 46%; min-height:210px; border-radius:var(--ep-r-xl); background:var(--w); overflow:hidden;
  text-decoration:none; color:var(--ep-ink); border:0; padding:0; text-align:left; cursor:pointer; font:inherit; transition:transform .25s ease, box-shadow .25s ease; }
.sp-format:hover{ transform:translateY(-3px); box-shadow:0 18px 40px -18px rgba(22,22,22,.25); }
.sp-format-text{ display:flex; flex-direction:column; justify-content:space-between; padding:24px 0 24px 26px; }
.sp-format-count{ font:500 12.5px/1 var(--ep-mono); color:var(--ep-ink); opacity:.55; margin-bottom:12px; }
.sp-format-name{ display:block; font:620 clamp(24px,2.3vw,30px)/1.05 var(--ep-font); letter-spacing:-.035em; }
.sp-format-name span{ color:var(--c); }
.sp-format-sub{ font:400 14px/1.4 var(--ep-font); color:var(--ep-muted); margin-top:6px; }
.sp-format-go{ width:40px; height:40px; border-radius:50%; background:var(--ep-ink); color:#fff; display:grid; place-items:center; margin-top:16px; transition:transform .2s ease; }
.sp-format:hover .sp-format-go{ transform:rotate(-45deg); }
.sp-format-go svg{ width:17px; height:17px; }
.sp-format-img{ position:relative; }
.sp-format-img img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; mix-blend-mode:multiply; filter:brightness(1.05); }
.sp-format.is-on{ box-shadow:inset 0 0 0 2px var(--ep-ink); }

/* ── Sticky filter bar ── */
.sp-bar{ position:sticky; top:78px; z-index:60; background:rgba(255,255,255,.93); -webkit-backdrop-filter:saturate(1.4) blur(14px); backdrop-filter:saturate(1.4) blur(14px);
  border-bottom:1px solid var(--ep-line); margin-top:clamp(26px,3.4vw,40px); }
.sp-bar-row{ display:flex; align-items:center; gap:10px; padding-top:14px; }
.sp-search{ position:relative; flex:1 1 260px; max-width:340px; }
.sp-search svg{ position:absolute; left:16px; top:50%; transform:translateY(-50%); width:18px; height:18px; color:var(--ep-faint); pointer-events:none; }
.sp-search input{ width:100%; height:46px; padding:0 16px 0 44px; border-radius:var(--ep-pill); border:1px solid transparent; background:var(--ep-stone);
  font:400 15px var(--ep-font); color:var(--ep-ink); outline:none; transition:border-color .15s ease, background .15s ease; }
.sp-search input:focus{ background:#fff; border-color:var(--ep-ink); }
.sp-search input::placeholder{ color:var(--ep-faint); }
.sp-seg{ display:inline-flex; gap:2px; padding:4px; border-radius:var(--ep-pill); background:var(--ep-stone); }
.sp-seg button{ height:38px; padding:0 15px; border-radius:var(--ep-pill); border:0; background:transparent; font:500 14px/1 var(--ep-font); color:var(--ep-muted); cursor:pointer; white-space:nowrap; transition:background .15s ease, color .15s ease; }
.sp-seg button:hover{ color:var(--ep-ink); }
.sp-seg button.on{ background:#fff; color:var(--ep-ink); box-shadow:0 1px 3px rgba(22,22,22,.1); }
.sp-seg button small{ font:500 11.5px var(--ep-mono); opacity:.5; margin-left:5px; }
/* Five format buttons: keep them tight (counts sit on the format cards above) so the search box keeps its width. */
.sp-bar-row .sp-seg button{ padding:0 12px; }
.sp-bar-row .sp-seg button small{ display:none; }
.sp-select{ position:relative; }
.sp-select select{ height:46px; padding:0 38px 0 16px; border-radius:var(--ep-pill); border:1px solid var(--ep-line); background:#fff; font:500 14px var(--ep-font); color:var(--ep-ink);
  -webkit-appearance:none; appearance:none; cursor:pointer; outline:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='11' height='11' viewBox='0 0 24 24' fill='none' stroke='%23161616' stroke-width='3' stroke-linecap='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
  background-repeat:no-repeat; background-position:right 15px center; }
.sp-select select:hover, .sp-select select:focus{ border-color:var(--ep-ink); }
.sp-count{ margin-left:auto; font:500 13px/1 var(--ep-mono); color:var(--ep-muted); white-space:nowrap; }
.sp-filter-btn{ display:none; }
.sp-areas{ display:flex; gap:8px; overflow-x:auto; padding:12px 0 14px; scrollbar-width:none; -webkit-mask-image:linear-gradient(90deg,#000 92%,transparent); mask-image:linear-gradient(90deg,#000 92%,transparent); }
.sp-areas::-webkit-scrollbar{ display:none; }
.sp-area-btn{ flex:none; display:inline-flex; align-items:center; gap:8px; height:38px; padding:0 15px 0 13px; border-radius:var(--ep-pill); border:1px solid var(--ep-line); background:#fff;
  font:500 14px/1 var(--ep-font); color:var(--ep-ink); cursor:pointer; text-decoration:none; white-space:nowrap; transition:background .15s ease, border-color .15s ease; }
.sp-area-btn i{ width:9px; height:9px; border-radius:50%; background:var(--c, var(--ep-ink)); flex:none; }
.sp-area-btn small{ font:500 11.5px var(--ep-mono); color:var(--ep-faint); }
.sp-area-btn:hover{ border-color:var(--c, var(--ep-ink)); }
.sp-area-btn.on{ background:var(--w, var(--ep-ink)); border-color:var(--c, var(--ep-ink)); }
.sp-area-btn.is-all.on{ background:var(--ep-ink); color:#fff; border-color:var(--ep-ink); }
.sp-area-btn.is-all.on small{ color:rgba(255,255,255,.6); }
.sp-area-btn[disabled]{ opacity:.4; cursor:default; }
.sp-area-btn.is-link::after{ content:'\2197'; color:var(--ep-faint); margin-left:-2px; }

/* ── Product grid + cards ── */
.sp-results{ padding:clamp(22px,3vw,34px) 0 clamp(60px,8vw,110px); scroll-margin-top:170px; }
.sp-grid{ display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:18px; }
.sp-card{ position:relative; display:flex; flex-direction:column; background:var(--ep-stone); border-radius:var(--ep-r-lg); padding:9px; min-width:0;
  transition:transform .25s ease, box-shadow .25s ease; animation:spIn .55s cubic-bezier(.2,.8,.2,1) both; animation-delay:calc(min(var(--i,0),12) * 45ms); }
.sp-card.no-anim{ animation:none; }
@keyframes spIn{ from{ opacity:0; transform:translateY(16px); } to{ opacity:1; transform:none; } }
.sp-card:hover{ transform:translateY(-4px); box-shadow:0 22px 44px -22px rgba(22,22,22,.28); }
/* Plain white behind product photos so their true colours show (no area tint). */
.sp-media{ position:relative; display:block; aspect-ratio:1/1; border-radius:18px; overflow:hidden; background:#fff; }
.sp-media img{ width:100%; height:100%; object-fit:cover; mix-blend-mode:multiply; filter:brightness(1.05); transition:transform .5s cubic-bezier(.2,.8,.2,1), filter .3s ease; }
.sp-card:hover .sp-media img{ transform:scale(1.045); }
.sp-badge{ position:absolute; top:11px; left:11px; display:inline-flex; align-items:center; gap:6px; height:28px; padding:0 11px; border-radius:var(--ep-pill); background:#fff;
  font:600 12px/1 var(--ep-font); color:var(--ep-ink); box-shadow:0 1px 2px rgba(0,0,0,.06); }
.sp-badge i{ width:7px; height:7px; border-radius:50%; background:var(--c); }
.sp-badge-new{ background:var(--ep-lime); }
.sp-badge-oos{ background:var(--ep-ink); color:#fff; }
.sp-area{ position:absolute; left:11px; bottom:11px; display:inline-flex; align-items:center; gap:6px; height:26px; padding:0 10px; border-radius:var(--ep-pill);
  background:rgba(255,255,255,.78); -webkit-backdrop-filter:blur(6px); backdrop-filter:blur(6px); font:500 11.5px/1 var(--ep-font); color:var(--ep-ink); }
.sp-area i{ width:7px; height:7px; border-radius:50%; background:var(--c); }
.sp-body{ display:flex; flex-direction:column; flex:1; padding:14px 9px 7px; }
.sp-brand{ font:500 11px/1 var(--ep-mono); letter-spacing:.04em; text-transform:uppercase; color:var(--ep-faint); }
.sp-name{ font:620 19px/1.18 var(--ep-font); letter-spacing:-.025em; margin-top:7px; }
.sp-name a{ color:var(--ep-ink); text-decoration:none; }
.sp-name a:hover{ text-decoration:underline; text-underline-offset:3px; }
.sp-sub{ font:400 13.5px/1.3 var(--ep-font); color:var(--ep-muted); margin-top:5px; }
.sp-sizes{ display:flex; flex-wrap:wrap; gap:6px; margin-top:12px; }
.sp-size{ height:32px; padding:0 12px; border-radius:var(--ep-pill); border:1px solid var(--ep-line); background:#fff; font:500 13px/1 var(--ep-mono); color:var(--ep-ink); cursor:pointer; transition:all .15s ease; }
.sp-size:hover{ border-color:var(--ep-ink); }
.sp-size.on{ background:var(--ep-ink); border-color:var(--ep-ink); color:#fff; }
.sp-size.is-oos{ text-decoration:line-through; color:var(--ep-faint); }
.sp-size.on.is-oos{ color:rgba(255,255,255,.65); }
.sp-buy{ display:flex; align-items:center; justify-content:space-between; gap:10px; margin-top:auto; padding-top:16px; }
.sp-price{ font:650 22px/1 var(--ep-font); letter-spacing:-.03em; color:var(--ep-ink); font-variant-numeric:tabular-nums; }
.sp-stock{ display:inline-flex; align-items:center; gap:6px; font:500 12.5px/1 var(--ep-font); color:#13723C; white-space:nowrap; }
.sp-stock i{ width:7px; height:7px; border-radius:50%; background:var(--ep-ok); box-shadow:0 0 0 3px rgba(31,157,85,.15); }
.sp-stock.out{ color:var(--ep-muted); }
.sp-stock.out i{ background:var(--ep-faint); box-shadow:none; }
.sp-actions{ display:flex; gap:8px; margin-top:14px; }
.sp-actions .ep-btn{ height:44px; padding:0 14px; font-size:14px; }
.sp-add{ flex:1; }
.sp-add[disabled]{ background:#D9D6CF; color:#6A6A6A; cursor:not-allowed; box-shadow:none; }
.sp-add.is-added{ background:var(--ep-ink); color:#fff; }
.sp-card.is-oos .sp-media img{ filter:grayscale(.85); opacity:.75; }

.sp-empty{ grid-column:1/-1; text-align:center; padding:70px 20px; border-radius:var(--ep-r-xl); background:var(--ep-stone); }
.sp-empty h3{ font:620 24px/1.2 var(--ep-font); letter-spacing:-.03em; }
.sp-empty p{ font:400 15px/1.5 var(--ep-font); color:var(--ep-muted); margin:8px 0 22px; }

/* ── Mobile filter sheet ── */
.sp-sheet-overlay{ position:fixed; inset:0; z-index:1100; background:rgba(22,22,22,.35); opacity:0; visibility:hidden; transition:opacity .25s ease, visibility .25s; }
.sp-sheet{ position:fixed; left:0; right:0; bottom:0; z-index:1101; background:#fff; border-radius:28px 28px 0 0; padding:10px 20px calc(20px + env(safe-area-inset-bottom));
  transform:translateY(100%); transition:transform .32s cubic-bezier(.2,.8,.2,1); max-height:86vh; overflow-y:auto; }
.sp-sheet.open{ transform:none; box-shadow:0 -30px 80px rgba(0,0,0,.18); }
.sp-sheet-overlay.open{ opacity:1; visibility:visible; }
.sp-sheet-grip{ width:44px; height:5px; border-radius:5px; background:var(--ep-line); margin:4px auto 14px; }
.sp-sheet h3{ font:620 22px/1 var(--ep-font); letter-spacing:-.03em; margin-bottom:6px; }
.sp-sheet-label{ font:500 12px/1 var(--ep-mono); letter-spacing:.05em; text-transform:uppercase; color:var(--ep-faint); margin:20px 0 10px; }
.sp-sheet .sp-seg{ display:flex; flex-wrap:wrap; border-radius:20px; }
.sp-sheet .sp-seg button{ flex:1 1 40%; }
.sp-sheet .sp-select select{ width:100%; }
.sp-sheet-actions{ display:flex; gap:10px; margin-top:24px; }
.sp-sheet-actions .ep-btn{ flex:1; }

/* ── Help + promise strip ── */
.sp-promise{ display:grid; grid-template-columns:repeat(4,1fr); gap:14px; }
.sp-promise > div{ border-radius:var(--ep-r-lg); background:var(--ep-stone); padding:24px; }
.sp-promise svg{ width:24px; height:24px; color:var(--ep-ink); }
.sp-promise b{ display:block; font:620 17px/1.25 var(--ep-font); letter-spacing:-.02em; margin-top:16px; }
.sp-promise p{ font:400 14px/1.5 var(--ep-font); color:var(--ep-muted); margin-top:6px; }
.sp-help{ position:relative; overflow:hidden; border-radius:var(--ep-r-xl); background:var(--w-longevity); padding:clamp(30px,5vw,60px); margin-top:clamp(40px,6vw,72px);
  display:flex; align-items:center; justify-content:space-between; gap:30px; flex-wrap:wrap; }
.sp-help::before{ content:''; position:absolute; right:-120px; top:-160px; width:440px; height:440px; border-radius:50%;
  background:repeating-conic-gradient(from 0deg, rgba(155,135,230,.22) 0deg 1.2deg, transparent 1.2deg 6deg); -webkit-mask-image:radial-gradient(circle, #000 30%, transparent 70%); mask-image:radial-gradient(circle, #000 30%, transparent 70%); }
.sp-help h2{ position:relative; font:620 clamp(28px,3.6vw,44px)/1.02 var(--ep-font); letter-spacing:-.045em; }
.sp-help h2 span{ color:var(--c-longevity); }
.sp-help p{ position:relative; font:400 16px/1.55 var(--ep-font); color:var(--ep-muted); margin-top:12px; max-width:520px; }
.sp-help .sp-hero-cta{ position:relative; }
.sp-section{ padding:clamp(54px,7vw,96px) 0 0; }
.sp-section:last-of-type{ padding-bottom:clamp(60px,8vw,110px); }
.sp-h2{ font:620 clamp(30px,3.8vw,48px)/1.02 var(--ep-font); letter-spacing:-.045em; margin-bottom:clamp(22px,3vw,34px); }
.sp-h2 span{ color:var(--ep-faint); }

/* ── Bundles ── */
.bd-grid{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; }
.bd-card{ display:flex; flex-direction:column; background:var(--ep-stone); border-radius:var(--ep-r-xl); padding:12px; animation:spIn .55s cubic-bezier(.2,.8,.2,1) both; animation-delay:calc(var(--i,0) * 70ms); }
.bd-trio{ position:relative; display:grid; grid-template-columns:repeat(3,1fr); gap:8px; }
.bd-trio a{ display:block; aspect-ratio:1/1.12; border-radius:18px; overflow:hidden; background:#fff; }
.bd-trio img{ width:100%; height:100%; object-fit:cover; mix-blend-mode:multiply; filter:brightness(1.05); transition:transform .5s cubic-bezier(.2,.8,.2,1); }
.bd-trio a:hover img{ transform:scale(1.05); }
.bd-save{ position:absolute; top:12px; left:12px; height:30px; padding:0 13px; border-radius:var(--ep-pill); background:var(--ep-lime); font:650 13px/30px var(--ep-font); color:var(--ep-ink); }
.bd-body{ display:flex; flex-direction:column; flex:1; padding:20px 14px 10px; }
.bd-name{ font:620 clamp(26px,2.6vw,32px)/1.02 var(--ep-font); letter-spacing:-.04em; }
.bd-tag{ font:400 15px/1.5 var(--ep-font); color:var(--ep-muted); margin-top:8px; }
.bd-items{ list-style:none; margin-top:18px; border-top:1px solid var(--ep-line); }
.bd-items li a{ display:flex; align-items:center; gap:12px; padding:12px 2px; border-bottom:1px solid var(--ep-line); text-decoration:none; color:var(--ep-ink); }
.bd-items li a:hover .bd-iname{ text-decoration:underline; text-underline-offset:3px; }
.bd-items i{ width:9px; height:9px; border-radius:50%; background:var(--c); flex:none; }
.bd-iname{ font:550 15px/1.2 var(--ep-font); flex:1; }
.bd-idose{ font:500 12.5px/1 var(--ep-mono); color:var(--ep-faint); }
.bd-iprice{ font:500 14px/1 var(--ep-font); color:var(--ep-muted); min-width:64px; text-align:right; font-variant-numeric:tabular-nums; }
.bd-foot{ display:flex; align-items:flex-end; justify-content:space-between; gap:16px; flex-wrap:wrap; margin-top:auto; padding-top:22px; }
.bd-was{ font:400 14px/1 var(--ep-font); color:var(--ep-faint); }
.bd-was s{ text-decoration-thickness:1.5px; }
.bd-now{ font:650 32px/1 var(--ep-font); letter-spacing:-.04em; margin-top:8px; font-variant-numeric:tabular-nums; }
.bd-foot .ep-btn{ min-width:200px; }
.bd-card.is-oos .bd-trio img{ filter:grayscale(.85); opacity:.75; }
.bd-note{ text-align:center; font:400 14px/1.5 var(--ep-font); color:var(--ep-muted); margin-top:26px; }

/* ── Pens hero (dark graphite panel with frosted cards) ── */
.pn-panel{ position:relative; overflow:hidden; border-radius:var(--ep-r-xl); background:#232323; color:#fff; display:grid; grid-template-columns:1.05fr 1fr; min-height:clamp(440px,44vw,560px); }
.pn-panel::before{ content:''; position:absolute; left:58%; top:50%; width:900px; height:900px; transform:translate(-50%,-50%); border-radius:50%;
  background:repeating-conic-gradient(from 0deg, rgba(255,255,255,.07) 0deg 1deg, transparent 1deg 5deg); -webkit-mask-image:radial-gradient(circle, #000 18%, transparent 62%); mask-image:radial-gradient(circle, #000 18%, transparent 62%); }
.pn-copy{ position:relative; padding:clamp(30px,4.6vw,60px); display:flex; flex-direction:column; justify-content:center; z-index:1; }
.pn-copy .ep-chip{ background:rgba(255,255,255,.1); color:#fff; align-self:flex-start; }
.pn-copy .ep-chip .dot{ background:var(--ep-lime); }
.pn-copy h1{ font:620 clamp(42px,5.6vw,74px)/.96 var(--ep-font); letter-spacing:-.05em; margin-top:22px; }
.pn-copy h1 span{ color:var(--ep-lime); }
.pn-copy p{ font:400 17px/1.55 var(--ep-font); color:rgba(255,255,255,.72); max-width:440px; margin-top:18px; }
.pn-copy .sp-hero-cta{ margin-top:28px; }
.pn-copy .ep-btn-light{ background:transparent; color:#fff; border-color:rgba(255,255,255,.3); }
.pn-copy .ep-btn-light:hover{ border-color:#fff; }
.pn-photo{ position:relative; margin:14px; border-radius:24px; overflow:hidden; z-index:1; }
.pn-photo img{ width:100%; height:100%; object-fit:cover; object-position:50% 50%; }
.pn-facts{ position:relative; z-index:2; display:grid; grid-template-columns:repeat(4,1fr); gap:0; margin:-74px clamp(14px,3vw,40px) 0; border-radius:24px; overflow:hidden;
  background:rgba(255,255,255,.94); -webkit-backdrop-filter:blur(18px) saturate(1.4); backdrop-filter:blur(18px) saturate(1.4); border:1px solid rgba(255,255,255,.6); box-shadow:0 20px 50px -20px rgba(0,0,0,.35); }
.pn-facts div{ padding:22px 22px 24px; }
.pn-facts div + div{ border-left:1px solid rgba(22,22,22,.08); }
.pn-facts svg{ width:22px; height:22px; color:var(--ep-ink); }
.pn-facts b{ display:block; font:620 17px/1.2 var(--ep-font); letter-spacing:-.02em; margin-top:12px; color:var(--ep-ink); }
.pn-facts span{ display:block; font:400 13.5px/1.45 var(--ep-font); color:var(--ep-muted); margin-top:4px; }
.pn-areas{ margin-top:clamp(40px,5vw,64px); }

/* ── Toast (shared.js #toast) in the new style ── */
.toast{ background:var(--ep-ink) !important; color:#fff !important; border-radius:var(--ep-pill) !important; font:500 14.5px/1.3 var(--ep-font) !important; padding:14px 22px !important; border:0 !important; box-shadow:0 18px 40px rgba(0,0,0,.22) !important; }
.toast-check{ background:var(--ep-lime) !important; color:var(--ep-ink) !important; }

/* ── Responsive ── */
@media (max-width:1200px){ .sp-grid{ grid-template-columns:repeat(3,minmax(0,1fr)); } }
@media (max-width:980px){
  .sp-bar{ top:68px; }
  .sp-bar-row .sp-seg, .sp-bar-row .sp-select{ display:none; }
  .sp-filter-btn{ display:inline-flex; align-items:center; gap:8px; height:46px; padding:0 16px; border-radius:var(--ep-pill); border:1px solid var(--ep-line); background:#fff;
    font:600 14px/1 var(--ep-font); color:var(--ep-ink); cursor:pointer; flex:none; }
  .sp-filter-btn svg{ width:17px; height:17px; }
  .sp-filter-btn b{ min-width:20px; height:20px; border-radius:10px; background:var(--ep-ink); color:#fff; font:700 11px/20px var(--ep-font); text-align:center; display:none; }
  .sp-filter-btn.has b{ display:inline-block; }
  .sp-search{ max-width:none; }
  .sp-count{ display:none; }
  .sp-formats{ grid-template-columns:1fr; gap:12px; }
  .sp-format{ min-height:150px; grid-template-columns:1fr 40%; }
  .sp-format-text{ padding:20px 0 20px 22px; }
  .sp-format-go{ margin-top:10px; width:36px; height:36px; }
  .sp-promise{ grid-template-columns:1fr 1fr; }
  .bd-grid{ grid-template-columns:1fr; }
  .pn-panel{ grid-template-columns:1fr; }
  .pn-photo{ height:300px; margin:0 14px 14px; }
  .pn-facts{ grid-template-columns:1fr 1fr; margin-top:-40px; }
  .pn-facts div:nth-child(3){ border-left:0; }
  .pn-facts div:nth-child(n+3){ border-top:1px solid rgba(22,22,22,.08); }
}
@media (max-width:760px){ .sp-grid{ grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; } }
@media (max-width:640px){
  .sp-chips{ flex-wrap:nowrap; overflow-x:auto; scrollbar-width:none; margin-right:calc(-1 * var(--ep-gutter)); padding-right:var(--ep-gutter); }
  .sp-chips::-webkit-scrollbar{ display:none; }
  .sp-chips .ep-chip{ flex:none; }
  .sp-card{ padding:6px; border-radius:20px; }
  .sp-media{ border-radius:15px; }
  .sp-area{ display:none; }
  .sp-badge{ top:8px; left:8px; height:24px; padding:0 9px; font-size:11px; }
  .sp-body{ padding:11px 6px 5px; }
  .sp-name{ font-size:16px; }
  .sp-sub{ font-size:12.5px; }
  .sp-size{ height:30px; padding:0 9px; font-size:12px; }
  .sp-buy{ flex-direction:column; align-items:flex-start; gap:6px; padding-top:12px; }
  .sp-price{ font-size:19px; }
  .sp-stock{ font-size:11.5px; }
  .sp-actions{ margin-top:10px; }
  .sp-actions .ep-btn{ height:40px; font-size:13.5px; }
  .sp-more{ display:none !important; }
  .sp-title{ font-size:clamp(40px,12vw,56px); }
  .sp-promise{ grid-template-columns:1fr; }
  .bd-trio a{ border-radius:14px; }
  .bd-iprice{ min-width:auto; }
  .bd-foot .ep-btn{ width:100%; }
  .pn-photo{ height:240px; }
  .pn-facts div{ padding:16px; }
  .pn-facts b{ font-size:15px; }
  .pn-facts span{ font-size:12.5px; }
}
@media (prefers-reduced-motion:reduce){
  .sp-card, .bd-card{ animation:none; }
  .sp-card, .sp-media img, .sp-format{ transition:none; }
}
