/* AR-TEK mobile navigation fix, 2026-11-01.
   Fixes inherited .main-nav { height:100vh } and desktop justify-content:end.
   Do not change desktop navigation or home page content. */
.art-mobile-nav-backdrop[hidden] { display: none !important; }
.art-mobile-nav-backdrop {
    position: fixed;
    inset: 0;
    z-index: 1000;
    background: rgba(8, 24, 48, .40);
    -webkit-tap-highlight-color: transparent;
}
.art-mobile-nav-head { display: none; }

@media (max-width: 1024px) {
    .art-main-header {
        position: sticky !important;
        top: 0;
        z-index: 99990 !important;
        overflow: visible !important;
    }
    .art-main-header .art-main-nav-wrap {
        position: relative !important;
        display: flex !important;
        align-items: center !important;
        justify-content: space-between !important;
        min-height: 68px !important;
        gap: 10px !important;
    }
    .art-main-header .art-main-brand { min-width: 0 !important; }
    .art-main-header #mobileMenuToggle {
        display: inline-grid !important;
        place-items: center !important;
        flex: 0 0 44px !important;
        width: 44px !important;
        height: 44px !important;
        font-size: 23px !important;
        line-height: 1 !important;
        border: 1px solid #d8e3ed !important;
        border-radius: 12px !important;
        background: #fff !important;
        color: #184772 !important;
        cursor: pointer;
        z-index: 2;
    }
    .art-main-header #mainNav.art-main-nav {
        /* Override inherited .main-nav fixed 100vh and right:-100% styles. */
        position: absolute !important;
        z-index: 100000 !important;
        top: calc(100% + 8px) !important;
        right: 0 !important;
        left: auto !important;
        bottom: auto !important;
        width: min(420px, 100%) !important;
        height: auto !important;
        min-height: 0 !important;
        max-height: calc(100vh - 94px) !important; /* fallback */
        max-height: calc(100dvh - 94px) !important;
        margin: 0 !important;
        padding: 12px !important;
        display: none !important;
        flex-direction: column !important;
        justify-content: flex-start !important;
        align-items: stretch !important;
        gap: 3px !important;
        overflow-x: hidden !important;
        overflow-y: auto !important;
        overscroll-behavior: contain;
        border: 1px solid #e4ebf3 !important;
        border-radius: 18px !important;
        background: #ffffff !important;
        box-shadow: 0 18px 48px rgba(11, 35, 66, .19) !important;
        box-sizing: border-box !important;
        transition: none !important;
    }
    .art-main-header #mainNav.art-main-nav.is-open {
        display: flex !important;
    }
    .art-main-header #mainNav .art-mobile-nav-head {
        display: flex !important;
        align-items: center;
        justify-content: space-between;
        gap: 12px;
        min-height: 40px;
        flex: 0 0 auto !important;
        padding: 0 3px 8px 10px;
        margin-bottom: 3px;
        border-bottom: 1px solid #e9eef4;
        color: #153c64;
        font-size: 14px;
        font-weight: 800;
    }
    .art-main-header #mainNav .art-mobile-nav-close {
        display: grid;
        place-items: center;
        flex-shrink: 0;
        width: 34px;
        height: 34px;
        padding: 0;
        background: #f1f6fa;
        color: #184772;
        border: 0;
        border-radius: 9px;
        font-size: 24px;
        line-height: 1;
        cursor: pointer;
    }
    .art-main-header #mainNav.art-main-nav > a,
    .art-main-header #mainNav.art-main-nav .art-nav-drop-button {
        display: flex !important;
        align-items: center !important;
        justify-content: flex-start !important;
        width: 100% !important;
        min-height: 44px !important;
        margin: 0 !important;
        padding: 9px 14px !important;
        border-radius: 11px !important;
        box-sizing: border-box !important;
        flex: 0 0 auto !important;
        font-size: 15px !important;
        font-weight: 650 !important;
        line-height: 1.35 !important;
    }
    .art-main-header #mainNav.art-main-nav > a:hover,
    .art-main-header #mainNav.art-main-nav > a:focus-visible,
    .art-main-header #mainNav.art-main-nav .art-nav-drop-button:focus-visible {
        background: #edf4fb !important;
    }
    .art-main-header #mainNav .art-nav-dropdown {
        position: relative !important;
        display: block !important;
        flex: 0 0 auto !important;
        width: 100% !important;
        min-height: 0 !important;
        margin: 0 !important;
    }
    .art-main-header #mainNav .art-nav-dropdown-menu,
    .art-main-header #mainNav .art-nav-dropdown:hover .art-nav-dropdown-menu,
    .art-main-header #mainNav .art-nav-dropdown:focus-within .art-nav-dropdown-menu {
        position: static !important;
        display: none !important;
        width: 100% !important;
        min-width: 0 !important;
        height: auto !important;
        max-height: 38dvh !important;
        overflow-y: auto !important;
        margin: 3px 0 4px !important;
        padding: 6px !important;
        background: #f5f8fc !important;
        box-shadow: none !important;
        border: 0 !important;
        border-radius: 12px !important;
        transform: none !important;
        opacity: 1 !important;
        visibility: visible !important;
        pointer-events: auto !important;
    }
    .art-main-header #mainNav .art-nav-dropdown.is-expanded .art-nav-dropdown-menu,
    .art-main-header #mainNav .art-nav-dropdown.is-expanded:hover .art-nav-dropdown-menu {
        display: block !important;
    }
    .art-main-header #mainNav .art-nav-dropdown-menu a {
        display: flex !important;
        width: 100% !important;
        min-height: 39px !important;
        align-items: center !important;
        justify-content: flex-start !important;
        padding: 8px 12px !important;
        border-radius: 9px !important;
        font-size: 13px !important;
        line-height: 1.4 !important;
        box-sizing: border-box !important;
    }
    .art-main-header #mainNav.art-main-nav > a.art-contact-link {
        justify-content: center !important;
        min-height: 44px !important;
        margin-top: 8px !important;
        background: #184772 !important;
        color: #fff !important;
    }
    body.art-mobile-nav-active { overflow: hidden !important; }
    /* Prevent WhatsApp / floating controls overlaying navigation. */
    body.art-mobile-nav-active .art-chat-wa,
    body.art-mobile-nav-active .floating-wa,
    body.art-mobile-nav-active .whatsapp-float {
        opacity: 0 !important;
        visibility: hidden !important;
        pointer-events: none !important;
    }
}

@media (prefers-reduced-motion: reduce) {
    .art-main-header #mainNav.art-main-nav,
    .art-mobile-nav-backdrop { transition: none !important; }
}
