/** Shopify CDN: Minification failed

Line 3640:494 Expected identifier but found "."
Line 3640:1058 Unexpected "!"

**/
/* Prop Money — sitewide premium polish (duplicate theme, end-of-body cascade) */

:root {
  --pm-page-alt: #f5f5f7;
  --pm-chrome-max: 1560px;
  --pm-chrome-gutter: 48px;
  --pm-chrome-inset: 24px;
  --pm-footer-radius: 28px;
  --pm-footer-bg: #f7f7f8;
  --pm-footer-edge-fade: rgba(0, 0, 0, 0.05);
  --pm-card-border: #e8e8ed;
  --pm-card-shadow: 0 1px 2px rgba(0, 0, 0, 0.03), 0 14px 36px rgba(24, 20, 14, 0.07);
  --pm-card-shadow-soft: 0 1px 2px rgba(0, 0, 0, 0.02), 0 10px 28px rgba(36, 28, 18, 0.05);
}

/* =============================================================================
   Top-of-page spacing fix. A hidden icon-sprite <svg class="icon-star-reference">
   (star rating symbol/clipPath defs, meant to be invisible per the base
   .icon-star-reference rule in theme.css.liquid) was rendering at a visible
   20x20px directly in the body flow, ABOVE the announcement bar — that stray
   20px+ box was the real source of the oversized gap above the black bar.
   Force it back to zero-size/out-of-flow (same technique the base rule uses,
   just boosted with !important so nothing can re-expand it), then set one
   explicit, deterministic margin so the remaining "breathing room" above the
   announcement bar is a controlled ~10px on every breakpoint, not whatever a
   collapsed browser-default margin happens to produce. */
.icon-star-reference {
  position: absolute !important;
  left: -9999px !important;
  top: -9999px !important;
  width: 0 !important;
  height: 0 !important;
  min-width: 0 !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
}

.pm-anno-band {
  margin-top: 10px !important;
}

/* Desktop — announcement band enters with the header (mirrors DS head paint).
   Crisp opacity + tiny rise only; no blur/scale. Projector keeps its own motion. */
@keyframes pm-anno-band-enter {
  from {
    opacity: 0;
    transform: translateY(-4px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@media screen and (min-width: 1024px) {
  @media (prefers-reduced-motion: no-preference) {
    .pm-anno-band,
    .pm-anno-band.pm-header-stagger-reveal--active {
      opacity: 0;
      animation: pm-anno-band-enter 1600ms cubic-bezier(0.22, 1, 0.36, 1) 100ms both;
    }
  }
}

@media (prefers-reduced-motion: reduce) {
  .pm-anno-band,
  .pm-anno-band.pm-header-stagger-reveal--active {
    animation: none !important;
    opacity: 1 !important;
    transform: none !important;
  }
}

/* Mobile — keep the floating announcement pill on a solid white header canvas.
   The final 3px is wrapper padding (not a transparent child margin), so gray or
   colored page backgrounds can never bleed between the pill and header. */
@media screen and (max-width: 1023px) {
  .pm-anno-band {
    margin-top: 0 !important;
    padding: 12px 10px 3px !important;
    background: #ffffff !important;
    background-color: #ffffff !important;
    border: 0 !important;
    box-shadow: none !important;
  }

  .pm-anno-band .announcement-static,
  .pm-anno-band .announcement-static.announcement-rotating,
  .pm-anno-band .announcement-static.announcement-bar {
    margin-bottom: 0 !important;
  }
}

/* Announcement messages — 14px (also set early in premium DS + snippet critical CSS) */
.announcement-static,
.announcement-static.announcement-rotating,
.announcement-static.announcement-bar,
.shopify-section--announcement-bar .announcement-bar,
.site-announcement .announcement-bar {
  font-size: 14px !important;
}

.announcement-static .announcement-bar__text,
.announcement-static .announcement-bar__text a,
.announcement-bar__text,
.announcement-bar__text a,
.announcement-bar-text,
.announcement-bar-text a,
.announcement-rotating .announcement-message,
.announcement-rotating .announcement-message a,
.announcement-bar-text .announcement-message,
.announcement-bar-text .announcement-message a {
  font-size: 14px !important;
}

/* =============================================================================
   Announcement bar — cinema camera / projector detail (desktop only)
   Absolute left gutter; stronger soft beam fades before centered text.
============================================================================= */
.pm-anno-cinema-icon {
  position: absolute;
  left: 15px;
  top: 50%;
  z-index: 3;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  width: 96px;
  height: 30px;
  margin: 0;
  padding: 0;
  pointer-events: none;
  line-height: 0;
  opacity: 0;
  transform: translateY(-50%);
  animation: pm-anno-cinema-fade-in 1200ms ease-out 180ms forwards;
}

.pm-anno-cinema-projector {
  display: block;
  width: 96px;
  height: 30px;
  overflow: visible;
}

.pm-anno-cinema-beam {
  opacity: 0.32;
  transform-origin: 32px 14px;
  animation: pm-anno-cinema-beam 4.3s ease-in-out infinite;
}

.pm-anno-cinema-lens {
  opacity: 0.6;
  transform-box: fill-box;
  transform-origin: center;
  animation: pm-anno-cinema-lens 4.3s ease-in-out infinite;
}

.pm-anno-cinema-reel {
  transform-box: fill-box;
  transform-origin: center;
}

.pm-anno-cinema-reel--one {
  animation: pm-anno-cinema-reel-spin 5.1s linear infinite;
}

.pm-anno-cinema-reel--two {
  animation: pm-anno-cinema-reel-spin 4.3s linear infinite;
}

/* Keep translateY(-50%) in every keyframe so vertical centering never drops */
@keyframes pm-anno-cinema-fade-in {
  from {
    opacity: 0;
    transform: translateY(-50%);
  }
  to {
    opacity: 1;
    transform: translateY(-50%);
  }
}

@keyframes pm-anno-cinema-beam {
  0% { opacity: 0.3; }
  16% { opacity: 0.58; }
  32% { opacity: 0.34; }
  54% { opacity: 0.78; }
  72% { opacity: 0.4; }
  100% { opacity: 0.3; }
}

@keyframes pm-anno-cinema-lens {
  0% { opacity: 0.5; transform: scale(0.96); }
  16% { opacity: 0.9; transform: scale(1.08); }
  32% { opacity: 0.58; transform: scale(1); }
  54% { opacity: 1; transform: scale(1.12); }
  72% { opacity: 0.65; transform: scale(1.03); }
  100% { opacity: 0.5; transform: scale(0.96); }
}

@keyframes pm-anno-cinema-reel-spin {
  from { transform: rotate(0deg); }
  to { transform: rotate(360deg); }
}

@media (prefers-reduced-motion: reduce) {
  .pm-anno-cinema-icon {
    animation: none;
    opacity: 1;
    transform: translateY(-50%);
  }

  .pm-anno-cinema-beam,
  .pm-anno-cinema-lens,
  .pm-anno-cinema-reel--one,
  .pm-anno-cinema-reel--two {
    animation: none;
  }

  .pm-anno-cinema-beam {
    opacity: 0.42;
  }

  .pm-anno-cinema-lens {
    opacity: 0.8;
    transform: none;
  }
}

@media screen and (max-width: 1023px) {
  .pm-anno-cinema-icon {
    display: none;
  }
}

/* =============================================================================
   Bulk Orders — same white page + chrome as sitewide (no gray/white bands)
   ============================================================================= */
body.page-bulk-orders,
body.page-bulk-prop-money {
  background: #ffffff !important;
  background-color: #ffffff !important;
}

body.page-bulk-orders #site-main,
body.page-bulk-prop-money #site-main {
  background: transparent !important;
  background-color: transparent !important;
}

body.page-bulk-orders .shopify-section-group-footer-group > .shopify-section:first-child,
body.page-bulk-prop-money .shopify-section-group-footer-group > .shopify-section:first-child,
body.page-bulk-orders #shopify-section-1696670069836ff4c4,
body.page-bulk-prop-money #shopify-section-1696670069836ff4c4 {
  display: none !important;
  margin: 0 !important;
  padding: 0 !important;
  min-height: 0 !important;
  overflow: hidden !important;
}

body.page-bulk-orders .bulk-page,
body.page-bulk-prop-money .bulk-page {
  background: transparent !important;
  padding: 48px 20px 40px !important;
  margin-bottom: 0 !important;
}

body.page-bulk-orders .bulk-header,
body.page-bulk-prop-money .bulk-header {
  margin-top: 0 !important;
}

body.page-bulk-orders .bulk-capabilities,
body.page-bulk-prop-money .bulk-capabilities {
  background: transparent !important;
  border: none !important;
  border-radius: 0 !important;
  padding: 32px 0 24px !important;
  margin: 16px 0 28px !important;
}

body.page-bulk-orders .bulk-card,
body.page-bulk-prop-money .bulk-card,
body.page-bulk-orders .cap-card,
body.page-bulk-prop-money .cap-card,
body.page-bulk-orders .bulk-capabilities .card,
body.page-bulk-prop-money .bulk-capabilities .card {
  background: #ffffff !important;
  border: 1px solid var(--pm-card-border) !important;
  border-radius: 20px !important;
  box-shadow: var(--pm-card-shadow-soft) !important;
}

body.page-bulk-orders .bulk-form,
body.page-bulk-prop-money .bulk-form {
  background: #ffffff !important;
  border: 1px solid var(--pm-card-border) !important;
  border-radius: 24px !important;
  box-shadow: var(--pm-card-shadow) !important;
  margin-top: 32px !important;
  padding: 28px 28px 8px !important;
}

@media screen and (max-width: 768px) {
  body.page-bulk-orders .bulk-page,
  body.page-bulk-prop-money .bulk-page {
    padding: 40px 12px 32px !important;
  }

  body.page-bulk-orders .bulk-capabilities,
  body.page-bulk-prop-money .bulk-capabilities {
    padding: 24px 0 16px !important;
    margin: 12px 0 20px !important;
  }

  body.page-bulk-orders .bulk-form,
  body.page-bulk-prop-money .bulk-form {
    margin-top: 20px !important;
    padding: 16px 12px 6px !important;
    border-radius: 20px !important;
  }
}

/* =============================================================================
   Header — nav divider (canonical rules in pm-premium-design-system + head critical)
   ============================================================================= */
.site-navigation-wrapper {
  border-top: none !important;
}

body .site-header-main {
  border-bottom: none !important;
}

@media screen and (min-width: 1024px) {
  /* Reserve the divider's own 1px height on the OUTER wrapper at all times
     (transparent when closed). The mega-open rule below used to add a
     brand-new 1px border-top to this element only while open (base state
     was `none`), which grew the wrapper's box by 1px and shifted the whole
     nav row down by 1px whenever Shop opened. Keeping the 1px reserved and
     just swapping its color to transparent/visible means the box height
     never changes between states. */
  .site-navigation-wrapper {
    border-top: 1px solid transparent !important;
  }

  /* Sitewide — contained subtle divider above nav (homepage + all pages) */
  .site-navigation-wrapper .pm-desktop-nav.site-navigation {
    border-top: 1px solid var(--pm-nav-divider, rgba(0, 0, 0, 0.06)) !important;
    margin-top: 0 !important;
    padding-top: 2px !important;
  }

  body .site-header .site-header-main {
    box-shadow: none !important;
  }

  body .site-header:has(.pm-desktop-nav .navmenu-id-shop .navmenu-meganav[data-animation-state="open"]) .site-navigation-wrapper {
    background: #ffffff !important;
    background-color: #ffffff !important;
    border-top: 1px solid var(--pm-nav-divider, rgba(0, 0, 0, 0.06)) !important;
    box-shadow: none !important;
  }

  /* Open state only swaps the divider to transparent — it must NOT touch
     padding-top. The border-top is 1px solid in BOTH states (so its own
     width never changes), but padding-top used to drop 2px -> 0px here,
     shrinking this element's box by 2px whenever Shop opened. Since its
     parent (.site-navigation-wrapper) is `display:flex; align-items:center`,
     that 2px height change re-centered the whole nav row and made it visibly
     shift up by 1px on open / down by 1px on close. Keeping padding-top
     locked at 2px in both states keeps the box height — and therefore the
     nav row's vertical position — perfectly constant. */
  body .site-header:has(.pm-desktop-nav .navmenu-id-shop .navmenu-meganav[data-animation-state="open"]) .site-navigation-wrapper .pm-desktop-nav.site-navigation {
    border-top-color: transparent !important;
    padding-top: 2px !important;
  }
}

/* Mobile / tablet — keep a subtle edge on the header card so its rounded lower
   corners stay visible as a soft line (no heavy floating halo). This MUST match
   the critical head CSS (theme.liquid) exactly so there is no load flash. */
@media screen and (max-width: 1023px) {
  body .site-header-main {
    border-bottom: none !important;
    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.05), 0 4px 12px rgba(0, 0, 0, 0.06) !important;
  }
}

/* Minimal fix — the outer header wrapper stays solid white so the page
   background (e.g. the gray guide page) never shows behind the header. Nothing
   else about the header/nav changes. */
.shopify-section-group-header-group {
  background: #ffffff !important;
  background-color: #ffffff !important;
}

/* Guide page — desktop only: repaint header layers solid white (see comment block
   below for why). On mobile the transparent shell + content tuck must stay so the
   gray .pmg-section fills the header card's rounded-corner notches. */
@media screen and (min-width: 1024px) {
  body:has(.pmg-section) .pm-anno-band,
  body:has(.pmg-section) .shopify-section-group-header-group,
  body:has(.pmg-section) .shopify-section-group-header-group > .shopify-section,
  body:has(.pmg-section) .site-header,
  body:has(.pmg-section) .site-navigation-wrapper,
  body:has(.pmg-section) .utility-bar {
    background: #ffffff !important;
    background-color: #ffffff !important;
  }
}

/* =============================================================================
   Prop Money Guide — desktop: keep PAGE <body> white so the header stack reads
   white through the transparent shell layers. Mobile uses gray body instead (see
   mobile block below) so the rounded header-corner notches show the page color.
   ============================================================================= */
@media screen and (min-width: 1024px) {
  body:has(.pmg-section),
  body:has(.pmg-section) #site-main,
  body:has(.pmg-section) main.site-main {
    background: #ffffff !important;
    background-color: #ffffff !important;
  }
}

/* Guide page — mobile page canvas stays gray, but the complete header shell must
   remain white so colored page backgrounds never bleed between header layers. */
@media screen and (max-width: 1023px) {
  body.page-prop-money-guide,
  body.page-prop-money-guide #site-main,
  body.page-prop-money-guide main.site-main {
    background: #f3f3f4 !important;
    background-color: #f3f3f4 !important;
  }

  body.page-prop-money-guide .shopify-section-group-header-group {
    background: #ffffff !important;
    background-color: #ffffff !important;
  }

  body.page-prop-money-guide .pm-anno-band,
  body.page-prop-money-guide .utility-bar,
  body.page-prop-money-guide .shopify-section-group-header-group > .shopify-section:has(.utility-bar) {
    background: #ffffff !important;
    background-color: #ffffff !important;
  }

  body.page-prop-money-guide .site-header,
  body.page-prop-money-guide .site-header-wrapper,
  body.page-prop-money-guide .shopify-section-group-header-group > .shopify-section:has(.site-header) {
    background: transparent !important;
    background-color: transparent !important;
  }
}

/* Guide page — kill the announcement pill drop shadow (0 8px 30px rgba(0,0,0,.08))
   so no faint gray line shows under the black bar on the white header.
   Use body class (not :has) so the rule applies before .pmg-section is parsed. */
body.page-prop-money-guide .announcement-static,
body.page-prop-money-guide .announcement-static.announcement-rotating,
body.page-prop-money-guide .announcement-static.announcement-bar {
  box-shadow: none !important;
}

/* Header chrome — transparent shell so the white wrapper reads through (no
   gray/white bands around the header card) */
@media screen and (min-width: 1024px) {
  .shopify-section-group-header-group > .shopify-section,
  .site-header-wrapper,
  .site-header,
  .utility-bar,
  .utility-bar.utility-bar--full-width,
  .utility-bar__content,
  .utility-bar__content-left,
  .utility-bar__content-right {
    background: transparent !important;
    background-color: transparent !important;
    border-color: transparent !important;
    box-shadow: none !important;
  }
}

@media screen and (max-width: 1023px) {
  .shopify-section-group-header-group > .shopify-section:has(.site-header),
  .site-header-wrapper,
  .site-header {
    background: transparent !important;
    background-color: transparent !important;
  }
}

/* Verified Use — removed from homepage (compliance lives on product/policy pages only) */
body.template-index .shopify-section.pm-verified-use-section,
body.template-index .pm-verified-use {
  display: none !important;
  margin: 0 !important;
  padding: 0 !important;
  min-height: 0 !important;
  overflow: hidden !important;
}

/* =============================================================================
   Footer — premium rounded panel, soft gradient top fade (no hard line / shadow)
   ============================================================================= */
.shopify-section-group-footer-group,
.shopify-section-group-footer,
#shopify-section-group-footer-group,
#shopify-section-group-footer,
.shopify-section-group-footer-group > .shopify-section,
#shopify-section-group-footer-group > .shopify-section {
  background: transparent !important;
  background-color: transparent !important;
  border: none !important;
  box-shadow: none !important;
  padding-top: 0 !important;
  margin-top: 0 !important;
}

.shopify-section-group-footer-group > .shopify-section:not(:has(footer)),
#shopify-section-group-footer-group > .shopify-section:not(:has(footer)) {
  padding-bottom: 0 !important;
}

footer.legacy-site-footer,
footer.footer-mobile,
.site-footer,
.footer,
footer.apple-footer {
  background: transparent !important;
  background-color: transparent !important;
  border: none !important;
  box-shadow: none !important;
}

/* Desktop — panel on site-footer-wrapper (one fade via ::before only) */
footer.legacy-site-footer .site-footer-wrapper,
.site-footer-wrapper {
  position: relative !important;
  background: var(--pm-footer-bg) !important;
  background-color: var(--pm-footer-bg) !important;
  border: none !important;
  border-top: 0 !important;
  border-radius: var(--pm-footer-radius) var(--pm-footer-radius) 0 0 !important;
  overflow: hidden !important;
  box-shadow: none !important;
  margin-top: 0 !important;
}

/* Mobile / tablet — panel on section shell (one fade via ::before only) */
.shopify-section-group-footer-group > .shopify-section:has(footer.footer-mobile),
#shopify-section-group-footer-group > .shopify-section:has(footer.footer-mobile),
#shopify-section-group-footer-group > .shopify-section.footer-mobile-section,
.shopify-section.footer-mobile-section:has(footer.footer-mobile) {
  position: relative !important;
  background: var(--pm-footer-bg) !important;
  background-color: var(--pm-footer-bg) !important;
  border: none !important;
  border-top: 0 !important;
  border-radius: var(--pm-footer-radius) var(--pm-footer-radius) 0 0 !important;
  overflow: hidden !important;
  box-shadow: none !important;
  margin-top: 0 !important;
}

/* Single soft top edge — outer panel only (never on nested footer elements) */
footer.legacy-site-footer .site-footer-wrapper::before,
.site-footer-wrapper::before,
.shopify-section-group-footer-group > .shopify-section:has(footer.footer-mobile)::before,
#shopify-section-group-footer-group > .shopify-section:has(footer.footer-mobile)::before,
#shopify-section-group-footer-group > .shopify-section.footer-mobile-section::before,
.shopify-section.footer-mobile-section:has(footer.footer-mobile)::before {
  content: "" !important;
  display: block !important;
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  height: 1px !important;
  background: linear-gradient(
    90deg,
    rgba(0, 0, 0, 0),
    var(--pm-footer-edge-fade),
    rgba(0, 0, 0, 0)
  ) !important;
  pointer-events: none !important;
  z-index: 1 !important;
}

/* Remove extra divider on production trust only — do not touch FAQ card */
body.template-index #site-main > .shopify-section:has(> .pm-production-trust) {
  border-bottom: none !important;
  box-shadow: none !important;
}

/* FAQ card — canonical premium card (footer polish must never override) */
body.template-index .pm-home-faq__wrap {
  background: #ffffff !important;
  border: 1px solid #e8e8ed !important;
  border-radius: 24px !important;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.03), 0 14px 36px rgba(24, 20, 14, 0.07) !important;
  box-sizing: border-box !important;
}

body.template-index .shopify-section.pm-home-faq-section {
  overflow: visible !important;
  border: none !important;
  box-shadow: none !important;
}

/* Testimonials — outer card shadow bleed (cascade win) */
body.template-index .shopify-section.pm-tstm-premium--section,
body.template-index .shopify-section:has(> .pm-tstm-premium) {
  overflow: visible !important;
}

body.template-index .pm-tstm-premium,
body.template-index .pm-tstm-premium__inner,
body.template-index .pm-tstm-premium__carousel-wrap,
body.template-index .pm-tstm-premium__carousel,
body.template-index .pm-tstm-premium__carousel.flickity-enabled {
  overflow: visible !important;
}

body.template-index .pm-tstm-premium__carousel-wrap {
  overflow-x: hidden !important;
  overflow-y: visible !important;
}

body.template-index .pm-tstm-premium__carousel .flickity-viewport {
  overflow-x: hidden !important;
  overflow-y: visible !important;
}

@media screen and (min-width: 1024px) {
  body.template-index .shopify-section.pm-tstm-premium--section,
  body.template-index .shopify-section:has(> .pm-tstm-premium) {
    padding-bottom: 48px !important;
  }

  body.template-index .pm-tstm-premium {
    overflow: visible !important;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.02), 0 10px 28px rgba(36, 28, 18, 0.05) !important;
    padding-top: 70px !important;
  }
}

@media screen and (max-width: 1023px) {
  body.template-index .shopify-section.pm-tstm-premium--section,
  body.template-index .shopify-section:has(> .pm-tstm-premium) {
    overflow: visible !important;
  }

  body.template-index .pm-tstm-premium__carousel-wrap {
    overflow-x: hidden !important;
    overflow-y: visible !important;
    padding-bottom: 40px !important;
  }

  body.template-index .pm-tstm-premium__carousel .flickity-viewport {
    padding-bottom: 36px !important;
    box-sizing: content-box !important;
  }
}

/* Footer legal row — integrated, no internal divider (desktop only) */
@media screen and (min-width: 1025px) {
  .site-footer-bottom,
  .site-footer-bottom-inner,
  .site-footer-information,
  .site-footer-credits {
    border-top: none !important;
    border-bottom: none !important;
    box-shadow: none !important;
  }

  .site-footer-bottom::before,
  .site-footer-bottom::after {
    display: none !important;
    content: none !important;
    background: none !important;
  }
}

@media screen and (max-width: 1024px) {
  .shopify-section-group-footer-group > .shopify-section:has(footer.footer-mobile),
  #shopify-section-group-footer-group > .shopify-section:has(footer.footer-mobile),
  #shopify-section-group-footer-group > .shopify-section.footer-mobile-section,
  .shopify-section.footer-mobile-section:has(footer.footer-mobile) {
    padding-left: 16px !important;
    padding-right: 16px !important;
  }

  /* Mobile — dividers around legal block (desktop removal does not apply here) */
  footer.footer-mobile .footer-samgov-text {
    border-top: 1px solid #DEDEDA !important;
    border-bottom: 1px solid #DEDEDA !important;
    box-shadow: none !important;
  }

  footer.footer-mobile .footer-bottom {
    border-top: none !important;
    border-bottom: none !important;
    box-shadow: none !important;
  }

  footer.footer-mobile .footer-samgov-text::before,
  footer.footer-mobile .footer-samgov-text::after,
  footer.footer-mobile .footer-bottom::before,
  footer.footer-mobile .footer-bottom::after {
    display: none !important;
    content: none !important;
    background: none !important;
  }

  footer.footer-mobile {
    box-shadow: none !important;
  }
}

/* =============================================================================
   Mobile landscape header — vertically center row + restore 3-line hamburger
   ============================================================================= */
@media screen and (max-width: 1023px) and (orientation: landscape) {
  .site-header,
  .site-header-wrapper,
  .site-header .site-header-main {
    overflow: visible !important;
  }

  .site-header .site-header-main {
    display: flex !important;
    align-items: center !important;
    flex-wrap: nowrap !important;
    gap: 6px !important;
    padding-top: 8px !important;
    padding-bottom: 8px !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    border-radius: 0 0 var(--pm-ds-radius-lg, 24px) var(--pm-ds-radius-lg, 24px) !important;
    border-top: none !important;
    min-height: 0 !important;
    transition: none !important;
  }

  .site-header .site-header-main-content {
    display: flex !important;
    align-items: center !important;
    align-self: center !important;
    flex: 1 1 auto !important;
    min-width: 0 !important;
    margin: 0 !important;
    overflow: visible !important;
  }

  .site-header-logo,
  .site-header-main .live-search {
    align-self: center !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
  }

  .site-header-main .live-search {
    flex: 1 1 auto !important;
    min-width: 0 !important;
    max-width: 100% !important;
    height: 46px !important;
    min-height: 46px !important;
  }

  /* Hamburger — block layout keeps 3 bars stacked (inline-flex breaks icon) */
  .site-header-menu-toggle {
    position: relative !important;
    top: auto !important;
    bottom: auto !important;
    left: auto !important;
    right: auto !important;
    flex: 0 0 46px !important;
    width: 46px !important;
    min-width: 46px !important;
    height: 46px !important;
    min-height: 46px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    align-self: center !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: visible !important;
    transform: none !important;
    cursor: pointer !important;
  }

  .site-header-menu-toggle--button {
    display: block !important;
    padding: 11px 10px !important;
    margin: 0 !important;
    line-height: normal !important;
    overflow: visible !important;
    transform: none !important;
    box-sizing: border-box !important;
  }

  .site-header-menu-toggle--button .toggle-icon--bar {
    display: block !important;
    width: 22px !important;
    height: 2px !important;
    background-color: currentColor !important;
    opacity: 1 !important;
    overflow: visible !important;
    flex-shrink: 0 !important;
    transform: none !important;
    transform-origin: 1px center !important;
  }

  .site-header-menu-toggle:not(.active) .site-header-menu-toggle--button .toggle-icon--bar {
    transform: none !important;
    opacity: 1 !important;
  }

  .site-header-menu-toggle--button .toggle-icon--bar + .toggle-icon--bar {
    margin-top: 5px !important;
  }

  .site-header-right {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    align-self: center !important;
    flex: 0 0 auto !important;
    height: 46px !important;
    min-height: 46px !important;
    margin: 0 !important;
    padding: 0 !important;
    top: auto !important;
    transform: none !important;
    overflow: visible !important;
  }

  .site-header-cart {
    position: relative !important;
    top: auto !important;
    bottom: auto !important;
    right: auto !important;
    left: auto !important;
    display: flex !important;
    align-items: center !important;
    align-self: center !important;
    flex: 0 0 50px !important;
    width: 50px !important;
    height: 46px !important;
    min-height: 46px !important;
    margin: 0 !important;
    padding: 0 !important;
    transform: none !important;
    overflow: visible !important;
  }

  .site-header-cart--button {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 40px !important;
    height: 40px !important;
    padding: 0 !important;
    margin: 0 !important;
    position: relative !important;
    top: auto !important;
    transform: none !important;
  }

  .site-header-cart--button svg,
  .site-header-cart-icon,
  .site-header-cart-icon svg {
    display: block !important;
    margin: 0 !important;
    transform: none !important;
    top: auto !important;
  }

  .site-header-cart--count,
  .cart-count-badge {
    position: absolute !important;
    top: -1px !important;
    right: auto !important;
    left: calc(100% - 21px) !important;
    transform: none !important;
  }

  .site-header-sticky--scrolled .site-header-menu-toggle,
  .site-header-sticky--scrolled .site-header-cart {
    margin-top: 0 !important;
    top: auto !important;
  }

  /* Logo ↔ search: protected gap; search shrinks, logo never compresses */
  .site-header .site-header-main-content {
    gap: 14px !important;
    column-gap: 14px !important;
  }

  .site-header-logo {
    display: flex !important;
    flex: 0 0 auto !important;
    flex-shrink: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  .site-header-logo .site-logo {
    display: flex !important;
    align-items: center !important;
  }

  .site-header-main .live-search {
    flex: 1 1 auto !important;
    min-width: 0 !important;
    max-width: none !important;
    width: auto !important;
    margin-top: 0 !important;
    margin-right: 0 !important;
  }
}

/* Homepage reviews — cards stay fixed on touch/mobile; page scrolls instead */
@media screen and (max-width: 1023px), screen and (hover: none) {
  body.template-index .pm-tstm-premium__card,
  body.template-index .pm-tstm-premium__card:hover,
  body.template-index .pm-tstm-premium__card:focus,
  body.template-index .pm-tstm-premium__card:active,
  body.template-index .testimonial.pm-tstm-premium__cell,
  body.template-index .testimonial.pm-tstm-premium__cell:hover,
  body.template-index .pm-tstm-premium__cell,
  body.template-index .pm-tstm-premium__cell:hover {
    transform: none !important;
    transition: box-shadow 320ms cubic-bezier(0.25, 0.1, 0.25, 1), border-color 320ms ease !important;
  }

  body.template-index .pm-tstm-premium__read-more,
  body.template-index .pm-tstm-premium__read-more:hover,
  body.template-index .pm-tstm-premium__read-more:focus,
  body.template-index .pm-tstm-premium__read-more:active {
    transform: none !important;
  }

  body.template-index .pm-tstm-premium__carousel .flickity-viewport {
    overflow-y: hidden !important;
  }

  body.template-index .pm-tstm-premium__cell,
  body.template-index .testimonial.pm-tstm-premium__cell {
    vertical-align: top !important;
    align-self: flex-start !important;
  }
}

/* Mobile portrait reviews — equal card height, no clipped shadows */
@media screen and (max-width: 1023px) and (orientation: portrait) {
  body.template-index .pm-tstm-premium,
  body.template-index .pm-tstm-premium__inner,
  body.template-index .pm-tstm-premium__carousel-wrap,
  body.template-index .pm-tstm-premium__carousel,
  body.template-index .pm-tstm-premium__carousel.flickity-enabled {
    overflow: visible !important;
  }

  body.template-index .pm-tstm-premium__carousel-wrap {
    overflow-x: hidden !important;
    overflow-y: visible !important;
    padding-bottom: 24px !important;
  }

  body.template-index .pm-tstm-premium__carousel .flickity-viewport {
    overflow-x: hidden !important;
    overflow-y: visible !important;
    padding-bottom: 12px !important;
    box-sizing: content-box !important;
  }

  body.template-index .pm-tstm-premium__cell,
  body.template-index .testimonial.pm-tstm-premium__cell {
    display: flex !important;
    align-items: stretch !important;
    align-self: stretch !important;
  }

  body.template-index .pm-tstm-premium__card,
  body.template-index .pm-tstm-premium__card:hover,
  body.template-index .pm-tstm-premium__card:focus,
  body.template-index .pm-tstm-premium__card:active {
    height: var(--pm-tstm-portrait-card-h, 268px) !important;
    min-height: var(--pm-tstm-portrait-card-h, 268px) !important;
    display: flex !important;
    flex-direction: column !important;
    box-shadow: none !important;
    border: 1px solid rgba(0, 0, 0, 0.08) !important;
  }

  body.template-index .pm-tstm-premium__quote-body {
    flex: 1 1 auto !important;
    min-height: 0 !important;
  }

  body.template-index .pm-tstm-premium__author {
    margin-top: auto !important;
  }
}

/* =============================================================================
   RealAged collection — banner crop + intro two-column with simulator CTA
   ----------------------------------------------------------------------------
   Scoped to RealAged promo image (RealAged_All_Denom) and intros that contain
   .realaged-simulator-cta. Does not affect card-pattern collections or
   product/homepage .stack-sim-cta.
============================================================================= */

/* A. Banner — match homepage hero placement (below nav, 4px gap) + Franklin eye crop.
   Focal point is also set in snippets/promo-block.liquid (50% 20%) so the
   inline style is correct on first paint — no late jump. */
@media screen and (min-width: 1024px) {
  body.template-collection .shopify-section.promo-mosaic--section:has(.promo-block--image[style*="RealAged_All_Denom"]) {
    margin-top: 0 !important;
    padding-top: 0 !important;
  }

  body.template-collection .shopify-section.promo-mosaic--section:has(.promo-block--image[style*="RealAged_All_Denom"]) .promo-mosaic--container {
    width: calc(100% - var(--pm-chrome-gutter, 48px)) !important;
    max-width: var(--pm-chrome-max, 1560px) !important;
    margin: 4px auto 0 !important;
    padding-top: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    box-sizing: border-box !important;
  }

  body.template-collection .shopify-section.promo-mosaic--section:has(.promo-block--image[style*="RealAged_All_Denom"]) .home-section--content {
    margin-top: 0 !important;
    padding-top: 0 !important;
  }

  body.template-collection .shopify-section.promo-mosaic--section:has(.promo-block--image[style*="RealAged_All_Denom"]) .promo-mosaic--height-small .promo-mosaic--inner.promo-mosaic--layout-1 .promo-block,
  body.template-collection .shopify-section.promo-mosaic--section:has(.promo-block--image[style*="RealAged_All_Denom"]) .promo-mosaic--height-small .promo-mosaic--inner.promo-mosaic--layout-1 .promo-block--content,
  body.template-collection .promo-mosaic--section .promo-block.promo-block--image[style*="RealAged_All_Denom"],
  body.template-collection .promo-mosaic--section .promo-block.promo-block--image[style*="RealAged_All_Denom"] .promo-block--content {
    height: 280px !important;
    min-height: 280px !important;
    max-height: 280px !important;
  }

  body.template-collection .promo-mosaic--section .promo-block--image[style*="RealAged_All_Denom"] {
    background-position: 50% 20% !important;
    border-radius: 28px !important;
  }

  body.template-collection .promo-mosaic--section .promo-block--image[style*="RealAged_All_Denom"] img.promo-block--background,
  body.template-collection .promo-mosaic--section .promo-block--image[style*="RealAged_All_Denom"] .promo-block--background {
    object-position: 50% 20% !important;
  }
}

@media screen and (min-width: 750px) and (max-width: 1023px) {
  body.template-collection .shopify-section.promo-mosaic--section:has(.promo-block--image[style*="RealAged_All_Denom"]) {
    margin-top: -24px !important;
    padding-top: 0 !important;
    position: relative !important;
    z-index: 1 !important;
  }

  body.template-collection .shopify-section.promo-mosaic--section:has(.promo-block--image[style*="RealAged_All_Denom"]) .promo-mosaic--container {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  body.template-collection .shopify-section.promo-mosaic--section:has(.promo-block--image[style*="RealAged_All_Denom"]) .promo-mosaic--inner,
  body.template-collection .shopify-section.promo-mosaic--section:has(.promo-block--image[style*="RealAged_All_Denom"]) .home-section--content {
    margin: 0 !important;
    padding: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  body.template-collection .shopify-section.promo-mosaic--section:has(.promo-block--image[style*="RealAged_All_Denom"]) .promo-mosaic--height-small .promo-mosaic--inner.promo-mosaic--layout-1 .promo-block,
  body.template-collection .shopify-section.promo-mosaic--section:has(.promo-block--image[style*="RealAged_All_Denom"]) .promo-mosaic--height-small .promo-mosaic--inner.promo-mosaic--layout-1 .promo-block--content,
  body.template-collection .promo-mosaic--section .promo-block.promo-block--image[style*="RealAged_All_Denom"],
  body.template-collection .promo-mosaic--section .promo-block.promo-block--image[style*="RealAged_All_Denom"] .promo-block--content {
    height: 260px !important;
    min-height: 260px !important;
    max-height: 260px !important;
  }

  body.template-collection .promo-mosaic--section .promo-block--image[style*="RealAged_All_Denom"] {
    background-position: 50% 22% !important;
    border-radius: 0 0 24px 24px !important;
  }

  body.template-collection .promo-mosaic--section .promo-block--image[style*="RealAged_All_Denom"] img.promo-block--background,
  body.template-collection .promo-mosaic--section .promo-block--image[style*="RealAged_All_Denom"] .promo-block--background {
    object-position: 50% 22% !important;
  }
}

@media screen and (max-width: 749px) {
  body.template-collection .shopify-section.promo-mosaic--section:has(.promo-block--image[style*="RealAged_All_Denom"]) {
    margin-top: -24px !important;
    padding-top: 0 !important;
    position: relative !important;
    z-index: 1 !important;
  }

  body.template-collection .shopify-section.promo-mosaic--section:has(.promo-block--image[style*="RealAged_All_Denom"]) .promo-mosaic--container {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  body.template-collection .shopify-section.promo-mosaic--section:has(.promo-block--image[style*="RealAged_All_Denom"]) .promo-mosaic--inner,
  body.template-collection .shopify-section.promo-mosaic--section:has(.promo-block--image[style*="RealAged_All_Denom"]) .home-section--content {
    margin: 0 !important;
    padding: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  body.template-collection .shopify-section.promo-mosaic--section:has(.promo-block--image[style*="RealAged_All_Denom"]) .promo-mosaic--height-small .promo-mosaic--inner.promo-mosaic--layout-1 .promo-block,
  body.template-collection .shopify-section.promo-mosaic--section:has(.promo-block--image[style*="RealAged_All_Denom"]) .promo-mosaic--height-small .promo-mosaic--inner.promo-mosaic--layout-1 .promo-block--content,
  body.template-collection .promo-mosaic--section .promo-block.promo-block--image[style*="RealAged_All_Denom"],
  body.template-collection .promo-mosaic--section .promo-block.promo-block--image[style*="RealAged_All_Denom"] .promo-block--content {
    height: 220px !important;
    min-height: 220px !important;
    max-height: 220px !important;
  }

  body.template-collection .promo-mosaic--section .promo-block--image[style*="RealAged_All_Denom"] {
    background-position: 50% 24% !important;
    border-radius: 0 0 24px 24px !important;
  }

  body.template-collection .promo-mosaic--section .promo-block--image[style*="RealAged_All_Denom"] img.promo-block--background,
  body.template-collection .promo-mosaic--section .promo-block--image[style*="RealAged_All_Denom"] .promo-block--background {
    object-position: 50% 24% !important;
  }
}

/* B–D. Description left + compact simulator right (desktop); stack on mobile */
body.template-collection .productgrid--masthead .collection-intro .pm-realaged-seo-links {
  margin: 14px 0 0 !important;
  padding: 0 !important;
  max-width: none !important;
  min-width: 0 !important;
  font-size: 15px !important;
  line-height: 1.6 !important;
  color: #555555 !important;
}

body.template-collection .productgrid--masthead .collection-intro .pm-realaged-seo-links a {
  color: #555555 !important;
  font-weight: inherit !important;
  background: none !important;
  text-decoration: underline !important;
  text-decoration-thickness: 0.75px !important;
  text-underline-offset: 3px !important;
  text-decoration-color: rgba(17, 17, 17, 0.28) !important;
}

body.template-collection .productgrid--masthead .collection-intro .pm-realaged-seo-links a:hover {
  color: #555555 !important;
  font-weight: inherit !important;
  background: none !important;
  text-decoration-color: rgba(17, 17, 17, 0.7) !important;
}

@media screen and (min-width: 1024px) {
  body.template-collection .productgrid--masthead .collection-intro:has(.realaged-simulator-cta) {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) minmax(360px, 430px) !important;
    gap: 40px !important;
    align-items: start !important;
    width: 100% !important;
    max-width: none !important;
    box-sizing: border-box !important;
  }

  body.template-collection .productgrid--masthead .collection-intro:has(.realaged-simulator-cta) > style {
    grid-column: 1 / -1 !important;
    height: 0 !important;
    width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
    border: 0 !important;
  }

  body.template-collection .productgrid--masthead .collection-intro:has(.realaged-simulator-cta) .collection-description {
    grid-column: 1 !important;
    grid-row: 1 !important;
    min-width: 0 !important;
    width: 100% !important;
    max-width: none !important;
  }

  /* Keep SEO line in the left column — never a third grid item beside the CTA */
  body.template-collection .productgrid--masthead .collection-intro:has(.realaged-simulator-cta) .pm-realaged-seo-links {
    grid-column: 1 !important;
    grid-row: 2 !important;
    margin-top: 14px !important;
  }

  body.template-collection .productgrid--masthead .collection-intro:has(.realaged-simulator-cta) .realaged-simulator-cta {
    grid-column: 2 !important;
    grid-row: 1 / span 2 !important;
    align-self: start !important;
    margin-top: 0 !important;
    padding: 22px 24px !important;
    width: 100% !important;
    max-width: 430px !important;
    justify-self: end !important;
    box-sizing: border-box !important;
    border-radius: 22px !important;
    box-shadow:
      0 1px 2px rgba(0, 0, 0, 0.03),
      0 10px 28px rgba(36, 28, 18, 0.05) !important;
  }

  body.template-collection .productgrid--masthead .collection-intro:has(.realaged-simulator-cta) .realaged-simulator-cta__content {
    max-width: none !important;
    width: 100% !important;
  }
}

@media screen and (max-width: 1023px) {
  body.template-collection .productgrid--masthead .collection-intro:has(.realaged-simulator-cta) {
    display: block !important;
    width: 100% !important;
    max-width: none !important;
  }

  body.template-collection .productgrid--masthead .collection-intro:has(.realaged-simulator-cta) .collection-description {
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
  }

  body.template-collection .productgrid--masthead .collection-intro:has(.realaged-simulator-cta) .pm-realaged-seo-links {
    margin-top: 12px !important;
    margin-bottom: 0 !important;
  }

  body.template-collection .productgrid--masthead .collection-intro:has(.realaged-simulator-cta) .realaged-simulator-cta {
    margin-top: 18px !important;
    padding: 20px 22px !important;
    width: 100% !important;
    max-width: none !important;
    box-sizing: border-box !important;
    border-radius: 22px !important;
    box-shadow:
      0 1px 2px rgba(0, 0, 0, 0.03),
      0 10px 28px rgba(36, 28, 18, 0.05) !important;
  }

  body.template-collection .productgrid--masthead .collection-intro:has(.realaged-simulator-cta) .realaged-simulator-cta__content {
    max-width: none !important;
  }
}

/* =============================================================================
   Collection pages — intro two-column (card-pattern only) + poster row
   ----------------------------------------------------------------------------
   Card-pattern admin HTML: .collection-description > __intro + *-cards.
   Flat collections without cards stay single-column (RealAged uses block above).
   Posters: collection-poster-list-target only — never homepage marquee.
============================================================================= */

/* Beat admin-embedded max-width: 1050px / 980px on card-pattern wrappers */
body.template-collection .productgrid--masthead .collection-intro .collection-description:has([class$="-cards"]),
body.template-collection .productgrid--masthead .collection-intro .collection-description:has([class$="-cards"]) [class*="__intro"] {
  max-width: none !important;
  width: 100% !important;
  box-sizing: border-box !important;
}

@media screen and (min-width: 1024px) {
  body.template-collection .productgrid--masthead .collection-intro .collection-description:has([class$="-cards"]) {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) minmax(360px, 450px) !important;
    gap: 40px !important;
    align-items: start !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    margin-bottom: 28px !important; /* admin was 44px — shorter masthead */
  }

  /* Keep embedded <style> from occupying a grid cell */
  body.template-collection .productgrid--masthead .collection-intro .collection-description:has([class$="-cards"]) > style {
    grid-column: 1 / -1 !important;
    height: 0 !important;
    width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
    border: 0 !important;
  }

  /* Left: fill available space beside the compact card column */
  body.template-collection .productgrid--masthead .collection-intro .collection-description:has([class$="-cards"]) [class*="__intro"] {
    grid-column: 1 !important;
    max-width: none !important;
    width: 100% !important;
    min-width: 0 !important;
  }

  /* Right: compact premium card stack, pinned to the trailing edge */
  body.template-collection .productgrid--masthead .collection-intro .collection-description:has([class$="-cards"]) [class$="-cards"] {
    grid-column: 2 !important;
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 11px !important;
    margin-top: 0 !important;
    min-width: 0 !important;
    width: 100% !important;
    max-width: 450px !important;
    justify-self: end !important;
  }

  /* Tighten each info card — beat admin padding: 24px without losing premium feel */
  body.template-collection .productgrid--masthead .collection-intro .collection-description:has([class$="-cards"]) [class$="-card"] {
    padding: 18px 20px !important;
    min-height: 0 !important;
    box-sizing: border-box !important;
  }

  body.template-collection .productgrid--masthead .collection-intro .collection-description:has([class$="-cards"]) [class$="-card"] > span {
    margin-bottom: 6px !important;
  }

  body.template-collection .productgrid--masthead .collection-intro .collection-description:has([class$="-cards"]) [class$="-card"] > p {
    margin: 0 !important;
    line-height: 1.45 !important;
  }
}

@media screen and (max-width: 1023px) {
  body.template-collection .productgrid--masthead .collection-intro .collection-description:has([class$="-cards"]) {
    display: block !important;
    max-width: none !important;
    width: 100% !important;
  }

  body.template-collection .productgrid--masthead .collection-intro .collection-description:has([class$="-cards"]) [class*="__intro"] {
    max-width: none !important;
    width: 100% !important;
  }

  body.template-collection .productgrid--masthead .collection-intro .collection-description:has([class$="-cards"]) [class$="-cards"] {
    margin-top: 22px !important;
    min-width: 0 !important;
    width: 100% !important;
  }
}

/* Collection posters — single clean horizontal row on desktop (no JS marquee) */
@media screen and (min-width: 1024px) {
  body.template-collection section.logolist--container.collection-poster-list-target .logolist--inner,
  body.template-collection section.logolist--container.collection-poster-list-target .home-section--content.logolist--inner {
    display: flex !important;
    flex-wrap: nowrap !important;
    overflow-x: auto !important;
    overflow-y: visible !important;
    gap: 16px !important;
    align-items: flex-start !important;
    scroll-snap-type: none !important;
    -webkit-overflow-scrolling: touch !important;
    scrollbar-width: thin !important;
    padding-bottom: 8px !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  body.template-collection section.logolist--container.collection-poster-list-target .logolist--inner > *,
  body.template-collection section.logolist--container.collection-poster-list-target .logolist--inner .logolist--item {
    flex: 0 0 200px !important;
    width: auto !important;
    max-width: none !important;
    margin: 0 !important;
    display: flex !important;
    justify-content: center !important;
    align-self: flex-start !important;
    align-items: flex-start !important;
    transform: none !important;
    height: auto !important;
  }

  body.template-collection section.logolist--container.collection-poster-list-target .logolist--link,
  body.template-collection section.logolist--container.collection-poster-list-target .logolist--inner picture {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    overflow: hidden !important;
    border-radius: 16px !important;
  }

  body.template-collection section.logolist--container.collection-poster-list-target .logolist--image,
  body.template-collection section.logolist--container.collection-poster-list-target .logolist--image:hover,
  body.template-collection section.logolist--container.collection-poster-list-target .logolist--image:active,
  body.template-collection section.logolist--container.collection-poster-list-target .logolist--item:hover .logolist--image,
  body.template-collection section.logolist--container.collection-poster-list-target .logolist--item:active .logolist--image,
  body.template-collection section.logolist--container.collection-poster-list-target img.logolist--image {
    width: 100% !important;
    height: auto !important;
    max-height: 280px !important;
    object-fit: contain !important;
    object-position: top center !important;
    transform: none !important;
    transition: none !important;
    border-radius: 16px !important;
    display: block !important;
  }

  body.template-collection section.logolist--container.collection-poster-list-target [data-rimg-canvas] {
    display: none !important;
  }
}

/* Collection pages — equal card rhythm, pinned ATC, tighter desktop grid */
body.template-collection #gf-grid .productitem,
body.template-collection .collection--section .productgrid--item .productitem {
  display: flex !important;
  flex-direction: column !important;
  height: 100% !important;
  padding-bottom: 0 !important;
  box-sizing: border-box !important;
}

body.template-collection #gf-grid .productitem__container,
body.template-collection .collection--section .productitem__container {
  display: flex !important;
  flex-direction: column !important;
  flex: 1 1 auto !important;
  height: 100% !important;
  min-height: 100% !important;
}

body.template-collection #gf-grid .productitem__image-container,
body.template-collection #gf-grid .productitem--image-link,
body.template-collection .collection--section .productitem__image-container,
body.template-collection .collection--section .productitem--image-link {
  flex-shrink: 0 !important;
}

body.template-collection #gf-grid .productitem--info,
body.template-collection .collection--section .productitem--info {
  display: flex !important;
  flex-direction: column !important;
  flex: 1 1 auto !important;
  flex-grow: 1 !important;
  gap: 4px !important;
  padding: 8px 0 0 !important;
  margin: 0 !important;
}

body.template-collection #gf-grid .productitem--title,
body.template-collection .collection--section .productitem--title {
  margin: 0 !important;
  min-height: calc(1.3em * 2 + 2px) !important;
  flex-shrink: 0 !important;
}

body.template-collection #gf-grid .productitem--title a,
body.template-collection .collection--section .productitem--title a {
  display: -webkit-box !important;
  -webkit-line-clamp: 2 !important;
  -webkit-box-orient: vertical !important;
  overflow: hidden !important;
  line-height: 1.3 !important;
  margin: 0 !important;
}

body.template-collection #gf-grid .jdgm-preview-badge,
body.template-collection #gf-grid .jdgm-widget.jdgm-preview-badge,
body.template-collection .collection--section .jdgm-preview-badge,
body.template-collection .collection--section .productitem__container > .jdgm-widget.jdgm-preview-badge {
  min-height: 22px !important;
  margin: 0 !important;
  flex-shrink: 0 !important;
}

body.template-collection #gf-grid .productitem--price,
body.template-collection #gf-grid .productitem__price,
body.template-collection .collection--section .productitem--price,
body.template-collection .collection--section .productitem__price {
  min-height: calc(1.35em * 2) !important;
  margin: 0 !important;
  flex-shrink: 0 !important;
}

body.template-collection #gf-grid .productitem--actions,
body.template-collection .collection--section .productitem--actions {
  margin-top: auto !important;
  flex-shrink: 0 !important;
  padding: 8px 0 22px !important; /* was 8px 0 12px — +10px under ATC */
  position: relative !important;
  bottom: auto !important;
  visibility: visible !important;
  opacity: 1 !important;
  width: 100% !important;
  box-sizing: border-box !important;
}

/* Product cards sitewide — +10px breathing room under Add to Cart
   Covers homepage featured, collections, search, and standard product grids.
   Only padding-bottom; title/price/reviews/image/button size unchanged. */
.productitem--actions,
.productitem__actions,
.productgrid--item .productitem--actions,
#gf-grid .productitem--actions,
#gf-grid .productitem__actions,
.featured-collection--section .productitem--actions,
.featured-collection--section .productitem__actions {
  padding-bottom: 22px !important; /* was 10–12px */
}

@media screen and (min-width: 1024px) {
  body.template-collection #gf-grid #gf-products.productgrid--items,
  body.template-collection #gf-grid .productgrid--items,
  body.template-collection .collection--section .productgrid--items {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 12px !important;
    align-items: stretch !important;
  }

  body.template-collection #gf-grid .productgrid--item,
  body.template-collection .collection--section .productgrid--item {
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 6px !important;
    display: flex !important;
    align-items: stretch !important;
  }
}

/* =============================================================================
   Mobile — page content tucks UNDER the floating header/search card so the
   page shows around its rounded bottom corners (like the homepage). This
   removes the white line / corner gap at the top of non-homepage templates.
   The header card (.site-header-main, 24px radius) stays on top; the first
   content is pulled up ~1 corner-radius so the page background fills the
   rounded-corner notches instead of exposing header background.
   ============================================================================= */
@media screen and (max-width: 1023px) {
  /* Header card floats above content; no shadow so no visible line. */
  .site-header,
  .site-header-main {
    position: relative !important;
    z-index: 20 !important;
  }

  /* Kill the theme's conditional bottom shadow on .site-header
     (theme.css: box-shadow 0 1px 4px when header bg == page bg) — that
     full-width hairline is the "line" circled at the top of the page. */
  .site-header,
  .site-header-wrapper {
    box-shadow: none !important;
  }

  /* Pull the first content up one corner radius so the page background wraps
     the header's rounded bottom corners (money image on home, gray on the
     guide, white elsewhere) — the page reads as continuing UNDER the header. */
  body:not(.template-index) #site-main,
  body:not(.template-index) main.site-main {
    position: relative !important;
    z-index: 1 !important;
    margin-top: -24px !important;
  }

  /* Prop Money Guide — floating shell; gray body fills corner notches, not tucked content. */
  html body.page-prop-money-guide:not(.template-index) #site-main,
  html body.page-prop-money-guide:not(.template-index) main.site-main {
    margin-top: 0 !important;
  }
}


/* Guide page — crisp separation above the footer so the light-gray footer panel
   doesn't blend into the gray page. */
body:has(.pmg-section) .site-footer-wrapper,
body:has(.pmg-section) .shopify-section-group-footer-group > .shopify-section:has(footer.footer-mobile),
body:has(.pmg-section) #shopify-section-group-footer-group > .shopify-section:has(footer.footer-mobile),
body:has(.pmg-section) .shopify-section.footer-mobile-section:has(footer.footer-mobile) {
  border-top: 1px solid #ececec !important;
}

/* =============================================================================
   Collection pages — mobile/tablet overflow guard
   The Globo filter sidebar (#gf-tree) renders inline next to #gf-grid at these
   widths. Some rules force a fixed column count while grid items keep a
   min-width: 240px, so the sidebar + grid row exceeds the viewport — the last
   card gets cut off and the fixed chat bubble is pushed off-screen. Letting the
   items shrink and clipping stray horizontal overflow keeps everything on-screen.
   ============================================================================= */
@media screen and (max-width: 1023px) {
  body.template-collection #gf-grid .productgrid--item,
  body.template-collection .collection--section .productgrid--item {
    min-width: 0 !important;
    max-width: 100% !important;
  }

  body.template-collection #gf-grid,
  body.template-collection #gf-grid .productgrid--items,
  body.template-collection #gf-grid #gf-products.productgrid--items {
    max-width: 100% !important;
    box-sizing: border-box !important;
  }

  /* Prevent the sidebar + grid row from creating page-level horizontal scroll
     (which is what shifts the fixed chat widget partially off the screen). */
  body.template-collection .productgrid--outer,
  body.template-collection .collection--section {
    max-width: 100% !important;
    overflow-x: clip !important;
  }
}

/* =============================================================================
   Collection pages — bottom "Best Sellers" featured-collection carousel
   The theme sizes each product image to its OWN aspect ratio
   (--product-grid-item-image-aspect-ratio). This collection mixes portrait and
   landscape product photos, so carousel cards get very different image heights —
   the tall ones push their title/price below the fold (the "broken" look, with
   only the middle card showing full info). Force a uniform square crop (matching
   the main grid's square thumbnails) and equal card heights so every card is the
   same size with its info visible.
   ============================================================================= */
body.template-collection .featured-collection--section .productitem--image {
  aspect-ratio: 1 / 1 !important;
  height: auto !important;
  padding-bottom: 0 !important;
  width: 100% !important;
  overflow: hidden !important;
}

body.template-collection .featured-collection--section .productitem--image img,
body.template-collection .featured-collection--section .productitem--image picture,
body.template-collection .featured-collection--section .productitem--image .productitem--image-primary,
body.template-collection .featured-collection--section .productitem--image .productitem--image-alternate,
body.template-collection .featured-collection--section .productitem--image [data-rimg-canvas] {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  inset: 0 !important;
}

body.template-collection .featured-collection--section .productgrid--item,
body.template-collection .featured-collection--section .productitem {
  display: flex !important;
  flex-direction: column !important;
  height: auto !important;
}

body.template-collection .featured-collection--section .productitem__container {
  display: flex !important;
  flex-direction: column !important;
  flex: 1 1 auto !important;
}

/* =============================================================================
   Mobile landscape — iOS viewport recovery (loads last sitewide)
   width:100vw uses the short edge in landscape and can shrink the layout viewport
   so the whole page renders in a portrait-width column on the left.
   ============================================================================= */
@media screen and (max-width: 1023px) and (orientation: landscape),
screen and (max-width: 932px) and (max-height: 500px) {
  html {
    width: 100% !important;
    min-width: 100% !important;
    max-width: none !important;
    overflow-x: clip !important;
  }

  body {
    width: 100% !important;
    min-width: 100% !important;
    max-width: none !important;
    overflow-x: clip !important;
  }

  #site-main,
  main.site-main,
  .shopify-section-group-header-group,
  .shopify-section-group-header-group > .shopify-section,
  .pm-anno-band,
  .utility-bar,
  .site-header-wrapper,
  .site-header,
  .site-header-main,
  .shopify-section,
  .custom-liquid--container,
  .custom-html--container,
  .featured-collection--container,
  .highlights-banner,
  .highlights-banner__container,
  .collection-list__container,
  section.marquee-container,
  footer.apple-footer,
  .site-footer-wrapper {
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
  }

  #site-mobile-nav,
  .site-mobile-nav,
  #site-mobile-nav .mobile-nav-panel,
  .site-mobile-nav .mobile-nav-panel,
  #site-mobile-nav .mobile-nav-overlay,
  .site-mobile-nav .mobile-nav-overlay,
  .overlay,
  .recart-overlay,
  .pm-atc-overlay,
  #recart-popup-root {
    width: auto !important;
    max-width: 100% !important;
  }

  .overlay,
  .recart-overlay,
  [id*="recart"] .overlay,
  [class*="recart"] .overlay,
  .pm-atc-overlay {
    inset: 0 !important;
  }

  /* Reset full-bleed breakouts — portrait 100vw uses short edge on iOS */
  .media-container,
  body.template-index .media-container,
  body.template-index .shopify-section:first-child,
  body.template-index .shopify-section:first-child .custom-liquid--container,
  body.template-index section.logolist--container.poster-marquee-target,
  section.logolist--container.poster-marquee-target {
    position: relative !important;
    left: auto !important;
    right: auto !important;
    width: 100% !important;
    max-width: none !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    transform: none !important;
  }
}

/* Mobile landscape — vertically center messages + RealAged® mark alignment */
@media screen and (max-width: 1023px) and (orientation: landscape),
screen and (max-width: 932px) and (max-height: 500px) {
  .announcement-static.announcement-rotating {
    align-items: center !important;
    padding-bottom: 0 !important;
  }

  .announcement-rotating .announcement-message {
    align-items: center !important;
    justify-content: center !important;
    padding: 0 12px !important;
  }

  .announcement-rotating .announcement-message--linked.active a {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 0 12px !important;
    text-align: center !important;
    line-height: 1.15 !important;
  }

  .announcement-static .ra-reg,
  .announcement-static sup.ra-reg,
  .announcement-rotating .ra-reg,
  .announcement-rotating sup.ra-reg,
  .announcement-rotating .announcement-message a .ra-reg,
  .announcement-rotating .announcement-message a sup.ra-reg {
    display: inline !important;
    position: relative !important;
    top: 0.14em !important;
    vertical-align: baseline !important;
    line-height: 1 !important;
    font-size: 0.55em !important;
    transform: translate(2px, -3px) !important;
  }

  .announcement-rotating a[href*="realaged-products"] .ra-reg,
  .announcement-rotating a[href*="realaged-products"] sup.ra-reg {
    margin-right: 0.2em !important;
  }
}

/* Desktop announcement — RealAged® fine-tune */
@media screen and (min-width: 1024px) {
  .announcement-static .ra-reg,
  .announcement-static sup.ra-reg,
  .announcement-rotating .ra-reg,
  .announcement-rotating sup.ra-reg,
  .announcement-rotating .announcement-message a .ra-reg,
  .announcement-rotating .announcement-message a sup.ra-reg {
    transform: translate(1px, 1px) !important;
  }
}

/* Mobile portrait — vertically center rotating announcement messages */
@media screen and (max-width: 1023px) and (orientation: portrait) {
  .announcement-static.announcement-rotating {
    align-items: center !important;
    padding-bottom: 0 !important;
  }

  .announcement-rotating .announcement-message {
    align-items: center !important;
    justify-content: center !important;
    padding: 0 12px !important;
  }

  .announcement-rotating .announcement-message--linked.active a {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 0 12px !important;
  }

  .announcement-static .ra-reg,
  .announcement-static sup.ra-reg,
  .announcement-rotating .ra-reg,
  .announcement-rotating sup.ra-reg,
  .announcement-rotating .announcement-message a .ra-reg,
  .announcement-rotating .announcement-message a sup.ra-reg {
    transform: translate(0, 2px) !important;
  }

  .announcement-rotating a[href*="realaged-products"] .announcement-ra-word {
    display: inline-block;
    transform: translateX(-2px);
  }

  .announcement-rotating a[href*="realaged-products"] .ra-reg,
  .announcement-rotating a[href*="realaged-products"] sup.ra-reg {
    margin-right: 0.2em !important;
  }
}

/* =============================================================================
   Homepage mobile — poster marquee matches cart bottom strip (manual scroll)
   ============================================================================= */
@media screen and (max-width: 1023px) {
  body.template-index section.logolist--container.poster-marquee-target .logolist--item--marquee-clone {
    display: none !important;
  }

  body.template-index section.logolist--container.poster-marquee-target .logolist--inner,
  body.template-index section.logolist--container.poster-marquee-target .home-section--content.logolist--inner {
    display: flex !important;
    flex-wrap: nowrap !important;
    overflow-x: auto !important;
    overflow-y: visible !important;
    scroll-snap-type: none !important;
    gap: 16px !important;
    padding: 0 16px 10px !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    scroll-padding-left: 16px !important;
    align-items: flex-start !important;
    touch-action: pan-x pan-y !important;
    overscroll-behavior-x: contain !important;
    overscroll-behavior-y: auto !important;
    -webkit-overflow-scrolling: touch !important;
    scrollbar-width: none !important;
  }

  body.template-index section.logolist--container.poster-marquee-target .logolist--inner::-webkit-scrollbar {
    display: none !important;
  }

  body.template-index section.logolist--container.poster-marquee-target .logolist--inner > *,
  body.template-index section.logolist--container.poster-marquee-target .logolist--item {
    flex: 0 0 44% !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;
    margin: 0 !important;
    align-self: flex-start !important;
    transform: none !important;
    scroll-snap-align: start !important;
  }

  body.template-index section.logolist--container.poster-marquee-target .logolist--link {
    width: 100% !important;
    display: block !important;
    touch-action: pan-x pan-y !important;
  }

  body.template-index section.logolist--container.poster-marquee-target .logolist--image,
  body.template-index section.logolist--container.poster-marquee-target img.logolist--image {
    width: 100% !important;
    max-width: none !important;
    height: auto !important;
    aspect-ratio: 2 / 3 !important;
    max-height: none !important;
    object-fit: cover !important;
    border-radius: 16px !important;
    display: block !important;
    transform: none !important;
    transition: none !important;
  }

  body.template-index section.logolist--container.poster-marquee-target .logolist--image:hover,
  body.template-index section.logolist--container.poster-marquee-target .logolist--image:active,
  body.template-index section.logolist--container.poster-marquee-target .logolist--item:hover .logolist--image,
  body.template-index section.logolist--container.poster-marquee-target .logolist--item:active .logolist--image {
    transform: none !important;
    box-shadow: none !important;
  }

  body.template-index section.logolist--container.poster-marquee-target .logolist--inner.pxu-lia-block,
  body.template-index section.logolist--container.poster-marquee-target .logolist--item.pxu-lia-element {
    animation: none !important;
    -webkit-animation: none !important;
    --zoom-fade-scale: 1 !important;
    opacity: 1 !important;
  }
}

/* =============================================================================
   Homepage mobile — featured collection carousels match collection/cart Best Sellers
   ============================================================================= */
@media screen and (max-width: 1079px) {
  body.template-index .featured-collection--section .productitem--image {
    aspect-ratio: 1 / 1 !important;
    height: auto !important;
    padding-bottom: 0 !important;
    width: 100% !important;
    overflow: hidden !important;
  }

  body.template-index .featured-collection--section .productitem--image img,
  body.template-index .featured-collection--section .productitem--image picture,
  body.template-index .featured-collection--section .productitem--image .productitem--image-primary,
  body.template-index .featured-collection--section .productitem--image .productitem--image-alternate,
  body.template-index .featured-collection--section .productitem--image [data-rimg-canvas] {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    inset: 0 !important;
  }

  body.template-index .featured-collection--section .productgrid--item,
  body.template-index .featured-collection--section .productitem {
    display: flex !important;
    flex-direction: column !important;
    height: auto !important;
  }

  body.template-index .featured-collection--section .productitem__container {
    display: flex !important;
    flex-direction: column !important;
    flex: 1 1 auto !important;
    height: 100% !important;
  }

  body.template-index .featured-collection--section .productitem--info,
  body.template-index .featured-collection--section .productitem__content {
    display: flex !important;
    flex-direction: column !important;
    flex: 1 1 auto !important;
  }

  body.template-index .featured-collection--section .productitem--actions,
  body.template-index .featured-collection--section .productitem__actions {
    margin-top: auto !important;
  }

  body.template-index .shopify-section.featured-collection--section .productitem {
    border: 1px solid rgba(0, 0, 0, 0.06) !important;
    box-shadow: 0 8px 22px rgba(0, 0, 0, 0.038) !important;
    background: #ffffff !important;
    border-radius: 12px !important;
    overflow: hidden !important;
  }

  body.template-index .shopify-section.featured-collection--section .featured-collection__content.flickity-enabled {
    display: block !important;
    overflow-x: visible !important;
    overflow-y: visible !important;
    scroll-snap-type: none !important;
    padding-left: 0 !important;
    gap: 0 !important;
  }

  body.template-index .shopify-section.featured-collection--section .featured-collection__content.flickity-enabled .flickity-viewport {
    overflow: hidden !important;
    touch-action: pan-x pan-y pinch-zoom !important;
    overscroll-behavior-y: auto !important;
  }

  body.template-index .shopify-section.featured-collection--section .featured-collection__content .productgrid--item,
  body.template-index .shopify-section.featured-collection--section .featured-collection__content[data-layout="slideshow"] .productgrid--item,
  body.template-index .shopify-section.featured-collection--section .featured-collection__content.flickity-enabled .productgrid--item {
    width: 75% !important;
    min-width: 75% !important;
    max-width: 75% !important;
    flex: 0 0 75% !important;
    margin-right: 12px !important;
    padding: 0 !important;
    box-sizing: border-box !important;
  }
}

/* =============================================================================
   Hidden utility safety — must load last sitewide (draft 190610997524 repair)
   ============================================================================= */
.visually-hidden,
.sr-only {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  clip-path: inset(50%) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

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

/* =============================================================================
   Header interaction repair — draft 190610997524
   ============================================================================= */
.site-main-dimmer {
  pointer-events: none !important;
}

.site-main-dimmer[data-animation-state="open"] {
  pointer-events: auto !important;
}

.site-main-dimmer:not([data-animation-state="open"]) {
  opacity: 0 !important;
}

body .jm-mfp-wrap,
body .jdgm-gallery-popup.mfp-ready {
  pointer-events: none !important;
}

body .jm-mfp-wrap.mfp-ready:not(.mfp-hide),
body .jm-mfp-wrap.jm-mfp-ready:not(.jm-mfp-hide),
body .jdgm-gallery-popup.mfp-ready:not(.mfp-hide),
body .jdgm-gallery-popup.jm-mfp-ready:not(.jm-mfp-hide) {
  pointer-events: auto !important;
}

@media screen and (min-width: 1024px) {
  #site-mobile-nav.site-mobile-nav,
  .site-mobile-nav {
    position: fixed !important;
    width: 0 !important;
    height: 0 !important;
    min-height: 0 !important;
    overflow: hidden !important;
    visibility: hidden !important;
    pointer-events: none !important;
    z-index: -1 !important;
  }

  .mobile-nav-close,
  .mobile-nav-overlay {
    display: none !important;
    pointer-events: none !important;
  }
}

.skip-to-main:not(:focus):not(:focus-visible) {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  clip-path: inset(50%) !important;
  white-space: nowrap !important;
  border: 0 !important;
  left: -9999px !important;
  top: auto !important;
}

@media screen and (min-width: 720px) {
  .live-search-takeover-cancel {
    display: none !important;
    visibility: hidden !important;
    pointer-events: none !important;
  }

  .site-header-main .live-search,
  .site-header-main .live-search.live-search--takeover {
    position: relative !important;
    inset: auto !important;
    top: auto !important;
    right: auto !important;
    left: auto !important;
    width: auto !important;
    height: 46px !important;
    transform: none !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  /* Search pill: light-gray input on the left, black cap attached flush on
     the right. overflow:hidden + matching heights means the two halves read
     as one continuous shape with no visible seam. */
  .site-header-main .live-search-form {
    display: flex !important;
    align-items: center !important;
    position: relative !important;
    inset: auto !important;
    width: 100% !important;
    height: 46px !important;
    box-sizing: border-box !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
    border-radius: 999px !important;
    transform: none !important;
    background: #f7f7f8 !important;
    border: 1px solid rgba(0, 0, 0, 0.08) !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04) !important;
  }

  .site-header-main .live-search-form .form-field {
    display: flex !important;
    align-items: center !important;
    flex: 1 1 auto !important;
    min-width: 0 !important;
    height: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  .site-header-main .live-search-form-field,
  .site-header-main .live-search-form input {
    flex: 1 1 auto !important;
    width: auto !important;
    min-width: 0 !important;
    height: 100% !important;
    margin: 0 !important;
    padding: 0 18px !important;
    border: 0 !important;
    outline: none !important;
    box-shadow: none !important;
    background: transparent !important;
    color: #1d1d1d !important;
    border-radius: 999px 0 0 999px !important;
  }

  .site-header-main .live-search-form-field::placeholder,
  .site-header-main .live-search-form input::placeholder {
    color: #9a9a9a !important;
    opacity: 1 !important;
  }

  .site-header-main .live-search-button {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    position: relative !important;
    flex: 0 0 56px !important;
    width: 56px !important;
    height: 46px !important;
    box-sizing: border-box !important;
    margin: 0 !important;
    padding: 0 !important;
    opacity: 1 !important;
    border: 0 !important;
    outline: none !important;
    -webkit-appearance: none !important;
    appearance: none !important;
    background: #1f1f1f !important;
    color: #ffffff !important;
    border-radius: 0 999px 999px 0 !important;
    box-shadow: none !important;
  }

  .site-header-main .live-search-button:hover,
  .site-header-main .live-search-button:focus {
    background: #1f1f1f !important;
    box-shadow: none !important;
    outline: none !important;
    transform: none !important;
  }

  .site-header-main .live-search-button .search-icon--inactive {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    transform: translateY(-2px) !important;
  }

  /* icon-search is an OUTLINE glyph (circle + handle, both stroke-only) —
     forcing fill:#fff (as a previous version of this rule did) turns the
     circle into a solid filled dot instead of a hollow magnifying-glass
     ring, so fill must stay none and only stroke gets the white color. */
  .site-header-main .live-search-button .search-icon--inactive svg {
    width: 20px !important;
    height: 20px !important;
    overflow: visible !important;
    color: #ffffff !important;
    fill: none !important;
    stroke: #ffffff !important;
  }

  .site-header-main .live-search-button .search-icon--inactive svg * {
    fill: none !important;
    stroke: #ffffff !important;
    stroke-width: 2.4 !important;
  }

  /* Taken out of flex flow (absolute) so this hidden spinner never shares
     layout space with the visible search-icon--inactive glass — otherwise
     justify-content:center centers the *pair* of icons together, pushing
     the visible glass left of the button's true center. */
  .site-header-main .live-search-button .search-icon--active {
    position: absolute !important;
    top: 50% !important;
    left: 50% !important;
    transform: translate(-50%, -50%) !important;
    opacity: 0 !important;
    visibility: hidden !important;
  }

  .site-header-main .live-search-button.search-icon--processing .search-icon--inactive {
    opacity: 0 !important;
  }

  .site-header-main .live-search-button.search-icon--processing .search-icon--active {
    opacity: 1 !important;
    visibility: visible !important;
    color: #ffffff !important;
    fill: #ffffff !important;
  }
}

@media screen and (min-width: 1024px) {
  /* justify-content was "center", which split any leftover space evenly on
     BOTH sides of the logo+search group once the search bar got a
     max-width — that shifted the logo away from the left edge instead of
     only opening a gap on the right. flex-start keeps the logo flush left
     and sends all leftover space to the right, after the search bar. */
  .site-header-main-content {
    flex: 1 1 auto !important;
    justify-content: flex-start !important;
    min-width: 0 !important;
    /* Neutralize Empire theme.css desktop margin-right: 2.5rem (40px)
       that was stacking with .site-header-right margin-left below. */
    margin-right: 0 !important;
  }

  /* Wide search bar (reference look): grows from just right of the logo to
     fill the available space, leaving only a clean gap before the account
     pill (that gap is the .site-header-right margin-left below). No shorter
     max-width cap — the bar should stretch across the center. */
  .site-header-main .live-search {
    flex: 1 1 auto !important;
    min-width: 0 !important;
    max-width: none !important;
  }

  .site-header-main .live-search-form {
    border: 1px solid rgba(0, 0, 0, 0.08) !important;
    background: #f7f7f8 !important;
  }

  /* Right-hand cluster: search bar | account pill | cart. margin-left is the
     gap between the (now wide) search bar and the account pill — matched to
     ~26–30px so it balances the 26px account↔cart gap. */
  .site-header-right {
    display: flex !important;
    align-items: center !important;
    gap: 26px !important;
    margin-left: 28px !important;
  }

  .site-header-actions {
    display: flex !important;
    align-items: center !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  .site-header-actions__account-link {
    margin: 0 !important;
  }

  .site-header-cart {
    display: flex !important;
    align-items: center !important;
  }

  /* Cart icon is a solid glyph (icon-bag / icon-cart) — force fill dark. */
  .site-header-cart--button,
  .site-header-cart--button:link,
  .site-header-cart--button:visited {
    display: inline-flex !important;
    align-items: center !important;
    color: #1d1d1d !important;
  }

  .site-header-cart-icon svg,
  .site-header-cart-icon svg * {
    color: #1d1d1d !important;
    fill: currentColor !important;
  }

  /* Logged-out state: icon-only link, no pill (matches reference at this
     breakpoint — only a logged-in customer sees the bordered pill below). */
  .site-header-actions__account-link:not(:has(.site-header__account-links)) {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 40px !important;
    height: 40px !important;
    margin: 0 !important;
    padding: 0 !important;
    color: #1d1d1d !important;
  }

  /* The blue was coming from the UA default :link color on the anchor
     itself (a descendant of the <li>, not the <li> — so styling the <li>
     alone never reached it), which the icon's stroke="currentColor"
     inherits. */
  .site-header-actions__account-link:not(:has(.site-header__account-links)) .site-header_account-link-anchor,
  .site-header-actions__account-link:not(:has(.site-header__account-links)) .site-header_account-link-anchor:link,
  .site-header-actions__account-link:not(:has(.site-header__account-links)) .site-header_account-link-anchor:visited {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    height: 100% !important;
    color: #1d1d1d !important;
  }

  /* icon-account is an OUTLINE glyph (fill="none", stroke="currentColor") —
     forcing fill here (as a previous version of this rule did) turns the
     outline into a solid filled blob, so fill must stay none. */
  .site-header-actions__account-link:not(:has(.site-header__account-links)) svg,
  .site-header-actions__account-link:not(:has(.site-header__account-links)) svg * {
    fill: none !important;
    stroke: currentColor !important;
  }

  /* Logged-in account pill — white pill, thin border, "Account | Logout" */
  .site-header-actions__account-link:has(.site-header__account-links) {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: auto !important;
    height: 42px !important;
    min-height: 42px !important;
    margin: 0 !important;
    padding: 0 18px !important;
    gap: 10px !important;
    border: 1px solid rgba(0, 0, 0, 0.08) !important;
    border-radius: 999px !important;
    background: #ffffff !important;
    box-sizing: border-box !important;
    transition: background-color 0.15s ease !important;
  }

  .site-header-actions__account-link:has(.site-header__account-links):hover {
    background: #f8f8f8 !important;
  }

  .site-header-actions__account-link:has(.site-header__account-links) .site-header__account-icon {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: auto !important;
    height: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    flex: 0 0 auto !important;
  }

  /* Outline icon — fill must stay none (see comment above). */
  .site-header-actions__account-link:has(.site-header__account-links) .site-header__account-icon svg {
    display: block !important;
    width: 22px !important;
    height: 22px !important;
    max-width: 22px !important;
    max-height: 22px !important;
    margin: 0 !important;
    fill: none !important;
    stroke: currentColor !important;
    color: #1d1d1d !important;
  }

  .site-header-actions__account-link:has(.site-header__account-links) .site-header__account-icon svg * {
    fill: none !important;
  }

  .site-header-actions .site-header__account-links {
    display: inline-flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 10px !important;
    margin: 0 !important;
    padding: 0 !important;
    line-height: 1 !important;
  }

  /* The anchor's real text is "My Account" (locale string). Hide it with
     font-size:0 and render a clean "Account" label via ::after instead —
     leaving the real text at a visible size caused a duplicated
     "My AccountAccount" render. */
  .site-header-actions .site-header__account-link--account {
    display: inline-flex !important;
    align-items: center !important;
    margin: 0 !important;
    padding: 0 !important;
    font-size: 0 !important;
    line-height: 1 !important;
    color: #1d1d1d !important;
    text-decoration: none !important;
    white-space: nowrap !important;
  }

  .site-header-actions .site-header__account-link--account::after {
    content: "Account" !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    line-height: 1 !important;
    color: #1d1d1d !important;
  }

  .site-header-actions .site-header__account-link--logout {
    display: inline-flex !important;
    align-items: center !important;
    margin: 0 !important;
    padding: 0 !important;
    font-size: 12px !important;
    font-weight: 500 !important;
    line-height: 1 !important;
    color: #8a8a8a !important;
    text-decoration: none !important;
    white-space: nowrap !important;
  }

  .site-header-actions .site-header__account-link--logout::before {
    content: "" !important;
    display: inline-block !important;
    width: 1px !important;
    height: 10px !important;
    margin-right: 10px !important;
    background: #dddddd !important;
    flex: 0 0 auto !important;
  }

  .site-header-actions .site-header__account-link--logout:hover {
    color: #444444 !important;
  }
}

/* =============================================================================
   Desktop Shop mega menu — premium redesign (single source of truth)
   Scoped to .navmenu-meganav-standard__wrapper, which only the Shop nav
   item renders (meganav_images block type). The Resources dropdown uses a
   different, unrelated markup (.pm-desktop-nav__panel) and is untouched.
   ============================================================================= */
@media (min-width: 1024px) {
  /* =============================================================================
     Final polish pass — premium system font + header nav refinement.
     Scoped to .pm-desktop-nav (desktop-only; display:none below 1024px) and
     the Shop mega menu, so mobile nav / mobile menu are untouched. No new
     font is imported — this is the native Apple/system stack with sane
     fallbacks for non-Apple platforms.
     ============================================================================= */
  .pm-desktop-nav,
  .navmenu-meganav.navmenu-meganav--desktop {
    font-family: -apple-system, BlinkMacSystemFont, "SF Pro Display",
      "SF Pro Text", "Helvetica Neue", Arial, sans-serif !important;
  }

  /* Desktop nav links — calm, premium weight (was 500/28px fixed-height).
     Height goes from a fixed 28px to auto + generous padding so every
     top-level item (plain links AND the Shop/Resources pills below) shares
     one consistent, slightly taller chip height — still centered inside the
     52px nav bar, so nothing shifts vertically. */
  .pm-desktop-nav__link,
  .pm-desktop-nav .navmenu-link.pm-desktop-nav__link,
  .pm-desktop-nav.site-navigation .navmenu-link-depth-1.pm-desktop-nav__link,
  .pm-desktop-nav.site-navigation .navmenu-link-parent.pm-desktop-nav__link {
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    padding: 9px 14px !important;
    font-size: 15px !important;
    font-weight: 600 !important;
    letter-spacing: -0.01em !important;
    color: #202020 !important;
    line-height: 1 !important;
    box-shadow: none !important;
  }

  .pm-desktop-nav__link:hover:not(.pm-desktop-nav__link--summary),
  .pm-desktop-nav__link:focus-visible:not(.pm-desktop-nav__link--summary),
  .pm-desktop-nav .navmenu-link.pm-desktop-nav__link:hover:not(.pm-desktop-nav__link--summary),
  .pm-desktop-nav .navmenu-link.pm-desktop-nav__link:focus-visible:not(.pm-desktop-nav__link--summary),
  .pm-desktop-nav.site-navigation li:not(.pm-desktop-nav__item--resources) .navmenu-link-parent:hover,
  .pm-desktop-nav.site-navigation .navmenu-depth-1 > li:not(.pm-desktop-nav__item--resources) > a:hover,
  .pm-desktop-nav.site-navigation .navmenu-depth-1 > li:not(.pm-desktop-nav__item--resources) > summary:hover,
  .pm-desktop-nav.site-navigation .navmenu-depth-1 > li:not(.pm-desktop-nav__item--resources) > summary:focus-visible {
    color: #000000 !important;
    background-color: #f5f5f7 !important;
    font-weight: 600 !important;
  }

  /* Shop + Resources pills — softer premium chip color (was #f4f4f4), plus
     the same generous 9px 14px padding as the plain links above. */
  .pm-desktop-nav.site-navigation li.pm-desktop-nav__item--shop.navmenu-id-shop > details > summary.navmenu-link,
  .pm-desktop-nav.site-navigation li.pm-desktop-nav__item--shop.navmenu-id-shop > details > summary.navmenu-link-parent,
  .pm-desktop-nav.site-navigation li.pm-desktop-nav__item--shop.navmenu-id-shop > details > summary.pm-desktop-nav__link,
  .pm-desktop-nav.site-navigation li.pm-desktop-nav__item--resources > details > summary.pm-desktop-nav__link--summary.navmenu-link.navmenu-link-parent {
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    padding: 9px 14px !important;
    background: #f5f5f7 !important;
    background-color: #f5f5f7 !important;
    box-shadow: none !important;
  }

  .pm-desktop-nav.site-navigation li.pm-desktop-nav__item--shop.navmenu-id-shop > details > summary.navmenu-link:hover,
  .pm-desktop-nav.site-navigation li.pm-desktop-nav__item--shop.navmenu-id-shop > details > summary.navmenu-link:focus-visible,
  .pm-desktop-nav.site-navigation li.pm-desktop-nav__item--shop.navmenu-id-shop > details[open] > summary.navmenu-link,
  .pm-desktop-nav.site-navigation li.pm-desktop-nav__item--shop.navmenu-id-shop > details[open] > summary.pm-desktop-nav__link--summary,
  .pm-desktop-nav.site-navigation li.pm-desktop-nav__item--resources > details:not([open]) > summary.pm-desktop-nav__link--summary.navmenu-link.navmenu-link-parent:hover,
  .pm-desktop-nav.site-navigation li.pm-desktop-nav__item--resources > details:not([open]) > summary.pm-desktop-nav__link--summary.navmenu-link.navmenu-link-parent:focus-visible,
  .pm-desktop-nav.site-navigation li.pm-desktop-nav__item--resources > details[open] > summary.pm-desktop-nav__link--summary.navmenu-link.navmenu-link-parent {
    background: #eeeeef !important;
    background-color: #eeeeef !important;
    color: #000000 !important;
    box-shadow: none !important;
  }

  /* Nav row inset — Shop / Print A Bill™ / Bulk Orders / Stack Simulator /
     Resources / Track Order should read as slightly narrower + centered
     than the logo/search/account row above it, not stretched edge-to-edge.
     Only the nav BAR gets a narrower max-width + auto-centering; the mega
     menu (positioned via viewport-relative left/width, not this bar's own
     width) and the logo/search/account row are untouched. Individual item
     gaps (.pm-desktop-nav__list gap: 2px) and pill styling are unaffected —
     only the two flex groups (left cluster, right cluster) shift inward. */
  .pm-desktop-nav__bar {
    max-width: 98.5% !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }

  /* Outer shell = the full-width white dropdown SECTION. It already spans
     the site's full-bleed width (matching .site-header, which runs edge to
     edge inside the site's 8px body margin), so we just paint it white,
     add the vertical padding, and a subtle bottom shadow. No border, no
     radius, no blur — this reads as a full-width mega menu section, not a
     floating card. Horizontal spacing is handled by the inner wrapper. */
  .site-navigation .navmenu-meganav.navmenu-meganav--desktop[data-animation-state="open"]:not([data-animation]):has(.navmenu-meganav-standard__wrapper),
  .site-navigation .navmenu-id-shop .navmenu-meganav.navmenu-meganav--desktop[data-animation="closed=>open"]:has(.navmenu-meganav-standard__wrapper) {
    background: #ffffff !important;
    border: 0 !important;
    /* Slightly more defined lower edge — a soft 1px hairline (not a dark/
       hard line) that follows the rounded bottom corners, sitting just
       inside the existing soft shadow. */
    border-bottom: 1px solid rgba(0, 0, 0, 0.06) !important;
    border-radius: 0 0 28px 28px !important;
    overflow: hidden !important;
    padding: 30px 0 34px !important;
    /* Downward-only shadow, deepened for this pass. A plain 0 28px 80px
       shadow (blur 80, offset 28) would bleed ~52px UPWARD past the panel's
       top edge and reappear as the exact "line" we removed last round. The
       negative spread pushes the shadow's own top edge down by offset+|spread|
       (40+54=94px) before the 90px blur softens it back up — net top edge
       lands ~4px BELOW the panel's top, so it never touches the nav row, but
       reads deeper/softer than before (was 30/50/-22). */
    box-shadow: 0 40px 90px -54px rgba(0, 0, 0, 0.16) !important;
    outline: none !important;
  }

  /* Full-bleed alignment fix. The base rule (pm-premium-design-system) uses
     margin-left: calc(50% - 50vw), which lands the panel at x=8 (a visible
     gap on the left) because the whole chrome is pushed right by the body's
     8px left margin, while the matching 8px right overflow is clipped by
     body{overflow-x:hidden} (so the right looked flush). Pulling an extra 8px
     left makes the white panel a true 0 → 100vw: flush on BOTH edges, exactly
     matching the header/announcement full-bleed with no left gap. */
  .pm-desktop-nav .navmenu-id-shop .navmenu-meganav.navmenu-meganav--desktop {
    left: 0 !important;
    right: auto !important;
    width: 100vw !important;
    max-width: 100vw !important;
    margin-left: calc(50% - 50vw - 8px) !important;
    margin-right: 0 !important;
  }

  /* Inner content wrapper = header-width, aligned to the header CONTENT edges.
     The outer panel is a true full-bleed 0 → 100vw, but the header content is
     NOT centered on the viewport — the site's 8px body margin pushes the whole
     chrome 8px right (header content = 212 → 1724 at 1920, i.e. centered on
     968, not 960). Simply centering this wrapper would land the columns ~32px
     left of the logo. So instead of margin:auto centering we reproduce the
     header content box directly with asymmetric padding:
        left  = (100vw − chrome-max)/2 + 24 (header padding) + 8 (body margin)
        right = (100vw − chrome-max)/2 + 24 (header padding) − 8 (body margin)
     which makes the Shop columns start exactly under the logo and end exactly
     at the account/cart edge. max() keeps a safe 24px gutter below ~1544px. */
  .navmenu-meganav.navmenu-meganav--desktop .navmenu-meganav-standard__wrapper.navmenu-meganav-wrapper {
    display: flex !important;
    flex-direction: column !important;
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    padding-left: max(24px, calc((100vw - var(--pm-chrome-max, 1560px)) / 2 + 32px)) !important;
    padding-right: max(24px, calc((100vw - var(--pm-chrome-max, 1560px)) / 2 + 16px)) !important;
    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    outline: none !important;
    overflow: visible !important;
    max-height: none !important;
    box-sizing: border-box !important;
  }

  /* Glass overlay behind the open Shop mega menu (injected by
     pm-mega-glass.js — the JS positions it starting exactly at the mega
     panel's bottom edge, so it never covers the menu itself). The default
     background/blur in pm-premium-design-system.css.liquid was a strong
     blur(20px) + heavy white wash that read as a big smear; this keeps the
     glass effect but dialed way down — light wash, gentle blur, quick fade. */
  .pm-mega-glass-overlay {
    background: rgba(255, 255, 255, 0.38) !important;
    backdrop-filter: blur(16px) saturate(160%) !important;
    -webkit-backdrop-filter: blur(16px) saturate(160%) !important;
    transition: opacity 240ms ease !important;
  }

  /* Mega menu open/close motion — clean, un-delayed opacity + translateY
     fade for the menu content. The base system (pm-premium-design-system)
     staggers this with extra 80–100ms delays before the fade even starts,
     which is what read as "snapping" open/closed instead of gently
     fading/sliding in. Re-declaring the same attribute-qualified selectors
     here (same specificity, later in cascade) removes those delays and
     locks both directions to one consistent 240ms ease timing. Height
     reveal of the outer panel is untouched — only this inner content fade
     is retimed. */
  .pm-desktop-nav .navmenu-id-shop .navmenu-meganav.navmenu-meganav--desktop[data-animation="closed=>open"] .navmenu-meganav-wrapper:not(.meganav-ghost) {
    opacity: 1 !important;
    transform: translateY(0) !important;
    transition: opacity 240ms ease, transform 240ms ease !important;
    pointer-events: auto !important;
  }

  .pm-desktop-nav .navmenu-id-shop .navmenu-meganav.navmenu-meganav--desktop[data-animation-state="open"]:not([data-animation]) .navmenu-meganav-wrapper:not(.meganav-ghost) {
    opacity: 1 !important;
    transform: translateY(0) !important;
    pointer-events: auto !important;
  }

  /* Matches "open=>closed" AND is the same [data-animation]:not(...) pattern
     the base file (pm-premium-design-system) uses for its own generic
     "hidden" rule — that base rule has HIGHER specificity than a plain
     [data-animation="open=>closed"] selector (two attribute-selector-level
     parts vs one), so it was silently winning over a same-named rule here
     and forcing its own translate3d(0,-8px,0) instead of our -6px target.
     Matching its exact specificity pattern (and loading later in the file)
     lets this rule win the tie instead. */
  .pm-desktop-nav .navmenu-id-shop .navmenu-meganav.navmenu-meganav--desktop[data-animation]:not([data-animation="closed=>open"]) .navmenu-meganav-wrapper:not(.meganav-ghost) {
    opacity: 0 !important;
    transform: translateY(-6px) !important;
    transition: opacity 240ms ease, transform 240ms ease !important;
    pointer-events: none !important;
  }

  /* TRUE universal default (no attribute-selector gate) — this is what makes
     the fade/slide actually visible. The old default required
     `[data-animation]` to be PRESENT to apply opacity:0, but the wrapper has
     NO data-animation attribute at all before the very first click (pristine
     page load) AND again once a full close finishes and the attribute is
     removed (hold:false on close). In both of those cases the wrapper's
     opacity silently fell back to the browser default of 1 with no rule
     overriding it — so the very first open (and every open after a real
     close) had nothing to transition FROM (old value already matched the
     new "open" value), and it just snapped instantly. Dropping the
     attribute requirement here means this lower-specificity rule always
     supplies the "closed" resting value, and the more specific
     attribute-qualified open rules above still win whenever they apply. */
  .pm-desktop-nav .navmenu-id-shop .navmenu-meganav.navmenu-meganav--desktop .navmenu-meganav-wrapper:not(.meganav-ghost) {
    opacity: 0 !important;
    transform: translateY(-6px) !important;
    pointer-events: none !important;
  }

  .pm-desktop-nav .navmenu-id-shop .navmenu-meganav.navmenu-meganav--desktop:not([data-animation-state="open"]):not([data-animation="open=>closed"]) {
    pointer-events: none !important;
  }

  .pm-desktop-nav .navmenu-id-shop .navmenu-meganav.navmenu-meganav--desktop[data-animation-state="open"],
  .pm-desktop-nav .navmenu-id-shop .navmenu-meganav.navmenu-meganav--desktop[data-animation="closed=>open"] {
    pointer-events: auto !important;
  }

  /* Respect prefers-reduced-motion — mega menu content, panel height reveal,
     and the glass overlay all switch to an instant cut instead of any
     fade/slide/blur transition. */
  @media (prefers-reduced-motion: reduce) {
    .pm-desktop-nav .navmenu-id-shop .navmenu-meganav.navmenu-meganav--desktop,
    .pm-desktop-nav .navmenu-id-shop .navmenu-meganav.navmenu-meganav--desktop .navmenu-meganav-wrapper,
    .pm-mega-glass-overlay {
      transition: none !important;
      animation: none !important;
    }
  }

  /* Compact intro — reduce vertical whitespace above the columns */
  .navmenu-meganav.navmenu-meganav--desktop .meganav-shop-intro {
    width: 100% !important;
    padding-bottom: 0 !important;
  }

  .navmenu-meganav.navmenu-meganav--desktop .meganav-shop-intro__title {
    margin: 0 0 7px !important;
    font-family: inherit !important;
    font-size: 20px !important;
    font-weight: 700 !important;
    line-height: 1.1 !important;
    letter-spacing: -0.035em !important;
    color: #111111 !important;
  }

  .navmenu-meganav.navmenu-meganav--desktop .meganav-shop-intro__text {
    margin: 0 !important;
    max-width: 560px !important;
    font-family: inherit !important;
    font-size: 14.5px !important;
    font-weight: 400 !important;
    line-height: 1.45 !important;
    letter-spacing: -0.01em !important;
    color: #6b6b6f !important;
  }

  /* No visible divider line under the intro — just the vertical rhythm
     that separates it from the columns below. */
  .navmenu-meganav.navmenu-meganav--desktop .meganav-shop-intro__rule {
    width: 100% !important;
    height: 0 !important;
    margin: 16px 0 22px !important;
    border: 0 !important;
    background: none !important;
  }

  /* Grid: 5 even text columns + featured card. Defining a real track for
     EVERY column (6 total) matters — a theme script dynamically forces the
     column <ul> to display:flex with justify-content:space-between, which
     used to silently win over a plain single-track grid item and made the
     columns render uneven/cramped. The boosted-specificity selectors below
     (element + full class list) are what let display:contents actually win. */
  .navmenu-meganav.navmenu-meganav--desktop .meganav-shop-grid {
    display: grid !important;
    grid-template-columns: repeat(5, minmax(100px, 1fr)) 260px !important;
    column-gap: 48px !important;
    row-gap: 0 !important;
    align-items: start !important;
    width: 100% !important;
  }

  .navmenu-meganav.navmenu-meganav--desktop .navmenu-meganav-standard__wrapper ul.navmenu-depth-2.navmenu-meganav-standard__items {
    display: contents !important;
    max-width: none !important;
    width: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  .navmenu-meganav.navmenu-meganav--desktop .navmenu-meganav-standard__wrapper ul.navmenu-depth-2.navmenu-meganav-standard__items > li.navmenu-meganav-standard__item {
    display: block !important;
    flex: none !important;
    width: auto !important;
    min-width: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    border: none !important;
    white-space: normal !important;
  }

  /* Remove every default bullet / indent in this menu */
  .navmenu-meganav.navmenu-meganav--desktop .navmenu-meganav-standard__wrapper ul,
  .navmenu-meganav.navmenu-meganav--desktop .navmenu-meganav-standard__wrapper li {
    list-style: none !important;
    list-style-image: none !important;
    padding-left: 0 !important;
    margin: 0 !important;
  }

  /* Hide the mobile accordion chevron button + icon on desktop */
  .navmenu-meganav.navmenu-meganav--desktop .navmenu-meganav-standard__wrapper .navmenu-button,
  .navmenu-meganav.navmenu-meganav--desktop .navmenu-meganav-standard__wrapper .navmenu-icon {
    display: none !important;
  }

  /* Column headings: small uppercase labels */
  .navmenu-meganav.navmenu-meganav--desktop .navmenu-meganav-standard__item > .navmenu-item-text.navmenu-link-parent {
    display: block !important;
    font-family: inherit !important;
    font-size: 10.5px !important;
    font-weight: 700 !important;
    letter-spacing: 0.18em !important;
    text-transform: uppercase !important;
    line-height: 1 !important;
    color: #8a8a8f !important;
    margin: 0 0 18px !important;
    padding: 0 !important;
    text-decoration: none !important;
    background: transparent !important;
  }

  .navmenu-meganav.navmenu-meganav--desktop .navmenu-meganav-standard__item > .navmenu-item-text.navmenu-link-parent:hover,
  .navmenu-meganav.navmenu-meganav--desktop .navmenu-meganav-standard__item > .navmenu-item-text.navmenu-link-parent:focus {
    color: #111111 !important;
  }

  /* Column links: clean, readable, muted-to-dark on hover */
  .navmenu-meganav.navmenu-meganav--desktop .navmenu-meganav-standard__wrapper .navmenu-depth-3 {
    margin: 0 !important;
    padding: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    border: none !important;
  }

  .navmenu-meganav.navmenu-meganav--desktop .navmenu-meganav-standard__wrapper .navmenu-depth-3 .navmenu-link {
    display: block !important;
    font-family: inherit !important;
    font-size: 15px !important;
    line-height: 1.85 !important;
    font-weight: 500 !important;
    letter-spacing: -0.012em !important;
    color: #3f3f42 !important;
    padding: 4px 8px !important;
    margin-left: -8px !important;
    border-radius: 10px !important;
    background: transparent !important;
    text-decoration: none !important;
    transform: translateX(0) !important;
    transition: color 160ms ease, background-color 160ms ease,
      transform 160ms ease !important;
  }

  .navmenu-meganav.navmenu-meganav--desktop .navmenu-meganav-standard__wrapper .navmenu-depth-3 .navmenu-link:hover,
  .navmenu-meganav.navmenu-meganav--desktop .navmenu-meganav-standard__wrapper .navmenu-depth-3 .navmenu-link:focus {
    color: #000000 !important;
    background: rgba(0, 0, 0, 0.035) !important;
    text-decoration: none !important;
    transform: translateX(2px) !important;
  }

  /* Featured product card — small, premium, contained, aligned with columns.
     Sits in the last grid track, flush to the right content edge, with the
     balanced 44px column gap separating it from the Resources column. */
  .navmenu-meganav.navmenu-meganav--desktop .meganav-featured-card,
  .navmenu-meganav.navmenu-meganav--desktop .navmenu-meganav-standard__image-last {
    grid-column: 6 !important;
    grid-row: 1 !important;
    width: 100% !important;
    max-width: 260px !important;
    min-width: 0 !important;
    margin: 0 0 0 auto !important;
    background: transparent !important;
    overflow: visible !important;
    max-height: none !important;
  }

  .navmenu-meganav.navmenu-meganav--desktop .meganav-featured-card__link {
    display: block !important;
    text-decoration: none !important;
    color: inherit !important;
  }

  .navmenu-meganav.navmenu-meganav--desktop .meganav-featured-card__panel {
    display: flex !important;
    flex-direction: column !important;
    height: auto !important;
    max-height: none !important;
    background: rgba(255, 255, 255, 0.92) !important;
    border: 1px solid rgba(0, 0, 0, 0.045) !important;
    border-radius: 26px !important;
    padding: 18px !important;
    /* Deep soft outer shadow + a hairline inset highlight along the top edge
       — the "glass card" look: gives the white panel a touch of lift/glow
       instead of reading as a flat white box. */
    box-shadow: 0 22px 60px rgba(0, 0, 0, 0.1),
      0 1px 0 rgba(255, 255, 255, 0.85) inset !important;
    backdrop-filter: blur(14px) saturate(140%) !important;
    -webkit-backdrop-filter: blur(14px) saturate(140%) !important;
    overflow: visible !important;
    box-sizing: border-box !important;
    transition: box-shadow 220ms ease, transform 220ms ease !important;
  }

  .navmenu-meganav.navmenu-meganav--desktop .meganav-featured-card__link:hover .meganav-featured-card__panel {
    box-shadow: 0 26px 64px rgba(0, 0, 0, 0.13),
      0 1px 0 rgba(255, 255, 255, 0.85) inset !important;
    transform: translateY(-2px) !important;
  }

  /* Image sits inside the card and stays contained — no overflow bleed.
     Inner padding keeps the product photo from touching the tile edges,
     which is what makes it feel like a curated product shot vs. a raw crop. */
  .navmenu-meganav.navmenu-meganav--desktop .meganav-featured-card__image {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    /* Transparent, not just borderless — #fafafa (or any solid off-white)
       still reads as a distinct gray "frame" the moment it sits against the
       card's white/near-white surface, because the human eye picks up the
       rounded-rect edge from color contrast alone, border or not. Letting it
       inherit the card's own surface (transparent) removes that edge
       entirely, so the product photo looks like it's floating directly on
       the card instead of sitting inside a placeholder box. */
    border-radius: 20px !important;
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    padding: 8px !important;
    margin-bottom: 16px !important;
    aspect-ratio: 1 / 1 !important;
    min-height: 0 !important;
    max-height: none !important;
    overflow: hidden !important;
    flex-shrink: 0 !important;
    box-sizing: border-box !important;
  }

  .navmenu-meganav.navmenu-meganav--desktop .meganav-featured-card__image img,
  .navmenu-meganav.navmenu-meganav--desktop .meganav-featured-card__image .navmenu-meganav-standard__image {
    width: 100% !important;
    height: 100% !important;
    max-width: 100% !important;
    max-height: 100% !important;
    object-fit: contain !important;
    display: block !important;
    transform: none !important;
  }

  .navmenu-meganav.navmenu-meganav--desktop .meganav-featured-card__label {
    display: block !important;
    margin: 0 0 8px !important;
    padding: 0 !important;
    font-size: 9.5px !important;
    font-weight: 700 !important;
    letter-spacing: 0.16em !important;
    text-transform: uppercase !important;
    color: #9a9a9f !important;
  }

  .navmenu-meganav.navmenu-meganav--desktop .meganav-featured-card__title {
    margin: 0 0 16px !important;
    padding: 0 !important;
    font-size: 17px !important;
    font-weight: 700 !important;
    line-height: 1.12 !important;
    letter-spacing: -0.035em !important;
    color: #111111 !important;
    max-width: none !important;
  }

  .navmenu-meganav.navmenu-meganav--desktop .meganav-featured-card__btn {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    height: 42px !important;
    min-height: 42px !important;
    padding: 0 22px !important;
    margin-top: auto !important;
    border-radius: 999px !important;
    background: #111111 !important;
    color: #ffffff !important;
    font-size: 13.5px !important;
    font-weight: 700 !important;
    line-height: 1 !important;
    letter-spacing: -0.01em !important;
    border: none !important;
    box-shadow: none !important;
    transform: translateY(0) !important;
    transition: background-color 160ms ease, transform 160ms ease !important;
  }

  .navmenu-meganav.navmenu-meganav--desktop .meganav-featured-card__link:hover .meganav-featured-card__btn {
    background: #000000 !important;
    transform: translateY(-1px) !important;
  }
}

/* Tablet-desktop (1024–1199px): slightly tighter columns + card */
@media (min-width: 1024px) and (max-width: 1199px) {
  .navmenu-meganav.navmenu-meganav--desktop .meganav-shop-grid {
    grid-template-columns: repeat(5, minmax(90px, 1fr)) 230px !important;
    column-gap: 38px !important;
  }

  .navmenu-meganav.navmenu-meganav--desktop .meganav-featured-card,
  .navmenu-meganav.navmenu-meganav--desktop .navmenu-meganav-standard__image-last {
    max-width: 230px !important;
  }

  .navmenu-meganav.navmenu-meganav--desktop .navmenu-meganav-standard__wrapper .navmenu-depth-3 .navmenu-link {
    font-size: 13.5px !important;
  }
}

/* =============================================================================
   "You recently viewed" carousel — prev/next arrows, copied 1:1 from the
   working .featured-collection__content carousel used by the other product
   collections on the site (assets/theme.css.liquid ~line 7897), instead of
   the section's own bespoke (and broken) arrow styling. Same button size,
   same circle/shadow treatment, same hover scale, same disabled opacity,
   same left/right offsets at the same breakpoint (max_width 1600px + 110px
   = 1710px, where the shared page-width container this section also uses —
   .product-section--container, see theme.css.liquid ~line 21500 for the
   shared --layout-container-max-width/--layout-container-gutter rule — goes
   from a fixed 25px side gutter to a centered column with real margin).

   Bugs fixed:
   1. The section's own CSS put `overflow: hidden` directly on the flickity
      container (.product-recently-viewed__content), which clipped anything
      positioned outside that box — including the prev/next buttons. That is
      why the arrows could never be pushed clear of the cards. The working
      carousels elsewhere on the site (.featured-collection__content) never
      set overflow on the outer container at all; they rely on the page's own
      `body { overflow-x: hidden; }` to hide off-screen slides, exactly like
      this rule now does.
   2. A sitewide `button:hover, .button:hover { transform: translateY(-1px); }`
      rule (layout/theme.liquid) was hijacking the arrow's hover state — the
      arrow's resting transform is `translateY(-50%)` (vertical centering), so
      swapping to `translateY(-1px)` on hover made it visibly jump. This was
      still happening on the *disabled* arrow too (dipping down on hover and
      springing back on hover-out) because the sitewide rule has no
      `:not(:disabled)` guard — only the section's own hover styling did.
      Disabled hover is now pinned to `translateY(-50%)` explicitly so a
      disabled, inert arrow never visibly moves.
   3. No circle/background existed on the buttons at all and they sat on top
      of the card artwork instead of outside it. Give them the exact same
      circular treatment .featured-collection__content already uses.
============================================================================= */
.product-recently-viewed__content.flickity-enabled {
  overflow: visible !important;
}
.product-recently-viewed__content.flickity-enabled > .flickity-viewport {
  overflow: hidden !important;
}

.product-recently-viewed--section .flickity-button {
  z-index: 2;
  display: flex !important;
  align-items: center;
  justify-content: center;
  width: 48px !important;
  height: 48px !important;
  background-color: #ffffff !important;
  opacity: 1 !important;
  border-radius: 999px !important;
  box-shadow: 0 0 0 1px rgba(127, 127, 127, 0.05), 0 2px 5px rgba(127, 127, 127, 0.5) !important;
  transition: transform 150ms cubic-bezier(0.4, 0, 0.2, 1), box-shadow 150ms cubic-bezier(0.4, 0, 0.2, 1), opacity 150ms cubic-bezier(0.4, 0, 0.2, 1) !important;
}
.product-recently-viewed--section .flickity-button.previous {
  left: -17px !important;
}
@media screen and (min-width: 1710px) {
  .product-recently-viewed--section .flickity-button.previous {
    left: -64px !important;
  }
}
.product-recently-viewed--section .flickity-button.next {
  right: -17px !important;
}
@media screen and (min-width: 1710px) {
  .product-recently-viewed--section .flickity-button.next {
    right: -64px !important;
  }
}
.product-recently-viewed--section .flickity-button:disabled {
  cursor: initial;
  opacity: 0.5 !important;
  box-shadow: 0 0 0 1px rgba(127, 127, 127, 0.05), 0 2px 5px rgba(127, 127, 127, 0.5) !important;
}
/* Disabled arrow must be fully inert — no movement on hover or hover-out. */
.product-recently-viewed--section .flickity-button:disabled:hover {
  transform: translateY(-50%) !important;
  box-shadow: 0 0 0 1px rgba(127, 127, 127, 0.05), 0 2px 5px rgba(127, 127, 127, 0.5) !important;
}
.product-recently-viewed--section .flickity-button:disabled svg {
  opacity: 0.3;
  transform: none !important;
}
.product-recently-viewed--section .flickity-button:not(:disabled):hover {
  opacity: 1;
  transform: translateY(-50%) scale(1.125) !important;
  box-shadow: 0 0 0 1px rgba(127, 127, 127, 0.05), 0 3px 10px rgba(127, 127, 127, 0.5) !important;
}
/* The section's own native CSS (theme.css.liquid) separately scales the SVG
   icon itself on hover (transform: scale(1.2)) — neutralize that so only the
   circular button grows on hover, matching .featured-collection__content
   where the icon inside the circle stays fixed. */
.product-recently-viewed--section .flickity-button svg {
  transform: none !important;
  fill: currentColor !important;
}
.product-recently-viewed--section .flickity-button .flickity-button-icon {
  position: relative;
  top: initial;
  left: initial;
}

/* =============================================================================
   Featured-collection slideshow carousels (Best Sellers, Best Value Bundles,
   RealAged, New Series, etc.) — clip the 6th-card peek.

   `.featured-collection__content`, its `.flickity-viewport`, and its
   `.flickity-slider` all ship with `overflow: visible` (theme.css.liquid
   ~line 7893). At certain desktop widths the 5-per-row card math
   (`calc(100% / 5 - 16px)`, theme.css.liquid ~line 7841) leaves just enough
   room for the leading sliver of a 6th card to sit inside the container's
   own bounding box, so it renders as a visible cut-off edge next to the
   "next" arrow instead of staying fully off-screen. Clipping only the
   `.flickity-viewport` (not `.featured-collection__content` itself) hides
   that sliver while leaving the prev/next buttons — direct siblings of the
   viewport positioned outside it — fully visible, exactly like the
   "You recently viewed" carousel above.
============================================================================= */
.featured-collection__content.flickity-enabled > .flickity-viewport {
  overflow: hidden !important;
}

/* =============================================================================
   Product card "Sold out" badge — hide the image-overlay copy.

   snippets/product-badge.liquid renders a `.productitem__badge--soldout`
   label positioned over the product image (theme.css.liquid ~line 15994)
   in addition to the "Sold out" state already shown on the disabled
   add-to-cart button (`.atc-button--text`, product-grid-item.liquid). The
   button text alone is enough, so the image overlay is redundant — hide
   only that badge, not the sale/starter-favorite badges or the button text.
============================================================================= */
.productitem--image .productitem__badge--soldout {
  display: none !important;
}

/* =============================================================================
   Contact page — hero H1 mobile line break
   ----------------------------------------------------------------------------
   Keep accessible text "Contact Prop Money". On mobile only, break after
   "Contact" so it reads Contact / Prop Money instead of Contact Prop / Money.
============================================================================= */
body.page-contact-us .pm-contact-title-br {
  display: none;
}

@media (max-width: 767px) {
  body.page-contact-us .pm-contact-title-br {
    display: block;
  }
}

/* =============================================================================
   Homepage trust / highlights — medium desktop 2×2
   ----------------------------------------------------------------------------
   At ≥1024px, pm-premium-design-system locks a rigid 4-up row (120px height +
   nowrap). That crowds 1024–1399px and causes icon/text overlap. Keep ≥1400
   as 4-up; keep ≤1023 mobile unchanged. Homepage only.
============================================================================= */
@media screen and (min-width: 1024px) and (max-width: 1399px) {
  body.template-index .shopify-section.highlights-banner .highlights-banner__content,
  body.template-index [id*="dynamic_highlights_banner"] .highlights-banner__content,
  body.template-index .highlights-banner__content.highlight-banner__count-4 {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    overflow: hidden !important;
    flex-wrap: wrap !important;
    align-items: stretch !important;
  }

  body.template-index .shopify-section.highlights-banner .highlights-banner__block,
  body.template-index .highlight-banner__count-4 .highlights-banner__block {
    height: auto !important;
    min-height: 104px !important;
    padding: 20px 22px !important;
    align-items: center !important;
    gap: 14px !important;
  }

  body.template-index .shopify-section.highlights-banner .highlights-banner__block:first-child {
    padding-left: 22px !important;
  }

  body.template-index .shopify-section.highlights-banner .highlights-banner__block:last-child {
    padding-right: 22px !important;
  }

  /* Vertical divider only between columns (hide on end-of-row cells) */
  body.template-index .shopify-section.highlights-banner .highlights-banner__block:nth-child(2n)::after {
    display: none !important;
    content: none !important;
  }

  /* Soft horizontal rule under the first row */
  body.template-index .shopify-section.highlights-banner .highlights-banner__block:nth-child(-n + 2)::before {
    content: "" !important;
    position: absolute !important;
    left: 10% !important;
    right: 10% !important;
    bottom: 0 !important;
    height: 1px !important;
    background: linear-gradient(
      to right,
      rgba(240, 240, 240, 0) 0%,
      rgba(240, 240, 240, 1) 18%,
      rgba(240, 240, 240, 1) 82%,
      rgba(240, 240, 240, 0) 100%
    ) !important;
    pointer-events: none !important;
  }

  body.template-index .shopify-section.highlights-banner .highlights-banner__text {
    min-width: 0 !important;
    flex: 1 1 auto !important;
  }

  body.template-index .shopify-section.highlights-banner .highlights-banner__heading {
    white-space: normal !important;
    overflow: visible !important;
    text-overflow: unset !important;
  }

  body.template-index .shopify-section.highlights-banner .highlights-banner p,
  body.template-index .shopify-section.highlights-banner .highlights-banner__text p {
    white-space: normal !important;
    overflow: visible !important;
    text-overflow: unset !important;
  }

  /* Corner hover radii for 2×2 */
  body.template-index .shopify-section.highlights-banner .highlights-banner__block:first-child:hover {
    border-radius: 28px 0 0 0 !important;
  }

  body.template-index .shopify-section.highlights-banner .highlights-banner__block:nth-child(2):hover {
    border-radius: 0 28px 0 0 !important;
  }

  body.template-index .shopify-section.highlights-banner .highlights-banner__block:nth-child(3):hover {
    border-radius: 0 0 0 28px !important;
  }

  body.template-index .shopify-section.highlights-banner .highlights-banner__block:nth-child(4):hover,
  body.template-index .shopify-section.highlights-banner .highlights-banner__block:last-child:hover {
    border-radius: 0 0 28px 0 !important;
  }

  body.template-index .shopify-section.highlights-banner .highlights-banner__block:not(:first-child):not(:last-child):hover {
    border-radius: 0 !important;
  }

  body.template-index .shopify-section.highlights-banner .highlights-banner__block:nth-child(2):not(:last-child):hover {
    border-radius: 0 28px 0 0 !important;
  }

  body.template-index .shopify-section.highlights-banner .highlights-banner__block:nth-child(3):not(:first-child):hover {
    border-radius: 0 0 0 28px !important;
  }
}

/* =============================================================================
   Contact page — contact_options highlights cards
   ----------------------------------------------------------------------------
   Cascade: pm-premium-design-system applies a 4-col product-style trust grid
   to all non-homepage highlights (body:not(.template-index)). That makes the
   Contact page's 6 cards look wide, flat, and sparse. Scope only to
   body.page-contact-us so homepage + product highlights stay untouched.
============================================================================= */
body.page-contact-us .shopify-section.highlights-banner,
body.page-contact-us .highlights-banner,
body.page-contact-us .highlights-banner__container,
body.page-contact-us [id*="dynamic_highlights_banner"].highlights-banner__container {
  background: transparent !important;
  background-color: transparent !important;
  border-top: 0 !important;
  border-bottom: 0 !important;
}

body.page-contact-us .shopify-section.highlights-banner .highlights-banner__container,
body.page-contact-us .highlights-banner__container.content-width,
body.page-contact-us .highlights-banner__container.section-spacing,
body.page-contact-us [id*="dynamic_highlights_banner"].highlights-banner__container {
  max-width: none !important;
  width: 100% !important;
  padding: 12px 20px 28px !important;
  margin: 0 auto !important;
  box-sizing: border-box !important;
  background: transparent !important;
  background-color: transparent !important;
  border: 0 !important;
}

body.page-contact-us .highlights-banner__content,
body.page-contact-us [id*="dynamic_highlights_banner"] .highlights-banner__content,
body.page-contact-us .highlights-banner__content.highlight-banner__count-6 {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 22px !important;
  max-width: 1180px !important;
  width: 100% !important;
  margin: 0 auto !important;
  padding: 0 !important;
  box-sizing: border-box !important;
  align-items: stretch !important;
  justify-content: center !important;
  overflow: visible !important;
  background: transparent !important;
  background-color: transparent !important;
}

body.page-contact-us .highlights-banner__content::before,
body.page-contact-us .highlights-banner__content::after {
  display: none !important;
  content: none !important;
}

body.page-contact-us .highlights-banner__content .highlights-banner__block,
body.page-contact-us .highlights-banner__block {
  position: relative !important;
  width: auto !important;
  max-width: none !important;
  min-width: 0 !important;
  min-height: 172px !important;
  height: auto !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: flex-start !important;
  text-align: center !important;
  flex: none !important;
  gap: 0 !important;
  writing-mode: horizontal-tb !important;
  background: #ffffff !important;
  border: 1px solid #e8e8e8 !important;
  border-radius: 26px !important;
  box-shadow:
    0 1px 2px rgba(0, 0, 0, 0.03),
    0 10px 28px rgba(36, 28, 18, 0.05) !important;
  padding: 28px 28px 32px !important;
  margin: 0 !important;
  box-sizing: border-box !important;
  transition: transform 180ms ease, box-shadow 180ms ease !important;
}

body.page-contact-us .highlights-banner__content .highlights-banner__block:nth-child(4),
body.page-contact-us .highlights-banner__block:nth-child(4) {
  grid-column: auto !important;
}

/* Fixed icon slot so every title starts on the same y-line across a row */
body.page-contact-us .highlights-banner__icon {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex: 0 0 40px !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  height: 40px !important;
  min-height: 40px !important;
  margin: 0 0 12px !important;
  padding: 0 !important;
  overflow: visible !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
}

body.page-contact-us .highlights-banner__icon svg,
body.page-contact-us .highlights-banner__icon img,
body.page-contact-us .highlights-banner__icon .highlights-banner__custom-icon {
  display: block !important;
  width: 34px !important;
  height: 34px !important;
  max-width: 34px !important;
  max-height: 34px !important;
  object-fit: contain !important;
  opacity: 0.92 !important;
}

body.page-contact-us .highlights-banner__text {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  flex: 1 1 auto !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
  text-align: center !important;
}

/* One-line title slot keeps titles aligned even if wrapping is rare */
body.page-contact-us .highlights-banner__heading {
  display: block !important;
  width: 100% !important;
  min-height: 1.25em !important;
  font-size: 17px !important;
  font-weight: 600 !important;
  letter-spacing: -0.015em !important;
  line-height: 1.25 !important;
  margin: 0 0 8px !important;
  color: #1d1d1f !important;
  white-space: normal !important;
  overflow: visible !important;
  text-overflow: clip !important;
}

body.page-contact-us .highlights-banner p,
body.page-contact-us .highlights-banner__text p {
  font-size: 14.5px !important;
  line-height: 1.45 !important;
  color: #6e6e73 !important;
  max-width: none !important;
  width: 100% !important;
  margin: 0 !important;
  text-align: center !important;
  opacity: 1 !important;
  white-space: normal !important;
  overflow: visible !important;
  text-overflow: clip !important;
}

body.page-contact-us .highlights-banner__text p + p {
  margin-top: 4px !important;
}

body.page-contact-us .highlights-banner__text a,
body.page-contact-us .highlights-banner p a {
  color: #1d1d1f !important;
  text-decoration: underline !important;
  text-underline-offset: 2px !important;
  font-size: inherit !important;
}

body.page-contact-us .highlights-banner__block-link {
  position: absolute !important;
  inset: 0 !important;
  z-index: 1 !important;
  display: block !important;
}

@media (hover: hover) and (pointer: fine) {
  body.page-contact-us .highlights-banner__content .highlights-banner__block:hover,
  body.page-contact-us .highlights-banner__block:hover {
    transform: translateY(-2px) !important;
    box-shadow:
      0 2px 4px rgba(0, 0, 0, 0.04),
      0 14px 32px rgba(36, 28, 18, 0.08) !important;
  }
}

@media (max-width: 859px) {
  body.page-contact-us .highlights-banner__content,
  body.page-contact-us [id*="dynamic_highlights_banner"] .highlights-banner__content,
  body.page-contact-us .highlights-banner__content.highlight-banner__count-6 {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 18px !important;
    max-width: 1180px !important;
  }

  body.page-contact-us .highlights-banner__content .highlights-banner__block,
  body.page-contact-us .highlights-banner__block {
    min-height: 160px !important;
    padding: 26px 22px 28px !important;
    justify-content: flex-start !important;
  }
}

@media (max-width: 559px) {
  body.page-contact-us .shopify-section.highlights-banner .highlights-banner__container,
  body.page-contact-us .highlights-banner__container.content-width,
  body.page-contact-us .highlights-banner__container.section-spacing,
  body.page-contact-us [id*="dynamic_highlights_banner"].highlights-banner__container {
    padding: 8px 16px 20px !important;
  }

  body.page-contact-us .highlights-banner__content,
  body.page-contact-us [id*="dynamic_highlights_banner"] .highlights-banner__content,
  body.page-contact-us .highlights-banner__content.highlight-banner__count-6 {
    grid-template-columns: 1fr !important;
    gap: 14px !important;
    max-width: 100% !important;
  }

  body.page-contact-us .highlights-banner__content .highlights-banner__block,
  body.page-contact-us .highlights-banner__block {
    min-height: 0 !important;
    padding: 24px 22px 26px !important;
    justify-content: flex-start !important;
  }

  body.page-contact-us .highlights-banner__icon {
    flex: 0 0 36px !important;
    height: 36px !important;
    min-height: 36px !important;
    margin: 0 0 10px !important;
  }

  body.page-contact-us .highlights-banner__icon svg,
  body.page-contact-us .highlights-banner__icon img,
  body.page-contact-us .highlights-banner__icon .highlights-banner__custom-icon {
    width: 32px !important;
    height: 32px !important;
    max-width: 32px !important;
    max-height: 32px !important;
  }

  body.page-contact-us .highlights-banner__heading {
    font-size: 16px !important;
    min-height: 1.25em !important;
    margin: 0 0 6px !important;
  }

  body.page-contact-us .highlights-banner p,
  body.page-contact-us .highlights-banner__text p {
    font-size: 14px !important;
  }
}

/* Homepage featured product cards — keep availability and purchase action
   visually connected. Titles retain their reserved two-line space, so every
   card's Add to Cart button stays level without the oversized blank column. */
body.template-index #site-main .featured-collection--section .productitem--info,
body.template-index #site-main .featured-collection--section .productitem__content {
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  flex: 0 0 auto !important;
}

body.template-index #site-main .featured-collection--section .productitem--actions,
body.template-index #site-main .featured-collection--section .productitem__actions {
  margin-top: 16px !important;
  min-height: 0 !important;
  flex: 0 0 auto !important;
  padding-top: 0 !important;
}


/* Collection quick-shop: align quantity and Add to Cart as one centered purchase row. */
.modal--quickshop-slim .product-form--atc {
  width: 100% !important;
  max-width: 100% !important;
  margin-inline: auto !important;
}

.modal--quickshop-slim .product-form__action-wrapper {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 12px !important;
  width: 100% !important;
  max-width: 100% !important;
  height: auto !important;
  margin: 0 !important;
}

.modal--quickshop-slim .product-form__action-wrapper > quantity-selector.quantity-selector,
.modal--quickshop-slim .product-form__action-wrapper > .quantity-selector {
  flex: 0 0 136px !important;
  width: 136px !important;
  margin: 0 !important;
}

.modal--quickshop-slim .product-form__action-wrapper > .product-form--atc-button {
  flex: 1 1 0% !important;
  width: auto !important;
  min-width: 0 !important;
  margin: 0 !important;
}

.modal--quickshop-slim .product-form__buy-now-row {
  width: 100% !important;
  max-width: 100% !important;
  margin: 12px auto 0 !important;
  text-align: center !important;
}

.modal--quickshop-slim .product-form--buy-now-button {
  display: flex !important;
  justify-content: center !important;
  width: 100% !important;
  margin: 0 auto !important;
}
a.modal--quickshop-slim .product-form__action-wrapper{align-items:center!important;overflow:visible!important}.modal--quickshop-slim .quantity-selector{height:52px!important;min-height:52px!important;display:flex!important;align-items:center!important;align-self:center!important;overflow:visible!important}.modal--quickshop-slim .quantity-selector__wrapper{height:52px!important;min-height:52px!important;margin:0!important;box-sizing:border-box!important;overflow:visible!important;transform:.modal--quickshop-slim .product--outer{transform:translate(14px)!important}.modal--quickshop-slim .product__price .price__current,.modal--quickshop-slim .product__price .price__current .money{font-size:clamp(20px,2vw,24px)!important;font-weight:700!important;line-height:1.1!important;letter-spacing:-.02em!important}}.modal--quickshop-slim .product__price .price__current,.modal--quickshop-slim .product__price .price__current .money{font-size:clamp(20px,2vw,24px)!important;font-weight:700!important;line-height:1.1!important;letter-spacing:-.02em!important}none!important}@media(min-width:1024px){.modal--quickshop-slim .product--outer{transform:translate(0)!important}}.modal--quickshop-slim .product-form__action-wrapper .quantity-selector.quantity-selector{height:52px!important;min-height:52px!important;max-height:52px!important;overflow:visible!important;align-self:center!important}
.modal--quickshop-slim .product--outer{transform:translate(14px)!important}.modal--quickshop-slim .product__price .price__current,.modal--quickshop-slim .product__price .price__current .money{font-size:clamp(20px,2vw,24px)!important;font-weight:700!important;line-height:1.1!important;letter-spacing:-.02em!important}
@media (max-width:1023px){.modal--quickshop-slim .product--outer{transform:none!important}}
.modal--quickshop-slim .product-form--atc:has(.shopify-payment-button){display:grid!important;grid-template-columns:136px minmax(0,1fr)!important;column-gap:12px!important;row-gap:12px!important}.modal--quickshop-slim .product-form--atc:has(.shopify-payment-button) .product-form__action-wrapper{display:contents!important}.modal--quickshop-slim .product-form--atc:has(.shopify-payment-button) quantity-selector{grid-column:1!important;grid-row:1!important}.modal--quickshop-slim .product-form--atc:has(.shopify-payment-button) .product-form--atc-button{grid-column:2!important;grid-row:1!important;width:100%!important;min-width:0!important}.modal--quickshop-slim .product-form--atc:has(.shopify-payment-button) .shopify-payment-button{grid-column:1/-1!important;grid-row:2!important;width:100%!important;margin:0!important}.modal--quickshop-slim .product-form--atc:has(.shopify-payment-button) .product-form__buy-now-row{display:none!important}
.modal--quickshop-slim form:has(variant-selection:not([variant])) quantity-selector,.modal--quickshop-slim form:has(variant-selection[variant=""]) quantity-selector,.modal--quickshop-slim form:has(variant-selection[variant="not-selected"]) quantity-selector{pointer-events:none!important;opacity:.45!important;user-select:none!important}
.modal--quickshop-slim form:has(variant-selection:not([variant])) .product-form--atc-button,.modal--quickshop-slim form:has(variant-selection[variant=""]) .product-form--atc-button,.modal--quickshop-slim form:has(variant-selection[variant="not-selected"]) .product-form--atc-button{pointer-events:none!important;cursor:not-allowed!important;background:#e9e9e9!important;color:#8a8a8a!important;border-color:#d5d5d5!important;box-shadow:none!important;opacity:1!important}
.modal--quickshop-slim form:has(variant-selection:not([variant])) .product-form--buy-now-button,.modal--quickshop-slim form:has(variant-selection[variant=""]) .product-form--buy-now-button,.modal--quickshop-slim form:has(variant-selection[variant="not-selected"]) .product-form--buy-now-button{pointer-events:none!important;cursor:not-allowed!important;background:#e9e9e9!important;color:#8a8a8a!important;border-color:#d5d5d5!important;box-shadow:none!important;opacity:1!important}

.template-product #site-main .pm-option-dropdown-wrap.is-open,.modal--quickshop-slim .pm-option-dropdown-wrap.is-open{height:auto!important;max-height:none!important;overflow:visible!important}
.template-product #site-main .pm-option-dropdown-wrap.is-open .options-selection__input-select,.modal--quickshop-slim .pm-option-dropdown-wrap.is-open .options-selection__input-select{border-bottom-left-radius:0!important;border-bottom-right-radius:0!important}
.template-product #site-main .pm-option-dropdown-wrap.is-open .pm-option-dropdown__list,.modal--quickshop-slim .pm-option-dropdown-wrap.is-open .pm-option-dropdown__list{position:relative!important;top:auto!important;left:auto!important;right:auto!important;width:100%!important;margin:-1px 0 0!important;border-top:0!important;border-radius:0 0 16px 16px!important}
html body.template-product #site-main .product-details .product-form--regular .pm-option-dropdown-wrap.is-open>.options-selection__input-select,html body .modal--quickshop-slim .pm-option-dropdown-wrap.is-open>.options-selection__input-select{border-radius:16px 16px 0 0!important}
.template-product #site-main .options-selection__select:has(.pm-option-dropdown-wrap.is-open)>.options-selection__select-label[data-variant-option-chosen-value="false"],.modal--quickshop-slim .options-selection__select:has(.pm-option-dropdown-wrap.is-open)>.options-selection__select-label[data-variant-option-chosen-value="false"]{top:28px!important;transform:translateY(-50%)!important}
.template-product #site-main .options-selection__select:has(.pm-option-dropdown-wrap.is-open)>.options-selection__select-label:not([data-variant-option-chosen-value="false"]),.modal--quickshop-slim .options-selection__select:has(.pm-option-dropdown-wrap.is-open)>.options-selection__select-label:not([data-variant-option-chosen-value="false"]){top:7px!important;transform:none!important}

/* Apple-style glass scrim beneath the Add to Cart drawer */
.pm-atc-overlay{z-index:1099!important;background:rgba(12,12,14,.16)!important;-webkit-backdrop-filter:blur(16px) saturate(125%)!important;backdrop-filter:blur(16px) saturate(125%)!important}
body:has(.atc-banner--container[data-animation-state="open"]) .pm-atc-overlay{display:block!important;visibility:visible!important;opacity:1!important;pointer-events:auto!important}
body:has(.atc-banner--container[data-animation-state="open"]) .atc-banner--container{z-index:2147483647!important}
html:has(body .atc-banner--container[data-animation-state="open"]),body:has(.atc-banner--container[data-animation-state="open"]){overflow:hidden!important}
@media(max-width:719px){.pm-atc-overlay{background:rgba(12,12,14,.14)!important;-webkit-backdrop-filter:blur(12px) saturate(120%)!important;backdrop-filter:blur(12px) saturate(120%)!important}}
@media(prefers-reduced-motion:reduce){.pm-atc-overlay{transition:none!important}}


/* Product ATC loading state — suppress MDC ripple disks; theme/custom-overrides own the ring. */
body.template-product #site-main .product-form--atc-button.mdc-ripple-surface::before,
body.template-product #site-main .product-form--atc-button.mdc-ripple-surface::after,
body.template-product #site-main .product-form--atc-button.mdc-ripple-upgraded::before,
body.template-product #site-main .product-form--atc-button.mdc-ripple-upgraded::after,
body.template-product #site-main .product-form--atc-button .atc-button--icon::before,
body.template-product #site-main .product-form--atc-button .atc-button--icon::after,
body.template-product #site-main .pm-mobile-purchase__button.product-form--atc-button.mdc-ripple-surface::before,
body.template-product #site-main .pm-mobile-purchase__button.product-form--atc-button.mdc-ripple-surface::after {
  content: none !important;
  display: none !important;
  opacity: 0 !important;
  background: transparent !important;
  animation: none !important;
}

body.template-product #site-main .product-form--atc-button.processing::before,
body.template-product #site-main .product-form--atc-button.processing::after,
body.template-product #site-main .pm-mobile-purchase__button.product-form--atc-button.processing::before,
body.template-product #site-main .pm-mobile-purchase__button.product-form--atc-button.processing::after {
  content: none !important;
  display: none !important;
  opacity: 0 !important;
  background: transparent !important;
}

/* === PM JUL19 RECENTLY VIEWED + PRODUCT POLISH === */

/* Never surface the Redo service product as storefront merchandise. */
.product-recently-viewed-card[data-product-quickshop-url*="/products/free-unlimited-return-valid-in-us"],
.productgrid--item[data-product-quickshop-url*="/products/free-unlimited-return-valid-in-us"],
.productitem[data-product-quickshop-url*="/products/free-unlimited-return-valid-in-us"],
.product-recently-viewed-card:has(a[href*="/products/free-unlimited-return-valid-in-us"]),
.productgrid--item:has(a[href*="/products/free-unlimited-return-valid-in-us"]),
.productitem:has(a[href*="/products/free-unlimited-return-valid-in-us"]),
.search-flydown--product:has(a[href*="/products/free-unlimited-return-valid-in-us"]),
.live-search--product:has(a[href*="/products/free-unlimited-return-valid-in-us"]) {
  display: none !important;
}

/* Keep every recently-viewed action on one clean baseline. */
.product-recently-viewed-card {
  height: 100% !important;
  align-self: stretch !important;
}
.product-recently-viewed-card .productitem,
.product-recently-viewed-card .productitem__container,
.product-recently-viewed-card .productitem--info {
  display: flex !important;
  flex-direction: column !important;
  height: 100% !important;
}
.product-recently-viewed-card .productitem--info {
  flex: 1 1 auto !important;
}
.product-recently-viewed-card .jdgm-preview-badge {
  min-height: 32px !important;
}
.product-recently-viewed-card .productitem--title {
  min-height: 42px !important;
}
.product-recently-viewed-card .productitem__price {
  min-height: 46px !important;
}
.product-recently-viewed-card .productitem--actions {
  margin-top: auto !important;
}

/* PM JUL19 QUICKSHOP CLOSE HIT AREA */
.modal--quickshop-slim .modal-close {
  position: absolute !important;
  z-index: 30 !important;
  pointer-events: auto !important;
}

/* PM JUL19 CARD + LOADER + QUICKSHOP FINALITY */

/* Recently viewed: every card keeps a full-height content column and a common action baseline. */
.product-recently-viewed__content {
  align-items: stretch !important;
}
.product-recently-viewed__content > .product-recently-viewed-card {
  display: flex !important;
  align-self: stretch !important;
  height: auto !important;
  min-height: 100% !important;
}
.product-recently-viewed__content > .product-recently-viewed-card > .productitem,
.product-recently-viewed__content > .product-recently-viewed-card .productitem__container {
  display: flex !important;
  flex: 1 1 auto !important;
  flex-direction: column !important;
  min-height: 100% !important;
}
.product-recently-viewed__content > .product-recently-viewed-card .productitem--info {
  display: flex !important;
  flex: 1 1 auto !important;
  flex-direction: column !important;
}
.product-recently-viewed__content > .product-recently-viewed-card .productitem--actions {
  margin-top: auto !important;
}

/* PM JUL19 PORTRAIT SHOP HEIGHT LOCK */
@media screen and (max-width: 600px) and (orientation: portrait) {
  body.template-product #site-main .product-form--atc-button:not(.pm-mobile-purchase__button) {
    min-height: 54px !important;
    height: 54px !important;
  }
  body.template-product #site-main .shopify-payment-button,
  body.template-product #site-main shopify-accelerated-checkout {
    min-height: 54px !important;
    line-height: 54px !important;
    text-align: center !important;
  }
  body.template-product #site-main shopify-accelerated-checkout {
    --shopify-accelerated-checkout-button-block-size: 54px !important;
  }
}

/* Keep Judge.me review stars fully inside mobile Recently Viewed cards. */
@media screen and (max-width: 719px) {
  .product-recently-viewed--section .jdgm-prev-badge,
  .product-recently-viewed--section .jdgm-preview-badge {
    display: flex !important;
    align-items: center !important;
    min-height: 28px !important;
    padding: 1px 0 3px !important;
    line-height: 1.35 !important;
    overflow: visible !important;
  }
  .product-recently-viewed--section .jdgm-prev-badge .jdgm-star,
  .product-recently-viewed--section .jdgm-preview-badge .jdgm-star {
    display: inline-flex !important;
    align-items: center !important;
    height: 1.35em !important;
    line-height: 1.35 !important;
    overflow: visible !important;
  }
  .product-recently-viewed--section .productitem--info,
  .product-recently-viewed--section .productitem__content {
    overflow: visible !important;
  }
}

/* Mobile product pages — preserve native horizontal scrolling for Recently Viewed. */
@media screen and (max-width: 859px) {
  body.template-product #site-main .product-recently-viewed--section .product-recently-viewed__content--native {
    overflow-x: auto !important;
    overflow-y: hidden !important;
    -webkit-overflow-scrolling: touch !important;
    overscroll-behavior-x: contain !important;
    touch-action: pan-x pan-y !important;
    scrollbar-width: none !important;
  }

  body.template-product #site-main .product-recently-viewed--section .product-recently-viewed__content--native::-webkit-scrollbar {
    display: none !important;
  }

  body.template-product #site-main .product-recently-viewed--section .product-recently-viewed__content--native > .productgrid--item,
  body.template-product #site-main .product-recently-viewed--section .product-recently-viewed__content--native > .product-recently-viewed-card {
    flex: 0 0 auto !important;
  }
}

/* =============================================================================
   Announcement bar — pause/play control (Premium Tweaks rotating bar)
   Reserve symmetric 44px gutters so centered text stays balanced; control sits
   at the far right without shifting layout on first paint.
============================================================================= */
.announcement-static.announcement-rotating[data-pm-announcement-rotating] {
  padding-left: 44px !important;
  padding-right: 44px !important;
  box-sizing: border-box !important;
}

.pm-announcement-control {
  position: absolute !important;
  right: 0 !important;
  top: 50% !important;
  z-index: 5 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 44px !important;
  min-width: 44px !important;
  height: 44px !important;
  min-height: 44px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  color: inherit !important;
  cursor: pointer !important;
  transform: translateY(-50%) !important;
  -webkit-tap-highlight-color: transparent !important;
  opacity: 0.55 !important;
  transition: opacity 180ms ease !important;
}

.pm-announcement-control:hover,
.pm-announcement-control:focus-visible {
  opacity: 0.88 !important;
}

.pm-announcement-control:focus-visible {
  outline: 1px solid currentColor !important;
  outline-offset: 2px !important;
}

.pm-announcement-control__icon {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 15px !important;
  height: 15px !important;
  line-height: 0 !important;
}

.pm-announcement-control__icon svg {
  display: block !important;
  width: 15px !important;
  height: 15px !important;
}

.pm-announcement-control__icon--play[hidden],
.pm-announcement-control__icon--pause[hidden] {
  display: none !important;
}

.pm-anno-band .announcement-static,
.pm-anno-band .announcement-static.announcement-rotating,
.pm-anno-band .announcement-static.announcement-bar,
.announcement-static.announcement-rotating[data-pm-announcement-rotating],
.announcement-static.announcement-rotating,
.announcement-static.announcement-bar {
  border-radius: 14px !important;
}

@media screen and (min-width: 1024px) {
  .announcement-static.announcement-rotating[data-pm-announcement-rotating] .pm-announcement-control {
    color: #ffffff !important;
  }
}

@media screen and (max-width: 1023px) {
  .pm-announcement-control {
    right: 5px !important;
    opacity: 0.48 !important;
  }

  .pm-announcement-control:hover,
  .pm-announcement-control:focus-visible {
    opacity: 0.72 !important;
  }

  .pm-announcement-control__icon,
  .pm-announcement-control__icon svg {
    width: 12px !important;
    height: 12px !important;
  }
}

/* =============================================================================
   Product page — Judge.me review cards (Premium Tweaks)
   Balanced card padding, compact hierarchy, 2-up desktop / 1-up mobile initial
   reveal handled in pm-jdgm-reviews-display.js (Load More stays native).
============================================================================= */
/* Summary card — hide widget-level customer photo strip; photos stay on review cards. */
.template-product #site-main .jdgm-rev-widg .jdgm-rev-widg__pics,
.template-product #site-main .jdgm-rev-widg .jdgm-rev-widg__pic-list,
.template-product #site-main .jdgm-rev-widg .jdgm-ugc-media-wrapper,
.template-product #site-main .jdgm-rev-widg .jdgm-gallery-wrapper,
.template-product #site-main .jdgm-rev-widg .jdgm-gallery-title,
.template-product #site-main .jdgm-rev-widg .jdgm-rev-widg__header .jdgm-gallery,
.template-product #site-main .jdgm-rev-widg .jdgm-rev-widg__summary .jdgm-gallery {
  display: none !important;
  visibility: hidden !important;
  height: 0 !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  pointer-events: none !important;
  border: 0 !important;
}

/* =============================================================================
   Product page — Judge.me summary card (Apple-premium compact)
   Structure unchanged; typography, spacing, card shell, sort toolbar only.
============================================================================= */
.template-product #site-main .jdgm-rev-widg {
  max-width: 1240px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding: 40px 20px 44px !important;
  box-sizing: border-box !important;
}

.template-product #site-main .jdgm-rev-widg .jdgm-rev-widg__header {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center !important;
  width: 100% !important;
  max-width: 1240px !important;
  margin: 0 auto !important;
  padding: 28px 24px !important;
  background: #ffffff !important;
  background-image: none !important;
  border: 1px solid #ececec !important;
  border-radius: 28px !important;
  box-shadow:
    0 20px 60px rgba(0, 0, 0, 0.07),
    0 4px 14px rgba(0, 0, 0, 0.04) !important;
  box-sizing: border-box !important;
}

.template-product #site-main .jdgm-rev-widg .jdgm-rev-widg__title,
.template-product #site-main .jdgm-rev-widg .jdgm-rev-widg__title * {
  font-size: 28px !important;
  font-weight: 600 !important;
  letter-spacing: -0.028em !important;
  line-height: 1.08 !important;
  color: #111111 !important;
  margin: 0 0 10px !important;
  padding: 0 !important;
  text-align: center !important;
}

.template-product #site-main .jdgm-rev-widg .jdgm-row-stars,
.template-product #site-main .jdgm-rev-widg .jdgm-row-stars--only-summary {
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  float: none !important;
}

.template-product #site-main .jdgm-rev-widg .jdgm-rev-widg__summary,
.template-product #site-main .jdgm-rev-widg .jdgm-rev-widg__summary-inner {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  float: none !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  opacity: 1 !important;
}

.template-product #site-main .jdgm-rev-widg .jdgm-rev-widg__summary-inner {
  gap: 6px !important;
}

.template-product #site-main .jdgm-rev-widg .jdgm-rev-widg__summary-stars {
  display: flex !important;
  flex-wrap: wrap !important;
  justify-content: center !important;
  align-items: center !important;
  gap: 1px 2px !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  line-height: 1 !important;
}

.template-product #site-main .jdgm-rev-widg .jdgm-rev-widg__summary-stars .jdgm-star {
  font-size: 16px !important;
  width: 16px !important;
  height: 16px !important;
  line-height: 1 !important;
  margin: 0 !important;
}

.template-product #site-main .jdgm-rev-widg .jdgm-rev-widg__summary-average {
  flex: 0 0 100% !important;
  width: 100% !important;
  margin: 2px 0 0 !important;
  padding: 0 !important;
  font-size: 15px !important;
  font-weight: 600 !important;
  line-height: 1.25 !important;
  letter-spacing: -0.012em !important;
  color: #111111 !important;
  text-align: center !important;
}

.template-product #site-main .jdgm-rev-widg .jdgm-rev-widg__summary-text {
  margin: 0 !important;
  padding: 0 !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  line-height: 1.3 !important;
  letter-spacing: -0.008em !important;
  color: #8a8a8e !important;
  text-align: center !important;
}

.template-product #site-main .jdgm-rev-widg .jdgm-row-actions,
.template-product #site-main .jdgm-rev-widg .jdgm-rev-widg__sort-wrapper {
  display: flex !important;
  justify-content: flex-start !important;
  align-items: center !important;
  width: 100% !important;
  max-width: 1240px !important;
  margin: 14px auto 18px !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

.template-product #site-main .jdgm-rev-widg .jdgm-sort-dropdown-wrapper {
  display: inline-flex !important;
  position: relative !important;
  width: fit-content !important;
  min-width: 0 !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  overflow: visible !important;
}

.template-product #site-main .jdgm-rev-widg .jdgm-sort-dropdown-wrapper > *:not(select),
.template-product #site-main .jdgm-rev-widg .jdgm-sort-dropdown-wrapper svg,
.template-product #site-main .jdgm-rev-widg .jdgm-sort-dropdown-arrow {
  display: none !important;
}

.template-product #site-main .jdgm-rev-widg .jdgm-sort-dropdown-wrapper::after {
  content: "" !important;
  position: absolute !important;
  top: 50% !important;
  right: 14px !important;
  transform: translateY(-50%) !important;
  width: 12px !important;
  height: 8px !important;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8' fill='none'%3E%3Cpath d='M1 1.5L6 6.5L11 1.5' stroke='%238A8A8E' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat !important;
  pointer-events: none !important;
  z-index: 2 !important;
}

.template-product #site-main .jdgm-rev-widg .jdgm-sort-dropdown,
.template-product #site-main .jdgm-rev-widg .jdgm-rev-widg__sort-wrapper select {
  appearance: none !important;
  -webkit-appearance: none !important;
  -moz-appearance: none !important;
  display: inline-block !important;
  width: auto !important;
  min-width: max-content !important;
  height: 48px !important;
  min-height: 48px !important;
  max-height: 48px !important;
  padding: 0 38px 0 14px !important;
  margin: 0 !important;
  border: 1px solid #ececec !important;
  border-radius: 16px !important;
  background: #ffffff !important;
  background-image: none !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  line-height: 48px !important;
  letter-spacing: -0.008em !important;
  color: #111111 !important;
  cursor: pointer !important;
  box-sizing: border-box !important;
  outline: none !important;
  box-shadow: none !important;
  transition:
    border-color 0.18s ease,
    box-shadow 0.18s ease,
    background-color 0.18s ease !important;
}

.template-product #site-main .jdgm-rev-widg .jdgm-sort-dropdown:hover,
.template-product #site-main .jdgm-rev-widg .jdgm-rev-widg__sort-wrapper select:hover {
  border-color: #d8d8dc !important;
  background-color: #fafafa !important;
}

.template-product #site-main .jdgm-rev-widg .jdgm-sort-dropdown:focus,
.template-product #site-main .jdgm-rev-widg .jdgm-rev-widg__sort-wrapper select:focus,
.template-product #site-main .jdgm-rev-widg .jdgm-sort-dropdown:focus-visible,
.template-product #site-main .jdgm-rev-widg .jdgm-rev-widg__sort-wrapper select:focus-visible {
  outline: none !important;
  border-color: #c8c8cc !important;
  box-shadow: 0 0 0 3px rgba(0, 0, 0, 0.05) !important;
}

@media screen and (min-width: 1024px) {
  .template-product #site-main .jdgm-rev-widg {
    padding: 56px 32px 48px !important;
  }

  .template-product #site-main .jdgm-rev-widg .jdgm-rev-widg__header {
    padding: 48px !important;
  }

  .template-product #site-main .jdgm-rev-widg .jdgm-rev-widg__title,
  .template-product #site-main .jdgm-rev-widg .jdgm-rev-widg__title * {
    font-size: clamp(34px, 2.35vw, 40px) !important;
    margin-bottom: 12px !important;
  }

  .template-product #site-main .jdgm-rev-widg .jdgm-rev-widg__summary-inner {
    gap: 8px !important;
  }

  .template-product #site-main .jdgm-rev-widg .jdgm-row-actions,
  .template-product #site-main .jdgm-rev-widg .jdgm-rev-widg__sort-wrapper {
    margin-top: 16px !important;
    margin-bottom: 22px !important;
  }
}

@media screen and (max-width: 1023px) {
  .template-product #site-main .jdgm-rev-widg {
    padding: 32px 0 36px !important;
    overflow: visible !important;
  }

  .template-product #site-main .jdgm-rev-widg .jdgm-rev-widg__header {
    width: calc(100% - 32px) !important;
    max-width: none !important;
    margin: 0 16px !important;
    padding: 28px !important;
    border: 1px solid #e8e8e8 !important;
    border-radius: 28px !important;
    background: #ffffff !important;
    box-shadow: 0 16px 40px rgba(0, 0, 0, 0.06) !important;
    overflow: visible !important;
  }

  .template-product #site-main .jdgm-rev-widg .jdgm-row-actions,
  .template-product #site-main .jdgm-rev-widg .jdgm-rev-widg__sort-wrapper {
    width: calc(100% - 32px) !important;
    max-width: none !important;
    justify-content: center !important;
    margin: 24px 16px 30px !important;
    padding: 0 !important;
  }

  .template-product #site-main .jdgm-rev-widg .jdgm-sort-dropdown-wrapper {
    position: relative !important;
  }

  .template-product #site-main .jdgm-rev-widg .jdgm-sort-dropdown,
  .template-product #site-main .jdgm-rev-widg .jdgm-rev-widg__sort-wrapper select {
    width: auto !important;
    height: 48px !important;
    min-height: 48px !important;
    max-height: 48px !important;
    line-height: 48px !important;
    padding: 0 52px 0 34px !important;
    border-radius: 16px !important;
    text-align: center !important;
    text-align-last: center !important;
  }

  .template-product #site-main .jdgm-rev-widg .jdgm-sort-dropdown-wrapper::after {
    position: absolute !important;
    top: 50% !important;
    right: 18px !important;
    transform: translateY(-50%) !important;
  }
}

@media screen and (min-width: 1024px) {
  .template-product #site-main .jdgm-rev-widg .jdgm-rev-widg__header:has(+ .jdgm-rev-widg__pics),
  .template-product #site-main .jdgm-rev-widg .jdgm-rev-widg__header:has(+ .jdgm-ugc-media-wrapper),
  .template-product #site-main .jdgm-rev-widg .jdgm-rev-widg__header:has(+ .jdgm-gallery-wrapper) {
    border-radius: 28px !important;
    margin-bottom: 0 !important;
    box-shadow:
      0 20px 60px rgba(0, 0, 0, 0.07),
      0 4px 14px rgba(0, 0, 0, 0.04) !important;
  }
}

.template-product #site-main .jdgm-rev-widg .jdgm-rev.pm-jdgm-rev--hidden {
  display: none !important;
}

.template-product #site-main .jdgm-rev-widg .jdgm-divider-top,
.template-product #site-main .jdgm-rev-widg .jdgm-divider-bottom,
.template-product #site-main .jdgm-rev-widg .jdgm-rev.jdgm-divider-top,
.template-product #site-main .jdgm-rev-widg .jdgm-rev.jdgm-divider-bottom {
  border-top: 0 !important;
  border-bottom: 0 !important;
}

@media screen and (max-width: 1023px) {
  /* Mobile Judge.me summary area: no divider between sort and first review. */
  .template-product #site-main .jdgm-rev-widg .jdgm-rev-widg__summary,
  .template-product #site-main .jdgm-rev-widg .jdgm-rev-widg__summary-inner,
  .template-product #site-main .jdgm-rev-widg .jdgm-rev-widg__body,
  .template-product #site-main .jdgm-rev-widg .jdgm-row-actions,
  .template-product #site-main .jdgm-rev-widg .jdgm-rev-widg__sort-wrapper,
  .template-product #site-main .jdgm-rev-widg .jdgm-divider-top:not(.jdgm-rev):not(.jdgm-quest),
  .template-product #site-main .jdgm-rev-widg .jdgm-rev-widg__actions,
  .template-product #site-main .jdgm-rev-widg .jdgm-rev-widg__actions * {
    border-top: 0 !important;
    border-bottom: 0 !important;
  }

  .template-product #site-main .jdgm-rev-widg .jdgm-rev-widg__body,
  .template-product #site-main .jdgm-rev-widg .jdgm-rev-widg__reviews {
    border-top: 0 !important;
    margin-top: 0 !important;
    padding-top: 0 !important;
  }

  .template-product #site-main .jdgm-rev-widg .jdgm-rev-widg__body > .jdgm-rev:first-child,
  .template-product #site-main .jdgm-rev-widg .jdgm-rev-widg__reviews > .jdgm-rev:first-child {
    border-top: 0 !important;
    margin-top: 0 !important;
    padding-top: 0 !important;
  }

  .template-product #site-main .jdgm-rev-widg .jdgm-rev-widg__actions {
    border-top: 0 !important;
    margin-top: 0 !important;
    padding-top: 0 !important;
  }

  .template-product #site-main .jdgm-rev-widg .jdgm-rev-widg__actions .jdgm-row-actions,
  .template-product #site-main .jdgm-rev-widg .jdgm-rev-widg__actions .jdgm-rev-widg__sort-wrapper,
  .template-product #site-main .jdgm-rev-widg .jdgm-rev-widg__actions .jdgm-sort-dropdown-wrapper {
    margin-top: 0 !important;
    padding-top: 0 !important;
  }
}

.template-product #site-main .jdgm-rev-widg .jdgm-rev-widg__reviews {
  display: flex !important;
  flex-direction: column !important;
  gap: 12px !important;
  margin: 0 !important;
  padding: 0 !important;
}

.template-product #site-main .jdgm-rev-widg .jdgm-rev {
  display: block !important;
  box-sizing: border-box !important;
  background: #ffffff !important;
  border: 1px solid #ececec !important;
  border-radius: 14px !important;
  padding: 16px 18px !important;
  margin: 0 !important;
  overflow: hidden !important;
  box-shadow:
    0 1px 3px rgba(0, 0, 0, 0.04),
    0 8px 22px rgba(0, 0, 0, 0.045) !important;
}

@media screen and (max-width: 1023px) {
  .template-product #site-main .jdgm-rev-widg .jdgm-rev {
    padding: 13px 18px !important;
  }
}

.template-product #site-main .jdgm-rev-widg .jdgm-rev__content,
.template-product #site-main .jdgm-rev-widg .jdgm-rev_content {
  padding: 0 !important;
  margin: 0 !important;
}

.template-product #site-main .jdgm-rev-widg .jdgm-rev__header {
  display: flex !important;
  flex-direction: column !important;
  gap: 8px !important;
  margin: 0 0 10px !important;
  padding: 0 !important;
}

.template-product #site-main .jdgm-rev-widg .jdgm-row-rating,
.template-product #site-main .jdgm-rev-widg .jdgm-row-profile,
.template-product #site-main .jdgm-rev-widg .jdgm-row-extra,
.template-product #site-main .jdgm-rev-widg .jdgm-row-product {
  margin: 0 !important;
  padding: 0 !important;
}

.template-product #site-main .jdgm-rev-widg .jdgm-row-rating {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 10px !important;
  width: 100% !important;
}

.template-product #site-main .jdgm-rev-widg .jdgm-row-profile {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  width: 100% !important;
}

.template-product #site-main .jdgm-rev-widg .jdgm-rev__rating {
  margin: 0 !important;
  padding: 0 !important;
  line-height: 1 !important;
}

.template-product #site-main .jdgm-rev-widg .jdgm-rev__rating .jdgm-star {
  font-size: 15px !important;
  width: 15px !important;
  height: 15px !important;
  line-height: 1 !important;
}

.template-product #site-main .jdgm-rev-widg .jdgm-rev__timestamp {
  font-size: 12px !important;
  line-height: 1.2 !important;
  color: #8e8e93 !important;
  margin: 0 !important;
  white-space: nowrap !important;
}

.template-product #site-main .jdgm-rev-widg .jdgm-rev__icon,
.template-product #site-main .jdgm-rev-widg .jdgm-rev__buyer-avatar {
  flex: 0 0 36px !important;
  width: 36px !important;
  height: 36px !important;
  min-width: 36px !important;
  min-height: 36px !important;
  margin: 0 !important;
  border-radius: 50% !important;
  overflow: hidden !important;
  background: #f3f3f3 !important;
}

.template-product #site-main .jdgm-rev-widg .jdgm-rev__icon:empty {
  background: #f0f0f0 !important;
}

.template-product #site-main .jdgm-rev-widg .jdgm-rev__icon img,
.template-product #site-main .jdgm-rev-widg .jdgm-rev__buyer-avatar img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  border-radius: 50% !important;
}

.template-product #site-main .jdgm-rev-widg .jdgm-rev__author-wrapper {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 10px !important;
  min-width: 0 !important;
}

.template-product #site-main .jdgm-rev-widg .jdgm-rev__author,
.template-product #site-main .jdgm-rev-widg .jdgm-rev__buyer-name {
  font-size: 14px !important;
  font-weight: 700 !important;
  line-height: 1.25 !important;
  color: #111111 !important;
  margin: 0 !important;
  flex: 0 1 auto !important;
}

.template-product #site-main .jdgm-rev-widg .jdgm-rev__buyer-badge-wrapper {
  display: inline-flex !important;
  align-items: center !important;
  flex: 0 0 auto !important;
  margin: 0 !important;
}

.template-product #site-main .jdgm-rev-widg .jdgm-rev__verified-badge,
.template-product #site-main .jdgm-rev-widg .jdgm-rev__buyer-badge {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 4px !important;
  box-sizing: border-box !important;
  width: auto !important;
  height: auto !important;
  min-width: 0 !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 3px 7px !important;
  border: 1px solid #e3e3e6 !important;
  border-radius: 6px !important;
  background: #f3f3f4 !important;
  color: #5c5c5c !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  line-height: 1.2 !important;
  letter-spacing: -0.01em !important;
  white-space: nowrap !important;
  opacity: 1 !important;
}

.template-product #site-main .jdgm-rev-widg .jdgm-rev__verified-badge::before,
.template-product #site-main .jdgm-rev-widg .jdgm-rev__buyer-badge::before {
  content: "" !important;
  display: inline-block !important;
  flex: 0 0 11px !important;
  width: 11px !important;
  height: 11px !important;
  background: center / contain no-repeat
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' fill='none'%3E%3Cpath d='M2.5 6.2 4.8 8.5 9.5 3.8' stroke='%235c5c5c' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") !important;
}

.template-product #site-main .jdgm-rev-widg .jdgm-rev__buyer-badge::after {
  content: "Verified" !important;
}

.template-product #site-main .jdgm-rev-widg .jdgm-rev__title {
  font-size: 17px !important;
  font-weight: 700 !important;
  letter-spacing: -0.02em !important;
  line-height: 1.25 !important;
  color: #111111 !important;
  margin: 0 0 6px !important;
  padding: 0 !important;
}

.template-product #site-main .jdgm-rev-widg .jdgm-rev__body,
.template-product #site-main .jdgm-rev-widg .jdgm-rev__body p {
  font-size: 15px !important;
  line-height: 1.5 !important;
  color: #555555 !important;
  margin: 0 !important;
  padding: 0 !important;
  max-width: none !important;
}

.template-product #site-main .jdgm-rev-widg .jdgm-rev__body-read-more {
  margin-top: 6px !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  line-height: 1.3 !important;
  color: #111111 !important;
  text-decoration: underline !important;
  text-underline-offset: 2px !important;
  cursor: pointer !important;
}

.template-product #site-main .jdgm-rev-widg .jdgm-rev__body.is-truncated .jdgm-rev__body-read-more {
  display: inline-block !important;
}

.template-product #site-main .jdgm-rev-widg .jdgm-rev__body:not(.is-truncated) .jdgm-rev__body-read-more,
.template-product #site-main .jdgm-rev-widg .jdgm-rev__body[data-pm-jdgm-expanded="1"] .jdgm-rev__body-read-more {
  display: none !important;
}

.template-product #site-main .jdgm-rev-widg .jdgm-rev__pics {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
  margin: 10px 0 0 !important;
  padding: 0 !important;
}

.template-product #site-main .jdgm-rev-widg .jdgm-rev__pic-link,
.template-product #site-main .jdgm-rev-widg .jdgm-rev__pic-img,
.template-product #site-main .jdgm-rev-widg .jdgm-rev__pics img {
  width: 72px !important;
  height: 72px !important;
  min-width: 72px !important;
  min-height: 72px !important;
  border-radius: 12px !important;
  object-fit: cover !important;
  border: 1px solid #ececec !important;
  margin: 0 !important;
  box-shadow: none !important;
}

.template-product #site-main .jdgm-rev-widg .jdgm-rev__actions {
  margin: 0 !important;
  padding: 0 !important;
}

.template-product #site-main .jdgm-rev-widg:not(.pm-jdgm-rev-widg--exhausted) .jdgm-paginate,
.template-product #site-main .jdgm-rev-widg .jdgm-divider-bottom {
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  width: 100% !important;
  margin: 18px 0 0 !important;
  padding: 0 !important;
  border: 0 !important;
}

.template-product #site-main .jdgm-rev-widg.pm-jdgm-rev-widg--exhausted .jdgm-paginate {
  display: none !important;
  margin: 0 !important;
  padding: 0 !important;
  min-height: 0 !important;
  height: 0 !important;
  overflow: hidden !important;
  opacity: 0 !important;
  pointer-events: none !important;
  visibility: hidden !important;
}

.template-product #site-main .jdgm-rev-widg .jdgm-rev-widg__paginate-spinner-wrapper,
.template-product #site-main .jdgm-rev-widg .jdgm-spinner {
  display: none !important;
  visibility: hidden !important;
  height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
}

.template-product #site-main .jdgm-rev-widg .jdgm-paginate__load-more {
  position: relative !important;
  overflow: visible !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 220px !important;
  height: 48px !important;
  min-height: 48px !important;
  padding: 0 32px !important;
  border: 0 !important;
  border-radius: 999px !important;
  background: #111111 !important;
  background-color: #111111 !important;
  color: #ffffff !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  letter-spacing: -0.01em !important;
  margin: 0 !important;
  white-space: nowrap !important;
  cursor: pointer !important;
  box-shadow:
    0 2px 8px rgba(0, 0, 0, 0.08),
    0 8px 24px rgba(0, 0, 0, 0.12) !important;
  transition: transform 0.2s ease, box-shadow 0.2s ease, background-color 0.2s ease !important;
}

.template-product #site-main .jdgm-rev-widg .jdgm-paginate__load-more .pm-jdgm-load-more__label {
  display: inline-block !important;
  transition:
    opacity 150ms cubic-bezier(0.4, 0, 0.2, 1),
    transform 150ms cubic-bezier(0.4, 0, 0.2, 1) !important;
}

.template-product #site-main .jdgm-rev-widg .jdgm-paginate__load-more .pm-jdgm-load-more__icon {
  position: absolute !important;
  top: 50% !important;
  left: 50% !important;
  display: block !important;
  margin-top: -13px !important;
  margin-left: -13px !important;
  visibility: hidden !important;
  opacity: 0 !important;
  pointer-events: none !important;
  z-index: 2 !important;
  background: transparent !important;
  transition: opacity 150ms cubic-bezier(0.4, 0, 0.2, 1) !important;
}

.template-product #site-main .jdgm-rev-widg .jdgm-paginate__load-more .pm-jdgm-load-more__icon svg {
  display: block !important;
  width: 26px !important;
  height: 26px !important;
  transform: scale(0.8) !important;
  transition: transform 150ms cubic-bezier(0.4, 0, 0.2, 1) !important;
}

.template-product #site-main .jdgm-rev-widg .jdgm-paginate__load-more .pm-jdgm-load-more__icon,
.template-product #site-main .jdgm-rev-widg .jdgm-paginate__load-more .pm-jdgm-load-more__icon svg,
.template-product #site-main .jdgm-rev-widg .jdgm-paginate__load-more .pm-jdgm-load-more__icon svg circle,
.template-product #site-main .jdgm-rev-widg .jdgm-paginate__load-more.pm-jdgm-load-more--processing .pm-jdgm-load-more__icon,
.template-product #site-main .jdgm-rev-widg .jdgm-paginate__load-more.pm-jdgm-load-more--processing .pm-jdgm-load-more__icon svg,
.template-product #site-main .jdgm-rev-widg .jdgm-paginate__load-more.pm-jdgm-load-more--processing .pm-jdgm-load-more__icon svg circle {
  fill: none !important;
  background: transparent !important;
}

.template-product #site-main .jdgm-rev-widg .jdgm-paginate__load-more .pm-jdgm-load-more__icon svg circle,
.template-product #site-main .jdgm-rev-widg .jdgm-paginate__load-more.pm-jdgm-load-more--processing .pm-jdgm-load-more__icon svg circle {
  stroke: currentColor !important;
  stroke-width: 4 !important;
  stroke-linecap: round !important;
}

.template-product #site-main .jdgm-rev-widg .jdgm-paginate__load-more.pm-jdgm-load-more--processing {
  pointer-events: none !important;
  color: #ffffff !important;
}

.template-product #site-main .jdgm-rev-widg .jdgm-paginate__load-more.pm-jdgm-load-more--processing .pm-jdgm-load-more__label {
  opacity: 0 !important;
  transform: scale(1.075) !important;
}

.template-product #site-main .jdgm-rev-widg .jdgm-paginate__load-more.pm-jdgm-load-more--processing .pm-jdgm-load-more__icon {
  visibility: visible !important;
  opacity: 1 !important;
}

.template-product #site-main .jdgm-rev-widg .jdgm-paginate__load-more.pm-jdgm-load-more--processing .pm-jdgm-load-more__icon svg {
  transform: scale(1) !important;
}

.template-product #site-main .jdgm-rev-widg .jdgm-paginate__load-more:hover {
  background: #222222 !important;
  background-color: #222222 !important;
  color: #ffffff !important;
  transform: translateY(-1px) !important;
}

@media screen and (min-width: 1024px) {
  .template-product #site-main .jdgm-rev-widg .jdgm-rev-widg__reviews {
    gap: 14px !important;
  }

  .template-product #site-main .jdgm-rev-widg .jdgm-rev {
    padding: 18px 22px !important;
  }

  .template-product #site-main .jdgm-rev-widg .jdgm-rev__header {
    margin-bottom: 12px !important;
  }

  .template-product #site-main .jdgm-rev-widg .jdgm-rev__rating .jdgm-star {
    font-size: 16px !important;
    width: 16px !important;
    height: 16px !important;
  }

  .template-product #site-main .jdgm-rev-widg .jdgm-rev__title {
    font-size: 18px !important;
    margin-bottom: 8px !important;
  }

  .template-product #site-main .jdgm-rev-widg .jdgm-rev__verified-badge,
  .template-product #site-main .jdgm-rev-widg .jdgm-rev__buyer-badge {
    font-size: 13px !important;
    padding: 3px 8px !important;
  }

  .template-product #site-main .jdgm-rev-widg .jdgm-paginate {
    margin-top: 22px !important;
  }
}

@media screen and (max-width: 1023px) and (orientation: landscape) {
  .template-product #site-main .jdgm-rev-widg .jdgm-rev {
    padding: 15px 17px !important;
  }
}

/* =============================================================================
   Product page — Judge.me review-image lightbox
   Custom dialog overlay (rounded image, screen-corner close, side arrows).
============================================================================= */

html.pm-jdgm-lightbox-scroll-lock,
html.pm-jdgm-lightbox-scroll-lock body {
  overflow: hidden !important;
  overscroll-behavior: none !important;
}

html.pm-jdgm-lightbox-open #recart-popup-root,
html.pm-jdgm-lightbox-open #recart-widget-container,
body.pm-jdgm-lightbox-open #recart-popup-root,
body.pm-jdgm-lightbox-open #recart-widget-container,
html.pm-jdgm-lightbox-open #pm-chat-root,
html.pm-jdgm-lightbox-open #pm-chat-launcher,
html.pm-jdgm-lightbox-open #pm-chat-window,
html.pm-jdgm-lightbox-open #pm-chat-nudge,
html.pm-jdgm-lightbox-open #pm-chat-badge,
html.pm-jdgm-lightbox-open [id^="pm-chat-"],
body.pm-jdgm-lightbox-open #pm-chat-root,
body.pm-jdgm-lightbox-open #pm-chat-launcher,
body.pm-jdgm-lightbox-open #pm-chat-window,
body.pm-jdgm-lightbox-open #pm-chat-nudge,
body.pm-jdgm-lightbox-open #pm-chat-badge,
body.pm-jdgm-lightbox-open [id^="pm-chat-"],
html.pm-jdgm-lightbox-open .pm-mobile-purchase,
body.pm-jdgm-lightbox-open .pm-mobile-purchase,
html.pm-jdgm-lightbox-open .pm-announcement-control,
body.pm-jdgm-lightbox-open .pm-announcement-control,
html.pm-jdgm-lightbox-open .pm-atc-overlay,
body.pm-jdgm-lightbox-open .pm-atc-overlay {
  visibility: hidden !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

body.pm-jdgm-lightbox-open .jm-mfp-wrap,
body.pm-jdgm-lightbox-open .jm-mfp-wrap.jm-mfp-gallery,
body.pm-jdgm-lightbox-open .jdgm-gallery-popup {
  display: none !important;
  visibility: hidden !important;
  pointer-events: none !important;
  z-index: -1 !important;
}

#pm-jdgm-lightbox {
  border: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
  width: 100vw !important;
  height: 100vh !important;
  max-width: 100vw !important;
  max-height: 100vh !important;
  background: transparent !important;
  color: #ffffff;
  overflow: visible !important;
}

#pm-jdgm-lightbox:not([open]) {
  display: none !important;
}

#pm-jdgm-lightbox::backdrop {
  background: rgba(8, 8, 10, 0.88);
  -webkit-backdrop-filter: blur(18px) saturate(125%);
  backdrop-filter: blur(18px) saturate(125%);
}

#pm-jdgm-lightbox .pm-jdgm-lightbox__stage {
  position: fixed;
  inset: 0;
  z-index: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  pointer-events: none !important;
}

#pm-jdgm-lightbox .pm-jdgm-lightbox__frame {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  max-width: min(78vw, 900px);
  max-height: 78vh;
  min-width: 120px;
  min-height: 120px;
  border-radius: 22px !important;
  overflow: hidden !important;
  background: #0a0a0a;
  border: 1px solid rgba(255, 255, 255, 0.16) !important;
  box-shadow:
    0 24px 80px rgba(0, 0, 0, 0.55),
    0 8px 24px rgba(0, 0, 0, 0.35),
    inset 0 1px 0 rgba(255, 255, 255, 0.06) !important;
  pointer-events: auto !important;
}

#pm-jdgm-lightbox .pm-jdgm-lightbox__img {
  display: block !important;
  max-width: min(78vw, 900px) !important;
  max-height: 78vh !important;
  width: auto !important;
  height: auto !important;
  object-fit: contain !important;
  object-position: center center !important;
  border-radius: 0 !important;
  border: 0 !important;
  background: #0a0a0a !important;
  box-shadow: none !important;
  opacity: 0;
  transition: opacity 0.25s ease;
}

#pm-jdgm-lightbox.pm-jdgm-lightbox--loaded .pm-jdgm-lightbox__img {
  opacity: 1;
}

#pm-jdgm-lightbox .pm-jdgm-lightbox__loader {
  position: absolute;
  width: 36px;
  height: 36px;
  border: 3px solid rgba(255, 255, 255, 0.18);
  border-top-color: rgba(255, 255, 255, 0.92);
  border-radius: 999px;
  animation: pm-jdgm-lightbox-spin 0.8s linear infinite;
}

#pm-jdgm-lightbox.pm-jdgm-lightbox--loaded .pm-jdgm-lightbox__loader {
  display: none !important;
}

@keyframes pm-jdgm-lightbox-spin {
  to { transform: rotate(360deg); }
}

#pm-jdgm-lightbox .pm-jdgm-lightbox__close,
#pm-jdgm-lightbox .pm-jdgm-lightbox__arrow {
  position: fixed;
  z-index: 2147483647;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  margin: 0 !important;
  padding: 0 !important;
  color: #ffffff !important;
  background: rgba(18, 18, 20, 0.52) !important;
  -webkit-backdrop-filter: blur(10px) saturate(140%);
  backdrop-filter: blur(10px) saturate(140%);
  border: 1px solid rgba(255, 255, 255, 0.18) !important;
  border-radius: 999px !important;
  box-shadow:
    0 8px 28px rgba(0, 0, 0, 0.35),
    inset 0 1px 0 rgba(255, 255, 255, 0.08) !important;
  cursor: pointer !important;
  pointer-events: auto !important;
}

#pm-jdgm-lightbox .pm-jdgm-lightbox__close {
  top: max(16px, env(safe-area-inset-top, 0px));
  right: max(16px, env(safe-area-inset-right, 0px));
  width: 46px !important;
  height: 46px !important;
}

#pm-jdgm-lightbox .pm-jdgm-lightbox__close svg {
  display: block;
  width: 18px;
  height: 18px;
}

#pm-jdgm-lightbox .pm-jdgm-lightbox__arrow {
  top: 50%;
  transform: translateY(-50%);
  width: 50px !important;
  height: 50px !important;
}

#pm-jdgm-lightbox .pm-jdgm-lightbox__arrow svg {
  display: block;
  width: 20px;
  height: 20px;
}

#pm-jdgm-lightbox .pm-jdgm-lightbox__arrow--prev {
  left: max(16px, env(safe-area-inset-left, 0px));
}

#pm-jdgm-lightbox .pm-jdgm-lightbox__arrow--next {
  right: max(16px, env(safe-area-inset-right, 0px));
}

#pm-jdgm-lightbox .pm-jdgm-lightbox__arrow[hidden] {
  display: none !important;
}

@media screen and (max-width: 1023px) {
  #pm-jdgm-lightbox .pm-jdgm-lightbox__frame,
  #pm-jdgm-lightbox .pm-jdgm-lightbox__img {
    max-width: min(86vw, 900px) !important;
    max-height: 74vh !important;
  }

  #pm-jdgm-lightbox .pm-jdgm-lightbox__frame {
    border-radius: 18px !important;
  }

  #pm-jdgm-lightbox .pm-jdgm-lightbox__arrow {
    width: 44px !important;
    height: 44px !important;
  }
}

@media screen and (min-width: 1024px) {
  #pm-jdgm-lightbox .pm-jdgm-lightbox__frame {
    border-radius: 24px !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  #pm-jdgm-lightbox .pm-jdgm-lightbox__img,
  #pm-jdgm-lightbox .pm-jdgm-lightbox__loader {
    animation: none !important;
    transition: none !important;
  }
}