Как поставить выезжающий блок под header, и оставить его при этом кликабельным?

const $burger = document.querySelector('.header-burger');
const $menu = document.querySelector('.header__menu');

const toggleMenu = evt => {
  $burger.classList.toggle('header-burger--active');
  $menu.classList.toggle('header__menu--active');
};

$burger.addEventListener('click', toggleMenu)

.container {
    max-width: 90.625%;
    margin: auto;
}

.banner {
    position: relative;
    background-color: aqua;
}

.header {
    position: relative;
    padding: 20px 0;
    background-color: tomato;
}

.header__menu {
    position: absolute;
    top: 100%;
    left: 0;
    width: 100%;
    background-color: #000;
    color: #ffffff;
    z-index: 10;
    transition: .8s;
    transform: translateY(-100%);
}

.header__menu--active {
    transform: translateY(0%);
}

.header__container {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.header__content {
    width: 200px;
    height: 40px;
    background-color: pink;
}

.header-burger {
    position: relative;
    z-index: 50;
    display: flex;
    flex-direction: column;
    width: 35px;
    padding: 0;
    border: none;
    outline: none;
    background-color: transparent;
    cursor: pointer;
}

.header-burger__line {
    height: 4px;
    border-radius: 5px;
    width: 100%;
    background-color: #FBFAF7;
    transition: .3s;
}

.header-burger__line:not(:last-child) {
    margin-bottom: 8px;
}

.header-burger--active .header-burger__line {
    margin: 0;
}

.header-burger--active .header-burger__line:nth-child(1) {
    position: absolute;
    top: 50%;
    left: 0;
    transform: rotate(-45deg);
}

.header-burger--active .header-burger__line:nth-child(2) {
    opacity: 0;
}

.header-burger--active .header-burger__line:nth-child(3) {
    top: 50%;
    left: 0;
    transform: rotate(45deg);
}

<header class="header">
  <div class="container header__container">
    <div class="header__content"></div>
    <button class="header-burger">
      <span class="header-burger__line"></span>
      <span class="header-burger__line"></span>
      <span class="header-burger__line"></span>   
    </button>
    
    <div class="header__menu">
tiae blanditiis laudantiutiae blanditiis laudantiutiae blanditiis laudantiutiae blanditiis laudantiutiae blanditiis laudantiutiae blanditiis laudantiutiae blanditiis laudantiutiae blanditiis laudantiutiae blanditiis laudantiutiae blanditiis laudantiutiae blanditiis laudantiutiae blanditiis laudantiutiae blanditiis laudantiutiae blanditiis laudantiutiae blanditiis laudantiutiae blanditiis laudantiutiae blanditiis laudantiutiae blanditiis laudantiutiae blanditiis laudantiutiae blanditiis laudantiutiae blanditiis laudantiutiae blanditiis laudantiutiae blanditiis laudantiutiae blanditiis laudantiutiae blanditiis laudantiutiae blanditiis laudantiutiae blanditiis laudantiutiae blanditiis laudantiutiae blanditiis laudantiutiae blanditiis laudantiutiae blanditiis laudantiutiae blanditiis laudantiutiae blanditiis laudantiutiae blanditiis laudantiutiae blanditiis laudantiutiae blanditiis laudantiutiae blanditiis laudantiutiae blanditiis laudantiutiae blanditiis laudantiutiae blanditiis laudantiutiae blanditiis laudantiutiae blanditiis laudantiutiae blanditiis laudantiutiae blanditiis laudantiutiae blanditiis laudantiutiae blanditiis laudantiutiae blanditiis laudantiutiae blanditiis laudantiutiae blanditiis laudantiutiae blanditiis laudantiutiae blanditiis laudantiutiae blanditiis laudantiutiae blanditiis laudantiutiae blanditiis laudantiutiae blanditiis laudantiutiae blanditiis laudantiutiae blanditiis laudantiutiae blanditiis laudantiutiae blanditiis laudantiutiae blanditiis laudantiutiae blanditiis laudantiutiae blanditiis laudantiutiae blanditiis laudantiutiae blanditiis laudantiutiae blanditiis laudantiutiae blanditiis laudantiu
    </div>
  </div>
</header>

<div class="banner">
        Lorem ipsum dolor sit amet, consectetur adipisicing elit. Aperiam molestiae blanditiis laudantium aspernatur! Provident mollitia, aperiam fugit fuga adipisci nesciunt tenetur odit cum ad fugiat tempore atque quod temporibus distinctio, eligendi dolore accusamus autem eveniet quia. Aperiam consequuntur, a qui cum eligendi minima ad quisquam dolore, unde odio ab hic facilis ut voluptate ex nostrum dolores numquam, in sit doloribus quas. Eligendi non impedit vel temporibus sint nam officiis. Repellat ducimus eaque magni sit ad vitae, delectus fugiat velit quibusdam doloremque ipsam aperiam ipsa, maiores quas, minima illo fuga soluta quod ab? Excepturi iusto dolores, rerum ut itaque nemo enim!
          Lorem ipsum dolor sit amet, consectetur adipisicing elit. Aperiam molestiae blanditiis laudantium aspernatur! Provident mollitia, aperiam fugit futiae blanditiis laudantiutiae blanditiis laudantiutiae blanditiis laudantiutiae blanditiis laudantiutiae blanditiis laudantiutiae blanditiis laudantiutiae blanditiis laudantiutiae blanditiis laudantiutiae blanditiis laudantiutiae blanditiis laudantiutiae blanditiis laudantiutiae blanditiis laudantiutiae blanditiis laudantiutiae blanditiis laudantiutiae blanditiis laudantiutiae blanditiis laudantiutiae blanditiis laudantiutiae blanditiis laudantiutiae blanditiis laudantiutiae blanditiis laudantiutiae blanditiis laudantiutiae blanditiis laudantiutiae blanditiis laudantiutiae blanditiis laudantiutiae blanditiis laudantiutiae blanditiis laudantiutiae blanditiis laudantiutiae blanditiis laudantiutiae blanditiis laudantiutiae blanditiis laudantiutiae blanditiis laudantiutiae blanditiis laudantiutiae blanditiis laudantiutiae blanditiis laudantiutiae blanditiis laudantiutiae blanditiis laudantiutiae blanditiis laudantiutiae blanditiis laudantiutiae blanditiis laudantiutiae blanditiis laudantiutiae blanditiis laudantiutiae blanditiis laudantiutiae blanditiis laudantiutiae blanditiis laudantiutiae blanditiis laudantiutiae blanditiis laudantiutiae blanditiis laudantiuga adipisci nesciunt tenetur odit cum ad fugiat tempore atque quod temporibus distinctio, eligendi dolore accusamus autem eveniet quia. Aperiam consequuntur, a qui cum eligendi minima ad quisquam dolore, unde odio ab hic facilis ut voluptate ex nostrum dolores numquam, in sit doloribus quas. Eligendi non impedit vel temporibus sint nam officiis. Repellat ducimus eaque magni sit ad vitae, delectus fugiat velit quibusdam doloremque ipsam aperiam ipsa, maiores quas, minima illo fuga soluta quod ab? Excepturi iusto dolores, rerum ut itaque nemo enim!
</div>