/** Shopify CDN: Minification failed

Line 1556:36 Unexpected "*"

**/
/* Bowsers custom font aliases to prevent Klaviyo font collision */
@font-face {
  font-family: 'BowsersPoppins';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('Poppins-Bold.ttf') format('truetype');
}

@font-face {
  font-family: 'BowsersPoppins';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('Poppins-Bold.ttf') format('truetype');
}

@font-face {
  font-family: 'BowsersPoppinsSemi';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('Poppins-SemiBold.ttf') format('truetype');
}
@media (min-width: 1000px) {
  .rendor-image .product-gallery__carousel {
    display: flex;
    flex-wrap: wrap;
  }
  .product-gallery__media.snap-center {
    width: calc(50% - 30px);
    overflow: hidden;
  }
  .product-gallery__media.snap-center img {
    width: 100%;
    height: auto;
    object-fit: cover;
    object-position: center;
    display: block;
  }  
  /* .rendor-image[data-image-count="3"] .product-gallery__media.snap-center:nth-child(4),
  .rendor-image[data-image-count="5"] .product-gallery__media.snap-center:nth-child(4),
  .rendor-image[data-image-count="6"] .product-gallery__media.snap-center:nth-child(4),
  .rendor-image[data-image-count="6"] .product-gallery__media.snap-center:nth-child(7),
  .rendor-image[data-image-count="7"] .product-gallery__media.snap-center:nth-child(4),
  .rendor-image[data-image-count="7"] .product-gallery__media.snap-center:nth-child(7),
  .rendor-image[data-image-count="7"] .product-gallery__media.snap-center:nth-child(8),
  .rendor-image[data-image-count="8"] .product-gallery__media.snap-center:nth-child(4),
  .rendor-image[data-image-count="8"] .product-gallery__media.snap-center:nth-child(7),
  .rendor-image[data-image-count="9"] .product-gallery__media.snap-center:nth-child(4),
  .rendor-image[data-image-count="9"] .product-gallery__media.snap-center:nth-child(7),
  .rendor-image[data-image-count="9"] .product-gallery__media.snap-center:nth-child(10),
  .rendor-image[data-image-count="10"] .product-gallery__media.snap-center:nth-child(4),
  .rendor-image[data-image-count="10"] .product-gallery__media.snap-center:nth-child(7),
  .rendor-image[data-image-count="10"] .product-gallery__media.snap-center:nth-child(10),
  .rendor-image[data-image-count="10"] .product-gallery__media.snap-center:nth-child(11),
  .rendor-image[data-image-count="11"] .product-gallery__media.snap-center:nth-child(4),
  .rendor-image[data-image-count="11"] .product-gallery__media.snap-center:nth-child(7),
  .rendor-image[data-image-count="11"] .product-gallery__media.snap-center:nth-child(10),
  .rendor-image[data-image-count="12"] .product-gallery__media.snap-center:nth-child(4),
  .rendor-image[data-image-count="12"] .product-gallery__media.snap-center:nth-child(7),
  .rendor-image[data-image-count="12"] .product-gallery__media.snap-center:nth-child(10),
  .rendor-image[data-image-count="12"] .product-gallery__media.snap-center:nth-child(13),
  .rendor-image[data-image-count="13"] .product-gallery__media.snap-center:nth-child(4),
  .rendor-image[data-image-count="13"] .product-gallery__media.snap-center:nth-child(7),
  .rendor-image[data-image-count="13"] .product-gallery__media.snap-center:nth-child(10),
  .rendor-image[data-image-count="13"] .product-gallery__media.snap-center:nth-child(13),
  .rendor-image[data-image-count="13"] .product-gallery__media.snap-center:nth-child(14),
  .rendor-image[data-image-count="14"] .product-gallery__media.snap-center:nth-child(4),
  .rendor-image[data-image-count="14"] .product-gallery__media.snap-center:nth-child(7),
  .rendor-image[data-image-count="14"] .product-gallery__media.snap-center:nth-child(10),
  .rendor-image[data-image-count="14"] .product-gallery__media.snap-center:nth-child(13),
  .rendor-image[data-image-count="15"] .product-gallery__media.snap-center:nth-child(4),
  .rendor-image[data-image-count="15"] .product-gallery__media.snap-center:nth-child(7),
  .rendor-image[data-image-count="15"] .product-gallery__media.snap-center:nth-child(10),
  .rendor-image[data-image-count="15"] .product-gallery__media.snap-center:nth-child(13),
  .rendor-image[data-image-count="15"] .product-gallery__media.snap-center:nth-child(16),
  .rendor-image[data-image-count="16"] .product-gallery__media.snap-center:nth-child(4),
  .rendor-image[data-image-count="16"] .product-gallery__media.snap-center:nth-child(7),
  .rendor-image[data-image-count="16"] .product-gallery__media.snap-center:nth-child(10),
  .rendor-image[data-image-count="16"] .product-gallery__media.snap-center:nth-child(13),
  .rendor-image[data-image-count="16"] .product-gallery__media.snap-center:nth-child(16),
  .rendor-image[data-image-count="17"] .product-gallery__media.snap-center:nth-child(4),
  .rendor-image[data-image-count="17"] .product-gallery__media.snap-center:nth-child(7),
  .rendor-image[data-image-count="17"] .product-gallery__media.snap-center:nth-child(10),
  .rendor-image[data-image-count="17"] .product-gallery__media.snap-center:nth-child(13),
  .rendor-image[data-image-count="17"] .product-gallery__media.snap-center:nth-child(16),
  .rendor-image[data-image-count="18"] .product-gallery__media.snap-center:nth-child(4),
  .rendor-image[data-image-count="18"] .product-gallery__media.snap-center:nth-child(7),
  .rendor-image[data-image-count="18"] .product-gallery__media.snap-center:nth-child(10),
  .rendor-image[data-image-count="18"] .product-gallery__media.snap-center:nth-child(13),
  .rendor-image[data-image-count="18"] .product-gallery__media.snap-center:nth-child(16),
  .rendor-image[data-image-count="19"] .product-gallery__media.snap-center:nth-child(4),
  .rendor-image[data-image-count="19"] .product-gallery__media.snap-center:nth-child(7),
  .rendor-image[data-image-count="19"] .product-gallery__media.snap-center:nth-child(10),
  .rendor-image[data-image-count="19"] .product-gallery__media.snap-center:nth-child(13),
  .rendor-image[data-image-count="19"] .product-gallery__media.snap-center:nth-child(16),
  .rendor-image[data-image-count="19"] .product-gallery__media.snap-center:nth-child(19),
  .rendor-image[data-image-count="20"] .product-gallery__media.snap-center:nth-child(4),
  .rendor-image[data-image-count="20"] .product-gallery__media.snap-center:nth-child(7),
  .rendor-image[data-image-count="20"] .product-gallery__media.snap-center:nth-child(10),
  .rendor-image[data-image-count="20"] .product-gallery__media.snap-center:nth-child(13),
  .rendor-image[data-image-count="20"] .product-gallery__media.snap-center:nth-child(16),
  .rendor-image[data-image-count="20"] .product-gallery__media.snap-center:nth-child(19){
    width: calc(100% - 30px)!important;
    max-width: 100%!important;
    aspect-ratio: 16/9;
  }  */
  .rendor-image .product-gallery[product-image-count="1"] .product-gallery__media:nth-child(1 of .gallery-image),
  .rendor-image .product-gallery[product-image-count="3"] .product-gallery__media:nth-child(1 of .gallery-image),
  .rendor-image .product-gallery[product-image-count="4"] .product-gallery__media:nth-child(1 of .gallery-image),
  .rendor-image .product-gallery[product-image-count="4"] .product-gallery__media:nth-child(4 of .gallery-image),
  .rendor-image .product-gallery[product-image-count="5"] .product-gallery__media:nth-child(1 of .gallery-image),
  .rendor-image .product-gallery[product-image-count="5"] .product-gallery__media:nth-child(4 of .gallery-image),
  .rendor-image .product-gallery[product-image-count="5"] .product-gallery__media:nth-child(5 of .gallery-image),
  .rendor-image .product-gallery[product-image-count="6"] .product-gallery__media:nth-child(1 of .gallery-image),
  .rendor-image .product-gallery[product-image-count="6"] .product-gallery__media:nth-child(4 of .gallery-image),
  .rendor-image .product-gallery[product-image-count="7"] .product-gallery__media:nth-child(1 of .gallery-image),
  .rendor-image .product-gallery[product-image-count="7"] .product-gallery__media:nth-child(4 of .gallery-image),
  .rendor-image .product-gallery[product-image-count="7"] .product-gallery__media:nth-child(7 of .gallery-image),
  .rendor-image .product-gallery[product-image-count="8"] .product-gallery__media:nth-child(1 of .gallery-image),
  .rendor-image .product-gallery[product-image-count="8"] .product-gallery__media:nth-child(4 of .gallery-image),
  .rendor-image .product-gallery[product-image-count="8"] .product-gallery__media:nth-child(7 of .gallery-image),
  .rendor-image .product-gallery[product-image-count="8"] .product-gallery__media:nth-child(8 of .gallery-image),
  .rendor-image .product-gallery[product-image-count="9"] .product-gallery__media:nth-child(1 of .gallery-image),
  .rendor-image .product-gallery[product-image-count="9"] .product-gallery__media:nth-child(4 of .gallery-image),
  .rendor-image .product-gallery[product-image-count="9"] .product-gallery__media:nth-child(7 of .gallery-image),
  .rendor-image .product-gallery[product-image-count="10"] .product-gallery__media:nth-child(1 of .gallery-image),
  .rendor-image .product-gallery[product-image-count="10"] .product-gallery__media:nth-child(4 of .gallery-image),
  .rendor-image .product-gallery[product-image-count="10"] .product-gallery__media:nth-child(7 of .gallery-image),
  .rendor-image .product-gallery[product-image-count="10"] .product-gallery__media:nth-child(10 of .gallery-image),
  .rendor-image .product-gallery[product-image-count="11"] .product-gallery__media:nth-child(1 of .gallery-image),
  .rendor-image .product-gallery[product-image-count="11"] .product-gallery__media:nth-child(4 of .gallery-image),
  .rendor-image .product-gallery[product-image-count="11"] .product-gallery__media:nth-child(7 of .gallery-image),
  .rendor-image .product-gallery[product-image-count="11"] .product-gallery__media:nth-child(10 of .gallery-image),
  .rendor-image .product-gallery[product-image-count="11"] .product-gallery__media:nth-child(11 of .gallery-image),
  .rendor-image .product-gallery[product-image-count="12"] .product-gallery__media:nth-child(1 of .gallery-image),
  .rendor-image .product-gallery[product-image-count="12"] .product-gallery__media:nth-child(4 of .gallery-image),
  .rendor-image .product-gallery[product-image-count="12"] .product-gallery__media:nth-child(7 of .gallery-image),
  .rendor-image .product-gallery[product-image-count="12"] .product-gallery__media:nth-child(10 of .gallery-image),
  .rendor-image .product-gallery[product-image-count="13"] .product-gallery__media:nth-child(1 of .gallery-image),
  .rendor-image .product-gallery[product-image-count="13"] .product-gallery__media:nth-child(4 of .gallery-image),
  .rendor-image .product-gallery[product-image-count="13"] .product-gallery__media:nth-child(7 of .gallery-image),
  .rendor-image .product-gallery[product-image-count="13"] .product-gallery__media:nth-child(10 of .gallery-image),
  .rendor-image .product-gallery[product-image-count="13"] .product-gallery__media:nth-child(13 of .gallery-image),
  .rendor-image .product-gallery[product-image-count="14"] .product-gallery__media:nth-child(1 of .gallery-image),
  .rendor-image .product-gallery[product-image-count="14"] .product-gallery__media:nth-child(4 of .gallery-image),
  .rendor-image .product-gallery[product-image-count="14"] .product-gallery__media:nth-child(7 of .gallery-image),
  .rendor-image .product-gallery[product-image-count="14"] .product-gallery__media:nth-child(10 of .gallery-image),
  .rendor-image .product-gallery[product-image-count="14"] .product-gallery__media:nth-child(13 of .gallery-image),
  .rendor-image .product-gallery[product-image-count="14"] .product-gallery__media:nth-child(14 of .gallery-image),
  .rendor-image .product-gallery[product-image-count="15"] .product-gallery__media:nth-child(1 of .gallery-image),
  .rendor-image .product-gallery[product-image-count="15"] .product-gallery__media:nth-child(4 of .gallery-image),
  .rendor-image .product-gallery[product-image-count="15"] .product-gallery__media:nth-child(7 of .gallery-image),
  .rendor-image .product-gallery[product-image-count="15"] .product-gallery__media:nth-child(10 of .gallery-image),
  .rendor-image .product-gallery[product-image-count="15"] .product-gallery__media:nth-child(13 of .gallery-image),
  .rendor-image .product-gallery[product-image-count="16"] .product-gallery__media:nth-child(1 of .gallery-image),
  .rendor-image .product-gallery[product-image-count="16"] .product-gallery__media:nth-child(4 of .gallery-image),
  .rendor-image .product-gallery[product-image-count="16"] .product-gallery__media:nth-child(7 of .gallery-image),
  .rendor-image .product-gallery[product-image-count="16"] .product-gallery__media:nth-child(10 of .gallery-image),
  .rendor-image .product-gallery[product-image-count="16"] .product-gallery__media:nth-child(13 of .gallery-image),
  .rendor-image .product-gallery[product-image-count="16"] .product-gallery__media:nth-child(16 of .gallery-image),
  .rendor-image .product-gallery[product-image-count="17"] .product-gallery__media:nth-child(1 of .gallery-image),
  .rendor-image .product-gallery[product-image-count="17"] .product-gallery__media:nth-child(4 of .gallery-image),
  .rendor-image .product-gallery[product-image-count="17"] .product-gallery__media:nth-child(7 of .gallery-image),
  .rendor-image .product-gallery[product-image-count="17"] .product-gallery__media:nth-child(10 of .gallery-image),
  .rendor-image .product-gallery[product-image-count="17"] .product-gallery__media:nth-child(13 of .gallery-image),
  .rendor-image .product-gallery[product-image-count="17"] .product-gallery__media:nth-child(16 of .gallery-image),
  .rendor-image .product-gallery[product-image-count="17"] .product-gallery__media:nth-child(17 of .gallery-image),
  .rendor-image .product-gallery[product-image-count="18"] .product-gallery__media:nth-child(1 of .gallery-image),
  .rendor-image .product-gallery[product-image-count="18"] .product-gallery__media:nth-child(4 of .gallery-image),
  .rendor-image .product-gallery[product-image-count="18"] .product-gallery__media:nth-child(7 of .gallery-image),
  .rendor-image .product-gallery[product-image-count="18"] .product-gallery__media:nth-child(10 of .gallery-image),
  .rendor-image .product-gallery[product-image-count="18"] .product-gallery__media:nth-child(13 of .gallery-image),
  .rendor-image .product-gallery[product-image-count="18"] .product-gallery__media:nth-child(16 of .gallery-image),
  .rendor-image .product-gallery[product-image-count="19"] .product-gallery__media:nth-child(1 of .gallery-image),
  .rendor-image .product-gallery[product-image-count="19"] .product-gallery__media:nth-child(4 of .gallery-image),
  .rendor-image .product-gallery[product-image-count="19"] .product-gallery__media:nth-child(7 of .gallery-image),
  .rendor-image .product-gallery[product-image-count="19"] .product-gallery__media:nth-child(10 of .gallery-image),
  .rendor-image .product-gallery[product-image-count="19"] .product-gallery__media:nth-child(13 of .gallery-image),
  .rendor-image .product-gallery[product-image-count="19"] .product-gallery__media:nth-child(16 of .gallery-image),
  .rendor-image .product-gallery[product-image-count="19"] .product-gallery__media:nth-child(19 of .gallery-image),
  .rendor-image .product-gallery[product-image-count="20"] .product-gallery__media:nth-child(1 of .gallery-image),
  .rendor-image .product-gallery[product-image-count="20"] .product-gallery__media:nth-child(4 of .gallery-image),
  .rendor-image .product-gallery[product-image-count="20"] .product-gallery__media:nth-child(7 of .gallery-image),
  .rendor-image .product-gallery[product-image-count="20"] .product-gallery__media:nth-child(10 of .gallery-image),
  .rendor-image .product-gallery[product-image-count="20"] .product-gallery__media:nth-child(13 of .gallery-image),
  .rendor-image .product-gallery[product-image-count="20"] .product-gallery__media:nth-child(16 of .gallery-image),
  .rendor-image .product-gallery[product-image-count="20"] .product-gallery__media:nth-child(19 of .gallery-image),
  .rendor-image .product-gallery[product-image-count="20"] .product-gallery__media:nth-child(20 of .gallery-image),
  .rendor-image .product-gallery[product-image-count="21"] .product-gallery__media:nth-child(1 of .gallery-image),
  .rendor-image .product-gallery[product-image-count="21"] .product-gallery__media:nth-child(4 of .gallery-image),
  .rendor-image .product-gallery[product-image-count="21"] .product-gallery__media:nth-child(7 of .gallery-image),
  .rendor-image .product-gallery[product-image-count="21"] .product-gallery__media:nth-child(10 of .gallery-image),
  .rendor-image .product-gallery[product-image-count="21"] .product-gallery__media:nth-child(13 of .gallery-image),
  .rendor-image .product-gallery[product-image-count="21"] .product-gallery__media:nth-child(16 of .gallery-image),
  .rendor-image .product-gallery[product-image-count="21"] .product-gallery__media:nth-child(19 of .gallery-image),
  .rendor-image .product-gallery[product-image-count="22"] .product-gallery__media:nth-child(1 of .gallery-image),
  .rendor-image .product-gallery[product-image-count="22"] .product-gallery__media:nth-child(4 of .gallery-image),
  .rendor-image .product-gallery[product-image-count="22"] .product-gallery__media:nth-child(7 of .gallery-image),
  .rendor-image .product-gallery[product-image-count="22"] .product-gallery__media:nth-child(10 of .gallery-image),
  .rendor-image .product-gallery[product-image-count="22"] .product-gallery__media:nth-child(13 of .gallery-image),
  .rendor-image .product-gallery[product-image-count="22"] .product-gallery__media:nth-child(16 of .gallery-image),
  .rendor-image .product-gallery[product-image-count="22"] .product-gallery__media:nth-child(19 of .gallery-image),
  .rendor-image .product-gallery[product-image-count="22"] .product-gallery__media:nth-child(22 of .gallery-image),
  .rendor-image .product-gallery[product-image-count="23"] .product-gallery__media:nth-child(1 of .gallery-image),
  .rendor-image .product-gallery[product-image-count="23"] .product-gallery__media:nth-child(4 of .gallery-image),
  .rendor-image .product-gallery[product-image-count="23"] .product-gallery__media:nth-child(7 of .gallery-image),
  .rendor-image .product-gallery[product-image-count="23"] .product-gallery__media:nth-child(10 of .gallery-image),
  .rendor-image .product-gallery[product-image-count="23"] .product-gallery__media:nth-child(13 of .gallery-image),
  .rendor-image .product-gallery[product-image-count="23"] .product-gallery__media:nth-child(16 of .gallery-image),
  .rendor-image .product-gallery[product-image-count="23"] .product-gallery__media:nth-child(19 of .gallery-image),
  .rendor-image .product-gallery[product-image-count="23"] .product-gallery__media:nth-child(21 of .gallery-image),
  .rendor-image .product-gallery[product-image-count="24"] .product-gallery__media:nth-child(1 of .gallery-image),
  .rendor-image .product-gallery[product-image-count="24"] .product-gallery__media:nth-child(4 of .gallery-image),
  .rendor-image .product-gallery[product-image-count="24"] .product-gallery__media:nth-child(7 of .gallery-image),
  .rendor-image .product-gallery[product-image-count="24"] .product-gallery__media:nth-child(10 of .gallery-image),
  .rendor-image .product-gallery[product-image-count="24"] .product-gallery__media:nth-child(13 of .gallery-image),
  .rendor-image .product-gallery[product-image-count="24"] .product-gallery__media:nth-child(16 of .gallery-image),
  .rendor-image .product-gallery[product-image-count="24"] .product-gallery__media:nth-child(19 of .gallery-image),
  .rendor-image .product-gallery[product-image-count="24"] .product-gallery__media:nth-child(22 of .gallery-image) {
    width: calc(100% - 30px)!important;
    max-width: 100%!important;
    aspect-ratio: 16/9;
  }

  .product-gallery__media.snap-center.first-image.variant-image {
    display: block !important;
  }
  .product-gallery__media.variant-image {
    display: none;
  }
  product-rerender .product {display: flex;}
  product-rerender .product .rendor-image {width: 65%}
  product-rerender .product .product-info  {width: 35%}
  product-rerender .product .product-info .product-info--variant-changes-details {margin-bottom: 0}
}
@media screen and (max-width: 767px) {
  .product-gallery__image-list .product-gallery__carousel .product-gallery__media {
    height: 300px;
    min-height: 300px;
    max-height: 300px;
    overflow: hidden;
  }
  .product-gallery__image-list .product-gallery__carousel .product-gallery__media img {
    height: 100%;
    overflow: hidden;
    object-fit: cover;
  }
}
@media (max-width: 500px) {
  .header__secondary-nav {
    gap: 0.625rem 5px;
  }
}
/*
 * ---- V9B: keep hamburger/logo/search/cart on one row at 320-355px (Part 4) ----
 * .header lays out primary-nav/logo/secondary-nav as a grid with symmetric
 * minmax(0,1fr) side columns (kept equal so the logo stays optically centered). At
 * 320px each side column only gets 45px, but search+cart together need 61px
 * (28+28+5), so they wrap onto a second row and header height jumps from ~63px to
 * ~98px. Trimming column-gap and side padding (not the shared --container-gutter,
 * so nothing else on the page is affected) frees enough room for both columns to
 * reach ~65px without touching icon size, logo width, or the symmetric layout.
 * 360px and up already have enough natural room and are unaffected.
 */
@media (max-width: 355px) {
  .header {
    column-gap: 8px;
    padding-inline-start: 12px;
    padding-inline-end: 12px;
  }
}
/*
 * ---- V10B: close the 999px navigation-breakpoint collision ----
 * theme.css's @media (max-width:999px) rule for .md-max\:hidden silently fails
 * to match at exactly 999px (sub-pixel/scrollbar rounding puts the browser's
 * evaluated width a hair outside the boundary), so every .md-max\:hidden element
 * inside the header stays visible instead of hidden: the desktop primary-nav ul
 * (normally display:contents, unconditional in theme.css, wins the tie), the
 * dealer-login link, and the country/locale selector. That's what produces the
 * duplicate nav row, the oversized header, and the header-attributable overflow
 * at 999px. Restating display:none for these elements with a fractional upper
 * bound absorbs the rounding gap without touching .md-max\:hidden's behavior at
 * >=1000px, .contents' behavior anywhere else, or any element outside .header.
 */
@media (max-width: 999.98px) {
  .header .md-max\:hidden {
    display: none !important;
  }
}

/* Product page variant swatch hover */
.block_wrap_pdp_info,
.swatch-items--wrapper {position: relative;}
#variant-popup {
  position: absolute;
  top: 100%; /* below swatch */
  left: 0;
  transform: translateX(calc(-1 * var(--swatch-offset, 0px)));
  width: 100%; /* expands relative to product-card */
  opacity: 0;
  visibility: hidden;
  transition: all 0.25s ease;
  z-index: 10;
  pointer-events: none;
  background:#fff; 
  font-size:13px; 
  line-height:1.45;
  color:#111;
  border:1px solid #ddd; 
  border-radius:10px; 
  padding:10px 12px;
  box-shadow:0 8px 20px rgba(0,0,0,.18);
}
#closeSwatchBlock:hover {opacity: 1;}
#variant-popup #vp-img {
  width:100%;
  height:150px;
  object-fit:cover;
  margin-bottom:8px;
}
#variant-popup #vp-title {
  font-size: 1.2rem;
  font-weight:700;
  margin-bottom:6px;
}
#variant-popup #vp-desc {
  margin-top:6px;
}
.swatch-items--wrapper:hover #variant-popup {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}
span.show-hover-triangle {
  display: none;
  position: absolute;
  height: 0;
  width: 0;
  bottom: -10px;
  left: 50%;
  transform: translateX(-50%);
  border-left: 10px solid transparent;
  border-right: 10px solid transparent;
  border-bottom: 10px solid #fff;
}  
.swatch-items--wrapper:hover span.show-hover-triangle {
  display: block;
  z-index: 11;
}
.variant-picker__option-info legend {font-weight: 600}
.product-info__block-item .variant-picker__option-values input:checked+.swatch-items--wrapper label.color-swatch {border: #33373c solid 2px !important;}

@media screen and (max-width: 767px) {
  #variant-popup #vp-img {
    height: 100px;
  }
}

/* Product story styles */
.product-content-below-main .image-with-text video {width: 100%}
@media screen and (min-width: 700px) {
  .product-content-below-main .image-with-text.image-with-text--reverse video {order: 999}
}

/* Lifestyle carousel (theme native scroll-carousel + arrows) */
.lifestyle-carousel-block { position: relative; }
.lifestyle-carousel-items {
  margin: 0;
  padding: 0;
  list-style: none;
}
/* Horizontal carousel layout: flex row + scroll (scroll-area has overflow: auto hidden) */
.lifestyle-carousel-container .lifestyle-carousel-items.lifestyle-carousel-items--native {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  gap: 32px;
  scroll-snap-type: x mandatory;
  -webkit-overflow-scrolling: touch;
  width: 100%;
  max-width: 100%;
  min-width: 0;
}
.lifestyle-carousel-items.lifestyle-carousel-items--native .lifestyle-carousel-item {
  flex: 0 0 auto;
  width: 100%;
  min-width: 100%;
  box-sizing: border-box;
}
@media screen and (min-width: 1400px) {
  .lifestyle-carousel-items.lifestyle-carousel-items--native .lifestyle-carousel-item {
    min-width: calc((100% - 32px) / 2);
    width: calc((100% - 32px) / 2);
  }
}
.lifestyle-carousel-items .lifestyle-carousel-item img {
  aspect-ratio: 930/524;
  object-fit: cover;
  width: 100%;
  height: auto;
}
.lifestyle-carousel-items .lifestyle-carousel-item-wrapper {
  position: relative;
}
.lifestyle-carousel-items .lifestyle_carousel-caption {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  background: rgba(0, 0, 0, 0.4);
  color: white;
  font-weight: 600;
  font-size: 16px;
  text-align: center;
  padding: 1rem;
}

/* Bowsers difference */
h2.bowsers-difference-heading {
  font-size: 3rem;
  padding-bottom: 3rem;
}
.bowsers-difference-container {
  display: flex;
  gap: 1.25rem;
  flex-wrap: nowrap;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  scroll-snap-type: x mandatory;
  margin: 0;
  padding: 0;
  list-style: none
}
.bowsers-difference-container .bowsers-difference-item {
  width: 33.33%;
  max-width: 33.33%;
  padding: 2.5rem 1.25rem;
}
.bowsers-difference-container .bowsers-difference-item img {
  width: 5.5rem;
  height: auto;
  aspect-ratio: 1 / 1;
  margin-bottom: 1.5rem;
}
.bowsers-difference-container .bowsers-difference-item h3 {
  font-size: 2.5rem;
  line-height: 3rem;
  padding-bottom: .5rem;
}
.bowsers-difference-container .bowsers-difference-item p {
  font-size: 1.375rem;
}
@media screen and (max-width: 767px) {
  .bowsers-difference-container::-webkit-scrollbar {
    display: none;
  }  
  .bowsers-difference-container .bowsers-difference-item {
    width: 100%;
    max-width: 100%;
    min-width: 75%;
    padding: 2rem 1.25rem;
  }
  h2.bowsers-difference-heading {font-size: 2rem}
  .bowsers-difference-container .bowsers-difference-item img {width: 5rem;}
  .bowsers-difference-container .bowsers-difference-item h3 {
    font-size: 2rem;
    padding-bottom: 1.5rem;
    line-height: 1.2;
  }
  .bowsers-difference-container .bowsers-difference-item p {font-size: 1.125rem;}
}

/* Recommended for you */
.shopify-section--related-products .section-header h2 {
  font-size: 40px;
  padding-bottom: 20px;
}
.shopify-section--related-products .floating-controls-container .product-list {
  justify-content: flex-start!important;
}

/* Universal padding for Rich Text sections when “Remove vertical spacing” is ON */
.shopify-section--rich-text .color-scheme:not(.section-spacing) {
  padding-top: 32px !important;
  padding-bottom: 24px !important;
}

/* Optional: tighter spacing between headline and subline inside Rich Text */
.shopify-section--rich-text .prose .h1 {
  margin-bottom: 8px;
}

/* Mobile adjustment */
@media (max-width: 749px){
  .shopify-section--rich-text .color-scheme:not(.section-spacing) {
    padding-top: 20px !important;
    padding-bottom: 16px !important;
  }
  /* Bowsers difference: mobile headline height reserve (2 lines) 
     Added: 2025-12-18 (Connor) */
  .bowsers-difference-container .bowsers-difference-item > h3 {
    min-height: calc(2rem * 1.2 * 2); /* font-size 2rem, line-height 1.2, 2 lines */
  }
}
/* ===========================
   Bowsers difference: align body copy across pillar cards
   Fix: reserve 2-line headline space + eliminate rich text margin collapse
   Added: 2025-12-18 (Connor)
   =========================== */

/* Reserve consistent headline block height */
.bowsers-difference-container .bowsers-difference-item > h3 {
  margin: 0; /* remove default H3 margins that vary by browser */
  min-height: 6rem; /* desktop: 2 lines x your desktop line-height (3rem) */
  padding-bottom: .5rem; /* keep your existing spacing intention */
}

/* Prevent paragraph margin collapse and normalize spacing */
.bowsers-difference-container .bowsers-difference-item .metafield-rich_text_field {
  display: flow-root; /* stops margin-collapsing with child <p> */
}

.bowsers-difference-container .bowsers-difference-item .metafield-rich_text_field > p {
  margin: 0; /* remove default p margins so spacing is consistent */
}

/* Optional: hide the empty first paragraph Shopify outputs */
.bowsers-difference-container .bowsers-difference-item .metafield-rich_text_field > p:empty {
  display: none;
}
/* ===========================
   Bowsers difference: vertically center 1-line headlines within the 2-line reserve
   Note: makes single-line headings sit nicer next to 2-line headings
   Added: 2025-12-18 (Connor)
   =========================== */
.bowsers-difference-container .bowsers-difference-item > h3 {
  display: flex;
  align-items: center; /* vertical centering inside the reserved min-height */
}


/* ===========================
   Bowsers Custom: Mega Menu Chevrons
   =========================== */

.mega-menu__header-link {
  position: relative;
  display: inline-block !important;
  padding-right: 18px;
  white-space: nowrap;
  text-decoration: none;
}

.mega-menu__header-link::after {
  content: "";
  position: absolute;
  top: 50%;
  right: 0;
  width: 12px;
  height: 12px;
  transform: translate(0,-50%);
  background: currentColor;
  transition: transform 0.18s ease, background-color 0.18s ease;
  -webkit-mask: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M9 18l6-6-6-6" fill="none" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/></svg>') center / contain no-repeat;
          mask: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M9 18l6-6-6-6" fill="none" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/></svg>') center / contain no-repeat;
}

.mm-hover > .mega-menu__header-link::after,
.mega-menu__header-link.mm-hover::after {
  transform: translate(3px,-50%);
  background: #BCA89E;
}

@media (max-width: 999px) {
  .mega-menu__header-link { padding-right: 0; }
  .mega-menu__header-link::after { display: none !important; }
}
/* ===========================
   Bowsers Custom CSS
   Mega Menu Typography
   =========================== */

/* 1) Headers: Poppins Bold, 15–16px, slight letter spacing */
.mega-menu li > a.mega-menu__header-link {
  font-family: 'BowsersPoppins', sans-serif;
  font-weight: 700;
  font-size: 16px;          /* switch to 15px if you prefer tighter */
  letter-spacing: 0.4px;
  line-height: 1.25;
  color: #343739;           /* Charcoal */
  text-transform: none;
}

/* If the theme’s h6 class is fighting you, keep these two lines */
.mega-menu li > a.mega-menu__header-link.h6 {
  font-size: 16px !important;
  font-weight: 700 !important;
}

/* 2) Subcategories: Inter Regular or Medium, 14px, muted color */
.mega-menu .mega-menu__linklist.unstyled-list a:not(.mega-menu__header-link),
.mega-menu .v-stack.gap-2\.5.unstyled-list a:not(.mega-menu__header-link),
.mega-menu .v-stack.gap-2\.5.unstyled-list .link-faded {
  font-family: 'Inter', sans-serif;
  font-weight: 500;         /* change to 500 if you want a touch more presence */
  font-size: 14px;
  line-height: 1.35;
  color: #6F6F6F;           /* muted grey */
  text-decoration: none;
}
.mega-menu .mega-menu__linklist.unstyled-list a:not(.mega-menu__header-link):hover,
.mega-menu .v-stack.gap-2\.5.unstyled-list a:not(.mega-menu__header-link):hover,
.mega-menu .v-stack.gap-2\.5.unstyled-list .link-faded:hover {
  color: #343739;
}
/* 3) All Products header row: same style as other headers + chevron */
.mega-menu__all-products-top {
  margin: 0 0 6px 0;
  padding: 0;
}

.mega-menu__all-products-top .mega-menu__header-link {
  font-family: 'BowsersPoppins', sans-serif;
  font-weight: 700;
  font-size: 16px;
  letter-spacing: 0.4px;
  line-height: 1.25;
  color: #343739;
  text-transform: none;
  position: relative;
}

.mega-menu__all-products-top .mega-menu__header-link::after {
  content: '›';
  margin-left: 6px;
  font-size: 14px;
  vertical-align: middle;
}

/* Hide "… View All" subcategories on desktop, show on mobile */
@media (min-width: 1000px) {
  .mega-menu [data-view-all-sub="true"] {
    display: none !important;
  }
}
/* ===========================
   Bowsers Mega Menu promo background
   Connor added for promo column styling
   =========================== */

.mega-menu__promo.promo-bg {
  background-color: #F5F3F0; /* Classic Linen */
  /* If you prefer Pale Stone use #EDEBE8 */
  height: 100%;
}

.promo-bg__inner {
  padding: 20px;           /* breathing room around the image/text */
  height: 100%;
  display: flex;
  align-items: center;     /* center vertically */
  justify-content: center; /* center horizontally */
}

/* Ensure both columns stretch to equal height */
.mega-menu {
  align-items: stretch;
}

/* Keep images neat inside the promo column */
.mega-menu__promo.promo-bg .media,
.mega-menu__promo.promo-bg picture,
.mega-menu__promo.promo-bg img {
  max-width: 100%;
  height: auto;
  display: block;
}

/* Desktop only spacing tune-up if needed */
@media (min-width: 1000px) {
  .mega-menu__promo.promo-bg .promo-bg__inner {
    padding: 28px;
  }
}

/* Connor edit: visually underline promo subheader text */
.mega-menu__promo .smallcaps.text-xs.text-subdued {
  text-decoration: underline;
  cursor: pointer;
}

.mega-menu__promo .smallcaps.text-xs.text-subdued:hover {
  opacity: 0.85;
}

/* ===========================
   Bowsers Editorial Mega Menu — Shop grid + About split
   V5A visual refinement pass
   =========================== */
.mega-menu-shop,
.mega-menu-about {
  display: grid;
  gap: var(--mega-menu-gap, 2.5rem);
  align-items: stretch;
  width: 100%;
}

.mega-menu-shop {
  grid-template-columns: 65fr 35fr;
  /*
   * Row-gap decoupled from --mega-menu-gap (which still drives the column-gap between the category grid and
   * the fabric card, unchanged) so the browse-row-to-grid transition has its own fixed rhythm instead of
   * inheriting the wider gap meant for the grid/card split.
   */
  row-gap: 3.125rem;
}

.mega-menu-shop--full {
  grid-template-columns: 1fr;
}

.mega-menu-about {
  grid-template-columns: 45fr 55fr;
}

.mega-menu-about--full {
  grid-template-columns: 1fr;
}

/* ---- Shop category grid ---- */

.mega-menu-shop__grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  grid-template-rows: repeat(2, auto);
  column-gap: 2.5rem;
  row-gap: 1.5rem;
}

.mega-menu-shop__cell {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  padding: 0;
}

.mega-menu-shop__heading-row {
  display: flex;
  align-items: center;
  gap: 0.625rem;
  text-decoration: none;
  color: rgb(var(--text-color));
}

.mega-menu-shop__icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 36px;
  width: 36px;
  color: rgb(var(--text-color));
  opacity: 0.82;
  transition: opacity 200ms ease;
}

.mega-menu-shop__icon svg {
  display: block;
}

.mega-menu-shop__heading-group {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  min-width: 0;
}

.mega-menu-shop__heading-text {
  opacity: 0.9;
  transition: opacity 200ms ease;
}

.mega-menu-shop__chevron {
  display: inline-flex;
  flex: 0 0 auto;
  opacity: 0.5;
  transition: transform 200ms ease, opacity 200ms ease;
}

.mega-menu-shop__heading-row:hover .mega-menu-shop__icon,
.mega-menu-shop__heading-row:focus-visible .mega-menu-shop__icon {
  opacity: 1;
}

.mega-menu-shop__heading-row:hover .mega-menu-shop__heading-text,
.mega-menu-shop__heading-row:focus-visible .mega-menu-shop__heading-text {
  opacity: 1;
}

.mega-menu-shop__heading-row:hover .mega-menu-shop__chevron,
.mega-menu-shop__heading-row:focus-visible .mega-menu-shop__chevron {
  transform: translateX(4px);
  opacity: 0.85;
}

.mega-menu-shop__heading-row:focus-visible {
  outline: 2px solid rgb(var(--text-color));
  outline-offset: 3px;
  border-radius: 2px;
}

.mega-menu-shop__links {
  flex: 1 1 auto;
}

.mega-menu-shop__link {
  text-decoration: none;
  transition: color 200ms ease;
}

.mega-menu-shop__link:hover,
.mega-menu-shop__link:focus-visible {
  text-decoration: underline;
}

.mega-menu-shop__link:focus-visible {
  outline: 2px solid rgb(var(--text-color));
  outline-offset: 2px;
  border-radius: 2px;
}

/* ---- Shop browse row: flat children with no sub-links, above the category grid ---- */

.mega-menu-shop__browse {
  grid-column: 1 / -1;
}

.mega-menu-shop__browse-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 2.5rem;
  /* Matches the .mega-menu padding-block-start above the row, so the row reads as an even band. */
  padding-bottom: 2.5rem;
}

.mega-menu-shop__browse-link {
  flex: 0 0 auto;
}

.mega-menu-shop__divider {
  height: 1px;
  background-color: rgb(var(--border-color));
  /* Spacing below the divider now comes solely from .mega-menu-shop's row-gap; no separate margin here. */
  margin-bottom: 0;
}

/* ---- About heritage card: full-image editorial card (V6B) ---- */

/*
 * Mirrors the Shop fabric card's structural pattern (image + layered overlay + overlaid copy inside one
 * clickable element) but is defined independently under its own class names, so the two cards can be tuned
 * separately without coupling Shop and About together.
 */
.mega-menu-about__panel {
  position: relative;
}

.mega-menu-about__card {
  position: relative;
  display: block;
  width: 100%;
  height: 100%;
  overflow: hidden;
  border-radius: 6px;
  background-color: #ece6dc;
  color: #ffffff;
  text-decoration: none;
  transform: translateY(0);
  transition: transform 250ms ease;
}

.mega-menu-about__card-image {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  object-position: var(--card-object-position, 50% 50%);
  transform: scale(1);
  transition: transform 250ms ease;
}

.mega-menu-about__card-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(
    to top right,
    rgba(18, 13, 8, 0.82) 0%,
    rgba(18, 13, 8, 0.55) 22%,
    rgba(18, 13, 8, 0.18) 45%,
    rgba(18, 13, 8, 0) 65%
  );
}

.mega-menu-about__card-content {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  padding: 0 40px 36px 36px;
  max-width: 380px;
}

.mega-menu-about__card-heading {
  margin: 0;
  color: #ffffff;
  text-shadow: 0 1px 3px rgba(0, 0, 0, 0.55);
}

.mega-menu-about__card-body {
  margin: 0.5rem 0 0;
  color: rgba(255, 255, 255, 0.9);
  max-width: 32ch;
  text-shadow: 0 1px 3px rgba(0, 0, 0, 0.55);
}

.mega-menu-about__card-cta {
  display: inline-flex;
  align-items: center;
  gap: 0.375rem;
  margin-top: 0.625rem;
  width: fit-content;
  font-weight: 600;
  color: #ffffff;
}

.mega-menu-about__card-cta-chevron {
  display: inline-flex;
  opacity: 0.75;
  transition: transform 200ms ease, opacity 200ms ease;
}

.mega-menu-about__card:hover,
.mega-menu-about__card:focus-visible {
  transform: translateY(-2px);
}

.mega-menu-about__card:hover .mega-menu-about__card-image,
.mega-menu-about__card:focus-visible .mega-menu-about__card-image {
  transform: scale(1.015);
}

.mega-menu-about__card:hover .mega-menu-about__card-cta-chevron,
.mega-menu-about__card:focus-visible .mega-menu-about__card-cta-chevron {
  transform: translateX(4px);
  opacity: 1;
}

.mega-menu-about__card:focus-visible {
  outline: 2px solid #ffffff;
  outline-offset: 3px;
}

@media (prefers-reduced-motion: reduce) {
  .mega-menu-about__card,
  .mega-menu-about__card-image,
  .mega-menu-about__card-cta-chevron {
    transition: none;
  }

  .mega-menu-about__card:hover,
  .mega-menu-about__card:focus-visible {
    transform: none;
  }

  .mega-menu-about__card:hover .mega-menu-about__card-image,
  .mega-menu-about__card:focus-visible .mega-menu-about__card-image {
    transform: none;
  }

  .mega-menu-about__card:hover .mega-menu-about__card-cta-chevron,
  .mega-menu-about__card:focus-visible .mega-menu-about__card-cta-chevron {
    transform: none;
  }
}

/* ---- About brand navigation: two labeled groups of descriptive rows (V6B) ---- */

.mega-menu-about__nav {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 2.5rem;
  height: 100%;
}

.mega-menu-about__group-label {
  margin: 0 0 0.875rem;
  font-family: var(--heading-font-family);
  font-weight: var(--heading-font-weight);
  font-size: 0.75rem;
  letter-spacing: var(--heading-letter-spacing);
  text-transform: uppercase;
  color: rgb(var(--text-color));
  opacity: 0.7;
}

.mega-menu-about__group-list {
  display: flex;
  flex-direction: column;
}

.mega-menu-about__row + .mega-menu-about__row {
  border-top: 1px solid rgba(var(--text-color), 0.08);
}

.mega-menu-about__row-link {
  display: block;
  padding: 0.875rem 0.5rem;
  text-decoration: none;
  color: rgb(var(--text-color));
}

.mega-menu-about__row-head {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

.mega-menu-about__row-title {
  opacity: 0.92;
  transition: opacity 200ms ease;
}

.mega-menu-about__row-chevron {
  display: inline-flex;
  flex: 0 0 auto;
  opacity: 0.5;
  transition: transform 200ms ease, opacity 200ms ease;
}

.mega-menu-about__row-desc {
  display: block;
  margin-top: 0.25rem;
  max-width: 40ch;
  transition: color 200ms ease;
}

.mega-menu-about__row-link:hover .mega-menu-about__row-title,
.mega-menu-about__row-link:focus-visible .mega-menu-about__row-title {
  opacity: 1;
}

.mega-menu-about__row-link:hover .mega-menu-about__row-desc,
.mega-menu-about__row-link:focus-visible .mega-menu-about__row-desc {
  color: rgb(var(--text-color) / 0.85);
}

.mega-menu-about__row-link:hover .mega-menu-about__row-chevron,
.mega-menu-about__row-link:focus-visible .mega-menu-about__row-chevron {
  transform: translateX(4px);
  opacity: 0.85;
}

.mega-menu-about__row-link:focus-visible {
  outline: 2px solid rgb(var(--text-color));
  outline-offset: -2px;
}

@media (prefers-reduced-motion: reduce) {
  .mega-menu-about__row-chevron {
    transition: none;
  }

  .mega-menu-about__row-link:hover .mega-menu-about__row-chevron,
  .mega-menu-about__row-link:focus-visible .mega-menu-about__row-chevron {
    transform: none;
  }
}

/*
 * ---- About brand navigation: two coordinated group columns at wide desktop (V6E) ----
 * Below 1280px the two groups stay stacked (base rule above). At 1280px+ the nav becomes a single 3-row x
 * 2-column grid shared by BOTH groups, not two independently-sized columns: .mega-menu-about__group and
 * .mega-menu-about__group-list go display:contents so each group's label/row-1/row-2 become direct grid
 * children, and grid-auto-flow:column (with exactly 3 explicit rows) fills column 1 top-to-bottom with
 * "About Bowsers"'s [label, Our Story, Our Dogs], then column 2 with "The Bowsers Standard"'s [label,
 * Our Quality, Our Manufacturing] — landing each pair in the same grid row. CSS grid then sizes every row
 * track to its tallest cell and (via align-items:stretch) stretches both cells in that row to match, so a
 * shorter description in one column can no longer cause its row to start earlier than its counterpart's —
 * this was the structural cause of "Our Manufacturing begins lower than Our Dogs" at wide viewports, where
 * the two groups' descriptions wrap to a different number of lines. row-gap:0 avoids double-spacing on top
 * of the row-link's own padding (the base rule's "gap: 2.5rem" shorthand also sets row-gap, so it must be
 * reset explicitly rather than left to inherit). Padding is tuned so the About card lands ~20-30px taller
 * than the Shop card at this breakpoint, per the approved wide-desktop reference height.
 */
@media (min-width: 1280px) {
  .mega-menu-about__nav {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-template-rows: auto auto auto;
    grid-auto-flow: column;
    column-gap: 2.5rem;
    row-gap: 0;
    align-items: stretch;
    height: auto;
    padding: 73px 0;
  }

  .mega-menu-about__group,
  .mega-menu-about__group-list {
    display: contents;
  }
}

/* ---- Shop editorial panel: full-image fabric card (V5D) ---- */

/*
 * One unified card: the fabric photo, a layered warm-neutral overlay, and the text all live inside a
 * single <a> (mega-menu-shop__fabric-card). Perspective lives on the stable panel wrapper, not the card
 * itself, per the standard CSS 3D-transform pattern — a transformed element can't also host the
 * perspective it's viewed through.
 */
.mega-menu-shop__panel {
  position: relative;
  /*
   * Nudges the panel's top edge down to align with the cap height of the row's category headings (e.g.
   * "Sleep") rather than their taller line box; align-items:stretch keeps the bottom flush with the grid.
   */
  margin-top: 3px;
}

.mega-menu-shop__fabric-card {
  position: relative;
  display: block;
  width: 100%;
  height: 100%;
  overflow: hidden;
  border-radius: 6px;
  background-color: #ece6dc;
  color: #ffffff;
  text-decoration: none;
  transform: translateY(0);
  transition: transform 250ms ease;
}

.mega-menu-shop__fabric-card-image {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  object-position: var(--fabric-card-object-position, 50% 50%);
  transform: scale(1);
  transition: transform 250ms ease;
}

/*
 * Layered warm-neutral wash: a light unifying tint over the whole photo, deepening toward the bottom
 * so the heading/body/CTA always sit on a dark-enough ground, without ever reading as a flat opaque box.
 */
.mega-menu-shop__fabric-card-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(
    to top right,
    rgba(18, 13, 8, 0.82) 0%,
    rgba(18, 13, 8, 0.55) 22%,
    rgba(18, 13, 8, 0.18) 45%,
    rgba(18, 13, 8, 0) 65%
  );
  transition: background-color 250ms ease;
}

.mega-menu-shop__fabric-card-content {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  padding: 0 40px 32px 36px;
  max-width: 280px;
}

.mega-menu-shop__fabric-card-heading {
  margin: 0;
  color: #ffffff;
  text-shadow: 0 1px 3px rgba(0, 0, 0, 0.55);
}

.mega-menu-shop__fabric-card-body {
  margin: 0.375rem 0 0;
  color: rgba(255, 255, 255, 0.88);
  max-width: 30ch;
  text-shadow: 0 1px 3px rgba(0, 0, 0, 0.55);
}

.mega-menu-shop__fabric-card-cta {
  display: inline-flex;
  align-items: center;
  gap: 0.375rem;
  margin-top: 0.625rem;
  width: fit-content;
  font-weight: 600;
  color: #ffffff;
}

.mega-menu-shop__fabric-card-cta-chevron {
  display: inline-flex;
  opacity: 0.75;
  transition: transform 200ms ease, opacity 200ms ease;
}

.mega-menu-shop__fabric-card:hover,
.mega-menu-shop__fabric-card:focus-visible {
  transform: translateY(-2px);
}

.mega-menu-shop__fabric-card:hover .mega-menu-shop__fabric-card-image,
.mega-menu-shop__fabric-card:focus-visible .mega-menu-shop__fabric-card-image {
  transform: scale(1.015);
}

.mega-menu-shop__fabric-card:hover .mega-menu-shop__fabric-card-cta-chevron,
.mega-menu-shop__fabric-card:focus-visible .mega-menu-shop__fabric-card-cta-chevron {
  transform: translateX(4px);
  opacity: 1;
}

.mega-menu-shop__fabric-card:focus-visible {
  outline: 2px solid #ffffff;
  outline-offset: 3px;
}

@media (prefers-reduced-motion: reduce) {
  .mega-menu-shop__fabric-card,
  .mega-menu-shop__fabric-card-image,
  .mega-menu-shop__fabric-card-cta-chevron {
    transition: none;
  }

  .mega-menu-shop__fabric-card:hover,
  .mega-menu-shop__fabric-card:focus-visible {
    transform: none;
  }

  .mega-menu-shop__fabric-card:hover .mega-menu-shop__fabric-card-image,
  .mega-menu-shop__fabric-card:focus-visible .mega-menu-shop__fabric-card-image {
    transform: none;
  }

  .mega-menu-shop__fabric-card:hover .mega-menu-shop__fabric-card-cta-chevron,
  .mega-menu-shop__fabric-card:focus-visible .mega-menu-shop__fabric-card-cta-chevron {
    transform: none;
  }
}

/* ---- Mobile / tablet drawer: compact horizontal editorial card ---- */

.mega-menu-images__card {
  display: flex;
  align-items: stretch;
  text-decoration: none;
  color: rgb(var(--text-color));
  background-color: #F5F3F0;
  overflow: hidden;
  border-radius: 6px;
  min-height: 135px;
  max-height: 165px;
  margin-block: 0.75rem;
}

.mega-menu-images__card-media {
  flex: 0 0 40%;
  position: relative;
  overflow: hidden;
}

.mega-menu-images__card-image {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
}

.mega-menu-images__card-content {
  flex: 1 1 60%;
  min-width: 0;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 0.25rem;
  padding: 0.875rem 1rem;
  text-align: left;
}

.mega-menu-images__card-heading {
  margin: 0;
}

.mega-menu-images__card-body {
  margin: 0;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/*
 * ---- V9B: fix horizontal-card overflow/alignment at 600-999px (Part 1) ----
 * The card previously carried its own margin-inline (1rem each side) on top of a flex
 * min-width:100% inherited from .header-sidebar__promo > *:only-child, so it was pushed
 * ~16px further right than the scroller's own 20px padding — crowding the right edge
 * (measured: 36px left inset vs 4px right inset). margin-block above already removed the
 * horizontal margin so the card now fills its container flush, matching the accordion
 * rows' inset exactly. This block tunes the image/text split and lets body copy wrap
 * instead of being clamped to 2 lines with an ellipsis-causing overflow:hidden.
 */
@media (min-width: 600px) and (max-width: 999px) {
  .mega-menu-images__card {
    max-height: none;
  }

  .mega-menu-images__card-media {
    flex-basis: 36%;
  }

  .mega-menu-images__card-content {
    flex-basis: 64%;
  }

  .mega-menu-images__card-body {
    display: block;
    -webkit-line-clamp: unset;
    overflow: visible;
  }
}

/*
 * ---- V9B: compact full-image card below 600px (Part 2) ----
 * Below 600px the horizontal split leaves too little room for both image and readable
 * text, so the card switches to a full-bleed image with an overlaid gradient and white
 * heading/CTA at the bottom-left, matching the desktop Shop/About editorial-card pattern
 * without reusing their frozen classes. Markup is unchanged — image, heading, CTA label,
 * and destination all still come from the same block settings; only presentation differs.
 */
@media (max-width: 599px) {
  .mega-menu-images__card {
    display: block;
    position: relative;
    min-height: 160px;
    max-height: 180px;
  }

  .mega-menu-images__card-media {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    z-index: 0;
  }

  .mega-menu-images__card::after {
    content: "";
    position: absolute;
    inset-inline: 0;
    inset-block-end: 0;
    height: 70%;
    background: linear-gradient(180deg, rgba(22, 15, 10, 0) 0%, rgba(22, 15, 10, 0.72) 100%);
    z-index: 1;
    pointer-events: none;
  }

  .mega-menu-images__card-content {
    position: absolute;
    inset-inline: 0;
    inset-block-end: 0;
    z-index: 2;
    padding: 20px 22px;
    justify-content: flex-end;
  }

  .mega-menu-images__card-heading {
    color: #ffffff;
  }

  .mega-menu-images__card-body {
    display: none;
  }

  .mega-menu-images__card-cta {
    color: #ffffff;
  }
}

.mega-menu-images__card-cta {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  font-size: 0.75rem;
  margin-top: 0.125rem;
  width: fit-content;
  text-decoration: none;
}

.mega-menu-images__card-cta-chevron {
  display: inline-flex;
  transition: transform 200ms ease;
}

.mega-menu-images__card:hover .mega-menu-images__card-cta,
.mega-menu-images__card:focus-visible .mega-menu-images__card-cta {
  text-decoration: underline;
}

.mega-menu-images__card:hover .mega-menu-images__card-cta-chevron,
.mega-menu-images__card:focus-visible .mega-menu-images__card-cta-chevron {
  transform: translateX(4px);
}

.mega-menu-images__card:focus-visible {
  outline: 2px solid rgb(var(--text-color));
  outline-offset: 2px;
}

/* ---- Reduced motion: keep the state changes, drop the movement ---- */

@media (prefers-reduced-motion: reduce) {
  .mega-menu-shop__heading-row,
  .mega-menu-shop__icon,
  .mega-menu-shop__chevron,
  .mega-menu-images__card-cta-chevron {
    transition: none;
  }

  .mega-menu-shop__heading-row:hover .mega-menu-shop__chevron,
  .mega-menu-shop__heading-row:focus-visible .mega-menu-shop__chevron,
  .mega-menu-images__card:hover .mega-menu-images__card-cta-chevron,
  .mega-menu-images__card:focus-visible .mega-menu-images__card-cta-chevron {
    transform: none;
  }
}

/* ---- Responsive safety across desktop breakpoints ---- */

/*
 * Below 1100px the fabric card's column shrinks to ~310px: the heading wraps to three lines, the CTA wraps
 * to two, and object-fit: cover crops the image so tightly the subject is obscured. Stacking the card below
 * the grid isn't viable either — the panel already nearly fills a 768px-tall viewport at this width. Hiding
 * the card and letting the category grid take the full panel width is the least-bad option; the card is
 * fully unchanged at 1100px and above.
 */
@media (max-width: 1099px) {
  .mega-menu-shop__panel {
    display: none;
  }

  .mega-menu-shop__grid {
    grid-column: 1 / -1;
  }
}

@media (min-width: 1000px) and (max-width: 1149px) {
  .mega-menu-shop__grid {
    column-gap: 1.25rem;
    row-gap: 1.5rem;
  }

  .mega-menu-shop__heading-row {
    gap: 0.5rem;
  }

  .mega-menu-shop__heading-group {
    gap: 8px;
  }

  .mega-menu-shop__icon {
    flex-basis: 34px;
    width: 34px;
  }

  .mega-menu-shop__icon svg {
    width: 34px !important;
    height: 34px !important;
  }

  .mega-menu-shop__heading-text {
    font-size: 1.0625rem;
    line-height: 1.25;
  }

  /* Panel is only ~265px wide at this breakpoint; tighten the fabric card's text inset to match. */
  .mega-menu-shop__fabric-card-content {
    padding: 0 20px 20px 22px;
    max-width: 200px;
  }

  .mega-menu-shop__browse-row {
    gap: 1.5rem;
  }
}

@media (min-width: 1150px) and (max-width: 1279px) {
  .mega-menu-shop__grid {
    column-gap: 2rem;
  }

  .mega-menu-shop__heading-group {
    gap: 8px;
  }

  .mega-menu-shop__browse-row {
    gap: 2rem;
  }
}

@media (min-width: 1280px) {
  .mega-menu-shop__heading-text {
    white-space: nowrap;
  }

  .mega-menu-shop__fabric-card-heading {
    white-space: nowrap;
  }

  /*
   * V7B: the shared .mega-menu base rule (theme.css) widens --mega-menu-gap to 6.25rem (100px) at its own
   * min-width:1400px breakpoint, which — combined with the 65:35 split leaving the category grid with most
   * of the growth room — made the gap between the category grid and the fabric card read as an unintentional
   * void once the category icons were removed. Overriding --mega-menu-gap here (scoped to .mega-menu-shop
   * only, so About/Support's gap is untouched) replaces that jump with a fixed, moderate gap, and widening
   * the card's share of the fr-space narrows that void further without touching the category grid itself.
   */
  .mega-menu-shop {
    grid-template-columns: 3fr 2fr;
    --mega-menu-gap: 64px;
  }
}

/* ===========================
   Bowsers Editorial Mega Menu — Support service columns (V8A)
   Compact, service-oriented desktop mega menu: two directory columns (Help & Policies,
   Customer Services) plus a neutral Customer Care panel. Deliberately does not reuse
   .mega-menu-shop*/.mega-menu-about* selectors so Shop/About remain fully independent.
   =========================== */

.mega-menu-support {
  display: grid;
  grid-template-columns: 60fr 40fr;
  gap: var(--mega-menu-gap, 2.5rem);
  align-items: stretch;
  width: 100%;
}

/* ---- Support directory: two labeled columns of descriptive rows ---- */

.mega-menu-support__directory {
  display: grid;
  grid-template-columns: 55fr 45fr;
  column-gap: 2rem;
}

.mega-menu-support__group-label {
  margin: 0 0 0.625rem;
  font-family: var(--heading-font-family);
  font-weight: var(--heading-font-weight);
  font-size: 0.75rem;
  letter-spacing: var(--heading-letter-spacing);
  text-transform: uppercase;
  color: rgb(var(--text-color));
  opacity: 0.7;
}

.mega-menu-support__group-list {
  display: flex;
  flex-direction: column;
}

.mega-menu-support__row + .mega-menu-support__row {
  border-top: 1px solid rgba(var(--text-color), 0.08);
}

.mega-menu-support__row-link {
  display: block;
  padding: 0.4375rem 0.375rem;
  text-decoration: none;
  color: rgb(var(--text-color));
}

.mega-menu-support__row-head {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

.mega-menu-support__row-title {
  font-family: var(--heading-font-family);
  font-weight: var(--heading-font-weight);
  font-size: 0.9375rem;
  line-height: 1.3;
  opacity: 0.88;
  transition: opacity 200ms ease;
}

.mega-menu-support__row-chevron {
  display: inline-flex;
  flex: 0 0 auto;
  opacity: 0.5;
  transition: transform 200ms ease, opacity 200ms ease;
}

.mega-menu-support__row-desc {
  display: block;
  margin-top: 0.1875rem;
  font-size: 0.8125rem;
  line-height: 1.4;
  max-width: 34ch;
  transition: color 200ms ease;
}

.mega-menu-support__row-link:hover .mega-menu-support__row-title,
.mega-menu-support__row-link:focus-visible .mega-menu-support__row-title {
  opacity: 1;
}

.mega-menu-support__row-link:hover .mega-menu-support__row-desc,
.mega-menu-support__row-link:focus-visible .mega-menu-support__row-desc {
  color: rgb(var(--text-color) / 0.85);
}

.mega-menu-support__row-link:hover .mega-menu-support__row-chevron,
.mega-menu-support__row-link:focus-visible .mega-menu-support__row-chevron {
  transform: translateX(4px);
  opacity: 0.85;
}

.mega-menu-support__row-link:focus-visible {
  outline: 2px solid rgb(var(--text-color));
  outline-offset: -2px;
}

/* ---- Support Customer Care panel: neutral, no photograph ---- */

.mega-menu-support__care-wrap {
  height: 100%;
}

.mega-menu-support__care {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: center;
  height: 100%;
  border-radius: 6px;
  background-color: #F5F3F0;
  color: rgb(var(--text-color));
  text-decoration: none;
  padding: 28px 32px;
  transition: background-color 200ms ease;
}

.mega-menu-support__care-eyebrow {
  margin: 0 0 0.5rem;
  font-family: var(--heading-font-family);
  font-weight: var(--heading-font-weight);
  font-size: 0.6875rem;
  letter-spacing: var(--heading-letter-spacing);
  text-transform: uppercase;
  color: rgb(var(--text-color));
  opacity: 0.6;
}

.mega-menu-support__care-heading {
  margin: 0;
  color: rgb(var(--text-color));
}

.mega-menu-support__care-body {
  margin: 0.5rem 0 0;
  color: rgb(var(--text-color) / 0.75);
  max-width: 34ch;
}

.mega-menu-support__care-cta {
  display: inline-flex;
  align-items: center;
  gap: 0.375rem;
  margin-top: 0.875rem;
  width: fit-content;
  font-weight: 600;
  color: rgb(var(--text-color));
}

.mega-menu-support__care-cta-chevron {
  display: inline-flex;
  opacity: 0.6;
  transition: transform 200ms ease, opacity 200ms ease;
}

.mega-menu-support__care:hover,
.mega-menu-support__care:focus-visible {
  background-color: #EFEAE2;
}

.mega-menu-support__care:hover .mega-menu-support__care-cta-chevron,
.mega-menu-support__care:focus-visible .mega-menu-support__care-cta-chevron {
  transform: translateX(4px);
  opacity: 1;
}

.mega-menu-support__care:focus-visible {
  outline: 2px solid rgb(var(--text-color));
  outline-offset: 3px;
}

@media (prefers-reduced-motion: reduce) {
  .mega-menu-support__row-chevron,
  .mega-menu-support__care-cta-chevron {
    transition: none;
  }

  .mega-menu-support__row-link:hover .mega-menu-support__row-chevron,
  .mega-menu-support__row-link:focus-visible .mega-menu-support__row-chevron,
  .mega-menu-support__care:hover .mega-menu-support__care-cta-chevron,
  .mega-menu-support__care:focus-visible .mega-menu-support__care-cta-chevron {
    transform: none;
  }
}

/* ---- Support responsive safety across desktop breakpoints ---- */

@media (min-width: 1000px) and (max-width: 1279px) {
  .mega-menu-support {
    grid-template-columns: 68fr 32fr;
  }

  .mega-menu-support__directory {
    grid-template-columns: 60fr 40fr;
    column-gap: 1.25rem;
  }

  .mega-menu-support__care {
    padding: 22px 22px;
  }
}

@media (min-width: 1280px) {
  /*
   * Scoped override, same reasoning as .mega-menu-shop above: the shared .mega-menu base rule widens
   * --mega-menu-gap to 6.25rem (100px) at 1400px+, which would read as an oversized void between three
   * compact columns. Keep a fixed, moderate gap instead so the composition stays "compact" per spec.
   */
  .mega-menu-support {
    --mega-menu-gap: 56px;
  }

  .mega-menu-support__care {
    padding: 32px 36px;
  }
}

/* ===========================
   Badge Styling
   Connor added
   =========================== */

/* Bowsers badge styling */
.badge-list {
  position: absolute;
  top: 10px;
  left: 10px;
  gap: 6px;
  display: flex;
  flex-direction: column;
  z-index: 2;
}

.product-card__figure {
  position: relative; /* ensures the absolute badge-list sits inside the card */
}

/* Base badge */
.badge {
  background-color: #4A4A48; /* Warm Graphite */
  color: #F5F3F0;            /* Classic Linen */
  font-family: 'BowsersPoppins', sans-serif;
  font-weight: 600;
  letter-spacing: 0.4px;
  text-transform: uppercase;
  font-size: 12px;
  line-height: 1;
  padding: 6px 10px;
  border-radius: 999px;      /* pill shape */
}

/* Sold out variant */
.badge--sold-out {
  background-color: #343739; /* Charcoal */
  color: #EDEBE8;            /* Pale Stone */
  border: 1px solid #4A4A48; /* subtle edge */
}

/* Optional hover polish on product cards */
.product-card:hover .badge {
  transform: translateY(-1px);
  transition: transform 160ms ease, box-shadow 160ms ease;
  box-shadow: 0 2px 6px rgb(0 0 0 / 10%);
}

/* If badges stack too close on mobile, add spacing */
@media (max-width: 699px) {
  .badge-list { top: 8px; left: 8px; gap: 4px; }
  .badge { font-size: 11px; padding: 5px 9px; }
}
/* ===========================
   Product Title Styling
   Connor added
   =========================== */
   /* Bowsers Product Title Styling */
.shopify-section--main-product .product-title {
  font-family: 'BowsersPoppins', sans-serif;
  font-weight: 600;          /* stronger than normal, but not too heavy */
  /* font-size: 18px;  */          /* make it more pronounced */
  font-size: 40px;
  letter-spacing: 0.5px;     /* refined spacing */
  color: #343739;            /* Charcoal, ties to brand palette */
  text-transform: none;      /* keep clean case */
  line-height: 1.4;
  transition: color 160ms ease;
}

@media (max-width: 699px) {
  .product-title {font-size: 30px;}
}
/* ===========================
   Product card title styling (collections, related products, etc.)
   =========================== */

/* Keep PDP title styling as-is, but restore card titles */
.product-card .product-title,
.product-card__title,
.product-card__title a,
.product-item__title,
.product-item__title a {
  font-family: 'BowsersPoppins', sans-serif;
  font-weight: 600;
  font-size: 18px;
  letter-spacing: 0.5px;
  color: #343739;
  text-transform: none;
  line-height: 1.4;
}

/* Optional: tighten spacing if the title block got tall */
.product-card__info,
.product-card__content {
  row-gap: 6px;
}

/* Fix: scope the mobile title size change so it only affects the PDP */
@media (max-width: 699px) {
  .shopify-section--main-product .product-title {
    font-size: 30px;
  }

  .product-card .product-title,
  .product-card__title,
  .product-card__title a,
  .product-item__title,
  .product-item__title a {
    font-size: 16px;
  }
}


/* ===========================
   Bowsers Collection Pills:
   Page background: #F5F3F0
   =========================== */

/* Remove theme divider above the grid (but keep toolbar dividers) */
.template-collection .collection-filters,
.template-collection .section--collection::before {
  border-top: none !important;
  background: #F5F3F0 !important;
  box-shadow: none !important;
  content: none !important;
}
/* Restore the toolbar divider lines (view icons, product count, sort) */
.template-collection .collection-toolbar {
  border-top: 1px solid rgba(52,55,57,0.12) !important;
  border-bottom: 1px solid rgba(52,55,57,0.12) !important;
  box-shadow: none !important;
}



/* Tight vertical rhythm under the intro copy */
.collection-intro,
.section--collection .rte { margin-bottom: 8px; }

.pills-block { margin: 6px 0 12px; }

/* Layout */
.collection-pills {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
}

/* Base pill: white chip on a linen page */
.pill {
  display: inline-block;
  padding: 12px 20px;                  /* generous */
  border-radius: 9999px;
  background: #FFFFFF;                 /* unselected pill is white */
  color: #343739;                      /* charcoal text */
  text-decoration: none;
  font-weight: 600;
  font-size: 16px;
  line-height: 1;
  border: 2px solid transparent;       /* allows press border without layout shift */
  transition: background-color 150ms ease, border-color 150ms ease, color 150ms ease;
}

/* Hover: soft stone grey (still clear against linen background) */
.pill:hover {
  background: #E0DFDC;   /* slightly darker than #F5F3F0 */
  color: #343739;        /* keep charcoal text */
}


/* Press feedback: show a charcoal ring briefly before navigation */
.pill:active {
  border-color: #343739;
}

/* Selected after navigation: filled dark grey */
.pill.is-active {
  background: #343739;                 /* filled state */
  color: #FFFFFF;
  border-color: transparent;           /* no ring once active */
}



/* Mobile tweaks */
@media (max-width: 768px) {
  .collection-pills { gap: 10px; }
  .pill { padding: 9px 14px; font-size: 14px; }
  .pills-block { margin: 8px 0 10px; }
}

/* ===========================
   Collection Intro Styling
   Generic for collection rich text
   =========================== */

/* Title */
.template-collection .shopify-section--rich-text .prose.text-start .h1 {
  font-size: clamp(32px, 3.6vw, 44px) !important;
  line-height: 1.15 !important;
  font-weight: 700 !important;
  letter-spacing: 0.01em !important;
  margin: 0 0 10px 0 !important;
  color: #343739 !important;
}

/* Body text (description) */
.template-collection .shopify-section--rich-text .prose.text-start > div > p,
.template-collection .shopify-section--rich-text .prose.text-start p:not(.h1) {
  font-size: 20px !important;
  line-height: 1.6 !important;
  color: #343739 !important;
  max-width: 100% !important;
  margin: 0 0 14px 0 !important;
}

/* Bold inside collection intro */
.template-collection .shopify-section--rich-text .prose.text-start :is(strong, b) {
  font-weight: 700 !important;
}

/* Allow synthetic bold if the loaded webfont doesn't include 700 */
.template-collection .shopify-section--rich-text .prose.text-start {
  font-synthesis: weight;
}

.template-collection .shopify-section--rich-text .prose.text-start strong,
.template-collection .shopify-section--rich-text .prose.text-start b {
  font-weight: 700;
}
.template-collection .shopify-section--rich-text .prose.text-start p strong,
.template-collection .shopify-section--rich-text .prose.text-start p b {
  font-weight: 600 !important;
}


/* Ensure block aligns nicely */
.template-collection .shopify-section--rich-text .prose.text-start {
  margin-left: 0 !important;
}


/* ===========================
   Tighten spacing between intro and pills
   =========================== */

/* Remove excess padding from the rich-text section wrapper */
.shopify-section--rich-text .container {
  padding-bottom: 0 !important;
}

/* Reduce spacing below the intro text */
.shopify-section--rich-text .prose p {
  margin-bottom: 4px !important;
}

/* Pull pills closer to text */
.collection-pills {
  margin-top: 6px !important;
  margin-bottom: 18px; /* leave some breathing room */
}
/* ===========================
   Squeeze gap between intro copy and pills
   =========================== */

/* Kill hidden bottom padding on the rich text section */
.template-collection .shopify-section--rich-text,
.template-collection .shopify-section--rich-text .color-scheme,
.template-collection .shopify-section--rich-text .container,
.template-collection .shopify-section--rich-text .container.container--sm {
  padding-bottom: 0 !important;
  margin-bottom: 0 !important;
}

/* Remove extra margins inside the prose wrapper */
.template-collection .shopify-section--rich-text .prose {
  margin-bottom: 0 !important;
}
.template-collection .shopify-section--rich-text .prose p {
  margin-bottom: 6px !important;   /* description bottom margin */
}

/* Pull the pills up tighter */
.pills-block { 
  margin-top: 0 !important;
}
.collection-pills {
  margin-top: 4px !important;      /* reduce the gap above pills */
  margin-bottom: 16px !important;  /* keep a little air before the toolbar */
}

/* If you still see a faint gap, uncomment the line below for a micro pull-up */
.pills-block { margin-top: -4px !important; }

/* Mobile: make pills a horizontal scroller */
@media (max-width: 768px) {
  .pills-block {
    margin-top: 0 !important;
    margin-bottom: 12px !important;
  }

  .collection-pills {
    display: flex;
    flex-wrap: nowrap;                 /* keep on one line */
    gap: 10px;
    overflow-x: auto;                  /* enable swipe */
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch; /* momentum scrolling */
    scroll-snap-type: x proximity;     /* gentle snap */
    padding-bottom: 6px;               /* prevents text clipping */
  }

  .collection-pills .pill {
    flex: 0 0 auto;                    /* prevent shrinking */
    scroll-snap-align: start;
    white-space: nowrap;               /* keep labels on one line */
  }

  /* Hide default scrollbar on WebKit */
  .collection-pills::-webkit-scrollbar {
    display: none;
  }
  }

/* Bowsers – remove the dark divider line under the collection banner on desktop */
.template-collection .shopify-section--collection-banner,
.template-collection .shopify-section--collection-banner .collection-banner,
.template-collection .shopify-section--collection-banner .content-over-media,
.template-collection .shopify-section--collection-banner .color-scheme {
  border-bottom: 0 !important;
  box-shadow: none !important;
}

/* Kill any pseudo-element dividers as well */
.template-collection .shopify-section--collection-banner::before,
.template-collection .shopify-section--collection-banner::after,
.template-collection .shopify-section--collection-banner .collection-banner::before,
.template-collection .shopify-section--collection-banner .collection-banner::after,
.template-collection .shopify-section--collection-banner .content-over-media::before,
.template-collection .shopify-section--collection-banner .content-over-media::after,
.template-collection .shopify-section--collection-banner .color-scheme::before,
.template-collection .shopify-section--collection-banner .color-scheme::after {
  content: none !important;
  border: 0 !important;
  box-shadow: none !important;
}
/* Bowsers – kill divider between collection intro (rich text) and pills (custom liquid) */

/* Remove any bottom border/shadow from the rich text section */
.template-collection .shopify-section--rich-text,
.template-collection .shopify-section--rich-text .section-spacing,
.template-collection .shopify-section--rich-text .color-scheme,
.template-collection .shopify-section--rich-text .container {
  border-bottom: 0 !important;
  box-shadow: none !important;
}

/* Remove any top border/shadow from the custom liquid section that holds the pills */
.template-collection .shopify-section--custom-liquid,
.template-collection .shopify-section--custom-liquid .section-spacing,
.template-collection .shopify-section--custom-liquid .color-scheme,
.template-collection .shopify-section--custom-liquid .container {
  border-top: 0 !important;
  box-shadow: none !important;
}

/* Also kill pseudo-element dividers, just in case */
.template-collection .shopify-section--rich-text::after,
.template-collection .shopify-section--custom-liquid::before,
.template-collection .shopify-section--custom-liquid::after,
.template-collection .shopify-section--custom-liquid .section-spacing::before,
.template-collection .shopify-section--custom-liquid .section-spacing::after,
.template-collection .shopify-section--custom-liquid .color-scheme::before,
.template-collection .shopify-section--custom-liquid .color-scheme::after,
.template-collection .shopify-section--custom-liquid .container::before,
.template-collection .shopify-section--custom-liquid .container::after {
  content: none !important;
  border: 0 !important;
  box-shadow: none !important;
}


/* ===========================
   Breadcrumbs, desktop only
   =========================== */

/* Support either wrapper: our custom section or Prestige's class */
.bowsers-breadcrumbs,
.shopify-section--breadcrumbs {
  background: #F5F3F0;
  padding: 16px 0;
  border-top: 1px solid rgba(52,55,57,0.08);
  border-bottom: 0;
}

/* Container widths stay theme-driven */

/* Typography and layout */
.bowsers-breadcrumbs .breadcrumb,
.shopify-section--breadcrumbs .breadcrumb {
  font-size: 13px;
  letter-spacing: 0;
  text-transform: none; /* not caps locked */
  line-height: 1.25;
}

.bowsers-breadcrumbs .breadcrumb__list,
.shopify-section--breadcrumbs .breadcrumb__list {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0; /* separators will handle spacing */
  margin: 0;
  padding: 0;
  list-style: none;
}

.bowsers-breadcrumbs .breadcrumb__list-item,
.shopify-section--breadcrumbs .breadcrumb__list-item {
  color: #343739;
  font-weight: 400;
}

/* Chevron separator */
.bowsers-breadcrumbs .breadcrumb__list-item + .breadcrumb__list-item::before,
.shopify-section--breadcrumbs .breadcrumb__list-item + .breadcrumb__list-item::before {
  content: "›";
  display: inline-block;
  margin: 0 8px;
  color: #343739;
  opacity: 0.45;
}

.bowsers-breadcrumbs .breadcrumb__list-item a,
.shopify-section--breadcrumbs .breadcrumb__list-item a {
  color: #343739;
  text-decoration: none;
  transition: color .2s ease;
}

.bowsers-breadcrumbs .breadcrumb__list-item a:hover,
.shopify-section--breadcrumbs .breadcrumb__list-item a:hover {
  text-decoration: underline;
}

.bowsers-breadcrumbs [aria-current="page"],
.shopify-section--breadcrumbs [aria-current="page"] {
  font-weight: 500;
}
/* On collection pages, remove the breadcrumb top divider (this is the line under the banner) */
.template-collection .bowsers-breadcrumbs,
.template-collection .shopify-section--breadcrumbs {
  border-top: 0 !important;
}
/* Tighten collection page vertical rhythm: banner -> breadcrumbs -> title */
.template-collection .bowsers-breadcrumbs,
.template-collection .shopify-section--breadcrumbs {
  padding: 8px 0 !important;   /* was 16px */
  margin: 0 !important;
}

/* Tighten the space between breadcrumbs and the collection header section */
.template-collection .bowsers-breadcrumbs + .shopify-section,
.template-collection .shopify-section--breadcrumbs + .shopify-section {
  margin-top: 0 !important;
  padding-top: 0 !important;
}


/* ===========================
   Mobile behavior and divider fix
   =========================== */
@media (max-width: 749px) {
  /* Hide breadcrumbs section on phones */
  .bowsers-breadcrumbs,
  .shopify-section--breadcrumbs {
    display: none !important;
  }

  /* Remove any divider between the banner and the next section */
  .shopify-section--collection-banner,
  .shopify-section--collection-banner .collection-banner,
  .shopify-section--collection-banner .content-over-media,
  .shopify-section--collection-banner .color-scheme {
    border-bottom: 0 !important;
    box-shadow: none !important;
  }
  .shopify-section--collection-banner::before,
  .shopify-section--collection-banner::after,
  .shopify-section--collection-banner .collection-banner::before,
  .shopify-section--collection-banner .collection-banner::after,
  .shopify-section--collection-banner .content-over-media::before,
  .shopify-section--collection-banner .content-over-media::after,
  .shopify-section--collection-banner .color-scheme::before,
  .shopify-section--collection-banner .color-scheme::after {
    content: none !important;
    display: none !important;
  }

  .shopify-section--collection-banner + .shopify-section,
  .shopify-section--collection-banner + .shopify-section .section-spacing,
  .shopify-section--collection-banner + .shopify-section .color-scheme,
  .shopify-section--collection-banner + .shopify-section .container {
    border-top: 0 !important;
    box-shadow: none !important;
  }

  /* Last resort: paint any remaining hairline to match the background */
  .shopify-section--collection-banner + .shopify-section {
    border-top-color: #F5F3F0 !important;
  }
}

/* Product swatch hover hide modal on mobile and display correct variant image */
@media (max-width: 999px) {
  .swatch-items--wrapper #variant-popup, .swatch-items--wrapper .show-hover-triangle {display: none!important}
}

/* Fix predictive search products title too big on mobile */
@media (max-width: 767px) {
  .predictive-search__products .product-title {
    font-size: 16px;
    font-weight: 700 !important;
  }
}
/* ===========================
   Bowsers Global Section Headings
   Keep PDP unchanged
   Refined heading styling without affecting Klaviyo forms
   =========================== */

.shopify-section:not(.shopify-section--main-product):not(.klaviyo-form):not([class*="klaviyo"]) 
:is(.h0, .h1, .h2, .h3, .h4) {
    font-family: 'BowsersPoppins', sans-serif !important;
  font-weight: 600 !important;
  letter-spacing: 0.5px !important;
  text-transform: none !important;
  line-height: 1.2 !important;
}

.shopify-section:not(.shopify-section--main-product):not(.klaviyo-form):not([class*="klaviyo"]) 
:is(.smallcaps, .text-subdued, .section-header__subheading) {
  font-family: 'Inter', sans-serif !important;
}

.shopify-section:not(.shopify-section--main-product):not(.klaviyo-form):not([class*="klaviyo"]) 
.smallcaps {
  letter-spacing: 0.12em !important;
}
/* ===========================
   Homepage headings: size only (no alignment)
   =========================== */
.template-index :is(h1, h2, h3, h4).h2 {
  font-size: clamp(30px, 3vw, 46px) !important;
  line-height: 1.15 !important;
}
/* Increase product card title size only */
.product-card .product-title {
  font-size: 1.4rem;
  line-height: 1.25;
}
/* PDP spec table: reset any accidental global font sizing */
.product .product-attribute-specs-table,
.product .product-attribute-specs-table th,
.product .product-attribute-specs-table td,
.product .product-attribute-specs-table p {
  font-size: 14px !important;
  line-height: 1.4 !important;
}

.product .product-attribute-specs-table th {
  font-weight: 600 !important;
}

.product .product-attribute-specs-table td {
  font-weight: 400 !important;
}

/* If the richtext inside cells got oversized */
.product .product-attribute-specs-table .metafield-rich_text_field,
.product .product-attribute-specs-table .metafield-rich_text_field p {
  margin: 0 !important;
  font-size: 14px !important;
  line-height: 1.4 !important;
}

/* Optional: slightly smaller on mobile if it still feels big */
@media (max-width: 699px) {
  .product .product-attribute-specs-table,
  .product .product-attribute-specs-table th,
  .product .product-attribute-specs-table td,
  .product .product-attribute-specs-table p {
    font-size: 13px !important;
  }
}
/* Button sizing (keeps theme colors), excludes PDP */
body:not(.template-product) :where(a.button, button.button) {
  font-family: Inter, sans-serif;

  /* Typography rhythm */
  font-size: 18px;
  line-height: 27px;
  font-weight: 450;
  font-variation-settings: "wght" 450;
  letter-spacing: normal;
  text-transform: capitalize;

  /* Shape + sizing */
  height: 52px;
  padding: 0 24px;
  border-radius: 9999px;

  /* Center text perfectly (works for <a> and <button>) */
  display: inline-flex;
  align-items: center;
  justify-content: center;

  /* Keep borders controlled by theme, but ensure consistency */
  border-width: 1px;
  border-style: solid;
}
/* Cart drawer: make the second button (View cart) a white "ghost" until hover */
#cart-drawer .cart-drawer__footer .button-group > :last-child.button,
#cart-drawer .cart-drawer__footer .button-group > :last-child > .button {
  background: #ffffff !important;
  border-color: transparent !important;
  box-shadow: none !important;
  color: inherit !important;
}

#cart-drawer .cart-drawer__footer .button-group > :last-child.button:hover,
#cart-drawer .cart-drawer__footer .button-group > :last-child > .button:hover {
  background: #EDEBE8 !important; /* Pale Stone */
  border-color: transparent !important;
}
/* Cart drawer: make "Add order note" more visible */
#cart-drawer .cart-drawer__footer .link-faded-reverse {
  font-size: 0.95rem; /* slightly larger */
  text-decoration: underline;
  text-underline-offset: 3px;
  text-decoration-thickness: 1px;
  opacity: 0.9;
}

/* Optional: clearer hover affordance */
#cart-drawer .cart-drawer__footer .link-faded-reverse:hover {
  opacity: 1;
}
/* Cart drawer subtotal restyle */
#cart-drawer .cart-drawer__subtotal {
  padding: 0.75rem 0 0.5rem;
}

/* Use header typography for "Subtotal" */
#cart-drawer .cart-drawer__subtotal-label {
  font-family: var(--heading-font-family);
  font-size: var(--text-h6);
  font-weight: var(--heading-font-weight);
  letter-spacing: var(--heading-letter-spacing);
  text-transform: none;
}

/* Match subtotal price to line-item prices */
#cart-drawer .cart-drawer__subtotal-price {
  font-size: 1.05rem;
  font-weight: 600;
  color: var(--text-color);
}
/* Our Fabrics flow: Back to fabrics link */
#bowsers-back-to-fabrics {
  display: inline-flex;
  align-items: center;
  gap: 10px;

  background: transparent;
  border: 0;
  padding: 0;

  font-family: 'BowsersPoppins', sans-serif;
  font-weight: 600;
  font-size: 14px;
  letter-spacing: 0.4px;

  color: #343739;
  text-decoration: none;
}

/* Double chevron */
#bowsers-back-to-fabrics::before {
  content: "‹‹";
  opacity: 0.6;
  font-size: 18px;
  line-height: 1;
  transform: translateY(-1px);
}

/* Hover */
#bowsers-back-to-fabrics:hover {
  text-decoration: underline;
}
/* Show Back to fabrics only on mobile + tablet */
#bowsers-back-to-fabrics {
  display: inline-flex;
}

@media (min-width: 1000px) {
  #bowsers-back-to-fabrics {
    display: none !important;
  }
}
/* Fabrics flow: remove the dead space where pills used to be */
.pills-block--fabrics-flow {
  margin: 0 !important;
  padding: 0 !important;
}

/* On desktop, hide the entire container, since breadcrumbs are the nav */
@media (min-width: 1000px) {
  .pills-block--fabrics-flow {
    display: none !important;
  }
}
/* Fabrics flow: collapse Prestige section-spacing around the fabrics nav block */
.section-spacing:has([data-bowsers-fabrics-nav]) {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

/* Desktop: since nav is hidden, remove the wrapper entirely to avoid dead space */
@media (min-width: 1000px) {
  .section-spacing:has([data-bowsers-fabrics-nav]) {
    display: none !important;
  }
}

/* Collection pills: collapse the wrapping section entirely when no pills render (no sibling pills to
   show, or a parts collection where pills are intentionally hidden) */
.template-collection .shopify-section--custom-liquid:not(:has(.pills-block)):not(:has([data-bowsers-fabrics-nav])) .section-spacing {
  padding-top: 0 !important;
  padding-bottom: 32px !important;
  border: none !important;
}

/* Tier 2 Breadcrumbs for Our Fabrics */
.bowsers-fabric-crumbs {
  background: #F5F3F0;
  padding: 10px 0;
}

.bowsers-fabric-crumbs__list {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  margin: 0;
  padding: 0;
  list-style: none;
}

.bowsers-fabric-crumbs__item {
  font-family: Inter, sans-serif;
  font-size: 12px;
  line-height: 1.25;
  color: rgba(52,55,57,0.75);
}

.bowsers-fabric-crumbs__item + .bowsers-fabric-crumbs__item::before {
  content: "›";
  display: inline-block;
  margin: 0 8px;
  opacity: 0.35;
  color: #343739;
}

.bowsers-fabric-crumbs__link {
  color: rgba(52,55,57,0.75);
  text-decoration: none;
}

.bowsers-fabric-crumbs__link:hover {
  color: #343739;
  text-decoration: underline;
}

.bowsers-fabric-crumbs [aria-current="page"] {
  color: #343739;
  font-weight: 500;
}
/* Breadcrumb hierarchy polish – applies everywhere */
.breadcrumb__list-item {
  color: rgba(52,55,57,0.65);
  font-weight: 400;
}

.breadcrumb__list-item[aria-current="page"] {
  color: #343739;
  font-weight: 500;
}
/* Force Shop by Fabric to match other mega menu headers */
.mega-menu a.mega-menu__header-link[href*="/pages/our-fabrics"] {
  font-size: 14px !important;
  line-height: 1.4 !important;
}
/* Bowsers: remove Prestige-wide tracked headings/labels */
.h0, .h1, .h2, .h3, .h4, .h5, .h6,
.heading, .section__title, .section-header__title {
  letter-spacing: normal !important;
}
/* Make product card media flush with the card edge across all widths */
.product-card__media {
  padding-left: 0 !important;
  padding-right: 0 !important;
}

.product-card__figure {
  padding-left: 0 !important;
  padding-right: 0 !important;
}

.product-card__media img.product-card__image {
  width: 100% !important;
  max-width: none !important;
  display: block;
}
/* Bowsers cart: reference-style layout */

.shopify-section--main-cart .bowsers-cart-head,
.shopify-section--main-cart .bowsers-cart__table,
.shopify-section--main-cart .bowsers-cart__footer {
  max-width: 860px;
  margin-left: auto;
  margin-right: auto;
}

/* Header: left link + perfectly centered title */
.shopify-section--main-cart .bowsers-cart-head {
  position: relative;
  width: 100%;
  padding-top: 6px;
  padding-bottom: 16px;
}

.shopify-section--main-cart .bowsers-cart-head__back {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 14px;
  text-decoration: none;
  border-bottom: 1px solid currentColor;
  padding-bottom: 2px;
}

.shopify-section--main-cart .bowsers-cart-head__title {
  position: absolute;
  left: 50%;
  top: 0;
  transform: translateX(-50%);
  margin: 0;
  text-align: center;
  width: max-content;
  max-width: 70%;
}
/* Give the header enough height so the absolute title does not overlap */
.shopify-section--main-cart .bowsers-cart-head {
  min-height: 56px;
}

/* Remove underline/line from Continue shopping (covers theme link styles too) */
.shopify-section--main-cart .bowsers-cart-head__back,
.shopify-section--main-cart .bowsers-cart-head__back:hover,
.shopify-section--main-cart .bowsers-cart-head__back:focus,
.shopify-section--main-cart .bowsers-cart-head__back:active {
  text-decoration: none !important;
  border-bottom: none !important;
  box-shadow: none !important;
  background-image: none !important;
}

/* If Prestige draws link underline using pseudo elements, kill those too */
.shopify-section--main-cart .bowsers-cart-head__back::before,
.shopify-section--main-cart .bowsers-cart-head__back::after {
  content: none !important;
}

/* Table tightening like reference */
.shopify-section--main-cart .bowsers-cart__table {
  table-layout: fixed;
  width: 100%;
}

/* Reduce the space below the table before the footer (this is the gap you still see) */
.shopify-section--main-cart .bowsers-cart__table {
  margin-bottom: 14px;
}

.shopify-section--main-cart .bowsers-cart__table th:nth-child(2),
.shopify-section--main-cart .bowsers-cart__table td:nth-child(2) {
  width: 120px;
}

.shopify-section--main-cart .bowsers-cart__table th:nth-child(3),
.shopify-section--main-cart .bowsers-cart__table td:nth-child(3) {
  width: 140px;
}

.shopify-section--main-cart .bowsers-cart__table th,
.shopify-section--main-cart .bowsers-cart__table td {
  padding-top: 18px;
  padding-bottom: 18px;
}

/* Bottom layout: note left, recap right */
.shopify-section--main-cart .bowsers-cart__footer {
  margin-top: 0px;
  display: grid;
  grid-template-columns: 1fr;
  gap: 28px;
  align-items: start;
}

@media (min-width: 900px) {
  .shopify-section--main-cart .bowsers-cart__footer {
    grid-template-columns: 360px 1fr;
    column-gap: 90px;
  }
}

/* Make “Add order note” label bold */
.shopify-section--main-cart .bowsers-cart__note label,
.shopify-section--main-cart .bowsers-cart__note .form__label {
  font-weight: 600;
}

/* Note field like reference */
.shopify-section--main-cart .bowsers-cart__note {
  max-width: 360px;
}

.shopify-section--main-cart .bowsers-cart__note textarea {
  min-height: 120px;
  border-radius: 0;
  resize: vertical;
}

/* Recap: clean, not boxed */
.shopify-section--main-cart .bowsers-cart__recap .cart-recap {
  padding: 0;
  border: 0;
  border-radius: 0;
}

.shopify-section--main-cart .bowsers-cart__recap .h-stack {
  justify-content: space-between;
  margin-bottom: 6px;
}

/* Checkout button sizing like reference, with tighter spacing */
.shopify-section--main-cart .bowsers-cart__recap .button {
  width: 320px;
  max-width: 100%;
  justify-content: center;
  margin-top: 10px;
}
.badge--custom {
  color: white;
}

/* if badge color is light, make text dark */
.badge--custom[style*="#f"],
.badge--custom[style*="#e"],
.badge--custom[style*="#d"],
.badge--custom[style*="#c"],
.badge--custom[style*="#b"] {
  color: #343739;
}
account-login.customer-account-box .dealer-portal-callout {
  margin: 0 0 24px !important;
  padding: 22px 24px !important;
  background: #EDEBE8 !important;
  border: 1px solid rgba(23, 23, 23, 0.10) !important;
  border-radius: 12px !important;
  text-align: center !important;
}

account-login.customer-account-box .dealer-portal-callout__eyebrow {
  margin: 0 0 8px !important;
  font-family: 'BowsersPoppins', sans-serif !important;
  font-size: 22px !important;
  font-weight: 600 !important;
  line-height: 1.2 !important;
  color: #171717 !important;
}

account-login.customer-account-box .dealer-portal-callout__text {
  margin: 0 !important;
  font-family: Inter, sans-serif !important;
  font-size: 15px !important;
  line-height: 1.6 !important;
  color: #343739 !important;
}

account-login.customer-account-box .dealer-portal-callout__button {
  margin-top: 18px !important;
}

account-login.customer-account-box a.dealer-portal-btn,
account-login.customer-account-box a.dealer-portal-btn:visited {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 12px 28px !important;
  min-height: 46px !important;
  border-radius: 999px !important;
  background: #6D7175 !important;
  border: 1px solid #6D7175 !important;
  color: #ffffff !important;
  font-family: Inter, sans-serif !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  line-height: 1 !important;
  text-decoration: none !important;
  text-transform: none !important;
  letter-spacing: 0.2px !important;
  cursor: pointer !important;
  transition: background 0.25s ease, border-color 0.25s ease, color 0.25s ease !important;
}

account-login.customer-account-box a.dealer-portal-btn:hover,
account-login.customer-account-box a.dealer-portal-btn:focus {
  background: #5f6367 !important;
  border-color: #5f6367 !important;
  color: #ffffff !important;
  text-decoration: none !important;
}

account-login.customer-account-box a.dealer-portal-btn:focus-visible {
  outline: 2px solid rgba(109, 113, 117, 0.35) !important;
  outline-offset: 2px !important;
}

/* Remove "Continue Shopping" Button from mobile */
@media screen and (max-width: 699px) {
  .bowsers-cart-head__back {
    display: none !important;
  }

  .bowsers-cart-head {
    justify-content: center;
    text-align: center;
  }

  .bowsers-cart-head__title {
    margin: 0;
  }
}
/* Keep editorial two-up headings lighter */
.bowsers-editorial-two-up__heading-text {
  font-family: 'BowsersPoppinsSemi', sans-serif !important;
  font-weight: 600 !important;
}
/* Header: prevent secondary-nav wrap below ~1165px.
   Measured Aug 13 2026: cart icon dropped to a second row, header
   grew 117px vs 105px. All four declarations are required; partial
   combinations still wrap at 1024px. */
@media (max-width: 1200px) {
  .header {
    padding-inline: 32px;
    column-gap: 24px;
    --header-logo-width: 230px;
  }
  .header__secondary-nav {
    column-gap: 12px;
  }
}