/* Тема портала мест — mest-net.ru.

   Поверх каркаса (core.css). Портал смотрят с телефона в дороге, поэтому здесь: акцент —
   вода (как река в знаке), кнопки и карточки крупнее под палец, нижняя панель навигации,
   безопасные отступы под вырез экрана. Устройство страниц то же, что у сайта Комитета, —
   различия держатся в этом файле и в переменных (решения §2). */

:root {
  --atm-accent: var(--atm-water-deep);
}

/* ── Телефон первым: карточки в одну колонку, пальцу есть куда нажать ─────────── */
@media (max-width: 760px) {
  .btn { padding: 15px 24px; font-size: 15px; }
  .tiles, .kinds { grid-template-columns: 1fr; }
  .dirs { grid-template-columns: repeat(2, 1fr); gap: 14px; }
  .sec { padding: 54px 0; }
}

/* ── Нижняя панель навигации ───────────────────────────────────────────────────
   Показывается только на телефоне: на компьютере работает меню в шапке, и вторая
   навигация внизу там только мешает. */
.tabbar { display: none; }

@media (max-width: 860px) {
  .tabbar {
    position: fixed;
    inset: auto 0 0 0;
    z-index: 40;
    display: grid;
    grid-auto-flow: column;
    grid-auto-columns: 1fr;
    gap: 2px;
    padding: 6px 4px calc(6px + env(safe-area-inset-bottom));
    background: color-mix(in srgb, var(--atm-paper) 92%, transparent);
    backdrop-filter: blur(10px);
    border-top: 1px solid var(--atm-line);
  }

  .tabbar a {
    display: grid;
    justify-items: center;
    gap: 2px;
    padding: 6px 2px;
    font-size: 11px;
    letter-spacing: .04em;
    text-decoration: none;
    color: var(--atm-ink-soft);
    border-radius: 2px;
  }

  .tabbar a span { font-size: 17px; line-height: 1; }

  .tabbar a[aria-current="page"] { color: var(--atm-accent); }

  /* Чтобы панель не закрывала конец страницы и кнопку в подвале */
  body.has-bottom { padding-bottom: 68px; }
}