/**
 * Sticky Header — Scroll-reveal navigation
 *
 * #menuhopin starts translated off-screen above the viewport.
 * The .headershow class slides it into view when the user has
 * scrolled past the threshold defined in sticky-header.js.
 *
 * Usage:
 *   - Set CSS ID  `menuhopin`  on the Elementor Header section.
 *   - Add class   `header-sticky` to the same section for the
 *     backdrop-filter blur effect.
 *
 * @package ExpoXR
 */

/* Keep the Elementor nav-menu flush with the top of the fixed bar */
.elementor-nav-menu__container {
    top: 0 !important;
}

/* Hidden state — above the viewport */
#menuhopin {
    position: fixed;
    top: 0;
    width: 100%;
    transform: translateY(-200px); /* adjust to match your header height */
    transition: transform 0.34s ease;
    -webkit-transition: transform 0.34s ease;
    z-index: 9999;
}

/* Visible state — slides into view */
#menuhopin.headershow {
    transform: translateY(0);
}