@media (max-width: 1024px) {
  header[nav-open='true'] {
    @apply fixed w-full z-50 top-0 left-0 bg-primary;
    @apply max-h-screen min-h-screen overflow-y-scroll;
  }

  header .secondary-menu-container,
  header .primary-menu-container,
  header #primary-menu {
    @apply hidden;
  }
  header[nav-open='true'] .secondary-menu-container,
  header[nav-open='true'] .primary-menu-container,
  header[nav-open='true'] #primary-menu {
    @apply block;
  }
  header[nav-open='true'] .menu-mobile-brand {
    .menu-mobile-brand__inner-elements {
      @apply hidden opacity-0;
    }
  }
  #primary-menu {
    @apply !bg-transparent;
  }

  body:has(header[nav-open='true']) {
    overflow-y: hidden;
    header {
      /* @apply min-h-screen; */
    }
  }
}