/* ═══════════════════════════════════════════════════════════════════
   Rugma — общий адаптив-слой для маркетинговых/статических страниц.
   Подключается <link>-ом на index/login/dashboard/pricing/blog/docs/about/
   components/article. Разметку страниц НЕ переписываем — только слой поверх.

   Единый контракт брейкпоинтов (совпадает с css/editor.css):
     phone            ≤ 479px
     phone-landscape  480–767px
     tablet           768–1199px
     desktop          ≥ 1200px   — без изменений

   Почему всё за @media (max-width:1199px): десктоп не должен измениться ни на
   пиксель. Правила ниже не активны на ≥1200px.
   ═══════════════════════════════════════════════════════════════════ */

/* Тач-таргеты: минимум 44×44px для пальца на phone/tablet.
   Почему не трогаем текстовые ссылки в абзацах: раздувать строчные ссылки внутри
   текста нельзя — ломает вёрстку прозы. Только элементы-кнопки/табы/ссылки-кнопки. */
@media (max-width: 1199px) {
  button,
  .btn, .btn-oauth, .tab, .chip,
  a.btn, a.button, [role="button"],
  input[type="submit"], input[type="button"] {
    min-height: 44px;
    min-width: 44px;
  }

  /* Медиа не должны создавать горизонтальный скролл на узких экранах. */
  img, video, table { max-width: 100%; }
}

/* Phone: инпуты ≥16px — iOS не делает автозум при фокусе поля.
   Почему только phone: на десктопе размер полей задаётся дизайном страниц. */
@media (max-width: 767px) {
  input, select, textarea { font-size: 16px; }

  /* Широкие таблицы на телефоне — горизонтальный скролл вместо переполнения.
     Сравнение Rugma vs Figma на маркетинге — это карточная сетка .cmp (стекается
     отдельно), но правило страхует любые настоящие <table>, не ломая узкие. */
  table {
    display: block;
    max-width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }

  /* Компактная шапка маркетинга: меньше паддинга, ничего не вылезает за экран.
     Вторичные ссылки .r-nav-links уже скрыты в rugma-pages.css ≤1100px (навигация —
     через футер); логотип и правые действия (Войти/CTA) остаются доступны. */
  .r-nav-in { padding: 12px 16px; gap: 12px; }
}