/* ============================================
   NAV TYPOGRAPHY LOCK
   The menu renders in the same face on every page, regardless of which
   fonts the page itself loads or sets globally. Buttons keep their own
   inline stack, so this only pins the logo link and the menu items.
   ============================================ */
#frontNav,
#frontNav .navItem,
#frontNav a {
    font-family: 'PT Sans Narrow', 'Arial Narrow', Arial, sans-serif;
}
/* ============================================
   STICKY DESKTOP NAV
   Keeps the primary navigation accessible while scrolling.
   Mobile (<=1200px) continues to use position: fixed (rules below).
   IMPORTANT: overflow:clip on html/body is required because overflow:hidden
   breaks position:sticky on descendants. Inline here (not in cached landing.css)
   so it takes effect immediately without Cloudflare cache purge.
   ============================================ */
html, body {
    overflow-x: hidden !important; /* fallback for browsers without clip support */
    overflow-x: clip !important;   /* modern: prevents horizontal overflow without creating a scroll container (keeps sticky working). !important beats any later html/body overflow-x:hidden rule in the DOM. */
}
@media only screen and (min-width: 1201px) {
    #frontNav {
        position: -webkit-sticky !important;
        position: sticky !important;
        top: 0 !important;
        z-index: 1000 !important;
        background: #0d1b2a !important;
        transition: box-shadow 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
    }
    #frontNav.is-scrolled {
        box-shadow: 0 6px 20px rgba(0, 0, 0, 0.18) !important;
    }
}
#hamButton {
    display: none;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    flex-shrink: 0;
    background: transparent;
    border: none;
    border-radius: 8px;
    cursor: pointer;
    padding: 0;
    margin: 0;
    color: rgba(255,255,255,0.9);
    -webkit-tap-highlight-color: transparent;
    -webkit-appearance: none;
    appearance: none;
    outline: none;
    transition: background 0.15s ease;
}
#hamButton:active {
    background: rgba(255,255,255,0.08);
}
#hamButton.is-active {
    visibility: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
}
@media only screen and (min-width: 769px) {
    #googleIcon { display: none !important; }
}
@media only screen and (max-width: 1200px) {
    #hamButton {
        display: flex !important;
    }
    #hamButton.is-active {
        display: flex !important;
        visibility: hidden !important;
        opacity: 0 !important;
        pointer-events: none !important;
    }
    #frontNav {
        position: fixed !important;
        top: 0 !important;
        left: 0 !important;
        right: 0 !important;
        width: 100% !important;
        z-index: 1000 !important;
        padding: 0 12px !important;
        height: 56px !important;
        gap: 10px !important;
        box-sizing: border-box !important;
    }
    body {
        padding-top: 56px !important;
    }
    .logoMainLink {
        flex-shrink: 0 !important;
        display: flex !important;
        align-items: center !important;
        padding: 6px 0 !important;
    }
    #mainLogo img {
        width: 140px !important;
        height: auto !important;
        display: block !important;
    }
    #loginMenu {
        column-gap: 8px !important;
        padding-right: 0 !important;
        flex-shrink: 0 !important;
        align-items: center !important;
    }
    #googleIcon {
        display: flex !important;
        align-items: center !important;
    }
    #googleIcon img {
        width: 76px !important;
        height: auto !important;
        display: block !important;
    }
    .frontNav-login-btn {
        height: 40px !important;
        padding: 0 18px !important;
        font-size: 15px !important;
        font-weight: 700 !important;
        letter-spacing: 0.02em !important;
        border-radius: 50px !important;
        border: 2px solid rgba(0,0,0,0.08) !important;
        box-shadow: 0 2px 12px rgba(255,224,27,0.35) !important;
    }
    .frontNav-login-btn svg {
        display: inline-block !important;
        width: 16px !important;
        height: 16px !important;
        flex-shrink: 0 !important;
    }
    .frontNav-register-btn { display: none !important; }
}
@media only screen and (max-width: 480px) {
    #frontNav {
        padding: 0 8px !important;
        height: 52px !important;
        gap: 8px !important;
    }
    body {
        padding-top: 52px !important;
    }
    #hamButton {
        width: 38px !important;
        height: 38px !important;
    }
    #mainLogo img {
        width: 125px !important;
    }
    #googleIcon img {
        width: 66px !important;
    }
    .frontNav-login-btn {
        height: 38px !important;
        padding: 0 16px !important;
        font-size: 14px !important;
    }
    .frontNav-login-btn svg {
        width: 15px !important;
        height: 15px !important;
    }
}
@media only screen and (max-width: 360px) {
    #frontNav {
        padding: 0 6px !important;
        height: 48px !important;
        gap: 6px !important;
    }
    body {
        padding-top: 48px !important;
    }
    #hamButton {
        width: 36px !important;
        height: 36px !important;
    }
    #mainLogo img {
        width: 110px !important;
    }
    #googleIcon {
        display: none !important;
    }
    .frontNav-login-btn {
        height: 36px !important;
        padding: 0 14px !important;
        font-size: 14px !important;
    }
    .frontNav-login-btn svg {
        width: 14px !important;
        height: 14px !important;
    }
}