@media (max-width: 1199px){
    .header-menu .menu {
        overflow-y: hidden;
        overflow-x: hidden;
        position: relative;
        padding: 20px;
        height: 100%;
    }
    .header-menu .menu__nav li {
        overflow: hidden;
    }
    .header-menu .menu__nav > li > a {
        font-weight: 500;
        font-size: 16px;
    }
    .header-menu .menu__nav a {
        display: flex;
        justify-content: space-between;
        align-items: center;
        height: 60px;
        padding: 0 20px;
        border-radius: 8px;
        color: #140342!important;
        transition: all 0.2s cubic-bezier(0.215, 0.61, 0.355, 1);
    }
    .header-menu .menu .subnav {
        position: absolute;
        top: 0;
        left: 0;
        color: black !important;
        padding: 20px;
        width: 100%;
        height: 100%;
    }
    .header-menu .menu .subnav .menu__backButton a {
        justify-content: flex-start !important;
        height: 60px !important;
        font-weight: 600 !important;
        color: #6440FB !important;
        font-size: 16px;
        background-color: #F4F1FE;
    }
    .header-menu .menu .subnav > li > a {
        display: flex;
        align-items: center;
        justify-content: space-between;
        height: 45px;
        padding: 0 20px;
        color: #140342 !important;
        transition: color 0.2s cubic-bezier(0.215, 0.61, 0.355, 1);
    }
    .header-menu .menu__nav {
        display: flex;
        flex-direction: column;
    }
    .header-menu .menu ul {
        pointer-events: none;
    }
    .header-menu.-is-el-visible .-is-active {
        pointer-events: auto !important;
        overflow-y: scroll;
        overflow-x: hidden;
    }
    .header-menu.-is-el-visible {
        opacity: 1;
        pointer-events: auto;
    }
    .header-menu .header-menu__content {
        display: flex;
        flex-direction: column;
        height: 100%;
        transition: all 0.3s cubic-bezier(0.215, 0.61, 0.355, 1);
        transform: translateX(-20%);
    }
    .header-menu.-is-el-visible .header-menu__content {
        transform: none;
    }
    .header-menu-close {
        position: absolute;
        top: 20px;
        right: -45px;
        z-index: -1;
    }
    .header-menu-bg {
        position: fixed;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0;
        background-color: rgba(24, 24, 26, 0.7);
        z-index: -2;
    }
    .header-menu {
        position: fixed !important;
        top: 0;
        left: 0;
        z-index: 10;
        max-width: calc(100vw - 80px);
        width: 60vw;
        height: 100vh;
        padding: 0 !important;
        transition: all 0.3s cubic-bezier(0.215, 0.61, 0.355, 1);
        opacity: 0;
        pointer-events: none;
    }
    .header-menu .mobile-bg {
        position: fixed;
        top: 0;
        left: 0;
        max-width: calc(100vw - 80px);
        width: 60vw;
        height: 100vh;
        z-index: -1;
        background-color: white;
    }
    .header-menu .menu .subnav a {transform: translateY(100%);}
    .header-menu .menu__nav a:hover {color: #6440FB !important;background-color: #F4F2FF;}
    .menu-close-btn{display: flex;width: 40px;height: 40px;flex-shrink: 0;justify-content: center;align-items: center;background: #fff;border-radius: 50%}
    .menu-close-btn .fa{font-size: 20px;color: #000}
    .button-non {width: 65px;height: 75px;display: flex;justify-content: end;margin-left: auto;padding: 0;border: 0;border-radius: 0;background-color: transparent;text-decoration: none;}
}
@media (max-width: 1199px) and (max-width: 575px){
    .header-menu .mobile-bg {
        width: calc(100vw - 60px);
        max-width: 100%;
    }
    .header-menu {
        width: calc(100vw - 60px);
        max-width: 100%;
    }
    .header-menu-close {
        top: 10px;
        right: -45px;
    }
}