.menu {
   position: absolute;
}

@media screen and (max-width: 1400px) {
   .menu {
      display: flex;
      opacity: 0;
      visibility: hidden;
      backdrop-filter: blur(0px);
      transition: all 0.4s linear;
      position: fixed;
      z-index: 4;
      right: 0;
      bottom: 0;
      width: 100%;
      height: calc(100% - 100px);
      justify-content: end;
   }

   .menu.menu_show {
      visibility: unset;
      backdrop-filter: blur(10px);
      background: rgba(0,0,0,0.6);
      opacity: 1;
      transition: all 0.4s linear;
   }

   .menu-content {
      position: absolute;
      height: 100%;
      width: 300px;
      right: -300px;
      background: var(--dropdown-menu-bg);
      transition: all 0.2s ease-in-out;
   }

   .menu-content > ul {
      list-style-type: none;
      margin: 0;
      text-align: right;
      color: white;
      font-size: 24px;
      display: flex;
      flex-direction: column;
      gap: 24px;
      padding: 24px;
   }

   .menu-content.menu-content_show {
      right: 0;
   }
}