@media (max-width: 900px) {
  body.menu-open { overflow: hidden; }
  .site-header { height: 92px; padding: 0 20px; border-bottom-color: rgba(255,255,255,.09); background: linear-gradient(180deg,rgba(3,4,5,.96),rgba(3,4,5,.35)); }
  .menu-toggle { display: block; margin-left: auto; background: #0b0c0e; border: 1px solid rgba(255,255,255,.2); width: 46px; height: 46px; position: relative; z-index: 90; padding: 0; cursor: pointer; }
  .menu-toggle span { position: absolute; left: 10px; right: auto; width: 24px; height: 2px; background: #fff; transition: transform .3s, top .3s, width .3s; }
  .menu-toggle span:first-child { top: 16px; }
  .menu-toggle span:last-child { top: 27px; width: 18px; }
  .menu-toggle[aria-expanded="true"] { border-color: rgba(255,23,56,.7); }
  .menu-toggle[aria-expanded="true"] span:first-child { top: 22px; transform: rotate(45deg); }
  .menu-toggle[aria-expanded="true"] span:last-child { top: 22px; width: 24px; transform: rotate(-45deg); }
  nav { position: fixed; inset: 0; top: 0; left: 0; width: 100%; height: 100vh; height: 100dvh; max-height: none; margin: 0; background: #030405; display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 0; padding: 116px 24px 44px; overflow-y: auto; opacity: 0; visibility: hidden; transform: translateY(-12px); transition: opacity .3s, visibility .3s, transform .3s; z-index: 78; }
  nav::before { content: "MAIN MENU // SATANA GAMING"; position: absolute; top: 122px; left: 50%; transform: translateX(-50%); white-space: nowrap; color: #666a70; font: 600 8px var(--body); letter-spacing: .3em; }
  nav::after { content: "PUBG MOBILE // EUROPE SERVER"; position: absolute; bottom: 28px; left: 50%; transform: translateX(-50%); white-space: nowrap; color: #55585d; font: 600 8px var(--body); letter-spacing: .25em; }
  nav.open { max-height: none; padding: 116px 24px 44px; border: 0; opacity: 1; visibility: visible; transform: none; }
  nav a { width: min(100%,420px); padding: 14px 0; text-align: center; color: #f4f4f3; font: 700 clamp(30px,9vw,44px)/1 var(--head); letter-spacing: .05em; border-bottom: 1px solid #1a1c20; }
  nav a:first-child { border-top: 1px solid #1a1c20; }
  nav a::after { display: none; }
  nav a:hover, nav a:focus-visible { color: var(--red2); }
  .hero-content { margin-top: 70px; }
}

@media (max-width: 420px) {
  nav, nav.open { padding-top: 110px; }
  nav::before { top: 112px; }
  .hero-content { margin-top: 82px; }
}