/* JAKO Story Lookbook — scoped styles only (.jsl) */
.jsl{
  --jsl-bg:#f5f1e8;
  --jsl-surface:#fff;
  --jsl-primary:#008acc;
  --jsl-btn-bg: var(--jsl-primary);
  --jsl-btn-text:#ffffff;
  --jsl-btn-soft-bg: rgba(0,0,0,.06);
  --jsl-btn-soft-bg-hover: rgba(0,0,0,.10);
  --jsl-btn-outline-border: rgba(0,0,0,.14);
  --jsl-btn-outline-text: var(--jsl-btn-text);

  --jsl-logo-h:34px;

  /* Header / footer / sticky colors (overridable via preset) */
  --jsl-header-bg: rgba(255,255,255,0.85);
  --jsl-footer-bg: rgba(255,255,255,0.85);
  --jsl-chips-bg: rgba(255,255,255,0.72);
  --jsl-chip-bg: rgba(0,0,0,.06);
  --jsl-chip-bg-hover: rgba(0,0,0,.10);
  --jsl-chip-text: var(--jsl-ink);

  /* Product card buttons (overridable via preset) */
  --jsl-prod-btn-bg: var(--jsl-btn-soft-bg);
  --jsl-prod-btn-text: var(--jsl-btn-bg);
  --jsl-prod-btn-bg-hover: var(--jsl-btn-soft-bg-hover);
  --jsl-prod-btn-text-hover: var(--jsl-prod-btn-text);
  --jsl-prod-btn-radius: 14px;
  --jsl-prod-btn-border: transparent;
  --jsl-prod-btn-border-hover: var(--jsl-prod-btn-border);
  --jsl-prod-btn-border-w: 0px;

  --jsl-story-bg: #ffffff;
  --jsl-story-img-bg: #f2f2f2;
  --jsl-radius:18px;
  --jsl-cols:4;
  --jsl-cols-t:2;
  --jsl-cols-m:2;
  --jsl-ratio:4/5;

  --jsl-max:1180px;
  --jsl-pad-y:28px;
  --jsl-pad-x:18px;
  --jsl-pad-x-m: var(--jsl-pad-x);

  --jsl-marg-y:0px;
  --jsl-marg-x:0px;
  --jsl-ink:#111111;
  --jsl-muted:#666666;
  --jsl-gap:14px;

  /* Vertical spacing between blocks */
  --jsl-vgap:18px;
  --jsl-vgap-tight:14px;
  --jsl-vgap-m:16px;
  --jsl-vgap-m-tight:12px;

  /* Granular spacing */
  --jsl-gap-ch-tiles:14px;
  --jsl-gap-ch-tiles-m:12px;
  --jsl-gap-tiles-prod:18px;
  --jsl-gap-tiles-prod-m:16px;

  --jsl-shadow-a:.12;
  --jsl-shadow-b:.08;

  --jsl-img-fit:cover;

  /* Sticky chips top offset (single source of truth for CSS + JS) */
  --jsl-sticky-top-pad: 12px;

  /* Typography (px) */
  --jsl-fs-brand:14px;
  --jsl-fs-tagline:12px;
  --jsl-fs-nav:13px;
  --jsl-fs-topcta:13px;

  --jsl-fs-chip:12px;
  --jsl-fs-kicker:12px;
  --jsl-fs-h2:34px;
  --jsl-fs-h2-sm:28px;
  --jsl-fs-p:14px;
  --jsl-fs-cta:13px;

  --jsl-fs-rich:14px;
  --jsl-fs-h3:20px;
  --jsl-fs-h3sub:12px;

  --jsl-fs-name:13px;
  --jsl-fs-price:13px;
  /* Modal price is slightly larger for readability (requested: +2px) */
  --jsl-fs-modal-price: calc(var(--jsl-fs-price) + 2px);
  --jsl-fs-btn:12px;
  --jsl-fs-subnote:11px;

  --jsl-fs-modal-title:22px;
  --jsl-fs-modal-desc:13px;
--jsl-fs-loading:14px;

  --jsl-fs-footer-trust:12px;
  --jsl-fs-footer-link:12px;

  background: var(--jsl-bg);
  padding: var(--jsl-pad-y) 0;
  margin: var(--jsl-marg-y) var(--jsl-marg-x);
  color: var(--jsl-ink) !important;
}

.jsl *{ box-sizing:border-box; }

.jsl__shell{
  max-width: var(--jsl-max);
  margin: 0 auto;
  padding: 0 var(--jsl-pad-x);
  color: var(--jsl-ink) !important;
  font-family: system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
}

@media (max-width: 520px){
  .jsl__shell{ padding-left: var(--jsl-pad-x-m, var(--jsl-pad-x)); padding-right: var(--jsl-pad-x-m, var(--jsl-pad-x)); }
}

/* Header */
.jsl__top{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  background: var(--jsl-header-bg);
  border-radius: calc(var(--jsl-radius) + 10px);
  padding: 12px 16px;
  box-shadow: 0 10px 30px rgba(0,0,0,var(--jsl-shadow-b));
}

.jsl__brand{ display:flex; align-items:center; gap:10px; min-width: 0; }
.jsl__logo{ display:flex; align-items:center; height: var(--jsl-logo-h); }
.jsl__brandmeta{ display:flex; flex-direction:column; line-height:1.1; min-width:0; }
.jsl__mark{
  width: var(--jsl-logo-h); height: var(--jsl-logo-h);
  border-radius: 999px;
  background: var(--jsl-primary);
  box-shadow: inset 0 0 0 4px rgba(255,255,255,0.7);
  flex: 0 0 auto;
}

.jsl__logoimg{ display:block; height: var(--jsl-logo-h) !important; max-height: var(--jsl-logo-h) !important; width:auto; }
.jsl__brandtext{ font-weight: 900; letter-spacing: .06em; font-size: var(--jsl-fs-brand); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.jsl__tagline{ font-size: var(--jsl-fs-tagline); color: var(--jsl-muted); opacity:.95; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }

.jsl__nav{ display:flex; gap:14px; flex-wrap:wrap; justify-content:flex-end; }
.jsl__navlink{ color: var(--jsl-ink) !important; text-decoration:none; font-size: var(--jsl-fs-nav); opacity:.80; }
.jsl__navlink:hover{ opacity:1; }

.jsl__topcta{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding: 10px 14px;
  border-radius: 999px;
  text-decoration:none;
  font-weight: 800;
  font-size: var(--jsl-fs-topcta);
  background: var(--jsl-btn-bg);
  color: var(--jsl-btn-text) !important;
  box-shadow: 0 12px 30px rgba(0,0,0,var(--jsl-shadow-b));
}
.jsl__topcta:hover{ filter: brightness(1.05); }

/* Header cart icon */
.jsl__topright{ display:flex; align-items:center; gap:10px; }
.jsl__cart{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:6px;
  padding: 10px 12px;
  border-radius: 999px;
  text-decoration:none;
  color: var(--jsl-btn-text) !important;
  background: var(--jsl-btn-bg);
  box-shadow: 0 12px 30px rgba(0,0,0,var(--jsl-shadow-b));
}
.jsl__cart:hover{ filter: brightness(1.05); }
.jsl__cartcount{
  min-width: 20px;
  height: 20px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 900;
  background: rgba(255,255,255,0.24);
  padding: 0 6px;
}

/* Sticky category chips (Step 5A) */
.jsl__anchorswrap{
  position: sticky;
  top: calc(var(--jsl-sticky-top-pad, 12px) + var(--wp-admin--admin-bar--height, 0px));
  z-index: 30;
  /* Avoid double top spacing when there is no internal header/hero above */
  margin-top: 0;
  display:flex;
  justify-content:center;
}

/* Only add spacing above chips when our internal header is shown */
.jsl__top + .jsl__anchorswrap{
  margin-top: var(--jsl-vgap-tight);
}

.jsl__anchors{
  display:flex;
  gap: 10px;
  flex-wrap: wrap;
  justify-content: center;
  padding: 8px;
  border-radius: 999px;
  background: var(--jsl-chips-bg);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  box-shadow: 0 12px 28px rgba(0,0,0,var(--jsl-shadow-b));
}

/* CTA buttons under sticky chips (MS-A6) */
.jsl__chipsctas{
  margin-top: 10px;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  width: min(980px, 100%);
  margin-left: auto;
  margin-right: auto;
}
.jsl__chipscta{
  border-radius: 999px;
  padding: 10px 14px;
  background: var(--jsl-chipscta-bg, var(--jsl-btn-bg)) !important;
  color: var(--jsl-chipscta-text, var(--jsl-btn-text)) !important;
  border: 1px solid var(--jsl-chipscta-border, transparent) !important;
}

/* Layout variants (MS-A6B) */
.jsl__chipsctas[data-jsl-chipscta-layout="auto"]{
  grid-template-columns: repeat(auto-fit, minmax(200px, max-content));
  justify-content: center;
}
.jsl__chipsctas[data-jsl-chipscta-layout="full"]{
  grid-template-columns: 1fr;
}
.jsl__chipsctas[data-jsl-chipscta-layout="fixed"]{
  grid-template-columns: repeat(auto-fit, minmax(var(--jsl-chipscta-w, 220px), var(--jsl-chipscta-w, 220px)));
  justify-content: center;
}
@media (max-width: 720px){
  .jsl__chipsctas{ grid-template-columns: 1fr; }
}

.jsl__chip{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding: 8px 12px;
  border-radius: 999px;
  text-decoration:none;
  font-size: var(--jsl-fs-chip);
  font-weight: 800;
  letter-spacing: .02em;
  color: var(--jsl-chip-text) !important;
  background: var(--jsl-chip-bg);
  transition: background .15s ease, color .15s ease, filter .15s ease;
}
.jsl__chip:hover{ background: var(--jsl-chip-bg-hover); }
.jsl__chip--active{ background: var(--jsl-btn-bg); color: var(--jsl-btn-text) !important; }
.jsl__chip--active:hover{ filter: brightness(1.05); }

/* Better anchor offsets when using sticky bar (computed by JS) */
.jsl [data-jsl-section]{
  scroll-margin-top: var(--jsl-anchor-offset, 160px);
}

/* Category tiles (top categories) */
.jsl__tiles{
  margin-top: var(--jsl-vgap);
}

/* Category tiles under chapters (granular spacing controls) */
.jsl__ctiles{
  margin-top: var(--jsl-gap-ch-tiles);
}

/* When tiles are directly followed by a story block or products, use the dedicated spacing */
.jsl__ctiles + .jsl__richcard,
.jsl__ctiles + .jsl__section{
  margin-top: var(--jsl-gap-tiles-prod);
}

/* Products grouped under chapter tiles */
.jsl__ctprodGroup{ margin-top: var(--jsl-gap-tiles-prod); }
.jsl__ctprodGroup:first-child{ margin-top: 0; }
.jsl__ctprodTitle{
  display:inline-flex;
  align-items:center;
  gap: 8px;
  margin: 0 0 10px;
  font-size: var(--jsl-fs-h3sub);
  color: var(--jsl-muted) !important;
  opacity: .92;
  font-weight: 900;
  letter-spacing: .12em;
  text-transform: uppercase;
  text-decoration: none;
}
.jsl__ctprodTitle:hover{ opacity: 1; text-decoration: underline; }

/* Featured products title (flat tile-selected products) */
.jsl__pickTitle{
  margin: 0 0 10px;
  font-size: var(--jsl-fs-h3sub);
  color: var(--jsl-muted);
  opacity: .92;
  font-weight: 900;
  letter-spacing: .06em;
}

.jsl__tilesH{ margin: 0; font-size: var(--jsl-fs-h3); }
.jsl__tilesSub{ margin-top: 6px; font-size: var(--jsl-fs-p); color: var(--jsl-muted); opacity:.92; }
.jsl__tilesGrid{
  margin-top: 12px;
  display:grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--jsl-gap);
}
.jsl__tile{
  display:block;
  text-decoration:none;
  border-radius: calc(var(--jsl-radius) + 12px);
  overflow:hidden;
  background: rgba(255,255,255,0.92);
  box-shadow: 0 18px 42px rgba(0,0,0,var(--jsl-shadow-a));
  border: 1px solid rgba(0,0,0,.06);
  position: relative;
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.jsl__tile:hover{
  transform: translateY(-2px);
  box-shadow: 0 22px 50px rgba(0,0,0,calc(var(--jsl-shadow-a) + .06));
  border-color: rgba(0,0,0,.10);
}
.jsl__tileMedia{
  height: var(--jsl-ctile-h);
  background: var(--jsl-story-img-bg);
  overflow:hidden;
}
.jsl__tileimg{ width:100%; height:100%; object-fit: cover; display:block; transform: scale(1.02); transition: transform .22s ease; }
.jsl__tile:hover .jsl__tileimg{ transform: scale(1.06); }
.jsl__tilePh{ display:block; width:100%; height:100%; background: linear-gradient(120deg, rgba(0,0,0,.06), rgba(0,0,0,.02)); }
.jsl__tileLabel{
  position:absolute;
  left:12px;
  bottom:12px;
  z-index:2;
  display:inline-flex;
  align-items:center;
  justify-content:flex-start;
  max-width:calc(100% - 24px);
  padding:10px 14px;
  border-radius:18px;
  background:rgba(255,255,255,.92);
  color:#0f6ea8;
  border:1px solid rgba(23,144,218,.18);
  box-shadow:0 10px 22px rgba(0,0,0,.10);
  font-weight:900;
  letter-spacing:.01em;
  line-height:1.15;
  font-size:13px;
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
}

.jsl__tileBadge{
  position:absolute;
  top:12px;
  right:12px;
  z-index:2;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  max-width:calc(100% - 24px);
  padding:9px 12px;
  border-radius:999px;
  background:rgba(255,255,255,.92);
  color:#0f6ea8;
  border:1px solid rgba(23,144,218,.18);
  box-shadow:0 10px 22px rgba(0,0,0,.10);
  font-size:12px;
  font-weight:900;
  letter-spacing:.06em;
  line-height:1;
  text-transform:uppercase;
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
  pointer-events:none;
}

/* Story cards */
.jsl__storycard,
.jsl__chapter2{
  margin-top: var(--jsl-vgap);
  background: var(--jsl-story-bg);
  border-radius: calc(var(--jsl-radius) + 12px);
  padding: 16px;
  display:grid;
  grid-template-columns: 1.4fr 1fr;
  gap: 16px;
  box-shadow: 0 18px 42px rgba(0,0,0,var(--jsl-shadow-a));
}

.jsl__storyimg,
.jsl__ch2img{
  border-radius: calc(var(--jsl-radius) + 8px);
  background: var(--jsl-story-img-bg);
  min-height: 160px;
  aspect-ratio: 16/9;
  overflow: hidden;
  position: relative;
}

.jsl__media{ width:100%; height:100%; object-fit: cover; display:block; }

.jsl__kicker{
  display:inline-block;
  font-size: var(--jsl-fs-kicker);
  letter-spacing: .12em;
  opacity: .70;
  text-transform: uppercase;
  margin-bottom: 6px;
  color: var(--jsl-muted);
}

.jsl__h2{ margin: 0 0 8px; font-size: var(--jsl-fs-h2); line-height: 1.05; }
.jsl__h1{ margin: 0 0 8px; font-size: var(--jsl-fs-h2); line-height: 1.05; }

.jsl__h3{ margin: 0 0 12px; font-size: var(--jsl-fs-h3); display:flex; align-items:baseline; gap: 10px; flex-wrap: wrap; }
.jsl__h3sub{ font-size: var(--jsl-fs-h3sub); color: var(--jsl-muted); opacity:.90; font-weight: 900; letter-spacing: .12em; text-transform: uppercase; }
.jsl__p{ margin: 0 0 12px; font-size: var(--jsl-fs-p); line-height: 1.6; opacity:.92; }

/* CTA inside story */
.jsl__cta{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  background: var(--jsl-btn-bg);
  color: var(--jsl-btn-text) !important;
  padding: 10px 16px;
  border-radius: 999px;
  text-decoration:none;
  font-weight: 800;
  font-size: var(--jsl-fs-cta);
  box-shadow: 0 12px 30px rgba(0,0,0,var(--jsl-shadow-b));
}
.jsl__cta:hover{ filter: brightness(1.05); }

/* Rich blocks */
.jsl__richcard{
  margin-top: var(--jsl-vgap-tight);
  background: rgba(255,255,255,0.90);
  border-radius: calc(var(--jsl-radius) + 12px);
  padding: 14px 16px;
  box-shadow: 0 18px 42px rgba(0,0,0,var(--jsl-shadow-a));
}
.jsl__rich{ font-size: var(--jsl-fs-rich); line-height: 1.7; opacity: .96; }
.jsl__rich p{ margin: 0 0 10px; }
.jsl__rich p:last-child{ margin-bottom: 0; }
.jsl__rich a{ color: var(--jsl-primary); font-weight: 800; text-decoration: none; }
.jsl__rich a:hover{ text-decoration: underline; }
.jsl__rich ul{ margin: 0 0 10px 18px; }
.jsl__rich h2,.jsl__rich h3{ margin: 0 0 10px; line-height: 1.15; }

/* Products */
.jsl__section{ margin-top: var(--jsl-vgap); }
.jsl__grid{
  display:grid;
  grid-template-columns: repeat(var(--jsl-cols), minmax(0, 1fr));
  gap: var(--jsl-gap);
}

.jsl__card{
  background: rgba(255,255,255,0.92);
  border-radius: var(--jsl-radius);
  overflow:hidden;
  box-shadow: 0 14px 30px rgba(0,0,0,var(--jsl-shadow-a));
  border: 1px solid rgba(0,0,0,.06);
  display:flex;
  flex-direction:column;
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}

.jsl__card:hover{
  transform: translateY(-2px);
  box-shadow: 0 18px 42px rgba(0,0,0,calc(var(--jsl-shadow-a) + .06));
  border-color: rgba(0,0,0,.10);
}

.jsl__cardimg{
  display:block;
  position: relative;
  aspect-ratio: var(--jsl-ratio);
  background: rgba(0,0,0,.04);
  overflow:hidden;
}

.jsl__cardimg::after{
  content:"";
  position:absolute;
  inset:0;
  background: linear-gradient(to bottom, rgba(0,0,0,.00), rgba(0,0,0,.10));
  opacity: 0;
  transition: opacity .18s ease;
  pointer-events:none;
}

.jsl__card:hover .jsl__cardimg::after{ opacity: 1; }

.jsl__img{ width:100%; height:100%; object-fit: var(--jsl-img-fit); display:block; transform: scale(1); transition: transform .25s ease; }
.jsl__card:hover .jsl__img{ transform: scale(1.03); }
.jsl__imgph{ display:block; width:100%; height:100%; }

/* Badges (Step 5.3) */
.jsl__badge{
  position:absolute;
  top: 10px;
  left: 10px;
  z-index: 2;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding: 6px 10px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 900;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: #fff;
  background: rgba(0,0,0,.62);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}
.jsl__badge--new{ background: var(--jsl-btn-bg); color: var(--jsl-btn-text); }
.jsl__badge--sale{ background: rgba(0,0,0,.75); }
.jsl__badge--limited{ background: rgba(0,0,0,.75); }
.jsl__badge--bestseller{ background: rgba(0,0,0,.62); }
/* JAKO Club (member-only special offer) */
.jsl__badge--club{ background: rgba(0,0,0,.88); }
/* Inline variant (used inside quick-view modal) */
.jsl__badge--inline{ position: static; top:auto; left:auto; }
.jslqv__club{ margin: 0 0 10px; line-height: 1; }

.jsl__card{ position: relative; }
.jsl__favbtn,
.jslqv__favbtn{
  appearance:none;
  -webkit-appearance:none;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap: 8px;
  border: 1px solid rgba(0,0,0,.10);
  background: rgba(255,255,255,.96);
  color: rgba(0,0,0,.64);
  cursor: pointer;
  transition: transform .18s ease, background .18s ease, border-color .18s ease, color .18s ease, box-shadow .18s ease;
}
.jsl__favbtn{
  position:absolute;
  top: 10px;
  right: 10px;
  z-index: 3;
  width: 40px;
  height: 40px;
  border-radius: 999px;
  box-shadow: 0 10px 24px rgba(0,0,0,.12);
}
.jslqv__favbtn{
  min-height: 40px;
  padding: 0 14px;
  border-radius: 999px;
  box-shadow: 0 8px 20px rgba(0,0,0,.06);
  flex: 0 0 auto;
}
.jsl__favbtn:hover,
.jsl__favbtn:focus-visible,
.jslqv__favbtn:hover,
.jslqv__favbtn:focus-visible,
.jsl--cat .jsl-catTools__chip--fav:hover,
.jsl--cat .jsl-catTools__chip--fav:focus-visible{
  background: rgba(255,255,255,1);
  border-color: rgba(0,0,0,.18);
  color: rgba(0,0,0,.88);
  transform: translateY(-1px);
}
.jsl__favbtn.is-active,
.jslqv__favbtn.is-active,
.jsl--cat .jsl-catTools__chip--fav.is-active{
  color: #b2124b;
  border-color: rgba(178,18,75,.22);
  background: rgba(255,244,248,.98);
  box-shadow: 0 12px 26px rgba(178,18,75,.14);
}
.jsl__favbtn.is-pop,
.jslqv__favbtn.is-pop{
  animation: jslFavPop .24s ease;
}
@keyframes jslFavPop{
  0%{ transform: scale(1); }
  45%{ transform: scale(1.12); }
  100%{ transform: scale(1); }
}
.jsl__favbtnIcon,
.jsl-catTools__favIcon{ line-height:1; }
.jsl__favbtnIcon svg{
  width: 18px;
  height: 18px;
  display:block;
}
.jslqv__titlebar{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap: 12px;
  margin: 0 0 8px;
}
.jslqv__titlebar .jslqv__title{ margin: 0; }
.jslqv__favbtnText{
  font-size: 13px;
  font-weight: 700;
  line-height: 1.2;
}

.jsl__cardbody{ padding: var(--jsl-prod-body-pt, 12px) 12px 14px; display:flex; flex-direction:column; flex: 1 1 auto; }
.jsl__name{ font-size: var(--jsl-fs-name); font-weight: 800; margin-bottom: 6px; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.jsl__price{ font-size: var(--jsl-fs-price); opacity: .86; margin-bottom: 10px; color: var(--jsl-ink) !important; }
.jsl__pricewrap{ margin-bottom: 8px; }
.jsl__pricewrap .jsl__price{ margin-bottom: 0; }
.jsl__clubmeta{
  margin-top: 10px;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:6px;
  color: var(--jsl-ink) !important;
}
.jsl__clubmeta-badgewrap{ line-height:1; }
.jsl__clubmeta-badge{
  display:inline-flex;
  align-items:center;
  min-height:20px;
  padding:4px 9px;
  border-radius:999px;
  background:rgba(0,0,0,.84);
  color:#fff;
  font-size:9px !important;
  font-weight:600 !important;
  line-height:1.05 !important;
  letter-spacing:.025em;
  text-transform:uppercase;
  white-space:normal;
}
.jsl__clubmeta-copy{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:0;
  line-height:1.18;
  color: var(--jsl-ink) !important;
  opacity:.72;
}
.jsl__clubmeta-label{
  font-size:11px !important;
  font-weight:500 !important;
  line-height:1.15;
  opacity:.88;
}
.jsl__clubmeta-value{
  font-size:12px !important;
  font-weight:500 !important;
  line-height:1.15;
}

.jsl__actions{ display:flex; gap:10px; margin-top: auto; }

.jsl__actions{ flex-wrap: wrap; }
.jsl__actions .jsl__btn{ flex: 1 1 140px; }

.jsl__btn--qv{
  /* Quick view should look like the other product buttons */
}

/* Buttons (variants via wrapper class) */
.jsl__btn{
  width:100%;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding: 10px 12px;
  border-radius: 14px;
  text-decoration:none;
  /* User request: slightly smaller + not bold */
  font-size: var(--jsl-fs-btn);
  font-weight: 500;
  transition: filter .15s ease, background .15s ease, color .15s ease, border-color .15s ease;
}

.jsl__btn:visited{ color: inherit; }
.jsl__cta:visited{ color: var(--jsl-btn-text) !important; }
.jsl__chip:visited{ color: var(--jsl-ink) !important; }
.jsl__chip--active:visited{ color: var(--jsl-btn-text) !important; }
.jsl--btn-soft .jsl__btn{
  background: var(--jsl-btn-soft-bg);
  color: var(--jsl-btn-text) !important;
}
.jsl--btn-soft .jsl__btn:hover{ background: var(--jsl-btn-soft-bg-hover); }

.jsl--btn-solid .jsl__btn{
  background: var(--jsl-btn-bg);
  color: var(--jsl-btn-text) !important;
  box-shadow: 0 12px 30px rgba(0,0,0,var(--jsl-shadow-b));
}
.jsl--btn-solid .jsl__btn:hover{ filter: brightness(1.05); }

.jsl--btn-outline .jsl__btn{
  background: transparent;
  color: var(--jsl-btn-text) !important;
  border: 2px solid var(--jsl-btn-outline-border);
}
.jsl--btn-outline .jsl__btn:hover{ background: var(--jsl-btn-soft-bg); }

/* Product card buttons — always use dedicated variables (theme-safe) */
.jsl .jsl__pbtn{
  background: var(--jsl-prod-btn-bg) !important;
  color: var(--jsl-prod-btn-text) !important;
  border-radius: var(--jsl-prod-btn-radius, 14px) !important;
  border: var(--jsl-prod-btn-border-w, 0px) solid var(--jsl-prod-btn-border, transparent) !important;
}
.jsl .jsl__pbtn:hover{
  background: var(--jsl-prod-btn-bg-hover) !important;
  color: var(--jsl-prod-btn-text-hover) !important;
  border-color: var(--jsl-prod-btn-border-hover, var(--jsl-prod-btn-border, transparent)) !important;
  filter: none;
}

.jsl__subnote{ margin-top: 10px; font-size: var(--jsl-fs-subnote); opacity: .70; color: var(--jsl-muted); }

.jsl__notice{ padding: 14px; background: rgba(0,0,0,.05); border-radius: var(--jsl-radius); }

/* Quick-view modal */
.jsl__modal[hidden]{ display:none !important; }

.jsl__modal{
  /* Force fixed overlay even if theme CSS interferes */
  position: fixed !important;
  inset: 0 !important;
  z-index: 99999;
}

.jsl__modalback{
  position: fixed !important;
  inset: 0 !important;
  background: rgba(0,0,0,.55);
}

/* Cart modal (same overlay system, separate instance) */
.jsl__cartmodal[hidden]{ display:none !important; }
.jsl__cartmodal{
  position: fixed !important;
  inset: 0 !important;
  z-index: 99999;
}
.jsl__cartmodal .jsl__modalback{ background: rgba(0,0,0,.55); }

/* Cart modal panel overrides (keep QV modal untouched) */
.jsl__cartmodal .jsl__modalpanel{
  /* Desktop: keep original comfortable width. Mobile/tablet override below. */
  width: min(760px, calc(100vw - 28px));
  max-width: 760px;
  max-height: 84vh;
  padding: 18px;
  background: rgba(255,255,255,0.96);
  border: 1px solid rgba(0,0,0,.06);
}

/* Checkout mode: immersive 90x90 */
.jsl__cartmodal--checkout .jsl__modalpanel{
  /* Desktop: slightly wider checkout without going edge-to-edge */
  width: min(1200px, 90vw);
  max-width: 1200px;
  height: 90vh;
  max-height: 90vh;
  overflow: hidden;
  padding: 14px;
}

.jsl__cartmodal .jsl__modalcontent{
  display:flex;
  flex-direction:column;
  gap: 12px;
}

.jsl__carthead{
  display:flex;
  align-items:center;
  justify-content:flex-start;
  gap: 10px;
  margin-bottom: 4px;
}
.jsl__carttitle{
  margin: 0;
  font-size: calc(var(--jsl-fs-modal-title) - 2px);
  line-height: 1.1;
}

.jsl__cartback{
  width: 38px; height: 38px;
  border-radius: 999px;
  border: 0;
  background: rgba(0,0,0,.07);
  cursor: pointer;
  font-weight: 900;
  display:inline-flex;
  align-items:center;
  justify-content:center;
}
.jsl__cartback:hover{ background: rgba(0,0,0,.10); }

.jsl__cartviews{ flex: 1; }

/* Cart modal view switching (robust even if theme overrides [hidden]) */
.jsl__cartmodal--checkout [data-jsl-cartview="cart"]{ display:none !important; }
.jsl__cartmodal--checkout [data-jsl-cartview="checkout"]{ display:block !important; }
.jsl__cartmodal:not(.jsl__cartmodal--checkout) [data-jsl-cartview="checkout"]{ display:none !important; }
.jsl__cartmodal:not(.jsl__cartmodal--checkout) [data-jsl-checkout-back]{ display:none !important; }
.jsl__cartmodal--checkout [data-jsl-checkout-back]{ display:inline-flex !important; }

.jsl__minicart{
  display:flex;
  flex-direction:column;
  gap: 12px;
}

.jsl__cartcta{
  margin-top: 14px;
  display:flex;
  justify-content:flex-end;
  position: sticky;
  bottom: 0;
  padding: 10px 0 2px;
  background: linear-gradient(to bottom, rgba(255,255,255,0), rgba(255,255,255,0.98) 30%);
}

.jsl__btn--checkout{
  min-width: 180px;
}

/* Cart modal checkout button — per-preset color overrides */
.jsl .jsl__btn--checkout{
  background: var(--jsl-cartcheckout-bg, var(--jsl-btn-bg)) !important;
  color: var(--jsl-cartcheckout-text, var(--jsl-btn-text)) !important;
  border: 2px solid var(--jsl-cartcheckout-border, transparent) !important;
}
.jsl .jsl__btn--checkout:hover{
  background: var(--jsl-cartcheckout-bg-hover, var(--jsl-cartcheckout-bg, var(--jsl-btn-bg))) !important;
  color: var(--jsl-cartcheckout-text-hover, var(--jsl-cartcheckout-text, var(--jsl-btn-text))) !important;
  filter: none;
}

.jsl__checkoutframe{
  height: calc(90vh - 86px);
  border-radius: calc(var(--jsl-radius) + 10px);
  overflow:hidden;
  border: 1px solid rgba(0,0,0,.06);
  background: rgba(0,0,0,.02);
}
.jsl__checkoutiframe{
  width: 100%;
  height: 100%;
  border: 0;
  background: transparent;
}

/* Hide any theme-injected mini-cart CTA buttons inside the cart modal */
.jsl__cartmodal a.wc-forward,
.jsl__cartmodal a.checkout,
.jsl__cartmodal a.button.checkout,
.jsl__cartmodal a.button.wc-forward,
.jsl__cartmodal .widget_shopping_cart_content a.button{
  display:none !important;
}
/* Mini cart inside modal (scoped) */
.jsl__cartmodal .woocommerce-mini-cart{
  list-style:none;
  margin: 0;
  padding: 0;
  display:flex;
  flex-direction:column;
  gap: 10px;
}
.jsl__cartmodal .woocommerce-mini-cart-item{
  display:grid;
  grid-template-columns: 54px 1fr;
  gap: 10px;
  align-items:start;
  padding: 10px;
  border-radius: calc(var(--jsl-radius) - 4px);
  background: rgba(0,0,0,.035);
  border: 1px solid rgba(0,0,0,.05);
}
.jsl__cartmodal .woocommerce-mini-cart-item{ position: relative; }
.jsl__cartmodal a.remove_from_cart_button,
.jsl__cartmodal a.remove.remove_from_cart_button{
  position:absolute;
  top: 8px;
  right: 8px;
  width: 28px;
  height: 28px;
  border-radius: 999px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  text-decoration:none;
  background: var(--jsl-sg-bg-hover, rgba(0,0,0,.06));
  color: var(--jsl-ink) !important;
  font-weight: 900;
}
.jsl__cartmodal a.remove_from_cart_button:hover,
.jsl__cartmodal a.remove.remove_from_cart_button:hover{ background: rgba(0,0,0,.10); }
.jsl__cartmodal .woocommerce-mini-cart-item a{ color: var(--jsl-ink) !important; text-decoration:none; font-weight:700; }
.jsl__cartmodal .woocommerce-mini-cart-item a:hover{ text-decoration:underline; }
.jsl__cartmodal .woocommerce-mini-cart-item img{ width: 54px; height:auto; border-radius: 10px; display:block; }
.jsl__cartmodal .quantity{ color: var(--jsl-muted); font-size: 12px; display:block; margin-top: 4px; }
.jsl__cartmodal .woocommerce-mini-cart__total{ margin-top: 12px; padding-top: 12px; border-top: 1px solid rgba(0,0,0,.10); font-weight: 800; }
.jsl__cartmodal .woocommerce-mini-cart__buttons{ display:none !important; }
.jsl__cartmodal p.woocommerce-mini-cart__buttons,
.jsl__cartmodal div.woocommerce-mini-cart__buttons{ display:none !important; }

/* Embed checkout (inside cart modal iframe) */
body.jsl-embed-checkout{ margin:0; padding:0; background: var(--jsl-bg, #f5f1e8); }
body.jsl-embed-checkout .jsl--embed{ min-height:100vh; background: var(--jsl-bg, #f5f1e8); padding: 18px; }
body.jsl-embed-checkout .jsl-embed-checkout__wrap{
  max-width: 1100px;
  margin: 0 auto;
  background: rgba(255,255,255,0.92);
  border-radius: calc(var(--jsl-radius, 18px) + 12px);
  padding: 18px;
  box-shadow: 0 18px 48px rgba(0,0,0,.10);
  border: 1px solid rgba(0,0,0,.06);
}

/* Light modern polish for Woo checkout inside the embed wrapper */
body.jsl-embed-checkout .jsl--embed input,
body.jsl-embed-checkout .jsl--embed select,
body.jsl-embed-checkout .jsl--embed textarea{
  border-radius: 14px;
  padding: 10px 12px;
}
body.jsl-embed-checkout .jsl--embed .woocommerce button.button,
body.jsl-embed-checkout .jsl--embed .woocommerce a.button,
body.jsl-embed-checkout .jsl--embed .woocommerce input.button,
body.jsl-embed-checkout .jsl--embed .woocommerce #place_order{
  background: var(--jsl-btn-bg, #008acc) !important;
  color: var(--jsl-btn-text, #fff) !important;
  border-radius: 999px !important;
  font-weight: 800;
}

.jsl__modalpanel{
  position: fixed !important;
  top: 50%; left: 50%;
  transform: translate(-50%, -50%);
  /* Desktop: keep original comfortable width. Mobile/tablet override below. */
  width: min(940px, calc(100vw - 28px));
  max-width: 940px;
  max-height: 90vh;
  /* MS-MODALH10: taller product modal */
  overflow: auto;
  background: rgba(255,255,255,0.98);
  border-radius: calc(var(--jsl-radius) + 14px);
  box-shadow: 0 30px 80px rgba(0,0,0,.35);
  padding: 16px;
}

/* Mobile/tablet: edge-to-edge modal panels (requested: ~99%) */
@media (max-width: 980px){
  .jsl__modalpanel{
    width: min(99vw, calc(100vw - 10px));
    max-width: 99vw;
  }
  .jsl__cartmodal .jsl__modalpanel{
    width: min(99vw, calc(100vw - 10px));
    max-width: 99vw;
  }
  .jsl__cartmodal--checkout .jsl__modalpanel{
    width: 99vw;
    max-width: 99vw;
  }
}

.jsl__modalclose{
  position: sticky;
  top: 0;
  margin-left: auto;
  display: inline-flex;
  align-items:center;
  justify-content:center;
  width: 40px; height: 40px;
  border-radius: 999px;
  border: 0;
  cursor: pointer;
  background: rgba(0,0,0,.07);
  font-size: 22px;
  font-weight: 900;
}

.jsl__modalclose:hover{ background: rgba(0,0,0,.10); }

.jsl__loading{ padding: 10px 2px; font-size: var(--jsl-fs-loading); opacity: .8; }

.jslqv{
  display: grid;
  grid-template-columns: 1.1fr 0.9fr;
  gap: 16px;
  align-items: start;
}

.jslqv__media{
  border-radius: calc(var(--jsl-radius) + 10px);
  overflow: hidden;
  background: rgba(0,0,0,.04);
  display: flex;
  flex-direction: column;
}

.jslqv__imgwrap{
  /* Prevent huge media from blowing up the modal */
  max-height: 64vh;
  display: flex;
  align-items: center;
  justify-content: center;
}

.jslqv__img{
  width:100%;
  height:100%;
  max-height: 64vh;
  object-fit: contain;
  display:block;
}

/* Extra product images under the main image (gallery thumbs) */
.jslqv__gallery{
  display:flex;
  gap: 8px;
  padding: 10px 10px;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-start;
  background: rgba(255,255,255,.55);
  border-top: 1px solid rgba(0,0,0,.06);
}

.jslqv__thumb{
  width: 64px;
  height: 64px;
  border-radius: 12px;
  overflow: hidden;
  border: 1px solid rgba(0,0,0,.12);
  background: rgba(255,255,255,.95);
  padding: 0;
  cursor: pointer;
  display:flex;
  align-items:center;
  justify-content:center;
}

.jslqv__thumb img{
  width:100%;
  height:100%;
  object-fit: cover;
  display:block;
}

.jslqv__thumb.is-active{
  border-color: var(--jsl-btn-outline-border);
  box-shadow: 0 0 0 3px rgba(0,0,0,.06);
}

.jslqv__title{ margin: 0 0 8px; font-size: var(--jsl-fs-modal-title); line-height: 1.18; }
.jslqv__price{ margin-bottom: 10px; }
/* Slightly larger price inside modal */
.jslqv__price,
.jslqv__price .price,
.jslqv__price ins,
.jslqv__price del{ font-size: var(--jsl-fs-modal-price); }
.jslqv__price,
.jslqv__price .price,
.jslqv__price ins,
.jslqv__price del{ font-weight: 800; }
.jslqv__price .price{ display:flex; flex-wrap:wrap; align-items:baseline; gap: 8px 12px; }
.jslqv__pricecombo{ display:flex; flex-wrap:wrap; align-items:baseline; gap: 8px 12px; }
.jslqv__oldprice,
.jslqv__oldprice .amount{ color: var(--jsl-muted); opacity: .78; font-weight: 700; }
.jslqv__memberprice{ display:inline-flex; flex-wrap:wrap; align-items:baseline; gap: 6px 8px; }
.jslqv__memberpriceLabel{ font-size: 14px; line-height: 1.2; color: var(--jsl-muted); font-weight: 700; }
.jslqv__memberpriceValue,
.jslqv__memberpriceValue .amount{ color: var(--jsl-ink); font-weight: 800; }

.jslqv__clubmeta{ margin: -2px 0 12px; display:flex; flex-direction:column; align-items:flex-start; gap:5px; color: var(--jsl-ink) !important; }
.jslqv__clubmeta[hidden]{ display:none !important; }
.jslqv__clubmeta-badgewrap{ line-height:1; }
.jslqv__clubmeta-badge{
  display:inline-flex;
  align-items:center;
  min-height:20px;
  padding:4px 9px;
  border-radius:999px;
  background:rgba(0,0,0,.84);
  color:#fff;
  font-size:9px !important;
  font-weight:600 !important;
  line-height:1.05 !important;
  letter-spacing:.025em;
  text-transform:uppercase;
  white-space:normal;
}
.jslqv__clubmeta-copy{ display:flex; flex-direction:column; align-items:flex-start; gap:0; line-height:1.18; color: var(--jsl-ink) !important; opacity:.72; }
.jslqv__clubmeta-label{ font-size:11px !important; font-weight:500 !important; line-height:1.15 !important; opacity:.88; }
.jslqv__clubmeta-value{ font-size:12px !important; font-weight:500 !important; line-height:1.15 !important; }

/* Member savings line in modal */
.jslqv__save{ margin: -2px 0 10px; font-size: 14px; line-height: 1.35; }
.jslqv__saveLabel{ color: #111; }
.jslqv__saveAmt{ font-weight: 800; }
.jslqv__saveNote{ color: var(--jsl-muted); }


/* Reopen polish after login: subtle attention on price/savings */
.jslqv__price.jslqv__reopen-focus,
.jslqv__save.jslqv__reopen-focus{
  background: rgba(0,0,0,.06);
  border-radius: 14px;
  box-shadow: 0 0 0 2px rgba(0,0,0,.10), 0 12px 28px rgba(0,0,0,.07);
  padding: 8px 10px;
  transition: background-color .55s ease, box-shadow .55s ease, transform .55s ease;
  transform: translateY(-1px);
}

/* Ensure "Din medlemsrabat: kr. xxx" is NOT bold (override any <strong> inside).
   Keep this global (within pages where this CSS is loaded) so it also works on mixed layouts. */
.jako-club-member-discount-plain,
.jako-club-member-discount,
.jako-club-member-discount a,
.jako-club-member-discount-plain *,
.jako-club-member-discount *{
  font-weight: 400 !important;
}

/* Toast: "Tilføjet til kurven" */
.jsl__toastwrap{
  --jsl-toast-accent: #008acc;
  position: fixed;
  left: 50%;
  bottom: 18px;
  transform: translateX(-50%);
  z-index: 999999;
  width: min(480px, calc(100vw - 24px));
  pointer-events: none;
}

.jsl__toast{
  pointer-events: auto;
  background: rgba(255,255,255,.96);
  border: 1px solid rgba(0,0,0,.10);
  border-radius: 18px;
  box-shadow: 0 18px 50px rgba(0,0,0,.18);
  padding: 12px 12px;
  opacity: 0;
  transform: translateY(12px);
  transition: opacity .2s ease, transform .2s ease;
  color: #111;
}
.jsl__toast.is-show{ opacity: 1; transform: translateY(0); }

.jsl__toasthead{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap: 10px;
  margin-bottom: 6px;
}

.jsl__toasttitle{
  font-weight: 800;
  letter-spacing: .01em;
  display:flex;
  align-items:center;
  gap: 8px;
}
.jsl__toasttitle:before{
  content: "";
  width: 10px;
  height: 10px;
  border-radius: 999px;
  background: var(--jsl-toast-accent);
  box-shadow: 0 0 0 4px rgba(0,0,0,.06);
}

.jsl__toastx{
  appearance:none;
  border: 0;
  background: rgba(0,0,0,.06);
  color: #111;
  width: 34px;
  height: 34px;
  border-radius: 999px;
  cursor: pointer;
  font-size: 18px;
  line-height: 1;
}
.jsl__toastx:hover{ background: rgba(0,0,0,.10); }

.jsl__toastbody{ margin-bottom: 10px; }
.jsl__toastmsg{ font-size: 14px; line-height: 1.35; opacity: .95; }
.jsl__toastsub{ font-size: 12px; opacity: .75; margin-top: 4px; }

.jsl__toastactions{
  display:flex;
  gap: 10px;
  align-items:center;
  justify-content:flex-end;
  flex-wrap: wrap;
}

.jsl__toastbtn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap: 8px;
  text-decoration:none;
  border-radius: 999px;
  padding: 9px 14px;
  font-size: 13px;
  font-weight: 800;
  cursor: pointer;
  border: 1px solid transparent;
}

.jsl__toastbtn--primary{
  background: var(--jsl-toast-accent);
  color: #fff;
}

.jsl__toastbtn--primary:hover{ filter: brightness(0.95); }

.jsl__toastbtn--ghost{
  background: rgba(0,0,0,.06);
  color: #111;
}
.jsl__toastbtn--ghost:hover{ background: rgba(0,0,0,.10); }

/* Modernize Woo fields inside modal */
.jslqv__cart form.cart{ display:block; }
.jslqv__cart table.variations{ width:100%; border-collapse: separate; border-spacing: 0 10px; }
.jslqv__cart table.variations th,
.jslqv__cart table.variations td{ padding:0; vertical-align: middle; }
.jslqv__cart table.variations label{ font-weight: 800; font-size: 12px; letter-spacing: .02em; opacity: .9; }
.jslqv__cart select,
.jslqv__cart input[type="number"],
.jslqv__cart input.qty{
  width: 100%;
  padding: 10px 12px;
  border-radius: 14px;
  border: 1px solid rgba(0,0,0,.14);
  background: rgba(255,255,255,.9);
  color: var(--jsl-ink);
  outline: none;
}
.jslqv__cart table.variations select{ display:block !important; }
.jslqv__cart select:focus,
.jslqv__cart input[type="number"]:focus,
.jslqv__cart input.qty:focus{ border-color: var(--jsl-btn-outline-border); box-shadow: 0 0 0 3px rgba(0,0,0,.06); }

.jslqv__cart .quantity{ margin-right: 10px; }
.jslqv__cart .quantity input.qty{ max-width: 110px; }

.jslqv__cart .woocommerce-variation-add-to-cart{ display:flex; gap: 10px; align-items:center; flex-wrap: wrap; }
.jslqv__cart .reset_variations{ font-size: 12px; opacity: .85; }
.jslqv__cart .reset_variations:hover{ opacity: 1; }

.jslqv__cart .variations{ margin-bottom: 10px; }
.jslqv__cart .single_add_to_cart_button{ background: var(--jsl-btn-bg) !important; color: var(--jsl-btn-text) !important; border-radius: 999px !important; }

@media (max-width: 860px){
  .jslqv{ grid-template-columns: 1fr; }
}

/* Footer */
.jsl__infostrip{
  margin-top: var(--jsl-infostrip-mt, var(--jsl-vgap));
  margin-bottom: var(--jsl-infostrip-mb, 0px);
}
.jsl__infogrid{
  display:grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
  align-items: stretch;
}
.jsl__infobox{
  display:flex;
  align-items:flex-start;
  gap: 12px;
  background: var(--jsl-infobox-bg, var(--jsl-surface));
  /* MS-INFOBOX-3: Border is controlled via CSS variables (default OFF) */
  border: var(--jsl-infobox-border-w, 0px) solid var(--jsl-infobox-border, rgba(0,0,0,0.08));
  border-radius: calc(var(--jsl-radius) - 6px);
  padding: 14px 14px;
  /* Allow preset-controlled min-height to always win (themes/builders may set min-height:0 on generic cards) */
  min-height: var(--jsl-infobox-minh, auto) !important;
  box-shadow: 0 10px 26px rgba(0,0,0,0.08);
  height: 100%;
}

/* Extra safety: increase specificity under the .jsl wrapper */
.jsl .jsl__infobox{
  /* Allow preset-controlled min-height to always win */
  min-height: var(--jsl-infobox-minh, auto) !important;
  /* MS-INFOBOX-3: Border is controlled via CSS variables (default OFF). */
  border: var(--jsl-infobox-border-w, 0px) solid var(--jsl-infobox-border, rgba(0,0,0,0.08)) !important;
}
.jsl__infoicon{
  width: 42px;
  height: 42px;
  border-radius: 999px;
  display:flex;
  align-items:center;
  justify-content:center;
  background: var(--jsl-infobox-icon-bg, rgba(0,0,0,0.05));
  flex: 0 0 42px;
  overflow:hidden;
}
.jsl__infoimg{
  width: 24px;
  height: 24px;
  object-fit: contain;
  display:block;
}
.jsl__infotext{ flex: 1; min-width: 0; }
.jsl__infofallback{
  font-weight: 800;
  font-size: 14px;
  color: var(--jsl-ink);
  opacity: .7;
}
.jsl__infotitle{
  font-size: var(--jsl-infobox-title-fs, 13px);
  font-weight: var(--jsl-infobox-title-fw, 800);
  letter-spacing: .02em;
  color: var(--jsl-infobox-title-color, var(--jsl-ink));
  line-height: 1.1;
}
.jsl__infodesc{
  margin-top: 2px;
  font-size: var(--jsl-infobox-text-fs, 12px);
  color: var(--jsl-infobox-text-color, var(--jsl-muted));
  line-height: 1.25;
}
@media (max-width: 980px){
  .jsl__infogrid{ grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .jsl__infobox{ min-height: var(--jsl-infobox-minh-m, var(--jsl-infobox-minh, auto)) !important; }
  .jsl .jsl__infobox{ min-height: var(--jsl-infobox-minh-m, var(--jsl-infobox-minh, auto)) !important; }
  .jsl__infotitle{ font-size: var(--jsl-infobox-title-fs-m, var(--jsl-infobox-title-fs, 13px)); }
  .jsl__infodesc{ font-size: var(--jsl-infobox-text-fs-m, var(--jsl-infobox-text-fs, 12px)); }
}
@media (max-width: 520px){
  /* Mobile: 2 columns */
  .jsl__infogrid{ grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  .jsl__infobox{ padding: 12px 12px; gap: 10px; }
  .jsl__infoicon{ width: 36px; height: 36px; flex-basis: 36px; }
  .jsl__infoimg{ width: 20px; height: 20px; }
}

.jsl__footer{
  margin-top: var(--jsl-vgap);
  background: var(--jsl-footer-bg);
  border-radius: calc(var(--jsl-radius) + 10px);
  padding: var(--jsl-footer-pt, 12px) 16px var(--jsl-footer-pb, 12px);
  box-shadow: 0 10px 30px rgba(0,0,0,var(--jsl-shadow-b));
}

.jsl__footergrid{
  display:grid;
  grid-template-columns: 1fr auto 1fr;
  gap: 14px;
  align-items:center;
}

.jsl__footcol{
  font-size: var(--jsl-fs-footer-trust);
  color: var(--jsl-muted);
  opacity: .88;
  line-height: 1.35;
}
.jsl__footcol--left{ text-align:left; }
.jsl__footcol--center{ text-align:center; }
.jsl__footcol--right{ text-align:right; }
.jsl__footimg{ max-height: 44px; width:auto; display:inline-block; }

.jsl__footlinks{ display:flex; gap: 10px; flex-wrap: wrap; align-items:center; justify-content:flex-end; }
.jsl__footlink{ color: var(--jsl-ink) !important; text-decoration:none; font-size: var(--jsl-fs-footer-link); opacity:.82; }
.jsl__footlink:hover{ opacity:1; text-decoration:underline; }
.jsl__sep{ opacity:.5; color: var(--jsl-muted); }

/* Responsive */
@media (max-width: 980px){
  .jsl__footer{ padding: var(--jsl-footer-pt-m, var(--jsl-footer-pt, 12px)) 16px var(--jsl-footer-pb-m, var(--jsl-footer-pb, 12px)); }
  .jsl__storycard,
  .jsl__chapter2{ grid-template-columns: 1fr; }
  .jsl__h2{ font-size: var(--jsl-fs-h2-sm); }
  .jsl__h1{ font-size: var(--jsl-fs-h2-sm); }
  .jsl__grid{ grid-template-columns: repeat(var(--jsl-cols-t, 2), minmax(0, 1fr)); }
  .jsl__tilesGrid{ grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 520px){
  .jsl__tileMedia{ height: var(--jsl-ctile-h-sm); }
  .jsl__tileBadge{ top:10px; right:10px; padding:8px 10px; font-size:11px; }
  .jsl__tileLabel{ left:10px; right:10px; bottom:10px; max-width:none; padding:9px 12px; border-radius:16px; font-size:12px; }
  .jsl__cardbody{ padding-top: var(--jsl-prod-body-pt-m, var(--jsl-prod-body-pt, 12px)); }
  /* Mobile polish (Step 5.3) */
  .jsl{ --jsl-pad-x-m: 14px; --jsl-pad-y: 22px !important; --jsl-gap: 12px !important; --jsl-vgap: var(--jsl-vgap-m) !important; --jsl-vgap-tight: var(--jsl-vgap-m-tight) !important; --jsl-gap-ch-tiles: var(--jsl-gap-ch-tiles-m) !important; --jsl-gap-tiles-prod: var(--jsl-gap-tiles-prod-m) !important; }
  .jsl__storycard,
  .jsl__chapter2{ padding: 12px; border-radius: calc(var(--jsl-radius) + 8px); }
  .jsl__anchors{ padding: 6px; gap: 8px; }
  .jsl__chip{ padding: 7px 10px; }
  /* Product grid columns on mobile */
  .jsl__grid{ grid-template-columns: repeat(var(--jsl-cols-m, 2), minmax(0, 1fr)); }
  .jsl__tilesGrid{ grid-template-columns: 1fr; }
  .jsl__top{ align-items:flex-start; }
  .jsl__nav{ gap: 10px; }
  .jsl__footergrid{ grid-template-columns: 1fr; text-align:center; }
  .jsl__footcol--left,
  .jsl__footcol--right{ text-align:center; }
  .jsl__footlinks{ justify-content:center; }
}

/* Embedded checkout (rendered in iframe with ?jsl_embed=1) */
.jsl-embed-checkout{
  margin: 0;
  padding: 0;
  background: #fff;
}
.jsl-embed-checkout__wrap{
  padding: 16px;
}

/* Size guide (quick-view modal) */
.jsl .jslqv__sgrow,
.jsl__modal .jslqv__sgrow{ margin: 8px 0 10px; display:flex; justify-content:flex-start; }

/* Sticky size guide trigger inside quick-view modal (always reachable while scrolling) */
.jsl__modal .jslqv__sgrow{
  position: sticky;
  /* Leave space for the sticky close button */
  top: 52px;
  z-index: 20;
  background: rgba(255,255,255,0.98);
  /* Extend the clickable row a bit for better UX */
  padding: 10px 0;
  margin: 0 0 10px;
}
.jsl .jslqv__sgbtn,
.jsl__modal .jslqv__sgbtn{
  display:inline-flex;
  align-items:center;
  gap: 8px;
  border: 1px solid var(--jsl-sg-border, rgba(0,0,0,.10));
  background: var(--jsl-sg-bg, rgba(0,0,0,.03));
  padding: 8px 12px;
  border-radius: 999px;
  cursor: pointer;
  color: var(--jsl-sg-text, var(--jsl-primary)) !important;
  font-weight: 900;
  font-size: 13px;
  line-height: 1;
  opacity: 1 !important;
  position: relative;
  z-index: 2;
}

.jsl .jslqv__sgbtn--link,
.jsl__modal .jslqv__sgbtn--link{
  background: transparent !important;
  border-color: transparent !important;
  padding: 0;
  border-radius: 0;
}
.jsl .jslqv__sgbtn--link:hover,
.jsl__modal .jslqv__sgbtn--link:hover{
  background: transparent !important;
  text-decoration: underline;
}

.jsl .jslqv__sgbtn--solid,
.jsl__modal .jslqv__sgbtn--solid{
  border-radius: 10px;
  padding: 10px 14px;
  font-weight: 900;
}
.jsl .jslqv__sgbtn:hover,
.jsl__modal .jslqv__sgbtn:hover{ text-decoration: none; background: var(--jsl-sg-bg-hover, rgba(0,0,0,.06)); }
.jsl .jslqv__sgbtn:focus,
.jsl__modal .jslqv__sgbtn:focus{ outline: none; box-shadow: 0 0 0 3px rgba(0,0,0,.12); }
.jsl .jslqv__sgico,
.jsl__modal .jslqv__sgico{ display:inline-flex; opacity: 1; }

.jsl .jslqv__sg,
.jsl__modal .jslqv__sg{ position: fixed; inset: 0; z-index: 99999; display:flex; align-items:center; justify-content:center; }
.jsl .jslqv__sg[hidden],
.jsl__modal .jslqv__sg[hidden]{ display:none !important; }
.jsl .jslqv__sgbackdrop,
.jsl__modal .jslqv__sgbackdrop{ position:absolute; inset:0; background: rgba(0,0,0,.55); }
.jsl .jslqv__sgpanel,
.jsl__modal .jslqv__sgpanel{
  position: relative;
  width: min(92vw, 980px);
  max-height: 88vh;
  background: #fff;
  border-radius: 18px;
  overflow: hidden;
  box-shadow: 0 18px 50px rgba(0,0,0,.35);
}
.jsl .jslqv__sghead,
.jsl__modal .jslqv__sghead{ display:flex; align-items:center; justify-content:space-between; padding: 12px 14px; border-bottom: 1px solid rgba(0,0,0,.08); }
.jsl .jslqv__sgtitle,
.jsl__modal .jslqv__sgtitle{ font-weight: 900; font-size: 14px; color: #111; }
.jsl .jslqv__sgclose,
.jsl__modal .jslqv__sgclose{
  border: 0;
  background: var(--jsl-sg-bg-hover, rgba(0,0,0,.06));
  color: #111;
  width: 34px;
  height: 34px;
  border-radius: 10px;
  cursor: pointer;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size: 20px;
  line-height: 1;
}
.jsl .jslqv__sgclose:hover,
.jsl__modal .jslqv__sgclose:hover{ background: rgba(0,0,0,.10); }
.jsl .jslqv__sgbody,
.jsl__modal .jslqv__sgbody{ padding: 10px; overflow:auto; max-height: calc(88vh - 54px); }
.jsl .jslqv__sgimg,
.jsl__modal .jslqv__sgimg{ width:100%; height:auto; display:block; border-radius: 12px; }

/* ===== Category page (MS-CAT1) ===== */
.jsl--cat .jsl__wrap{max-width:var(--jsl-maxw);margin:0 auto;padding:var(--jsl-pady) var(--jsl-padx);}
.jsl--cat .jsl__shell{background:var(--jsl-bg);}
.jsl--cat .jsl-catHero .jsl__storyimg{
  /* default behaves like story cards (16:9). If height is set on preset, aspect-ratio becomes auto. */
  aspect-ratio: var(--jsl-cat-hero-ar, 16/9);
  height: var(--jsl-cat-hero-h, auto);
  max-height: var(--jsl-cat-hero-max-vh, none);
}

/* Hero overlay for contrast (optional; controlled by preset variables) */
.jsl--cat .jsl-catHero .jsl__storyimg::after{
  content: "";
  position:absolute;
  inset:0;
  border-radius: inherit;
  pointer-events:none;
  background: var(--jsl-cat-hero-ov-bg, transparent);
}
@media (max-width: 720px){
  .jsl--cat .jsl-catHero .jsl__storyimg{
    aspect-ratio: var(--jsl-cat-hero-ar-m, var(--jsl-cat-hero-ar, 16/9));
    height: var(--jsl-cat-hero-h-m, var(--jsl-cat-hero-h, auto));
    max-height: var(--jsl-cat-hero-max-vh-m, var(--jsl-cat-hero-max-vh, none));
  }

  .jsl--cat .jsl-catHero .jsl__storyimg::after{
    background: var(--jsl-cat-hero-ov-bg-m, var(--jsl-cat-hero-ov-bg, transparent));
  }
}

.jsl--cat .jsl-catHero__video,
.jsl--cat .jsl-catHero__img{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position: var(--jsl-cat-hero-pos-x, center) var(--jsl-cat-hero-pos-y, center);
  display:block;
  border-radius:var(--jsl-radius);
}

.jsl--cat .jsl-catHero__intro{
  margin-top: 8px;
  color: var(--jsl-muted);
  font-size: var(--jsl-fs-p, 14px);
  line-height: 1.55;
}
.jsl--cat .jsl-catHero__intro p{ margin: 0.55em 0 0; }
.jsl--cat .jsl-catHero__intro p:first-child{ margin-top: 0; }

.jsl--cat .jsl-catProducts__head{
  margin-bottom: 16px;
}
.jsl--cat .jsl-catTools{
  display:grid;
  grid-template-columns: minmax(0, 1fr) minmax(280px, 360px);
  gap: 16px;
  align-items:end;
}
.jsl--cat .jsl-catTools__summary{
  display:flex;
  flex-direction:column;
  gap: 10px;
  min-width:0;
}
.jsl--cat .jsl-catProducts__head .jsl__h3{
  margin: 0;
  min-height: 48px;
  align-items:center;
}
.jsl--cat .jsl-catProducts__spacer{
  min-height: 48px;
}
.jsl--cat .jsl-catTools__chips{
  display:flex;
  flex-wrap:wrap;
  gap: 8px;
}
.jsl--cat .jsl-catTools__chip{
  display:inline-flex;
  align-items:center;
  min-height: 34px;
  padding: 6px 12px;
  border-radius: 999px;
  border: 1px solid rgba(0,0,0,.08);
  background: rgba(255,255,255,.90);
  box-shadow: 0 8px 20px rgba(0,0,0,.05);
  font-size: 12px;
  line-height: 1.35;
  color: rgba(0,0,0,.72);
}
.jsl--cat .jsl-catTools__chip--sort{
  font-weight: 700;
  color: rgba(0,0,0,.82);
}

.jsl--cat .jsl-catTools__chip--fav{
  appearance:none;
  -webkit-appearance:none;
  cursor:pointer;
  font-weight: 700;
}
.jsl--cat .jsl-catTools__chip--fav[aria-pressed="true"]{
  color: #b2124b;
}
.jsl--cat .jsl-catTools__chip--fav.is-has-items{
  border-color: rgba(178,18,75,.16);
}
.jsl--cat .jsl-catSearch{
  display:flex;
  flex-direction:column;
  gap: 8px;
  justify-self:end;
  width:100%;
}
.jsl--cat .jsl-catSearch__shell{
  display:flex;
  align-items:center;
  gap: 10px;
  min-height: 48px;
  padding: 0 14px;
  border-radius: 999px;
  border: 1px solid rgba(0,0,0,.10);
  background: rgba(255,255,255,.96);
  box-shadow: 0 10px 24px rgba(0,0,0,.08);
  transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease;
}
.jsl--cat .jsl-catSearch__shell:focus-within{
  border-color: rgba(0,0,0,.18);
  box-shadow: 0 14px 30px rgba(0,0,0,.12);
  transform: translateY(-1px);
}
.jsl--cat .jsl-catSearch__icon{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width: 18px;
  height: 18px;
  color: rgba(0,0,0,.48);
  flex: 0 0 auto;
}
.jsl--cat .jsl-catSearch__icon svg{
  width: 18px;
  height: 18px;
  display:block;
}
.jsl--cat .jsl-catSearch__input{
  appearance:none;
  -webkit-appearance:none;
  width:100%;
  min-width:0;
  border:0;
  outline:0;
  background:transparent;
  padding: 12px 0;
  font: inherit;
  color: inherit;
  box-shadow:none !important;
}
.jsl--cat .jsl-catSearch__input::placeholder{
  color: rgba(0,0,0,.48);
  opacity: 1;
}
.jsl--cat .jsl-catSearch__clear{
  appearance:none;
  -webkit-appearance:none;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width: 30px;
  height: 30px;
  border: 0;
  border-radius: 999px;
  background: rgba(0,0,0,.06);
  color: rgba(0,0,0,.62);
  cursor: pointer;
  flex: 0 0 auto;
  transition: background .18s ease, color .18s ease, transform .18s ease;
}
.jsl--cat .jsl-catSearch__clear:hover,
.jsl--cat .jsl-catSearch__clear:focus-visible{
  background: rgba(0,0,0,.12);
  color: rgba(0,0,0,.82);
  transform: scale(1.03);
}
.jsl--cat .jsl-catSearch__clear[hidden]{
  display:none !important;
}
.jsl--cat .jsl-catSearch__clear span{
  font-size: 18px;
  line-height: 1;
  transform: translateY(-1px);
}
.jsl--cat .jsl-catSearch__meta{
  padding: 0 12px;
  font-size: 12px;
  line-height: 1.4;
  color: var(--jsl-muted);
  opacity: .82;
  text-align:right;
}
.jsl--cat .jsl-catSearch__meta.is-searching{
  opacity: .95;
}
.jsl--cat .jsl-catSearch__meta.is-empty{
  opacity: 1;
}
.jsl--cat .jsl-catProducts .jsl__card{
  transition: opacity .16s ease, transform .16s ease;
}
.jsl--cat .jsl-catProducts .jsl__card.is-jsl-search-hidden{
  opacity: 0;
  transform: scale(.985);
  pointer-events: none;
}
.jsl--cat .jsl-catProducts .jsl__card[hidden],
.jsl--cat .jsl-catProducts .jsl__card.is-jsl-search-hidden[hidden]{
  display: none !important;
}
.jsl--cat .jsl-catEmpty{
  margin: 14px 0 2px;
}
.jsl--cat .jsl-catEmpty[hidden]{
  display:none !important;
}
.jsl--cat .jsl-catEmpty__box{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap: 6px;
  padding: 18px 20px;
  border-radius: 18px;
  border: 1px solid rgba(0,0,0,.08);
  background: rgba(255,255,255,.86);
  text-align:center;
  box-shadow: 0 10px 24px rgba(0,0,0,.05);
}
.jsl--cat .jsl-catEmpty__box strong{
  font-size: 15px;
  line-height: 1.35;
}
.jsl--cat .jsl-catEmpty__box span{
  font-size: 13px;
  line-height: 1.45;
  color: var(--jsl-muted);
}
.jsl--cat .jsl-catEmpty__action{
  appearance:none;
  -webkit-appearance:none;
  margin-top: 4px;
  min-height: 38px;
  padding: 0 16px;
  border: 1px solid rgba(0,0,0,.10);
  border-radius: 999px;
  background: rgba(255,255,255,.98);
  color: rgba(0,0,0,.82);
  font-size: 13px;
  font-weight: 700;
  cursor: pointer;
  box-shadow: 0 10px 20px rgba(0,0,0,.06);
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.jsl--cat .jsl-catEmpty__action:hover,
.jsl--cat .jsl-catEmpty__action:focus-visible{
  transform: translateY(-1px);
  border-color: rgba(0,0,0,.18);
  box-shadow: 0 14px 28px rgba(0,0,0,.10);
}
.jsl--cat .jsl-catEmpty__action[hidden]{
  display:none !important;
}
.jsl-favToastStack{
  position: fixed;
  right: 18px;
  bottom: 18px;
  z-index: 9999;
  display:flex;
  flex-direction:column;
  gap: 8px;
  pointer-events:none;
}
.jsl-favToast{
  max-width: min(320px, calc(100vw - 24px));
  padding: 11px 14px;
  border-radius: 14px;
  background: rgba(16,16,16,.94);
  color: #fff;
  font-size: 13px;
  line-height: 1.4;
  box-shadow: 0 16px 36px rgba(0,0,0,.22);
  opacity: 0;
  transform: translateY(8px);
  transition: opacity .2s ease, transform .2s ease;
}
.jsl-favToast.is-visible{
  opacity: 1;
  transform: translateY(0);
}
.jsl--cat .jsl-catProducts.is-jsl-search-active .jsl-catMore{
  display: none;
}
@media (max-width: 720px){
  .jsl--cat .jsl-catTools{
    grid-template-columns: 1fr;
    align-items:start;
  }
  .jsl--cat .jsl-catProducts__head .jsl__h3,
  .jsl--cat .jsl-catProducts__spacer{
    min-height: 0;
  }
  .jsl--cat .jsl-catTools__summary{
    gap: 8px;
  }
  .jsl--cat .jsl-catTools__chips{
    gap: 6px;
  }
  .jsl--cat .jsl-catSearch{
    justify-self:stretch;
  }
  .jsl--cat .jsl-catSearch__meta{
    text-align:left;
    padding-left: 4px;
    padding-right: 4px;
  }
}

@media (max-width: 720px){
  .jslqv__titlebar{
    flex-direction: column;
    align-items: stretch;
  }
  .jslqv__favbtn{
    justify-content:center;
  }
}

.jsl--cat .jsl-catMore{display:flex;align-items:center;justify-content:center;gap:10px;padding:18px 0;}
.jsl--cat .jsl-catMore__btn{display:none;}
.jsl--cat .jsl-catProducts[data-load-mode="button"] .jsl-catMore__btn{display:inline-flex;}
.jsl--cat .jsl-catMore__loader{width:16px;height:16px;border-radius:50%;border:2px solid rgba(0,0,0,.18);border-top-color:rgba(0,0,0,.55);opacity:0;transform:scale(.9);}
.jsl--cat .jsl-catMore.is-loading .jsl-catMore__loader{opacity:1;animation:jslSpin .8s linear infinite;}
.jsl--cat .jsl-catMore.is-done{opacity:.6;}
@keyframes jslSpin{to{transform:rotate(360deg);}}

/* Back-to-top button */
.jsl .jsl__totop{
  position: fixed;
  right: calc(16px + env(safe-area-inset-right, 0px));
  bottom: calc(16px + env(safe-area-inset-bottom, 0px));
  z-index: 99995;
  width: 44px;
  height: 44px;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.18);
  background: rgba(0,0,0,.62);
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 10px 24px rgba(0,0,0,.22);
  opacity: 0;
  transform: translateY(10px);
  pointer-events: none;
  transition: opacity .2s ease, transform .2s ease;
}
.jsl .jsl__totop.is-visible{
  opacity: 1;
  transform: translateY(0);
  pointer-events: auto;
}
.jsl .jsl__totop:focus{
  outline: 2px solid rgba(255,255,255,.5);
  outline-offset: 2px;
}
.jsl .jsl__totopicon{ font-size: 18px; line-height: 1; }

/* Mobile sticky bar (cart + checkout) */
.jsl .jsl__stickybar{
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 99994;
  display: flex;
  gap: 10px;
  align-items: center;
  padding: 10px 10px calc(10px + env(safe-area-inset-bottom, 0px));
  background: rgba(255,255,255,0.94);
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
  border-top: 1px solid rgba(0,0,0,.08);
  box-shadow: 0 -12px 30px rgba(0,0,0,.12);
}

.jsl .jsl__stickybar[hidden]{ display:none !important; }

/* Only show on tablet/mobile */
@media (min-width: 981px){
  .jsl .jsl__stickybar{ display:none !important; }
}

/* Avoid overlap with the back-to-top button */
@media (max-width: 980px){
  .jsl.jsl--stickybar-on{
    padding-bottom: calc(var(--jsl-pad-y) + 74px + env(safe-area-inset-bottom, 0px));
  }
  .jsl.jsl--stickybar-on .jsl__totop{
    bottom: calc(76px + env(safe-area-inset-bottom, 0px));
  }
}

/* Hide sticky bar while any JSL modal is open */
body.jsl-modal-open .jsl .jsl__stickybar{ display:none !important; }

.jsl .jsl__stickycart{
  position: relative;
  width: 46px;
  height: 46px;
  border-radius: 999px;
  border: 1px solid rgba(0,0,0,.10);
  background: rgba(0,0,0,.06);
  color: var(--jsl-ink);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
}

.jsl .jsl__stickycart:hover{ background: rgba(0,0,0,.08); }

.jsl .jsl__stickycarticon{
  font-size: 18px;
  line-height: 1;
}

.jsl .jsl__stickycartcount{
  position: absolute;
  top: -6px;
  right: -6px;
  min-width: 20px;
  height: 20px;
  padding: 0 6px;
  border-radius: 999px;
  background: var(--jsl-primary);
  color: #fff;
  font-weight: 800;
  font-size: 12px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 8px 18px rgba(0,0,0,.18);
}

/* Optional subtotal (hidden on very small screens) */
.jsl .jsl__stickymeta{
  display: none;
  flex: 1 1 auto;
  min-width: 0;
}
@media (min-width: 420px){
  .jsl .jsl__stickymeta{ display:block; }
}

.jsl .jsl__stickysubtotal{
  font-size: 12px;
  color: var(--jsl-muted);
  line-height: 1.1;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.jsl .jsl__stickycheckout{
  flex: 1 1 auto;
  min-width: 0;
  height: 46px;
  border-radius: 999px !important;
  padding: 0 18px !important;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

/* Make the sticky checkout CTA less dominant on tablet/mobile */
@media (max-width: 980px){
  .jsl .jsl__stickycheckout{
    flex: 0 0 auto;
    width: 48vw;
    max-width: 280px;
    min-width: 140px;
    height: 40px;
    padding: 0 14px !important;
    font-size: 14px;
  }
}

/* Override checkout button min-width inside sticky bar */
.jsl .jsl__stickybar .jsl__btn--checkout{
  min-width: 0;
}

/* Skeleton loaders (premium feel) */
.jsl .jsl__skel{
  border-radius: 12px;
  background: linear-gradient(90deg, rgba(0,0,0,.06) 0%, rgba(0,0,0,.11) 45%, rgba(0,0,0,.06) 90%);
  background-size: 220% 100%;
  animation: jslShimmer 1.2s linear infinite;
}
@keyframes jslShimmer{
  0%{ background-position: 180% 0; }
  100%{ background-position: -40% 0; }
}
@media (prefers-reduced-motion: reduce){
  .jsl .jsl__skel{ animation: none; background-size: 100% 100%; }
}

.jsl .jsl__card--skel{
  pointer-events: none;
  transform: none !important;
  transition: none !important;
}
.jsl .jsl__card--skel:hover{ transform: none !important; }
.jsl .jsl__card--skel .jsl__cardimg{ background: rgba(0,0,0,.04); }
.jsl .jsl__skel--img{ width: 100%; height: 100%; display:block; }

.jsl .jsl__skel--line{ height: 12px; margin: 0 0 10px; }
.jsl .jsl__skel--line.is-sm{ width: 70%; }
.jsl .jsl__skel--btn{ height: 34px; border-radius: 999px; flex: 1 1 120px; }

/* Quick-view skeleton */
.jsl .jsl__qvskel{
  display: grid;
  grid-template-columns: 1.1fr .9fr;
  gap: 14px;
  padding: 12px;
}
@media (max-width: 980px){
  .jsl .jsl__qvskel{ grid-template-columns: 1fr; }
}
.jsl .jsl__qvskelMedia{
  aspect-ratio: var(--jsl-ratio);
  border-radius: var(--jsl-radius);
  overflow: hidden;
  background: rgba(0,0,0,.04);
}
.jsl .jsl__skel--qvimg{ width: 100%; height: 100%; display:block; }
.jsl .jsl__qvskelBody{ display:flex; flex-direction:column; }
.jsl .jsl__skel--h{ height: 22px; width: 62%; margin: 2px 0 14px; border-radius: 10px; }
.jsl .jsl__qvskelBtns{ display:flex; gap: 10px; margin-top: auto; }

/* MS-CART-1 — redesigned cart modal */
.jsl__cartmodal .jsl__modalpanel{
  width: min(852px, calc(100vw - 40px));
  max-width: 852px;
  max-height: 88vh;
  padding: 20px;
  background: rgba(255,255,255,.98);
  border: 1px solid rgba(0,0,0,.06);
}

.jsl__cartmodal .jsl__modalcontent{
  gap: 16px;
}

.jsl__carthead{
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 0;
  padding-right: 56px;
}

.jsl__carttitle{
  font-size: calc(var(--jsl-fs-modal-title) - 1px);
  font-weight: 900;
}

.jsl__cartmodal [data-jsl-cartview="cart"]{
  display: flex;
  flex-direction: column;
  gap: 14px;
}

.jsl__minicart{
  display: block;
  overflow: auto;
  max-height: calc(88vh - 176px);
  padding-right: 4px;
}

.jsl__cartbody{
  display: flex;
  flex-direction: column;
  gap: 18px;
}

.jsl__cartitems{
  display: flex;
  flex-direction: column;
  gap: 14px;
}

.jsl__cartitem{
  position: relative;
  display: grid;
  grid-template-columns: minmax(132px, 164px) minmax(0, 1fr);
  gap: 18px;
  padding: 16px;
  border-radius: calc(var(--jsl-radius) + 2px);
  background: linear-gradient(180deg, rgba(255,255,255,.96), rgba(244,248,252,.96));
  border: 1px solid rgba(0,0,0,.07);
  box-shadow: 0 12px 28px rgba(0,0,0,.06);
}

.jsl__cartitemimage,
.jsl__cartitemimage img{
  display: block;
  width: 100%;
}

.jsl__cartitemimage{
  border-radius: calc(var(--jsl-radius) - 2px);
  overflow: hidden;
  background: #f6f8fb;
  text-decoration: none;
}

.jsl__cartitemimage img{
  aspect-ratio: 4 / 5;
  object-fit: contain;
  padding: 8px;
  background: #fff;
}

.jsl__cartitemmain{
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 14px;
}

.jsl__cartitemtop{
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}

.jsl__cartitemcopy{
  min-width: 0;
}

.jsl__cartitemtitle{
  display: inline-block;
  color: var(--jsl-primary) !important;
  text-decoration: none;
  font-weight: 800;
  font-size: 20px;
  line-height: 1.25;
}

.jsl__cartitemtitle:hover{
  text-decoration: underline;
}

.jsl__cartitemmeta{
  margin-top: 10px;
  color: var(--jsl-muted);
  font-size: 14px;
}

.jsl__cartitemmeta dl.variation{
  margin: 0;
  display: grid;
  grid-template-columns: max-content 1fr;
  gap: 6px 12px;
}

.jsl__cartitemmeta dl.variation dt,
.jsl__cartitemmeta dl.variation dd{
  margin: 0;
}

.jsl__cartitemmeta dl.variation dt{
  font-weight: 700;
  color: var(--jsl-ink);
}

.jsl__cartremove{
  position: static !important;
  flex: 0 0 auto;
  width: 36px !important;
  height: 36px !important;
  border-radius: 999px;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  background: rgba(0,0,0,.05);
  color: var(--jsl-ink) !important;
  text-decoration: none;
  font-size: 22px;
  line-height: 1;
}

.jsl__cartremove:hover{
  background: rgba(0,0,0,.10) !important;
}

.jsl__cartitemstats{
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}

.jsl__cartstat{
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  gap: 4px;
  padding: 11px 12px;
  border-radius: 14px;
  background: rgba(0,0,0,.045);
  border: 1px solid rgba(0,0,0,.05);
  min-height: 58px;
  min-width: 0;
}

.jsl__cartstat--member{
  background: rgba(12,140,98,.06);
  border-color: rgba(12,140,98,.12);
}

.jsl__cartstat--save{
  background: rgba(0,138,96,.08);
  border-color: rgba(0,138,96,.12);
}

.jsl__cartstatlabel{
  font-size: 12px;
  font-weight: 700;
  color: var(--jsl-muted);
}

.jsl__cartstatvalue,
.jsl__cartstatvalue .amount,
.jsl__cartstatvalue del,
.jsl__cartstatvalue ins{
  font-size: 14px;
  font-weight: 800;
  color: var(--jsl-ink);
}

.jsl__cartstatvalue del,
.jsl__cartstatvalue ins{
  text-decoration: none;
}

.jsl__cartstat--member .jsl__cartstatvalue,
.jsl__cartstat--member .amount,
.jsl__cartstat--save .jsl__cartstatvalue,
.jsl__cartstat--save .amount{
  color: #0c8c62;
}

.jsl__cartitembottom{
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 14px;
  padding-top: 6px;
  border-top: 1px solid rgba(0,0,0,.08);
}

.jsl__cartitemqtyline{
  color: var(--jsl-muted);
  font-size: 14px;
}

.jsl__cartitemtotal,
.jsl__cartitemtotal .amount{
  font-size: 20px;
  font-weight: 500;
  color: var(--jsl-ink);
}

.jsl__cartsummarywrap{
  position: sticky;
  bottom: 0;
  z-index: 2;
  padding-top: 8px;
  background: linear-gradient(to bottom, rgba(255,255,255,0), rgba(255,255,255,.96) 24%, rgba(255,255,255,.99) 100%);
}

.jsl__cartsummary{
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(280px, 420px);
  gap: 18px;
  align-items: center;
  padding: 16px 18px;
  border-radius: calc(var(--jsl-radius) + 4px);
  background: rgba(245,249,253,.98);
  border: 1px solid rgba(0,0,0,.07);
  box-shadow: 0 12px 30px rgba(0,0,0,.08);
}

.jsl__cartsummaryintro{
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.jsl__cartsummaryeyebrow{
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--jsl-muted);
}

.jsl__cartsummarycount{
  font-size: 15px;
  font-weight: 700;
  color: var(--jsl-ink);
}

.jsl__cartsummaryrows{
  display: grid;
  gap: 10px;
}

.jsl__cartsummaryrow{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.jsl__cartsummarylabel{
  font-size: 14px;
  font-weight: 700;
  color: var(--jsl-muted);
}

.jsl__cartsummaryvalue,
.jsl__cartsummaryvalue .amount,
.jsl__cartsummaryvalue small{
  font-size: calc(var(--jsl-fs-modal-price) + 3px);
  font-weight: 900;
  color: var(--jsl-ink);
}

.jsl__cartsummaryvalue--save,
.jsl__cartsummaryvalue--save .amount{
  color: #0c8c62;
}

.jsl__cartcta{
  margin-top: 0;
  padding: 0;
  background: none;
  position: static;
  justify-content: stretch;
}

.jsl__btn--checkout{
  width: 100%;
  min-width: 0;
  min-height: 52px;
  font-size: 15px;
}

@media (max-width: 980px){
  .jsl__cartmodal .jsl__modalpanel{
    width: min(99vw, calc(100vw - 10px));
    max-width: 99vw;
    max-height: 92vh;
    padding: 16px;
  }

  .jsl__minicart{
    max-height: calc(92vh - 170px);
  }

  .jsl__cartitem{
    grid-template-columns: 110px minmax(0, 1fr);
    gap: 14px;
  }

  .jsl__cartsummary{
    grid-template-columns: 1fr;
  }

  .jsl__cartitemstats{
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 640px){
  .jsl__carthead{
    padding-right: 48px;
  }

  .jsl__cartitem{
    grid-template-columns: 1fr;
  }

  .jsl__cartitemimage img{
    max-height: 260px;
  }

  .jsl__cartitemstats{
    grid-template-columns: 1fr;
  }

  .jsl__cartitemtop,
  .jsl__cartitembottom,
  .jsl__cartsummaryrow{
    flex-direction: column;
    align-items: flex-start;
  }

  .jsl__cartremove{
    position: absolute !important;
    top: 14px;
    right: 14px;
  }

  .jsl__cartitemtotal,
  .jsl__cartitemtotal .amount{
    font-size: 20px;
  }

  .jsl__cartsummaryvalue,
  .jsl__cartsummaryvalue .amount,
  .jsl__cartsummaryvalue small{
    font-size: calc(var(--jsl-fs-modal-price) + 2px);
  }
}

body.jako-club-ui .jsl__clubmeta,
body.jako-club-ui .jsl__clubmeta *,
body.jako-club-ui .jsl__clubmeta-badge,
body.jako-club-ui .jsl__clubmeta-value{
  font-family: inherit !important;
}
body.jako-club-ui .jsl__clubmeta-badge{
  font-size:9px !important;
  font-weight:600 !important;
  line-height:1.05 !important;
}
body.jako-club-ui .jsl__clubmeta-label{
  font-size:11px !important;
  font-weight:500 !important;
  line-height:1.15 !important;
}
body.jako-club-ui .jsl__clubmeta-value{
  font-size:12px !important;
  font-weight:500 !important;
  line-height:1.15 !important;
}

body.jako-club-ui .jslqv__clubmeta,
body.jako-club-ui .jslqv__clubmeta *,
body.jako-club-ui .jslqv__clubmeta-badge,
body.jako-club-ui .jslqv__clubmeta-value{
  font-family: inherit !important;
}
body.jako-club-ui .jslqv__clubmeta-badge{
  font-size:9px !important;
  font-weight:600 !important;
  line-height:1.05 !important;
}
body.jako-club-ui .jslqv__clubmeta-label{
  font-size:11px !important;
  font-weight:500 !important;
  line-height:1.15 !important;
}
body.jako-club-ui .jslqv__clubmeta-value{
  font-size:12px !important;
  font-weight:500 !important;
  line-height:1.15 !important;
}


/* MS-LB-PAIRS-WELL-WITH-V1-1 */
.jslqv__pairs{
  margin-top: 18px;
  padding-top: 18px;
  border-top: 1px solid rgba(0,0,0,.08);
}
.jslqv__pairsHead{ margin: 0 0 12px; }
.jslqv__pairsTitle{
  margin: 0 0 4px;
  font-size: 18px;
  line-height: 1.25;
  color: var(--jsl-ink);
}
.jslqv__pairsIntro{
  margin: 0;
  font-size: 13px;
  line-height: 1.45;
  color: var(--jsl-muted);
}
.jslqv__pairsGrid{
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}
.jslqv__pairCard{
  display: flex;
  flex-direction: column;
  min-width: 0;
  border: 1px solid rgba(0,0,0,.08);
  border-radius: 16px;
  background: #fff;
  overflow: hidden;
}
.jslqv__pairMediaWrap{ background: rgba(0,0,0,.03); }
.jslqv__pairMedia{
  display: block;
  width: 100%;
  border: 0;
  padding: 0;
  margin: 0;
  background: transparent;
  cursor: pointer;
}
.jslqv__pairImg,
.jslqv__pairImgPh{
  display: block;
  width: 100%;
  aspect-ratio: 4/5;
  object-fit: cover;
}
.jslqv__pairImgPh{ background: linear-gradient(180deg, rgba(0,0,0,.04), rgba(0,0,0,.08)); }
.jslqv__pairBody{
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 12px;
}
.jslqv__pairName{
  font-size: 14px;
  line-height: 1.35;
  font-weight: 700;
  color: var(--jsl-ink);
}
.jslqv__pairPriceWrap .jsl__pricewrap{ margin: 0; }
.jslqv__pairPriceWrap .jsl__price{ font-size: 14px; }
.jslqv__pairPriceWrap .jsl__clubmeta{ margin-top: 6px; }
.jslqv__pairActions{
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-top: auto;
}
.jslqv__pairBtn{
  width: 100%;
  justify-content: center;
}
@media (max-width: 767px){
  .jslqv__pairsGrid{ grid-template-columns: 1fr; }
}


/* MS-LB-BUY-THE-SET-V1-1 */
.jslqv__buyset{
  margin-top: 18px;
  padding-top: 18px;
  border-top: 1px solid rgba(0,0,0,.08);
}
.jslqv__buysetHead{ margin: 0 0 12px; }
.jslqv__buysetTitle{
  margin: 0 0 4px;
  font-size: 18px;
  line-height: 1.25;
  color: var(--jsl-ink);
}
.jslqv__buysetIntro{
  margin: 0;
  font-size: 13px;
  line-height: 1.45;
  color: var(--jsl-muted);
}
.jslqv__buysetGrid{
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}
.jslqv__buysetCard{
  display: flex;
  flex-direction: column;
  min-width: 0;
  border: 1px solid rgba(0,0,0,.08);
  border-radius: 16px;
  background: #fff;
  overflow: hidden;
}
.jslqv__buysetMediaWrap{ background: rgba(0,0,0,.03); }
.jslqv__buysetMedia{
  display: block;
  width: 100%;
  border: 0;
  padding: 0;
  margin: 0;
  background: transparent;
  cursor: pointer;
}
.jslqv__buysetImg,
.jslqv__buysetImgPh{
  display: block;
  width: 100%;
  aspect-ratio: 4/5;
  object-fit: cover;
}
.jslqv__buysetImgPh{ background: linear-gradient(180deg, rgba(0,0,0,.04), rgba(0,0,0,.08)); }
.jslqv__buysetBody{
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 12px;
}
.jslqv__buysetName{
  font-size: 14px;
  line-height: 1.35;
  font-weight: 700;
  color: var(--jsl-ink);
}
.jslqv__buysetPriceWrap .jsl__pricewrap{ margin: 0; }
.jslqv__buysetPriceWrap .jsl__price{ font-size: 14px; }
.jslqv__buysetPriceWrap .jsl__clubmeta{ margin-top: 6px; }
.jslqv__buysetActions{
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-top: auto;
}
.jslqv__buysetBtn{
  width: 100%;
  justify-content: center;
}
@media (max-width: 767px){
  .jslqv__buysetGrid{ grid-template-columns: 1fr; }
}



/* MS-LB-LOOK-INSPIRATION-BLOCKS-1 + MEDIA/UI HOTFIX */
.jsl .jsl__insp{
  margin:22px 0 26px;
  padding:18px;
  border-radius:16px;
  background:#ffffff !important;
  border:1px solid rgba(17,24,39,.08);
  box-shadow:0 10px 28px rgba(17,24,39,.05);
}
.jsl__inspLayout{
  display:grid;
  grid-template-columns:minmax(250px,.52fr) minmax(0,1.48fr);
  gap:24px;
  align-items:start;
}
.jsl__inspContent{
  min-width:0;
}
.jsl__inspHead{
  max-width:420px;
  margin:0 0 14px;
}
.jsl__inspKicker{
  margin:0 0 6px;
  font-size:12px;
  font-weight:700;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--jsl-primary,#111827);
}
.jsl__inspTitle{
  margin:0 0 8px;
  font-size:28px;
  font-weight:600;
  line-height:1.15;
  color:var(--jsl-ink,#111827);
}
.jsl__inspText{
  margin:0;
  font-size:15px;
  line-height:1.6;
  color:var(--jsl-muted,#4b5563);
}
.jsl__inspGrid{
  display:grid;
  grid-template-columns:1fr;
  max-width:360px;
  gap:12px;
}
.jsl__inspCard{
  overflow:hidden;
  border-radius:16px;
  background:#fff;
  border:1px solid #e5e7eb;
  min-width:0;
}
.jsl__inspCard--compact{
  box-shadow:0 1px 2px rgba(17,24,39,.03);
}
.jsl__inspCardRow{
  display:grid;
  grid-template-columns:108px minmax(0,1fr);
  gap:14px;
  align-items:stretch;
  padding:12px;
}
.jsl__inspMedia,
.jsl__inspMedia:link,
.jsl__inspMedia:visited,
.jsl__inspHero,
.jsl__inspHero:link,
.jsl__inspHero:visited{
  display:block;
  width:100%;
  padding:0;
  border:0;
  background:transparent;
  text-decoration:none;
  cursor:pointer;
}
.jsl__inspMediaCol{
  width:108px;
  display:flex;
  flex-direction:column;
  align-items:stretch;
  justify-content:center;
}
.jsl__inspMediaWrap--thumb{
  width:108px;
}
.jsl__inspMedia--thumb{
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:12px;
  overflow:hidden;
  aspect-ratio:1/1;
  background:#eef1f4;
}
.jsl__inspThumb,
.jsl__inspThumbPh{
  display:block;
  width:100%;
  height:100%;
  aspect-ratio:1/1;
  object-fit:contain;
  object-position:center center;
  background:#eef1f4;
}
.jsl__inspBody{
  min-width:0;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
}
.jsl__inspMeta{
  margin:0 0 4px;
  font-size:10px;
  font-weight:700;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--jsl-primary,#111827);
}
.jsl__inspName{
  margin:0 0 8px;
  font-size:18px;
  font-weight:600;
  line-height:1.25;
  color:var(--jsl-ink,#111827);
}
.jsl__inspPriceWrap{
  margin:0 0 12px;
}
.jsl__inspPriceWrap .price{
  font-size:14px;
}
.jsl__inspPriceWrap .price,
.jsl__inspPriceWrap .woocommerce-Price-amount{
  line-height:1.35;
}
.jsl__inspActions{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
}
.jsl__inspActions--body{
  width:100%;
}
.jsl__inspActions--body .jsl__inspBtn{
  width:100%;
  justify-content:center;
}
.jsl__inspBtn{
  min-width:0;
  padding:8px 10px;
  font-size:13px;
  background:var(--jsl-prod-btn-bg) !important;
  color:var(--jsl-prod-btn-text) !important;
  border:var(--jsl-prod-btn-border-w, 0px) solid var(--jsl-prod-btn-border, transparent) !important;
  border-radius:var(--jsl-prod-btn-radius, 14px) !important;
}
.jsl__inspBtn:hover{
  background:var(--jsl-prod-btn-bg-hover) !important;
  color:var(--jsl-prod-btn-text-hover) !important;
  border-color:var(--jsl-prod-btn-border-hover, var(--jsl-prod-btn-border, transparent)) !important;
  filter:none;
}
.jsl__inspVisual{
  min-width:0;
  align-self:center;
}
.jsl__inspHero{
  display:block;
  width:100%;
  border-radius:16px;
  overflow:hidden;
  background:#eef1f4;
  max-height:420px;
}
.jsl__inspHeroImg,
.jsl__inspHeroPh{
  display:block;
  width:100%;
  height:auto;
  aspect-ratio:16/10;
  max-height:420px;
  object-fit:cover;
  background:#eef1f4;
}
@media (max-width: 991px){
  .jsl__inspLayout{
    grid-template-columns:1fr;
  }
  .jsl__inspGrid{
    max-width:none;
  }
  .jsl__inspVisual{
    order:2;
  }
  .jsl__inspContent{
    order:1;
  }
}
@media (max-width: 782px){
  .jsl__insp{
    padding:14px;
    margin:18px 0 22px;
  }
  .jsl__inspLayout{
    grid-template-columns:1fr;
  }
  .jsl__inspVisual{
    order:1;
  }
  .jsl__inspContent{
    order:2;
  }
  .jsl__inspTitle{
    font-size:22px;
  }
  .jsl__inspCardRow{
    grid-template-columns:88px minmax(0,1fr);
    gap:12px;
    padding:12px;
  }
  .jsl__inspMediaCol{
    width:88px;
  }
  .jsl__inspMediaWrap--thumb{
    width:88px;
  }
  .jsl__inspName{
    font-size:17px;
  }
  .jsl__inspHeroImg,
  .jsl__inspHeroPh{
    aspect-ratio:16/10;
    max-height:320px;
  }
}


/* Product combination stories (MS-LB-PRODUCT-COMBINATION-STORIES-1) */
.jsl .jsl__comboStories{
  margin-top: var(--jsl-vgap);
  padding: 20px;
  border-radius: calc(var(--jsl-radius) + 2px);
  background: #ffffff;
  box-shadow: 0 10px 26px rgba(0,0,0,.06);
}
.jsl__comboHead{
  margin-bottom: 16px;
  max-width: 760px;
}
.jsl__comboKicker{
  font-size: 12px;
  font-weight: 900;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: var(--jsl-primary);
  margin-bottom: 6px;
}
.jsl__comboTitle{
  margin: 0 0 6px;
  font-size: clamp(22px, 2.4vw, 32px);
  line-height: 1.12;
  font-weight: 800;
  color: var(--jsl-ink);
}
.jsl__comboText{
  margin: 0;
  font-size: 14px;
  color: var(--jsl-muted);
  line-height: 1.6;
}
.jsl__comboGrid{
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
}
.jsl__comboCard{
  display: grid;
  grid-template-columns: minmax(0, 44%) minmax(0, 56%);
  min-height: 100%;
  border: 1px solid rgba(17,17,17,.08);
  border-radius: 18px;
  overflow: hidden;
  background: #fff;
}
.jsl__comboVisual{
  background: #f3f3f3;
  min-height: 100%;
}
.jsl__comboImg,
.jsl__comboImgPh{
  display:block;
  width:100%;
  height:100%;
  min-height: 280px;
  object-fit: cover;
}
.jsl__comboImgPh{ background: linear-gradient(135deg, #efefef, #dadada); }
.jsl__comboBody{
  padding: 18px;
  display:flex;
  flex-direction:column;
  gap: 8px;
}
.jsl__comboEyebrow{
  font-size: 11px;
  font-weight: 900;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: var(--jsl-primary);
}
.jsl__comboStoryTitle{
  margin: 0;
  font-size: 22px;
  line-height: 1.15;
  font-weight: 700;
  color: var(--jsl-ink);
}
.jsl__comboStoryText{
  margin: 0;
  font-size: 14px;
  line-height: 1.6;
  color: var(--jsl-muted);
}
.jsl__comboProducts{
  margin-top: auto;
  display: grid;
  grid-template-columns: 1fr;
  gap: 10px;
}
.jsl__comboProd{
  display:grid;
  grid-template-columns: 80px minmax(0,1fr);
  gap: 12px;
  padding: 10px;
  border: 1px solid rgba(17,17,17,.08);
  border-radius: 14px;
  background: #fff;
}
.jsl__comboProdMedia,
.jsl__comboProdMedia:link,
.jsl__comboProdMedia:visited{
  display:block;
  width:100%;
  text-decoration:none;
  color:inherit;
  border:0;
  background:transparent;
  padding:0;
  cursor:pointer;
}
.jsl__comboProdImg,
.jsl__comboProdPh{
  display:block;
  width:100%;
  aspect-ratio: 4 / 5;
  object-fit: cover;
  border-radius: 10px;
  background: #f2f2f2;
}
.jsl__comboProdBody{
  min-width: 0;
  display:flex;
  flex-direction:column;
  gap: 6px;
}
.jsl__comboProdName{
  font-size: 14px;
  line-height: 1.3;
  font-weight: 600;
  color: var(--jsl-ink);
}
.jsl__comboProdPrice .price,
.jsl__comboProdPrice .woocommerce-Price-amount{
  font-size: 14px;
}
.jsl__comboProdActions{
  margin-top: auto;
}
.jsl__comboBtn{
  width:100%;
  justify-content:center;
}
@media (max-width: 1024px){
  .jsl__comboGrid{ grid-template-columns: 1fr; }
}
@media (max-width: 640px){
  .jsl .jsl__comboStories{ padding: 16px; }
  .jsl__comboCard{ grid-template-columns: 1fr; }
  .jsl__comboImg,
  .jsl__comboImgPh{ min-height: 220px; }
}

/* Hide legacy QV debug panel in production */
#jsl-qv-debug{display:none !important;}
#jsl-qv-debug-style{display:none !important;}