/*
 * A backdrop filter creates a containing block for fixed descendants in mobile
 * browsers. Disable it at the mobile breakpoint so the open navigation remains
 * fixed to the viewport after the page has been scrolled.
 */
@media (max-width: 800px) {
  .site-header.scrolled {
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
  }

  .site-header > .brand {
    position: relative;
    z-index: 2;
  }

  .navigation {
    z-index: 1;
    width: 100vw;
    height: 100dvh;
  }
}