/** Shopify CDN: Minification failed

Line 176:12 Unexpected "{"

**/
/*===========================
=       FONT SETUP          =
===========================*/
.heading-font {
   font-family: "Playfair Display", serif;
}
.body-font {
     font-family: "Nunito Sans", sans-serif;
}
body h1,
body h2,
body h3,
body h4,
body h5,
body h6 {
 font-family: "Playfair Display", serif;
}
body h2,
body .h2 {
  font-size: 48px;
  line-height: 1.25;
  font-weight: 400;
  text-transform: uppercase;
  letter-spacing: 0;
}
/*===========================
=        BUTTON STYLE       =
===========================*/
.dev-btn {
  font-size: 13px !important;
  font-weight: 400 !important;
  letter-spacing: 2px !important;
  line-height: 1;
  padding: 14px 45px;
  text-decoration: none;
  appearance: none;
  display: inline-block;
  text-align: center;
  text-transform: uppercase;
  cursor: pointer;
  width: auto;
  transition: all 0.3s ease-in-out;
 font-family: "Nunito Sans", sans-serif;
}
.dev-btn:hover {
  opacity: 0.85;
}

/*===========================
=     FONT WEIGHT UTILS     =
===========================*/
.fw-light {
  font-weight: 300 !important;
}
.fw-normal {
  font-weight: 400 !important;
}
.fw-medium {
  font-weight: 500 !important;
}
.fw-semibold {
  font-weight: 600 !important;
}
.fw-bold {
  font-weight: 700 !important;
}
/*===========================
=      TEXT UTILITIES       =
===========================*/
.text-uppercase {
  text-transform: uppercase;
}
.text-capitalize {
  text-transform: capitalize;
}
.text-lowercase {
  text-transform: lowercase;
}
.text-left {
  text-align: left;
}
.text-right {
  text-align: right;
}
.text-center {
  text-align: center;
}
/*===========================
=       FLEX UTILITIES      =
===========================*/
.d-flex {
  display: flex;
}
.inline-flex {
  display: inline-flex;
}
.flex-row {
  flex-direction: row;
}
.flex-col {
  flex-direction: column;
}
.justify-center {
  justify-content: center;
}
.justify-between {
  justify-content: space-between;
}
.align-center {
  align-items: center;
}
.align-start {
  align-items: flex-start;
}
.align-end {
  align-items: flex-end;
}
/*===========================
=     LAYOUT / DISPLAY      =
===========================*/
.d-block {
  display: block !important;
}
.d-inline {
  display: inline !important;
}
.d-inline-block {
  display: inline-block !important;
}
.hidden {
  display: none !important;
}
.w-100 {
  width: 100% !important;
}
.w-auto {
  width: auto !important;
}
.h-auto {
  height: auto !important;
}
/*===========================
=     POSITION / Z-INDEX    =
===========================*/
.relative {
  position: relative !important;
}
.absolute {
  position: absolute !important;
}
.fixed {
  position: fixed !important;
}
.sticky {
  position: sticky !important;
}
/*===========================
=     RESPONSIVE HEADINGS   =
===========================*/
@media (max-width: 1200px) {
  body h2,
  body .h2 {
    font-size: 40px;
  }
}
@media (max-width: 991px) {
  body h2,
  body .h2 {
    font-size: 32px;
  }
  .dev-btn, {
     font-size: 12px;
  }
}







  .swatch-label-wrapper .product-options__label {
  position: relative;
  cursor: pointer;
  min-width: var(--swatch-size);
  min-height: var(--swatch-size);
  padding: var(--spacing-2) var(--spacing-3);
  border: 0.1rem solid rgba(var(--color-foreground), 0.2);
  column-gap: var(--spacing-2);
  transition: background-color 0.15s ease;
}
.swatch-label-wrapper .product-options__label:hover {
  border-radius: 0;
  background-color: rgba(var(--color-foreground), 0.05);
}
.swatch-label-wrapper .product-options__label.is-active {
  border-color: rgba(var(--color-foreground), 1);
}

/* Defensive: suppress unidentified ::before injections on mobile drawer submenu buttons. Root cause pending Inspector capture. See docs/ux/drawer_hearts_intermittent.md. */
.header__drawer .drawer__submenu-btn::before {
  content: none !important;
  display: none !important;
}

/* ============================================================
   BHL · /policies/ editorial match  (added 2026-06-25)
   Pure styling. No legal text changed. Scoped to the built-in
   policy template only (Privacy, Terms, Refund, Shipping,
   Contact information) via body.template-- + .shopify-policy__container.
   ============================================================ */
body.template-- { background: #faf5ec; }
body.template-- #MainContent { background: #faf5ec; }
body.template-- .shopify-policy__container {
  max-width: 760px;
  padding-top: 3rem;
  padding-bottom: 4.5rem;
}
body.template-- .shopify-policy__title { text-align: left; }
body.template-- h1 {
  font-family: "Playfair Display", serif;
  font-weight: 400;
  text-transform: none;
  text-align: left;
  color: #0a0a0c;
  letter-spacing: .01em;
  margin: 0 0 1.5rem;
  padding-bottom: .85rem;
  border-bottom: 1px solid rgba(205, 155, 119, .55);
}
body.template-- .shopify-policy__container .rte { color: #1a1a1a; text-align: left; }
body.template-- .shopify-policy__container .rte p { margin: 0 0 1.15rem; line-height: 1.75; }
body.template-- .shopify-policy__container .rte > p:first-child {
  color: #6b6b6b;
  font-size: 14px;
  letter-spacing: .02em;
  margin-bottom: 1.75rem;
}
body.template-- .shopify-policy__container .rte h2 {
  font-size: 26px;
  color: #0a0a0c;
  letter-spacing: .01em;
  margin: 3rem 0 1.2rem;
  padding-top: 1.85rem;
  border-top: 1px solid rgba(205, 155, 119, .45);
}
body.template-- .shopify-policy__container .rte h3 {
  font-weight: 400;
  font-size: 17px;
  text-transform: uppercase;
  letter-spacing: .14em;
  color: #0a0a0c;
  margin: 2.1rem 0 .55rem;
}

/* ============================================================
   BHL · Fresh PDP Phase 1 · Eclipse Silk Longline · Path A
   Scoped to [class*="template--cro-"]. scheme-1 carries the white
   buy-box base; the --pdp-* vars carry Soft Ivory / Cream /
   Editorial Dark / gold. No new Shopify color schemes.
   Added 2026-06-30 (duplicate theme 162085011674 only).
   ============================================================ */
[class*="template--cro-"] {
  --pdp-white: #ffffff;
  --pdp-ivory: #f8f8f8;
  --pdp-cream: #faf5ec;
  --pdp-ink: #0a0a0c;
  --pdp-fg: #1a1a1a;
  --pdp-fg-invert: #faf5ec;
  --pdp-gold: #cd9b77;
  --pdp-hairline: rgba(205, 155, 119, 0.55);
}
/* editorial bands */
[class*="template--cro-"] .pdp-band { padding: 44px 20px; }
[class*="template--cro-"] .pdp-band--ivory { background: var(--pdp-ivory); color: var(--pdp-fg); }
[class*="template--cro-"] .pdp-band--cream { background: var(--pdp-cream); color: var(--pdp-fg); }
[class*="template--cro-"] .pdp-band--dark  { background: var(--pdp-ink);  color: var(--pdp-fg-invert); }
[class*="template--cro-"] .pdp-inner { max-width: 620px; margin: 0 auto; }
[class*="template--cro-"] .pdp-head {
  font-family: "Playfair Display", serif; font-weight: 400;
  text-transform: none; letter-spacing: .01em;
  font-size: 30px; line-height: 1.2; margin: 0 0 .6rem;
}
[class*="template--cro-"] .pdp-band--dark .pdp-head { color: var(--pdp-fg-invert); }
[class*="template--cro-"] .pdp-hairline {
  width: 40px; height: 0; border: 0; border-top: 1px solid var(--pdp-gold);
  margin: .9rem 0; opacity: 1;
}
[class*="template--cro-"] .pdp-body {
  font-family: "Nunito Sans", sans-serif; font-size: 15px; line-height: 1.75; margin: 0 0 .8rem;
}
[class*="template--cro-"] .pdp-link { color: inherit; text-decoration: underline; text-underline-offset: 3px; letter-spacing: .04em; }
[class*="template--cro-"] .pdp-close {
  font-family: "Playfair Display", serif; font-style: italic; font-weight: 400;
  font-size: 22px; line-height: 1.3; text-align: center; color: var(--pdp-fg-invert); margin: 0;
}
/* hero additions (custom_liquid blocks in the buy box) */
[class*="template--cro-"] .pdp-eyebrow {
  font-family: "Nunito Sans", sans-serif; text-transform: uppercase;
  letter-spacing: .18em; font-size: 11px; color: rgba(0,0,0,.55); margin: 0 0 .4rem;
}
[class*="template--cro-"] .pdp-sensory {
  font-family: "Playfair Display", serif; font-style: italic; font-weight: 400;
  font-size: 18px; line-height: 1.35; color: var(--pdp-fg); margin: .2rem 0 .45rem;
}
[class*="template--cro-"] .pdp-spec {
  font-family: "Nunito Sans", sans-serif; font-size: 13px; color: rgba(0,0,0,.6);
  letter-spacing: .01em; margin: 0;
}
[class*="template--cro-"] .pdp-sensory + .pdp-spec + .pdp-hairline { margin-top: .5rem; }
[class*="template--cro-"] .pdp-fitline {
  font-family: "Nunito Sans", sans-serif; font-size: 13px; color: rgba(0,0,0,.6); margin: .55rem 0 0;
}
/* ATC restyle: product-form submit only. Colour + type only (radius already 0). */
[class*="template--cro-"] .product-selector__submit {
  background: var(--pdp-ink) !important;
  color: var(--pdp-fg-invert) !important;
  text-transform: uppercase !important;
  letter-spacing: .14em !important;
}
@media (min-width: 750px) {
  [class*="template--cro-"] .pdp-band { padding: 64px 24px; }
  [class*="template--cro-"] .pdp-head { font-size: 34px; }
  [class*="template--cro-"] .pdp-inner { max-width: 600px; }
}

/* ============================================================
   BHL · Fresh PDP Phase 1 · "Build the Eclipse Set" reframe
   CSS-only editorial restyle of the existing complete_the_full_set
   module. Scoped to [class*="template--cro-"]. No logic / metafield /
   discount-math / product-form / cart change. Value stays legible
   (Receive 10% OFF + $412 -> $371 preserved).
   Added 2026-07-01 (duplicate theme 162085011674 only).
   ============================================================ */
/* module frame: an editorial cream moment, not a coupon table */
[class*="template--cro-"] .complete-the-full-set-main-sec {
  background: var(--pdp-cream);
  border-top: 1px solid var(--pdp-hairline);
  border-bottom: 1px solid var(--pdp-hairline);
  padding: 26px 20px;
  margin: 22px 0;
}
/* heading: Playfair editorial, sentence case */
[class*="template--cro-"] .complete-the-full-set-main-sec-head h4 {
  font-family: "Playfair Display", serif;
  font-weight: 400;
  text-transform: none;
  letter-spacing: .01em;
  font-size: 24px;
  line-height: 1.2;
  margin: 0 0 .35rem;
  color: var(--pdp-ink);
}
/* "Receive 10% OFF": a quiet gold line, not a loud pill */
[class*="template--cro-"] .complete-the-full-set-main-sec-head h5 {
  font-family: "Nunito Sans", sans-serif;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: .16em;
  font-size: 11px;
  color: var(--pdp-gold);
  background: none;
  margin: 0 0 .2rem;
}
[class*="template--cro-"] .complete-the-full-set-main-sec-head h5 span {
  background: none !important;
  color: var(--pdp-gold) !important;
  padding: 0 !important;
  border-radius: 0 !important;
  font-weight: 600;
}
/* product-row labels: Nunito Sans UI */
[class*="template--cro-"] .complete-the-full-set-main .card-product__title {
  font-family: "Nunito Sans", sans-serif;
  font-weight: 600;
  text-transform: none;
  letter-spacing: .01em;
}
/* total line: Nunito label, Playfair figure, quiet struck original */
[class*="template--cro-"] .complete-the-full-set-price-head {
  font-family: "Nunito Sans", sans-serif;
  text-transform: uppercase;
  letter-spacing: .14em;
  font-size: 11px;
  color: rgba(0,0,0,.55);
}
[class*="template--cro-"] .complete-the-full-set-price-main {
  font-family: "Playfair Display", serif;
  font-weight: 400;
  color: var(--pdp-ink);
}
[class*="template--cro-"] .complete-the-full-set-price-main span {
  color: var(--pdp-ink) !important;
}
[class*="template--cro-"] .complete-the-full-set-price-main s {
  font-family: "Nunito Sans", sans-serif;
  color: rgba(0,0,0,.4);
  font-size: .8em;
  margin-left: .4rem;
}
/* multi-add button: match the main ATC token treatment */
[class*="template--cro-"] .complete-the-full-main-cart {
  background: var(--pdp-ink) !important;
  color: var(--pdp-fg-invert) !important;
  border: 0 !important;
  border-radius: 0 !important;
  text-transform: uppercase !important;
  letter-spacing: .14em !important;
  font-family: "Nunito Sans", sans-serif !important;
  font-weight: 600 !important;
}

/* ============================================================
   BHL · PDP refinement (2026-07-01) · dup 162085011674 only
   Scoped to [class*="template--cro-"]. Path A tokens only.
   ============================================================ */
/* #2 hero: two quiet spec rows */
[class*="template--cro-"] .pdp-spec + .pdp-spec { margin-top: .25rem; }

/* #4 stop set / pairs / reco card image swap + grayscale; keep primary stable */
[class*="template--cro-"] .card-product .hover-img,
[class*="template--cro-"] .pdp-reco .hover-img {
  opacity: 0 !important; visibility: hidden !important; transition: none !important;
}
[class*="template--cro-"] .card-product .js-media-default,
[class*="template--cro-"] .card-product__media img.is-visible {
  opacity: 1 !important; visibility: visible !important; filter: none !important; transition: none !important;
}
[class*="template--cro-"] .card-product__media.has-hover:hover .hover-img { opacity: 0 !important; }

/* #5 Fit: copy + construction photo, responsive */
[class*="template--cro-"] .pdp-fit__inner { display: block; }
[class*="template--cro-"] .pdp-fit__media { margin-top: 22px; overflow: hidden; }
/* 2026-07-11 · dedicated 4:5 editorial fit shots (fit-cro-*.webp) display at their native ratio · no square-crop, no zoom (the old 1:1 + scale hacks were for the gallery-image source) */
[class*="template--cro-"] .pdp-fit__media img { display: block; width: 100%; height: auto; aspect-ratio: 4 / 5; object-fit: cover; object-position: center; }
[class*="template--cro-"] .pdp-fit__models {
  font-family: "Nunito Sans", sans-serif; font-size: 13px; letter-spacing: .02em;
  color: rgba(0,0,0,.6); margin: .1rem 0 .9rem;
}
@media (min-width: 750px) {
  [class*="template--cro-"] .pdp-fit__inner { display: flex; gap: 44px; align-items: center; }
  [class*="template--cro-"] .pdp-fit__copy { flex: 1 1 0; }
  [class*="template--cro-"] .pdp-fit__media { flex: 0 0 42%; margin-top: 0; }
  [class*="template--cro-"] .pdp-fit .pdp-inner { max-width: 900px; }
}

/* #6 silk care line */
[class*="template--cro-"] .pdp-silk__care {
  font-family: "Nunito Sans", sans-serif; font-size: 12px; letter-spacing: .06em;
  text-transform: uppercase; color: rgba(0,0,0,.5); margin: .7rem 0 0;
}

/* #7 reviews: brand-frame the Judge.me reviews section (id suffix), not the buy-box star block */
[class*="template--cro-"] [id$="__177571217357589381"] { background: var(--pdp-ivory); padding: 46px 16px; }
[class*="template--cro-"] .jm-review-widget-minimal-header__title {
  font-family: "Playfair Display", serif !important; font-weight: 400 !important;
  text-transform: none !important; letter-spacing: .01em !important; font-size: 26px !important; color: var(--pdp-ink) !important;
}
[class*="template--cro-"] .jdgm-star { color: var(--pdp-gold) !important; }
[class*="template--cro-"] [id$="__177571217357589381"] .jdgm-widget { max-width: 860px; margin-left: auto; margin-right: auto; }

/* #8 Recommended (opposite colorway) editorial grid */
[class*="template--cro-"] .pdp-reco__sub { font-family: "Nunito Sans", sans-serif; font-size: 14px; color: rgba(0,0,0,.6); margin: 0 0 22px; }
[class*="template--cro-"] .pdp-reco__grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 18px 12px; }
[class*="template--cro-"] .pdp-reco__card { text-decoration: none; color: inherit; display: block; }
[class*="template--cro-"] .pdp-reco__media { aspect-ratio: 4 / 5; overflow: hidden; background: #fff; }
[class*="template--cro-"] .pdp-reco__media img { width: 100%; height: 100%; object-fit: cover; display: block; }
[class*="template--cro-"] .pdp-reco__title { font-family: "Playfair Display", serif; font-weight: 400; font-size: 16px; line-height: 1.25; margin: .5rem 0 .1rem; }
[class*="template--cro-"] .pdp-reco__price { font-family: "Nunito Sans", sans-serif; font-size: 13px; color: rgba(0,0,0,.65); }
[class*="template--cro-"] .pdp-reco__cta { display: inline-block; margin-top: 32px; letter-spacing: .06em; }
@media (min-width: 750px) {
  [class*="template--cro-"] .pdp-reco__grid { grid-template-columns: repeat(3, 1fr); gap: 22px; }
  [class*="template--cro-"] .pdp-reco .pdp-inner { max-width: 1040px; }
}

/* ============================================================
   BHL · PDP correction pass (2026-07-01b) · dup 162085011674 only
   ============================================================ */
/* A: center "RECEIVE 10% OFF" within the Build-the-Set module */
[class*="template--cro-"] .complete-the-full-set-main-sec-head { text-align: center !important; }
[class*="template--cro-"] .complete-the-full-set-main-sec-head h4,
[class*="template--cro-"] .complete-the-full-set-main-sec-head h5 {
  display: block !important; width: auto !important; max-width: none !important; text-align: center !important; margin-left: auto !important; margin-right: auto !important;
}

/* B: REAL gray fix — kill mix-blend-mode:multiply on set/pairs/reco card media (was multiplying the image against the cream ground) */
[class*="template--cro-"] .card-product__media,
[class*="template--cro-"] .card-product__media img,
[class*="template--cro-"] .card-product img,
[class*="template--cro-"] .pdp-reco__media,
[class*="template--cro-"] .pdp-reco__media img { mix-blend-mode: normal !important; }
/* retained: primary stable, no hover image */
[class*="template--cro-"] .card-product .hover-img { opacity: 0 !important; visibility: hidden !important; }
[class*="template--cro-"] .card-product .js-media-default { opacity: 1 !important; visibility: visible !important; }

/* D: reviews — reduce app-block harshness (scoped to the reviews section id) */
[class*="template--cro-"] [id$="__177571217357589381"] .jdgm-tablist__list,
[class*="template--cro-"] [id$="__177571217357589381"] .jm-review-widget-minimal-header__tabs { border-bottom: 1px solid var(--pdp-hairline); }
[class*="template--cro-"] [id$="__177571217357589381"] .jm-sort-filter__select,
[class*="template--cro-"] [id$="__177571217357589381"] .jdgm-tab-dropdown__select,
[class*="template--cro-"] [id$="__177571217357589381"] .jdgm-sort-dropdown,
[class*="template--cro-"] [id$="__177571217357589381"] select {
  font-family: "Nunito Sans", sans-serif !important; border: 1px solid var(--pdp-hairline) !important;
  border-radius: 0 !important; background-color: #fff !important; padding: 8px 30px 8px 12px !important; color: var(--pdp-ink) !important;
}
[class*="template--cro-"] [id$="__177571217357589381"] .jm-action-buttons a,
[class*="template--cro-"] [id$="__177571217357589381"] .jm-action-buttons button {
  background-color: var(--pdp-ink) !important; color: var(--pdp-fg-invert) !important; border: 0 !important;
  border-radius: 0 !important; text-transform: uppercase !important; letter-spacing: .12em !important;
  font-family: "Nunito Sans", sans-serif !important; font-weight: 600 !important;
}
[class*="template--cro-"] [id$="__177571217357589381"] .jm-reviewer-info__name { font-family: "Playfair Display", serif !important; font-weight: 400 !important; }
[class*="template--cro-"] [id$="__177571217357589381"] .jm-no-reviews-state__text { font-family: "Playfair Display", serif !important; font-style: italic; color: rgba(0,0,0,.6) !important; }

/* E: Pairs With 6-card same-color editorial grid (2-col mobile, 3-col desktop) */
[class*="template--cro-"] .pdp-pairs__grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 18px 12px; }
@media (min-width: 750px) {
  [class*="template--cro-"] .pdp-pairs__grid { grid-template-columns: repeat(3, 1fr); gap: 24px; }
  [class*="template--cro-"] .pdp-pairs .pdp-inner { max-width: 1040px; }
}

/* Hide the color swatch on Build-the-Set cards only. The black chip is display-only
   (each set item is a fixed color); the radio input stays checked in the DOM, so
   Complete-the-Set multi-add is unaffected. Scoped to the CTS module; does NOT touch
   size selectors (.card-product__sizes-btn), the main picker, or Pairs/Recommended
   (which use .pdp-reco__card, no swatches). Added 2026-07-01 (dup 162085011674 only). */
[class*="template--cro-"] .complete-the-full-set-main .card-product__swatches { display: none !important; }

/* #1 Remove the redundant Color selector from the main picker (one color per SKU) so the
   CTA rises. Targets ONLY the swatch-based (Color) fieldset; the Size fieldset uses pills.
   The Black radio stays in the DOM (checked) so the variant still resolves. Added 2026-07-01. */
[class*="template--cro-"] fieldset.product-options:has(.product-options__item--swatch) { display: none !important; }

/* ============================================================
   BHL · /design action pass (2026-07-01d) · dup 162085011674 only
   ============================================================ */
/* E: hero breathing room + quieter spec rows */
[class*="template--cro-"] .pdp-sensory { margin: .5rem 0 .75rem !important; }
[class*="template--cro-"] .pdp-spec { font-size: 12px !important; letter-spacing: .05em !important; color: rgba(0,0,0,.48) !important; }
[class*="template--cro-"] .pdp-spec + .pdp-spec { margin-top: .3rem !important; }

/* F: dark "Why silk" band — keep care line readable on the dark ground */
[class*="template--cro-"] .pdp-band--dark .pdp-silk__care { color: rgba(250,245,236,.55) !important; }
[class*="template--cro-"] .pdp-band--dark .pdp-body { color: var(--pdp-fg-invert); }
/* 2026-07-11 · WHY SILK → Journal article link (Brennah checklist) · cream text, gold underline, boutique register on the dark band */
[class*="template--cro-"] .pdp-silk__link { display: inline-block; margin: 4px 0 20px; font-family: "Nunito Sans", sans-serif; font-size: 12px; letter-spacing: .14em; text-transform: uppercase; color: #faf5ec; text-decoration: underline; text-decoration-color: rgba(205,155,119,.7); text-underline-offset: 4px; transition: color .18s ease, text-decoration-color .18s ease; }
[class*="template--cro-"] .pdp-silk__link:hover { color: #fff; text-decoration-color: #cd9b77; }
[class*="template--cro-"] .pdp-silk__link:focus-visible { outline: 2px solid #cd9b77; outline-offset: 3px; }

/* G: reviews proof band + reduce Judge.me app-block awkwardness */
[class*="template--cro-"] .pdp-proof__inner { text-align: center; }
[class*="template--cro-"] .pdp-proof .pdp-head { margin: 0; }
[class*="template--cro-"] .pdp-proof__stars { color: var(--pdp-gold); letter-spacing: .35em; font-size: 15px; margin: 0 0 .5rem; padding-left: .35em; }
[class*="template--cro-"] [id$="__177571217357589381"] .jm-review-widget-minimal-header__title { display: none !important; }
[class*="template--cro-"] [id$="__177571217357589381"] .jm-other-products-reviews-text { display: none !important; }


/* I: Pairs / Recommended spacing polish */
[class*="template--cro-"] .pdp-reco__grid,
[class*="template--cro-"] .pdp-pairs__grid { gap: 22px 14px !important; }
[class*="template--cro-"] .pdp-reco__title { margin: .6rem 0 .15rem !important; }
[class*="template--cro-"] .pdp-reco__price { margin-top: .1rem !important; }
@media (min-width: 750px) {
  [class*="template--cro-"] .pdp-reco__grid, [class*="template--cro-"] .pdp-pairs__grid { gap: 28px !important; }
}

/* H fix: stack title/price in the 2-up set cards so titles do not cramp/hyphenate */
[class*="template--cro-"] .complete-the-full-set-main .card-product__content { flex-direction: column !important; align-items: flex-start !important; gap: 3px !important; }
[class*="template--cro-"] .complete-the-full-set-main .card-product__title-desc,
[class*="template--cro-"] .complete-the-full-set-main .card-product__price { width: 100% !important; }
[class*="template--cro-"] .complete-the-full-set-main .card-product__title,
[class*="template--cro-"] .complete-the-full-set-main .card-product__title-desc { font-size: 14px !important; line-height: 1.25 !important; }

/* ============================================================
   BHL · /design LOOP 1 (2026-07-01f) · dup only · team-reviewed
   Ksenia (rhythm/hairline/measure), Polina (Fit crop, mobile chevrons),
   Mila (reassurance), CRO/QA + /design (proof gap).
   ============================================================ */
/* Ksenia #1 lever: light bands tighter, dark bands generous (dark beats arrive sooner, hit harder) */
[class*="template--cro-"] .pdp-band { padding: 30px 20px; }
[class*="template--cro-"] .pdp-band--dark { padding: 56px 20px; }
@media (min-width: 750px) {
  [class*="template--cro-"] .pdp-band { padding: 46px 24px; }
  [class*="template--cro-"] .pdp-band--dark { padding: 78px 24px; }
}
/* Ksenia: dark Why-silk — shorter measure + more leading on ink */
[class*="template--cro-"] .pdp-band--dark .pdp-inner { max-width: 540px; }
[class*="template--cro-"] .pdp-band--dark .pdp-body { line-height: 1.85; }
/* Ksenia: gold hairline as a real gesture, strongest on the dark band */
[class*="template--cro-"] .pdp-hairline { width: 64px; }
[class*="template--cro-"] .pdp-band--dark .pdp-hairline { width: 84px; }
/* 2026-07-11 · dedicated 4:5 fit shots need no crop/zoom · neutralize the earlier gallery-image tuning */
[class*="template--cro-"] .pdp-fit__media img { object-position: center !important; transform: none !important; }
/* /design: tighten the "Loved by Lovies" proof -> reviews gap */
[class*="template--cro-"] .pdp-proof { padding-bottom: 10px !important; }
[class*="template--cro-"] [id$="__177571217357589381"] { padding-top: 16px !important; }
/* Mila: reassurance microcopy under Add To Bag */
[class*="template--cro-"] .pdp-reassure { font-family: "Nunito Sans", sans-serif; font-size: 12px; letter-spacing: .02em; color: rgba(0,0,0,.55); line-height: 1.5; margin: 12px 0 0; }
/* Polina: hide touch-redundant gallery chevrons on mobile (swipe is the affordance) */
@media (max-width: 749px) {
  [class*="template--cro-"] .product-button-next, [class*="template--cro-"] .product-button-prev { display: none !important; }
}

/* ============================================================
   BHL · Curated "Loved by Lovies" reviews section (2026-07-01)
   Real reviews, verbatim; editorial layout; dup 162085011674 only.
   ============================================================ */
[class*="template--cro-"] .pdp-lovies__inner { text-align: center; }
[class*="template--cro-"] .pdp-lovies__stars { color: var(--pdp-gold); letter-spacing: .35em; font-size: 15px; margin: 0 0 .5rem; padding-left: .35em; }
[class*="template--cro-"] .pdp-lovies .pdp-head { margin: 0 0 .35rem; }
[class*="template--cro-"] .pdp-lovies__sub { font-family: "Nunito Sans", sans-serif; font-size: 13px; letter-spacing: .06em; text-transform: uppercase; color: rgba(0,0,0,.5); margin: 0 0 32px; }
[class*="template--cro-"] .pdp-lovies__grid { display: grid; grid-template-columns: 1fr; gap: 0; text-align: left; }
[class*="template--cro-"] .pdp-lovies__card { margin: 0; padding: 24px 0; border-top: 1px solid var(--pdp-hairline); }
[class*="template--cro-"] .pdp-lovies__card:first-child { border-top: 0; padding-top: 0; }
[class*="template--cro-"] .pdp-lovies__cardstars { color: var(--pdp-gold); letter-spacing: .25em; font-size: 13px; margin: 0 0 .6rem; }
[class*="template--cro-"] .pdp-lovies__quote { font-family: "Playfair Display", serif; font-style: italic; font-weight: 400; font-size: 19px; line-height: 1.45; color: var(--pdp-fg); margin: 0 0 .8rem; }
[class*="template--cro-"] .pdp-lovies__by { font-family: "Nunito Sans", sans-serif; font-style: normal; font-size: 13px; color: var(--pdp-ink); display: flex; flex-direction: column; gap: 2px; }
[class*="template--cro-"] .pdp-lovies__label { font-size: 11px; letter-spacing: .08em; text-transform: uppercase; color: rgba(0,0,0,.45); }
[class*="template--cro-"] .pdp-lovies__cta { display: inline-block; margin-top: 28px; letter-spacing: .06em; }
@media (min-width: 750px) {
  [class*="template--cro-"] .pdp-lovies__grid { grid-template-columns: repeat(3, 1fr); gap: 40px; }
  [class*="template--cro-"] .pdp-lovies__card { border-top: 0; padding: 0; }
  [class*="template--cro-"] .pdp-lovies .pdp-inner { max-width: 1060px; }
}
/* Build-the-Set: native horizontal layout (grid reverted, 2026-07-01g). Intentional
   scroll-snap + hidden scrollbar; size buttons made visible on the cream ground
   (theme default is white-on-white). Logic/multi-add untouched. */
[class*="template--cro-"] .complete-the-full-set-main { scroll-snap-type: x mandatory; scrollbar-width: none; }
[class*="template--cro-"] .complete-the-full-set-main::-webkit-scrollbar { width: 0; height: 0; display: none; }
[class*="template--cro-"] .complete-the-full-set-main > * { scroll-snap-align: start; }
[class*="template--cro-"] .complete-the-full-set-main .card-product__sizes-btn {
  color: var(--pdp-ink) !important; border-color: rgba(10,10,12,.28) !important;
}
/* Active selected-size pill · softened 2026-07-08: was a solid ink block (read as a
   black-square artifact) → light chip + crisp full-ink outline + bold, still clearly
   selected. Visual only · same element/size/tap-target; multi-add logic untouched. */
[class*="template--cro-"] .complete-the-full-set-main .card-product__sizes-btn.is-active {
  background: rgba(10,10,12,.08) !important; color: var(--pdp-ink) !important; border-color: var(--pdp-ink) !important; font-weight: 600 !important;
}
/* Hide the redundant "toggle sizes" (+) button inside Build-the-Set: sizes are always shown inline
   here, so the toggle is a decorative artifact. Sizes stay visible/clickable; multi-add unaffected;
   mobile already hides it. (2026-07-08b · Launch) */
[class*="template--cro-"] .complete-the-full-set-main .card-product__sizes-btn-toggle { display: none !important; }

/* ============================================================
   Build-the-Set DESKTOP polish (2026-07-01h) · dup only · desktop-scoped.
   Wider set cards (2-up + designed peek), size <ul> made horizontal
   (theme stacks the <li> vertically at narrow widths), title/price
   aligned across cards. Native flex carousel kept; NO grid, NO logic.
   Mobile (<750px) untouched.
   ============================================================ */
@media (min-width: 750px) {
  /* Desktop: fit all 3 set cards in the module band (no hidden scroll) */
  [class*="template--cro-"] .complete-the-full-set-main { overflow-x: visible !important; gap: 10px !important; }
  [class*="template--cro-"] .complete-the-full-set-main > * { flex: 1 1 0 !important; width: auto !important; min-width: 0 !important; max-width: none !important; }
  [class*="template--cro-"] .complete-the-full-set-main .card-product,
  [class*="template--cro-"] .complete-the-full-set-main .card-product .relative,
  [class*="template--cro-"] .complete-the-full-set-main .card-product__content { width: 100% !important; }
  [class*="template--cro-"] .complete-the-full-set-main .card-product__sizes-content,
  [class*="template--cro-"] .complete-the-full-set-main .card-product__sizes-items { width: 100% !important; height: auto !important; }
  /* (2026-07-08b · Launch) Removed the min-height reserve. Cards flow naturally now; a bra's taller
     wrapped grid puts its title a little lower, which reads as intentional (that card has more sizes). */
  [class*="template--cro-"] .complete-the-full-set-main .card-product__sizes-items ul { display: flex !important; flex-wrap: wrap !important; gap: 6px !important; justify-content: flex-start !important; padding: 0 !important; margin: 0 !important; }
  /* wrap + min-width so many-size items (e.g. a bra's 18 band/cup sizes in the set) don't
     shrink their <li> below the 36px button and pile up / spill into the next card (2026-07-08). */
  [class*="template--cro-"] .complete-the-full-set-main .card-product__sizes-items li { display: block !important; flex: 1 1 36px !important; min-width: 36px !important; margin: 0 !important; }
  [class*="template--cro-"] .complete-the-full-set-main .card-product__sizes-btn { width: 100% !important; }
  [class*="template--cro-"] .complete-the-full-set-main .card-product__title { min-height: 2.6em; }
}

/* ============================================================
   BHL · PDP product details accordions (2026-07-01) · dup 162085011674 only
   Re-enabled 6 native <details> collapsible_content blocks (Description, Fabric &
   Features, Sizing, Care, Packaging, Shipping & Returns). Black Heart restyle of the
   theme accordion (overrides section-accordions.css). Scoped to [class*="template--cro-"].
   ============================================================ */
[class*="template--cro-"] .product__accordion { display: block; background: var(--pdp-ivory); margin: 0; padding: 0 !important; border: 0 !important; border-block: 0 !important; }
[class*="template--cro-"] .product__accordion:first-of-type { margin-top: 22px; }
[class*="template--cro-"] .product__accordion .accordion__section { border: 0; border-top: 1px solid var(--pdp-hairline); background: transparent; padding: 0 16px; }
[class*="template--cro-"] .product__accordion:last-of-type .accordion__section { border-bottom: 1px solid var(--pdp-hairline); }

[class*="template--cro-"] .product__accordion .accordion__button {
  display: flex; align-items: center; justify-content: space-between; gap: 16px;
  padding: 12px 0; margin: 0; cursor: pointer; list-style: none;
  font-family: "Nunito Sans", sans-serif; font-weight: 600; font-size: 12px;
  letter-spacing: .12em; text-transform: uppercase; color: var(--pdp-ink);
  line-height: 1.2; transition: color .2s ease;
}
[class*="template--cro-"] .product__accordion .accordion__button::-webkit-details-marker { display: none; }
[class*="template--cro-"] .product__accordion .accordion__button > span { display: inline-flex; align-items: center; gap: 10px; }
[class*="template--cro-"] .product__accordion .accordion__button:hover { color: var(--pdp-gold); }

/* thin +/- mark in place of the chunky theme icon */
[class*="template--cro-"] .product__accordion .accordion__icon { position: relative; width: 13px; height: 13px; flex: 0 0 13px; }
[class*="template--cro-"] .product__accordion .accordion__icon svg { display: none; }
[class*="template--cro-"] .product__accordion .accordion__icon::before,
[class*="template--cro-"] .product__accordion .accordion__icon::after {
  content: ""; position: absolute; top: 50%; left: 50%; background: var(--pdp-ink);
  transition: opacity .2s ease, background-color .2s ease;
}
[class*="template--cro-"] .product__accordion .accordion__icon::before { width: 13px; height: 1px; transform: translate(-50%, -50%); }
[class*="template--cro-"] .product__accordion .accordion__icon::after  { width: 1px; height: 13px; transform: translate(-50%, -50%); }
[class*="template--cro-"] .product__accordion .accordion__button:hover .accordion__icon::before,
[class*="template--cro-"] .product__accordion .accordion__button:hover .accordion__icon::after { background: var(--pdp-gold); }
[class*="template--cro-"] .product__accordion .accordion__section[open] .accordion__icon::after { opacity: 0; }

[class*="template--cro-"] .product__accordion .accordion__body { background: transparent; }
[class*="template--cro-"] .product__accordion .accordion__body-inner {
  font-family: "Nunito Sans", sans-serif; font-size: 13.5px; line-height: 1.55;
  color: rgba(0,0,0,.66); padding: 0 0 14px; margin: 0;
}
[class*="template--cro-"] .product__accordion .accordion__body-inner p { margin: 0 0 .3em; }
[class*="template--cro-"] .product__accordion .accordion__body-inner p:last-child { margin-bottom: 0; }
[class*="template--cro-"] .product__accordion .accordion__body-inner a { color: var(--pdp-ink); text-decoration: underline; text-underline-offset: 2px; }
[class*="template--cro-"] .product__accordion .accordion__section[open] .accordion__body-inner { animation: pdpAccFade .28s ease; }
@keyframes pdpAccFade { from { opacity: 0; transform: translateY(-3px); } to { opacity: 1; transform: none; } }

@media (prefers-reduced-motion: reduce) {
  [class*="template--cro-"] .product__accordion .accordion__icon::before,
  [class*="template--cro-"] .product__accordion .accordion__icon::after,
  [class*="template--cro-"] .product__accordion .accordion__button { transition: none; }
  [class*="template--cro-"] .product__accordion .accordion__section[open] .accordion__body-inner { animation: none; }
}

/* ============================================================
   BHL · PDP motion polish (2026-07-02) · dup 162085011674 only
   Restrained CSS-only hover/transition layer. Scoped to [class*="template--cro-"].
   opacity / transform / color / box-shadow only · NO layout animation · NO JS.
   Lift & image-scale gated to hover-capable fine pointers (no sticky mobile hover).
   All buy-box motion is hover-only (no entrance/load animation). Reduced-motion honored (block at end).
   ============================================================ */
/* Buttons · smooth color/bg/border easing (+ 1px lift on the two primary CTAs) */
[class*="template--cro-"] .product-selector__submit,
[class*="template--cro-"] .complete-the-full-main-cart {
  transition: color .25s ease, background-color .25s ease, border-color .25s ease, transform .2s ease, box-shadow .25s ease;
}
/* Build-the-Set size buttons · ease the ink/cream active swap (was snapping) */
[class*="template--cro-"] .complete-the-full-set-main .card-product__sizes-btn {
  transition: color .2s ease, background-color .2s ease, border-color .2s ease;
}
/* Product cards (Build-the-Set + Complete-the-look + Recommended) · lift + image scale */
[class*="template--cro-"] .complete-the-full-set-main .card-product,
[class*="template--cro-"] .pdp-reco__card { transition: transform .28s ease, box-shadow .28s ease; }
[class*="template--cro-"] .complete-the-full-set-main .card-product__media img,
[class*="template--cro-"] .pdp-reco__media img { transition: transform .3s ease; }
/* Editorial links · soft color easing */
[class*="template--cro-"] .pdp-lovies__cta,
[class*="template--cro-"] .pdp-fit a,
[class*="template--cro-"] .product__accordion .accordion__body-inner a { transition: color .2s ease, text-decoration-color .2s ease, opacity .2s ease; }
/* Accordion row · faint warm hover ground (gold color/icon hover already present) */
[class*="template--cro-"] .product__accordion .accordion__button { transition: color .2s ease, background-color .2s ease; }

@media (hover: hover) and (pointer: fine) {
  [class*="template--cro-"] .product-selector__submit:hover,
  [class*="template--cro-"] .complete-the-full-main-cart:hover { transform: translateY(-1px); }
  [class*="template--cro-"] .pdp-reco__card:hover { transform: translateY(-3px); box-shadow: 0 10px 26px rgba(10,10,12,.08); }
  [class*="template--cro-"] .complete-the-full-set-main .card-product:hover { transform: translateY(-2px); }
  [class*="template--cro-"] .pdp-reco__card:hover .pdp-reco__media img,
  [class*="template--cro-"] .complete-the-full-set-main .card-product:hover .card-product__media img { transform: scale(1.03); }
  [class*="template--cro-"] .product__accordion .accordion__button:hover { background-color: rgba(205,155,119,.05); }
  [class*="template--cro-"] .pdp-lovies__cta:hover,
  [class*="template--cro-"] .pdp-fit a:hover,
  [class*="template--cro-"] .product__accordion .accordion__body-inner a:hover { color: var(--pdp-gold); }
}

/* Reduced motion · disable every added transition/transform + prior accordion motion (last-wins) */
@media (prefers-reduced-motion: reduce) {
  [class*="template--cro-"] .product-selector__submit,
  [class*="template--cro-"] .complete-the-full-main-cart,
  [class*="template--cro-"] .complete-the-full-set-main .card-product,
  [class*="template--cro-"] .complete-the-full-set-main .card-product__media img,
  [class*="template--cro-"] .complete-the-full-set-main .card-product__sizes-btn,
  [class*="template--cro-"] .pdp-reco__card,
  [class*="template--cro-"] .pdp-reco__media img,
  [class*="template--cro-"] .pdp-lovies__cta,
  [class*="template--cro-"] .pdp-fit a,
  [class*="template--cro-"] .product__accordion .accordion__button,
  [class*="template--cro-"] .product__accordion .accordion__icon::before,
  [class*="template--cro-"] .product__accordion .accordion__icon::after,
  [class*="template--cro-"] .product__accordion .accordion__body-inner a { transition: none !important; }
  [class*="template--cro-"] .product-selector__submit:hover,
  [class*="template--cro-"] .complete-the-full-main-cart:hover,
  [class*="template--cro-"] .pdp-reco__card:hover,
  [class*="template--cro-"] .complete-the-full-set-main .card-product:hover,
  [class*="template--cro-"] .pdp-reco__card:hover .pdp-reco__media img,
  [class*="template--cro-"] .complete-the-full-set-main .card-product:hover .card-product__media img { transform: none !important; box-shadow: none !important; }
  [class*="template--cro-"] .product__accordion .accordion__section[open] .accordion__body-inner { animation: none !important; }
}

/* ============================================================
   BHL · Final micro-refinements (2026-07-02) · dup 162085011674 only
   1 trust-row dedupe · 2 descriptor weight · 3 spec-row balance ·
   4 Our Story head into the editorial type system.
   Item 5 (Why-silk desktop centering) VERIFIED ALREADY SATISFIED:
   .pdp-band--dark .pdp-inner measures left=450px @1440 (exact center,
   (1440-540)/2) — the left-hug read was a thumbnail artifact. No rule.
   ============================================================ */
/* 1 · theme icon trust row duplicates .pdp-reassure verbatim — hide it */
[class*="template--cro-"] .bottom-icon-text-pdp-cro { display: none; }
/* 2 · descriptor "The Sculpting Longline": one 500 weight (stored <strong> untouched; styling only) */
[class*="template--cro-"] .bottom-desc-pdp-cro,
[class*="template--cro-"] .bottom-desc-pdp-cro strong { font-weight: 500; }
[class*="template--cro-"] .bottom-desc-pdp-cro { letter-spacing: .02em; }
/* 3 · balance the two hero spec rows (kills the mobile "hardware" orphan; no-op where unsupported) */
[class*="template--cro-"] .pdp-spec { text-wrap: balance; }
/* 4 · Our Story h2 (stored "Our Story"; theme uppercases + 48px) → match .pdp-head scale */
[class*="template--cro-"] [id*="our_story"] .title-wrap h2 {
  text-transform: none; font-size: 30px; letter-spacing: .01em; line-height: 1.2;
}
@media (min-width: 750px) {
  [class*="template--cro-"] [id*="our_story"] .title-wrap h2 { font-size: 34px; }
}

/* ============================================================
   Buy-box trust row + installments demotion (2026-07-03)
   Unfrozen by Mac for this change · previous frozen md5 c53f7b93…
   Trust copy = the pre-existing approved reassurance line split
   into three items verbatim; icons are inline SVGs in the section.
   ============================================================ */
[class*="template--cro-"] .pdp-trust {
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin: 18px 0 2px;
}
[class*="template--cro-"] .pdp-trust__item {
  display: flex;
  align-items: center;
  gap: 10px;
  font-family: "Nunito Sans", sans-serif;
  font-weight: 600;
  font-size: 13px;
  line-height: 1.45;
  letter-spacing: .02em;
  color: #1a1a1a;
}
[class*="template--cro-"] .pdp-trust__item svg {
  flex: 0 0 auto;
  width: 18px;
  height: 18px;
}
/* the Shop Pay installments banner reads quieter than the trust row now */
[class*="template--cro-"] .product__installments {
  opacity: .7;
  margin-top: 10px;
}

/* PDP Our Story · ink editorial band to match the homepage (2026-07-03) */
[class*="template--cro-"] .our-story-section h2 { color: inherit; }
[class*="template--cro-"] .our-story-section a {
  color: #faf5ec !important;
  text-decoration: underline;
  text-underline-offset: 3px;
  letter-spacing: .04em;
}

/* ============================================================
   Brennah's Longline PDP Layout Guide · FINAL (2026-07-04)
   Header · —— · Feature highlights · —— · Emotional copy · —— · Price
   Title-Case scannable features; three short emotional lines; generous
   hairline spacing per her "give each idea room to breathe" note.
   ============================================================ */
[class*="template--cro-"] .pdp-hairline {
  border: 0;
  border-top: 1px solid rgba(26, 26, 26, .12);
  margin: 22px 0;
  max-width: 40ch;
}
/* S2 · feature highlights — scan-fast, premium */
[class*="template--cro-"] .pdp-features { margin: 0; }
[class*="template--cro-"] .pdp-feature {
  font-family: "Nunito Sans", sans-serif;
  font-weight: 500;
  font-size: 14px;
  letter-spacing: .02em;
  line-height: 1;
  color: #2a2620;
  margin: 12px 0;
}
/* S3 · emotional copy — the introduction before the buy */
[class*="template--cro-"] .pdp-emotional { margin: 0; max-width: 40ch; }
[class*="template--cro-"] .pdp-emotional__line {
  font-family: "Nunito Sans", sans-serif;
  font-size: 15px;
  line-height: 1.5;
  color: #1a1a1a;
  margin: 9px 0;
}
/* S11 · permanent editorial lead atop the product description */
[class*="template--cro-"] .pdp-desc-lead {
  font-family: "Playfair Display", serif;
  font-style: italic;
  font-size: 16px;
  line-height: 1.4;
  color: #1a1a1a;
  margin: 0 0 12px;
}


/* ---------- PDP installments banner: reposition + breathe (2026-07-06) ----------
   Shop Pay <shopify-payment-terms> rendered as the LAST child of <product-form>,
   after the trust row and crammed against the Complete-the-Set band. Reorder it to
   sit directly under the buy buttons (logical payment-info spot) with spacing.
   Scoped to all cro-* PDPs. */
[class*="template--cro-"] product-form { display: flex !important; flex-direction: column; }
[class*="template--cro-"] product-form .product__form { order: 0; }
[class*="template--cro-"] product-form .product__installments { order: 1; margin: 16px 0 6px; }
[class*="template--cro-"] product-form .pdp-trust { order: 2; }

/* --- PDP reviews accordion band (2026-07-07) --- */
[class*="template--cro-"] .pdp-reviews-band { padding: 4px 20px 48px; }
[class*="template--cro-"] .pdp-reviews-acc { max-width: 860px; margin: 0 auto; }
[class*="template--cro-"] .pdp-reviews-acc .accordion__button { text-transform: none; }
[class*="template--cro-"] .pdp-reviews-acc__label { display: inline-flex; align-items: baseline; }
[class*="template--cro-"] .pdp-reviews-acc__stars { color: #C8A46A; letter-spacing: .12em; font-size: .62em; margin-left: .45rem; } /* champagne gold · matches the widget stars (2026-07-08, was #F2D7CC pink) */
[class*="template--cro-"] .pdp-reviews-acc__body { padding-top: 6px; }
/* Center ONLY the widget root. Do NOT put margin:auto on inner [class*="jm-review"]
   flex items — margin:auto on a flex child kills its stretch and collapses it to 0 width,
   which stacks the star rating + every review into a 1-star-wide column. */
[class*="template--cro-"] .pdp-reviews-acc__body > .product__app-block > .shopify-app-block > .jm-review-widget { max-width: 100%; }
[class*="template--cro-"] .pdp-reviews-acc .jdgm-star { color: var(--pdp-gold) !important; }
[class*="template--cro-"] .pdp-reviews-acc__empty { text-align: center; color: rgba(0,0,0,.5); font-family: "Nunito Sans", sans-serif; padding: 16px 0 8px; }
/* Tighten Judge.me V3 "stack" spacing so the opened widget reads compact, not sparse.
   The widget lays everything out with --jm-space-* tokens (space-600 = 1.5em drives both
   between-review and within-review gaps) and a 48px root pad. Shrink both, scoped to the accordion. */
[class*="template--cro-"] .pdp-reviews-acc .jm-review-widget {
  --jm-space-600: .55em; --jm-space-500: .5em; --jm-space-400: .45em;
  --jm-space-800: .9em; --jm-space-1000: 1.2em; --jm-space-1200: 1.4em;
  padding-top: 6px !important; padding-bottom: 8px !important;
}
[class*="template--cro-"] .pdp-reviews-acc .jm-review-widget__header-and-body { row-gap: 10px; }
[class*="template--cro-"] .pdp-reviews-acc .jdgm-review-list > * + * { margin-top: 14px; }

/* === Judge.me PDP review · buy-box preview badge + champagne-gold stars (2026-07-08) === */

/* Buy-box product preview badge (renders product.metafields.judgeme.badge · classic .jdgm-prev-badge markup) */
[class*="template--cro-"] .pdp-review-badge {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 44px;
  padding: 4px 2px;
  margin: 4px 0 2px;
  text-decoration: none;
}
/* The metafield snippet ships with inline display:none (Judge.me reveals it via JS); force-show since we only render it at >=3 reviews, so it never depends on the app JS firing */
[class*="template--cro-"] .pdp-review-badge .jdgm-prev-badge { display: inline-flex !important; align-items: center; }
/* Champagne gold on the badge's classic stars · beats the global var(--pdp-gold) !important on .jdgm-star */
[class*="template--cro-"] .pdp-review-badge .jdgm-star.jdgm--on,
[class*="template--cro-"] .pdp-review-badge .jdgm-star { color: #C8A46A !important; }
[class*="template--cro-"] .pdp-review-badge .jdgm-prev-badge__text {
  font-family: "Nunito Sans", sans-serif;
  font-size: .78rem;
  letter-spacing: .01em;
  color: rgba(0,0,0,.6);
}
[class*="template--cro-"] .pdp-review-badge:focus-visible { outline: 2px solid #C8A46A; outline-offset: 2px; }

/* Revamp widget stars → champagne gold · scoped to the accordion widget root only.
   Overrides Judge.me's default pink primary color WITHOUT touching the global app setting. */
/* Judge.me sets --jm-widget-primary-color inline on the .jm-stack/.jm-review-widget root, so the override needs !important to beat the inline pink */
[class*="template--cro-"] .pdp-reviews-acc .jm-review-widget { --jm-widget-primary-color: #C8A46A !important; }
/* The revamp widget renders rating stars as a FONT ICON colored via `color` (not via --jm-widget-primary-color), so recolor it directly. Confirmed: this turns all rating stars champagne gold. */
[class*="template--cro-"] .pdp-reviews-acc .jm-star-rating__font-icon { color: #C8A46A !important; }

/* ============================================================
   BHL 2026-07-10 · Buy-box vertical rhythm · Launch · cro only.
   Tightened to lift the Add-to-Bag CTA (mobile especially). The buy box is a
   flex column (.product-selector) whose gap = var(--spacing-5) (~24px measured);
   the price block adds 15px bottom padding. Spacing only · no layout/logic change.
   ============================================================ */
[class*="template--cro-"] .product-selector,
[class*="template--cro-"] .product-selector.product-selector--buttons {
  row-gap: 13px !important;
  margin-block: 14px !important;
}
[class*="template--cro-"] .product__price { padding-bottom: 6px !important; }

/* ============================================================
   Buy-box cleanup (2026-07-11) · McKenzie-approved six-item pass
   1 · price joins the intro cluster (block_order moved in all 8
       cro templates: eyebrow → title → stars → subtitle → price)
   2 · feature badges 2×2 grid
   3 · buy-box hairlines full content width (editorial-band 64px
       hairline rules untouched · scoped via the __main section id)
   4 · trust row: two items line one · third centered below
   5 · one vertical rhythm through the intro cluster
   6 · review-count gets air from the stars
   ============================================================ */
/* 2 · badges 2×2 */
[class*="template--cro-"] .pdp-features {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  column-gap: 18px;
  row-gap: 10px;
}
[class*="template--cro-"] .pdp-feature { margin: 0; line-height: 1.35; }
/* 3 · full-width hairlines in the buy box only */
[id*="__main"] .pdp-hairline { width: 100%; max-width: none; margin: 16px 0; }
/* 4 · trust = 2 + 1 centered */
[class*="template--cro-"] .pdp-trust {
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: center;
  column-gap: 26px;
  row-gap: 10px;
  margin: 16px 0 2px;
}
/* short pair (Discreet delivery + Free U.S. shipping) on line one · the long exchanges
   line gets the solo centered row (fits down to 360px viewports at the mobile size below) */
[class*="template--cro-"] .pdp-trust__item:nth-child(1) { order: 3; flex-basis: 100%; justify-content: center; }
[class*="template--cro-"] .pdp-trust__item:nth-child(2) { order: 1; }
[class*="template--cro-"] .pdp-trust__item:nth-child(3) { order: 2; }
@media (max-width: 749px) {
  [class*="template--cro-"] .pdp-trust { column-gap: 16px; }
  [class*="template--cro-"] .pdp-trust__item { font-size: 12px; }
  [class*="template--cro-"] .pdp-trust__item svg { width: 16px; height: 16px; }
}
/* 1 + 5 · intro cluster rhythm (price compact under the subtitle · ATC keeps the loud price) */
[class*="template--cro-"] .pdp-eyebrow { margin: 0 0 6px; }
[class*="template--cro-"] .product__title { margin: 0 0 10px; }
[class*="template--cro-"] .pdp-review-badge { margin: 0 0 4px; min-height: 0; padding: 2px 0; }
[class*="template--cro-"] .bottom-desc-pdp-cro { margin: 2px 0 4px; }
[class*="template--cro-"] .product__price { font-size: 20px; font-weight: 600; padding: 2px 0 0 !important; }
/* 5 · fitline sits close to its chips, clears the button */
[class*="template--cro-"] .pdp-fitline { margin: 10px 0 14px; }
/* 6 · stars ↔ review-count gap */
[class*="template--cro-"] .pdp-review-badge .jdgm-prev-badge__text { margin-left: 6px; }

/* ============================================================
   Buy-box luxury finish (2026-07-11) · McKenzie: "more luxury
   and aesthetic" · type + line + control refinements only, no
   layout or copy changes. Revert = delete this block.
   ============================================================ */
/* warm the buy-box hairlines to the site's gold line-language (bands/drawer already speak it) */
[id*="__main"] .pdp-hairline { border-top-color: rgba(205, 155, 119, .5); }
/* eyebrow: quieter, wider tracked */
[class*="template--cro-"] .pdp-eyebrow { font-size: 11px; letter-spacing: .22em; color: rgba(26, 26, 26, .55); }
/* subtitle becomes the editorial whisper: Playfair italic */
[class*="template--cro-"] .bottom-desc-pdp-cro,
[class*="template--cro-"] .bottom-desc-pdp-cro strong {
  font-family: "Playfair Display", serif;
  font-style: italic;
  font-weight: 400;
}
[class*="template--cro-"] .bottom-desc-pdp-cro { font-size: 19px; letter-spacing: .01em; color: #1a1a1a; }
/* price: composed, not shouty */
[class*="template--cro-"] .product__price { font-weight: 500; letter-spacing: .02em; }
/* badges read as a spec plate */
[class*="template--cro-"] .pdp-features { row-gap: 12px; }
[class*="template--cro-"] .pdp-feature { font-size: 13px; letter-spacing: .05em; font-weight: 500; color: rgba(26, 26, 26, .82); }
/* size chips: hairline outline vocabulary (matches drawer steppers + rec chips) · active stays obsidian */
[class*="template--cro-"] .product-options__item { background: transparent; }
[class*="template--cro-"] .product-options__label {
  border: 1px solid rgba(26, 26, 26, .25);
  background: transparent;
  transition: border-color .2s ease, background-color .2s ease, color .2s ease;
}
@media (hover: hover) and (pointer: fine) {
  [class*="template--cro-"] .product-options__item:not(.is-active) .product-options__label:hover { border-color: rgba(26, 26, 26, .6); }
}
[class*="template--cro-"] .product-options__item.is-active .product-options__label { border-color: #0a0a0c; }
/* SIZE legend + Find Your Fit: boutique small-caps register */
[class*="template--cro-"] .product-selector__label { font-size: 12px; letter-spacing: .08em; }
[class*="template--cro-"] .product__size-guide .drawer__button-text {
  font-size: 11.5px;
  letter-spacing: .08em;
  text-transform: uppercase;
}
/* trust chips: champagne-gold icons, muted ink text */
[class*="template--cro-"] .pdp-trust__item { font-size: 12.5px; font-weight: 500; color: rgba(26, 26, 26, .78); }
[class*="template--cro-"] .pdp-trust__item svg { color: #B98A5F; width: 16px; height: 16px; }

/* ============================================================
   Review stars + count link refinement (2026-07-11)
   Judge.me's stock grey "N reviews" hidden · replaced by our
   count in the buy box's boutique link register (uppercase,
   tracked, underlined · same vocabulary as FIND YOUR FIT).
   The whole stars+count row stays one anchor → opens + scrolls
   to the reviews accordion (existing capture-phase listener).
   ============================================================ */
[class*="template--cro-"] .pdp-review-badge .jdgm-prev-badge__text { display: none !important; }
[class*="template--cro-"] .pdp-review-badge__count {
  font-family: "Nunito Sans", sans-serif;
  font-size: 11.5px;
  font-weight: 500;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: rgba(26, 26, 26, .75);
  text-decoration: underline;
  text-underline-offset: 3px;
  text-decoration-color: rgba(26, 26, 26, .35);
  margin-left: 10px;
  transition: color .2s ease, text-decoration-color .2s ease;
}
@media (hover: hover) and (pointer: fine) {
  [class*="template--cro-"] .pdp-review-badge:hover .pdp-review-badge__count { color: #0a0a0c; text-decoration-color: #0a0a0c; }
}

/* Rating numeral in the review badge (2026-07-11) · "★★★★★ 5.0 · 4 REVIEWS" ·
   the numeral anchors the quality claim (stars get skimmed, numbers get read);
   same quiet scale as the count so it reads as fact, not a sales bark. */
[class*="template--cro-"] .pdp-review-badge__score {
  font-family: "Nunito Sans", sans-serif;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: .04em;
  color: #1a1a1a;
  margin-left: 8px;
}
[class*="template--cro-"] .pdp-review-badge__sep {
  color: rgba(26, 26, 26, .45);
  margin: 0 7px;
  font-size: 12px;
}
[class*="template--cro-"] .pdp-review-badge__count { margin-left: 0; }

/* ============================================================
   Build-the-Set · hover-overlay neutralization (2026-07-11)
   The theme treats .card-product__sizes as a hidden hover sheet
   (opacity 0 → dark overlay pulled over the media). This module
   shows chips PERMANENTLY below each image, so on hover-capable
   desktops both treatments fired at once: a grey sheet painted
   over the static chip row (the "hover state" bug from this
   morning, superseded mid-fix). Force the whole stack static +
   transparent and put chips in the outlined vocabulary.
   ============================================================ */
[class*="template--cro-"] .complete-the-full-set-main .card-product__sizes {
  display: block !important; /* band A is the ONE chips source at every width · the theme hid it on mobile in favor of the (now-hidden) mobile-only copy, which left mobile with zero chips */
  position: static !important;
  inset: auto !important;
  margin: 10px 0 0 !important;
  visibility: visible !important;
  opacity: 1 !important;
  transform: none !important;
  width: 100% !important;
}
[class*="template--cro-"] .complete-the-full-set-main .card-product__sizes .card-product__sizes-content {
  display: block !important;
  position: static !important;
  background: transparent !important;
  box-shadow: none !important;
}
[class*="template--cro-"] .complete-the-full-set-main .card-product__sizes .card-product__sizes-content ul {
  display: flex !important;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: center;
  list-style: none;
  background: transparent !important;
  padding: 0 !important;
  margin: 0 !important;
  box-shadow: none !important;
}
[class*="template--cro-"] .complete-the-full-set-main .card-product__sizes .card-product__sizes-content li { margin: 0 !important; }
[class*="template--cro-"] .complete-the-full-set-main .card-product__sizes-btn {
  min-width: 44px;
  min-height: 40px;
  background: transparent !important;
  border: 1px solid rgba(26, 26, 26, .28) !important;
  color: #1a1a1a !important;
  font-family: "Nunito Sans", sans-serif;
  font-size: 12px;
  letter-spacing: .02em;
  transition: border-color .2s ease, background-color .2s ease, color .2s ease;
}
@media (hover: hover) and (pointer: fine) {
  [class*="template--cro-"] .complete-the-full-set-main .card-product__sizes-btn:hover {
    border-color: rgba(26, 26, 26, .6) !important;
    background: transparent !important;
    color: #1a1a1a !important;
  }
}
[class*="template--cro-"] .complete-the-full-set-main .card-product__sizes-btn.active,
[class*="template--cro-"] .complete-the-full-set-main .card-product__sizes-btn.is-active {
  background: #0a0a0c !important;
  color: #faf5ec !important;
  border-color: #0a0a0c !important;
}
[class*="template--cro-"] .complete-the-full-set-main .card-product__sizes-btn-toggle,
[class*="template--cro-"] .complete-the-full-set-main .card-product__sizes-overlay { display: none !important; }

/* the card renders a SECOND sizes-content outside .card-product__sizes (theme keeps it
   hidden; a module-wide display:block briefly resurrected it) · keep it hidden */
[class*="template--cro-"] .complete-the-full-set-main .card-product__sizes-content:not(.card-product__sizes .card-product__sizes-content) { display: none !important; }
/* the hover-swap second media image is absolute inset-0 + pointer-events:none · its grey
   letterbox painted over the chip row on hover (invisible to element probes) · module
   images stay static */
[class*="template--cro-"] .complete-the-full-set-main .card-product__media img:last-child:not(:only-child) { display: none !important; }

/* the actual grey sheet (2026-07-11 · third time's the diagnosis): the theme dims the
   card's .relative wrapper to rgba(0,0,0,.56) on hover as a bed for its overlay quick-add.
   This module's chips live INSIDE that wrapper permanently, so the dimmer painted over
   them. No overlay here → no dimmer. */
[class*="template--cro-"] .complete-the-full-set-main .card-product .relative,
[class*="template--cro-"] .complete-the-full-set-main .card-product:hover .relative {
  background: transparent !important;
}

/* ============================================================
   Build-the-Set · CRO + luxury pass (2026-07-11)
   1 name+price lockup per card (prices were floating in a
     stretched row) · 2 left-aligned column per card · 3 gold
     divider · 4 composed total lockup + concrete "You save $X"
   · 5 CTA matches the ATC's premium skin.
   ============================================================ */
/* 1+2 · card lockup: image → chips → name → price, one left-aligned column */
[class*="template--cro-"] .complete-the-full-set-main .card-product__sizes .card-product__sizes-content ul { justify-content: flex-start; }
[class*="template--cro-"] .complete-the-full-set-main .card-product__content {
  display: block;
  text-align: left;
  padding: 12px 0 0;
}
[class*="template--cro-"] .complete-the-full-set-main .card-product__title-desc { min-height: 0; margin: 0; }
[class*="template--cro-"] .complete-the-full-set-main .card-product__title {
  font-family: "Nunito Sans", sans-serif;
  font-size: 14px;
  font-weight: 600;
  letter-spacing: .01em;
  margin: 0 0 3px;
}
[class*="template--cro-"] .complete-the-full-set-main .card-product__price,
[class*="template--cro-"] .complete-the-full-set-main .card-product__price span {
  display: block;
  text-align: left;
  font-family: "Nunito Sans", sans-serif;
  font-size: 13px;
  font-weight: 500;
  color: rgba(26, 26, 26, .75);
  margin: 0;
  padding: 0;
}
/* 3 · the rule above the total joins the gold line-language */
[class*="template--cro-"] .complete-the-full-set-btn,
[class*="template--cro-"] .complete-the-full-set-price { border-color: rgba(205, 155, 119, .5) !important; }
/* 4 · total lockup: quiet tracked label · composed price · muted compare · gold savings */
[class*="template--cro-"] .complete-the-full-set-price-head {
  font-family: "Nunito Sans", sans-serif;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: rgba(26, 26, 26, .65);
}
[class*="template--cro-"] .complete-the-full-set-price-main span {
  font-family: "Nunito Sans", sans-serif;
  font-size: 21px;
  font-weight: 600;
  color: #1a1a1a;
}
[class*="template--cro-"] .complete-the-full-set-price-main s {
  font-family: "Nunito Sans", sans-serif;
  font-size: 13.5px;
  font-weight: 400;
  color: rgba(26, 26, 26, .45);
  margin-left: 8px;
}
/* .complete-the-full-set-price is itself display:flex (label | price | save as 3 siblings
   with justify-content:space-between) — force wrap + a full-width basis so the save line
   ALWAYS drops to its own row under label+price, never crowds them at any width */
[class*="template--cro-"] .complete-the-full-set-price {
  flex-wrap: wrap !important;
  row-gap: 4px;
}
[class*="template--cro-"] .complete-the-full-set-save {
  display: block;
  flex-basis: 100% !important;
  width: 100%;
  order: 3;
  font-family: "Nunito Sans", sans-serif;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: #B98A5F;
  text-align: right;
}
/* 5 · CTA wears the ATC skin */
[class*="template--cro-"] .complete-the-full-main-cart {
  background: #0a0a0c !important;
  color: #faf5ec !important;
  border: 0;
  font-family: "Nunito Sans", sans-serif;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: .14em;
  text-transform: uppercase;
  min-height: 52px;
  transition: background-color .2s ease;
}
@media (hover: hover) and (pointer: fine) {
  [class*="template--cro-"] .complete-the-full-main-cart:hover { background: #26262a !important; }
}

/* mobile chips restore (2026-07-11) · the theme's mobile stylesheet display:none's the
   in-sizes content variant (it expects its mobile-only copy, which stays hidden here) and
   out-specified the earlier block rule · element+class chain wins at every width */
[class*="template--cro-"] .complete-the-full-set-main card-product.card-product .card-product__sizes .card-product__sizes-content,
[class*="template--cro-"] .complete-the-full-set-main .card-product .card-product__sizes .card-product__sizes-content {
  display: block !important;
}

/* mobile chips meet the 44px tap floor (theme's mobile block caps them at 33-36px) */
@media (max-width: 749px) {
  [class*="template--cro-"] .complete-the-full-set-main .card-product__sizes-btn {
    min-width: 44px !important;
    min-height: 44px !important;
    max-width: none !important;
    max-height: none !important;
  }
}

/* 2026-07-11 · buy-box star badge (#pdp-reviews) now anchors to the Loved-by-Lovies band · offset for the sticky header */
[class*="template--cro-"] .pdp-lovies { scroll-margin-top: 92px; }

/* ============================================================= */
/* 2026-07-11 · PDP collection grids → horizontal PEEK CAROUSELS (Brennah: the product
   grids felt "too ecommerce cataloggy"). Converts "Complete the look." (.pdp-pairs__grid)
   and "Also in [colorway]" (.pdp-reco__grid) into native scroll-snap sliders with the
   next card peeking. No JS / no Swiper (dodges the loop few-slides gotcha).
   2026-07-12 (McKenzie): MOBILE-ONLY — desktop reverts to the original 3-col grids
   (with 6 pieces = two clean rows of 3); the earlier grid rules reapply at >=750px. */
@media (max-width: 749px) {
  [class*="template--cro-"] .pdp-pairs__grid,
  [class*="template--cro-"] .pdp-reco__grid {
    display: flex !important;
    grid-template-columns: none !important;
    flex-wrap: nowrap !important;
    overflow-x: auto;
    overflow-y: hidden;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior-x: contain;
    gap: 14px !important;
    padding-bottom: 8px;               /* room for card hover shadow */
    scrollbar-width: none;             /* Firefox */
  }
  [class*="template--cro-"] .pdp-pairs__grid::-webkit-scrollbar,
  [class*="template--cro-"] .pdp-reco__grid::-webkit-scrollbar { display: none; }  /* WebKit */
  [class*="template--cro-"] .pdp-pairs__grid .pdp-reco__card,
  [class*="template--cro-"] .pdp-reco__grid .pdp-reco__card {
    flex: 0 0 64%;                     /* ~1 full card + strong peek */
    scroll-snap-align: start;
  }
}
/* ============================================================= */

/* ============================================================= */
/* 2026-07-11 · Loved-by-Lovies editorial refinement (McKenzie): framed quote cards on the
   ivory band (mirrors the approved /pages/reviews featured strip), tighter width + vertical
   rhythm, italic sub-line under the head, attribution pinned to the card base, refined text
   CTA. Kills the theme's default blockquote left-border that leaked on borderless cards. */
[class*="template--cro-"] .pdp-lovies { padding: 52px 20px 56px; }
[class*="template--cro-"] .pdp-lovies .pdp-inner { max-width: 680px; }
[class*="template--cro-"] .pdp-lovies__stars { font-size: 13px; margin: 0 0 12px; }
[class*="template--cro-"] .pdp-lovies .pdp-head { margin: 0; }
[class*="template--cro-"] .pdp-lovies__sub { font-family: "Playfair Display", serif; font-style: italic; font-size: 15px; letter-spacing: .01em; text-transform: none; color: rgba(10,10,12,.55); margin: 10px 0 0; }
[class*="template--cro-"] .pdp-lovies__grid { margin-top: 28px; gap: 14px; }
[class*="template--cro-"] .pdp-lovies__card,
[class*="template--cro-"] .pdp-lovies__card:first-child {
  background: #fffdf9;
  border: 1px solid rgba(205, 155, 119, .38);
  padding: 24px 22px 20px;
  display: flex;
  flex-direction: column;
}
[class*="template--cro-"] .pdp-lovies__cardstars { font-size: 12px; margin: 0 0 .7rem; }
[class*="template--cro-"] .pdp-lovies__quote { font-size: 17px; line-height: 1.55; margin: 0 0 1.1rem; }
[class*="template--cro-"] .pdp-lovies__by { margin-top: auto; gap: 3px; font-size: 12.5px; font-weight: 600; }
[class*="template--cro-"] .pdp-lovies__label { font-size: 10.5px; letter-spacing: .12em; font-weight: 400; }
[class*="template--cro-"] .pdp-lovies__cta { margin-top: 26px; font-family: "Nunito Sans", sans-serif; font-size: 12px; letter-spacing: .14em; text-transform: uppercase; color: #0a0a0c; text-decoration: underline; text-decoration-color: rgba(205,155,119,.7); text-underline-offset: 4px; }
@media (min-width: 750px) {
  [class*="template--cro-"] .pdp-lovies { padding: 64px 24px 68px; }
  [class*="template--cro-"] .pdp-lovies .pdp-inner { max-width: 1000px; }
  [class*="template--cro-"] .pdp-lovies__grid { grid-template-columns: repeat(3, 1fr); gap: 22px; margin-top: 32px; align-items: stretch; }
  [class*="template--cro-"] .pdp-lovies__card,
  [class*="template--cro-"] .pdp-lovies__card:first-child { border: 1px solid rgba(205, 155, 119, .38); padding: 28px 26px 22px; }
}
@media (hover: hover) {
  [class*="template--cro-"] .pdp-lovies__cta:hover { text-decoration-color: #cd9b77; }
}
/* ============================================================= */

/* ============================================================= */
/* 2026-07-11 · Brand close refinement (McKenzie): the sign-off was a tall empty black
   block with one stranded line. Tighter responsive padding, gold hairline seam at the
   cream-to-black edge, refined Playfair italic, quiet underlined Eclipse CTA.
   Scoped to .pdp-close-band (pdp-band--dark is shared with the Why Silk band). */
[class*="template--cro-"] .pdp-close-band { border-top: 1px solid rgba(205, 155, 119, .35); padding: 46px 20px 50px; }
[class*="template--cro-"] .pdp-close-band .pdp-inner { max-width: 560px; }
[class*="template--cro-"] .pdp-close-band__in { text-align: center; }
[class*="template--cro-"] .pdp-close-band .pdp-close { font-family: "Playfair Display", serif; font-style: italic; font-weight: 400; font-size: 20px; line-height: 1.45; letter-spacing: .01em; color: #faf5ec; margin: 0; }
[class*="template--cro-"] .pdp-close-band__cta { display: inline-block; margin-top: 18px; font-family: "Nunito Sans", sans-serif; font-size: 11.5px; letter-spacing: .16em; text-transform: uppercase; color: rgba(250,245,236,.85); text-decoration: underline; text-decoration-color: rgba(205,155,119,.6); text-underline-offset: 4px; }
@media (min-width: 750px) {
  [class*="template--cro-"] .pdp-close-band { padding: 58px 24px 62px; }
  [class*="template--cro-"] .pdp-close-band .pdp-close { font-size: 24px; }
}
@media (hover: hover) {
  [class*="template--cro-"] .pdp-close-band__cta:hover { color: #ffffff; text-decoration-color: #cd9b77; }
}
/* ============================================================= */

/* ============================================================= */
/* 2026-07-12 · Find-your-fit block (McKenzie): fit-model lines out, size-guide link
   restored · boutique register on the ivory band, matching the lovies/silk links. */
[class*="template--cro-"] .pdp-fit__link { display: inline-block; margin-top: 16px; font-family: "Nunito Sans", sans-serif; font-size: 12px; letter-spacing: .14em; text-transform: uppercase; color: #0a0a0c; text-decoration: underline; text-decoration-color: rgba(205,155,119,.7); text-underline-offset: 4px; }
@media (hover: hover) {
  [class*="template--cro-"] .pdp-fit__link:hover { text-decoration-color: #cd9b77; }
}
/* ============================================================= */

/* Pre-launch audit fix 2026-07-12 (McKenzie-authorized safe-fix carve-out) · card-product.js clones every
   size panel into a .js-card-sizes-duplicate holder appended at body end (global.js pattern for the stock
   mobile quick-add sheet). section-product-cro.css hides that holder's content on desktop (min-width:767)
   and while the drawer is open (.cart-drawer-active) but never in the idle mobile state, so the cloned
   XS/S/M/L chip rows sat visible below the footer on every cro- PDP (live theme is clean · Launch-only).
   The CTS block's inline chips and the drawer's own panels are ORIGINALS (cloneNode deep), untouched by
   hiding the clone holder. Scoped to the 8 cro- templates so collection/home stock quick-add keeps its sheet. */
[class*="template--cro-"] .js-card-sizes-duplicate { display: none; }

/* 2026-07-12 · Complete-the-Set dropdown size selectors (McKenzie · chip rows read busy when a
   bra brings 9 sizes into the set). The legacy chip UI stays in the DOM but hidden — card-product.js
   duplicateSizes() requires .js-sizes-content to exist (unconditional querySelector + cloneNode).
   Scoped to the buy-box set block only; the drawer rec-cards keep their chip flow. */
/* specificity note: section-product-cro.css forces these visible with
   `.complete-the-full-set-main .card-product .card-product__sizes-content { display:block !important }`
   (0,3,0) · the hide must outrank it, hence the stacked classes (0,4,0) */
.complete-the-full-set-main-sec .complete-the-full-set-main .card-product .card-product__sizes,
.complete-the-full-set-main-sec .complete-the-full-set-main .card-product .card-product__sizes-content,
.complete-the-full-set-main-sec .card-product .card-product__sizes,
.complete-the-full-set-main-sec .card-product .card-product__sizes-content { display: none !important; }
.complete-the-full-set-main-sec .cts-size-field { margin-top: 10px; }
.complete-the-full-set-main-sec .cts-size-select {
  -webkit-appearance: none;
  appearance: none;
  width: 100%;
  height: 42px;
  padding: 0 36px 0 12px;
  font-family: "Nunito Sans", sans-serif;
  font-size: 12px;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: #0a0a0c;
  background-color: #fffdf9;
  border: 1px solid rgba(10, 10, 12, .28);
  border-radius: 0;
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8' fill='none'%3E%3Cpath d='M1 1.5L6 6.5L11 1.5' stroke='%230a0a0c' stroke-width='1.4' stroke-linecap='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 12px center;
  cursor: pointer;
}
.complete-the-full-set-main-sec .cts-size-select:focus-visible { outline: 2px solid #cd9b77; outline-offset: 2px; }
@media (hover: hover) { .complete-the-full-set-main-sec .cts-size-select:hover { border-color: #0a0a0c; } }
.complete-the-full-set-main-sec card-product.missing-variant .cts-size-select { border-color: #cd9b77; box-shadow: 0 0 0 1px #cd9b77; }

/* 2026-07-12 · McKenzie final cart copy · summary note + combined option line ("32DD · Black") + discount row */
#shopify-section-cart-drawer .cart-drawer__summary-note,
.cart-drawer__summary-note {
  font-family: "Nunito Sans", sans-serif;
  font-size: 11px;
  letter-spacing: .02em;
  color: rgba(10, 10, 12, .62);
  margin: 6px 0 10px;
}
#shopify-section-cart-drawer .cart-item__opt-combined,
.cart-item__opt-combined {
  font-family: "Nunito Sans", sans-serif;
  font-size: 12px;
  letter-spacing: .04em;
  color: rgba(10, 10, 12, .72);
}
.cart-drawer__summary-discount-amt { white-space: nowrap; }

/* 2026-07-12 · McKenzie: "Also in [colorway]" CTA joins the boutique link register (was the
   generic pdp-link sentence-case underline · now matches pdp-fit__link / lovies CTA / close CTA) */
[class*="template--cro-"] .pdp-reco__cta {
  display: inline-block;
  margin-top: 32px;
  font-family: "Nunito Sans", sans-serif;
  font-size: 12px;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: #0a0a0c;
  text-decoration: underline;
  text-decoration-color: rgba(205, 155, 119, .7);
  text-underline-offset: 4px;
}
@media (hover: hover) { [class*="template--cro-"] .pdp-reco__cta:hover { text-decoration-color: #cd9b77; } }

/* 2026-07-12 · McKenzie: Complete-the-Eclipse-Collection block · aesthetic pass for the dropdown
   era. Cards become flex columns with the select pinned to a shared baseline (margin-top:auto)
   so a wrapping title (Back-Seamed Stockings) can't stagger the row; tightened name/price rhythm;
   breathing room before the total row and CTA. */
.complete-the-full-set-main-sec .card-product-slider__slide-main { display: flex; }
.complete-the-full-set-main-sec .card-product-slider__slide-main .card-product {
  display: flex;
  flex-direction: column;
  width: 100%;
}
.complete-the-full-set-main-sec .card-product .card-product__content {
  display: block;
  padding: 0;
  margin-top: 10px;
}
.complete-the-full-set-main-sec .card-product .card-product__title {
  font-family: "Nunito Sans", sans-serif;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: .02em;
  line-height: 1.35;
  margin: 0 0 2px;
}
.complete-the-full-set-main-sec .card-product .card-product__price {
  font-family: "Nunito Sans", sans-serif;
  font-size: 13px;
  color: rgba(10, 10, 12, .65);
}
.complete-the-full-set-main-sec .cts-size-field { margin-top: auto; padding-top: 12px; }
.complete-the-full-set-main-sec .complete-the-full-set-btn { margin-top: 20px; }
.complete-the-full-set-main-sec .complete-the-full-set-main-sec-head h5 { margin-bottom: 18px; }

/* 2026-07-12 · McKenzie: spec accordions → Bordelle-function TABS (theme-native content_tabs
   block + tabs-main-product.js · templates migrated from 4 collapsible_content blocks, copy
   verbatim). BHL register: uppercase tracked Nunito row, active = ink + gold seat on the
   hairline, inactive muted; airy panel below; the row scrolls horizontally on narrow screens.
   (0,3,0)+ selectors on purpose: the block's own #block-id inline styles and the theme's
   section CSS must lose. Panels default-hidden with tab one's panel shown pre-JS
   (adjacent-sibling: the buttons row div precedes panel one). */
[class*="template--cro-"] .main-product__tabs-wrapper { margin-top: 26px; }
[class*="template--cro-"] .main-product__tabs-wrapper .main-product__tabs {
  display: flex;
  flex-wrap: nowrap;
  gap: 22px;
  border: 0;
  border-bottom: 1px solid rgba(205, 155, 119, .35);
  overflow-x: auto;
  scrollbar-width: none;
  -webkit-overflow-scrolling: touch;
}
[class*="template--cro-"] .main-product__tabs-wrapper .main-product__tabs::-webkit-scrollbar { display: none; }
[class*="template--cro-"] .main-product__tabs-wrapper .main-product__tab {
  margin: 0 !important;
  padding: 0 0 12px;
  background: none;
  border: 0;
  border-radius: 0;
  font-family: "Nunito Sans", sans-serif;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: rgba(10, 10, 12, .42);
  cursor: pointer;
  white-space: nowrap;
  position: relative;
  flex: 0 0 auto;
}
[class*="template--cro-"] .main-product__tabs-wrapper .main-product__tab.active { color: #0a0a0c; }
[class*="template--cro-"] .main-product__tabs-wrapper .main-product__tab.active::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: -1px;
  height: 2px;
  background: #cd9b77;
}
@media (hover: hover) {
  [class*="template--cro-"] .main-product__tabs-wrapper .main-product__tab:hover { color: #0a0a0c; }
}
[class*="template--cro-"] .main-product__tabs-wrapper .main-product__tab-content {
  display: none;
  padding-top: 18px;
  font-family: "Nunito Sans", sans-serif;
  font-size: 14px;
  line-height: 1.75;
  color: rgba(10, 10, 12, .8);
}
[class*="template--cro-"] .main-product__tabs-wrapper .main-product__tabs + .main-product__tab-content { display: block; }
[class*="template--cro-"] .main-product__tabs-wrapper .main-product__tab-content p { margin: 0 0 10px; }
[class*="template--cro-"] .main-product__tabs-wrapper .main-product__tab-content p:last-child { margin-bottom: 0; }

/* 2026-07-12 · McKenzie: mobile PDP gallery dots → thin gold slider (v2 per his notes).
   The dots are MAGIC ZOOM's mobile bullet selectors (#msc-selectors-container · a.mz-thumb per
   media, active = .mz-thumb-selected). v2: the app's leftover round active-ring (the "white
   blip" · a pseudo-element my first reset missed) is nuked along with any non-thumb strays;
   the track is FULL-BLEED (photo width, no cap, no centering) and the visible 3px line sits
   flush against the photo's bottom edge (no top border · the 12px transparent bottom border
   keeps the tap band below the line). Mobile + cro templates only. */
@media (max-width: 749px) {
  [class*="template--cro-"] .MagicToolboxSelectorsContainer.mobile-view-bullets {
    margin: 0 !important;
    padding: 0 !important;
    line-height: 0;
  }
  [class*="template--cro-"] .MagicToolboxSelectorsContainer.mobile-view-bullets #msc-selectors-container {
    display: flex;
    align-items: flex-start;
    justify-content: stretch;
    gap: 0;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
  }
  [class*="template--cro-"] .MagicToolboxSelectorsContainer.mobile-view-bullets #msc-selectors-container > *:not(a.mz-thumb) {
    display: none !important;
  }
  [class*="template--cro-"] .MagicToolboxSelectorsContainer.mobile-view-bullets #msc-selectors-container a.mz-thumb {
    flex: 1 1 0;
    max-width: none;
    width: auto !important;
    height: 15px !important;
    min-width: 0 !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    border-radius: 0 !important;
    border-top: 0 !important;
    border-bottom: 12px solid transparent !important;
    border-left: 0 !important;
    border-right: 0 !important;
    outline: none !important;
    background: rgba(10, 10, 12, .16) !important;
    background-clip: content-box !important;
    box-shadow: none !important;
    opacity: 1 !important;
    overflow: hidden;
    transition: background-color .3s ease;
  }
  [class*="template--cro-"] .MagicToolboxSelectorsContainer.mobile-view-bullets #msc-selectors-container a.mz-thumb::before,
  [class*="template--cro-"] .MagicToolboxSelectorsContainer.mobile-view-bullets #msc-selectors-container a.mz-thumb::after {
    content: none !important;
    display: none !important;
  }
  [class*="template--cro-"] .MagicToolboxSelectorsContainer.mobile-view-bullets #msc-selectors-container a.mz-thumb img {
    display: none !important;
  }
  [class*="template--cro-"] .MagicToolboxSelectorsContainer.mobile-view-bullets #msc-selectors-container a.mz-thumb-selected {
    background: #cd9b77 !important;
    background-clip: content-box !important;
  }
}

/* 2026-07-12 · McKenzie: applied-discount rows sit SMALL above the Subtotal row
   (covers Genie/code discounts at cart level AND the aggregated line-level
   "Complete The Set" 10% · markup in cart-drawer.liquid #cart-summary) */
#shopify-section-cart-drawer .cart-drawer__summary-discounts { margin: 0 0 8px; display: flex; flex-direction: column; gap: 4px; }
#shopify-section-cart-drawer .cart-drawer__summary-discounts li { display: flex; align-items: center; gap: 6px; font-family: "Nunito Sans", sans-serif; font-size: 12px; letter-spacing: .03em; color: rgba(10, 10, 12, .65); }
#shopify-section-cart-drawer .cart-drawer__summary-discounts li svg { width: 12px; height: 12px; flex: none; }
#shopify-section-cart-drawer .cart-drawer__summary-discounts li > span { flex: 1 1 auto; display: flex; justify-content: space-between; gap: 10px; }
#shopify-section-cart-drawer .cart-drawer__summary-discount-amt { color: #0a0a0c; font-weight: 600; white-space: nowrap; }

/* 2026-07-12 · collection.description under the banner heading (Eclipse only today) */
.collection-banner__desc { margin-top: 10px; max-width: 560px; }
.collection-banner__desc a {
  color: inherit;
  text-decoration: underline;
  text-decoration-color: rgba(205, 155, 119, .7);
  text-underline-offset: 3px;
}
@media (hover: hover) { .collection-banner__desc a:hover { text-decoration-color: #cd9b77; } }

/* 2026-07-12 · McKenzie: CTS card · size dropdown moves onto the PRICE line (less vertical
   space). Grid re-flow of the existing DOM: media / title / [price · select]. The anchor
   wrapping title+price goes display:contents so its children become grid items (links stay
   clickable). Rows: title takes the flexible middle so the price+select line sits on a shared
   bottom baseline across all three cards even when a name wraps. Overrides the earlier
   stacked-select rules (.cts-size-field margin/padding reset here wins by cascade order). */
.complete-the-full-set-main-sec .card-product-slider__slide-main .card-product {
  display: grid !important;
  grid-template-columns: 1fr minmax(96px, 132px);
  grid-template-rows: auto 1fr auto;
  grid-template-areas:
    "media media"
    "title title"
    "price select";
  column-gap: 10px;
  height: 100%;
}
.complete-the-full-set-main-sec .card-product > .relative { grid-area: media; }
.complete-the-full-set-main-sec .card-product .card-product__content { display: contents; }
/* v2 fix: the h5 sits inside a .card-product__title-desc wrapper div — with the anchor at
   display:contents the WRAPPER is the grid item (the h5 isn't), so the area must go on it.
   Without this the wrapper auto-placed into a collapsed implicit cell and titles wrapped
   one syllable per line. */
.complete-the-full-set-main-sec .card-product .card-product__title-desc { grid-area: title; align-self: start; min-width: 0; }
.complete-the-full-set-main-sec .card-product .card-product__title { margin: 10px 0 8px; }
.complete-the-full-set-main-sec .card-product .card-product__price { grid-area: price; align-self: center; margin: 0; }
.complete-the-full-set-main-sec .cts-size-field { grid-area: select; align-self: center; margin: 0; padding: 0; }
.complete-the-full-set-main-sec .cts-size-field .js-cts-size { width: 100%; }

/* 2026-07-12 · same-line CTS select: tighter tracking + padding so "SELECT SIZE" fits the
   narrow column without clipping (was letter-spacing .12em / 30px chevron gutter) */
.complete-the-full-set-main-sec .cts-size-field .js-cts-size {
  letter-spacing: .07em;
  padding-left: 8px;
  padding-right: 26px;
  background-position: right 8px center;
}

/* 2026-07-12 · McKenzie: spec-tab panel formatting. Lead line goes editorial (Playfair italic),
   body gets a reading measure, and the Description tab ends in a hairline-topped composition
   row (95% Silk · 5% Elastane · Fully Silk-Lined on silk pieces · sourced non-fiber facts on
   stockings until real fiber content is supplied). */
[class*="template--cro-"] .main-product__tab-content p {
  font-size: 14.5px;
  line-height: 1.75;
  color: rgba(10, 10, 12, .78);
  max-width: 60ch;
  margin: 0 0 12px;
}
[class*="template--cro-"] .main-product__tab-content p:last-child { margin-bottom: 0; }
[class*="template--cro-"] .main-product__tab-content a {
  color: #0a0a0c;
  text-decoration: underline;
  text-decoration-color: rgba(205, 155, 119, .7);
  text-underline-offset: 3px;
}
@media (hover: hover) { [class*="template--cro-"] .main-product__tab-content a:hover { text-decoration-color: #cd9b77; } }
/* Shopify richtext settings STRIP class attributes on save (the pdp-tab-lead/pdp-tab-specs
   classes never reach the DOM) → structural selectors scoped to the Description panel
   ([id^="tab-one-"]): first p = editorial lead · last p = the composition specs row. */
[class*="template--cro-"] .main-product__tab-content[id^="tab-one-"] > p:first-child {
  font-family: "Playfair Display", serif;
  font-style: italic;
  font-size: 18px;
  line-height: 1.5;
  color: #0a0a0c;
}
[class*="template--cro-"] .main-product__tab-content .pdp-tab-specs {
  margin-top: 18px;
  padding-top: 12px;
  border-top: 1px solid rgba(205, 155, 119, .35);
  font-family: "Nunito Sans", sans-serif;
  font-style: normal;
  font-size: 11px;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: rgba(10, 10, 12, .6);
}

/* 2026-07-12 · McKenzie: gallery arrows OFF everywhere (was mobile-only, extended to all
   viewports same day: "lets get rid of the grey arrows on the pdp photo carousel").
   Swipe owns the gallery on mobile; thumbnails + drag carry desktop. */
[class*="template--cro-"] .mySwiper2 .swiper-button-next,
[class*="template--cro-"] .mySwiper2 .swiper-button-prev {
  display: none !important;
}

/* 2026-07-12 · McKenzie: mobile buy-box intro compression.
   Baseline stack (eyebrow→features) measured 315px on the High-Waist; targets: tighter flex
   gaps, 27px title, zero badge margins, 16px subtitle, tighter hairlines, denser feature grid. */
@media (max-width: 749px) {
  [class*="template--cro-"] .product-selector,
  [class*="template--cro-"] .product-selector.product-selector--buttons {
    row-gap: 8px !important;
    margin-block: 10px !important;
  }
  [class*="template--cro-"] .pdp-eyebrow { font-size: 10.5px; margin: 0; }
  [class*="template--cro-"] h1.product__title { font-size: 27px; line-height: 1.18; margin: 0; }
  [class*="template--cro-"] .pdp-review-badge { min-height: 40px; padding: 2px 2px; margin: 0; }
  [class*="template--cro-"] .bottom-desc-pdp-cro { font-size: 16px; margin: 0; }
  [class*="template--cro-"] .product__price { padding-bottom: 2px !important; }
  [id*="__main"] .pdp-hairline { margin: 10px 0; }
  [class*="template--cro-"] .pdp-features { row-gap: 6px; column-gap: 14px; }
  [class*="template--cro-"] .pdp-feature { font-size: 11.5px; line-height: 1.3; }
}

/* 2026-07-12 · McKenzie: CTS mobile vertical rhythm. The air between title and the price/select
   row was the 1fr grid track absorbing equal-height slack — top-pack the card on mobile
   (desktop keeps the 1fr baseline alignment across columns). Head + bottom block tightened. */
@media (max-width: 749px) {
  [class*="template--cro-"] .complete-the-full-set-main-sec-head h4 { margin-bottom: 4px; }
  [class*="template--cro-"] .complete-the-full-set-main-sec-head h5 { margin-bottom: 14px; }
  .complete-the-full-set-main-sec .card-product-slider__slide-main .card-product {
    grid-template-rows: auto auto auto;
    align-content: start;
    height: auto;
  }
  .complete-the-full-set-main-sec .card-product .card-product__title-desc { margin-top: 8px; }
  .complete-the-full-set-main-sec .card-product .card-product__title { margin: 0; }
  .complete-the-full-set-main-sec .cts-size-field { padding-top: 8px; }
  .complete-the-full-set-main-sec .complete-the-full-set-btn { margin-top: 14px; }
  .complete-the-full-set-main-sec .complete-the-full-set-price { margin-bottom: 10px; }
}

/* 2026-07-12 · McKenzie: scroll-reveal for the editorial descent. Compositor-only properties
   (opacity/transform · zero layout cost, zero CLS), .js-reveal is added BY JS at init so
   no-JS/legacy renders everything visible, and prefers-reduced-motion never animates. */
@media (prefers-reduced-motion: no-preference) {
  [class*="template--cro-"] .js-reveal {
    opacity: 0;
    transform: translateY(22px);
    transition: opacity .65s cubic-bezier(.22, .61, .36, 1), transform .65s cubic-bezier(.22, .61, .36, 1);
  }
  [class*="template--cro-"] .js-reveal.is-revealed {
    opacity: 1;
    transform: none;
  }
}

/* 2026-07-12 · McKenzie Option 1 fit-band: photo leads on mobile (the band's main asset),
   one-line fit copy follows. Desktop keeps the copy-left / photo-right editorial columns. */
@media (max-width: 749px) {
  [class*="template--cro-"] .pdp-fit__inner { display: flex; flex-direction: column; }
  [class*="template--cro-"] .pdp-fit__media { order: -1; margin-top: 0; margin-bottom: 20px; }
}

/* 2026-07-12 · McKenzie: CTS mobile vertical trim, measured pass (~11% of the 746px block ·
   his band: 10-15%, "premium, not more"). Slides 63%→~55% of viewport (image ~338→~293px ·
   still the dominant editorial asset), section padding 26→16/20, subtitle seam 14→10,
   rail/total/CTA seams tightened. Copy, math, logic, desktop untouched. */
@media (max-width: 749px) {
  [class*="template--cro-"] .complete-the-full-set-main-sec { padding-top: 16px; padding-bottom: 20px; }
  [class*="template--cro-"] .complete-the-full-set-main-sec-head h5 { margin-bottom: 10px; }
  .complete-the-full-set-main-sec .card-product-slider__slide-main {
    min-width: calc(73% - 12px) !important;
    width: calc(73% - 12px) !important;
  }
  .complete-the-full-set-main-sec .complete-the-full-set-main { padding-bottom: 8px; }
  .complete-the-full-set-main-sec .complete-the-full-set-btn { margin-top: 8px; }
  .complete-the-full-set-main-sec .complete-the-full-set-price { margin-bottom: 6px; }
}

/* 2026-07-12 · CTS trim, second notch: first pass measured 8.7% (shy of McKenzie's 10-15%
   band) → slides 73%→70.5%, head/pad hairline shaves. Lands ~10.5%. */
@media (max-width: 749px) {
  [class*="template--cro-"] .complete-the-full-set-main-sec { padding-top: 14px; }
  [class*="template--cro-"] .complete-the-full-set-main-sec-head h4 { margin-bottom: 2px; }
  .complete-the-full-set-main-sec .card-product-slider__slide-main {
    min-width: calc(70.5% - 12px) !important;
    width: calc(70.5% - 12px) !important;
  }
}

/* 2026-07-12 · CTS total/savings: 5px right breathing room on mobile (McKenzie-approved ·
   the $432 strikethrough + YOU SAVE sat flush at 390px). Layout/pricing untouched. */
@media (max-width: 749px) {
  .complete-the-full-set-main-sec .complete-the-full-set-price { padding-right: 5px; }
}

/* 2026-07-12 · spec-tab panel entry · subtle slide-in when a tab opens (pairs with the swipe
   gesture in custom.js · replays on each display none→block flip · reduced-motion exempt) */
@media (prefers-reduced-motion: no-preference) {
  [class*="template--cro-"] .main-product__tab-content { animation: pdpTabIn .28s ease; }
  @keyframes pdpTabIn {
    from { opacity: 0; transform: translateX(9px); }
    to { opacity: 1; transform: none; }
  }
}

/* 2026-07-12 · guard: nothing inside the tabs wrapper may bleed horizontal overflow to the
   page (the panel slide-in translates 9px · the buy-box-shift bug taught us ancestors will
   happily scroll). The tab row's own overflow-x scroll is a child scroller and unaffected. */
[class*="template--cro-"] .main-product__tabs-wrapper { overflow-x: clip; }

/* 2026-07-12 · McKenzie: Complete the look / Also in [colorway] · FULL collections in both
   (was 6-cap) · desktop converts the stacked 3-col grid ("feels really heavy") to a single
   editorial scroll rail: ~3.6 cards visible with a peek, scroll-snap, quiet boutique arrows
   top-right. Mobile keeps its existing peek carousel and simply gets more cards. */
@media (min-width: 750px) {
  [class*="template--cro-"] .pdp-pairs__grid,
  [class*="template--cro-"] .pdp-reco__grid {
    display: flex !important;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    scroll-behavior: smooth;
    scrollbar-width: none;
    gap: 24px !important;
    padding-bottom: 6px;
  }
  [class*="template--cro-"] .pdp-pairs__grid::-webkit-scrollbar,
  [class*="template--cro-"] .pdp-reco__grid::-webkit-scrollbar { display: none; }
  [class*="template--cro-"] .pdp-pairs__grid > .pdp-reco__card,
  [class*="template--cro-"] .pdp-reco__grid > .pdp-reco__card {
    flex: 0 0 calc((100% - 63px) / 3.6);
    min-width: 0;
    scroll-snap-align: start;
  }
  [class*="template--cro-"] .pdp-pairs__inner,
  [class*="template--cro-"] .pdp-reco__inner { position: relative; }
  [class*="template--cro-"] .pdp-rail__nav { position: absolute; top: 4px; right: 0; display: flex; gap: 8px; }
  [class*="template--cro-"] .pdp-rail__arrow {
    width: 36px;
    height: 36px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: transparent;
    border: 1px solid rgba(10, 10, 12, .25);
    color: #0a0a0c;
    cursor: pointer;
    transition: border-color .25s ease, color .25s ease;
  }
}
@media (hover: hover) and (min-width: 750px) {
  [class*="template--cro-"] .pdp-rail__arrow:hover { border-color: #cd9b77; color: #cd9b77; }
}
@media (max-width: 749px) {
  [class*="template--cro-"] .pdp-rail__nav { display: none; }
}

/* 2026-07-12 · McKenzie: photo-carousel arrows, round 7 = REAL INLINE SVG (root-cause fix).
   Every CSS-drawn icon on this app's main arrows failed: ::before data-URI painted broken, a
   border-box chevron reported white borders in getComputedStyle but painted nothing, and a font
   glyph is font-dependent (renders tiny/wrong in a real browser even when headless shows it). A
   real <svg> DOM node (injected by custom.js) renders identically everywhere at the exact size
   we set. We keep the app anchor's native click (nav works), kill its own icon, and style OUR svg:
   tall thin white stroke, bold enough to read, strong layered drop-shadow for contrast on light
   AND dark photos, gold on hover, no box. 48x60 hit area, always visible >=750px, mobile swipe-only. */
@media (max-width: 749px) {
  [class*="template--cro-"] .MagicToolboxSlides a.MagicToolboxSlides-arrow { display: none !important; }
}
@media (min-width: 750px) {
  [class*="template--cro-"] .MagicToolboxSlides a.MagicToolboxSlides-arrow {
    width: 48px !important; height: 60px !important;
    background: transparent !important; border: 0 !important; border-radius: 0 !important;
    display: flex !important; align-items: center !important; justify-content: center !important;
    opacity: 1 !important; text-decoration: none !important; filter: none !important;
    z-index: 60 !important;
  }
  [class*="template--cro-"] .MagicToolboxSlides a.MagicToolboxSlides-arrow::before,
  [class*="template--cro-"] .MagicToolboxSlides a.MagicToolboxSlides-arrow::after {
    content: none !important; background: none !important; border: 0 !important;
  }
  [class*="template--cro-"] .MagicToolboxSlides a.MagicToolboxSlides-arrow.magic-prev { left: 10px !important; }
  [class*="template--cro-"] .MagicToolboxSlides a.MagicToolboxSlides-arrow.magic-next { right: 10px !important; }
  [class*="template--cro-"] .MagicToolboxSlides a.MagicToolboxSlides-arrow .bhl-arrow-svg {
    display: block !important; width: 24px !important; height: 44px !important;
    filter: drop-shadow(0 1px 3px rgba(0,0,0,.7)) drop-shadow(0 0 2px rgba(0,0,0,.55)) !important;
    pointer-events: none !important;
  }
  [class*="template--cro-"] .MagicToolboxSlides a.MagicToolboxSlides-arrow .bhl-arrow-svg path {
    stroke: #ffffff !important; transition: stroke .2s ease !important;
  }
  [class*="template--cro-"] .MagicToolboxSlides a.MagicToolboxSlides-arrow:hover .bhl-arrow-svg path {
    stroke: #cd9b77 !important;
  }
}

/* 2026-07-12 · McKenzie: "i should be able to scroll through all of the thumbnails". The
   desktop thumb rail is a MagicScroll carousel (7 unique thumbs, ~4 visible) whose ONLY nav is
   its pager buttons (.mcs-button-arrow, arrows-outside) · round-1 hid them with the grey chrome,
   which stranded thumbs 5-7. Restored here and restyled to the boutique register: thin INK
   hairline chevrons (rail sits on the light page bg, so ink not white), gold on hover. Desktop
   only · mobile uses the gold bullet slider, not this rail. */
@media (min-width: 750px) {
  [class*="template--cro-"] .mcs-button-arrow {
    display: flex !important; align-items: center !important; justify-content: center !important;
    background: none !important; box-shadow: none !important; border: 0 !important;
    opacity: .65 !important;
    transition: opacity .2s ease !important;
  }
  [class*="template--cro-"] .mcs-button-arrow:hover { opacity: 1 !important; }
  [class*="template--cro-"] .mcs-button-arrow::before,
  [class*="template--cro-"] .mcs-button-arrow::after {
    content: "" !important;
    display: block !important;
    box-sizing: border-box !important;
    width: 11px !important; height: 11px !important;
    border: 0 !important;
    border-right: 1.5px solid #0a0a0c !important;
    border-top: 1.5px solid #0a0a0c !important;
    background: none !important;
    transition: border-color .2s ease !important;
  }
  [class*="template--cro-"] .mcs-button-arrow::after { display: none !important; }
  [class*="template--cro-"] .mcs-button-arrow-prev::before { transform: rotate(-135deg) !important; }
  [class*="template--cro-"] .mcs-button-arrow-next::before { transform: rotate(45deg) !important; }
  [class*="template--cro-"] .mcs-button-arrow:hover::before { border-color: #cd9b77 !important; }
}

/* 2026-07-12 · McKenzie: gallery load-flash fix ("flashes the first photo twice, on top and
   on bottom of it"). Root cause: the theme server-renders the media TWICE as plain markup
   (.mySwiper2 main + .mySwiperThumbs copy) and both paint raw until Magic Zoom builds the real
   gallery (.MagicToolboxContainer) and shunts the sources offscreen · during that window photo 1
   shows in multiple stacked copies. Fix: pre-init, only slide 1 of the main source paints (it is
   the placeholder Magic Zoom replaces in the same box); the thumbs copy never paints (the settled
   design uses Magic Zoom bullets/rail, never this swiper); and the moment the Magic Zoom container
   exists the source hides entirely (:has, progressive · older engines just keep the brief overlap).
   Rules are scoped to the SOURCE containers, so nodes Magic Zoom clones out are unaffected. */
[class*="template--cro-"] .mySwiper2:not(.swiper-initialized) .swiper-slide:not(:first-child) { display: none !important; }
[class*="template--cro-"] .mySwiperThumbs { display: none !important; }
body:has(.MagicToolboxContainer) [class*="template--cro-"] .mySwiper2 { visibility: hidden !important; }

/* 2026-07-12 · McKenzie: empty-bag state improved. Brennah killed "Nothing here yet." · the
   sub is now the single line "Your silk is waiting." and the CTA is the Eclipse closer the
   PDP close band already uses. Visually: the state centers in the drawer body (was hugging
   the top over a void) and the outlined button joins the boutique register · smaller tracked
   type, hairline ink border, gold on hover. :has fallback = old top-aligned layout, harmless. */
.cart-drawer__body:has(.cart-drawer__empty) { display: flex; }
.cart-drawer__empty {
  margin: auto; width: 100%;
  display: flex; flex-direction: column; align-items: center; text-align: center;
  gap: 6px; padding: 0 8px 9vh;
}
.cart-drawer__empty .button {
  margin-top: 22px;
  font-size: 12px; letter-spacing: .14em;
  padding-block: 15px;
  border: 1px solid rgba(10,10,12,.3);
  background: transparent;
  transition: border-color .25s ease, color .25s ease;
}
.cart-drawer__empty .button:hover { border-color: #cd9b77; color: #cd9b77; background: transparent; }

/* 2026-07-12 · McKenzie: keep the Klaviyo 10%-off teaser from covering the sticky Add-to-Bag bar
   on mobile. Both sit at bottom:0; the teaser's container (.kl-teaser-{formId}, z 90000) paints
   over the sticky bar (<sticky-atc>, z 40). When the sticky bar is showing (it toggles
   .is-visible on scroll, ~112px tall), lift the teaser above it · it eases back to the bottom
   when the bar hides near the top. Theme CSS only · does NOT touch the Klaviyo form/popup config,
   so it is outside the Klaviyo activation fence. [class*=kl-teaser-] matches the teaser container
   only (the full popup modal is kl-private-reset-css WITHOUT kl-teaser), so the modal is untouched.
   :has() is supported on current mobile Safari/Chrome; older engines simply keep the old behavior. */
@media (max-width: 749px) {
  body:has(sticky-atc.is-visible) [class*="kl-teaser-"] {
    bottom: 124px !important;
    transition: bottom .25s ease !important;
  }
}