/** Shopify CDN: Minification failed

Line 391:33 Unexpected "var("
Line 392:33 Unexpected "var("

**/
.hero { position: relative; }
.hero__media { position: relative; background: var(--color-surface); overflow: hidden; }
.hero__playback { position: absolute; z-index: 2; inset-inline-end: 0.75rem; inset-block-end: 0.75rem; }
[aria-pressed="false"] [data-icon-play],
[aria-pressed="true"] [data-icon-pause] { display: none; }
.hero__media img, .hero__media video { width: 100%; height: 100%; object-fit: cover; object-position: var(--hero-pos, center center); }
.hero--fit-contain .hero__media img, .hero--fit-contain .hero__media video { object-fit: contain; }
.hero--fixed .hero__media { min-height: var(--hero-h-mobile, 28rem); height: var(--hero-h-mobile, 28rem); }
.hero--adapt .hero__media { aspect-ratio: var(--hero-ratio-mobile, var(--hero-ratio, 4 / 5)); }
.hero--contained .hero__media, .hero--page .hero__media { width: min(calc(100% - (var(--gutter) * 2)), var(--page-width)); margin-inline: auto; }
.hero--narrow .hero__media { width: min(calc(100% - (var(--gutter) * 2)), var(--page-narrow)); margin-inline: auto; }
.hero__content {
  display: grid;
  gap: 0.8rem;
  padding: 1.5rem var(--gutter) 2rem;
  max-width: 40rem;
}
.hero--align-m-center .hero__content { margin-inline: auto; text-align: center; justify-items: center; }
.hero--align-m-start .hero__content { text-align: start; justify-items: start; }
.hero--valign-center .hero__content,
.hero--valign-end .hero__content { position: relative; }
.hero--overlay .hero__content {
  position: absolute;
  inset-inline: 0;
  z-index: 1;
  max-width: none;
  width: min(calc(100% - (var(--gutter) * 2)), var(--page-width));
  margin-inline: auto;
}
.hero--valign-start.hero--overlay .hero__content { top: 1.5rem; bottom: auto; }
.hero--valign-center.hero--overlay .hero__content { top: 50%; transform: translateY(-50%); }
.hero--valign-end.hero--overlay .hero__content { bottom: 1.5rem; top: auto; }
.hero__shade {
  position: absolute;
  inset: 0;
  background: var(--overlay-color, #000);
  opacity: var(--overlay, 0);
  pointer-events: none;
}
.hero--gradient .hero__shade {
  opacity: 1;
  background: linear-gradient(to top, color-mix(in srgb, var(--overlay-color, #000) calc(var(--overlay, 0) * 100%), transparent), transparent 70%);
}
@media (max-width: 749px) {
  .hero--mobile-below .hero__content {
    position: relative;
    inset: auto;
    transform: none;
    width: min(calc(100% - (var(--gutter) * 2)), var(--page-width));
    max-width: 40rem;
  }
  .hero--valign-m-start.hero--overlay:not(.hero--mobile-below) .hero__content { top: 1.25rem; bottom: auto; transform: none; }
  .hero--valign-m-center.hero--overlay:not(.hero--mobile-below) .hero__content { top: 50%; bottom: auto; transform: translateY(-50%); }
  .hero--valign-m-end.hero--overlay:not(.hero--mobile-below) .hero__content { bottom: 1.25rem; top: auto; transform: none; }
  .hero--fit-m-contain .hero__media img,
  .hero--fit-m-contain .hero__media video { object-fit: contain; }
  .hero--fit-m-cover .hero__media img,
  .hero--fit-m-cover .hero__media video { object-fit: cover; }
  .hero--pos-m .hero__media img,
  .hero--pos-m .hero__media video { object-position: var(--hero-pos-mobile, var(--hero-pos, center)); }
  .hero--overlay-m .hero__shade { opacity: var(--overlay-mobile, var(--overlay, 0)); }
}
/* RC28: Light/Dark text only applies when the text sits on the image. Text placed below the image, or a
   hero without media, uses the section color scheme so it always contrasts with its own background. */
.hero--overlay:not(.hero--text) .hero__content--light { color: #fff; }
.hero--overlay:not(.hero--text) .hero__content--light .button--secondary { color: #fff; }
.hero--overlay:not(.hero--text) .hero__content--dark { color: #1c1917; }
@media (max-width: 749px) {
  .hero.hero--mobile-overlay:not(.hero--text) .hero__content.hero__content--light { color: #fff; }
  .hero.hero--mobile-overlay:not(.hero--text) .hero__content.hero__content--dark { color: #1c1917; }
  .hero.hero--mobile-below .hero__content.hero__content--light,
  .hero.hero--mobile-below .hero__content.hero__content--dark,
  .hero.hero--mobile-below .hero__content.hero__content--light .button--secondary { color: inherit; }
}

.slideshow { position: relative; }
.slideshow:focus-visible { outline: 2px solid var(--color-foreground); outline-offset: 2px; }

.banner-products {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--grid-gap);
  width: min(calc(100% - (var(--gutter) * 2)), var(--page-width));
  margin-inline: auto;
  min-width: 0;
}
.banner-products--full { width: 100%; }
.banner-products--narrow { width: min(calc(100% - (var(--gutter) * 2)), var(--page-narrow)); }
.banner-products__banner,
.banner-products__panel,
.banner-products .hero,
.banner-products .hero__media,
.banner-products picture,
.banner-products .grid,
.banner-products .scroller { min-width: 0; max-width: 100%; }
.banner-products .hero__media { width: 100%; }
.banner-products .hero__media img { width: 100%; max-width: 100%; height: 100%; }
.banner-products__panel { display: grid; align-content: start; gap: 0.75rem; }
.banner-products__panel--scroll { overflow: auto; max-height: min(var(--hero-h-mobile, 28rem), 70vh); }
.banner-products__panel .product-card__title { font-size: min(var(--card-title, 0.875rem), 0.875rem); }
.banner-products__panel .product-card__actions .button { min-height: 2.25rem; padding-block: 0.25rem; }
.banner-products__panel.density-compact .product-card__info { gap: 0.15rem; padding-top: 0.3rem; }
.banner-products__panel.density-compact .product-card__title { font-size: 0.8125rem; }
.banner-products__panel.density-compact .product-card__actions .button { min-height: 2rem; }
.banner-products__panel.density-standard .product-card__info { gap: 0.3rem; padding-top: 0.4rem; }
.density-compact .product-card__info { gap: 0.2rem; padding-top: 0.35rem; }
.density-spacious .product-card__info { gap: 0.55rem; padding-top: 0.85rem; }
.shopify-section:has(.banner-products) { overflow-x: clip; max-width: 100%; }
@media (max-width: 989px) {
  .banner-products--products-first .banner-products__banner { order: 2; }
  .banner-products__panel--scroll { max-height: none; overflow: visible; }
}

.category-card {
  display: grid;
  gap: 0.65rem;
  color: inherit;
  text-decoration: none;
  min-width: 0;
}
.category-card__media {
  aspect-ratio: 1;
  overflow: hidden;
  background: var(--color-surface);
  border-radius: var(--radius-image);
  border: var(--border-width) solid var(--color-border);
}
.category-card--circle .category-card__media { border-radius: 999px; }
.category-card--portrait .category-card__media { aspect-ratio: 3 / 4; }
.category-card--card .category-card__media { aspect-ratio: 4 / 3; }
.category-card__media img { width: 100%; height: 100%; object-fit: cover; }
.category-card span { font-size: 0.95rem; }

.banner {
  position: relative;
  display: grid;
  min-height: var(--banner-h-mobile, 18rem);
  overflow: hidden;
  background: var(--color-surface);
  color: inherit;
  text-decoration: none;
}
.banner--fixed { height: var(--banner-h-mobile, 18rem); }
.banner--adapt { min-height: 0; height: auto; }
.banner img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.banner--adapt img { position: relative; height: auto; }
.banner--fit-contain img { object-fit: contain; }
.banner__shade { position: absolute; inset: 0; background: var(--overlay-color, #000); opacity: var(--overlay, 0.2); pointer-events: none; }
.banner--align-center .banner__copy, .banner--align-m-center .banner__copy { justify-items: center; text-align: center; }
.banner--align-end .banner__copy { justify-items: end; text-align: end; }
@media (min-width: 750px) {
  .banner--fixed { min-height: var(--banner-h, 22rem); height: var(--banner-h, 22rem); }
  .banner--align-start .banner__copy { justify-items: start; text-align: start; }
}
.banner__copy {
  position: relative;
  z-index: 1;
  display: grid;
  align-content: end;
  gap: 0.45rem;
  min-height: 18rem;
  padding: 1.5rem;
}
.banner--light { color: #fff; }
.banner--dark { color: #1c1917; }
.showcase .grid,
.showcase .scroller { min-width: 0; max-width: 100%; }

.trust { display: grid; gap: 1.25rem; }
.trust article { display: grid; gap: 0.4rem; justify-items: start; }
.trust.align-center article { justify-items: center; text-align: center; }
.trust__icon { width: 1.75rem; height: 1.75rem; }

.quote { margin: 0; display: grid; gap: 1rem; }
.quote p { font-family: var(--font-heading); font-size: var(--h3); line-height: var(--leading-heading); margin: 0; }
.quote figcaption { color: var(--color-muted); font-size: var(--text-sm); }

.faq details { border-bottom: var(--border-width) solid var(--color-border); }
.faq summary { cursor: pointer; min-height: 3.25rem; display: flex; align-items: center; justify-content: space-between; gap: 1rem; font-size: 1.02rem; }
.faq summary::-webkit-details-marker { display: none; }
.faq details > div { padding-bottom: 1rem; }

.compare { width: 100%; border-collapse: collapse; }
.compare th, .compare td { text-align: start; padding: 0.85rem 0.6rem; border-bottom: var(--border-width) solid var(--color-border); vertical-align: top; }
.compare th { font-family: var(--font-accent); font-size: var(--text-xs); letter-spacing: 0.06em; text-transform: uppercase; }

.ba { position: relative; overflow: hidden; background: var(--color-surface); container-type: inline-size; aspect-ratio: var(--ba-ratio, 3 / 2); }
.ba img { width: 100%; height: 100%; object-fit: cover; display: block; }
.ba__before { position: absolute; inset: 0 auto 0 0; overflow: hidden; width: var(--pos, 50%); }
.ba__before img { width: 100cqi; max-width: none; height: 100%; }
.ba input[type="range"] {
  position: absolute;
  inset-inline: 0;
  bottom: 1rem;
  width: calc(100% - 2rem);
  margin-inline: auto;
}

.hotspots { position: relative; }
.hotspots img { width: 100%; height: auto; }
.hotspot {
  position: absolute;
  width: 1.75rem;
  height: 1.75rem;
  border-radius: 999px;
  border: var(--border-width) solid var(--color-background);
  background: var(--color-foreground);
  color: var(--color-background);
  transform: translate(-50%, -50%);
}

.video-panel { display: grid; gap: 1rem; }
.video-panel__poster { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }

.newsletter__box { display: grid; gap: 1rem; }
.newsletter--split { align-items: center; }
.newsletter form { display: grid; gap: 0.75rem; }
.newsletter .inline { display: flex; gap: 0.5rem; }
.newsletter .inline input { flex: 1; }

.countdown { display: flex; flex-wrap: wrap; gap: 0.75rem; }
.countdown[hidden] { display: none; }
.countdown div { min-width: 4.5rem; padding: 0.8rem; border: var(--border-width) solid var(--color-border); text-align: center; }
.countdown strong { display: block; font-family: var(--font-heading); font-size: var(--h3); font-weight: var(--font-heading-weight); }
.countdown span { font-size: var(--text-xs); letter-spacing: 0.08em; text-transform: uppercase; color: var(--color-muted); }

.timeline { display: grid; gap: 0; }
.timeline--compact .timeline article { padding-block: 0.55rem; }
.timeline article { display: grid; grid-template-columns: 7rem 1fr; gap: 1rem; padding-block: 1rem; border-top: var(--border-width) solid var(--color-border); }

.collage { display: grid; gap: var(--grid-gap); }
.collage img { width: 100%; height: 100%; object-fit: cover; }
.collage__item { overflow: hidden; background: var(--color-surface); border-radius: var(--radius-image); min-height: 10rem; }

.product {
  display: grid;
  gap: 1.5rem;
}
.gallery__stage { background: var(--color-surface); position: relative; border-radius: var(--radius-image); overflow: hidden; }

.sticky-atc {
  position: fixed;
  inset-inline: 0;
  bottom: var(--dock-space, 0px);
  z-index: 24;
  display: none;
  gap: 0.75rem;
  align-items: center;
  justify-content: space-between;
  padding: 0.5rem var(--gutter);
  min-height: 3.25rem;
  max-height: 4.5rem;
  background: var(--color-background);
  border-top: var(--border-width) solid var(--color-border);
}
.sticky-atc[hidden] { display: none !important; }
.sticky-atc p { margin: 0; }

.bundle-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 0.75rem; }
.bundle-list li { display: grid; grid-template-columns: auto 4rem minmax(0, 1fr); gap: 0.75rem; align-items: center; }
.bundle-list .field { grid-column: 1 / -1; }
.bundle-list select { width: 100%; min-height: 48px; }
.bundle-list img { width: 4rem; height: 4rem; object-fit: cover; }

.password-page { min-height: 100vh; display: grid; align-items: center; }
.password-card { display: grid; gap: 1.25rem; padding-block: 3rem; }

.gift-card-page { min-height: 100vh; display: grid; place-items: center; padding: 2rem 1rem; background: #f6f4f1; color: #1c1917; }
.gift-card-sheet { width: min(28rem, 100%); padding: 2rem; background: #fff; border: var(--border-width) solid #e3dcd3; display: grid; gap: 0.75rem; text-align: center; }
.gift-card-sheet code { font-size: 1.25rem; letter-spacing: 0.18em; }

.article__hero img { width: 100%; max-height: 36rem; object-fit: cover; }
.comment { padding-block: 1rem; border-top: var(--border-width) solid var(--color-border); }

.promo-strip { display: grid; gap: 1rem; }
.promo-strip article { display: grid; gap: 0.25rem; }

.empty-state { display: grid; justify-items: center; gap: .75rem; padding: clamp(2rem, 6vw, 4rem) 1rem; text-align: center; color: var(--color-muted); }
.empty-state > p { margin: 0; }
.empty-state__icon { display: grid; place-items: center; width: 3.5rem; height: 3.5rem; border-radius: 50%; background: color-mix(in srgb, var(--color-foreground) 6%, transparent); color: var(--color-foreground); }
.empty-state__icon svg { width: 1.5rem; height: 1.5rem; }
.empty-state__title { color: var(--color-foreground); font-size: var(--h5, 1rem); font-weight: 600; max-width: 32rem; }
.empty-state__hint { max-width: 32rem; }
.empty-state__actions { display: flex; flex-wrap: wrap; justify-content: center; gap: .6rem; margin-top: .5rem; }
.recs-skeleton { display: grid; grid-template-columns: repeat(var(--sk-cols, 4), minmax(0, 1fr)); gap: var(--grid-gap, 1rem); }
@media (max-width: 749px) { .recs-skeleton { --sk-cols: 2; } .recs-skeleton > :nth-child(n + 3) { display: none; } }

@media (min-width: 990px) {
  .hero--align-center .hero__content { text-align: center; justify-items: center; }
  .hero--align-start .hero__content { text-align: start; justify-items: start; }
  .hero--align-end .hero__content { text-align: end; justify-items: end; }
  .hero--valign-start.hero--overlay .hero__content { top: 1.5rem; bottom: auto; transform: none; }
  .hero--valign-center.hero--overlay .hero__content { top: 50%; bottom: auto; transform: translateY(-50%); }
  .hero--valign-end.hero--overlay .hero__content { bottom: 1.5rem; top: auto; transform: none; }
}

@media (min-width: 750px) {
  .hero--fixed .hero__media { min-height: var(--hero-h-desktop, 36rem); height: var(--hero-h-desktop, 36rem); }
  .hero--adapt .hero__media { aspect-ratio: var(--hero-ratio, 16 / 9); height: auto; }
  .banner-products { grid-template-columns: minmax(0, var(--banner-share, 3fr)) minmax(0, var(--panel-share, 2fr)); align-items: stretch; }
  .banner-products--flip > .banner-products__banner { order: 2; }
  .banner-products__panel--scroll { max-height: var(--hero-h-desktop, 32rem); }
  .newsletter--split { grid-template-columns: 1fr 1fr; }
  .collage:not(.collage--grid) { grid-template-columns: 1.3fr 1fr; grid-template-rows: 1fr 1fr; }
  .collage:not(.collage--grid) .collage__item:first-child { grid-row: 1 / span 2; }
  .product { grid-template-columns: minmax(0, 1.15fr) minmax(0, 0.85fr); align-items: start; }
  .promo-strip { grid-template-columns: repeat(3, 1fr); }
  .trust { grid-template-columns: repeat(var(--cols-desktop, 3), minmax(0, 1fr)); }
}

@media (max-width: 749px) {
  .timeline article { grid-template-columns: 1fr; gap: 0.25rem; }
  .compare { display: block; overflow-x: auto; }
}

.toolbar { display: flex; flex-wrap: wrap; gap: 0.75rem 1rem; align-items: center; margin-bottom: 1rem; }
.toolbar__count { margin: 0; }
@media (min-width: 990px) {
  .collection-layout--drawer .mobile-filter-toggle { display: inline-flex; }
  .product { grid-template-columns: minmax(0, var(--media-share, 1.15fr)) minmax(0, var(--info-share, 0.85fr)); }
}
.gallery--carousel .gallery__stage {
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: 85%;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  gap: 0.5rem;
}
@media (max-width: 749px) {
  .gallery--mobile-carousel .gallery__stage {
    display: grid;
    grid-auto-flow: column;
    grid-auto-columns: 88%;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    gap: 0.5rem;
  }
  .gallery--mobile-carousel .gallery__item,
  .gallery--mobile-carousel .gallery__item[hidden] { display: block !important; scroll-snap-align: start; }
  .gallery--mobile-carousel .gallery__thumbs:not(.gallery__thumbs--keep) { display: none; }
  .gallery--stacked:not(.gallery--mobile-carousel) .gallery__nav,
  .gallery--grid:not(.gallery--mobile-carousel) .gallery__nav { display: none; }
}

.product { min-width: 0; }
.product--page { width: min(calc(100% - (var(--gutter) * 2)), var(--page-width)); margin-inline: auto; }
.product--narrow { width: min(calc(100% - (var(--gutter) * 2)), var(--page-narrow)); margin-inline: auto; }
.product--full { width: min(100%, 100%); }
.gallery { display: grid; gap: var(--media-gap, 8px); min-width: 0; }
.gallery--thumbs-left { align-items: start; }
.gallery--grid .gallery__stage,
.gallery--stacked .gallery__stage { display: grid; gap: var(--media-gap, 8px); overflow: visible; }
.gallery--grid .gallery__stage { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.gallery__nav--prev .icon { transform: scaleX(-1); }
.pinfo { min-width: 0; }
.pinfo[hidden] { display: none !important; }
.pinfo--spacious { margin-block: 0.35rem; }
.pinfo__vendor.is-upper { letter-spacing: 0.08em; text-transform: uppercase; }
.pinfo__align-center .price { justify-content: center; }
.description-more .is-clamped {
  display: -webkit-box;
  -webkit-line-clamp: 4;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.description-more .is-open { display: block; -webkit-line-clamp: unset; }
.payment-icons--subtle { display: flex; flex-wrap: wrap; gap: 0.35rem; list-style: none; margin: 0; padding: 0; opacity: 0.8; }
.payment-icons--subtle svg { height: 1.25rem; width: auto; }
.complementary { min-width: 0; }
.complementary.stack { display: grid; gap: 0.65rem; }
.complementary .rail-item { border: var(--border-width) solid var(--color-border); border-radius: 8px; padding: 0.5rem; gap: 0.75rem; min-height: 0; }
.complementary--carousel { --cols-mobile: 1.15; --cols-tablet: 1.3; --cols-desktop: 1.3; --grid-gap: 0.65rem; }
.complementary__item { display: grid; grid-template-columns: 3.5rem minmax(0, 1fr); gap: 0.65rem; align-items: center; color: inherit; text-decoration: none; }
.complementary__item img { width: 3.5rem; height: 4.2rem; object-fit: cover; }
.size-guide { width: min(40rem, calc(100% - 2rem)); border: 0; padding: 1.25rem; background: var(--color-background); color: var(--color-foreground); }
.scroller-wrap { position: relative; min-width: 0; }
.scroller-wrap__nav { display: flex; justify-content: flex-end; gap: 0.35rem; margin-bottom: 0.6rem; }
.scroller-wrap__nav [data-scroll="prev"] .icon { transform: scaleX(-1); }
.collage--grid { grid-template-columns: repeat(var(--cols-mobile, 2), minmax(0, 1fr)); }
.collage__caption { display: block; padding: 0.45rem 0.6rem; font-size: var(--text-sm); }
.promo-strip { grid-template-columns: repeat(var(--cols-mobile, 1), minmax(0, 1fr)); gap: var(--strip-gap, 1rem); }
.trust svg, .trust__icon { width: var(--icon-size, 1.5rem); height: var(--icon-size, 1.5rem); }
.compare-wrap { overflow-x: auto; max-width: 100%; }
.compare--highlight th:nth-child(var(--highlight)),
.compare--highlight td:nth-child(var(--highlight)) { background: var(--color-surface); }
.ba__labels { display: flex; justify-content: space-between; font-size: var(--text-xs); margin-bottom: 0.4rem; }
.hotspots img { object-position: var(--look-focal, center); }
.editorial__layout { display: grid; gap: 1.5rem; align-items: center; }
.editorial__copy { max-width: var(--editorial-measure, 40rem); }
.editorial__media img { width: 100%; height: auto; }
.multicolumn__image { width: min(100%, var(--col-image, 100%)); height: auto; }
.quote--border { border: var(--border-width) solid var(--color-border); padding: 1rem; }
@media (min-width: 750px) {
  .editorial__layout--left, .editorial__layout--right { grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr); }
  .editorial__layout--right .editorial__media { order: 2; }
}
@media (max-width: 749px) {
  .gallery--thumbs-left { grid-template-columns: minmax(0, 1fr); }
  .trust { grid-template-columns: repeat(var(--cols-mobile, 2), minmax(0, 1fr)); }
}
@media (min-width: 750px) {
  .gallery--thumbs-left { grid-template-columns: auto minmax(0, 1fr); }
  .gallery--thumbs-left .gallery__thumbs { flex-direction: column; margin: 0; max-height: 36rem; grid-column: 1; grid-row: 1; }
  .gallery--thumbs-left .gallery__stage { grid-column: 2; }
  .promo-strip { grid-template-columns: repeat(var(--cols-desktop, 3), minmax(0, 1fr)); }
  .collage--grid { grid-template-columns: repeat(var(--cols-desktop, 3), minmax(0, 1fr)); }
}

.compact-rail { min-width: 0; }
.compact-rail--scroll .compact-rail__list { max-height: var(--rail-max, 26rem); overflow: auto; }
.compact-rail--list .compact-rail__list { max-height: none; overflow: visible; }
.compact-rail--surface { background: var(--color-surface); border-radius: var(--rail-radius, 0); padding: 0.5rem; }
.compact-rail--carousel .compact-rail__list {
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: min(18rem, 78vw);
  max-height: none;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  overscroll-behavior-x: contain;
}
.compact-rail--carousel .rail-item { scroll-snap-align: start; }
.compact-rail--border .rail-item { border: var(--border-width) solid var(--color-border); border-radius: var(--rail-radius, 0); background: var(--rail-bg, transparent); }
.compact-rail__heading { margin: 0 0 0.35rem; font-size: var(--text-sm); }
.compact-rail__text { margin: 0 0 0.65rem; font-size: var(--text-sm); }
.rail-item {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 0.65rem;
  align-items: center;
  min-height: var(--rail-row, 4rem);
  min-width: 0;
  padding: 0.35rem;
}
.rail-item--center { text-align: center; }
.rail-item__media {
  width: var(--thumb, 4rem);
  height: var(--thumb, 4rem);
  display: block;
  overflow: hidden;
  background: var(--color-surface);
}
.rail-item__media--portrait { height: calc(var(--thumb, 4rem) * 1.25); }
.rail-item__media--landscape { height: calc(var(--thumb, 4rem) * 0.75); }
.rail-item__media img { width: 100%; height: 100%; object-fit: cover; }
.rail-item__media--contain img { object-fit: contain; }
.rail-item__info { min-width: 0; }
.rail-item__title {
  display: -webkit-box;
  -webkit-line-clamp: var(--lines, 2);
  -webkit-box-orient: vertical;
  overflow: hidden;
  color: inherit;
  text-decoration: none;
  font-size: var(--text-sm);
}
.rail-item__vendor, .rail-item__meta { margin: 0; color: var(--color-muted); font-size: var(--text-xs); }
.rail-item__action { display: flex; align-items: center; justify-content: flex-end; min-width: 0; }
.rail-item__action form { display: flex; align-items: center; gap: 0.35rem; }
.rail-item__action .button--icon {
  width: 2.75rem;
  min-width: 2.75rem;
  height: 2.75rem;
  min-height: 2.75rem;
  padding: 0;
}
.rail-item__qty { width: 3.5rem; min-height: 2.25rem; }
.compact-rail--strip { display: grid; grid-auto-flow: column; grid-auto-columns: min(18rem, 78vw); }
.compact-rail--strip .rail-item { height: 100%; }

.banner-rail {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 0.75rem;
  min-width: 0;
}
.banner-rail__banner, .banner-rail__products { min-width: 0; }
.banner-rail--match .banner-rail__products { min-height: 0; }
.banner-rail .hero { min-height: var(--hero-h-mobile, 20rem); }
.banner-rail .hero.hero--adapt { min-height: 0; height: auto; }
.banner-rail .hero.hero--adapt .hero__media img { height: auto; object-fit: contain; }
.banner-rail .hero.hero--fit-contain .hero__media img { object-fit: contain; }
@media (min-width: 990px) {
  .banner-rail--rail-right { grid-template-columns: minmax(0, var(--banner, 3fr)) minmax(0, var(--rail, 1fr)); align-items: stretch; }
  .banner-rail--rail-left { grid-template-columns: minmax(0, var(--rail, 1fr)) minmax(0, var(--banner, 3fr)); align-items: stretch; }
  .banner-rail--rail-left .banner-rail__banner { order: 2; }
  .banner-rail .hero { min-height: var(--hero-h-desktop, 30rem); height: 100%; }
  .banner-rail .hero.hero--adapt { min-height: 0; height: auto; }
  .banner-rail--rail-hidden-desktop { grid-template-columns: minmax(0, 1fr); }
  .banner-rail--rail-hidden-desktop .banner-rail__products { display: none; }
  .banner-rail--match .compact-rail--scroll .compact-rail__list,
  .banner-rail--max .compact-rail--scroll .compact-rail__list { max-height: var(--rail-max, 100%); overflow: auto; }
  .banner-rail--match .compact-rail--list .compact-rail__list,
  .banner-rail--max .compact-rail--list .compact-rail__list,
  .banner-rail--match .compact-rail--carousel .compact-rail__list,
  .banner-rail--max .compact-rail--carousel .compact-rail__list { max-height: none; overflow: visible; }
  .banner-rail--match .compact-rail--carousel .compact-rail__list,
  .banner-rail--max .compact-rail--carousel .compact-rail__list { overflow-x: auto; }
  .banner-rail--match .banner-rail__products { max-height: 100%; overflow: auto; }
}
@media (max-width: 989px) {
  .banner-rail--rail-hidden-mobile .banner-rail__products { display: none; }
  .banner-rail--m-products .banner-rail__products { order: -1; }
  .compact-rail--m-carousel .compact-rail__list {
    display: grid;
    grid-auto-flow: column;
    grid-auto-columns: min(16rem, 78vw);
    max-height: none;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    overscroll-behavior-x: contain;
  }
  .compact-rail--m-carousel .rail-item { scroll-snap-align: start; }
  .compact-rail--m-grid .compact-rail__list { grid-template-columns: repeat(2, minmax(0, 1fr)); max-height: none; }
  .compact-rail--m-stack .compact-rail__list { max-height: none; }
  .compact-rail--m-hidden { display: none; }
}
.compact-products .rail-item {
  height: 100%;
  box-sizing: border-box;
  gap: 0.85rem;
  padding: var(--card-pad, 0.75rem);
  border-radius: var(--rail-radius, 8px);
  background: transparent;
}
.compact-products .rail-item__info {
  display: grid;
  align-content: center;
  gap: 0.35rem;
  min-width: 0;
}
.compact-products .rail-item__title {
  margin: 0;
  line-height: 1.35;
  line-clamp: var(--lines, 2);
  overflow-wrap: anywhere;
}
.compact-products .rail-item__info .price { margin: 0; }
.compact-products .rail-item__vendor,
.compact-products .rail-item__meta { margin: 0; }
.compact-products--surface .rail-item { background: var(--color-surface); }
.compact-products--border .rail-item { border: var(--border-width) solid var(--color-border); }
.compact-products--shadow .rail-item { box-shadow: var(--shadow-sm); }
.compact-products .rail-item__action .button:not(.button--icon) {
  min-height: 2.5rem;
  padding: 0.5rem 0.8rem;
  white-space: nowrap;
}
.compact-products .scroller { align-items: stretch; }
.compact-products--carousel .scroller { scrollbar-width: none; }
.compact-products--carousel .scroller::-webkit-scrollbar { display: none; }
@media (min-width: 750px) {
  .compact-products:not(.compact-products--carousel) .scroller-wrap__nav,
  .compact-products:not(.compact-products--carousel) .scroller-dots { display: none; }
  .compact-products--scroll .scroller,
  .compact-products--list .scroller {
    display: grid;
    grid-auto-flow: row;
    grid-template-columns: minmax(0, 1fr);
    overflow: visible;
    scroll-snap-type: none;
  }
  .compact-products--scroll .scroller {
    max-height: var(--rail-max, 26rem);
    overflow: auto;
    scrollbar-width: thin;
  }
}
@media (max-width: 749px) {
  .compact-products--m-carousel .scroller {
    grid-auto-columns: 100%;
    overflow-x: auto;
    scrollbar-width: none;
  }
  .compact-products--m-carousel .scroller::-webkit-scrollbar { display: none; }
  .compact-products--m-grid .scroller,
  .compact-products--m-grid .compact-rail__list {
    display: grid;
    grid-auto-flow: row;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-auto-columns: unset;
    max-height: none;
    overflow: visible;
    scroll-snap-type: none;
  }
  .compact-products--m-stack .scroller,
  .compact-products--m-stack .compact-rail__list {
    display: grid;
    grid-auto-flow: row;
    grid-template-columns: minmax(0, 1fr);
    max-height: none;
    overflow: visible;
    scroll-snap-type: none;
  }
  .compact-products--m-grid .scroller-wrap__nav,
  .compact-products--m-grid .scroller-dots,
  .compact-products--m-stack .scroller-wrap__nav,
  .compact-products--m-stack .scroller-dots,
  .compact-products--m-hidden .scroller-wrap__nav,
  .compact-products--m-hidden .scroller-dots { display: none; }
  .compact-products .rail-item__action .button:not(.button--icon) { white-space: normal; }
  /* RC21: two rows side by side are too narrow for thumb + text + button; stack each row vertically. */
  .compact-products--m-grid .rail-item { grid-template-columns: minmax(0, 1fr); align-items: start; align-content: start; }
  .compact-products--m-grid .rail-item__action { justify-content: flex-start; }
}
@media (prefers-reduced-motion: reduce) {
  .compact-products .scroller { scroll-behavior: auto; }
}

.flexible { display: grid; gap: var(--flex-gap, 1rem); min-width: 0; }
.flexible--align-center, .flexible--align-m-center { text-align: center; }
.flexible__icon { display: grid; gap: 0.35rem; justify-items: start; }
.flexible--align-center .flexible__icon { justify-items: center; }
.flexible video, .flexible img, .theme-block img { max-width: 100%; height: auto; }
.theme-block { min-width: 0; }
.theme-block--group { display: grid; gap: var(--group-gap, 1rem); }
.theme-block--button .button { display: inline-flex; }
@media (min-width: 750px) {
  .theme-block--group-row { grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); }
}
@media (min-width: 990px) {
  .flexible--two { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .flexible--align-start { text-align: start; }
}
.quote-block blockquote { margin: 0; }
.quote-block footer { margin-top: 0.75rem; color: var(--color-muted); font-size: var(--text-sm); }
.quote-block--center { text-align: center; }

.wholesale-gate__grid { display: grid; gap: 1.5rem; align-items: center; }
.wholesale-gate__media img { width: 100%; height: auto; }
@media (min-width: 990px) {
  .wholesale-gate__grid { grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.2fr); }
}
.volume-table { width: 100%; border-collapse: collapse; font-size: var(--text-sm); }
.volume-table th, .volume-table td { text-align: start; padding: 0.45rem 0; border-bottom: var(--border-width) solid var(--color-border); }

.hero--fit-contain .hero__image, .hero--fit-contain img { object-fit: contain; }
.hero--fit-cover .hero__image, .hero--fit-cover img { object-fit: cover; }
.hero--fit-adapt .hero__media { aspect-ratio: var(--hero-ratio, 16 / 9); height: auto; }
.hero--fit-adapt .hero__media img { object-fit: contain; height: 100%; width: 100%; }

/* RC19: collapse the section padding while product recommendations are empty */
.shopify-section > .product-recommendations.is-empty { padding-block: 0 !important; }

/* RC21: shared product card, row layout (compact rows, banner rails, Product list "list" layout) */
.rail-item .rail-item__info { display: grid; align-content: center; gap: 0.3rem; min-width: 0; }
.rail-item .rail-item__info > * { margin: 0; }
.rail-item .price { margin: 0; }
.rail-item .product-card__sku { margin: 0; color: var(--color-muted); font-size: var(--text-xs); }
.product-card__badges--inline { position: static; inset: auto; flex-direction: row; flex-wrap: wrap; gap: 0.25rem; z-index: auto; }
.product-card__badges--inline .badge { min-height: 1.25rem; font-size: 0.65rem; }
.rail-item .rail-item__action .button.card-btn { display: inline-flex; align-items: center; justify-content: center; gap: 0.4rem; }
.card-btn__icon { display: none; }
.rail-item .rail-item__action .button.card-btn--icon { width: 2.75rem; min-width: 2.75rem; height: 2.75rem; min-height: 2.75rem; padding: 0; }
.card-btn--icon .card-btn__icon { display: inline-flex; }
.card-btn--icon .card-btn__label,
.card-btn--compact .card-btn__label:empty {
  position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0;
}
.card-btn--compact { font-size: 0.75rem; }
.card-soldout { font-size: var(--text-xs); color: var(--color-muted); white-space: nowrap; text-decoration: underline; text-underline-offset: 0.2em; }
.rail-item__action--gate .button { white-space: normal; }

.product-list--list {
  display: grid;
  grid-template-columns: repeat(var(--cols-desktop, 2), minmax(0, 1fr));
  gap: var(--grid-gap, 16px);
  min-width: 0;
}
.product-list--list .rail-item {
  border: var(--border-width) solid var(--color-border);
  border-radius: 8px;
  padding: 0.75rem;
  gap: 0.85rem;
  min-height: 0;
  height: 100%;
  box-sizing: border-box;
}
@media (min-width: 750px) and (max-width: 989px) {
  .product-list--list { grid-template-columns: repeat(var(--cols-tablet, 2), minmax(0, 1fr)); }
}
@media (max-width: 749px) {
  .product-list--list { grid-template-columns: minmax(0, 1fr); }
  /* Mobile rows always use the icon add-to-cart button. */
  .rail-item .rail-item__action .button.card-btn { width: 2.75rem; min-width: 2.75rem; height: 2.75rem; min-height: 2.75rem; padding: 0; white-space: nowrap; }
  .rail-item .card-btn__icon { display: inline-flex; }
  .rail-item .card-btn__label {
    position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0;
  }
}
@media (max-width: 989px) {
  .compact-rail--m-grid .rail-item { grid-template-columns: minmax(0, 1fr); align-items: start; align-content: start; }
  .compact-rail--m-grid .rail-item__action { justify-content: flex-start; }
}

/* RC21: Banner + products, compact rows in the panel */
.banner-products__rows { display: grid; gap: 0.5rem; min-width: 0; }
.banner-products__rows .rail-item,
.banner-products__rows--carousel .rail-item { border: var(--border-width) solid var(--color-border); border-radius: 8px; padding: 0.5rem; gap: 0.75rem; min-height: 0; }
.banner-products__rows--carousel { --cols-mobile: 1.15; --cols-tablet: 1.6; --cols-desktop: 1.15; --grid-gap: 0.5rem; }
@media (max-width: 989px) {
  .banner-products--panel-hidden-mobile .banner-products__panel { display: none; }
}
/* RC21: keep the visually-hidden button label (mobile icon buttons) inside its card, so it is clipped by
   carousels / rails instead of widening the page. */
.rail-item, .card-btn { position: relative; }

/* RC22: legacy compact / horizontal / banner-rail containers now hold vertical product cards.
   Saved merchant templates keep working; the sideways (image-beside-text) row is gone. */
.compact-products .scroller,
.compact-rail.scroller,
.banner-rail__products .scroller {
  align-items: stretch;
}
.compact-products .product-card,
.compact-rail .product-card,
.banner-rail__products .product-card {
  height: 100%;
  min-width: 0;
}
.compact-products--border .product-card,
.compact-rail--border .product-card {
  border: var(--border-width) solid var(--color-border);
  border-radius: var(--rail-radius, 8px);
  padding: var(--card-pad, 0.5rem);
}
.compact-products--surface .product-card,
.compact-rail--surface .product-card {
  background: var(--color-surface);
}
.compact-products--shadow .product-card {
  box-shadow: var(--shadow-sm);
}
/* Narrow banner rail: 1–2 vertical cards */
.banner-rail__products .compact-rail__list {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
@media (min-width: 990px) {
  .banner-rail__products .compact-rail__list {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
/* Complementary block: vertical cards in a stack or scroller */
.complementary.stack {
  display: grid;
  gap: 0.75rem;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.complementary .product-card {
  border: var(--border-width) solid var(--color-border);
  border-radius: 8px;
  padding: 0.5rem;
  min-width: 0;
}
.complementary--carousel {
  --cols-mobile: 1.4;
  --cols-tablet: 2.2;
  --cols-desktop: 2.4;
  --grid-gap: 0.75rem;
}

/* ===== RC30: shared banner engine (promotional banner, banner + products, banner + product rail) ===== */
.bu { display: grid; gap: var(--grid-gap, 16px); grid-template-columns: minmax(0, 1fr); align-items: start; }
.bu--layout-products_end { grid-template-columns: minmax(0, var(--bu-banner)) minmax(0, var(--bu-panel)); }
.bu--layout-products_start { grid-template-columns: minmax(0, var(--bu-panel)) minmax(0, var(--bu-banner)); }
.bu--layout-products_start .bu__banner { order: 2; }
.bu--layout-products_end, .bu--layout-products_start { align-items: stretch; }
.bu__banner { position: relative; min-width: 0; }
.bu__frame { position: relative; display: grid; grid-template-columns: minmax(0, 1fr); border-radius: var(--bu-radius, 0); overflow: hidden; isolation: isolate; transition: transform .35s ease, box-shadow .35s ease; }
.bu--overlay .bu__media, .bu--overlay .bu__content { grid-area: 1 / 1; }
.bu__media { position: relative; overflow: hidden; width: 100%; min-height: 0; max-height: var(--bu-max-h, none); }
.bu-fit--contain .bu__media { background: var(--bu-contain-bg, var(--color-background)); }
.bu__media picture { display: contents; }
.bu__img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: var(--bu-pos, 50% 50%); transition: transform .6s ease, opacity .45s ease; }
.bu-fit--contain .bu__img, .bu-h--adapt .bu__img { object-fit: contain; }
.bu__img--hover { opacity: 0; }
.bu__shade { position: absolute; inset: 0; background: var(--overlay-color, #000); opacity: var(--overlay, 0); pointer-events: none; transition: opacity .35s ease; }
.bu--stacked .bu__shade { display: none; }
/* Height modes: adapt keeps the image's own ratio, so nothing is cropped. */
.bu-h--adapt .bu__media { aspect-ratio: var(--bu-ratio); }
.bu-h--small .bu__media { height: 320px; }
.bu-h--medium .bu__media { height: 460px; }
.bu-h--large .bu__media { height: 600px; }
.bu-h--full .bu__media { height: calc(100svh - var(--header-height, 0px)); }
.bu--placeholder.bu-h--adapt .bu__media { aspect-ratio: 21 / 9; }
.bu--placeholder .bu__media { background: linear-gradient(135deg, color-mix(in srgb, var(--color-accent, #888) 30%, var(--color-background)), color-mix(in srgb, var(--color-foreground) 14%, var(--color-background))); }
.bu--placeholder .bu__content { color: var(--color-foreground) !important; }
/* Content */
.bu__content { position: relative; z-index: 2; display: flex; padding: var(--bu-pad, 32px); pointer-events: none; min-width: 0; }
.bu__inner { pointer-events: auto; display: grid; gap: .75rem; max-width: 100%; }
.bu-cw--narrow .bu__inner { width: min(100%, 26rem); }
.bu-cw--medium .bu__inner { width: min(100%, 38rem); }
.bu-cw--wide .bu__inner { width: min(100%, 56rem); }
.bu__inner.align-center { text-align: center; justify-items: center; }
.bu__inner.align-end { text-align: end; justify-items: end; }
.bu__inner.align-start { text-align: start; justify-items: start; }
.bu__inner > * { margin: 0; }
.bu__buttons { display: flex; flex-wrap: wrap; gap: .75rem; justify-content: inherit; }
.bu__inner.align-center .bu__buttons { justify-content: center; }
.bu__inner.align-end .bu__buttons { justify-content: flex-end; }
.bu--overlay.bu-text--light:not(.bu--placeholder) .bu__content { color: #fff; }
.bu--overlay.bu-text--dark:not(.bu--placeholder) .bu__content { color: #111; }
.bu--overlay.bu-text--light:not(.bu--placeholder) .bu__content .button--secondary { color: #fff; border-color: currentColor; }
/* 9-grid: horizontal via justify-content, vertical via align-items */
.bu--overlay.bu-pos--top_left .bu__content { align-items: flex-start; justify-content: flex-start; }
.bu--overlay.bu-pos--top_center .bu__content { align-items: flex-start; justify-content: center; }
.bu--overlay.bu-pos--top_right .bu__content { align-items: flex-start; justify-content: flex-end; }
.bu--overlay.bu-pos--middle_left .bu__content { align-items: center; justify-content: flex-start; }
.bu--overlay.bu-pos--center .bu__content { align-items: center; justify-content: center; }
.bu--overlay.bu-pos--middle_right .bu__content { align-items: center; justify-content: flex-end; }
.bu--overlay.bu-pos--bottom_left .bu__content { align-items: flex-end; justify-content: flex-start; }
.bu--overlay.bu-pos--bottom_center .bu__content { align-items: flex-end; justify-content: center; }
.bu--overlay.bu-pos--bottom_right .bu__content { align-items: flex-end; justify-content: flex-end; }
.bu__link { position: absolute; inset: 0; z-index: 1; }
.bu__link:focus-visible { outline: 3px solid var(--color-foreground); outline-offset: -3px; }
.bu__inner a, .bu__inner button { position: relative; z-index: 3; }
/* Products panel */
.bu__panel { min-width: 0; display: grid; gap: 1rem; align-content: start; }
.bu--panel-scroll.bu--layout-products_end .bu__panel, .bu--panel-scroll.bu--layout-products_start .bu__panel { height: 0; min-height: 100%; overflow-y: auto; overscroll-behavior: contain; padding-inline-end: 4px; }
.bu__view-all { justify-self: start; }
@media (max-width: 989px) {
  .bu--layout-products_end, .bu--layout-products_start { grid-template-columns: minmax(0, 1fr); }
  .bu--layout-products_start .bu__banner { order: 0; }
  .bu--m-products .bu__panel { order: -1; }
  .bu--m-hidden .bu__panel { display: none; }
  .bu--panel-scroll .bu__panel { height: auto !important; min-height: 0 !important; overflow: visible !important; }
}
@media (max-width: 749px) {
  .bu-h--adapt .bu__media { aspect-ratio: var(--bu-ratio-m); }
  .bu--placeholder.bu-h--adapt .bu__media { aspect-ratio: 4 / 3; }
  .bu-h--small .bu__media { height: 220px; }
  .bu-h--medium .bu__media { height: 300px; }
  .bu-h--large .bu__media { height: 380px; }
  .bu__img { object-position: var(--bu-pos-m, var(--bu-pos, 50% 50%)); }
  .bu__content { padding: min(var(--bu-pad, 32px), 24px); }
  .bu--overlay.bu-pos-m--below .bu__media, .bu--overlay.bu-pos-m--below .bu__content { grid-area: auto; }
  .bu--overlay.bu-pos-m--below .bu__shade { display: none; }
  .bu--overlay.bu-pos-m--below .bu__content, .bu--overlay.bu-pos-m--below .bu__content .button--secondary { color: inherit !important; }
  .bu--overlay.bu-pos-m--below .bu__content .button--secondary { border-color: currentColor; }
  .bu--overlay.bu-pos-m--top_left .bu__content { align-items: flex-start; justify-content: flex-start; }
  .bu--overlay.bu-pos-m--top_center .bu__content { align-items: flex-start; justify-content: center; }
  .bu--overlay.bu-pos-m--top_right .bu__content { align-items: flex-start; justify-content: flex-end; }
  .bu--overlay.bu-pos-m--middle_left .bu__content { align-items: center; justify-content: flex-start; }
  .bu--overlay.bu-pos-m--center .bu__content { align-items: center; justify-content: center; }
  .bu--overlay.bu-pos-m--middle_right .bu__content { align-items: center; justify-content: flex-end; }
  .bu--overlay.bu-pos-m--bottom_left .bu__content { align-items: flex-end; justify-content: flex-start; }
  .bu--overlay.bu-pos-m--bottom_center .bu__content { align-items: flex-end; justify-content: center; }
  .bu--overlay.bu-pos-m--bottom_right .bu__content { align-items: flex-end; justify-content: flex-end; }
}
/* Hover effects: fine pointer only, never with reduced motion; :focus-within mirrors them for keyboard users. Transforms only, no layout shift. */
@media (hover: hover) and (pointer: fine) and (prefers-reduced-motion: no-preference) {
  .bu-hover--zoom:hover .bu__img, .bu-hover--zoom:focus-within .bu__img { transform: scale(1.04); }
  .bu-hover--lift:hover .bu__frame, .bu-hover--lift:focus-within .bu__frame { transform: translateY(-4px); box-shadow: var(--shadow-lift); }
  .bu-hover--swap:hover .bu__img--hover, .bu-hover--swap:focus-within .bu__img--hover { opacity: 1; }
  .bu-hover--darken:hover .bu__shade, .bu-hover--darken:focus-within .bu__shade { opacity: calc(var(--overlay, 0) + .25); }
  .bu-hover--reveal.bu--overlay .bu__inner { opacity: 0; transform: translateY(10px); transition: opacity .35s ease, transform .35s ease; }
  .bu-hover--reveal.bu--overlay .bu__shade { opacity: 0; }
  .bu-hover--reveal.bu--overlay:hover .bu__inner, .bu-hover--reveal.bu--overlay:focus-within .bu__inner { opacity: 1; transform: none; }
  .bu-hover--reveal.bu--overlay:hover .bu__shade, .bu-hover--reveal.bu--overlay:focus-within .bu__shade { opacity: calc(var(--overlay, 0) + .2); }
  .bu__inner .button { transition: transform .2s ease, box-shadow .2s ease; }
  .bu__inner .button:hover { transform: translateY(-1px); box-shadow: 0 6px 16px -8px rgba(0,0,0,.4); }
  .hero-hover--zoom .hero__media img { transition: transform .6s ease; }
  .hero-hover--zoom:hover .hero__media img, .hero-hover--zoom:focus-within .hero__media img { transform: scale(1.04); }
  .hero-hover--lift { transition: transform .35s ease, box-shadow .35s ease; }
  .hero-hover--lift:hover, .hero-hover--lift:focus-within { transform: translateY(-4px); box-shadow: var(--shadow-lift); }
  .hero-hover--darken .hero__shade { transition: opacity .35s ease; }
  .hero-hover--darken:hover .hero__shade, .hero-hover--darken:focus-within .hero__shade { opacity: calc(var(--overlay, 0) + .25); }
  .bu-hover--brighten .bu__img, .hero-hover--brighten .hero__media img { transition: filter .4s ease; }
  .bu-hover--brighten:hover .bu__img, .bu-hover--brighten:focus-within .bu__img, .hero-hover--brighten:hover .hero__media img { filter: brightness(1.07); }
}
.bu__inner .button:focus-visible { outline: 3px solid currentColor; outline-offset: 3px; }
/* RC30: banner grid adapt ratio, placeholder, row fill and hover */
/* RC30: side-by-side layouts: the banner stretches to the product column so no blank gap is left under it.
   Adapt/contain letterboxes on the contain background (never crops); Cover crops around the focal point. */
@media (min-width: 990px) {
  .bu--layout-products_end .bu__banner, .bu--layout-products_start .bu__banner { display: flex; flex-direction: column; }
  .bu--layout-products_end .bu__frame, .bu--layout-products_start .bu__frame { flex: 1 1 auto; grid-template-rows: minmax(0, 1fr); }
  .bu--layout-products_end .bu__frame, .bu--layout-products_start .bu__frame { background: var(--bu-contain-bg, var(--color-surface, var(--color-background))); }
  .bu--layout-products_end .bu--overlay .bu__media, .bu--layout-products_start .bu--overlay .bu__media { width: 100%; align-self: center; }
  .bu--layout-products_end .bu--overlay.bu-fit--cover .bu__media, .bu--layout-products_start .bu--overlay.bu-fit--cover .bu__media { aspect-ratio: auto; height: 100%; min-height: 0; }
  .bu--layout-products_end .bu--overlay.bu-fit--cover .bu__img, .bu--layout-products_start .bu--overlay.bu-fit--cover .bu__img { object-fit: cover; }
  .bu--layout-products_end .bu--overlay .bu__content, .bu--layout-products_start .bu--overlay .bu__content { align-self: stretch; }
  .bu--layout-products_end .bu--overlay .bu__shade, .bu--layout-products_start .bu--overlay .bu__shade { position: absolute; }
  .bu--layout-products_end .bu--placeholder .bu__media, .bu--layout-products_start .bu--placeholder .bu__media { aspect-ratio: auto; height: 100%; min-height: 320px; }
}
.bu--overlay .bu__kicker { color: inherit; opacity: .85; }

/* RC31: hero content box always spans the page container (same edges as every other section);
   only the copy inside is width-limited, so Start/End text lines up with the page gutter. */
.hero .hero__content { width: min(calc(100% - (var(--gutter) * 2)), var(--page-width)); max-width: none; margin-inline: auto; padding-inline: 0; }
.hero .hero__content > * { max-width: 40rem; }
.hero--narrow .hero__content { width: min(calc(100% - (var(--gutter) * 2)), var(--page-narrow)); }
.hero--overlay .hero__content { padding-inline: clamp(0px, 2vw, 1.5rem); }
.hero--align-m-end .hero__content { text-align: end; justify-items: end; }
.hero .hero__content .section-header { justify-items: inherit; text-align: inherit; }
/* RC31: saved fixed + contain heights become a cap on an adapt-to-image hero: no blank letterbox band. */
.hero--capped .hero__media { max-height: var(--hero-h-mobile, 28rem); background: var(--color-background); }
@media (min-width: 750px) { .hero--capped .hero__media { max-height: var(--hero-h-desktop, 36rem); } }
.hero--capped .hero__media img { object-fit: contain; }
/* RC31: gallery dots: plain buttons in a labelled group (no tablist), 44px hit area, 8px visual dot. */
@media (max-width: 749px) {
  .hero.hero--mobile-below.hero--overlay .hero__content { position: relative; inset: auto; top: auto; bottom: auto; transform: none; padding-block: 1.25rem 0; padding-inline: 0; }
  .hero.hero--mobile-below .hero__shade { display: none; }
}

/* RC31: never hide the selected value, even when it is sold out. */
/* RC31: sold-out values stay readable (AA contrast); strikethrough carries the state, not low opacity. */
/* RC37: tinted sample illustrations */
.hero--ph .hero__media > .media-fallback { position: absolute; inset: 0; min-height: 0; color: color-mix(in srgb, var(--color-foreground) 16%, transparent); }
.hero--ph.hero--adapt .hero__media { aspect-ratio: 16 / 7; }
.bu__media > .bu__ph { position: absolute; inset: 0; min-height: 0; color: color-mix(in srgb, var(--color-foreground) 18%, transparent); }
@media (max-width: 749px) { .hero--ph.hero--adapt .hero__media { aspect-ratio: 4 / 5; } }
@media (min-width: 990px) {
  .hero--ph:not(.hero--align-center) .hero__media > .media-fallback .ph__svg { inset-inline-start: 38%; width: 62%; }
}
@media (max-width: 989px) {
  .hero--ph .hero__media > .media-fallback .ph__svg { inset: 4% 0 auto; height: 50%; }
}

/* RC40: trust bar (icon beside text, optional dividers, mobile scroller) */
.trust--bar article { grid-template-columns: auto minmax(0, 1fr); align-items: center; column-gap: 0.75rem; justify-items: start; text-align: start; }
.trust--bar.align-center article { justify-content: center; justify-items: start; text-align: start; }
.trust--bar .trust__body { display: grid; gap: 0.1rem; min-width: 0; }
.trust--bar h3, .trust--bar .trust__title { margin: 0; font-size: var(--text-sm, 0.875rem); font-family: var(--font-body); font-weight: 600; letter-spacing: 0; }
.trust--bar p { margin: 0; font-size: var(--text-xs, 0.8125rem); }
.trust__body > :first-child { margin-top: 0; }
@media (min-width: 750px) {
  .trust--dividers { column-gap: 0 !important; }
  .trust--dividers article { padding-inline: clamp(0.75rem, 2vw, 1.5rem); }
  .trust--dividers article + article { border-inline-start: var(--border-width, 1px) solid var(--color-border); }
}
@media (max-width: 749px) {
  .trust--bar { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; gap: 1.25rem !important; padding-bottom: 0.25rem; }
  .trust--bar::-webkit-scrollbar { display: none; }
  .trust--bar article { flex: 0 0 auto; max-width: 78%; scroll-snap-align: start; }
}
.trust--stacked .trust__body { display: grid; gap: 0.4rem; }