/* Shared phone/tablet navigation, including the home and standalone pages. */
.mobile-menu-dismiss { display: none; }
.mobile-menu-panel { display: contents; }
@media (max-width: 1400px) {
    html.mobile-navigation-open:has(#gnb.has-mega-menu),
    html.mobile-navigation-open:has(#gnb.has-mega-menu) body { overflow: hidden !important; }

    html body #gnb.has-mega-menu { --mobile-header-height: 70px; }
    html body #gnb.has-mega-menu :is(.logo, .nav-right) {
        position: relative;
        z-index: 2 !important;
    }
    html body #gnb.has-mega-menu .mobile-menu-toggle {
        position: relative;
        z-index: 300002 !important;
    }
    html body #gnb.has-mega-menu .mobile-menu-toggle {
        height: 28px;
        flex-shrink: 0;
    }
    html body #gnb.has-mega-menu .mobile-menu-toggle span {
        position: absolute;
        left: 0;
        top: calc(50% - 1px);
        transform-origin: center;
        transition: transform .38s cubic-bezier(.22, 1, .36, 1), opacity .2s ease, background-color .3s ease;
    }
    html body #gnb.has-mega-menu .mobile-menu-toggle span:nth-child(1) { transform: translateY(-9px); }
    html body #gnb.has-mega-menu .mobile-menu-toggle span:nth-child(3) { transform: translateY(9px); }
    html body #gnb.has-mega-menu.is-mobile-open .mobile-menu-toggle span { background: #ff6e2e !important; }
    html body #gnb.has-mega-menu.is-mobile-open .mobile-menu-toggle span:nth-child(1) { transform: rotate(45deg); }
    html body #gnb.has-mega-menu.is-mobile-open .mobile-menu-toggle span:nth-child(2) { transform: scaleX(0); opacity: 0; }
    html body #gnb.has-mega-menu.is-mobile-open .mobile-menu-toggle span:nth-child(3) { transform: rotate(-45deg); }
    html body #gnb.has-mega-menu .mobile-menu-toggle:focus-visible { outline: 2px solid #ff6e2e; outline-offset: 6px; }

    html body #gnb.has-mega-menu.is-mobile-open .mobile-menu-dismiss {
        display: block;
        position: fixed;
        inset: 0;
        width: 100%;
        height: 100dvh;
        margin: 0;
        padding: 0;
        border: 0;
        background: transparent;
        z-index: 299999;
    }
    /* A single full-height glass surface slides over the unchanged header. */
    html body #gnb.has-mega-menu .mobile-menu-panel {
        display: block;
        position: fixed !important;
        inset: 0 auto 0 0 !important;
        width: calc(100% * 2 / 3) !important;
        height: 100dvh;
        z-index: 300000 !important;
        overflow: hidden;
        background: var(--header-glass-bg) !important;
        backdrop-filter: blur(40px) saturate(155%);
        -webkit-backdrop-filter: blur(40px) saturate(155%);
        transform: translateX(-100%) !important;
        visibility: hidden;
        pointer-events: none;
        transition: transform .48s cubic-bezier(.22, 1, .36, 1), visibility 0s linear .48s;
    }
    html body #gnb.has-mega-menu .mobile-menu-panel:has(#navMenu.active) {
        transform: translateX(0) !important;
        visibility: visible;
        pointer-events: auto;
        transition-delay: 0s;
    }
    html body #gnb.has-mega-menu #navMenu.nav-center {
        display: flex !important;
        position: absolute !important;
        inset: var(--mobile-header-height) 0 0 !important;
        width: 100% !important;
        height: calc(100% - var(--mobile-header-height)) !important;
        min-height: 0 !important;
        margin: 0 !important;
        padding: 20px var(--site-edge-inset) calc(32px + env(safe-area-inset-bottom, 0px)) !important;
        box-sizing: border-box;
        flex-direction: column;
        align-items: flex-start;
        justify-content: flex-start;
        gap: 0;
        overflow-x: hidden;
        overflow-y: auto;
        overscroll-behavior: contain;
        scrollbar-width: none;
        -ms-overflow-style: none;
        background: transparent !important;
        backdrop-filter: none !important;
        -webkit-backdrop-filter: none !important;
        transform: none !important;
        visibility: inherit;
        pointer-events: inherit;
        transition: none;
    }
    html body #gnb.has-mega-menu #navMenu.nav-center::-webkit-scrollbar { display: none; width: 0; height: 0; }
    html body #gnb.has-mega-menu #navMenu.nav-center .nav-item-group {
        display: flex !important;
        flex: 0 0 auto;
        flex-direction: column;
        align-items: flex-start;
        width: 100%;
        height: auto !important;
        min-height: 0;
        margin: 0;
        padding: 16px 0;
        border: 0 !important;
        border-bottom: 1px solid var(--header-glass-border) !important;
    }
    html body.light-mode #gnb.has-mega-menu #navMenu.nav-center .nav-item-group { border-bottom-color: rgba(0, 0, 0, .12) !important; }
    html body #gnb.has-mega-menu #navMenu.nav-center .nav-item-group:last-child { border-bottom: 0 !important; }
    html body #gnb.has-mega-menu #navMenu.nav-center .nav-item {
        display: block;
        width: 100%;
        margin: 0 !important;
        padding: 8px 0 !important;
        border: 0 !important;
        font-size: 22px !important;
        font-weight: 500 !important;
        line-height: 1.3 !important;
        text-align: left;
        color: var(--header-glass-text) !important;
        -webkit-text-fill-color: currentColor !important;
    }
    html body #gnb.has-mega-menu #navMenu.nav-center .nav-menu-label { font-weight: inherit !important; }
    html body #gnb.has-mega-menu #navMenu.nav-center .dropdown-content {
        display: flex !important;
        position: static !important;
        flex: 0 0 auto;
        flex-direction: column;
        gap: 0;
        width: 100% !important;
        min-width: 0;
        height: auto !important;
        margin: 4px 0 0 !important;
        padding: 0 !important;
        border: 0 !important;
        border-radius: 0 !important;
        background: transparent !important;
        box-shadow: none !important;
        backdrop-filter: none !important;
        -webkit-backdrop-filter: none !important;
        transform: none !important;
        opacity: 1 !important;
        visibility: inherit !important;
        pointer-events: inherit !important;
    }
    html body #gnb.has-mega-menu #navMenu.nav-center .dropdown-item {
        width: 100%;
        min-height: 40px;
        margin: 0 !important;
        padding: 9px 0 !important;
        border: 0 !important;
        font-size: 16px !important;
        line-height: 1.4 !important;
        font-weight: 400 !important;
        text-align: left;
        color: var(--header-glass-subtext) !important;
        -webkit-text-fill-color: currentColor !important;
        background: transparent !important;
    }
    html body #gnb.has-mega-menu #navMenu.nav-center :is(.nav-item, .dropdown-item):is(:hover, :focus-visible, .active) {
        color: #ff6e2e !important;
        -webkit-text-fill-color: currentColor !important;
    }
}
@media (min-width: 600px) and (max-width: 1400px) {
    html body #gnb.has-mega-menu { --mobile-header-height: 84px; }
    html body #gnb.has-mega-menu #navMenu.nav-center .nav-item { font-size: clamp(30px, 3.4vw, 44px) !important; }
    html body #gnb.has-mega-menu #navMenu.nav-center .dropdown-item { font-size: clamp(22px, 2.5vw, 32px) !important; }
}
@media (max-width: 1400px) and (prefers-reduced-motion: reduce) {
    html body #gnb.has-mega-menu .mobile-menu-panel,
    html body #gnb.has-mega-menu .mobile-menu-toggle span { transition: none; }
}
