// =====section header starts=====
.home{
    .site-header{
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        background-color: transparent;
    }
}
.site-header{
    z-index: 2;
    background-color: #0b0c10;
    .header-inner{
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding: 16px 0;
        @include breakpoint (smaller)
        {
            padding: 10px 0;
        }
    }
    .logo{
        img{
            width: 140px;
            @include breakpoint (smaller)
            {
                width: 120px;
            }
        }
        &.desktop-logo{
            @include breakpoint (smaller)
            {
                display: none;
            }
        }
        &.mobile-logo{
            display: none;
            @include breakpoint (smaller)
            {
                display: block;
            }
        }
    }
    .menu-wrapper{
        display: flex;
        align-items: center;
        @include breakpoint (medium)
        {
            order: -1;
        }
        #mega-menu-wrap-menu-1 #mega-menu-menu-1 > li.mega-menu-item > a.mega-menu-link{
            font-size: 16px;
            text-transform: uppercase;
            font-weight: 500;
            @include transition (.3s);
            padding: 0 20px;
            @include breakpoint (wide)
            {
                padding: 0 10px;
            }
            @include breakpoint (medium)
            {
                font-size: 20px;
                font-weight: 700;
                line-height: 50px;
                height: 50px;
            }
        }
        #mega-menu-wrap-menu-1 .mega-menu-toggle + #mega-menu-menu-1{
            @include breakpoint (medium)
            {
                height: 100vh;
                width: 100vw;
                border-radius: 0 0 0 1000px;
                left: unset;
                right: 0;
                @include transition(.6s);
                transform: scale(0);
                transform-origin: top right;
                display: flex;
                flex-direction: column;
                justify-content: center;
                align-items: center;
            }
        }
        #mega-menu-wrap-menu-1 .mega-menu-toggle.mega-menu-open + #mega-menu-menu-1{
            @include breakpoint (medium)
            {
                transform: scale(1);
                border-radius: 0;
            }
        }
        #mega-menu-wrap-menu-1:has(.mega-menu-open) #mega-menu-menu-1[data-effect-mobile^="slide_right"] + button.mega-close{
            left: unset;
            top: 33px;
            right: 75px;
            transition: none;
            @include breakpoint (smaller)
            {
                top: 25px;
                right: 25px;
            }
        }
        #mega-menu-wrap-menu-1 .mega-menu-toggle .mega-toggle-blocks-right .mega-toggle-block:only-child{
            margin: 0;
        }
        #mega-menu-wrap-menu-1 .mega-menu-toggle .mega-toggle-block-0 .mega-toggle-animated-inner, #mega-menu-wrap-menu-1 .mega-menu-toggle .mega-toggle-block-0 .mega-toggle-animated-inner::before, #mega-menu-wrap-menu-1 .mega-menu-toggle .mega-toggle-block-0 .mega-toggle-animated-inner::after{
            width: 26px;
        }
        #mega-menu-wrap-menu-1 .mega-menu-toggle .mega-toggle-block-0 .mega-toggle-animated-box{
            width: 36px;
        }
    }
    .hdt-btn{
        @include breakpoint (smaller)
        {
            width: 30%;
        }
    }
    &.active{
        background-color: #0b0c10;
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        z-index: 3;
    }
}

// =====section header ends=====
