/* ==================================================
   PR1MELAB — Global fixed background shell + dark base
================================================== */

:root {
    --bg-base-dark: var(--bg-dark, #000008);
    --bg-gradient-red: rgba(222, 36, 47, 0.14);
    --bg-gradient-deep-red: rgba(90, 0, 8, 0.38);
    --site-bg-static-gradient: linear-gradient(
        168deg,
        var(--bg-base-dark) 0%,
        #030104 14%,
        #0a0206 30%,
        var(--bg-gradient-deep-red) 46%,
        #110408 58%,
        #080206 72%,
        #020104 86%,
        var(--bg-base-dark) 100%
    );
    --site-bg-gradient-accent: linear-gradient(
        132deg,
        transparent 0%,
        var(--bg-gradient-red) 42%,
        rgba(222, 36, 47, 0.08) 52%,
        rgba(222, 36, 47, 0.03) 64%,
        transparent 100%
    );
}

html {
    background-color: var(--bg-dark, #000008);
    overscroll-behavior-y: auto;
    overscroll-behavior-x: none;
}

body:not(.dashboard-app-body) {
    background-color: var(--bg-dark, #000008);
    overflow-x: hidden;
    overflow-y: auto;
    min-height: 100%;
    overscroll-behavior-y: auto;
    overscroll-behavior-x: none;
    max-width: 100%;
}

body:not(.dashboard-app-body) main.site-main[data-site-route="home"] .hero-section {
    position: relative;
    z-index: 2;
    isolation: isolate;
    background-color: var(--hero-bg, #000008);
}

body:not(.dashboard-app-body) main.site-main[data-site-route="home"] .hero-media,
body:not(.dashboard-app-body) main.site-main[data-site-route="home"] .hero-overlay {
    z-index: 0;
}

body:not(.dashboard-app-body) .site-page {
    position: relative;
    isolation: isolate;
    min-height: 100%;
    overflow-x: hidden;
    overflow-y: visible;
    background: transparent;
}

body:not(.dashboard-app-body) .site-header {
    position: fixed !important;
    z-index: var(--z-index-header, 999) !important;
}

body:not(.dashboard-app-body) .site-page-loader {
    position: fixed !important;
    z-index: 10000 !important;
}

body:not(.dashboard-app-body) .mobile-menu-panel,
body:not(.dashboard-app-body) .mobile-menu-overlay {
    position: fixed !important;
}

body:not(.dashboard-app-body) .site-main,
body:not(.dashboard-app-body) .hero-section,
body:not(.dashboard-app-body) .site-footer {
    position: relative;
    z-index: 1;
}

body.dashboard-app-body .site-bg,
body.dashboard-app-body .site-premium-bg,
body.dashboard-app-body .site-flow-bg,
body.dashboard-app-body .site-aurora-bg {
    display: none !important;
}

.site-bg,
.site-premium-bg,
.site-flow-bg,
.site-aurora-bg {
    position: fixed;
    inset: 0;
    z-index: 0;
    width: 100%;
    height: 100%;
    min-height: 100vh;
    min-height: 100svh;
    pointer-events: none;
    overflow: hidden;
    contain: strict;
    transform: translate3d(0, 0, 0);
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
    -webkit-transform: translate3d(0, 0, 0);
}

.site-bg__base,
.site-premium-bg__base,
.site-aurora__base {
    position: absolute;
    inset: 0;
    z-index: 0;
    background:
        var(--site-bg-static-gradient),
        var(--site-bg-gradient-accent),
        radial-gradient(ellipse 88% 62% at 50% 46%, var(--bg-gradient-red) 0%, transparent 58%),
        radial-gradient(ellipse 80% 55% at 8% 22%, rgba(222, 36, 47, 0.07) 0%, transparent 62%),
        radial-gradient(ellipse 72% 48% at 92% 72%, rgba(222, 36, 47, 0.05) 0%, transparent 60%),
        radial-gradient(ellipse 60% 42% at 50% 100%, rgba(0, 0, 8, 0.52) 0%, transparent 68%);
}

.site-bg__canvas-host {
  display: none !important;
  visibility: hidden !important;
}

.site-bg__canvas {
    position: absolute;
    top: 0;
    left: 0;
    width: 100% !important;
    height: 100% !important;
    max-width: 100%;
    max-height: 100%;
    display: block !important;
    pointer-events: none;
}

body:not(.dashboard-app-body) main.site-main[data-site-route="home"] :is(
    .about-section,
    .about-section--story,
    .about-section--editorial,
    .about-gallery-bmi-flow,
    .location-faq-flow,
    .programs-membership-flow .programs-section,
    .programs-membership-flow .membership-section,
    .programs-membership-flow .partnerships-section,
    .programs-membership-flow .booking-section
) {
    background: transparent !important;
}

body:not(.dashboard-app-body) main.site-main[data-site-route="home"] :is(
    .programs-membership-flow .programs-bg,
    .programs-membership-flow .membership-bg,
    .programs-membership-flow .partnerships-bg
) {
    display: none !important;
}

body.site-bg-motion-disabled .site-bg__canvas-host {
    display: none !important;
}

@media (max-width: 760px) {
    .site-bg,
    .site-premium-bg,
    .site-flow-bg,
    .site-aurora-bg {
        contain: paint;
    }
}

html:not(:has(body.dashboard-app-body))::before,
body:not(.dashboard-app-body)::before,
body:not(.dashboard-app-body)::after {
    display: none !important;
    content: none !important;
}

body:not(.dashboard-app-body) .site-footer {
    background: transparent !important;
}

@media (prefers-reduced-motion: reduce) {
    .site-bg__canvas-host {
        display: none !important;
    }
}
