/* Мобильное бургер-меню платформы AquaMania 2.0. Общий файл для всех экранов.
   Опирается на единую структуру шапки: nav.nav > .wrap > (.brand, .links, .right).
   Десктоп (>820px) — без изменений, бургер скрыт. Мобильный — меню сворачивается
   анимированно (max-height+opacity), тач-таргеты ≥44px, фокус-ловушка в JS. */
.nav .burger{display:none}
@media(max-width:820px){
  .nav .wrap{flex-wrap:wrap}
  .nav .burger{
    display:inline-flex;align-items:center;justify-content:center;margin-left:auto;
    width:44px;height:44px;font-size:20px;line-height:1;cursor:pointer;
    background:transparent;border:1px solid var(--hairline,rgba(255,255,255,.2));
    border-radius:10px;color:var(--text-primary,#fff);
    transition:border-color .2s ease,background .2s ease
  }
  .nav .burger:hover,.nav .burger:focus-visible{border-color:var(--accent,#22D3EE)}
  .nav .burger:focus-visible{outline:2px solid var(--accent,#22D3EE);outline-offset:2px}

  /* свёрнутое состояние — занимает 0 высоты, но анимируется (не display:none) */
  .nav .links,.nav .right{
    display:flex;flex-direction:column;align-items:stretch;width:100%;order:3;
    max-height:0;opacity:0;overflow:hidden;margin:0;
    transition:max-height .28s ease,opacity .2s ease,margin .28s ease;
    pointer-events:none
  }
  /* открытое меню — ПЛОТНЫЙ фон (на мобильном backdrop-blur часто не рендерится,
     стеклянный .82 просвечивает фото-герой → текст теряется) */
  /* у .wrap фикс-высота 64px → без этого меню вываливается ЗА фон nav (регрессия 2.0) */
  .nav.open .wrap{height:auto;padding-bottom:14px}
  .nav.open{background:var(--bg-base,#070B0F);backdrop-filter:none;box-shadow:0 14px 34px rgba(0,0,0,.5)}
  .nav.open .links{max-height:62vh;opacity:1;margin:10px 0 0;overflow-y:auto;pointer-events:auto}
  .nav.open .right{max-height:46vh;opacity:1;margin:6px 0 2px;overflow-y:auto;pointer-events:auto;
    border-top:1px solid var(--hairline,rgba(255,255,255,.12));padding-top:10px}

  /* тач-таргеты ≥44px (рекомендация WCAG/Lighthouse) */
  .nav .links a,.nav .right a,.nav .right span{
    min-height:44px;display:flex;align-items:center;padding:8px 2px;font-size:16px
  }
  .nav.open .right .btn{justify-content:center}
}
@media(prefers-reduced-motion:reduce){
  .nav .links,.nav .right{transition:none}
}