Почему съезжает блок меню?

.layout {} 
    .layout__header { 
        position: fixed; 
        top: 0; 
        right: 0; 
        left: 0; 
        z-index: 1000 
    } 
 
    .header { 
        padding: 15px 0; 
        background-color: #0a0a10; 
    } 
    @media (min-width: 1280px) { 
        .header { 
            padding: 45px 0 0 ; 
            background-color: transparent; 
        } 
    } 
    .header__inner { 
        display: flex; 
        align-items: center; 
        height: 35px; 
    } 
    @media (min-width: 1280px) { 
        .header__inner { 
            align-items: stretch; 
            justify-content: space-between; 
        } 
    } 
    .header__left { 
        display: flex; 
        align-items: center; 
    } 
    @media (min-width: 1280px) { 
        .header__left { 
            align-items: stretch; 
            flex: 0 0 300px; 
        } 
    } 
    .header__right { 
        flex-grow: 1; 
        display: flex; 
    } 
 
    .logo { 
        display: block; 
    } 
    .logo__img { 
        width: 121px; 
        height: 35px; 
    } 
 
    .lang { 
    } 
    .lang-wrap { 
        margin: 0 0 0 38px; 
    } 
    .lang__btn { 
        position: relative; 
        padding: 0 3px 0 0; 
        color: #fff; 
        font-size: 12px; 
        line-height: 1; 
        font-weight: 300; 
        text-transform: uppercase; 
    } 
    .lang__btn:hover { 
        color: #ffd8ff; 
    } 
    .lang__btn:after { 
        content: ''; 
        display: block; 
        position: absolute; 
        top: 0; 
        right: 0; 
        width: 1px; 
        height: 10px; 
        background-color: #eb7cff; 
    } 
    .lang__body { 
        display: none; 
        position: absolute; 
        top: 100%; 
        left: 50%; 
        padding: 8px 5px; 
        margin: 8px 0 0 0; 
        background-color: rgba(0,0,0,.95); 
        border-radius: 12px; 
        transform: translate3d(-50%, 0, 0); 
    } 
    .open .lang__body { 
        display: block; 
    } 
    .lang__item { 
        width: 100%; 
        padding: 4px 9px; 
        color: #fff; 
        font-size: 12px; 
        line-height: 1; 
        font-weight: 300; 
        border-radius: 6px; 
    } 
    .lang__item:hover { 
        color: #ffd8ff; 
    } 
 
    .header-bars { 
        display: block; 
        margin: 0 0 0 20px; 
    } 
    @media (min-width: 1280px) { 
        .header-bars { 
            display: none; 
        } 
    } 
    .header-bars__line { 
        display: block; 
        width: 20px; 
        height: 2px; 
        background-color: #fff; 
        transition: transform ease-out .3s, opacity ease-out .3s, background-color ease-out .3s; 
    } 
    .header-bars:hover .header-bars__line, 
    .open .header-bars .header-bars__line { 
        background-color: #eb7cff; 
    } 
    .header-bars__line_middle { 
        width: 13px; 
        margin: 4px 0; 
    } 
    .open .header-bars .header-bars__line_top { 
        transform: rotate(45deg) translate(3px, 5px); 
    } 
    .open .header-bars .header-bars__line_middle { 
        opacity: 0; 
    } 
    .open .header-bars .header-bars__line_bottom { 
        transform: rotate(-45deg) translate(3px, -6px); 
    } 
 
    @media (max-width: 1279.98px) { 
        .header-menu { 
            display: none; 
            position: absolute; 
            top: 100%; 
            right: 20px; 
            left: 20px; 
            margin: 15px 0 0; 
            padding: 10px 0; 
            background-color: rgba(0,0,0,.95); 
            z-index: 99; 
        } 
        .open .header-menu { 
            display: block; 
        } 
    } 
    @media (min-width: 1280px) { 
        .header-menu { 
            flex-grow: 1; 
            display: flex; 
            margin: -10px 0 0; 
        } 
    } 
    .header-menu__link { 
        display: block; 
        padding: 10px 20px; 
        color: #fff; 
    } 
    @media (min-width: 1280px) { 
        .header-menu__link { 
            padding: 10px 20px; 
        } 
        .header-menu__link:first-child { 
            padding-left: 0; 
        } 
        .header-menu__link:last-child { 
            padding-right: 0; 
        } 
        .header-menu__link_order { 
            margin-left: auto; 
        } 
    } 
    @media (min-width: 1920px) { 
        .header-menu__link { 
            padding: 10px 50px; 
        } 
    } 
    .header-menu__link:not(.active):hover, 
    .header-menu__link.active { 
        color: #ffd8ff; 
    } 
    .header-menu__text { 
        position: relative; 
        padding: 0 0 0 0px; 
        font-size: 14px; 
        line-height: 1.2; 
    } 
    .header-menu__text:before { 
        content: ''; 
        display: block; 
        position: absolute; 
        top: 3px; 
        left: 0; 
        width: 5px; 
        height: 5px; 
        background-color: currentColor; 
        transition: height .2s ease; 
    } 
    .header-menu__link.active .header-menu__text:before { 
        height: 9px; 
    }

<div class="layout"> 
    <div class="layout__header"> 
        <div class="header"> 
            <div class="header__inner container"> 
                <div class="header__left"> 
                    <a class="logo" data-menuanchor="intro" href="#intro"> 
                        <img class="logo__img" src="./img/logo.png" /> 
                    </a> 
                    <div class="lang-wrap"> 
                        <input id="lang" type='checkbox'> 
                        <label for="lang" class="rus">RUS</label><label for="lang" class="eng">ENG</label> 
 
                    </div> 
                </div> 
                <div class="header__right"> 
 
                    <button class="header-bars" data-toggle="dropdown"> 
                        <div class="header-bars__line header-bars__line_top"></div> 
                        <div class="header-bars__line header-bars__line_middle"></div> 
                        <div class="header-bars__line header-bars__line_bottom"></div> 
                    </button> 
                    <div class="header-menu"> 
                        <a class="header-menu__link" data-menuanchor="what-we-do" href="#whatWeDo" id="whatWeDo_2"> 
                            <div class="box_1"></div><div class="header-menu__text">What  do we do?</div> 
                        </a> 
                        <a class="header-menu__link" data-menuanchor="work-process" href="#workProcess" id="workProcess_2"> 
                            <div class="header-menu__text">The process of work</div> 
                        </a> 
                        <a class="header-menu__link" data-menuanchor="why-us" href="#whyUs" id="whyUs_2"> 
                            <div class="header-menu__text">Why should you choose us?</div> 
                        </a> 
                        <a class="header-menu__link" data-menuanchor="prices" href="#Prices" id="Prices_2"> 
                            <div class="header-menu__text">Price-list</div> 
                        </a> 
                        <a class="header-menu__link header-menu__link_order" data-menuanchor="order" href="#Order" id="Order_2"> 
                            <div class="header-menu__text">Make an order</div> 
                        </a> 
                    </div> 
                </div> 
            </div>   
        </div> 
    </div> 
</div>