/* EO Bhopal — prevent flash before common.js renders layout */
html:not(.eo-ready) body {
    visibility: hidden;
}

#site-header:empty,
#site-footer:empty {
    display: none;
}

/* Parallax overlay sits above background; keep video/play controls clickable */
section.parallax > .opacity-medium,
section.parallax > .opacity-medium-2,
section.parallax > .opacity-full,
section.parallax > .opacity-extra-medium,
section.parallax > .opacity-light {
    pointer-events: none;
}

section.parallax > .container {
    position: relative;
    z-index: 1;
}

a.popup-youtube,
a.popup-vimeo {
    display: inline-block;
    position: relative;
    z-index: 2;
    cursor: pointer;
}

/* Litho: mobile header — match desktop sticky behavior */
@media (max-width: 991px) {
    /* Home hero stays full-bleed under header; inner pages keep JS top offset */
    html.eo-page-home body {
        padding-top: 0 !important;
    }

    header .nav-header-container {
        width: 100%;
        min-height: 72px;
        flex-wrap: nowrap;
    }

    header .navbar .navbar-brand {
        padding: 14px 0;
    }

    /* Litho sets max-height: 7% which collapses logos on mobile */
    header .navbar .navbar-brand img {
        max-height: 56px !important;
        width: auto !important;
        height: auto;
    }

    header .navbar .navbar-brand .default-logo,
    header .navbar .navbar-brand .alt-logo {
        display: none !important;
    }

    header .navbar .navbar-brand .mobile-logo,
    header.sticky .navbar .navbar-brand .mobile-logo,
    header.sticky.header-appear .navbar .navbar-brand .mobile-logo {
        visibility: visible !important;
        opacity: 1 !important;
        width: auto !important;
        max-height: 56px !important;
        transition: none !important;
    }

    /* Sticky/header-appear must not change logo box metrics */
    header.sticky .navbar .navbar-brand,
    header.sticky.header-appear .navbar .navbar-brand {
        padding: 14px 0;
    }

    header .nav-header-container > .col-lg-2.me-auto {
        order: 1;
    }

    header .nav-header-container > .col-lg-8 {
        order: 2;
        flex-shrink: 0;
    }

    header .eo-header-join-col {
        order: 3;
        flex-shrink: 0;
        padding-left: 0;
        padding-right: 0;
    }

    header .navbar .join-us-btn {
        padding: 6px 12px !important;
        font-size: 11px !important;
        letter-spacing: 0.2px;
        white-space: nowrap;
    }

    header .navbar .navbar-toggler {
        margin: 0 0 0 8px;
    }

    header .navbar .navbar-collapse {
        z-index: 1031;
    }

    /* Sticky reverse-scroll: explicit transform for mobile (inherit can fail on touch) */
    header:not(.sticky) .header-reverse-scroll {
        transform: translateY(0) !important;
    }

    header.sticky:not(.header-appear) .header-reverse-scroll {
        transform: translateY(-100%) !important;
    }

    header.sticky.header-appear .header-reverse-scroll,
    body.navbar-collapse-show header.sticky .header-reverse-scroll {
        transform: translateY(0) !important;
    }

    header.sticky.header-appear .navbar.header-light,
    header.sticky.header-appear .navbar.bg-transparent.header-light {
        background-color: #fff !important;
        box-shadow: 0 0 35px rgba(0, 0, 0, 0.1);
    }
}

/* Desktop: one logo always — Litho sticky swap (default ↔ alt, width:0) shifts position */
@media (min-width: 992px) {
    header .navbar .navbar-brand {
        padding: 14px 0;
    }

    header .navbar .navbar-brand img,
    header .navbar .navbar-brand .default-logo,
    header.sticky .navbar .navbar-brand .default-logo,
    header.sticky.header-appear .navbar .navbar-brand .default-logo {
        max-height: 75px !important;
        width: auto !important;
        height: auto;
        visibility: visible !important;
        opacity: 1 !important;
        transition: none !important;
    }

    header .navbar .navbar-brand .alt-logo,
    header .navbar .navbar-brand .mobile-logo {
        display: none !important;
    }

    header.sticky .navbar .navbar-brand,
    header.sticky.header-appear .navbar .navbar-brand {
        padding: 14px 0;
    }
}