/* === responsive.css — медиа-запросы для узких экранов (<= 768px) === */

/* ── Responsive ───────────────────────────────────────── */
@media (max-width: 768px) {
  /* Правила .sl-body / .ch-banner / .btn-toc / .ch-title / .results-card сняты:
     их единственным носителем была легаси-страница «Результаты», перенесённая
     на editorial. Легаси-страниц в издании больше нет. */
  /* Правила .grid-2 / .grid-3 / .hat-grid / .style-grid / .idx-cols сняты
     19.08.2026 вместе с slides.css: носителей у этих классов не осталось. */
  .cover-frame { padding: 20px 18px 28px; }
  .cover-top, .cover-headline { max-width: 100%; }
  .cover-title { font-size: clamp(1.9rem, 8.5vw, 2.7rem); }
  .cover-subtitle { white-space: normal; }
  /* Строка про ИИ на телефоне мельче и плотнее: четырнадцать слов на 375px
     дают четыре строки, и при десктопном line-height они съедали бы место
     у кнопок. Меру снимаем — колонку задаёт уже сам экран. */
  .cover-ai { font-size: .76rem; line-height: 1.45; max-width: 100%; }
  .cover-bottom { align-items: stretch; }
  .cover-btn { width: 100%; justify-content: center; padding: 14px 24px; }
  /* Поля обвязки задаёт header.css через padding-inline. Шорткат `padding: 0 16px`
     стоял здесь со времён стеклянных островов и обнулял бы вертикальный отступ
     вуали; заодно он молча перебивал собственный медиазапрос header.css на 640. */
  .match-game__board { gap: 8px 10px; }
  .match-item { padding: 10px 11px; font-size: .82rem; }
  .flashcards__grid { grid-template-columns: repeat(auto-fill, minmax(120px, 1fr)); }
}
