:root {
    --sb-navy: #06353d;
    --sb-navy-dark: #02272e;
    --sb-navy-light: #0b4650;

    --sb-gold: #d9a441;
    --sb-gold-light: #f1c66d;

    --sb-white: #ffffff;
    --sb-muted: #a9c0c4;

    --sb-border: rgba(217,164,65,.20);
}


/* =========================================================
   HEADER BASE
========================================================= */

#rs-header {
    position: relative;
    z-index: 999999;
}

#rs-header .menu-area {
    position: relative;
    z-index: 999999;
}


/* =========================================================
   LOGO
========================================================= */

#rs-header .logo img {
    width: 50% !important;
    height: auto !important;
}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 991px) {
    #rs-header {
        position: relative !important;
        z-index: 999999 !important;
    }

    #rs-header .menu-area {
        position: relative !important;
        min-height: 78px !important;
        z-index: 999999 !important;
        box-shadow:
            0 5px 20px rgba(0,0,0,.18);
    }

    #rs-header .menu-area .container {
        position: relative !important;
    }

    #rs-header .logo-area {

        min-height: 78px !important;

        display: flex !important;

        align-items: center !important;

        padding-left: 0 !important;
    }


    #rs-header .logo img {

        width: 145px !important;

        max-width: 145px !important;

        height: auto !important;
    }


    /* =====================================================
       HIDE ORIGINAL TEMPLATE MOBILE MENU
       
       VERY IMPORTANT
    ===================================================== */

    #rs-header .mobile-menu,
    #rs-header .rs-menu-toggle {

        display: none !important;

        visibility: hidden !important;

        pointer-events: none !important;
    }


    /* =====================================================
       HIDE ORIGINAL RS MENU ON MOBILE
    ===================================================== */

    #rs-header .main-menu > .rs-menu {

        display: none !important;

        visibility: hidden !important;

        pointer-events: none !important;
    }


    /* =====================================================
       OUR CUSTOM HAMBURGER
    ===================================================== */

    .sb-mobile-trigger {
        display: flex !important;
        position: absolute !important;
        right: 15px !important;
        transform: translateY(-50%) !important;
        width: 62px !important;
        height: 62px !important;
        z-index: 2147483647 !important;
        padding-top: 10%; 
    }

    .sb-mobile-trigger button {
        width: 62px !important;
        height: 62px !important;
        padding: 0 !important;
        margin: 0 !important;
        border-radius: 50% !important;
        border: 2px solid var(--sb-gold) !important;
        background:
            radial-gradient(
                circle at 30% 25%,
                #0d5660,
                #06353d 60%,
                #02272e 100%
            ) !important;

        color: #ffffff !important;

        display: flex !important;

        align-items: center !important;

        justify-content: center !important;

        cursor: pointer !important;

        outline: none !important;

        box-shadow:
            0 0 0 5px rgba(217,164,65,.08),
            0 8px 25px rgba(0,0,0,.35) !important;

        transition:
            transform .3s ease,
            background .3s ease,
            color .3s ease,
            box-shadow .3s ease !important;
    }


    .sb-mobile-trigger button i {

        font-size: 27px !important;

        line-height: 1 !important;

        pointer-events: none !important;

        transition:
            transform .3s ease !important;
    }


    /* OPEN STATE */

    body.sb-menu-open .sb-mobile-trigger button {

        background:
            linear-gradient(
                145deg,
                #d9a441,
                #b98227
            ) !important;

        color: #02272e !important;

        border-color: #f1c66d !important;

        box-shadow:
            0 0 0 5px rgba(217,164,65,.12),
            0 8px 25px rgba(0,0,0,.35) !important;

        transform: rotate(90deg) !important;
    }


    body.sb-menu-open
    .sb-mobile-trigger button i {

        transform: rotate(-90deg) !important;
    }


    /* =====================================================
       FULL SCREEN MOBILE MENU
    ===================================================== */

    #sbMobileMenu {

        position: fixed !important;

        top: 0 !important;

        left: 0 !important;

        right: 0 !important;

        bottom: 0 !important;

        width: 100vw !important;

        height: 100vh !important;

        height: 100dvh !important;

        margin: 0 !important;

        padding: 0 !important;

        background:
            radial-gradient(
                circle at 90% 5%,
                rgba(217,164,65,.14),
                transparent 28%
            ),
            radial-gradient(
                circle at 10% 90%,
                rgba(11,70,80,.40),
                transparent 30%
            ),
            linear-gradient(
                145deg,
                #02272e 0%,
                #06353d 48%,
                #02272e 100%
            ) !important;

        z-index: 2147483646 !important;

        overflow-x: hidden !important;

        overflow-y: auto !important;

        visibility: hidden !important;

        opacity: 0 !important;

        transform: translateX(100%) !important;

        transition:
            transform .38s cubic-bezier(.77,0,.18,1),
            opacity .25s ease,
            visibility .38s ease !important;

        -webkit-overflow-scrolling: touch !important;
    }


    /* OPEN */

    #sbMobileMenu.sb-open {

        visibility: visible !important;

        opacity: 1 !important;

        transform: translateX(0) !important;
    }


    /* =====================================================
       MOBILE MENU HEADER
    ===================================================== */

    .sb-mobile-head {

        min-height: 105px !important;

        padding:
            22px
            90px
            18px
            22px !important;

        display: flex !important;

        align-items: center !important;

        position: sticky !important;

        top: 0 !important;

        z-index: 10 !important;

        background:
            linear-gradient(
                180deg,
                rgba(2,39,46,.99),
                rgba(2,39,46,.94)
            ) !important;

        border-bottom:
            1px solid rgba(217,164,65,.22) !important;

        backdrop-filter: blur(15px);
    }


    .sb-mobile-brand {

        padding: 0 !important;

        margin: 0 !important;
    }


    .sb-brand-title {

        color: #ffffff !important;

        font-size: 21px !important;

        line-height: 1.1 !important;

        font-weight: 800 !important;

        letter-spacing: .7px !important;
    }


    .sb-brand-tagline {

        color: var(--sb-gold-light) !important;

        font-size: 8px !important;

        font-weight: 700 !important;

        letter-spacing: 1.7px !important;

        margin-top: 6px !important;
    }


    /* =====================================================
       MENU CONTENT
    ===================================================== */

    .sb-mobile-content {

        padding:
            18px
            16px
            120px !important;
    }


    /* =====================================================
       MAIN MENU ITEMS
    ===================================================== */

    .sb-mobile-item {

        width: 100% !important;

        min-height: 62px !important;

        margin:
            0 0 9px 0 !important;

        padding:
            0 15px !important;

        display: flex !important;

        align-items: center !important;

        gap: 13px !important;

        box-sizing: border-box !important;

        color: #ffffff !important;

        text-decoration: none !important;

        background:
            linear-gradient(
                135deg,
                rgba(255,255,255,.075),
                rgba(255,255,255,.025)
            ) !important;

        border:
            1px solid rgba(217,164,65,.20) !important;

        border-radius: 14px !important;

        font-size: 15px !important;

        font-weight: 700 !important;

        box-shadow:
            0 7px 20px rgba(0,0,0,.13) !important;

        transition:
            background .25s ease,
            border-color .25s ease,
            transform .2s ease !important;
    }


    .sb-mobile-item:active {

        transform: scale(.985) !important;

        border-color:
            rgba(217,164,65,.70) !important;
    }


    /* =====================================================
       ITEM ICON
    ===================================================== */

    .sb-item-icon {

        width: 38px !important;

        height: 38px !important;

        min-width: 38px !important;

        border-radius: 10px !important;

        display: flex !important;

        align-items: center !important;

        justify-content: center !important;

        background:
            rgba(217,164,65,.13) !important;

        color:
            var(--sb-gold-light) !important;

        font-size: 17px !important;
    }


    .sb-arrow {

        margin-left: auto !important;

        color:
            rgba(255,255,255,.48) !important;

        font-size: 12px !important;
    }


    /* =====================================================
       SERVICES
    ===================================================== */

    .sb-mobile-group {

        margin: 0 0 9px 0 !important;
    }


    .sb-service-toggle {

        appearance: none !important;

        -webkit-appearance: none !important;

        font-family: inherit !important;

        text-align: left !important;

        cursor: pointer !important;

        outline: none !important;

        border:
            1px solid rgba(217,164,65,.20) !important;
    }


    .sb-service-arrow {

        margin-left: auto !important;

        color:
            var(--sb-gold-light) !important;

        font-size: 13px !important;

        transition:
            transform .3s ease !important;
    }


    .sb-service-toggle.sb-expanded
    .sb-service-arrow {

        transform: rotate(180deg) !important;
    }


    /* =====================================================
       SERVICE LIST
    ===================================================== */

    .sb-service-list {

        max-height: 0 !important;

        overflow: hidden !important;

        opacity: 0 !important;

        margin:
            0 5px !important;

        padding: 0 !important;

        transition:
            max-height .4s ease,
            opacity .3s ease,
            margin .3s ease !important;
    }


    .sb-service-list.sb-services-open {

        max-height: 700px !important;

        opacity: 1 !important;

        margin:
            2px
            5px
            11px !important;
    }


    .sb-service-list a {

        min-height: 50px !important;

        display: flex !important;

        align-items: center !important;

        gap: 11px !important;

        padding:
            9px 12px !important;

        box-sizing: border-box !important;

        color:
            #dce7e9 !important;

        text-decoration: none !important;

        font-size: 13px !important;

        background:
            rgba(0,0,0,.16) !important;

        border-bottom:
            1px solid rgba(255,255,255,.07) !important;
    }


    .sb-service-list a:first-child {

        border-radius:
            12px 12px 0 0 !important;
    }


    .sb-service-list a:last-child {

        border-radius:
            0 0 12px 12px !important;

        border-bottom: 0 !important;
    }


    .sb-service-list a i {

        width: 27px !important;

        min-width: 27px !important;

        text-align: center !important;

        color:
            var(--sb-gold-light) !important;

        font-size: 14px !important;
    }


    .sb-service-list a:active {

        background:
            rgba(217,164,65,.15) !important;
    }


    /* =====================================================
       CTA
    ===================================================== */

    .sb-mobile-cta {

        margin-top: 20px !important;

        padding: 17px !important;

        display: flex !important;

        align-items: center !important;

        gap: 12px !important;

        border-radius: 16px !important;

        background:
            linear-gradient(
                135deg,
                rgba(217,164,65,.17),
                rgba(217,164,65,.05)
            ) !important;

        border:
            1px solid rgba(217,164,65,.38) !important;

        box-shadow:
            0 12px 30px rgba(0,0,0,.18) !important;
    }


    .sb-cta-icon {

        width: 43px !important;

        height: 43px !important;

        min-width: 43px !important;

        border-radius: 50% !important;

        display: flex !important;

        align-items: center !important;

        justify-content: center !important;

        background:
            var(--sb-gold) !important;

        color:
            var(--sb-navy) !important;

        font-size: 17px !important;
    }


    .sb-cta-text {

        flex: 1 !important;
    }


    .sb-cta-text strong {

        display: block !important;

        color: #ffffff !important;

        font-size: 12px !important;
    }


    .sb-cta-text small {

        display: block !important;

        color: var(--sb-muted) !important;

        font-size: 9px !important;

        line-height: 1.4 !important;

        margin-top: 3px !important;
    }


    .sb-cta-btn {

        padding:
            9px 13px !important;

        border-radius: 8px !important;

        background:
            var(--sb-gold) !important;

        color:
            var(--sb-navy) !important;

        text-decoration: none !important;

        font-size: 11px !important;

        font-weight: 800 !important;

        white-space: nowrap !important;
    }


    /* =====================================================
       HIDE BOTTOM TABS WHEN MENU OPEN
    ===================================================== */

    body.sb-menu-open .mobile-tabs {

        display: none !important;
    }


    /* =====================================================
       BODY LOCK
    ===================================================== */

    body.sb-menu-open {

        overflow: hidden !important;

        height: 100vh !important;
    }

}


/* =========================================================
   SMALL MOBILE
========================================================= */

@media (max-width: 380px) {

    #rs-header .logo img {

        width: 130px !important;

        max-width: 130px !important;
    }


    .sb-mobile-trigger,
    .sb-mobile-trigger button {
        width: 45px !important;
        height: 45px !important;
    }


    .sb-mobile-trigger {

        right: 12px !important;
    }


    .sb-mobile-trigger button i {

        font-size: 24px !important;
    }


    .sb-brand-title {

        font-size: 18px !important;
    }


    .sb-brand-tagline {

        font-size: 7px !important;

        letter-spacing: 1.3px !important;
    }


    .sb-mobile-item {

        min-height: 58px !important;

        font-size: 14px !important;
    }

}


/* =========================================================
   DESKTOP
========================================================= */

@media (min-width: 992px) {

    .sb-mobile-trigger,
    #sbMobileMenu {

        display: none !important;
    }

}
