/* Top-Top — оформление правовых страниц (terms.html, privacy.html, refund.html).
 *
 * ЗАЧЕМ ОТДЕЛЬНЫЙ ФАЙЛ. Правовой текст читают иначе, чем витрину: его открывают, чтобы найти
 * конкретный пункт, часто с телефона и часто по ссылке из письма. Поэтому здесь только
 * читаемость: узкая колонка (длинная строка в 140 знаков не читается), заметные заголовки,
 * честная таблица про данные и ничего мигающего.
 *
 * ЧЕГО ЗДЕСЬ НЕТ: ни размытия (backdrop-filter / filter: blur), ни анимаций, ни внешних шрифтов —
 * те же ограничения, что и на витрине, и их отдельно проверяет выпуск. */

.legal{max-width:820px}
.legal h1{font-size:28px; margin:6px 0 8px; line-height:1.2}
.legal h2{font-size:19px; margin:26px 0 8px}
.legal p{margin:0 0 12px; line-height:1.62; color:var(--ink)}
.legal ul,.legal ol{margin:0 0 14px; padding-left:22px; line-height:1.62}
.legal li{margin-bottom:6px}
.legal a{color:inherit; text-decoration:underline}
.legal__meta{color:var(--ink-soft); font-size:14px; margin-bottom:18px}
.legal__doc{background:var(--card-solid); border:1px solid rgba(255,255,255,.9); border-radius:16px;
  padding:24px 26px; box-shadow:0 10px 26px rgba(38,49,78,.07)}
.legal__sep{border:0; border-top:1px solid var(--line); margin:24px 0 16px}
.legal__table{width:100%; border-collapse:collapse; margin:6px 0 16px; font-size:14.5px}
.legal__table th,.legal__table td{border-bottom:1px solid var(--line); padding:9px 10px;
  text-align:left; vertical-align:top}
.legal__table th{color:var(--ink-soft); font-weight:600}
.legal-lang{display:flex; gap:8px}
.legal-lang .lang__btn{cursor:pointer; border:1px solid var(--line); background:transparent;
  border-radius:999px; padding:6px 14px; color:inherit; font:inherit}
.legal-lang .lang__btn.is-on{border-color:var(--blue); color:var(--blue)}

@media (max-width:640px){
  .legal__doc{padding:18px 16px}
  .legal h1{font-size:23px}
  .legal__table{font-size:13.5px}
}