/* v2.0.29 — site-wide page-banner containment and content interaction fix.
   Keeps every internal-page hero inside its own stacking context so decorative
   image/overlay layers cannot cover the sections that follow. */

.rc-page-shell-v29,
.rc-react-native-content > main,
.rc-server-rendered-fallback .rc-ssr-page,
.rc-native-growth-page,
.rc-native-wp-page {
  position: relative !important;
  isolation: isolate !important;
  overflow-x: clip;
}

.rc-page-banner-v29,
.rc-react-native-content > main > section:first-of-type,
.rc-server-rendered-fallback .rc-ssr-page > section:first-of-type,
.rc-native-growth-page > section:first-of-type,
.rc-native-wp-page > section:first-of-type {
  position: relative !important;
  z-index: 0 !important;
  isolation: isolate !important;
  overflow: hidden !important;
  contain: paint;
  margin-bottom: 0 !important;
  transform: none !important;
}

/* Direct decorative hero layers must remain confined to the banner. */
.rc-page-banner-v29 > .absolute,
.rc-page-banner-media-v29,
.rc-react-native-content > main > section:first-of-type > .absolute,
.rc-server-rendered-fallback .rc-ssr-page > section:first-of-type > .absolute,
.rc-native-growth-page > section:first-of-type > .absolute,
.rc-native-wp-page > section:first-of-type > .absolute {
  z-index: 0 !important;
  max-width: 100% !important;
  max-height: 100% !important;
  overflow: hidden !important;
  pointer-events: none !important;
  user-select: none !important;
}

.rc-page-banner-v29 > .absolute.inset-0,
.rc-page-banner-media-v29,
.rc-react-native-content > main > section:first-of-type > .absolute.inset-0,
.rc-server-rendered-fallback .rc-ssr-page > section:first-of-type > .absolute.inset-0,
.rc-native-growth-page > section:first-of-type > .absolute.inset-0,
.rc-native-wp-page > section:first-of-type > .absolute.inset-0 {
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
}

.rc-page-banner-v29 > .absolute img,
.rc-page-banner-media-v29 img,
.rc-react-native-content > main > section:first-of-type > .absolute img,
.rc-server-rendered-fallback .rc-ssr-page > section:first-of-type > .absolute img,
.rc-native-growth-page > section:first-of-type > .absolute img,
.rc-native-wp-page > section:first-of-type > .absolute img {
  display: block;
  width: 100% !important;
  height: 100% !important;
  max-height: 100% !important;
  object-fit: cover;
  pointer-events: none !important;
}

/* Text/buttons inside the banner stay above its background media. */
.rc-page-banner-v29 > :not(.absolute),
.rc-react-native-content > main > section:first-of-type > :not(.absolute),
.rc-server-rendered-fallback .rc-ssr-page > section:first-of-type > :not(.absolute),
.rc-native-growth-page > section:first-of-type > :not(.absolute),
.rc-native-wp-page > section:first-of-type > :not(.absolute) {
  position: relative;
  z-index: 1;
}

/* Every block after the banner gets its own painted, clickable layer. */
.rc-page-after-banner-v29,
.rc-react-native-content > main > section:first-of-type ~ *,
.rc-server-rendered-fallback .rc-ssr-page > section:first-of-type ~ *,
.rc-native-growth-page > section:first-of-type ~ *,
.rc-native-wp-page > section:first-of-type ~ * {
  position: relative !important;
  z-index: 2 !important;
  isolation: isolate;
  margin-top: 0 !important;
  transform: none !important;
  pointer-events: auto !important;
  clear: both;
}

.rc-page-after-banner-v29 a,
.rc-page-after-banner-v29 button,
.rc-page-after-banner-v29 input,
.rc-page-after-banner-v29 select,
.rc-page-after-banner-v29 textarea,
.rc-page-after-banner-v29 summary,
.rc-page-after-banner-v29 [role="button"] {
  position: relative;
  z-index: 3;
  pointer-events: auto !important;
  touch-action: manipulation;
}

/* Prevent pseudo-elements attached to the banner from intercepting content. */
.rc-page-banner-v29::before,
.rc-page-banner-v29::after,
.rc-react-native-content > main > section:first-of-type::before,
.rc-react-native-content > main > section:first-of-type::after,
.rc-server-rendered-fallback .rc-ssr-page > section:first-of-type::before,
.rc-server-rendered-fallback .rc-ssr-page > section:first-of-type::after,
.rc-native-growth-page > section:first-of-type::before,
.rc-native-growth-page > section:first-of-type::after,
.rc-native-wp-page > section:first-of-type::before,
.rc-native-wp-page > section:first-of-type::after {
  pointer-events: none !important;
}

@supports not (overflow: clip) {
  .rc-page-shell-v29,
  .rc-react-native-content > main,
  .rc-server-rendered-fallback .rc-ssr-page,
  .rc-native-growth-page,
  .rc-native-wp-page {
    overflow-x: hidden;
  }
}

@media (max-width: 782px) {
  .rc-page-banner-v29,
  .rc-react-native-content > main > section:first-of-type,
  .rc-server-rendered-fallback .rc-ssr-page > section:first-of-type,
  .rc-native-growth-page > section:first-of-type,
  .rc-native-wp-page > section:first-of-type {
    min-height: 0 !important;
  }
}

/* Immediate structural fallback for React pages before the marker script runs. */
.rc-wordpress-app #root > .min-h-screen > div[class~="pb-20"] {
  position: relative !important;
  isolation: isolate !important;
  overflow-x: clip;
}

.rc-wordpress-app #root > .min-h-screen > div[class~="pb-20"] > section:first-of-type {
  position: relative !important;
  z-index: 0 !important;
  isolation: isolate !important;
  overflow: hidden !important;
  contain: paint;
  margin-bottom: 0 !important;
  transform: none !important;
}

.rc-wordpress-app #root > .min-h-screen > div[class~="pb-20"] > section:first-of-type > .absolute {
  z-index: 0 !important;
  max-width: 100% !important;
  max-height: 100% !important;
  overflow: hidden !important;
  pointer-events: none !important;
  user-select: none !important;
}

.rc-wordpress-app #root > .min-h-screen > div[class~="pb-20"] > section:first-of-type > .absolute.inset-0 {
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
}

.rc-wordpress-app #root > .min-h-screen > div[class~="pb-20"] > section:first-of-type > .absolute img {
  display: block;
  width: 100% !important;
  height: 100% !important;
  max-height: 100% !important;
  object-fit: cover;
  pointer-events: none !important;
}

.rc-wordpress-app #root > .min-h-screen > div[class~="pb-20"] > section:first-of-type > :not(.absolute) {
  position: relative;
  z-index: 1;
}

.rc-wordpress-app #root > .min-h-screen > div[class~="pb-20"] > section:first-of-type ~ * {
  position: relative !important;
  z-index: 2 !important;
  isolation: isolate;
  margin-top: 0 !important;
  transform: none !important;
  pointer-events: auto !important;
  clear: both;
}

@supports not (overflow: clip) {
  .rc-wordpress-app #root > .min-h-screen > div[class~="pb-20"] {
    overflow-x: hidden;
  }
}


/* v2.0.31 — Gallery filter tabs visibility fix.
   The category buttons now stay in normal document flow so they cannot be
   pushed below, clipped by, or hidden behind the gallery banner. */
.rc-wordpress-app .rc-gallery-filter-tabs {
  position: relative !important;
  top: auto !important;
  left: auto !important;
  right: auto !important;
  z-index: 20 !important;
  display: block !important;
  width: 100% !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding-top: 24px !important;
  padding-bottom: 24px !important;
  overflow: visible !important;
  transform: none !important;
  visibility: visible !important;
  opacity: 1 !important;
}

.rc-wordpress-app .rc-gallery-filter-tabs > div,
.rc-wordpress-app .rc-gallery-filter-tabs > div > div {
  position: relative !important;
  top: auto !important;
  transform: none !important;
  visibility: visible !important;
  opacity: 1 !important;
}

.rc-wordpress-app .rc-gallery-filter-tabs button {
  position: relative !important;
  z-index: 1 !important;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  min-height: 38px;
  pointer-events: auto !important;
  visibility: visible !important;
  opacity: 1 !important;
}

/* Compatibility selector for a cached React bundle from v2.0.30. */
.rc-wordpress-app #root > .min-h-screen > div[class~="pb-20"] > section:nth-of-type(2).sticky.top-16 {
  position: relative !important;
  top: auto !important;
  z-index: 20 !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding-top: 24px !important;
  padding-bottom: 24px !important;
  overflow: visible !important;
  transform: none !important;
}

@media (max-width: 767px) {
  .rc-wordpress-app .rc-gallery-filter-tabs,
  .rc-wordpress-app #root > .min-h-screen > div[class~="pb-20"] > section:nth-of-type(2).sticky.top-16 {
    padding: 16px 12px !important;
    overflow-x: hidden !important;
  }

  .rc-wordpress-app .rc-gallery-filter-tabs > div > div,
  .rc-wordpress-app #root > .min-h-screen > div[class~="pb-20"] > section:nth-of-type(2).sticky.top-16 > div > div {
    display: flex !important;
    flex-wrap: nowrap !important;
    justify-content: flex-start !important;
    gap: 8px !important;
    width: 100% !important;
    padding: 2px 2px 8px !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    scroll-snap-type: x proximity;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: thin;
  }

  .rc-wordpress-app .rc-gallery-filter-tabs button,
  .rc-wordpress-app #root > .min-h-screen > div[class~="pb-20"] > section:nth-of-type(2).sticky.top-16 button {
    flex: 0 0 auto !important;
    white-space: nowrap !important;
    scroll-snap-align: start;
  }
}