/* ============================================================
   NEXBIT GLOBAL PUBLIC MOBILE NAVIGATION
============================================================ */

.nb-global-public-nav {
    display: none;
}

@media (max-width: 900px) {

    /*
     * Reserve space for fixed navigation.
     */

    body {
        padding-top: 70px !important;
    }


    /*
     * Hide the secondary page's old top header/nav on mobile.
     * The desktop versions remain completely untouched.
     */

    body > header:not(.nb-global-public-nav),
    body > nav:first-of-type,
    body > .site-header:not(.nb-global-public-nav),
    body > .top-header:not(.nb-global-public-nav) {
        display: none !important;
    }


    /*
     * Old temporary Astro back strip is not required once
     * standard Nexbit navigation is present.
     */

    .astro-main-return {
        display: none !important;
    }


    /*
     * Global fixed header.
     */

    .nb-global-public-nav {
        position: fixed !important;

        z-index: 10000 !important;

        top: 0 !important;
        left: 0 !important;
        right: 0 !important;

        width: 100% !important;
        height: 70px !important;

        display: flex !important;

        align-items: center !important;
        justify-content: space-between !important;

        padding:
            0 18px !important;

        box-sizing: border-box !important;

        background:
            rgba(5, 8, 24, 0.97) !important;

        border-bottom:
            1px solid
            rgba(126, 143, 255, 0.15) !important;

        box-shadow:
            0 10px 34px
            rgba(0, 0, 0, 0.32) !important;

        backdrop-filter:
            blur(20px) !important;

        -webkit-backdrop-filter:
            blur(20px) !important;
    }


    /*
     * Brand
     */

    .nb-global-public-brand {
        min-width: 0 !important;

        display: flex !important;

        align-items: center !important;

        gap: 10px !important;

        margin: 0 !important;
        padding: 0 !important;

        color: #ffffff !important;

        text-decoration: none !important;
    }


    .nb-global-public-brand img {
        width: 37px !important;
        height: 37px !important;

        flex:
            0 0 37px !important;

        display: block !important;

        object-fit: cover !important;

        border-radius:
            11px !important;
    }


    .nb-global-public-brand span {
        color: #ffffff !important;

        font-size: 16px !important;
        font-weight: 800 !important;
        line-height: 1 !important;

        white-space: nowrap !important;
    }


    .nb-global-public-brand strong {
        color: #f0ab2d !important;

        font-weight: 800 !important;
    }


    /*
     * Menu trigger
     */

    .nb-global-public-menu {
        position: relative !important;

        margin: 0 0 0 auto !important;
        padding: 0 !important;
    }


    .nb-global-public-menu > summary {
        width: 46px !important;
        height: 46px !important;

        margin: 0 !important;
        padding: 0 !important;

        display: flex !important;

        flex-direction:
            column !important;

        align-items:
            center !important;

        justify-content:
            center !important;

        gap: 6px !important;

        list-style: none !important;

        cursor: pointer !important;

        border-radius:
            13px !important;

        border:
            1px solid
            rgba(132, 147, 255, 0.28) !important;

        background:
            rgba(18, 29, 72, 0.8) !important;

        box-sizing:
            border-box !important;
    }


    .nb-global-public-menu
    > summary::-webkit-details-marker {
        display: none !important;
    }


    .nb-global-public-menu
    > summary::marker {
        display: none !important;

        content: "" !important;
    }


    .nb-global-public-menu
    > summary span {
        width: 21px !important;
        height: 2px !important;

        display: block !important;

        border-radius:
            100px !important;

        background:
            #eef2ff !important;

        transition:
            transform .2s ease,
            opacity .2s ease !important;
    }


    .nb-global-public-menu[open]
    > summary span:nth-child(1) {
        transform:
            translateY(8px)
            rotate(45deg) !important;
    }


    .nb-global-public-menu[open]
    > summary span:nth-child(2) {
        opacity: 0 !important;
    }


    .nb-global-public-menu[open]
    > summary span:nth-child(3) {
        transform:
            translateY(-8px)
            rotate(-45deg) !important;
    }


    /*
     * Dropdown panel
     */

    .nb-global-public-panel {
        position: fixed !important;

        z-index: 10001 !important;

        top: 78px !important;
        left: 14px !important;
        right: 14px !important;

        width:
            auto !important;

        max-height:
            calc(100vh - 94px) !important;

        overflow-y:
            auto !important;

        padding:
            12px !important;

        box-sizing:
            border-box !important;

        border-radius:
            18px !important;

        border:
            1px solid
            rgba(135, 125, 255, 0.25) !important;

        background:
            linear-gradient(
                145deg,
                rgba(13, 19, 48, 0.995),
                rgba(6, 11, 29, 0.995)
            ) !important;

        box-shadow:
            0 30px 80px
            rgba(0, 0, 0, 0.62) !important;

        backdrop-filter:
            blur(20px) !important;

        -webkit-backdrop-filter:
            blur(20px) !important;
    }


    .nb-global-public-panel a {
        width: 100% !important;
        min-height: 46px !important;

        display: flex !important;

        align-items: center !important;

        padding:
            0 14px !important;

        margin:
            0 !important;

        box-sizing:
            border-box !important;

        border-radius:
            11px !important;

        color:
            #cbd3ea !important;

        background:
            transparent !important;

        text-decoration:
            none !important;

        font-size:
            14px !important;

        font-weight:
            700 !important;

        line-height:
            1.3 !important;
    }


    .nb-global-public-panel a:active {
        color:
            #ffffff !important;

        background:
            rgba(
                255,
                255,
                255,
                0.055
            ) !important;
    }


    .nb-global-public-panel
    .nb-global-public-cta {
        min-height:
            50px !important;

        margin-top:
            9px !important;

        justify-content:
            center !important;

        color:
            #ffffff !important;

        background:
            linear-gradient(
                100deg,
                #7047f8,
                #2488ff,
                #00b7e9
            ) !important;

        border:
            1px solid
            rgba(
                255,
                255,
                255,
                0.12
            ) !important;
    }

}


@media (max-width: 380px) {

    .nb-global-public-nav {
        padding-left:
            15px !important;

        padding-right:
            15px !important;
    }


    .nb-global-public-brand img {
        width:
            35px !important;

        height:
            35px !important;

        flex-basis:
            35px !important;
    }


    .nb-global-public-brand span {
        font-size:
            15px !important;
    }

}


/* NEXBIT_GLOBAL_PUBLIC_MOBILE_NAV_CSS_END */