/** Shopify CDN: Minification failed

Line 2642:13 Expected ":"

**/
/* START_SECTION:footer (INDEX:17) */
.footer__bottom-bar {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    gap: 1rem;
  }

  @media screen and (min-width: 750px) {
    .footer__bottom-bar {
      width: auto;
      gap: 1.5rem;
    }
  }

  .footer__bottom-bar .footer__copyright {
    align-self: center;
  }

  .footer__social {
    display: flex;
    align-items: center;
    gap: 1rem;
    flex-shrink: 0;
  }

  .footer__social-link {
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--color-foreground);
    transition: opacity 0.2s;
  }

  .footer__social-link:hover {
    opacity: 0.7;
  }

  .footer__social-icon {
    width: 1.0625rem;
    height: 1.0625rem;
    fill: currentColor;
    object-fit: contain;
  }
/* END_SECTION:footer */
/* START_SECTION:header-announcements (INDEX:19) */
/* Figma 300-14618: 8px vertical padding — overrides inline spacing-padding */
  .announcement-bar {
    padding-block: var(--fluid-8-8) !important;
    position: relative;
  }

  /* Figma 300-14618: 12px Figtree Medium, capitalize, line-height 1 */
  .announcement-bar__text {
    font-size: var(--fluid-12-12);
    font-weight: 500;
    text-transform: capitalize;
    line-height: 1;
    margin: 0;
  }

  .announcement-bar__slider {
    display: flex;
    flex-direction: row;
    align-items: center;
    position: relative;

    @media screen and (max-width: 749px) {
      grid-column: 1 / -1;
    }
  }

  .announcement-bar__slides {
    display: grid;
    grid: [stack] auto / [stack] auto;
    width: calc(100% - var(--button-size) * 2);
    max-width: 680px;
    margin-inline: auto;
  }

  p.announcement-bar__text {
    text-align: center;
  }
  .announcement-bar__slides > * {
    grid-area: stack;
  }

  .announcement-bar__slide {
    transition: opacity 0.5s ease-in-out, visibility 0.5s ease-in-out;
    content-visibility: visible;

    &[aria-hidden='true'] {
      opacity: 0;
      visibility: hidden;
    }
  }

  .announcement-bar__slider slideshow-arrows {
    padding: 0;
    mix-blend-mode: normal;
  }

  .announcement-bar__slider slideshow-arrows .slideshow-control {
    color: var(--color-foreground);
  }

  .announcement-bar__slider .slideshow-control {
    display: flex;
    padding: 0;
    width: var(--button-size);
    height: var(--button-size);
    align-items: center;
    justify-content: center;
    opacity: 1;
    animation: none;

    @media screen and (min-width: 750px) {
      --slideshow-control-offset: calc((var(--button-size) - var(--icon-size-xs)) / 2);

      .section--page-width &.slideshow-control--previous {
        transform: translateX(var(--slideshow-control-offset));
      }
    }
  }

  .announcement-bar__slider .slideshow-control .svg-wrapper {
    width: var(--icon-size-xs);
    height: var(--icon-size-xs);
  }

  .announcement-bar__slide {
    place-content: center;
  }

  .announcement-bar__text:first-child {
    margin: 0;
  }

  .announcement-bar__link {
    position: absolute;
    inset: 0;
  }
/* END_SECTION:header-announcements */
/* START_SECTION:product-information (INDEX:40) */
.sticky-add-to-cart__bar {
    position: fixed;
    bottom: 20px;
    left: 50%;
    opacity: 0;
    transform: translateX(-50%) translateY(calc(100% + 40px));
    z-index: calc(var(--layer-sticky) - 1); /* Below sticky header */
    display: block;
    width: 600px;
    border-radius: calc(
      var(--style-border-radius-buttons-primary) + min(var(--padding-sm), var(--style-border-radius-buttons-primary))
    );
    box-shadow: var(--shadow-popover);
    padding: var(--padding-sm);
    /* Layout styling */
    display: flex;
    align-items: center;
    gap: var(--gap-md);

    @starting-style {
      opacity: 0;
      transform: translateX(-50%) translateY(calc(100% + 40px));
    }

    &::before {
      --border: 2px;
      content: '';
      position: absolute;
      inset: calc(var(--border) * -1);
      background: linear-gradient(var(--color-background) 0 100%), linear-gradient(hsl(0 0% 0% / 0.15) 0 100%);
      background-clip: content-box, border-box;
      border: 1px solid #0000;
      border-radius: 0;
      z-index: -1;
      backdrop-filter: blur(20px) saturate(180%) brightness(1.5);
    }
  }

  @media (prefers-reduced-motion: no-preference) {
    .sticky-add-to-cart__bar {
      transition-property: transform, opacity, display;
      transition-duration: 0.3s;
      transition-timing-function: var(--ease-out-quad);
      transition-behavior: allow-discrete;
    }
  }

  .sticky-add-to-cart__bar[data-stuck='true'] {
    transform: translateX(-50%) translateY(0%);
    opacity: 1;
  }

  sticky-add-to-cart:not([data-variant-available='true']) .sticky-add-to-cart__bar {
    opacity: 0;
    transform: translateX(-50%) translateY(calc(100% + 40px));
    display: none;
  }

  .sticky-add-to-cart__info[data-has-image='false'] {
    padding-left: var(--padding-lg);
  }

  .sticky-add-to-cart__image {
    flex-shrink: 0;
    aspect-ratio: 1;
    height: var(--height-buy-buttons);
    overflow: hidden;
    border-radius: var(--style-border-radius-buttons-primary);
    background: var(--color-background-secondary);
  }

  .sticky-add-to-cart__image-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }

  .sticky-add-to-cart__info {
    flex: 1;
    min-width: 0; /* Allow text truncation */
  }

  .sticky-add-to-cart__title {
    font-size: var(--font-paragraph-medium--size);
    font-weight: var(--font-weight-semibold);
    line-height: var(--font-paragraph--line-height);
    margin: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .sticky-add-to-cart__variant {
    color: rgb(var(--color-foreground-rgb) / var(--opacity-subdued-text));
    font-size: var(--font-paragraph-small--size);
    margin-top: var(--margin-3xs);
  }

  .sticky-add-to-cart__price {
    font-weight: var(--font-weight-semibold);
  }

  .sticky-add-to-cart__button {
    height: var(--height-buy-buttons);
    position: relative;
    border-radius: 0;
  }

  .sticky-add-to-cart__bag-icon {
    display: none;
    color: #ffffff; /* Bag icon white on mobile sticky add-to-cart */
  }

  .sticky-add-to-cart__bag-icon svg {
    display: block;
  }

  /* Mobile adjustments */
  @media screen and (max-width: 749px) {
    .sticky-add-to-cart__bar {
      bottom: 0;
      width: 100%;
      max-width: none;
      border-radius: 0;
      z-index: 999999999;

      &::before {
        --border: 1px;
      }
    }

    .sticky-add-to-cart__bar .add-to-cart-text__content {
      display: flex;
    }

    .sticky-add-to-cart__bar .add-to-cart-icon {
      display: none;
    }

    .sticky-add-to-cart__bar .sticky-add-to-cart__bag-icon {
      display: none;
    }

    sticky-add-to-cart:not([data-variant-available='true']) .sticky-add-to-cart__bag-icon {
      display: none;
    }

    .sticky-add-to-cart__info[data-has-image='false'] {
      padding-left: 0;
    }

    .sticky-add-to-cart__title {
      font-size: var(--font-paragraph--size);
    }

    .sticky-add-to-cart__button {
      padding: var(--padding-lg);
      flex: 1;
    }

    .sticky-add-to-cart__price {
      font-size: var(--font-paragraph-small--size);
    }

    .sticky-add-to-cart__button {
      width: var(--height-buy-buttons);
    }

    sticky-add-to-cart:not([data-variant-available='true']) .add-to-cart-text__content {
      display: initial;
    }

    sticky-add-to-cart:not([data-variant-available='true']) .sticky-add-to-cart__button {
      width: auto;
    }
  }

  /* Small mobile - hide text content and compare price */
  @media screen and (max-width: 389px) {
    .sticky-add-to-cart__title {
      display: none;
    }

    /* For product with only default variant show title */
    .sticky-add-to-cart__info[data-singleton='true'] .sticky-add-to-cart__title {
      display: block;
    }

    /* For single variant show title and variant, truncate both. variant should be identifiable with truncation */
    .sticky-add-to-cart__info[data-single-option='true'] .sticky-add-to-cart__title {
      display: block;
    }

    .sticky-add-to-cart__info[data-single-option='true'] .sticky-add-to-cart__variant {
      display: block;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
    }
  }

  @media(min-width: 900px) {
    .product-information {
      --padding-inline: var(--fluid-24-24);
      --padding-inline-start: var(--fluid-24-24);
      --padding-inline-end: var(--fluid-24-24);
    }
  }

  /* ── PDP Details — Figma overrides (fluid-scaled) ────────── */

  /* Spacing between variant option groups */
  .product-information .variant-option + .variant-option {
    margin-top: var(--fluid-16-16);
  }

  /* Size buttons: plain text with underline instead of bordered pills (Figma 12px) */
  .product-information .variant-option--buttons:not(.variant-option--swatches) .variant-option__button-label {
    border: none;
    border-radius: 0;
    background: none;
    min-height: auto;
    flex: 0 0 auto;
    padding: var(--fluid-2-2);
    min-width: var(--fluid-16-16);
    justify-content: center;
    font-family: var(--font-body--family);
    font-weight: 400;
    line-height: 1.2;
    /* Muted text for unselected — Figma #646464 */
    color: #646464;
  }

  .product-information .variant-option--buttons:not(.variant-option--swatches) .variant-option__button-label::before,
  .product-information .variant-option--buttons:not(.variant-option--swatches) .variant-option__button-label::after {
    display: none;
  }

  /* Hide the animated pill background */
  .product-information .variant-option--buttons:not(.variant-option--swatches) .variant-option__button-label__pill {
    display: none;
  }

  /* Selected size: Graphite #1f1f1f with underline */
  .product-information .variant-option--buttons:not(.variant-option--swatches) .variant-option__button-label:has(:checked) {
    color: #1f1f1f;
    text-decoration: underline;
    background: none;
    text-underline-offset: 3px;
    text-decoration-thickness: 1px;
  }

  /* Hover */
  .product-information .variant-option--buttons:not(.variant-option--swatches) .variant-option__button-label:hover {
    color: #1f1f1f;
    background: none;
    border: none;
  }

  /* Override equal-width-buttons grid — use flex with gap instead */
  .product-information .variant-option--equal-width-buttons:not(.variant-option--swatches) {
    display: flex;
    flex-wrap: wrap;
    gap: var(--fluid-16-16);
    align-items: center;
  }

  .product-information .variant-option--equal-width-buttons:not(.variant-option--swatches) .variant-option__button-label {
    min-width: var(--fluid-16-16);
  }

  .product-information .variant-option--equal-width-buttons:not(.variant-option--swatches) .variant-option__button-label__text {
    text-align: center;
  }

  /* Option label: Figtree Medium 12px uppercase #1f1f1f */
  .product-information .variant-option legend {
    font-family: var(--font-body--family);
    font-weight: 500;
    font-size: var(--fluid-12-12);
    line-height: 1;
    color: #1f1f1f;
    text-transform: uppercase;
  }

  /* ── PDP swatches — square shape + underline-shadow selected indicator.
     Size is controlled by the variant-picker block setting (`swatch_width` /
     `swatch_height`, mobile counterparts in product.json). variant-main-picker
     emits inline `<style>` with !important using those settings, so we leave
     width/height alone here and only neutralize the theme's radius/border. */

  .product-information .variant-option--swatches {
    --variant-picker-swatch-radius: 0;
    --focus-outline-radius: 0;
    --style-border-swatch-width: 0;
    --style-border-swatch-style: none;
    --focus-outline-width: 0;
    --focus-outline-offset: 0;
  }

  .product-information .variant-option--swatches .swatch {
    border-radius: 0;
    border: none;
    background-size: contain;
  }

  /* Force square on the label wrapper */
  .product-information .variant-picker .variant-option--buttons label:has(.swatch) {
    border-radius: 0;
    padding: 0;
    min-height: auto;
    outline: none;
  }

  /* Selected: underline shadow instead of outline (per Figma) — applies to
     color/metal swatches by default. Tune the two numbers to change the gap:
     1st = white spacer (gap below the swatch), 2nd = white spacer + 1px line. */
  .product-information .variant-picker .variant-option--buttons label:has(.swatch):has(:checked) {
    outline: none;
    box-shadow: 0px 6px 0px 0px #fafafa, 0px 7px 0px 0px #000;
  }

  /* Override for STONE (image) swatches only — tighter gap so the underline
     sits closer to the swatch. Detected by the absence of the inline
     --swatch-background var (which color swatches carry). Adjust the two
     numbers below to fine-tune the spacing for stone variants. */
 
  .product-information .variant-picker .variant-option--buttons[data-fieldset-index='0'] label:has(.swatch):has(:checked) {
    outline: none;
    box-shadow: 0px 6px 0px 0px #fafafa, 0px 7px 0px 0px #000;
  }

  /* Hover: no outline */
  .product-information .variant-picker .variant-option--buttons label:has(.swatch):hover {
    outline: none;
  }

  /* Hide animated pill and pseudo-borders */
  .product-information .variant-option--swatches .variant-option__button-label__pill {
    display: none;
  }

  .product-information .variant-option--swatches .variant-option__button-label::before,
  .product-information .variant-option--swatches .variant-option__button-label::after {
    display: none;
  }

  /* Swatch gap (Figma: 8px between swatches) */
  .product-information .variant-option--swatches overflow-list::part(list) {
    gap: var(--fluid-8-8);
  }

  /* ──────────────────────────────────────────────────────────────────────
     PDP Figma Option 3 — Header section
     Title row: title (Cormorant Italic 32px #310008) + stars badge inline
     Subtitle "Statement Ring": Figtree Regular 12px #310008
     Price row: compare (strikethrough 9px #1f1f1f) + sale (Figtree Medium 12px #8f1e2d)
     ────────────────────────────────────────────────────────────────────── */

  /* Title link wrapper override: ensure Cormorant Italic + brand color */
  .product-information .product-title-row {
    align-items: center;
    gap: 10px;
  }

  .product-information .product-title-row > a .text-block,
  .product-information .product-title-row > a h1,
  .product-information .product-title-row > a h2,
  .product-information .product-title-row > a h3,
  .product-information .product-title-row > a h4,
  .product-information .product-title-row > a h5,
  .product-information .product-title-row > a h6,
  .product-information .product-title-row > a p {
    font-family: var(--font-heading--family);
    font-style: italic;
    font-weight: 500;
    font-size: var(--fluid-32-32);
    line-height: 1;
    /* Burgundy Black per Figma */
    color: #310008;
    margin: 0;
  }

  @media(min-width: 750px) {
    .product-information .product-title-row > a .text-block {
      max-width: calc( 100% - 134px)
    }
  }

  /* Vendor (Statement Ring) — Figtree Regular 12px #310008 */
  .product-information .product-details .vendor,
  .product-information .product-details [data-block-type='vendor'] {
    font-family: var(--font-body--family);
    font-weight: 400;
    font-size: var(--fluid-12-12);
    line-height: 1.2;
    /* Burgundy Black per Figma */
    color: #310008;
    text-transform: none;
  }

  /* Price: Figtree Medium 12px Cherry Editorial #8f1e2d; compare strike 9px #1f1f1f */
  .product-information .product-details .price {
    gap: var(--fluid-8-8);
    align-items: baseline;
    text-transform: uppercase;
  }

  .product-information .product-details .price__regular .price-item--regular,
  .product-information .product-details .price__sale .price-item--sale {
    font-family: var(--font-body--family);
    font-weight: 500;
    font-size: var(--fluid-16-16);
    line-height: 1;
    /* Cherry Editorial per Figma */
    color: #8f1e2d;
  }

  .product-information .product-details .price__regular .price-item--regular {
    color: #000000;
    opacity: 1;
  }

  .product-information .product-details .price__sale .price-item--regular,
  .product-information .product-details .price-item--last,
  .product-information .product-details s.price-item,
  .product-information .product-details .price--on-sale .price-item--regular {
    font-family: var(--font-body--family);
    font-weight: 400;
    font-size: var(--fluid-9-9);
    line-height: 1.3;
    /* Graphite per Figma */
    color: #1f1f1f;
    text-decoration: line-through;
  }

  /* Stars badge (Stamped) — right side of title row, Figma 12px height */
  .product-information .product-title-row .stamped-main-badge,
  .product-information .product-title-row .stamped-product-reviews-badge {
    align-self: center;
    font-size: var(--fluid-12-12);
    color: #310008;
  }

  /* ──────────────────────────────────────────────────────────────────────
     Selector blocks (metal, stone, sizes) — Figma node 2707:20295
     Container gap 16px between selectors (already in CSS above)
     Each selector: label-row + values, gap 6px
     ────────────────────────────────────────────────────────────────────── */

  /* Each fieldset: flex-wrap so labels lay out as a horizontal wrap row.
     Legend forced to its own line via flex-basis: 100%. */
  .product-information .variant-option {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--fluid-8-8);
  }

  /* Legend takes its own full-width row above values.
     column-gap: 0 — the colon separator (added via ::before on the value span)
     handles the gap between option name and selected value. Auxiliary controls
     (size-guide, choose-your-stone hint) push to the right via margin-left: auto. */
  .product-information .variant-option legend {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    flex-basis: 100%;
    width: 100%;
    column-gap: 0;
    row-gap: 4px;
    margin-bottom: var(--fluid-6-6);
    /* Subpixel safety so the right-aligned hint doesn't get clipped */
    padding-right: 4px;
    box-sizing: border-box;
  }

  /* Size labels (equal-width-buttons) — horizontal wrap with 16px gap (Figma) */
  .product-information .variant-option--equal-width-buttons:not(.variant-option--swatches) {
    gap: var(--fluid-16-16);
  }

  /* Selected swatch value (e.g., "Emerald") inline next to option name.
     Prefix with ": " so "Color Gold" reads as "COLOR: GOLD" matching Figma. */
  .product-information .variant-option--swatches legend .variant-option__swatch-value {
    text-transform: uppercase;
    font-weight: 500;
    color: #1f1f1f;
  }

  .product-information .variant-option--swatches legend .variant-option__swatch-value::before {
    content: ': ';
    /* Inherit uppercase + same family from legend */
  }

  /* Size guide trigger button (already supported by variant-main-picker) — Figma styling.
     margin-left: auto pushes it to the right edge of the legend. */
  .product-information .sf-size-guide__trigger {
    font-family: var(--font-body--family);
    font-weight: 500;
    font-size: var(--fluid-12-12);
    line-height: 1;
    text-transform: uppercase;
    color: #1f1f1f;
    text-decoration: underline;
    text-underline-offset: 2px;
    background: none;
    border: none;
    padding: 0;
    cursor: pointer;
    white-space: nowrap;
    margin-left: auto;
  }

  /* ──────────────────────────────────────────────────────────────────────
     STATIC HTML/CSS (Figma Option 3) — pending integration with real data
     "Choose your stone" hint next to STONE fieldset legend.
     Injected via CSS pseudo because the legend HTML is shared across variants.
     Only show on swatches options whose values are IMAGE-based (gem/stone/etc):
     color swatches expose `--swatch-background: rgb(...)`, image swatches set
     `background-image` URL on the inner span.
     ────────────────────────────────────────────────────────────────────── */
  /* Universal info-circle icon (Figma filled, Burgundy Deep #4A0E18 — node 2707:23366).
     Appears at the right of every swatches-option legend (metal, stone, etc.). */
  .product-information .variant-option--swatches legend::after {
    display: inline-block;
    flex-shrink: 0;
    width: 14px;
    height: 14px;
    margin-left: auto;
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 15 15' fill='none'><path d='M8.15625 10.5469C8.15625 10.6588 8.11181 10.7661 8.03269 10.8452C7.95357 10.9243 7.84627 10.9687 7.73438 10.9687C7.47331 10.9687 7.22293 10.865 7.03832 10.6804C6.85371 10.4958 6.75 10.2454 6.75 9.98437V7.17187C6.75 7.13458 6.73519 7.09881 6.70882 7.07244C6.68244 7.04607 6.64667 7.03125 6.60938 7.03125C6.49749 7.03125 6.39018 6.9868 6.31107 6.90768C6.23195 6.82857 6.1875 6.72126 6.1875 6.60937C6.1875 6.49749 6.23195 6.39018 6.31107 6.31106C6.39018 6.23195 6.49749 6.1875 6.60938 6.1875C6.87045 6.1875 7.12083 6.29121 7.30544 6.47582C7.49004 6.66042 7.59375 6.9108 7.59375 7.17187V9.98437C7.59375 10.0217 7.60857 10.0574 7.63494 10.0838C7.66131 10.1102 7.69708 10.125 7.73438 10.125C7.84627 10.125 7.95357 10.1694 8.03269 10.2486C8.11181 10.3277 8.15625 10.435 8.15625 10.5469ZM6.89063 4.78125C7.02969 4.78125 7.16564 4.74001 7.28126 4.66275C7.39689 4.58549 7.48701 4.47568 7.54023 4.3472C7.59345 4.21872 7.60737 4.07734 7.58024 3.94095C7.55311 3.80456 7.48615 3.67927 7.38781 3.58094C7.28948 3.48261 7.16419 3.41564 7.0278 3.38851C6.89141 3.36138 6.75003 3.3753 6.62155 3.42852C6.49307 3.48174 6.38326 3.57186 6.306 3.68749C6.22874 3.80312 6.1875 3.93906 6.1875 4.07812C6.1875 4.26461 6.26158 4.44345 6.39344 4.57531C6.52531 4.70717 6.70415 4.78125 6.89063 4.78125ZM14.3438 7.17187C14.3438 8.59034 13.9231 9.97695 13.1351 11.1564C12.347 12.3358 11.2269 13.255 9.91644 13.7978C8.60595 14.3406 7.16392 14.4827 5.77271 14.2059C4.38151 13.9292 3.1036 13.2462 2.1006 12.2432C1.09759 11.2402 0.414537 9.96224 0.137809 8.57104C-0.13892 7.17983 0.00310737 5.73781 0.54593 4.42732C1.08875 3.11683 2.00799 1.99673 3.1874 1.20868C4.36681 0.420623 5.75342 0 7.17188 0C9.07329 0.00223302 10.8962 0.758556 12.2407 2.10306C13.5852 3.44756 14.3415 5.27046 14.3438 7.17187ZM13.5 7.17187C13.5 5.92029 13.1289 4.69681 12.4335 3.65616C11.7382 2.6155 10.7499 1.80441 9.59355 1.32545C8.43723 0.846489 7.16486 0.721171 5.93732 0.965343C4.70979 1.20952 3.58222 1.81221 2.69722 2.69721C1.81221 3.58222 1.20952 4.70978 0.965346 5.93732C0.721174 7.16486 0.846492 8.43723 1.32545 9.59354C1.80441 10.7499 2.61551 11.7382 3.65616 12.4335C4.69682 13.1289 5.92029 13.5 7.17188 13.5C8.84963 13.4981 10.4581 12.8308 11.6445 11.6445C12.8308 10.4581 13.4981 8.84963 13.5 7.17187Z' fill='%234A0E18'/></svg>");
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    /* Reset typography (only matters for the image-swatch variant below) */
    font-family: var(--font-body--family);
    font-weight: 400;
    font-style: normal;
    font-size: var(--fluid-11-11);
    line-height: 1.2;
    color: #4a0e18 !important;
    text-transform: none;
    white-space: nowrap;
    padding-right: 2px;
    width: auto;
    height: auto;
    background-position: right center;
    background-size: 14px 14px;
    padding-right: 18px;
  }

  variant-picker__form

  /* Image swatches (gem/stone/etc.) — add the "Choose your stone" text BEFORE
     the icon. Achieved by widening the ::after, prefixing the text, and
     pushing the icon to the right edge via background-position + padding. */
  .product-information
    .variant-option--swatches:not(:has(.swatch[style*='--swatch-background']))
    legend::after {
    content: 'Choose your stone';
    width: auto;
    height: auto;
    background-position: right center;
    background-size: 14px 14px;
    padding-right: 18px;
  }

  /* Estimated delivery / express shipping notice: third (Figma order #4).
     The product-estimated-delivery block is wrapped in `<div class="shopify-block">`
     by content_for, so we order the wrapper, not the inner elements. */

  .product-information .product-form-buttons {
    display: flex;
    flex-direction: column;
    gap: var(--fluid-8-8);
  }

  /* ADD TO BAG button — Burgundy Deep #4A0E18, Figtree Medium 16px white uppercase */
  .product-information .add-to-cart-button,
  .product-information .product-form-buttons button[type='submit'] {
    /* Burgundy Deep per Figma */
    background-color: #4a0e18;
    color: #ffffff;
    padding: var(--fluid-16-16) var(--fluid-32-32);
    font-family: var(--font-body--family);
    font-weight: 500;
    font-size: var(--fluid-16-16);
    line-height: 1.2;
    text-transform: uppercase;
    border: none;
    border-radius: 0;
    width: 100%;
    justify-content: center;
  }

  .product-information .add-to-cart-button:hover,
  .product-information .product-form-buttons button[type='submit']:hover {
    /* Burgundy Black hover */
    background-color: #310008;
    color: #ffffff;
  }

  /* ──────────────────────────────────────────────────────────────────────
     "PLEASE SELECT SIZE" error message — Figma 2707:20357
     STATIC: kept visible by default so dev can verify Figma styling.
     Will be hidden by default and wired to JS validation later.
     ────────────────────────────────────────────────────────────────────── */
  .product-information .product-form-text__error {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: var(--fluid-8-8);
    /* Push below ADD TO BAG: parent is flex-column, default order keeps it after add-to-cart wrapper */
    order: 99;
    font-family: var(--font-body--family);
    font-weight: 600;
    font-size: var(--fluid-12-12);
    line-height: 1;
    text-transform: uppercase;
    /* Warning amber per Figma (#D57C2E) */
    color: #d57c2e;
    margin: 0;
    padding: 0;
  }

  /* Override theme's .hidden so the static error is always visible (preview).
     Remove this rule once JS wiring lands. */
  .product-information .product-form-text__error.hidden {
    margin-top: 11px
  }

  /* If JS hasn't set text yet, show the static label */
  .product-information .product-form-text__error:not(:has(span:not(.svg-wrapper)))::after {
    content: 'Please select size';
    text-transform: uppercase;
  }

  .product-information .product-form-text__error .svg-wrapper {
    width: var(--fluid-18-18);
    height: var(--fluid-18-18);
    flex-shrink: 0;
    color: #d57c2e;
  }

  .product-information .product-form-text__error .svg-wrapper svg {
    width: 100%;
    height: 100%;
  }

  /* ──────────────────────────────────────────────────────────────────────
     Estimated delivery / Express shipping — Figma 2707:20361
     Static format: "Get it on <date> with Express Shipping, order within <time>"
     ────────────────────────────────────────────────────────────────────── */
  .product-information .product-estimated-delivery {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: var(--fluid-8-8);
    padding: var(--fluid-4-4) 0;
  }

  .product-information .product-estimated-delivery__text {
    font-family: var(--font-body--family);
    font-weight: 400;
    font-size: var(--fluid-14-14);
    line-height: 1.3;
    color: var(--Success, #007A2B);
    margin: 0;
  }

  .product-information .product-estimated-delivery__text .icon {
    width: var(--fluid-18-18);
    height: var(--fluid-18-18);
    margin-right: var(--fluid-4-4);
    vertical-align: middle;
  }

  .product-information .product-estimated-delivery__text .icon svg {
    width: 100%;
    height: 100%;
  }

  /* Green highlights per Figma: date, shipping method, countdown */
  .product-information .product-estimated-delivery__highlight {
    /* Express green per Figma */
    color: #007a2b;
    font-weight: 500;
  }

  /* ──────────────────────────────────────────────────────────────────────
     Free shipping text — Figma 2707:20365
     Figtree Regular 12px rgba(31,31,31,0.6); links #820318 underline
     ────────────────────────────────────────────────────────────────────── */
  .product-information .product-details .text-block:has(h5) {
    text-align: center;
  }

  .product-information .product-details .text-block h5 {
    font-family: var(--font-body--family);
    font-weight: 400;
    font-style: normal;
    font-size: var(--fluid-12-12);
    line-height: 1.2;
    color: rgba(31, 31, 31, 0.6);
    margin: 0;
    text-transform: uppercase;
    letter-spacing: normal;
  }

  .product-information .product-details .text-block:has(h6) h6 {
    color: #000;
    font-family: Cormorant;
    font-size: 20px;
    font-style: italic;
    font-weight: 500;
    line-height: 120%;
    max-width: 502px
  }


  .product-information .product-details .text-block a {
    color: rgb(49, 0, 8);
    text-decoration: underline;
    text-decoration-color: #820318;
    text-underline-offset: 2px;
  }

  /* ──────────────────────────────────────────────────────────────────────
     Italic product description — Figma 2707:20369
     Cormorant Medium Italic 20px black
     The dedicated text block (text_aEtTtq) must be enabled in product.json.
     This styling targets the matching h5 inside the details column.
     ────────────────────────────────────────────────────────────────────── */
  .product-information .product-details .text-block.rte h5,
  .product-information .product-details .group-block .text-block.rte h5 {
    /* RULE EXCEPTION: theme variable not used because Figma specifies Cormorant for this block */
    font-family: var(--font-body--family);
    font-weight: 400;
    font-size: var(--fluid-12-12);
    line-height: 1.2;
    color: rgba(31, 31, 31, 0.60);
    max-width: 100%;
    font-style: normal
  }

  /* ──────────────────────────────────────────────────────────────────────
     Accordions — Figma 2707:20371..20400
     Top + bottom border Silver Mist #D4D4D4, padding 16px 0
     Label: Figtree Medium 12px #1f1f1f uppercase
     Caret/Plus icon 16×16
     Content: Figtree Regular 14px rgba(31,31,31,0.6) line-height 1.3
     ────────────────────────────────────────────────────────────────────── */
  .product-information .product-details accordion-custom {
    width: 100%;
  }

  .product-information .product-details accordion-custom details {
    /* Silver Mist border per Figma */
    border-top: 1px solid #d4d4d4;
  }

  .product-information .product-details accordion-custom details:last-child {
    border-bottom: 1px solid #d4d4d4;
  }

  .product-information .product-details accordion-custom summary {
    padding: var(--fluid-16-16) 0;
    font-family: var(--font-body--family);
    font-weight: 500;
    font-size: var(--fluid-12-12);
    line-height: 1;
    color: #1f1f1f;
    text-transform: uppercase;
  }

  .product-information .product-details accordion-custom .details-content {
    padding: 0 0 var(--fluid-16-16);
  }

  .product-information__grid accordion-custom details[open] .details-content {
    color: rgba(31, 31, 31, 0.60);
    font-family: 'Figtree';
    font-size: var(--fluid-14-14);
    font-style: normal;
    font-weight: 400;
    line-height: 130%;
  }

  .custom-color, .custom-color > :is(h1, h2, h3, h4, h5, h6, p, *) {
    color: #000
  }

  .custom-font-size, .custom-font-size>* {
    font-size: var(--font-size)
  }

  /* ──────────────────────────────────────────────────────────────────────
     "Styled with" recommendations heading — Figma 2707:20405
     Cormorant Medium Italic 32px #1f1f1f
     ────────────────────────────────────────────────────────────────────── */
  .product-information .product-recommendations .text-block h2,
  .product-information .product-recommendations h2 {
    font-family: var(--font-heading--family);
    font-style: italic;
    font-weight: 500;
    font-size: var(--fluid-32-32);
    line-height: 1;
    color: #1f1f1f;
    margin: 0;
  }

  /* ──────────────────────────────────────────────────────────────────────
     Mobile (< 750px) adjustments — Figma node 2707:20420
     Token differences from desktop:
       • title line-height 0.9 (vs 1)
       • swatches 32px (vs 42px) with 2px selected-shadow (vs 6px)
       • banner padding-block 8 + font Italic 14 (vs Medium Italic 16)
       • ADD TO BAG padding 12 + font 14 (vs 16/32 + 16)
       • shipping notice font 12 line-height 1.2 (vs 14/1.3)
       • compare price 12px (vs 9px — same size as sale on mobile)
       • styled-with heading 24px (vs 32px)
     ────────────────────────────────────────────────────────────────────── */
  @media screen and (max-width: 749px) {
    /* Title — Cormorant Italic 32px, tighter line-height 0.9 */
    .product-information .product-title-row > a .text-block,
    .product-information .product-title-row > a p,
    .product-information .product-title-row > a h1,
    .product-information .product-title-row > a h2,
    .product-information .product-title-row > a h3,
    .product-information .product-title-row > a h4 {
      line-height: 0.9;
    }

    /* Compare price: same size as sale on mobile (Figma: both 12px) */
    .product-information .product-details .price__sale .price-item--regular,
    .product-information .product-details .price-item--last,
    .product-information .product-details s.price-item,
    .product-information .product-details .price--on-sale .price-item--regular {
      font-size: var(--fluid-12-12);
    }

    /* Price row gap (Figma mobile: 6px) */
    .product-information .product-details .price {
      gap: var(--fluid-6-6);
    }

    /* Selected swatch shadow — smaller on mobile (Figma: 2px / 2.5px) */
    .product-information .variant-picker .variant-option--buttons label:has(.swatch):has(:checked),
    .product-information .variant-option--static-stone .sf-static-stone-swatch.is-selected {
      box-shadow: 0px 2px 0px 0px #fafafa, 0px 2.5px 0px 0px #000;
    }

    /* Banner — Figma: Cream Linen bg, padding 8/32, Italic (regular weight) 14px */
  

    /* ADD TO BAG — Figma: padding 12px uniform, font 14px */
    .product-information .add-to-cart-button,
    .product-information .product-form-buttons button[type='submit'] {
      padding: var(--fluid-12-12);
      font-size: var(--fluid-14-14);
    }

    /* Express shipping notice — Figma: 12px line-height 1.2 (vs 14px/1.3 desktop) */
    .product-information .product-estimated-delivery__text {
      font-size: var(--fluid-12-12);
      line-height: 1.2;
    }

    /* "Styled with" heading — Figma mobile: Cormorant Medium Italic 24px */
    .product-information .product-recommendations .text-block h2,
    .product-information .product-recommendations h2 {
      font-size: var(--fluid-24-24);
    }

    /* Static stone swatch: 32×32 on mobile (matches the variant-option swatches) */
    body .product-information .variant-option--static-stone .swatch {
      width: var(--fluid-32-32) !important;
      height: var(--fluid-32-32) !important;
      min-width: var(--fluid-32-32);
      min-height: var(--fluid-32-32);
    }

    /* "Choose your stone" hint — same 11px on mobile, but check overflow */
    .product-information
      .variant-option--swatches:not(:has(.swatch[style*='--swatch-background']))
      legend::after {
      font-size: 11px;
    }
  }

  /* ── Stamped reviews badge alignment helper (uses theme component) ─── */
  .stamped-main-badge,
  .stamped-product-reviews-badge {
    line-height: 1;
  }

  /* ── TECH NOTE for gem/stone image swatches (Figma 2707:20307) ────────
     The variant-main-picker auto-detects swatches on ANY option name
     (snippets/variant-main-picker.liquid:84-98), so this works out of the
     box when the Shopify Admin option type is set to "Color" / "Image" and
     a swatch image is uploaded per value.
     No metaobject layer required for the basic case.
     ──────────────────────────────────────────────────────────────────── */

  /* ──────────────────────────────────────────────────────────────────────
     STATIC stone selector — Figma 2707:20307
     Injected into the captured product_details right before the variant-picker
     JSON script. Flex order positions it between Color (order 0) and Size
     (order 2). Remove when the real Stone option is configured in Shopify.
     ────────────────────────────────────────────────────────────────────── */
  .product-information .variant-picker__form {
    display: flex;
    flex-direction: column;
    gap: var(--fluid-16-16);
  }

  .variant-option.variant-option--buttons.variant-option--swatches.variants-combined-listings {
    order: 1
  }

  .product-information .variant-picker__form > [data-fieldset-index='0'] {
    order: 0;
    margin-top: 8px;
  }

  .product-information .variant-picker__form > .variant-option--static-stone {
    order: 2;
  }

  .product-information .variant-picker__form > [data-fieldset-index='2'] {
    order: 4;
    margin-top: 8px;
  }

  .product-information .variant-picker__form > [data-fieldset-index='1'] {
    order: 3;
    margin-top: 8px;
  }

  /* The JSON script is also a flex child — hide it from layout (it's
     intentionally inert, used only by the JS variant picker). */
  .product-information .variant-picker__form > script {
    display: none;
  }

  /* Static stone swatch: 42×42, gradient-filled. Match the existing
     variant-option--swatches sizing. Body-prefix + !important needed because
     variant-main-picker emits inline !important for the real swatches. */
  body .product-information .variant-option--static-stone .swatch {
    display: block;
    width: var(--fluid-42-42) !important;
    height: var(--fluid-42-42) !important;
    min-width: var(--fluid-42-42);
    min-height: var(--fluid-42-42);
    border-radius: 0;
    border: none;
    background-size: cover !important;
  }

  /* Underline-shadow indicator for the SELECTED static stone */
  .product-information .variant-option--static-stone .sf-static-stone-swatch.is-selected {
    box-shadow: 0px 6px 0px 0px #fafafa, 0px 7px 0px 0px #000;
  }

  /* Cursor hint that these aren't yet wired up */
  .product-information .variant-option--static-stone .sf-static-stone-swatch {
    cursor: default;
  }

  /* visually-hidden helper for accessibility labels */
  .product-information .variant-option--static-stone .visually-hidden {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
  }
/* END_SECTION:product-information */
/* START_SECTION:sf-header (INDEX:56) */
/* ========================================
   SF Header — Sterling Forever
   ======================================== */

/* --- Section wrapper (sticky is applied via JS) --- */
.sf-header-section {
  position: relative;
  z-index: 10;
}

.sf-header-section--sticky {
  position: sticky;
  top: 0;
  z-index: 10;
}

/* --- Header wrapper --- */
sf-header {
  display: block;
  position: relative;
}

/* Animate in/out for scroll-up mode */
sf-header[data-sticky="on-scroll-up"] {
  transition: transform 0.3s ease, opacity 0.3s ease;
}

sf-header[data-sticky="on-scroll-up"][data-sticky-state="idle"] {
  transform: translateY(-100%);
  opacity: 0;
  pointer-events: none;
}

sf-header[data-sticky="on-scroll-up"][data-sticky-state="active"] {
  transform: translateY(0);
  opacity: 1;
}

/* --- Header bar --- */
.sf-header {
  position: relative;
  width: 100%;
  background-color: var(--color-background);
  z-index: 99;
}

.sf-header__bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--fluid-20-20);
  padding: var(--sf-header-padding-top) var(--fluid-24-24) var(--sf-header-padding-bottom);
  max-width: var(--narrow-page-width);
  margin-inline: auto;
}

.sf-header__bar--full-width {
  max-width: none;
}

/* No border between header bar and mega menu dropdown */

/* --- Bar left group (hamburger + logo) --- */
.sf-header__bar-left {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-shrink: 0;
}

/* --- Mobile hamburger button --- */
.sf-header__hamburger {
  color: var(--color-foreground);
  padding: 0;
  line-height: 0;
}

/* --- Logo --- */
.sf-header__logo-wrapper {
  display: flex;
  align-items: center;
  flex-shrink: 0;
}

.sf-header__logo-link {
  display: inline-flex;
  text-decoration: none;
}

.sf-header__logo {
  display: block;
  height: var(--sf-header-logo-height);
  width: auto;
}

.sf-header__logo--inverse {
  display: none;
}

.sf-header__logo-text {
  font-family: var(--font-heading--family);
  font-style: var(--font-heading--style);
  font-weight: var(--font-heading--weight);
  font-size: var(--font-size--2xl);
  color: var(--color-foreground);
  text-decoration: none;
  white-space: nowrap;
}

/* --- Desktop navigation --- */
.sf-header__nav {
  display: flex;
  justify-content: flex-start;
}

.sf-header__menu {
  display: flex;
  align-items: center;
  gap: var(--fluid-18-18);
  list-style: none;
  margin: 0;
  padding: 0;
}

.sf-header__menu-link {
  font-family: var(--font-body--family);
  font-weight: var(--font-body--weight);
  font-size: var(--fluid-12-12);
  letter-spacing: 0.05em;
  text-transform: uppercase;
  text-decoration: none;
  color: var(--color-foreground);
  white-space: nowrap;
  padding: var(--padding-xs) 0;
  transition: opacity 0.2s ease;
}

.sf-header__menu-link:hover {
  text-decoration: underline;
  text-underline-offset: 4px;
}

.sf-header__menu-link[aria-expanded="true"] {
  text-decoration: underline;
  text-underline-offset: 4px;
}

/* --- Actions (right side) --- */
.sf-header__actions {
  display: flex;
  align-items: center;
  flex-shrink: 0;
}

.sf-header__actions--desktop,
.sf-header__actions--mobile {
  display: flex;
  align-items: center;
  gap: var(--fluid-18-18);
}

.sf-header__actions-text,
.sf-header__actions-icons {
  display: flex;
  align-items: center;
  gap: var(--fluid-18-18);
  line-height: normal;
}

.sf-header__action {
  font-family: var(--font-body--family);
  font-weight: var(--font-body--weight);
  font-size: var(--fluid-12-12);
  letter-spacing: 0.05em;
  text-transform: uppercase;
  text-decoration: none;
  color: var(--color-foreground);
  background: none;
  border: none;
  cursor: pointer;
  padding: 0;
  display: inline-flex;
  align-items: center;
  gap: 2px;
  white-space: nowrap;
  transition: opacity 0.2s ease;
}

.sf-header__action:hover {
  opacity: 0.7;
}

/* Desktop actions: match sf-header__menu-link hover (underline, no lift) */
.sf-header__actions--desktop .sf-header__action.sf-hover:hover {
  transform: none;
  filter: none;
}

/* Search icon SVG: inherit color from the surrounding text so it follows the
   header's transparent → scrolled state (white over hero, dark when scrolled). */
.sf-header__action .icon-search svg path {
  fill: currentColor;
}

.sf-header__actions--desktop .sf-header__action--text:hover {
  text-decoration: underline;
  text-underline-offset: 4px;
  opacity: 1;
}

.sf-header__action--text[data-search-active="true"] {
  text-decoration: underline;
  text-underline-offset: 4px;
}

/* --- Account (uses native <shopify-account>) --- */
.sf-header__account shopify-account {
  /* Theme tokens passed to the Shopify Account component */
  --shopify-account-font-body: var(--font-body--family);
  --shopify-account-font-heading: var(--font-heading--family);
  --shopify-account-color-background: var(--color-background);
  --shopify-account-color-text: var(--color-foreground);
  --shopify-account-color-accent: var(--color-primary);
  --shopify-account-radius-base: 0;
}

/* Signed-out slot: render as inline text matching other header actions */
.sf-header__account-text {
  cursor: pointer;
}

.sf-header__actions cart-icon {
  display: contents;
}

.sf-header__action--icon {
  position: relative;
}

.sf-header__action--icon svg {
  width: var(--fluid-16-16);
  height: var(--fluid-16-16);
  fill: currentColor;
}

.sf-header__badge {
  font-family: var(--font-body--family);
  font-size: 9px;
  font-weight: 400;
  line-height: 1.3;
  color: var(--color-foreground);
  align-self: flex-start;
}

/* --- Transparent header --- */

/* Transparent state: clear bg, white text */
sf-header[data-transparent="true"][data-scrolled="false"][data-mega-open="false"] .sf-header {
  background-color: transparent;
  color: #FFFFFF;
  position: relative;
  z-index: 2;
}

sf-header[data-transparent="true"][data-scrolled="false"][data-mega-open="false"] .sf-header__menu-link,
sf-header[data-transparent="true"][data-scrolled="false"][data-mega-open="false"] .sf-header__action,
sf-header[data-transparent="true"][data-scrolled="false"][data-mega-open="false"] .sf-header__badge,
sf-header[data-transparent="true"][data-scrolled="false"][data-mega-open="false"] .sf-header__logo-text,
sf-header[data-transparent="true"][data-scrolled="false"][data-mega-open="false"] .sf-header__hamburger {
  color: #FFFFFF;
}

sf-header[data-transparent="true"][data-scrolled="false"][data-mega-open="false"] .sf-header__action--icon svg {
  fill: #FFFFFF;
}

sf-header[data-transparent="true"][data-scrolled="false"][data-mega-open="false"] .sf-header__logo {
  display: none;
}

sf-header[data-transparent="true"][data-scrolled="false"][data-mega-open="false"] .sf-header__logo--inverse {
  display: block;
}

/* Gradient overlay: top-of-bar fade for transparent header over hero images */
sf-header[data-gradient="true"][data-transparent="true"][data-scrolled="false"][data-mega-open="false"] .sf-header__bar--full-width {
  background: linear-gradient(180deg, rgba(0, 0, 0, 0.80) 0%, rgba(0, 0, 0, 0.00) 100%);
}

/* --- Mega menu wrapper --- */
sf-mega-menu {
  display: block;
  position: absolute;
  left: 0;
  right: 0;
  top: 100%;
  z-index: 9;
  overflow: hidden;
  max-height: 0;
  transition: max-height 0.4s ease;
}

sf-mega-menu[data-open="true"] {
  max-height: var(--sf-submenu-height, 700px);
}

/* --- Panel (one per L1 item with children) --- */
.sf-mega-menu__panel {
  display: none;
  background-color: #FFFFFF;
  border-top: 1px solid rgba(0, 0, 0, 0.06);
  width: 100%;
  color: #1F1F1F;
}

.sf-mega-menu__panel[aria-hidden="false"] {
  display: block;
}

/* --- Container: 50/50 split matching Figma --- */
.sf-mega-menu__container {
  display: flex;
  gap: var(--fluid-12-12);
  padding: var(--fluid-24-24);
  max-width: var(--narrow-page-width);
  margin: 0 auto;
}

sf-header[data-width="full-width"] .sf-mega-menu__container {
  max-width: none;
}

.sf-mega-menu__container--cards-only .sf-mega-menu__right {
  flex: 1;
  justify-content: center;
}

/* --- Left: featured links + subitems (natural width) --- */
.sf-mega-menu__left {
  flex-shrink: 0;
  display: flex;
  gap: var(--fluid-12-12);
  align-items: flex-start;
}

/* --- Featured links column (Cormorant 24px) --- */
.sf-mega-menu__featured {
  width: var(--fluid-164-164);
  flex-shrink: 0;
  display: flex;
  flex-direction: column;
}

.sf-mega-menu__featured-list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: var(--fluid-4-4);
}

.sf-mega-menu__featured-link {
  font-family: var(--font-heading--family);
  font-style: var(--font-heading--style);
  font-weight: var(--font-heading--weight);
  font-size: var(--fluid-24-24);
  line-height: 1.2;
  color: #310008;
  text-decoration: none;
  transition: opacity 0.2s ease;
}

.sf-mega-menu__featured-link:hover {
  opacity: 0.7;
}

/* --- Subitems: L2 headings + L3 links in horizontal columns --- */
.sf-mega-menu__subitems {
  display: flex;
  gap: var(--fluid-12-12);
  align-items: flex-start;
}

.sf-mega-menu__column {
  width: var(--fluid-164-164);
  flex-shrink: 0;
  display: flex;
  flex-direction: column;
}

.sf-mega-menu__heading {
  font-family: var(--font-body--family);
  font-weight: 400;
  font-size: var(--fluid-12-12);
  line-height: 1.2;
  text-transform: uppercase;
  color: var(--sf-mega-heading-color, #310008);
  margin: 0 0 var(--fluid-16-16) 0;
}

.sf-mega-menu__heading a {
  color: inherit;
  text-decoration: none;
}

.sf-mega-menu__sublist {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: var(--fluid-12-12);
}

.sf-mega-menu__sublink {
  font-family: var(--font-body--family);
  font-weight: 400;
  font-size: var(--fluid-12-12);
  line-height: 1.2;
  color: #1F1F1F;
  text-decoration: none;
  transition: opacity 0.2s ease;
}

.sf-mega-menu__sublink:hover {
  opacity: 0.7;
}

/* --- Right half: banner cards (50%, 320px height, scroll on smaller screens) --- */
.sf-mega-menu__right {
  flex: 1;
  display: flex;
  gap: var(--fluid-12-12);
  align-items: stretch;
  overflow-x: auto;
  overflow-y: hidden;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
}

.sf-mega-menu__right::-webkit-scrollbar {
  display: none;
}

.sf-mega-menu__card {
  flex: 1 1 var(--fluid-200-200);
  min-width: var(--fluid-180-180);
  max-width: var(--fluid-280-280);
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  overflow: hidden;
  text-decoration: none;
  height: var(--fluid-350-350);
  padding: var(--fluid-16-16);
  border-radius: 1px;
  background-color: #f6f6f6;
}

.sf-mega-menu__card-image {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 1px;
  transition: transform 0.3s ease;
}

.sf-mega-menu__card:hover .sf-mega-menu__card-image {
  transform: scale(1.03);
}

.sf-mega-menu__card-placeholder {
  position: absolute;
  inset: 0;
  background-color: #f6f6f6;
}

.sf-mega-menu__card-label {
  position: relative;
  z-index: 1;
  font-family: var(--font-body--family);
  font-weight: 400;
  font-size: var(--fluid-16-16);
  color: #FFFFFF;
}


/* --- Responsive: hide/show --- */
.sf-header__hide-mobile {
  display: none;
}

.sf-header__hide-desktop {
  display: flex;
}

@media (min-width: 990px) {
  .sf-header__hide-mobile {
    display: flex;
  }

  .sf-header__hide-desktop {
    display: none;
  }
}

@media (min-width: 990px) and (max-width: 1199px) {
  .sf-header__bar {
    flex-wrap: wrap;
    row-gap: 4px;
  }

  .sf-header__logo {
    height: var(--sf-header-logo-height-mobile);
  }

  .sf-header__nav {
    flex: 1;
  }

  .sf-header__actions,
  .sf-header__actions--desktop {
    display: contents;
  }

  .sf-header__actions-text {
    order: 10;
    margin-left: auto;
  }
}

/* --- Mobile header --- */
@media (max-width: 989px) {
  .sf-header__bar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: var(--sf-header-padding-top) 16px var(--sf-header-padding-bottom);
    gap: 8px;
  }

  .sf-header__logo-wrapper {
    flex: 0 0 auto;
  }

  .sf-header__logo {
    height: var(--sf-header-logo-height-mobile);
  }

  .sf-header__actions--mobile {
    display: flex;
    align-items: center;
    gap: 8px;
  }

  .sf-header__actions--mobile .sf-header__action {
    font-size: 13px;
  }

  .sf-header__actions--mobile .sf-header__action--icon svg {
    width: 12px;
    height: 12px;
  }

  .sf-header__actions--mobile .sf-header__badge {
    font-size: 7px;
    line-height: 1.2;
  }
}

/* --- Search overlay (dark backdrop behind search dropdown) --- */
.sf-search-overlay {
  position: fixed;
  inset: 0;
  z-index: 8;
  background-color: rgba(0, 0, 0, 0);
  pointer-events: none;
  transition: background-color 0.3s ease;
}

.sf-search-overlay--active {
  background-color: rgba(0, 0, 0, 0.4);
  pointer-events: auto;
  cursor: pointer;
}

/* --- Visually hidden for SR --- */
.sf-header__sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border-width: 0;
}

/* ========================================
   Cart Drawer (native Horizon, ported from snippets/header-actions.liquid)
   ======================================== */
.cart-drawer {
  --cart-drawer-padding: var(--padding-xl) var(--padding-xl);
  --cart-drawer-padding-desktop: var(--padding-xl) var(--padding-2xl);
}

.cart-drawer__dialog {
  position: fixed;
  overflow: hidden;
  border-radius: 0;
  width: 100%;
  height: 100%;
  margin: 0 0 0 auto;
  padding: 0;
  border-left: var(--style-border-drawer);
  box-shadow: var(--shadow-drawer);
  background-color: var(--color-background);
}

@media screen and (min-width: 750px) {
  .cart-drawer__dialog {
    width: var(--sidebar-width);
    max-width: 95vw;
  }
}

.cart-drawer__dialog:modal {
  max-height: 100dvh;
  overflow-y: hidden;
}

.cart-drawer__inner {
  height: 100%;
  overflow: hidden;
}

.cart-drawer__content {
  height: calc(100% - var(--header-height));
  display: flex;
  flex-direction: column;
  padding: 0;
  background-color: var(--color-background);
  flex-grow: 1;
  overflow-y: auto;
}

.cart-drawer__heading {
  display: flex;
  align-items: center;
  gap: var(--gap-xs);
  margin-bottom: 0;
}

.cart-drawer__close-button {
  margin-right: calc(var(--padding-sm) * -1);
  top: var(--margin-sm);
}

@media screen and (max-width: 749px) {
  .cart-drawer__close-button {
    top: var(--margin-2xs);
  }
}

.cart-drawer--empty .cart-drawer__content {
  text-align: center;
  min-height: auto;
}

.cart-drawer--empty .cart-drawer__heading {
  margin-bottom: var(--margin-md);
}

.cart-drawer__items .cart-items__table-row {
  padding-bottom: var(--gap-xl);
  border-bottom: var(--style-border-width) solid var(--color-border);
  margin-bottom: var(--gap-xl);
}

.cart-drawer__items .cart-items__table-row:has(+ .cart-items__nested-line) {
  border-bottom: none;
  margin-bottom: 0;
}

.cart-drawer__items .cart-items__table-row:last-child {
  border-bottom: none;
  padding-block-end: 0;
  margin-block-end: 0;
}

.cart-drawer__summary {
  --cart-drawer-summary-padding: var(--padding-lg);

  position: sticky;
  bottom: 0;
  z-index: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--gap-xl);
  padding: var(--cart-drawer-summary-padding);
  margin-top: auto;
  background-color: var(--color-background);
  /* stylelint-disable-next-line color-named */
  mask-image: linear-gradient(to bottom, transparent, black var(--cart-drawer-summary-padding));
}

@media screen and (min-width: 750px) {
  .cart-drawer__summary {
    --cart-drawer-summary-padding: var(--padding-2xl);
  }
}

.cart-drawer__dialog[cart-summary-sticky='false'] .cart-drawer__summary {
  position: static;
  mask-image: none;
}

.cart-drawer__dialog[cart-summary-sticky='false'] .cart-drawer__items {
  overflow: unset;
}

.cart-drawer__summary .cart__summary-totals:not(:has(.cart__subtotal-container:empty)) {
  border-block-start: var(--style-border-width) solid var(--color-border);
  padding-block-start: var(--padding-2xl);
}

@media screen and (min-width: 750px) {
  .cart-drawer__summary .cart-note {
    margin-block-start: var(--margin-3xs);
  }
}

.cart-drawer__heading--empty {
  display: flex;
  justify-content: center;
}

.cart-drawer__items {
  display: flex;
  flex-direction: column;
  padding-inline: 16px;
  overflow-y: auto;
}

@media screen and (min-width: 750px) {
  .cart-drawer__items {
    padding-inline: 16px;
  }
}

.cart-drawer--empty {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  height: 100dvh;
  margin-top: 0;
}

.cart-drawer:not(:has(.cart-form)) .cart-drawer__content {
  justify-content: center;
}

.cart-drawer__header {
  background-color: var(--color-background);
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  padding: var(--cart-drawer-padding);
  border-bottom: var(--style-border-width) solid none;
  position: sticky;
  top: 0;
  z-index: 1;
}

@media screen and (min-width: 750px) {
  .cart-drawer__header {
    padding-inline: var(--cart-drawer-padding-desktop);
  }
}

.cart-drawer--empty .cart-drawer__header {
  border-bottom: none;
  padding-bottom: 0;
}

.cart-drawer--empty .cart-drawer__heading {
  text-align: center;
}

.cart-drawer__heading .cart-bubble {
  width: fit-content;
  border-radius: var(--style-border-radius-buttons-primary);
  aspect-ratio: auto;
  padding: var(--cart-padding);
}

.cart-drawer__heading .cart-bubble[data-maintain-ratio] {
  width: min(1lh, 22px);
  height: min(1lh, 22px);
}

.cart-drawer__heading .cart-bubble__text {
  font-family: var(--font-paragraph--family);
  font-weight: var(--font-paragraph--weight);
  color: var(--color-foreground);
  font-size: clamp(var(--font-size--3xs), 0.75em, var(--font-size--xs));
}

.cart-drawer__heading .cart-bubble .cart-bubble__background {
  background-color: transparent;
}

.cart-drawer__collections {
  padding: 20px 15px;
}

.cart-collections-grid {
  display: grid;
  grid-template-columns: 1fr 1fr; /* Dos columnas */
  gap: 15px 20px;
}

.cart-collection-item {
  display: flex;
  align-items: center;
  gap: 12px;
  text-decoration: none;
  transition: opacity 0.2s ease;
}

.cart-collection-item:hover {
  opacity: 0.7;
}

.cart-collection-image {
  width: 60px; /* Tamaño del cuadrado */
  height: 60px;
  flex-shrink: 0;
  background-color: #4a1010; /* Color de fallback similar a tu imagen */
  overflow: hidden;
}

.cart-collection-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.cart-collection-title {
  font-size: 13px;
  letter-spacing: 0.05em;
  color: #4a1010; /* Color vino de tu paleta */
  font-weight: 600;
}

.cart-drawer__recommendations {
  margin: 30px 0 0 0;
}

.cart-drawer__recommendations .cart-drawer__recommendations-heading {
  margin-bottom: 30px
}

.cart-drawer__recommendations .resource-list__item {
  height: 90px;
  margin-bottom: 4px;
}

.cart-drawer__recommendations .resource-list__item .swym-wishlist-collections-v2-container {
  display: none !important;
}

.cart-drawer__recommendations .resource-list__item .sbs-card {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 8px;
}

/* El primer hijo (contenedor de la imagen) */
.cart-drawer__recommendations .resource-list__item .sbs-card > *:first-child {
  flex: 0 0 90px;
  width: 90px;
  height: 90px;
  overflow: hidden;
}


.cart-drawer__recommendations .resource-list__item .sbs-card > *:first-child img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  padding-top: 16px
}


.cart-drawer__recommendations .resource-list__item .sbs-card > *:nth-child(2) {
  flex: 1;
  min-width: 0;
}

.cart-drawer__recommendations .resource-list__item .sbs-card .sbs-card__footer {
  display: flex;
  justify-content: inherit;
}

.cart-drawer__recommendations .resource-list__item .sbs-card .sbs-card__quick-add {
  position: static; 
  z-index: 2;
  background: transparent;
  border: 0;
  padding: 4px 6px;
  cursor: pointer;
  font-family: var(--font-body--family);
  font-size: var(--fluid-14-14);
  line-height: 1;
  color: var(--color-foreground);
  transition: opacity .2s ease;
}

.cart-drawer__recommendations .resource-list__item .sbs-card--compact .sbs-card__info {
  height: 100%;
  gap: 0;
  padding: 0;
  justify-content: space-between;
}

.sbs-card__info .sbs-card__heading {
  display: flex;
  flex-direction: row;
  width: 100%;
  gap: 5%;
}

.sbs-card__info .sbs-card__heading .sbs-card__heading-left {
  width: 75%;
}

.cart-drawer__recommendations .resource-list__item .sbs-card .sbs-card__info .sbs-card__title {
  display: block;
  font-size: 12px;
  margin: 0;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.sbs-card__info .sbs-card__heading .sbs-card__heading-right {
  width: 20%;
}

.sbs-card__info .sbs-card__heading .sbs-card__heading-right .sbs-card__price {
  text-align: right;
  font-size: 12px;
  margin: 0;
}
/* END_SECTION:sf-header */
/* START_SECTION:sf-press-logos (INDEX:58) */
.press-logos.section--full-width {
    grid-column: 1 / -1;
  }

  .press-logos.section--page-width {
    grid-column: 1 / -1;
    max-width: var(--narrow-page-width, 1440px);
    margin-inline: auto;
  }

  .press-logos__inner {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding-block: var(--fluid-96-96);
    padding-inline: var(--fluid-16-32);
    gap: var(--fluid-60-60);
  }

  .press-logos__brands {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: var(--fluid-80-80);
    flex-shrink: 0;
  }

  .press-logos__brand {
    display: flex;
    align-items: center;
    justify-content: center;
    width: auto;
    height: var(--fluid-24-32);
    background: none;
    border: none;
    padding: 0;
    cursor: pointer;
    opacity: 0.3;
    transition: opacity 0.3s ease;
  }

  .press-logos__brand--active {
    opacity: 1;
  }

  .press-logos__brand-image {
    width: auto;
    height: 100%;
    object-fit: contain;
  }

  .press-logos__brand-name {
    font-family: var(--font-heading--family);
    font-weight: var(--font-heading--weight);
    font-style: normal;
    font-size: var(--fluid-20-20);
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--color-foreground);
    white-space: nowrap;
  }

  .press-logos__quotes {
    width: 100%;
    flex-shrink: 0;
    padding-inline: var(--fluid-8-230);
    background: var(--color-background);
    /* Figma: black border frame around the quote */
    border: 1px solid #000;
    display: grid;
    overflow: hidden;
    cursor: grab;
    user-select: none;
  }

  .press-logos__quotes--borderless {
    border: none;
  }

  .press-logos__quotes:active {
    cursor: grabbing;
  }

  /* All quotes occupy the same grid cell so the container height
     is always determined by the tallest quote — prevents layout shift on switch */
  .press-logos__quote {
    grid-area: 1 / 1;
    align-self: center;
    visibility: hidden;
    opacity: 0;
  }

  .press-logos__quote--active {
    visibility: visible;
    opacity: 1;
  }

  .press-logos__quote--slide-right {
    animation: press-slide-right 0.35s ease forwards;
  }

  .press-logos__quote--slide-left {
    animation: press-slide-left 0.35s ease forwards;
  }

  @keyframes press-slide-right {
    from { opacity: 0; transform: translateX(var(--fluid-48-48)); }
    to { opacity: 1; transform: translateX(0); }
  }

  @keyframes press-slide-left {
    from { opacity: 0; transform: translateX(calc(var(--fluid-48-48) * -1)); }
    to { opacity: 1; transform: translateX(0); }
  }

  .press-logos__quote p {
    margin: 0;
    /* Non-palette color from Figma press-logos section */

    text-align: center;
    font-family: var(--font-heading--family);
    font-size: var(--fluid-24-32);
    font-style: italic;
    font-weight: 500;
    line-height: 1;
    letter-spacing: 0;
    white-space: pre-wrap;
  }

  .press-logos {
    padding-top: var(--padding-top);
    padding-bottom: var(--padding-bottom);
  }

  @media screen and (min-width: 750px) {
    .press-logos {
      padding-top: var(--padding-top-desktop);
      padding-bottom: var(--padding-bottom-desktop);
    }
  }

  @media screen and (max-width: 749px) {
    .press-logos__inner {
      padding-block: 120px;
      padding-inline: 16px;
      gap: 80px;
    }

    .product .press-logos__inner {
      padding-block: 60px;
    }

    .press-logos__brands {
      gap: 0;
      justify-content: space-between;
      padding-inline: 8px;
      width: 100%;
    }

    .press-logos__quotes {
      border: none;
      background: transparent;
      padding-inline: 8px;
      padding-block: 0;
    }
  }
/* END_SECTION:sf-press-logos */
/* START_SECTION:sf-reviews (INDEX:60) */
.sf-reviews {
    background: var(--color-background);
    width: 100%;
    padding-inline: var(--fluid-200-200);
    padding-top: var(--padding-top);
    padding-bottom: var(--padding-bottom);
  }

  /* Fixed padding — fluid token over-scales when section is capped at 1440px */
  .sf-reviews--page-width {
    max-width: 1440px;
    margin-inline: auto;
    padding-inline: 200px;
  }

  .sf-reviews__header {
    padding-block-start: var(--fluid-80-80);
    display: flex;
    flex-direction: column;
    gap: var(--fluid-16-16);
  }

  .sf-reviews__title {
    font-family: var(--font-heading--family);
    font-weight: var(--font-heading--weight);
    font-style: var(--font-heading--style);
    font-size: var(--fluid-32-32);
    color: #1f1f1f;
    line-height: 1;
    margin: 0;
    padding: 0;
  }

  .sf-reviews__description {
    font-family: var(--font-body--family);
    font-weight: 400;
    font-style: normal;
    font-size: var(--fluid-14-14);
    color: #1f1f1f;
    line-height: 1.3;
    margin: 0;
    max-width: var(--fluid-514-514);
  }

  @media screen and (min-width: 750px) {
    .sf-reviews {
      padding-top: var(--padding-top-desktop);
      padding-bottom: var(--padding-bottom-desktop);
    }
  }

  @media (max-width: 749px) {
    .sf-reviews {
      padding-inline: var(--fluid-16-16);
    }

    .sf-reviews--page-width {
      padding-inline: var(--fluid-16-16);
    }

    .sf-reviews__header {
      padding-block-start: var(--fluid-24-80);
      align-items: center;
    }

    .sf-reviews__title {
      text-align: center;
    }

    .sf-reviews__description {
      text-align: center;
      max-width: 100%;
    }
  }
/* END_SECTION:sf-reviews */
/* START_BLOCK:_accordion-row (INDEX:71) */
.details__icon {
    height: auto;
    margin-inline-end: var(--margin-xs);
  }
/* END_BLOCK:_accordion-row */
/* START_BLOCK:_announcement (INDEX:72) */
.text-block:not(.text-block--full-width).rte,
  .text-block:not(.text-block--full-width).paragraph {
    /* Safari doesn't support pretty, so fallback to balance */
    text-wrap: balance;
    text-wrap: pretty;
  }

  .text-block:not(.text-block--full-width).h1,
  .text-block:not(.text-block--full-width).h2,
  .text-block:not(.text-block--full-width).h3,
  .text-block:not(.text-block--full-width).h4,
  .text-block:not(.text-block--full-width).h5,
  .text-block:not(.text-block--full-width).h6 {
    text-wrap: balance;
  }

  /* Hide underline unless text is using paragraph styles. */
  .text-block:is(.h1, .h2, .h3, .h4, .h5, .h6) a {
    text-decoration-color: transparent;
  }

  .text-block h1,
  .text-block.h1 > * {
    margin-block: var(--font-h1--spacing);
  }

  .text-block h2,
  .text-block.h2 > * {
    margin-block: var(--font-h2--spacing);
  }

  .text-block h3,
  .text-block.h3 > * {
    margin-block: var(--font-h3--spacing);
  }

  .text-block h4,
  .text-block.h4 > * {
    margin-block: var(--font-h4--spacing);
  }

  .text-block h5,
  .text-block.h5 > * {
    margin-block: var(--font-h5--spacing);
  }

  .text-block h6,
  .text-block.h6 > * {
    margin-block: var(--font-h6--spacing);
  }

  .text-block > *:first-child {
    margin-block-start: 0;
  }

  .text-block > *:last-child {
    margin-block-end: 0;
  }

  .text-block--align-center,
  .text-block--align-center > * {
    margin-inline: auto;
  }

  .text-block--align-right,
  .text-block--align-right > * {
    margin-inline-start: auto;
  }
/* END_BLOCK:_announcement */
/* START_BLOCK:_product-details (INDEX:113) */
/* Clear padding on mobile, if not full-width */
  @media screen and (max-width: 749px) {
    .product-information.section--page-width .product-details > .group-block {
      padding-inline: 0;
    }
  }

  .view-product-title {
    display: none;
  }

  /* Container styles */
  .product-details {
    display: flex;
    align-self: start;
    justify-content: center;
  }

  @media screen and (min-width: 750px) {
    .product-details > .group-block {
      height: min-content;
      padding: var(--fluid-24-24);
    }

    .full-height--desktop {
      height: 100%;
      max-height: calc(100vh - var(--header-group-height, 0));
    }

    .full-height--desktop .group-block {
      align-self: var(--details-position, 'flex-start');
    }
  }
/* END_BLOCK:_product-details */
/* START_BLOCK:_sf-product-media-scroll (INDEX:120) */
/* ========================================
     Sterling Forever — Product Media Scroll
     ======================================== */

  .sf-pv {
    display: grid;
    grid-template-columns: 1fr auto;
    column-gap: var(--fluid-16-16);
    position: sticky;
    top: 0;
    width: 100%;
    height: 100vh;
    overflow: hidden;
    padding-block-start: var(--sf-pv-pad-start, 0);
    padding-block-end: var(--sf-pv-pad-end, 0);
  }

  .sf-pv__stack {
    grid-column: 1;
    grid-row: 1;
    position: relative;
    display: flex;
    flex-direction: column;
    gap: var(--fluid-20-20);
    width: 100%;
    height: 100%;
    overflow-y: auto;
    overscroll-behavior: contain;
    scroll-snap-type: y proximity;
    scrollbar-width: none;
  }

  .sf-pv__stack::-webkit-scrollbar {
    display: none;
  }

  .sf-pv__item {
    width: 100%;
    aspect-ratio: 690 / 840;
    overflow: hidden;
    flex-shrink: 0;
    scroll-snap-align: start;
  }

  .sf-pv__item .product-media {
    position: relative;
    width: 100%;
    height: 100%;
    aspect-ratio: auto;
  }

  .sf-pv__item deferred-media {
    position: absolute;
    inset: 0;
    display: block;
  }

  .sf-pv__item .product-media__image,
  .sf-pv__item deferred-media video,
  .sf-pv__item deferred-media iframe {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
  }

  .sf-pv > .sf-product-badges {
    grid-area: 1 / 1;
    align-self: start;
    justify-self: start;
    z-index: 2;
    padding: var(--fluid-4-4);
    pointer-events: none;
  }

  .sf-pv > .sf-product-badges .sf-product-badge {
    pointer-events: auto;
  }

  .sf-pv__rail {
    grid-column: 2;
    grid-row: 1;
    align-self: start;
    position: relative;
    margin-block-start: var(--fluid-32-32);
    margin-inline-end: 0;
    max-height: calc(100% - (var(--fluid-32-32) * 2));
    display: flex;
    flex-direction: column;
    gap: var(--fluid-4-4);
    align-items: flex-end;
    overflow-y: auto;
    overscroll-behavior: contain;
    scrollbar-width: none;
    z-index: 2;
  }

  .sf-pv__rail::-webkit-scrollbar {
    width: 4px;
  }

  .sf-pv__rail::-webkit-scrollbar-thumb {
    background: rgba(var(--color-foreground-rgb), 0.2);
    border-radius: 2px;
  }

  .sf-pv__dragbar {
    position: absolute;
    top: 0;
    right: 0;
    width: var(--fluid-64-64);
    aspect-ratio: 64 / 81;
    /* Non-palette-derived accent from Figma node 300:15974 — Cream Linen, chosen for contrast over imagery */
    border: 1px solid #F1E7DA;
    border-radius: 2px;
    box-sizing: border-box;
    z-index: 3;
    cursor: grab;
    transform: translateY(0);
    pointer-events: auto;
    will-change: transform;
  }

  .sf-pv__dragbar:active {
    cursor: grabbing;
  }

  /* Mobile progress bar */
  .sf-pv__progress {
    display: none;
  }

  /* Mobile — hide rail, switch stack to horizontal scroll, show progress */
  @media (max-width: 900px) {
    .sf-pv__stack {
      flex-direction: row;
      overflow: hidden;
      scrollbar-width: none;
      gap: 0;
      overscroll-behavior: initial;
    }

    .sf-pv {
      grid-template-columns: 1fr;
      column-gap: 0;
      position: relative;
      height: auto;
      max-height: 500px;
      overflow: clip;
    }

    .product-information__media .sf-pv {
      height: 100%;
    }

    .sf-pv__stack::-webkit-scrollbar {
      display: none;
    }

    .sf-pv__item {
      flex: 0 0 100%;
    }

    .sf-pv__rail {
      display: none;
    }

    .sf-pv__progress {
      grid-area: 1 / 1;
      display: block;
      padding: var(--fluid-8-8) var(--fluid-16-16);
    }

    .sf-pv__progress-track {
      position: absolute;
      width: 100%;
      height: 2px;
      /* Non-palette-derived accent from Figma node 300:16667 — Cream Linen track */
      background: #F1E7DA;
      border-radius: 4px;
      overflow: hidden;
      bottom: 8px;
    }

    .product-information {
      padding;
    }

    .sf-pv__progress-fill {
      width: 0%;
      height: 100%;
      /* Non-palette-derived accent from Figma node 300:16667 — Burgundy Deep fill */
      background: #4A0E18;
      border-radius: 4px;
      transition: width 120ms linear;
    }
  }

  /* Reduce dragbar transition when user prefers reduced motion */
  @media (prefers-reduced-motion: reduce) {
    .sf-pv__dragbar {
      will-change: auto;
    }

    .sf-pv__progress-fill {
      transition: none;
    }
  }

  /* ========================================
     Zoom — inline magnifier lens (Mejuri-style)
     Click to toggle scale; mouse moves the transform-origin
     so the cursor acts like a lens center.
     ======================================== */
  .sf-pv--zoomable .sf-pv__item--zoomable {
    cursor: zoom-in;
  }

  .sf-pv--zoomable .sf-pv__item--zoomable .product-media__image {
    transition: transform 0.45s cubic-bezier(0.22, 1, 0.36, 1);
    /* will-change is applied ONLY when zoomed — otherwise every slider image
       gets its own persistent GPU layer, which tanks initial-load perf on iOS
       while the compositor is still decoding the full-resolution images. */
  }

  .sf-pv--zoomable .sf-pv__item--zoomable[data-zoomed='true'] {
    cursor: zoom-out;
    /* Prevents the browser from swallowing touch events as scroll so pointermove
       fires and the user can pan the image with their finger while zoomed. */
    touch-action: none;
  }

  .sf-pv--zoomable .sf-pv__item--zoomable[data-zoomed='true'] .product-media__image {
    transform: scale(var(--sf-zoom-scale, 2));
    /* Snappy while the cursor/finger is panning */
    transition: transform 0.1s linear;
    will-change: transform;
  }

  /* Pinch-to-zoom (mobile): no transition while fingers are moving so scaling
     tracks the gesture in real time. Reset animation kicks in on touchend. */
  .sf-pv__item[data-pinching='true'] .product-media__image {
    transition: none;
    will-change: transform;
  }

  /* While pinch-zoomed (active gesture OR holding the zoom), take full
     ownership of touch events on the slide so iOS can't intercept with
     overscroll bounce, edge gestures, or page scroll when the user pans past
     the image's clamp limit. */
  .sf-pv__item[data-pinch-zoomed='true'] {
    touch-action: none;
  }

  @media (prefers-reduced-motion: reduce) {
    .sf-pv--zoomable .sf-pv__item--zoomable .product-media__image {
      transition: none;
    }
  }
/* END_BLOCK:_sf-product-media-scroll */
/* START_BLOCK:accordion (INDEX:126) */
.accordion {
    flex: 1;
    width: 100%;
  }

  .accordion--dividers accordion-custom:not(:first-child) .details {
    border-block-start: var(--style-border-width) solid var(--color-border);
  }

  /* When accordion borders are not set, show fallback borders */
  .accordion--dividers {
    /* stylelint-disable-next-line declaration-property-value-disallowed-list */
    --show-fallback-borders: 0;
  }

  .accordion--dividers:not([class*='color-'])[style*='--border-width: 0'],
  .accordion--dividers:not([class*='color-'])[style*='--border-style: none'] {
    --show-fallback-borders: 1;
  }

  .accordion--dividers accordion-custom:first-child .details {
    border-block-start: calc(var(--style-border-width) * var(--show-fallback-borders)) solid var(--color-border);
  }

  .accordion--dividers accordion-custom:last-child .details {
    border-block-end: calc(var(--style-border-width) * var(--show-fallback-borders)) solid var(--color-border);
  }

  .accordion--dividers .details-content {
    padding-block-end: var(--padding-sm);
  }

  .accordion--caret .icon-plus,
  .accordion--plus .icon-caret {
    display: none;
  }

  /* because we can't pass apply a specific class on a block based on its parent block setting */
  .accordion .details__header {
    font-family: var(--summary-font-family);
    font-style: var(--summary-font-style);
    font-weight: var(--summary-font-weight);
    font-size: var(--fluid-12-12);
    line-height: var(--summary-font-line-height);
    text-transform: var(--summary-font-case);
    min-height: var(--minimum-touch-target);
    padding: var(--fluid-16-16) 0;
  }

  .icon-caret svg,
  summary .svg-wrapper {
    stroke: #1f1f1f;
    width: var(--fluid-14-14);
    height: var(--fluid-10-10);
  }

  .accordion--caret .details[open] .minus {
    display:flex;
  }

  .accordion--caret .details[open] .plus {
    display:none;
  }

  .accordion--caret .details .plus {
    display:flex;
  }

  .accordion--caret .details .minus {
    display: none;
  }
/* END_BLOCK:accordion */
/* START_BLOCK:product-banner (INDEX:155) */
.promo-banner {
        background-color: #E6D9C8;
        padding: var(--fluid-16-16);
        margin: var(--fluid-16-16) 0 var(--fluid-16-16);
        font-family: var(--font-paragraph--family);
        font-style: italic;
        font-size: var(--fluid-14-14);
    }
    .promo-banner > * {
        margin: 0;
    }
/* END_BLOCK:product-banner */
/* START_BLOCK:product-breadcrumbs (INDEX:156) */
.product-breadcrumb {
    padding-inline: 16px;
    padding-block: 16px;
  }

  .product-information .product-breadcrumb {
    padding-block: 0;
    padding-inline: 0;
  }

  .product-breadcrumb__list {
    display: flex;
    align-items: center;
    gap: 8px;
    list-style: none;
    margin: 0;
    padding: 0;
    font-family: var(--font-body--family);
    font-size: var(--fluid-13-13);
    font-weight: normal;
    line-height: var(--fluid-13-13);
    letter-spacing: 0.6px;
    text-transform: uppercase;
    white-space: nowrap;
  }

  .product-breadcrumb__link {
    text-decoration: none;
  }

  .product-breadcrumb__item:first-child .product-breadcrumb__link {
    color: rgba(31, 31, 31, 0.50);
  }

  .product-breadcrumb__link {
    color: #1f1f1f
  }

  .product-breadcrumb__separator {
    color: rgb(var(--color-foreground-rgb) / 0.5);
  }

  .product-breadcrumb__item--current {
    color: var(--color-foreground-heading);
  }

  @media (max-width: 749px) {
    .product-breadcrumb--hide-mobile {
      display: none;
    }
  }

  @media (min-width: 768px) {
    .product-breadcrumb {
      padding-inline: 24px;
      padding-block: 24px;
    }
  }
/* END_BLOCK:product-breadcrumbs */
/* START_BLOCK:product-estimated-delivery (INDEX:160) */
.product-estimated-delivery__installments {
    margin-top: var(--margin-xs, 0.5rem);
  }
/* END_BLOCK:product-estimated-delivery */
/* START_BLOCK:product-recommendations (INDEX:162) */
.block-resource-list {
    display: flex;
    flex-direction: column;
    row-gap: var(--gap);
    min-width: 0;
    min-height: 0;
    container-type: inline-size;
    container-name: resource-list;
    border-radius: var(--border-radius, 0);
  }

  .product-recommendations-wrapper {
    width: 100%;
  }

  .product-recommendations-wrapper:has(product-recommendations[data-shopify-editor-preview]) {
    width: 100vw;
  }

  /* ── Styled With — horizontal scroll ────────────────────── */
  .product-recommendations-wrapper .resource-list--grid {
    display: flex;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
    -ms-overflow-style: none;
    gap: var(--fluid-12-16);
    margin-top: var(--fluid-16-16);
  }

  .product-recommendations-wrapper .resource-list--grid::-webkit-scrollbar {
    display: none;
  }

  /* Desktop: 3 visible cards */
  .product-recommendations-wrapper .resource-list--grid > .resource-list__item {
    flex: 0 0 calc((100% - 2 * var(--fluid-12-16)) / 3);
    scroll-snap-align: start;
    min-width: 0;
  }

  /* Mobile: 2 visible cards */
  @media screen and (max-width: 749px) {
    .product-recommendations-wrapper .resource-list--grid > .resource-list__item {
      flex: 0 0 calc((100% - var(--fluid-12-16)) / 2);
    }
  }

  /* ── PDP card styles (scoped — does NOT affect collection/SBS cards) ── */
  .product-recommendations-wrapper .sbs-card--compact .sbs-card__info {
    padding: var(--fluid-8-8);
    gap: 2px;
  }

  .product-recommendations-wrapper .sbs-card--compact .sbs-card__vendor {
    font-weight: 400;
    font-size: var(--fluid-12-12);
    line-height: 1.2;
  }

  .product-recommendations-wrapper .sbs-card--compact .sbs-card__type {
    font-size: var(--fluid-12-12);
    line-height: 1.2;
    color: rgba(var(--color-foreground-rgb), 0.5);
  }

  .product-recommendations-wrapper .sbs-card--compact .sbs-card__price {
    font-weight: 400;
    font-size: var(--fluid-12-12);
    line-height: 1.2;
    margin: 0;
  }

  .product-recommendations-wrapper .sbs-card__quick-add {
    top: var(--fluid-8-8);
    right: var(--fluid-8-8);
  }

  .product-recommendations-wrapper .sbs-card-tile .swym-wishlist-collections-v2-container {
    top: var(--fluid-12-12) !important;
    left: var(--fluid-12-12) !important;
    padding: 0;
  }

  .product-recommendations-wrapper .sbs-card--compact .sbs-card__image-wrap::before {
    top: var(--fluid-8-8);
    left: var(--fluid-8-8);
    width: var(--fluid-16-16);
    height: var(--fluid-16-16);
  }

  /* Swym wishlist heart — 16px per Figma, clipped to ::before area */
  .product-recommendations-wrapper .swym-wishlist-collections-v2-container {
    width: var(--fluid-16-16) !important;
    height: var(--fluid-16-16) !important;
    overflow: hidden !important;
  }

  .product-recommendations-wrapper .swym-wishlist-collections-v2-container *,
  .product-recommendations-wrapper .swym-wishlist-collections-v2-container *::before,
  .product-recommendations-wrapper .swym-wishlist-collections-v2-container *::after {
    width: var(--fluid-16-16) !important;
    height: var(--fluid-16-16) !important;
    max-width: var(--fluid-16-16) !important;
    max-height: var(--fluid-16-16) !important;
    min-width: 0 !important;
    min-height: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
    box-sizing: border-box !important;
    font-size: 0 !important;
    line-height: 0 !important;
    background: transparent !important;
    border: 0 !important;
    transform: none !important;
  }

  .product-recommendations-wrapper .swym-wishlist-collections-v2-container svg {
    display: block !important;
    width: var(--fluid-16-16) !important;
    height: var(--fluid-16-16) !important;
  }
/* END_BLOCK:product-recommendations */
/* START_BLOCK:product-title (INDEX:163) */
.product-title-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    width: 100%;
    align-items: flex-start;
  }

  .product-title-row > a {
    flex: 1;
    min-width: 0;
  }

  .product-title-row .stamped-main-badge,
  .product-title-row .stamped-product-reviews-badge {
    flex-shrink: 0;
  }
/* END_BLOCK:product-title */
/* START_BLOCK:vendor (INDEX:173) */
/* Figma node 300:16677 — vendor sits above the title on mobile.
     DOM order stays [title, vendor] for accessibility; we flip visually
     via flex order on the parent group (flex-direction: column on mobile).
     Opt-in via the "Show above title on mobile" block setting. */
  @media (max-width: 749px) {
    .product-vendor--mobile-above {
      order: -1;
    }
  }
/* END_BLOCK:vendor */
/* START_SNIPPET:accordion-custom-component (INDEX:175) */
accordion-custom {
    details {
      &::details-content,
      .details-content {
        block-size: 0;
        overflow-y: clip;
        opacity: 0;
        interpolate-size: allow-keywords;
        transition: content-visibility var(--animation-speed-slow) allow-discrete,
          padding-block var(--animation-speed-slow) var(--animation-easing),
          opacity var(--animation-speed-slow) var(--animation-easing),
          block-size var(--animation-speed-slow) var(--animation-easing);
      }

      /* Disable transitions when the content toggle is not caused by the direct user interaction, e.g. opening the filters on mobile. */
      &:not(:focus-within)::details-content,
      &:not(:focus-within) .details-content {
        transition: none;
      }

      &:not([open]) {
        &::details-content,
        .details-content {
          padding-block: 0;
        }
      }

      &[open] {
        &::details-content,
        .details-content {
          opacity: 1;
          block-size: auto;

          @starting-style {
            block-size: 0;
            opacity: 0;
            overflow-y: clip;
          }

          &:focus-within {
            overflow-y: visible;
          }
        }
      }
    }
  }

  accordion-custom[data-disable-on-mobile='true'] summary {
    @media screen and (max-width: 749px) {
      cursor: auto;
    }
  }

  accordion-custom[data-disable-on-desktop='true'] summary {
    @media screen and (min-width: 750px) {
      cursor: auto;
    }
  }
/* END_SNIPPET:accordion-custom-component */
/* START_SNIPPET:background-media (INDEX:177) */
@media (prefers-reduced-motion: reduce) {
    video-background-component video {
      display: none;
    }
  }
/* END_SNIPPET:background-media */
/* START_SNIPPET:buy-buttons-styles (INDEX:182) */
.buy-buttons-block {
    --buy-button-preferred-width: 185px;

    width: 100%;
  }

  .product-form-buttons {
    display: flex;
    flex-wrap: wrap;
  }

  .product-form-buttons:not(:has(.quantity-rules)) {
    gap: calc(var(--gap-sm) / 2);

    @media screen and (min-width: 750px) {
      gap: var(--gap-sm);
    }
  }

  .product-form-buttons
    > *:not(.quantity-selector-wrapper, .quantity-rules, .quantity-label, .volume-pricing, .product-form-text__error) {
    flex: 1 1 var(--buy-button-preferred-width, 0);
    min-width: fit-content;
  }

  .product-form-buttons--stacked
    > *:not(.quantity-selector-wrapper, .quantity-rules, .quantity-label, .volume-pricing, .product-form-text__error) {
    flex-basis: 51%;
  }

  .product-form-buttons button {
    width: 100%;
    padding-block: var(--fluid-16-16);
    border-radius: 0;
    font-size: var(--fluid-16-16);
  }

  .product-form-buttons button[ref="addToCartButton"] {
    background-color: rgb(49, 0, 8);
  }

  .product-form-buttons .quantity-selector {
    display: none;
  }

   .product-form-buttons {
    gap: 0 !important;
   }

  .quantity-selector {
    flex-grow: 0;
    flex-shrink: 0;
    height: var(--height-buy-buttons);
  }

  .quantity-label {
    flex: 1 0 100%;
    width: 100%;
    font-size: var(--font-size--sm);
    margin-block-end: var(--gap-xs);
  }

  .quantity-label__cart-count {
    color: var(--color-foreground-secondary);
  }

  .quantity-rules {
    display: flex;
    flex-wrap: wrap;
    gap: 0;
    row-gap: calc(var(--gap-xs) / 2);
    flex: 1 0 100%;
    width: 100%;
    font-size: var(--font-size--xs);
    color: var(--color-foreground-secondary);
    margin-block-start: var(--gap-xs);
    margin-block-end: var(--gap);
  }

  .product-form-buttons:has(~ .volume-pricing .volume-pricing__title) .quantity-rules {
    margin-block-end: var(--gap-md);
  }

  .quantity-rules__item {
    position: relative;
    display: inline-block;
    color: rgb(var(--color-foreground-rgb) / var(--opacity-subdued-text));
  }

  .quantity-rules__item:not(:last-child) {
    padding-right: var(--padding-xl);
    margin-right: var(--margin-2xs);
  }

  .quantity-rules__item:not(:last-child)::after {
    content: '•';
    position: absolute;
    inset-inline-end: 0.5rem;
    top: 50%;
    transform: translateY(-50%);
    font-size: 0.5em;
    line-height: 0;
  }

  .add-to-cart-button {
    text-transform: var(--button-text-case-primary);
  }

  .add-to-cart-button.button-secondary {
    text-transform: var(--button-text-case-secondary);
  }

  .product-form-text__error {
    display: flex;
    flex: 1 0 100%;
    align-items: flex-start;
    gap: var(--gap-xs);
    margin-block-end: var(--gap-xs);
  }

  .product__pickup-availabilities {
    width: 100%;
  }

  .pickup-availability__column {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
  }

  .pickup-availability__row {
    display: flex;
    gap: var(--padding-xs);
  }

  .pickup-availability__dialog-row {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
  }

  .pickup-availability__header-container {
    padding-block-end: var(--padding-2xl);
  }

  .pickup-location__wrapper {
    display: flex;
    flex-direction: column;
    padding-block: var(--padding-2xl);
    border-top: 1px solid var(--color-border);
    gap: var(--padding-xs);
  }

  .pickup-location__address-wrapper {
    display: flex;
    flex-direction: column;
    gap: var(--padding-md);
  }

  .pickup-location__dialog {
    padding: var(--padding-2xl);
    position: fixed;
    border-radius: 0;
    width: var(--sidebar-width);
    max-width: 95vw;
    height: 100%;
    margin: 0 0 0 auto;
    border: var(--style-border-drawer);
    box-shadow: var(--shadow-drawer);
    background-color: var(--color-background);
  }

  .pickup-location__dialog:modal {
    max-height: 100dvh;
  }

  .pickup-location__text-sm {
    font-size: var(--font-size--sm);
    margin: 0;
  }

  .pickup-location__text-xs {
    font-size: var(--font-size--xs);
    margin: 0;
  }

  .pickup-location__button {
    width: fit-content;
    color: var(--color-primary);
    font-size: var(--font-size--xs);
    font-family: var(--font-body--family);
    padding: 0;
    cursor: pointer;
    margin-block: var(--margin-xs);
  }

  .pickup-location__button:hover {
    color: var(--color-primary-hover);
  }

  .pickup-location__h4 {
    margin: 0;
  }

  .pickup-location__text-bold {
    font-size: var(--font-size--md);
    font-weight: 600;
    margin: 0;
  }

  .pickup-location__availability-wrapper {
    display: flex;
    align-items: center;
    gap: var(--gap-xs);
    font-family: var(--font-paragraph--family);
  }

  .pickup-location__address {
    font-style: normal;
  }

  .pickup-location__close-button {
    top: calc(var(--padding-2xl) - (var(--icon-size-xs) / 2));
    right: calc(var(--padding-2xl) - var(--icon-size-xs));
  }

  .volume-pricing {
    display: block;
    width: 100%;
    margin-bottom: var(--gap);
  }

  .volume-pricing:not(:has(.volume-pricing__title)) {
    margin-top: 0;
    margin-bottom: 0;
  }

  .volume-pricing__title {
    display: block;
    margin-block-end: var(--gap-sm);
    font-size: var(--font-size--sm);
    font-weight: var(--font-body--weight);
    color: var(--color-foreground);
  }

  .volume-pricing__table {
    width: 100%;
  }

  .volume-pricing__row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-block: var(--padding-sm);
    padding-inline: var(--padding-md);
    font-size: var(--font-size--sm);
  }

  .volume-pricing__row--even {
    background: rgb(var(--color-foreground-rgb) / var(--opacity-5));
  }

  .volume-pricing__row--odd {
    background: var(--color-background);
  }

  .volume-pricing__collapsible-wrapper {
    block-size: 0;
    overflow-y: clip;
    opacity: 0;
    interpolate-size: allow-keywords;
    transition: opacity var(--animation-speed-slow) var(--animation-easing),
      block-size var(--animation-speed-slow) var(--animation-easing);
  }

  .volume-pricing__toggle {
    width: 100%;
    padding-bottom: 0;
    padding-inline: 0;
    text-align: left;
    color: var(--color-foreground-secondary);
    font-size: var(--font-size--xs);
    cursor: default;
    margin-block-start: 0;
    pointer-events: none;
  }

  button.volume-pricing__toggle {
    /* Need the extra specificity to override .product-form-buttons button */
    padding-block: var(--padding-sm);
  }

  .volume-pricing__toggle-text {
    cursor: pointer;
    display: inline-block;
    pointer-events: auto;
  }

  .volume-pricing__show-less {
    display: none;
  }

  .volume-pricing--expanded .volume-pricing__collapsible-wrapper {
    opacity: 1;
    block-size: auto;

    @starting-style {
      block-size: 0;
      opacity: 0;
      overflow-y: clip;
    }
  }

  .volume-pricing--expanded .volume-pricing__show-more {
    display: none;
  }

  .volume-pricing--expanded .volume-pricing__show-less {
    display: inline;
  }

  /* Accelerated checkout styles — co-located here so they compile on pages
     where the quick-add modal can display buy buttons (e.g. collection pages). */
  .accelerated-checkout-block[data-shopify-visual-preview] {
    width: 300px;
  }

  more-payment-options-link {
    font-size: smaller;
  }

  more-payment-options-link a {
    --button-color: var(--color-primary);
  }

  more-payment-options-link a:hover {
    --button-color: var(--color-primary-hover);
  }

  .shopify-payment-button__more-options[aria-hidden='true'] {
    display: none;
  }
/* END_SNIPPET:buy-buttons-styles */
/* START_SNIPPET:cart-bubble (INDEX:184) */
.cart-bubble {
    --cart-padding: 0.2em;

    position: relative;
    width: 20px;
    aspect-ratio: 1;
    border-radius: 50%;
    border-width: 0;
    display: flex;
    line-height: normal;
    align-items: center;
    justify-content: center;
    color: var(--color-primary-button-text);
    padding-inline: var(--cart-padding);
  }

  .cart-bubble[data-maintain-ratio] {
    aspect-ratio: 1;
  }

  .cart-bubble[data-maintain-ratio] .cart-bubble__background {
    border-radius: var(--style-border-radius-50);
  }

  .cart-bubble__background {
    position: absolute;
    inset: 0;
    background-color: var(--color-primary-button-background);
    border-radius: var(--style-border-radius-lg);
  }

  .cart-bubble__text {
    font-size: var(--font-size--3xs);
    z-index: var(--layer-flat);
    line-height: 1;
    display: flex;
    align-items: center;
    justify-content: center;
  }
/* END_SNIPPET:cart-bubble */
/* START_SNIPPET:cart-items-component (INDEX:185) */
.cart-items-component {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
  }

  @media screen and (prefers-reduced-motion: no-preference) {
    html:active-view-transition-type(empty-cart-drawer) {
      .cart-items-component {
        view-transition-name: cart-drawer-content;
      }
    }

    html:active-view-transition-type(empty-cart-page) {
      .cart-items-component {
        view-transition-name: cart-page-content;
      }
    }
  }

  ::view-transition-old(cart-page-content) {
    animation: cart-page-content-old var(--animation-speed-fast) var(--animation-easing) forwards;
  }

  @keyframes cart-page-content-old {
    from {
      opacity: 1;
    }
    to {
      opacity: 0;
      filter: blur(4px);
    }
  }

  ::view-transition-old(cart-drawer-content) {
    transform-origin: 50% 33%;
    animation: cart-contents-old var(--spring-d280-b0-duration) var(--spring-d280-b0-easing) forwards;
  }

  ::view-transition-new(cart-drawer-content) {
    transform-origin: top center;
    animation: cart-contents-new var(--spring-d280-b0-duration) var(--spring-d280-b0-easing) forwards;
  }

  @keyframes cart-contents-old {
    to {
      scale: 0.92;
      opacity: 0;
    }
  }

  @keyframes cart-contents-new {
    from {
      scale: 1.05;
      translate: 0 128px;
      filter: blur(1px);
      opacity: 0;
    }
  }
/* END_SNIPPET:cart-items-component */
/* START_SNIPPET:group (INDEX:205) */
.group-block__link {
    position: absolute;
    inset: 0;
  }

  .group-block__link ~ :is(.group-block-content, .group-block__media-wrapper) {
    pointer-events: none;

    :is(a, button, input, textarea, select) {
      pointer-events: auto;
    }
  }

  /* Needs the .group-block__link ~ to be specific enough to take effect. */
  .group-block__link ~ .group-block-content--design-mode {
    pointer-events: auto;
  }
/* END_SNIPPET:group */
/* START_SNIPPET:product-badges-styles (INDEX:238) */
.product-badges {
    --badge-inset: max(var(--padding-xs), calc((var(--border-radius) + var(--padding-xs)) * (1 - cos(45deg))));

    position: absolute;
    z-index: var(--layer-flat);
  }

  .product-badges--bottom-left {
    bottom: calc(var(--badge-inset) + var(--padding-block-start));
    left: calc(var(--badge-inset) + var(--padding-inline-start));
  }

  .product-badges--top-left {
    top: calc(var(--badge-inset) + var(--padding-block-start));
    left: calc(var(--badge-inset) + var(--padding-inline-start));
  }

  .product-badges--top-right {
    top: calc(var(--badge-inset) + var(--padding-block-start));
    right: calc(var(--badge-inset) + var(--padding-inline-start));
  }

  .product-badges__badge {
    --badge-font-size: var(--font-size--xs);

    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    color: var(--color-foreground);
    background: var(--color-background);
    font-size: var(--badge-font-size);
    font-family: var(--badge-font-family);
    font-weight: var(--badge-font-weight);
    text-transform: var(--badge-text-transform);
    border-radius: var(--badge-border-radius);
  }

  .product-badges__badge--rectangle {
    padding-block: var(--badge-rectangle-padding-block);
    padding-inline: var(--badge-rectangle-padding-inline);
  }
/* END_SNIPPET:product-badges-styles */
/* START_SNIPPET:product-information-content (INDEX:241) */
.product-information {
    gap: var(--gap) 0;
  }

  /* Base grid layout */
  .product-information__grid {
    display: grid;
    grid-template-columns: subgrid;
    grid-column: 1 / -1;
  }

  /* Page-width stops fluid scaling at the Figma base (1440); full-width keeps the global cap */
  .product-information.section--page-width {
    --fluid-cap: var(--fluid-base);
  }

  .product-information__grid accordion-custom details[open] .details-content {
    color: rgba(31, 31, 31, 0.60);
    font-family: 'Figtree';
    font-size: var(--fluid-14-14);
    font-style: normal;
    font-weight: 400;
    line-height: 130%;
  }

  .product-information .product-information__grid accordion-custom details[open] .details-content rte-formatter p {
    font-size: var(--fluid-14-14);
    line-height: 28px;
    margin: 8px 0;
  }

  .product-information .text-block:not(.text-block--full-width).rte p {
    color: rgba(31, 31, 31, 0.60);
    /* Desktop/body-xs */
    font-family: 'Figtree';
    font-size:  var(--fluid-12-12);
    font-style: normal;
    font-weight: 400;
    line-height: 120%;
    width: 100%;
    max-width: 100%;
    margin-bottom: 0;
  }

   .product-information .text-block:not(.text-block--full-width).rte h5 {
    color: #000;
    font-family: 'Cormorant';
    font-size: 20px;
    font-style: italic;
    font-weight: 500;
    line-height: 120%;
    max-width: 500px;
   }

  .product-information .text-block:not(.text-block--full-width).rte p + p 
  {
    margin-top: 0;
  }

  /* Default column positions */
  .product-details {
    order: 1;
  }

  .product-information__media {
    order: 0;
    width: 0;
    min-width: 100%;
  }

  .product-information__media .product-media-gallery__placeholder-image {
    width: 100%;
    height: 100%;
  }

  /* Mobile styles */
  @media screen and (max-width: 900px) {
    .product-information__media {
      grid-column: 1 / 3;
    }
    .product-information__grid:not(.product-information--media-none).product-information--media-left {
      grid-template-columns: 1fr;
    }

    .product-details {
      grid-column: 1 / 3;
      padding: 0 16px;
    }

    .product-information span.price {
      font-size: var(--fluid-16-16);
    }

    .product-information .add-to-cart-text {
      font-size: 14px
    }
  }

  /* Desktop styles */
  @media screen and (min-width: 901px) {
    .product-information__grid {
      grid-column: 2;
    }

    /* Position when there is no media */
    .product-information__grid.product-information--media-none {
      .product-details {
        width: var(--narrow-content-width);
        margin: 0 auto;
      }
    }

    /* Position when there is media */
    .product-information__grid:not(.product-information--media-none) {
      /* Media on the left side */
      &.product-information--media-left {
        grid-template-columns: 1fr min(50vw, var(--sidebar-width));

        &:has(.media-gallery--extend) {
          grid-column: 1 / 3;
        }
      }

      /* Media on the right side */
      &.product-information--media-right {
        grid-template-columns: min(50vw, var(--sidebar-width)) 1fr;

        .product-information__media {
          padding-left: calc(var(--gap, 0) / 2);
          order: 1;
        }

        .product-details {
          padding-right: calc(var(--gap, 0) / 2);
          order: 0;
        }

        &:has(.media-gallery--extend) {
          grid-column: 2 / -1;
        }
      }

      /* Equal width columns */
      &.product-information__grid--half,
      &.product-information__grid--half:has(.media-gallery--extend) {
        grid-column: 1 / -1;
        grid-template-columns:
          var(--full-page-grid-margin) calc(var(--full-page-grid-central-column-width) / 2) calc(
            var(--full-page-grid-central-column-width) / 2
          )
          var(--full-page-grid-margin);

        &.product-information--media-left {
          .product-information__media {
            grid-column: 2 / 3;

            &:has(.media-gallery--extend) {
              grid-column: 1 / 3;
            }
          }

          .product-details {
            grid-column: 3 / 4;
          }
        }

        &.product-information--media-right {
          .product-information__media {
            grid-column: 3 / 4;

            &:has(.media-gallery--extend) {
              grid-column: 3 / -1;
            }
          }

          .product-details {
            grid-column: 2 / 3;
          }
        }
      }
    }

    /* Handle full width section */
    .section--full-width {
      .product-information__grid:not(.product-information--media-none) {
        &.product-information--media-left,
        &.product-information--media-right {
          grid-column: 1 / -1;
        }

        &.product-information--media-left .product-details {
          padding-inline-end: var(--padding-lg);
        }

        &.product-information--media-right .product-details {
          padding-inline-start: var(--padding-lg);
        }

        &.product-information__grid--half.product-information--media-left {
          .product-information__media {
            grid-column: 1 / 3;
          }

          .product-details {
            grid-column: 3 / -1;
          }
        }

        &.product-information__grid--half.product-information--media-right {
          .product-information__media {
            grid-column: 3 / -1;
          }

          .product-details {
            grid-column: 1 / 3;
          }
        }
      }
    }
  }

  /* Wider sidebar for large screens */
  @media screen and (min-width: 1200px) {
    .product-information__grid:not(
        .product-information__grid--half,
        .product-information--media-none
      ).product-information--media-left {
      grid-column: 1 / -1;
      grid-template-columns: minmax(0, var(--fluid-690-690)) minmax(0, var(--fluid-690-690));
      column-gap: 36px;
      justify-content: center;
    }

    .product-information__grid:not(
        .product-information__grid--half,
        .product-information--media-none
      ).product-information--media-right {
      grid-template-columns: 1fr 2fr;
    }

    /* Full-width: columns fill 100% proportionally instead of capping at the Figma 690px */
    .product-information.section--full-width .product-information__grid:not(
        .product-information__grid--half,
        .product-information--media-none
      ).product-information--media-left {
      grid-template-columns: 1fr 1fr;
    }
  }

  .product-information__grid--limit-details .product-details > .group-block {
    --details-max-width: var(--sidebar-width);
    max-width: var(--details-max-width);
  }

  @media screen and (min-width: 1600px) {
    .product-information__grid--limit-details .product-details > .group-block {
      --details-max-width: 32rem;
    }
  }

  /* If the header is sticky, make product details content stick underneath the header */
  body:has(#header-group #header-component[data-sticky-state='active']) .product-details.sticky-content--desktop {
    --sticky-header-offset: var(--header-height);
  }
/* END_SNIPPET:product-information-content */
/* START_SNIPPET:product-media-gallery-content-styles (INDEX:242) */
media-gallery:where(.media-gallery--grid) .media-gallery__grid {
    display: none;
  }

  media-gallery.media-gallery--grid .media-gallery__grid .product-media-container {
    /* Needed for safari to stretch to full grid height */
    height: 100%;
  }

  @media screen and (min-width: 750px) {
    .media-gallery--two-column .media-gallery__grid {
      grid-template-columns: repeat(2, 1fr);
    }

    /* Display grid view as a carousel on mobile, grid on desktop */
    media-gallery:is(.media-gallery--grid) slideshow-component {
      display: none;
    }

    media-gallery:where(.media-gallery--grid) .media-gallery__grid {
      display: grid;
    }
  }

  .product-media-container__zoom-button {
    position: absolute;
    width: 100%;
    height: 100%;
    z-index: var(--layer-flat);
    cursor: zoom-in;
    background-color: transparent;

    &:hover {
      background-color: transparent;
    }
  }

  slideshow-slide.product-media-container--tallest {
    content-visibility: visible;
  }

  .product-media__drag-zoom-wrapper {
    aspect-ratio: inherit;
    min-height: inherit;
    min-width: inherit;
    display: inherit;
    flex: inherit;
  }

  .media-gallery__mobile-controls {
    grid-area: auto;
  }

  .product-media-container--zoomable.product-media-container--image {
    cursor: zoom-in;
  }
/* END_SNIPPET:product-media-gallery-content-styles */
/* START_SNIPPET:product-media (INDEX:244) */
.product-media {
    aspect-ratio: var(--gallery-aspect-ratio, var(--ratio));
    min-height: 0;
    min-width: 0;
  }

  .product-media__image {
    object-position: var(--focal-point, center center);
  }

  /*** Media border-radius feature ****/
  @media screen and (min-width: 750px) {
    .media-gallery--carousel slideshow-container,
    .media-gallery--grid .product-media > * {
      border-radius: var(--media-radius, 0);
      overflow: hidden;
    }

    /* When the CAROUSEL is on the LEFT side */
    .product-information:not(.product-information--media-right)
      .media-gallery--carousel.media-gallery--extend
      slideshow-container {
      border-top-left-radius: 0;
      border-bottom-left-radius: 0;
    }

    /* When the CAROUSEL is on the RIGHT side */
    .product-information.product-information--media-right
      .media-gallery--carousel.media-gallery--extend
      slideshow-container {
      border-top-right-radius: 0;
      border-bottom-right-radius: 0;
    }

    /* When the GRID is on the LEFT side */
    .product-information:not(.product-information--media-right) {
      /* One column */
      .media-gallery--grid.media-gallery--extend:not(.media-gallery--two-column) .product-media > *,
      /* Two column, small first image */
      .media-gallery--grid.media-gallery--extend.media-gallery--two-column:not(.media-gallery--large-first-image)
        .product-media-container:nth-of-type(odd)
        .product-media
        > *,
      /* Two column, large first image */
      .media-gallery--grid.media-gallery--extend.media-gallery--two-column.media-gallery--large-first-image
        .product-media-container:is(:first-of-type, :nth-of-type(even))
        .product-media
        > * {
        border-top-left-radius: 0;
        border-bottom-left-radius: 0;
      }
    }

    /* When the GRID is on the RIGHT side */
    .product-information.product-information--media-right {
      /* One column */
      .media-gallery--grid.media-gallery--extend:not(.media-gallery--two-column) .product-media > *,
      /* Two column, small first image */
      .media-gallery--grid.media-gallery--extend.media-gallery--two-column:not(.media-gallery--large-first-image)
        .product-media-container:nth-of-type(even)
        .product-media
        > *,
      /* Two column, large first image */
      .media-gallery--grid.media-gallery--extend.media-gallery--two-column.media-gallery--large-first-image
        .product-media-container:is(:first-of-type, :nth-of-type(odd))
        .product-media
        > * {
        border-top-right-radius: 0;
        border-bottom-right-radius: 0;
      }
    }
  }
/* END_SNIPPET:product-media */
/* START_SNIPPET:quantity-selector (INDEX:245) */
.quantity-selector-wrapper {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: calc(var(--gap-sm) / 2);

    @media screen and (min-width: 750px) {
      gap: var(--gap-sm);
    }
  }

  .price-per-item {
    display: block;
    color: var(--color-foreground);
    font-size: var(--font-size--sm);
    font-weight: normal;
  }
/* END_SNIPPET:quantity-selector */
/* START_SNIPPET:quick-add-modal-styles (INDEX:246) */
#quick-add-dialog {
    display: contents;
  }

  @media screen and (min-width: 750px) {
    .quick-add-modal {
      width: var(--quick-add-modal-width);
      height: var(--quick-add-modal-height);
      max-width: none;
    }
  }

  .quick-add-modal {
    padding: 0;
    border: var(--style-border-popover);
    overflow: hidden;
    box-shadow: 0 5px 30px rgb(0 0 0 / var(--opacity-15));

    @media screen and (max-width: 749px) {
      position: fixed;
      margin: auto 0 0 0;
      min-height: unset;
      max-width: 100%;
      border-radius: 0;
      overflow: clip;
      height: fit-content;
    }
  }

  .quick-add-modal[open] {
    @media screen and (max-width: 750px) {
      border-top-left-radius: var(--style-border-radius-popover);
      border-top-right-radius: var(--style-border-radius-popover);
    }
  }

  .quick-add-modal[open] {
    @media screen and (min-width: 750px) {
      display: flex;
    }
  }

  .quick-add-modal .view-more-details__wrapper {
    @media screen and (max-width: 749px) {
      display: none;
    }
  }

  .quick-add-modal[open] {
    animation: modalSlideInTop var(--animation-speed) var(--animation-easing) forwards;
  }

  .quick-add-modal.dialog-closing {
    animation: modalSlideOutTop var(--animation-speed) var(--animation-easing) forwards;
  }

  .quick-add-modal__close {
    position: absolute;
    top: var(--margin-2xs);
    right: var(--margin-2xs);
    transition: transform 0.15s var(--animation-timing-bounce);
    z-index: var(--layer-raised);
    overflow: visible;
    transform-origin: center;
  }

  .quick-add-modal__close:active {
    transform: scale(0.99) translateY(1px);
  }

  .quick-add-modal__close {
    &:focus-visible {
      outline: none;
    }

    &:focus-visible::after {
      content: '';
      position: absolute;
      inset: 0;
      border-radius: calc(var(--style-border-radius-popover) - var(--margin-2xs));
      outline: var(--focus-outline-width) solid currentColor;
    }
  }

  .quick-add-modal__content {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    grid-template-rows: 100% 1fr;
    position: relative;
    overflow-y: auto;
    max-height: 100vh;
    flex-grow: 1;

    @media screen and (max-width: 749px) {
      grid-template-columns: repeat(4, 1fr);
      grid-template-rows: auto;
      padding-inline: var(--padding-xl);
      padding-block: var(--padding-xl);
      gap: var(--gap-lg);
      flex: 1;
      min-height: 0;
      overflow-y: auto;
      height: auto; /* Prevent a bug in Safari where height:fit-content is not respected */
      max-height: 100vh;
    }
  }

  .quick-add-modal__content .media-gallery--grid .media-gallery__grid {
    grid-template-columns: 1fr;
  }

  .quick-add-modal__content .media-gallery--grid.media-gallery--two-column .product-media-container:first-child {
    grid-column: auto;
  }

  .quick-add-modal__content {
    /* One column */
    .media-gallery--grid:not(.media-gallery--two-column) .product-media > *,
      /* Two column, small first image */
      .media-gallery--grid.media-gallery--two-column:not(.media-gallery--large-first-image)
      .product-media-container:nth-of-type(odd)
      .product-media > *,
      /* Two column, large first image */
      .media-gallery--grid.media-gallery--two-column.media-gallery--large-first-image
        .product-media-container:is(:first-of-type, :nth-of-type(even))
        .product-media > *,
        /* Carousel */
      .media-gallery--carousel slideshow-container {
      border-top-left-radius: 0;
      border-bottom-left-radius: 0;
    }
  }

  .quick-add-modal__content .view-more-details__wrapper {
    display: flex;
    justify-content: flex-start;
    width: 100%;
  }

  .view-more-details__wrapper .view-more-details {
    display: flex;
    align-items: center;
    width: fit-content;
  }

  .quick-add-modal__content .product-header {
    @media screen and (max-width: 749px) {
      display: flex;
      flex-direction: column;
      grid-column: 2 / -1;
      grid-row: 1;
      padding-right: var(--padding-2xl);
    }
  }

  .quick-add-modal__content .product-header a:not(product-price *) {
    @media screen and (max-width: 749px) {
      font-size: var(--font-size--md);
      font-weight: 500;
      color: inherit;
      width: fit-content;
    }
  }

  .quick-add-modal__content variant-picker,
  .quick-add-modal__content product-form-component {
    @media screen and (max-width: 749px) {
      grid-column: 1 / -1;
    }
  }

  .quick-add-modal__content .product-media-container__zoom-button {
    cursor: default;
  }

  .quick-add-modal__content .product-details {
    grid-column: 4 / -1;
    grid-row: 1 / span 2;
    display: flex;
    flex-direction: column;
    justify-content: stretch;
    height: 100%;
    min-height: 0;
    overflow-y: auto;
    position: relative;

    dialog[open] & {
      animation: fadeSlideIn 0.3s var(--animation-timing-fade-in) both;
      animation-delay: 0.1s;
    }

    @media screen and (max-width: 749px) {
      grid-column: 2 / span 2;
      grid-row: span 1;
      max-height: 100%;
      height: 100%;
    }
  }

  @property --quick-add-modal-mask-start {
    syntax: '<length>';
    initial-value: 0px;
    inherits: false;
  }

  @property --quick-add-modal-mask-end {
    syntax: '<length>';
    initial-value: 0px;
    inherits: true;
  }

  @keyframes detect-scroll {
    from,
    to {
      --can-scroll: ;
    }
  }

  @supports (animation-timeline: scroll(self)) {
    dialog[open] .quick-add-modal__content .product-details {
      mask-image: linear-gradient(to bottom, transparent 0%, #000 var(--quick-add-modal-mask-start), #000 100%);
      animation: 0.3s var(--animation-timing-fade-in) 0.1s both fadeSlideIn, scrollStart 1s linear both,
        scrollEnd 1s linear both, detect-scroll 1ms linear none;
      animation-timeline: auto, scroll(self), scroll(self), scroll(self);
      animation-range: normal, 0px 48px, calc(100% - 48px) 100%, 0% 100%;
    }
  }

  @keyframes scrollStart {
    from {
      --quick-add-modal-mask-start: 0px;
    }
    to {
      --quick-add-modal-mask-start: 48px;
    }
  }

  @keyframes scrollEnd {
    from {
      --quick-add-modal-mask-end: 0px;
    }
    to {
      --quick-add-modal-mask-end: 48px;
    }
  }

  .quick-add-modal__content .product-details > .group-block {
    flex-grow: 1;
    width: auto;
  }

  .quick-add-modal__content > * {
    min-height: 0;
  }

  .quick-add-modal__content .product-details :is(.view-product-title, .buy-buttons-block) {
    flex: 0 0 auto;
  }
  .quick-add-modal__content .product-details :is(.buy-buttons-block) {
    margin-top: auto;
    position: sticky;
    bottom: 0;
    padding-bottom: var(--padding-3xl);
    background-color: var(--color-background);
    z-index: var(--layer-raised);

    &::before {
      --quick-add-modal-mask-end-progressive-enhanced: 0px;

      position: absolute;
      content: '';
      display: block;
      inset: auto 0 100% 0;
      pointer-events: none;
      height: min(var(--gap-2xl), var(--gap));
      background-color: inherit;
      mask-image: linear-gradient(
        to top,
        #000 0%,
        #000 calc(var(--gap-2xs)),
        transparent calc(100% - var(--quick-add-modal-mask-end-progressive-enhanced)),
        transparent
      );
    }
  }

  .quick-add-modal__content .product-details .buy-buttons-block:has(gift-card-recipient-form) {
    position: static;
    padding-bottom: 0;
    flex-grow: 1;
    display: flex;
    flex-direction: column;
  }

  .quick-add-modal__content .product-details .buy-buttons-block:has(gift-card-recipient-form) > product-form-component {
    flex-grow: 1;
    display: flex;
    flex-direction: column;
  }

  .quick-add-modal__content .product-details .buy-buttons-block:has(gift-card-recipient-form) form {
    flex-grow: 1;
    display: flex;
    flex-direction: column;
  }

  .quick-add-modal__content .product-details .buy-buttons-block:has(gift-card-recipient-form)::before {
    display: none;
  }

  .quick-add-modal__content .product-details .buy-buttons-block__bar {
    display: block;
    position: sticky;
    bottom: 0;
    margin-top: auto;
    padding-block: var(--gap-md) var(--padding-3xl);
    background-color: var(--color-background);
    z-index: var(--layer-raised);

    &::before {
      --quick-add-modal-mask-end-progressive-enhanced: 0px;

      position: absolute;
      content: '';
      display: block;
      inset: auto 0 100% 0;
      pointer-events: none;
      height: min(var(--gap-2xl), var(--gap));
      background-color: inherit;
      mask-image: linear-gradient(
        to top,
        #000 0%,
        #000 calc(var(--gap-2xs)),
        transparent calc(100% - var(--quick-add-modal-mask-end-progressive-enhanced)),
        transparent
      );
    }
  }

  @supports (animation-timeline: scroll(self)) {
    .quick-add-modal__content .product-details :is(.buy-buttons-block)::before,
    .quick-add-modal__content .product-details .buy-buttons-block__bar::before {
      --mask-if-scroll: var(--can-scroll) var(--quick-add-modal-mask-end);
      --mask-if-no-scroll: 48px;
      --quick-add-modal-mask-end-progressive-enhanced: var(--mask-if-scroll, var(--mask-if-no-scroll));
      height: calc(var(--gap-2xs) + 48px);
    }
  }

  .quick-add-modal__content .product-details .variant-picker {
    flex: 0 0 auto;

    padding-block: min(var(--gap-2xl), var(--gap));
    margin-block-end: calc(var(--focus-outline-offset) + var(--focus-outline-width));
  }

  .quick-add-modal__content .variant-option--swatches {
    padding-inline-start: var(--padding-2xs);
  }

  .quick-add-modal__content .variant-option--swatches legend {
    margin-inline-start: calc(-1 * var(--padding-2xs));
  }

  .quick-add-modal__content:not(:has(.product-information__media)) .product-details {
    grid-column: 1 / -1;
  }

  .quick-add-modal__content .view-product-title {
    display: flex;
    padding-block: 0;
    margin-block-end: 12px;

    /* Prevent overlap between title and close button */
    padding-inline-end: calc(var(--padding-2xl) + calc(var(--minimum-touch-target) / 2));
  }

  .quick-add-modal__content .view-product-title a {
    color: inherit;
    text-decoration: none;
    text-align: left;
    font-size: var(--font-size--2xl);
    font-weight: 600;
    line-height: 1.2;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
    text-overflow: ellipsis;
    transition: color 0.2s var(--animation-easing);
  }

  .quick-add-modal__content .product-details product-price {
    --text-align: left;
  }

  .quick-add-modal__content .product-details product-price.text-block--align-center {
    margin-inline: 0;
  }

  .quick-add-modal__content .product-details product-price.text-center {
    --text-align: left;
  }

  .quick-add-modal__content .product-details product-price > * {
    text-align: left;
  }

  .quick-add-modal__content
    .product-details
    *:not(
      .group-block,
      .group-block-content,
      .buy-buttons-block,
      .buy-buttons-block *,
      .view-product-title,
      .view-product-title *,
      variant-picker,
      variant-picker *,
      product-price,
      product-price *,
      product-inventory,
      product-inventory *,
      .view-more-details__wrapper,
      .view-more-details__wrapper *
    ) {
    @media screen and (min-width: 750px) {
      /* stylelint-disable-next-line declaration-no-important */
      display: none !important;
    }
  }

  .quick-add-modal__content
    .group-block:not(
      :has(
          .buy-buttons-block,
          .buy-buttons-block *,
          .view-product-title,
          .view-product-title *,
          variant-picker,
          variant-picker *,
          product-price,
          product-price *,
          product-inventory,
          product-inventory *,
          .view-more-details__wrapper,
          .view-more-details__wrapper *
        ),
      .buy-buttons-block
    ) {
    display: none;
  }

  @media screen and (min-width: 750px) {
    .quick-add-modal__content .group-block-content {
      gap: 0;
    }

    .quick-add-modal__content .media-gallery__grid {
      gap: min(var(--gap-2xs), var(--image-gap));
      border-radius: var(--style-border-radius-popover, 0);
    }

    .quick-add-modal__content .media-gallery--grid .product-media img {
      border-radius: 0;
    }
  }

  .quick-add-modal__content .product-details > .group-block {
    padding-block: var(--padding-3xl) 0;
  }

  .quick-add-modal__content :where(.product-details > .group-block > .group-block-content > *) {
    padding-inline: var(--padding-3xl);
  }

  .quick-add-modal__content slideshow-slide:not([aria-hidden='false']) {
    content-visibility: auto;
  }

  .quick-add-modal__content .product-information__media {
    width: 100%;
    grid-column: 1 / span 1;
    grid-row: 1;
    position: relative;
    top: 0;
    animation: fadeIn 0.4s var(--animation-timing-fade-in) both;

    @media screen and (min-width: 750px) {
      position: sticky;
      grid-column: 1 / 4;
      width: var(--quick-add-modal-gallery-width);
      overflow-y: auto;
      -ms-overflow-style: none;
      scrollbar-width: none;
    }

    &::-webkit-scrollbar {
      display: none;
    }
  }

  .quick-add-modal__content .product-information__media media-gallery {
    pointer-events: none;

    @media screen and (min-width: 750px) {
      position: absolute;
      inset: 0;
    }
  }

  .quick-add-modal media-gallery {
    padding: 0;
  }

  .quick-add-modal__content .product-information__media slideshow-arrows {
    display: none;
  }

  .quick-add-modal__content .product-information__media slideshow-container {
    display: block;
  }

  .quick-add-modal__content .product-information__media slideshow-slides {
    display: flex;
    flex-direction: column;
    gap: var(--gap-2xs);
    overflow: visible;
    scroll-snap-type: none;
  }

  .quick-add-modal__content .product-information__media slideshow-slide {
    width: 100%;
    flex: none;
    scroll-snap-align: unset;
    position: relative;
    transform: none;
    opacity: 1;
    visibility: visible;
    transition: opacity 0.3s var(--animation-easing);
  }

  .quick-add-modal__content .product-information__media slideshow-slide[aria-hidden='true'] {
    @media screen and (max-width: 749px) {
      display: none;
    }
  }

  .quick-add-modal__content .product-information__media slideshow-slide:nth-child(1) {
    animation: fadeSlideIn 0.3s var(--animation-timing-fade-in) both;
  }

  .quick-add-modal__content .product-information__media slideshow-slide:nth-child(2) {
    animation: fadeSlideIn 0.3s var(--animation-timing-fade-in) both;
    animation-delay: 0.05s;
  }

  .quick-add-modal__content .product-information__media slideshow-slide:nth-child(3) {
    animation: fadeSlideIn 0.3s var(--animation-timing-fade-in) both;
    animation-delay: 0.1s;
  }

  .quick-add-modal__content .product-information__media :is(slideshow-controls, slideshow-controls[thumbnails]) {
    display: none;
  }

  .quick-add-modal__content .sticky-content,
  .quick-add-modal__content .sticky-content--desktop {
    top: 0;
  }

  .quick-add-modal__content .text-block.rte:not(product-price),
  .quick-add-modal__content .view-more-details__wrapper {
    display: none;
  }

  @keyframes fadeSlideIn {
    from {
      opacity: 0;
      transform: translateY(10px);
    }

    to {
      opacity: 1;
      transform: translateY(0);
    }
  }
/* END_SNIPPET:quick-add-modal-styles */
/* START_SNIPPET:quick-add-styles (INDEX:248) */
/* Quick Add */
  .quick-add {
    --quick-add-offset: var(--padding-sm);
    --quick-add-right: calc(var(--quick-add-offset) + var(--padding-inline-end));
    --quick-add-bottom: calc(var(--quick-add-offset) + var(--padding-block-end));

    position: absolute;
    inset: 0;
    z-index: var(--layer-raised);
    pointer-events: none;

    @media screen and (min-width: 750px) {
      --quick-add-offset: var(--padding-md);
    }
  }

  .quick-add .variant-option__button-label input[data-option-available='false'] {
    cursor: not-allowed;
  }

  .quick-add[class*='color-scheme-'] {
    background-color: #0000;
  }

  product-card:is(:hover, :focus-within) .quick-add__button {
    opacity: 1;
  }

  .quick-add__button {
    display: var(--quick-add-mobile-display, none);
    align-items: center;
    background: linear-gradient(var(--color-background) 0 100%) padding-box;
    padding: 0;
    border-radius: 50px;
    border: 2px solid hsl(0 0% 0% / 0.15);
    height: var(--button-size-md);
    cursor: pointer;
    opacity: var(--quick-add-mobile-opacity, 0);
    overflow: hidden;
    color: var(--color-foreground);
    pointer-events: all;
    position: absolute;
    right: max(var(--quick-add-right), calc((var(--border-radius) + var(--quick-add-right)) * (1 - cos(45deg))));
    bottom: max(var(--quick-add-bottom), calc((var(--border-radius) + var(--quick-add-bottom)) * (1 - cos(45deg))));
    backdrop-filter: blur(20px) saturate(180%);

    &:hover {
      scale: 1.03;

      /* Hover stabilizer: extends hit area to maintain hover state */
      &::before {
        content: '';
        position: absolute;
        inset: -10px;
        z-index: -1;
      }
    }

    &:active {
      scale: 0.99;
    }

    .quick-add[stay-visible] & {
      display: grid;
    }

    @media screen and (min-width: 750px) {
      display: var(--quick-add-display, flex);
      opacity: 0;
    }
  }

  .quick-add__button.add-to-cart-button {
    height: var(--button-size-md);
  }

  .quick-add__button .add-to-cart-text {
    background: var(--color-background);
    overflow: hidden;
    border-radius: 50px;
    height: 100%;
    gap: 0;
  }

  .quick-add__button .svg-wrapper .checkmark-burst {
    width: 22px;
    height: 22px;
  }

  .quick-add__button .add-to-cart-icon {
    /* account for border width */
    height: 100%;
    width: calc(var(--button-size-md) - 4px);
  }

  .quick-add__button .add-to-cart-text__content {
    display: grid;
    grid-template-columns: 0fr;

    & > span {
      min-width: 0;

      span {
        padding-right: var(--padding-sm);
        opacity: 0;
        display: inline-block;
        filter: blur(2px);
        translate: 0.5ch 0;
      }
    }
  }

  .quick-add__button[data-added='true'] .add-to-cart-text {
    animation-name: atc-fade-out;
  }

  .quick-add__button[data-added='true'] .add-to-cart-text--added {
    translate: 0 0;
    animation-name: atc-fade-in;
  }

  .quick-add__product-form-component {
    height: 100%;
  }

  .quick-add__product-form-component .shopify-product-form {
    display: flex;
    justify-content: flex-end;
    align-items: flex-end;
    container-type: inline-size;
    height: 100%;
  }

  .quick-add-modal .product-media {
    width: 100%;
    height: 100%;
  }

  .quick-add-modal deferred-media {
    display: none;
  }

  .quick-add-modal .media-gallery--carousel slideshow-component {
    --cursor: default;
  }

  .quick-add__button:is(:hover, :focus-visible) {
    .add-to-cart-text__content {
      grid-template-columns: 1fr;

      span span {
        opacity: 1;
        translate: 0 0;
        filter: blur(0);
      }
    }
  }

  @media (prefers-reduced-motion: reduce) {
    .quick-add__button .add-to-cart-text__content {
      grid-template-columns: 1fr;

      span span {
        opacity: 1;
        translate: 0 0;
        filter: blur(0);
      }
    }
  }

  @media (prefers-reduced-motion: no-preference) {
    .quick-add__button {
      transition-property: scale, translate, opacity;
      transition-duration: var(--animation-speed);
      transition-timing-function: var(--ease-out-cubic);
    }

    .quick-add__button:is(:hover, :focus-visible) {
      .add-to-cart-text__content,
      .add-to-cart-text__content span span {
        transition-delay: var(--animation-speed);
      }
    }

    .quick-add__button .add-to-cart-text__content {
      transition-property: grid-template-columns;
      transition-duration: var(--animation-speed);
      transition-timing-function: var(--ease-out-cubic);

      span span {
        transition-property: opacity, filter, translate;
        transition-duration: var(--animation-speed-slow);
        transition-timing-function: var(--ease-out-quad);
      }
    }
  }
/* END_SNIPPET:quick-add-styles */
/* START_SNIPPET:resource-card (INDEX:250) */
.resource-card {
    --resource-card-secondary-image-opacity: 0;
    --resource-card-primary-image-opacity: calc(1 - var(--resource-card-secondary-image-opacity));

    display: flex;
    flex-direction: column;
    row-gap: var(--padding-xs);
    position: relative;
    text-decoration: none;
    height: 100%;
    opacity: 0;
    animation: fadeIn var(--animation-speed-medium) var(--animation-timing-fade-in) forwards;
  }

  .resource-card__link {
    position: absolute;
    inset: 0;
    z-index: 1;
  }

  .resource-card__content {
    display: flex;
    flex-direction: column;
    color: var(--color-foreground);
    gap: var(--padding-3xs);

    .price {
      font-weight: 500;
    }

    .volume-pricing-note {
      display: block;
      margin-top: var(--padding-3xs);
      font-family: var(--font-body--family);
      font-weight: normal;
      font-size: min(0.85em, var(--font-paragraph--size));
      line-height: normal;
      letter-spacing: normal;
      text-transform: none;
      color: rgb(var(--color-foreground-rgb) / var(--opacity-subdued-text));
    }
  }

  .resource-card[data-resource-type='article'] .resource-card__content,
  .resource-card[data-resource-type='page'] .resource-card__content {
    gap: var(--padding-xs);
  }

  .resource-card__image {
    aspect-ratio: var(--resource-card-aspect-ratio, auto);
    object-fit: contain;
    border-radius: var(--resource-card-corner-radius);
    opacity: var(--resource-card-primary-image-opacity);
  }

  .resource-card__image--secondary {
    position: absolute;
    top: 0;
    opacity: var(--resource-card-secondary-image-opacity);
    border-radius: var(--resource-card-corner-radius);
    object-fit: cover;
  }

  .resource-card__media:empty {
    display: none;
  }

  .resource-card__image-placeholder {
    padding: var(--padding-sm);
    font-size: var(--font-size--lg);
    line-height: var(--line-height--display-loose);
    word-break: break-word;
    background-color: rgb(var(--color-foreground-rgb) / var(--opacity-5));
    aspect-ratio: var(--resource-card-aspect-ratio, auto);
    border-radius: var(--resource-card-corner-radius);
    color: var(--color-foreground);
  }

  .resource-card__title {
    margin-block: 0;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
    line-height: 1.3;
    word-break: break-word;
    overflow-wrap: break-word;
  }

  .resource-card__title.paragraph {
    line-height: 1.3;
  }

  .resource-card--overlay {
    height: 100%;

    &::before {
      content: '';
      position: absolute;
      inset: 50% 0 0;
      background: var(--gradient-image-overlay);
      border-radius: var(--resource-card-corner-radius);
      pointer-events: none;
      z-index: var(--layer-flat);
    }
  }

  .resource-card--overlay .resource-card__image {
    height: 100%;
  }

  .resource-card--overlay .resource-card__content {
    position: absolute;
    inset: auto 0 0;
    padding: var(--padding-lg) var(--padding-lg) var(--padding-sm);
    z-index: var(--layer-raised);
  }

  .resource-card--overlay .resource-card__title {
    color: var(--color-white);
  }

  /* Collection images */
  .resource-card__image-wrapper {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: var(--gap-2xs);
  }

  .resource-card__collection-image {
    aspect-ratio: 1 / 1;
    object-fit: cover;
    border-radius: calc(var(--card-corner-radius) - (var(--padding-xs) / 2));
  }

  .resource-card__subtext {
    color: rgb(var(--color-foreground-rgb) / var(--opacity-subdued-text));
    margin-block-start: 0;
  }

  .resource-card__subtext.paragraph {
    font-size: var(--font-size--body-sm);
    line-height: var(--line-height--body-tight);
    color: rgb(var(--color-foreground-rgb) / var(--opacity-subdued-text));
  }

  .resource-card:has(.resource-card__image--secondary) {
    &:hover,
    &:focus {
      --resource-card-secondary-image-opacity: 1;
    }
  }
/* END_SNIPPET:resource-card */
/* START_SNIPPET:search-modal (INDEX:255) */
/* Search modal style */
  .search-modal {
    --search-border-radius: var(--style-border-radius-popover);
    --search-border-width: var(--style-border-width);
  }

  .search-modal__content {
    /* Approx set the top so when the content is at max height, the modal is centered */
    --modal-top-margin: calc(50dvh - var(--modal-max-height) / 2 - 2rem);
    --modal-width: 66dvw;

    padding: 0;
    border: var(--style-border-popover);

    @media screen and (min-width: 750px) {
      width: var(--modal-width);
      margin-block-start: var(--modal-top-margin);
      overflow: hidden;
    }
  }

  /* Hide the default dialog backdrop on small screens */
  @media screen and (max-width: 749px) {
    .search-modal__content::backdrop {
      display: none;
    }
  }

  .dialog-modal[open].search-modal__content {
    transform-origin: bottom center;
    animation: search-element-slide-in-bottom 300ms var(--ease-out-quad) forwards;
    border-radius: var(--search-border-radius);
    box-shadow: var(--shadow-popover);

    @media screen and (max-width: 749px) {
      border-radius: 0;
    }
  }

  .dialog-modal.search-modal__content.dialog-closing {
    animation: search-element-slide-out-bottom 200ms var(--ease-out-quad) forwards;
  }

  .search-modal__content[open] {
    display: flex;
  }

  .search-modal__content :is(.predictive-search-dropdown, .predictive-search-form__content-wrapper) {
    position: relative;
  }

  .dialog-modal
    .predictive-search-form__header:has(
      .predictive-search__reset-button:not(.predictive-search__reset-button[hidden])
    )::before {
    content: '';
    position: absolute;
    right: calc(var(--padding-sm) + var(--minimum-touch-target));
    top: 0;
    bottom: 0;
    width: var(--border-width-sm);
    background-color: var(--color-border);
  }

  .dialog-modal
    .predictive-search-form__header:has(.predictive-search__reset-button:not(.predictive-search__reset-button[hidden]))
    > .predictive-search__close-modal-button {
    &::before {
      content: none;
    }
  }

  @media screen and (min-width: 750px) {
    .dialog-modal
      .predictive-search-form__header:has(
        .predictive-search__reset-button:not(.predictive-search__reset-button[hidden])
      )::before {
      right: calc(var(--padding-2xl) * 2);
    }
  }

  predictive-search-component {
    --resource-card-corner-radius: var(--product-corner-radius);

    display: flex;
    width: 100%;
    position: relative;
    margin-inline: auto;
    align-items: center;
    background-color: var(--color-background);
    z-index: var(--layer-heightened);
  }

  .predictive-search-form__footer {
    display: none;
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;

    @media screen and (min-width: 750px) {
      --to-top-gradient-background: linear-gradient(
        to top,
        rgb(var(--color-background-rgb) / var(--opacity-90)),
        rgb(var(--color-background-rgb) / var(--opacity-80)),
        rgb(var(--color-background-rgb) / var(--opacity-40)),
        transparent
      );

      padding-block: var(--padding-xs) var(--padding-lg);
      background-image: var(--to-top-gradient-background);
    }
  }

  predictive-search-component:has([data-search-results]):not(:has(.predictive-search-results__no-results))
    .predictive-search-form__footer {
    display: block;
  }

  .predictive-search-form {
    position: relative;
    width: 100%;
    align-self: flex-start;
  }

  .predictive-search-form__content {
    max-height: 50dvh;
    overflow-y: auto;
    background-color: var(--color-background);

    /* Firefox */
    scrollbar-width: none;

    /* Webkit browsers */
    &::-webkit-scrollbar {
      display: none;
    }
  }

  .predictive-search-form__content-wrapper {
    position: absolute;
    top: 100%;
    width: 100%;
    left: 0;
    z-index: var(--layer-raised);
    display: flex;
    flex-direction: column;
    border-radius: 0 0 var(--search-border-radius) var(--search-border-radius);
    transition: box-shadow var(--animation-speed) var(--animation-easing);
    transform: translateZ(0);
    will-change: transform, opacity;
    overflow: hidden;

    @media screen and (max-width: 749px) {
      border-radius: 0;
    }

    @media screen and (min-width: 750px) {
      max-height: var(--modal-max-height);
    }
  }

  /* Add new rule to apply bottom padding only when search button exists */
  .predictive-search-form__content-wrapper:has([data-search-results]):not(:has(.predictive-search-results__no-results))
    > .predictive-search-form__content {
    padding-block-end: var(--padding-6xl);
  }

  .predictive-search-form__header-inner {
    background: var(--color-background);
    border: var(--search-border-width) solid var(--color-border);
    color: var(--color-foreground);
    border-radius: var(--style-border-radius-popover);
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;

    @media screen and (max-width: 749px) {
      border-radius: var(--style-border-radius-inputs);
      border: none;
    }
  }

  .predictive-search-form__header-inner:focus-within {
    outline-offset: var(--focus-outline-offset);

    @media screen and (min-width: 750px) {
      outline: var(--focus-outline-width) solid var(--color-primary);
    }
  }

  .predictive-search-form__header {
    display: flex;
    position: sticky;
    top: 0;
    z-index: var(--layer-heightened);
    width: 100%;
    align-items: center;
    background-color: var(--color-input-background);
    border: var(--search-border-width) solid var(--color-border);
    border-radius: var(--style-border-radius-inputs);

    @media screen and (max-width: 749px) {
      padding: var(--padding-2xs) var(--padding-sm);
    }
  }

  .predictive-search-form__header:focus-within,
  .predictive-search-form__header-inner:focus-within,
  .predictive-search-form__header-inner:has(.search-input:is(:focus, :focus-visible)) {
    outline: none;
    box-shadow: none;
    /* stylelint-disable-next-line declaration-no-important */
    border-color: var(--color-border) !important;
  }

  input.search-input {
    border-radius: var(--style-border-radius-inputs);
    padding-block: var(--padding-sm);
    font-size: var(--font-size--md);
    width: 100%;
    color: var(--color-foreground);
    padding-inline: calc(var(--margin-lg) + var(--icon-size-lg)) 0;
    background: transparent;
    text-overflow: ellipsis;
    overflow: hidden;
    outline: none;
    border: 0;
  }

  .search-input::placeholder {
    color: rgb(var(--color-foreground-rgb) / var(--opacity-subdued-text));
  }

  .search-input,
  .search-input:is(:focus, :focus-visible, :focus-within),
  .predictive-search-form__header *:is(:focus, :focus-visible) {
    outline: none;
    box-shadow: none;
  }

  .search-input:hover {
    background-color: transparent;
  }

  .predictive-search__icon {
    position: absolute;
    left: var(--margin-xl);
    top: auto;
    width: var(--icon-size-lg);
    height: var(--icon-size-lg);
    color: rgb(var(--color-foreground-rgb) / var(--opacity-60));

    @media screen and (min-width: 750px) {
      left: var(--margin-md);
    }
  }

  .predictive-search__icon > svg {
    width: var(--icon-size-md);
    height: var(--icon-size-md);
  }

  .predictive-search__reset-button {
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: var(--minimum-touch-target);
    height: var(--minimum-touch-target);
    padding: 0;
    margin-inline-end: var(--margin-md);
    background: transparent;
    color: var(--color-foreground);
    opacity: 0.68;
    transition: opacity var(--animation-speed-medium) var(--animation-timing-fade-out),
      visibility var(--animation-speed-medium) var(--animation-timing-fade-out);

    &:hover {
      color: var(--color-foreground);
    }

    &:active {
      transform: scale(0.9);
      transition: transform 100ms var(--animation-timing-active);
    }

    @media screen and (min-width: 750px) {
      margin-inline-end: var(--margin-2xs);
    }
  }

  .predictive-search__reset-button[hidden] {
    opacity: 0;
    pointer-events: none;
    visibility: hidden;
  }

  .predictive-search__reset-button-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: var(--icon-size-lg);
    height: var(--icon-size-lg);
    transition: background-color var(--animation-speed-medium) ease-in-out,
      transform var(--animation-speed-medium) var(--animation-timing-bounce);
    border-radius: 50%;

    &:hover {
      background-color: rgb(var(--color-primary-hover-rgb) / var(--opacity-8));
    }
  }

  .predictive-search__reset-button:active .predictive-search__reset-button-icon {
    transform: scale(0.85);
    transition-timing-function: var(--animation-timing-active);
    transition-duration: 100ms;
  }

  .predictive-search__reset-button svg {
    width: var(--icon-size-md);
    height: var(--icon-size-md);
  }

  .predictive-search__reset-button-text {
    display: none;
  }

  .predictive-search__search-button {
    margin: auto;
    z-index: var(--layer-raised);
    transition: transform var(--animation-speed-medium) var(--animation-timing-bounce),
      box-shadow var(--animation-speed-medium) var(--animation-timing-hover);
    transform-origin: center;

    &:hover {
      transform: translateY(-2px);
      box-shadow: 0 4px 8px rgb(0 0 0 / var(--opacity-5));
    }

    &:active {
      transform: scale(0.97);
      transition: transform 100ms var(--animation-timing-active);
      box-shadow: none;
    }
  }

  .predictive-search__close-modal-button {
    --button-color: var(--color-foreground);
    --button-background-color: transparent;

    display: flex;
    justify-content: center;
    align-items: center;
    width: var(--minimum-touch-target);
    height: var(--minimum-touch-target);
    margin-inline-start: var(--margin-sm);
    padding: 0;
    box-shadow: none;

    &:active {
      transform: scale(0.8);
      transition: transform 100ms var(--animation-timing-active);
    }

    .svg-wrapper,
    svg {
      width: var(--icon-size-xs);
      height: var(--icon-size-xs);
    }
  }

  .predictive-search__close-modal-button:hover {
    --button-color: var(--color-foreground);
    --button-background-color: transparent;
  }
/* END_SNIPPET:search-modal */
/* START_SNIPPET:sf-header-drawer (INDEX:264) */
/* ========================================
   SF Header Drawer — Mobile Navigation
   ======================================== */

sf-header-drawer {
  position: fixed;
  inset: 0;
  z-index: 100;
  display: flex;
  flex-direction: column;
  background-color: #FFFFFF;
  backdrop-filter: blur(20px);
  transform: translateX(-100%);
  transition: transform 0.35s ease;
  overflow: hidden;
}

sf-header-drawer[data-open="true"] {
  transform: translateX(0);
}

/* --- Drawer header --- */
.sf-drawer__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 16px;
  border-bottom: 1px solid #D4D4D4;
  flex-shrink: 0;
}

.sf-drawer__logo-link {
  display: inline-flex;
  text-decoration: none;
}

.sf-drawer__logo {
  display: block;
  height: 12px;
  width: auto;
}

.sf-drawer__logo-text {
  font-family: var(--font-heading--family);
  font-style: var(--font-heading--style);
  font-weight: var(--font-heading--weight);
  font-size: 1.25rem;
  color: #1F1F1F;
  text-decoration: none;
  white-space: nowrap;
}

.sf-drawer__close {
  font-family: var(--font-body--family);
  font-weight: 400;
  font-size: 13px;
  line-height: 1.2;
  color: #555555;
  text-transform: uppercase;
  background: none;
  border: none;
  cursor: pointer;
  padding: 0;
}

/* --- Drawer body: single flow container --- */
.sf-drawer__body {
  display: flex;
  flex-direction: column;
  gap: 16px;
  padding: 16px;
  flex: 1;
  min-height: 0;
}

@media screen and (max-width: 749px) {
  .sf-drawer__body {  
    gap: 0px;
  }
}
/* --- Two-column nav area (fixed height, no jump on L1 switch) --- */
.sf-drawer__columns {
  display: flex;
  gap: 12px;
  flex: 1;
  max-height: 365px;
  min-height: 0;
  overflow: hidden;
}

/* --- Left column: L1 items --- */
.sf-drawer__nav-primary {
  display: flex;
  flex-direction: column;
  gap: 16px;
  flex: 1 1 0%;
  min-width: 0;
  overflow: hidden;
}

.sf-drawer__l1-item {
  font-family: var(--font-body--family);
  font-weight: 400;
  font-size: 16px;
  line-height: 1.2;
  text-transform: uppercase;
  color: #a1a1a1;
  background: none;
  border: none;
  cursor: pointer;
  padding: 0;
  text-align: left;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  transition: color 0.2s ease;
}

.sf-drawer__l1-item[data-active="true"] {
  color: #4A0E18;
}


/* --- Right column: L3 panels with scroll + gradient fade --- */
.sf-drawer__nav-secondary {
  position: relative;
  flex: 1 1 0%;
  min-width: 0;
  max-height: 60vh;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  padding-bottom: 48px;
  -webkit-mask-image: linear-gradient(to bottom, black calc(100% - 48px), transparent);
  mask-image: linear-gradient(to bottom, black calc(100% - 48px), transparent);
}

.sf-drawer__l3-panel {
  display: flex;
  flex-direction: column;
}

.sf-drawer__l3-panel[aria-hidden="true"] {
  display: none;
}

.sf-drawer__l3-links {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.sf-drawer__l3-link {
  font-family: var(--font-body--family);
  font-weight: 400;
  font-size: 14px;
  line-height: 1.2;
  color: #1F1F1F;
  text-decoration: none;
  transition: opacity 0.2s ease;
}

.sf-drawer__l3-link:hover {
  opacity: 0.7;
}

/* --- Featured links (below separator in L3 panel) --- */
.sf-drawer__featured-divider {
  height: 1px;
  background-color: #F2F2F2;
  margin: 12px 0;
}

.sf-drawer__featured-link {
  font-family: var(--font-body--family);
  font-weight: 400;
  font-size: 13px;
  line-height: 1.2;
  color: #a1a1a1;
  text-decoration: none;
  margin-top: 4px;
  transition: opacity 0.2s ease;
}

.sf-drawer__featured-link:hover {
  opacity: 0.7;
}

/* --- Bottom links (inside body, below columns) --- */
.sf-drawer__bottom-link {
  display: flex;
  align-items: center;
  gap: 8px;
  font-family: var(--font-body--family);
  font-weight: 400;
  font-size: 13px;
  line-height: 1.2;
  color: #1F1F1F;
  text-transform: uppercase;
  text-decoration: none;
}

.sf-drawer__bottom-link--icon {
  font-size: 14px;
}

.sf-drawer__bottom-link svg {
  flex-shrink: 0;
}
/* END_SNIPPET:sf-header-drawer */
/* START_SNIPPET:sf-header-search (INDEX:265) */
/* ========================================
   SF Header Search
   Mobile: full-screen drawer
   Desktop: dropdown below header bar
   ======================================== */

/* --- Mobile: full-screen fixed (default) --- */
sf-header-search {
  position: fixed;
  inset: 0;
  z-index: 100;
  display: flex;
  flex-direction: column;
  background-color: #FFFFFF;
  transform: translateX(-100%);
  visibility: hidden;
  transition: transform 0.35s ease, visibility 0.35s ease;
  overflow: hidden;
}

sf-header-search[data-open="true"] {
  transform: translateX(0);
  visibility: visible;
}

/* --- Desktop: dropdown below header (>= 990px) --- */
@media (min-width: 990px) {
  sf-header-search {
    position: fixed;
    top: var(--sf-search-top, var(--sf-header-height, 77px));
    left: 0;
    right: 0;
    bottom: auto;
    z-index: 9;
    transform: none;
    max-height: 0;
    opacity: 0;
    transition: max-height 0.4s ease, opacity 0.3s ease, visibility 0.3s ease;
    overflow: hidden;
  }

  sf-header-search[data-open="true"] {
    max-height: 85vh;
    opacity: 1;
    visibility: visible;
    overflow-y: auto;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
  }

  sf-header-search.sf-header-search--page-width {
    max-width: var(--narrow-page-width, 1440px);
    margin-inline: auto;
  }

}

/* --- Header: logo + close (mobile only) --- */
.sf-search__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 16px;
  border-bottom: 1px solid #D4D4D4;
  flex-shrink: 0;
}

.sf-search__logo-link {
  display: inline-flex;
  text-decoration: none;
}

.sf-search__logo {
  display: block;
  height: 12px;
  width: auto;
}

.sf-search__logo-text {
  font-family: var(--font-heading--family);
  font-style: var(--font-heading--style);
  font-weight: var(--font-heading--weight);
  font-size: 1.25rem;
  color: #1F1F1F;
  text-decoration: none;
  white-space: nowrap;
}

.sf-search__close {
  font-family: var(--font-body--family);
  font-weight: 400;
  font-size: 11px;
  line-height: 1.2;
  color: #555555;
  text-transform: uppercase;
  background: none;
  border: none;
  cursor: pointer;
  padding: 0;
}

/* --- Search input --- */
.sf-search__input-wrap {
  padding: 12px 16px;
  border-bottom: 1px solid #D4D4D4;
  flex-shrink: 0;
}

.sf-search__form {
  display: flex;
  align-items: center;
  gap: 8px;
}

.sf-search__input {
  flex: 1;
  border: none;
  background: transparent;
  font-family: var(--font-heading--family);
  font-style: var(--font-heading--style);
  font-weight: var(--font-heading--weight);
  font-size: 20px;
  line-height: 1.2;
  color: #1F1F1F;
  padding: 0;
  outline: none;
}

.sf-search__input::placeholder {
  color: #555555;
  opacity: 1;
}

.sf-search__input::-webkit-search-cancel-button,
.sf-search__input::-webkit-search-decoration {
  -webkit-appearance: none;
  appearance: none;
}

.sf-search__reset {
  display: inline-flex;
  align-items: center;
  background: none;
  border: none;
  cursor: pointer;
  padding: 0;
  color: #555555;
}

@media (max-width: 989px) {
  .sf-search__reset {
    display: none;
  }
}

.sf-search__reset:hover {
  opacity: 0.7;
}

/* --- Content: sidebar + results --- */
.sf-search__content {
  display: flex;
  flex-direction: column;
  flex: 1;
  min-height: 0;
  overflow-y: auto;
}

/* --- Sidebar (trending + categories) --- */
.sf-search__sidebar {
  padding: 16px;
  flex-shrink: 0;
}

/* --- Trending searches --- */
.sf-search__trending {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.sf-search__trending-title {
  font-family: var(--font-body--family);
  font-weight: 400;
  font-size: 11px;
  line-height: 1.2;
  text-transform: uppercase;
  color: #310008;
  margin: 0;
}

.sf-search__trending-list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.sf-search__trending-link {
  display: flex;
  align-items: center;
  gap: 12px;
  text-decoration: none;
  transition: opacity 0.2s ease;
}

.sf-search__trending-link:hover {
  opacity: 0.7;
}

.sf-search__trending-thumb {
  display: none;
}

.sf-search__trending-thumb--empty {
  background-color: #FAF8F7;
}

.sf-search__trending-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.sf-search__trending-name {
  flex: 1;
  font-family: var(--font-body--family);
  font-weight: 400;
  font-size: 12px;
  line-height: 1.2;
  color: #1F1F1F;
}

.sf-search__trending-count {
  font-family: var(--font-body--family);
  font-weight: 400;
  font-size: 12px;
  line-height: 1.2;
  color: #D4D4D4;
}

/* --- Categories (mobile only by default) --- */
.sf-search__categories {
  display: flex;
  flex-direction: column;
  gap: 32px;
  margin-top: 32px;
}

.sf-search__categories-title {
  font-family: var(--font-heading--family);
  font-style: var(--font-heading--style);
  font-weight: var(--font-heading--weight);
  font-size: 24px;
  line-height: 1;
  color: #310008;
  margin: 0;
}

.sf-search__categories-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}

.sf-search__category-card {
  position: relative;
  display: flex;
  align-items: flex-end;
  height: 120px;
  padding: 8px;
  border-radius: 4px;
  overflow: hidden;
  text-decoration: none;
  background-color: #F6F6F6;
}

.sf-search__category-card:hover {
  opacity: 0.9;
}

.sf-search__category-img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.sf-search__category-label {
  position: relative;
  z-index: 1;
  font-family: var(--font-body--family);
  font-weight: 400;
  font-size: 11px;
  line-height: 1.2;
  color: #FFFFFF;
  text-transform: uppercase;
}

/* --- Results area (right column) --- */
.sf-search__results {
  display: none;
}

/* --- Featured products --- */
.sf-search__featured {
  display: flex;
  flex-direction: column;
}

.sf-search__featured-header {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  padding: 12px 24px;
}

.sf-search__featured-title {
  font-family: var(--font-heading--family);
  font-style: var(--font-heading--style);
  font-weight: var(--font-heading--weight);
  font-size: 24px;
  line-height: 1;
  color: #310008;
  margin: 0;
}

.sf-search__featured-viewall {
  font-family: var(--font-body--family);
  font-weight: 400;
  font-size: 12px;
  line-height: 1.2;
  color: #1F1F1F;
  text-decoration: none;
  text-transform: uppercase;
}

.sf-search__featured-viewall:hover {
  opacity: 0.7;
}

.sf-search__featured-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
}

.sf-search__featured-item {
  border-top: 1px solid #D4D4D4;
  border-right: 1px solid #D4D4D4;
  border-bottom: 1px solid #D4D4D4;
  padding: 12px;
}

.sf-search__featured-item .resource-card__image {
  object-fit: contain;
  background-color: var(--color-background);
}

.sf-search__featured-item:nth-child(2n) {
  border-right: none;
}

/* --- Predictive results --- */
.sf-search__predictive {
  padding: 0;
}

.sf-search__predictive-header {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  padding: 12px 24px;
}

.sf-search__predictive-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
}


.sf-search__predictive-grid .sf-predictive__item {
  border-top: 1px solid #D4D4D4;
  border-right: 1px solid #D4D4D4;
  border-bottom: 1px solid #D4D4D4;
  padding: 12px;
}

.sf-search__predictive-grid .sf-predictive__item:nth-child(2n) {
  border-right: none;
}

.sf-search__predictive-empty {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 12px;
  padding: 64px 24px;
  text-align: center;
}

.sf-search__empty-title {
  font-family: var(--font-heading--family);
  font-style: var(--font-heading--style);
  font-weight: var(--font-heading--weight);
  font-size: 24px;
  line-height: 1;
  color: #310008;
  margin: 0;
}

.sf-search__empty-suggestion {
  font-family: var(--font-body--family);
  font-weight: 400;
  font-size: 14px;
  line-height: 1.4;
  color: #555555;
  margin: 0;
  max-width: 360px;
}

/* Hide defaults when searching */
sf-header-search[data-searching] .sf-search__featured {
  display: none;
}

sf-header-search[data-searching] .sf-search__predictive {
  display: block;
}

sf-header-search[data-searching] .sf-search__predictive[hidden] {
  display: none;
}

/* Mobile: hide sidebar and show results when searching */
@media (max-width: 989px) {
  sf-header-search[data-searching] .sf-search__sidebar {
    display: none;
  }

  sf-header-search[data-searching] .sf-search__results {
    display: flex;
    flex-direction: column;
    flex: 1;
    min-width: 0;
    overflow-y: auto;
  }
}

/* --- Predictive search grid (from section) --- */
.sf-predictive__grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 0;
}

.sf-predictive__item {
  border-top: 1px solid #D4D4D4;
  border-right: 1px solid #D4D4D4;
  border-bottom: 1px solid #D4D4D4;
  padding: 12px;
}

.sf-predictive__item:nth-child(2n) {
  border-right: none;
}

.sf-predictive__search-for {
  padding: 16px 0;
  text-align: center;
}

.sf-predictive__search-for-btn {
  font-family: var(--font-body--family);
  font-weight: 400;
  font-size: 12px;
  color: #555555;
  background: none;
  border: none;
  cursor: pointer;
  text-decoration: underline;
  text-underline-offset: 4px;
}

.sf-predictive__no-results {
  font-family: var(--font-body--family);
  font-size: 14px;
  color: #555555;
  text-align: center;
  padding: 48px 16px;
}

/* --- Status (SR only) --- */
.sf-search__status {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border-width: 0;
}

/* ========================================
   Desktop (>= 990px)
   ======================================== */
@media (min-width: 990px) {
  .sf-search__header {
    display: none;
  }

  .sf-search__input-wrap {
    padding: 12px 24px;
    border-top: 1px solid #D4D4D4;
  }

  .sf-search__input {
    font-size: 24px;
  }

  .sf-search__content {
    flex-direction: row;
    overflow: hidden;
  }

  .sf-search__sidebar {
    width: 280px;
    flex-shrink: 0;
    border-right: 1px solid #D4D4D4;
    padding: 24px;
    overflow-y: auto;
  }

  .sf-search__trending-title {
    font-size: 12px;
  }

  .sf-search__trending-thumb {
    display: block;
    width: 48px;
    height: 48px;
    flex-shrink: 0;
    overflow: hidden;
  }

  .sf-search__categories {
    display: none;
  }

  .sf-search__sidebar--categories-only {
    display: none;
  }

  .sf-search__results {
    display: flex;
    flex-direction: column;
    flex: 1;
    min-width: 0;
    overflow-y: auto;
  }

  .sf-search__featured-grid {
    grid-template-columns: repeat(4, 1fr);
  }

  .sf-search__featured-item:nth-child(2n) {
    border-right: 1px solid #D4D4D4;
  }

  .sf-search__featured-item:nth-child(4n) {
    border-right: none;
  }

  .sf-search__predictive-grid {
    grid-template-columns: repeat(4, 1fr);
  }

  .sf-predictive__grid {
    grid-template-columns: repeat(4, 1fr);
  }

  .sf-search__predictive-grid .sf-predictive__item:nth-child(2n) {
    border-right: 1px solid #D4D4D4;
  }

  .sf-search__predictive-grid .sf-predictive__item:nth-child(4n) {
    border-right: none;
  }

  .sf-predictive__item:nth-child(2n) {
    border-right: 1px solid #D4D4D4;
  }

  .sf-predictive__item:nth-child(4n) {
    border-right: none;
  }
}

@media (min-width: 990px) and (max-width: 1199px) {
  .sf-search__featured-grid {
    grid-template-columns: repeat(3, 1fr);
  }

  .sf-search__featured-item:nth-child(2n) {
    border-right: 1px solid #D4D4D4;
  }

  .sf-search__featured-item:nth-child(3n) {
    border-right: none;
  }

  .sf-search__featured-item:nth-child(4n) {
    border-right: 1px solid #D4D4D4;
  }

  .sf-predictive__grid {
    grid-template-columns: repeat(3, 1fr);
  }

  .sf-predictive__item:nth-child(2n) {
    border-right: 1px solid #D4D4D4;
  }

  .sf-predictive__item:nth-child(3n) {
    border-right: none;
  }

  .sf-predictive__item:nth-child(4n) {
    border-right: 1px solid #D4D4D4;
  }
}

@media(max-width: 750px) {
  .sf-search__predictive-grid .resource-card__media img {
    object-fit: contain;
  }
}
/* END_SNIPPET:sf-header-search */
/* START_SNIPPET:sf-product-badges (INDEX:267) */
.sf-product-badges {
    display: flex;
    flex-direction: column;
    gap: 4px;
  }
  

  .sf-product-badge {
    display: inline-block;
    padding: var(--fluid-4-4);
    background: rgba(255, 255, 255, 0.8);
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    font-family: var(--font-body--family);
    font-weight: 400;
    font-size: var(--fluid-11-14);
    line-height: 1.3;
    /* Burgundy Deep from palette */
    color: #4a0e18;
  }

  .sf-product-badge--low-stock {
    /* Cherry Editorial — urgency signal */
    color: #8f1e2d;
  }

  .sf-product-badge {
    padding-bottom: 0;
    padding-top: 0;
    line-height: 1;
    font-size: 12px
  }

  .sf-product-badge:first-child {
    padding-top: 4px
  }
/* END_SNIPPET:sf-product-badges */
/* START_SNIPPET:sf-product-media-scroll-thumb (INDEX:269) */
.sf-pv__thumb {
    width: var(--fluid-64-64);
    aspect-ratio: 64 / 81;
    border-radius: 2px;
    overflow: hidden;
    cursor: pointer;
    flex-shrink: 0;
    background-color: var(--color-background);
    pointer-events: auto;
  }

  .sf-pv__thumb-media {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
  }
/* END_SNIPPET:sf-product-media-scroll-thumb */
/* START_SNIPPET:skip-to-content-link (INDEX:274) */
.skip-to-content-link {
    position: absolute;
    left: -99999px;
  }

  .skip-to-content-link:focus {
    z-index: var(--layer-temporary);
    overflow: auto;
    width: auto;
    height: auto;
    padding: var(--padding-lg) var(--padding-4xl);
    left: var(--margin-lg);
    top: var(--margin-lg);
    background-color: var(--color-background);
    box-shadow: 0 0 0 var(--focus-outline-offset) var(--color-background);
  }
/* END_SNIPPET:skip-to-content-link */
/* START_SNIPPET:slideshow-arrow (INDEX:276) */
.slideshow-control--large {
    .icon-caret {
      --icon-stroke-width: 1px;
    }

    .icon-caret {
      --icon-stroke-width: 1px;
    }

    .svg-wrapper,
    svg {
      width: var(--slideshow-controls-icon);
      height: var(--slideshow-controls-icon);
    }
  }

  /* Slideshow control shape styles */
  .slideshow-control.slideshow-control--shape-square,
  .slideshow-control.slideshow-control--shape-circle {
    display: flex;
    align-items: center;
    justify-content: center;
    aspect-ratio: 1 / 1;
    background-color: var(--color-primary-button-background);
    color: var(--color-primary-button-text);
  }

  .slideshow-control.slideshow-control--shape-circle {
    border-radius: 50%;
  }

  .slideshow-control.slideshow-control--shape-square {
    border-radius: 0;
  }

  .slideshow-control .icon-caret {
    rotate: -90deg;
  }
/* END_SNIPPET:slideshow-arrow */
/* START_SNIPPET:slideshow-arrows (INDEX:277) */
slideshow-arrows {
    --cursor-previous: w-resize;
    --cursor-next: e-resize;

    position: absolute;
    inset: 0;
    display: flex;
    z-index: var(--layer-heightened);
    pointer-events: none;
    mix-blend-mode: difference;
    align-items: flex-end;

    &[position='left'] {
      justify-content: flex-start;
      padding-inline: var(--padding-xs);
    }

    &[position='right'] {
      justify-content: flex-end;
      padding-inline: var(--padding-xs);
    }

    &[position='center'] {
      justify-content: space-between;
      align-items: center;
    }
  }

  slideshow-arrows:has(.slideshow-control--shape-square),
  slideshow-arrows:has(.slideshow-control--shape-circle) {
    mix-blend-mode: normal;
  }

  slideshow-component[disabled='true'] slideshow-arrows {
    display: none;
  }

  slideshow-arrows .slideshow-control {
    pointer-events: auto;
    opacity: 0;
    min-height: var(--minimum-touch-target);
    min-width: var(--minimum-touch-target);
    padding: 0 var(--padding-xs);
    color: var(--color-white);
  }

  slideshow-arrows .slideshow-control.slideshow-control--style-none {
    display: none;
  }
/* END_SNIPPET:slideshow-arrows */
/* START_SNIPPET:text (INDEX:292) */
:root {
    --text-align-default: left;
  }

  [style*='--horizontal-alignment: center'] .text-block {
    --text-align-default: center;
  }

  [style*='--horizontal-alignment: flex-end'] .text-block {
    --text-align-default: right;
  }

  [style*='--horizontal-alignment: flex-start'] > .text-block {
    --text-align-default: left;
  }

  [style*='--horizontal-alignment: center'] > .text-block {
    --text-align-default: center;
  }

  [style*='--horizontal-alignment: flex-end'] > .text-block {
    --text-align-default: right;
  }

  .text-block {
    width: var(--width);
    max-width: 100%;
    display: flex;
    flex-direction: column;
    align-items: var(--horizontal-alignment);
  }

  .text-block > * {
    width: var(--width);
    max-inline-size: min(100%, var(--max-width, 100%));
    text-align: var(--text-align, var(--text-align-default));
    text-wrap: var(--text-wrap);
  }

  .text-block:not(.text-block--full-width).rte,
  .text-block:not(.text-block--full-width).paragraph {
    /* Safari doesn't support pretty, so fallback to balance */
    text-wrap: balance;
    text-wrap: pretty;
  }

  .text-block:not(.text-block--full-width):is(.h1, .h2, .h3, .h4, .h5, .h6) {
    text-wrap: balance;
  }

  /* Hide underline unless text is using paragraph styles. */
  .text-block:is(.h1, .h2, .h3, .h4, .h5, .h6) a {
    text-decoration-color: transparent;
  }

  .text-block h1,
  .text-block.h1 > * {
    margin-block: var(--font-h1--spacing);
  }

  .text-block h2,
  .text-block.h2 > * {
    margin-block: var(--font-h2--spacing);
  }

  .text-block h3,
  .text-block.h3 > * {
    margin-block: var(--font-h3--spacing);
  }

  .text-block h4,
  .text-block.h4 > * {
    margin-block: var(--font-h4--spacing);
  }

  .text-block h5,
  .text-block.h5 > * {
    margin-block: var(--font-h5--spacing);
  }

  .text-block h6,
  .text-block.h6 > * {
    margin-block: var(--font-h6--spacing);
  }

  .text-block p,
  .text-block.p > * {
    margin-block: var(--font-paragraph--spacing);
  }

  .text-block > *:first-child {
    margin-block-start: 0;
  }

  .text-block > *:last-child {
    margin-block-end: 0;
  }

  .text-block--align-center,
  .text-block--align-center > * {
    margin-inline: auto;
  }

  .text-block--align-right,
  .text-block--align-right > * {
    margin-inline-start: auto;
  }

  .text-block--background {
    background-color: var(--text-background-color);
    border-radius: var(--text-corner-radius);

    /* To avoid text being cropped when using a border radius we add a minimum padding. */
    padding-block-start: max(var(--text-padding), var(--padding-block-start, 0));
    padding-block-end: max(var(--text-padding), var(--padding-block-end, 0));
    padding-inline-start: max(var(--text-padding), var(--padding-inline-start, 0));
    padding-inline-end: max(var(--text-padding), var(--padding-inline-end, 0));
  }

  .custom-color,
  .custom-color > :is(h1, h2, h3, h4, h5, h6, p, *) {
    color: var(--color);
  }
/* END_SNIPPET:text */
/* START_SNIPPET:variant-main-picker (INDEX:301) */
/* Variant picker container styles - unique to main variant picker */
  .variant-picker {
    width: 100%;
  }

  .variant-picker__form {
    width: 100%;
  }

  .variant-picker[data-shopify-visual-preview] {
    min-width: 300px;
    padding-inline-start: max(4px, var(--padding-inline-start));
  }

  /* Dropdown variant option styles */
  .variant-option__select-wrapper {
    display: flex;
    position: relative;
    border: var(--style-border-width-inputs) solid var(--color-border);
    border-radius: var(--style-border-radius-inputs);
    align-items: center;
    margin-top: var(--margin-2xs);
    overflow: clip;
  }

  .variant-option__select-wrapper:has(.swatch) {
    --variant-picker-swatch-width: 20px;
    --variant-picker-swatch-height: 20px;
  }

  .variant-option__select-wrapper:hover {
    border-color: var(--color-variant-hover-border);
  }

  .variant-option__select:focus-visible {
    outline: var(--focus-outline-width) solid currentcolor;
    outline-offset: var(--focus-outline-offset);
  }

  .variant-option__select {
    padding-block: var(--padding-md);
    padding-inline: var(--padding-lg) calc(var(--padding-lg) + var(--icon-size-2xs));
    appearance: none;
    border: 0;
    width: 100%;
    margin: 0;
    cursor: pointer;
  }

  .variant-option__select-wrapper .icon {
    position: absolute;
    right: var(--padding-md);
    top: 50%;
    transform: translateY(-50%);
    width: var(--icon-size-2xs);
    height: var(--icon-size-2xs);
    pointer-events: none;
  }

  .variant-option__select--has-swatch {
    padding-inline-start: calc((2 * var(--padding-sm)) + var(--variant-picker-swatch-width));
  }

  .variant-option__select-wrapper .swatch {
    position: absolute;
    top: 50%;
    left: var(--padding-md);
    transform: translateY(-50%);
  }

  /* Variant picker alignment modifiers */
  .variant-picker--center,
  .variant-picker--center .variant-option {
    text-align: center;
    align-items: center;
    justify-content: center;
    width: 100%;
  }

  .variant-picker--right,
  .variant-picker--right .variant-option {
    text-align: right;
    justify-content: right;
  }

  /* ── Custom "Style" dropdown ──────────────────────────────── */
  .variant-option--custom-dropdown {
    border: 0;
    padding: 0;
    margin: 0;
  }

  .variant-option--custom-dropdown legend {
    font-family: var(--font-body--family);
    font-weight: 500;
    font-size: 12px;
    line-height: 1;
    text-transform: uppercase;
    color: var(--color-foreground);
    margin-bottom: 8px;
  }

  .variant-dropdown {
    position: relative;
  }

  .variant-dropdown__trigger {
    display: flex;
    align-items: center;
    gap: 10px;
    width: 100%;
    padding: 12px 16px;
    border: 1px solid var(--color-border);
    background: var(--color-background);
    cursor: pointer;
    list-style: none;
    font-family: var(--font-body--family);
    font-weight: 500;
    font-size: 13px;
    line-height: 1;
    text-transform: uppercase;
    color: var(--color-foreground);
  }

  .variant-dropdown__trigger::-webkit-details-marker {
    display: none;
  }

  .variant-dropdown__trigger .swatch {
    width: 24px;
    height: 24px;
    flex-shrink: 0;
  }

  .variant-dropdown__trigger-text {
    flex: 1;
  }

  .variant-dropdown__caret {
    flex-shrink: 0;
    width: 10px;
    height: 6px;
    transition: transform 0.2s ease;
  }

  .variant-dropdown[open] .variant-dropdown__caret {
    transform: rotate(180deg);
  }

  .variant-dropdown__list {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    z-index: 10;
    background: var(--color-background);
    border: 1px solid var(--color-border);
    border-top: 0;
    max-height: 280px;
    overflow-y: auto;
  }

  .variant-dropdown__list label:has(input[type=radio]) {
    width: 100%;
  }

  .variant-dropdown__option {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 12px 16px;
    cursor: pointer;
    border-bottom: 1px solid var(--color-border);
    font-family: var(--font-body--family);
    font-weight: 500;
    font-size: 13px;
    line-height: 1;
    text-transform: uppercase;
    color: var(--color-foreground);
    transition: background-color 0.15s ease, color 0.15s ease;
  }

  .variant-dropdown__option:last-child {
    border-bottom: 0;
  }

  .variant-dropdown__option:hover {
    background: rgba(var(--color-foreground-rgb), 0.05);
  }

  /* Selected state — Graphite bg, white text */
  .variant-dropdown__option:has(input:checked) {
    /* Graphite from palette */
    background: #1F1F1F;
    color: #fff;
  }

  .variant-dropdown__option:has(input:checked) .swatch {
    border: 1px solid rgba(255, 255, 255, 0.3);
  }

  /* Unavailable state */
  .variant-dropdown__option.is-unavailable {
    opacity: 0.4;
  }

  /* Hide radio input visually */
  .variant-dropdown__option input[type="radio"] {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
  }

  .variant-dropdown__option-swatch {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .variant-dropdown__option-swatch .swatch {
    width: 24px;
    height: 24px;
  }

  .variant-dropdown__option-text {
    flex: 1;
  }

  /* Checkmark — hidden by default, visible when checked */
  .variant-dropdown__check {
    display: none;
    flex-shrink: 0;
    font-size: 14px;
  }

  .variant-dropdown__option:has(input:checked) .variant-dropdown__check {
    display: block;
  }

  /* ── Zodiac icons via ::before (Unicode text presentation, no emoji bg) */
  .variant-dropdown__trigger::before,
  .variant-dropdown__option::before {
    font-size: 20px;
    line-height: 1;
    flex-shrink: 0;
    width: 28px;
    text-align: center;
    /* Force text rendering — no emoji color/background */
    font-family: 'Segoe UI Symbol', 'Apple Symbols', 'Noto Sans Symbols 2', serif;
    font-variant-emoji: text;
  }

  .variant-dropdown__trigger[data-value-handle="aries-mar-21-apr-19"]::before,
  .variant-dropdown__option[data-value-handle="aries-mar-21-apr-19"]::before { content: "\2648\FE0E"; }

  .variant-dropdown__trigger[data-value-handle="taurus-apr-20-may-20"]::before,
  .variant-dropdown__option[data-value-handle="taurus-apr-20-may-20"]::before { content: "\2649\FE0E"; }

  .variant-dropdown__trigger[data-value-handle="gemini-may-21-jun-20"]::before,
  .variant-dropdown__option[data-value-handle="gemini-may-21-jun-20"]::before { content: "\264A\FE0E"; }

  .variant-dropdown__trigger[data-value-handle="cancer-jun-21-jul-22"]::before,
  .variant-dropdown__option[data-value-handle="cancer-jun-21-jul-22"]::before { content: "\264B\FE0E"; }

  .variant-dropdown__trigger[data-value-handle="leo-jul-23-aug-22"]::before,
  .variant-dropdown__option[data-value-handle="leo-jul-23-aug-22"]::before { content: "\264C\FE0E"; }

  .variant-dropdown__trigger[data-value-handle="virgo-aug-23-sept-22"]::before,
  .variant-dropdown__option[data-value-handle="virgo-aug-23-sept-22"]::before { content: "\264D\FE0E"; }

  .variant-dropdown__trigger[data-value-handle="libra-sept-23-oct-22"]::before,
  .variant-dropdown__option[data-value-handle="libra-sept-23-oct-22"]::before { content: "\264E\FE0E"; }

  .variant-dropdown__trigger[data-value-handle="scorpio-oct-23-nov-21"]::before,
  .variant-dropdown__option[data-value-handle="scorpio-oct-23-nov-21"]::before { content: "\264F\FE0E"; }

  .variant-dropdown__trigger[data-value-handle="sagittarius-nov-22-dec-21"]::before,
  .variant-dropdown__option[data-value-handle="sagittarius-nov-22-dec-21"]::before { content: "\2650\FE0E"; }

  .variant-dropdown__trigger[data-value-handle="capricorn-dec-22-jan-19"]::before,
  .variant-dropdown__option[data-value-handle="capricorn-dec-22-jan-19"]::before { content: "\2651\FE0E"; }

  .variant-dropdown__trigger[data-value-handle="aquarius-jan-20-feb-18"]::before,
  .variant-dropdown__option[data-value-handle="aquarius-jan-20-feb-18"]::before { content: "\2652\FE0E"; }

  .variant-dropdown__trigger[data-value-handle="pisces-feb-19-mar-20"]::before,
  .variant-dropdown__option[data-value-handle="pisces-feb-19-mar-20"]::before { content: "\2653\FE0E"; }
/* END_SNIPPET:variant-main-picker */
