@media (max-width: 840px) {
  .site-header {
    grid-template-columns: auto 1fr auto;
  }

  .menu-toggle {
    display: inline-flex;
    justify-self: end;
    padding: 0.5rem 0.75rem;
    border: 1px solid var(--color-border);
    background: transparent;
    color: var(--color-text);
  }

  .site-nav {
    display: none;
    grid-column: 1 / -1;
    flex-direction: column;
    align-items: stretch;
    padding: 1rem;
    background: #050505;
  }

  .site-nav.is-open {
    display: flex;
  }

  .split-section,
  .card-grid-section,
  .product-grid,
  .cart-layout,
  .checkout-layout,
  .account-grid,
  .two,
  .media-wall.vertical {
    grid-template-columns: 1fr;
  }

  .hero-logo-shell {
    width: 95vw;
    opacity: 0.2;
  }

  .hero-copy h1,
  .page-hero h1 {
    font-size: clamp(3.4rem, 18vw, 6rem);
  }

  .footer-main {
    grid-template-columns: 1fr;
  }

  .footer-nav {
    justify-content: flex-start;
    text-align: left;
  }

  .footer-bottom {
    align-items: flex-start;
    flex-direction: column;
  }


  .compact-footer-row {
    align-items: flex-start;
    flex-direction: column;
  }

  .footer-legal {
    justify-content: flex-start;
    text-align: left;
  }

  .event-card {
    grid-template-columns: 1fr;
  }

  .media-rail {
    grid-auto-columns: 84vw;
  }
}

@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }

  *,
  *::before,
  *::after {
    animation-duration: 0.001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.001ms !important;
  }
}

@media (max-width: 840px) {
  .site-header > .admin-sigil {
    display: none;
  }

  .media-wall.vertical {
    grid-template-columns: 1fr;
    max-height: none;
    overflow: visible;
  }

  .media-card {
    aspect-ratio: 4 / 3;
  }
}

@media (max-width: 840px) {
  .site-nav .mobile-menu-admin-sigil {
    display: inline-flex;
    align-self: flex-start;
    width: 34px;
    height: 34px;
    margin-top: 0.25rem;
  }
}