/* Правовые страницы — один образец на все (закон 7.22, решение Максима 04.09.2026):
   восемь колонок по центру на десктопе, шесть из восьми на планшете, во всю
   ширину на телефоне. Скриптов на странице нет, поэтому и класса js нет:
   документ читается при любом отказе JS. */

.legal { padding-block: calc(var(--hdr-h) + var(--rhythm) / 2) var(--rhythm) }

.legal__head, .legal__doc { grid-column-end: span var(--cols) }

@media (min-width: 760px) {
  /* 8 колонок планшета: 2/12 от двенадцати - это 1,33, берётся ближайшее
     ЦЕЛОЕ число колонок (7.1) */
  .legal__head, .legal__doc { grid-column: 2 / span 6 }
}
@media (min-width: 1200px) {
  .legal__head, .legal__doc { grid-column: 3 / span 8 }
}

/* Шапка документа и колонка текста — разные блоки: у них разные роли,
   объявление и содержимое (7.13). */
.legal__head { margin-bottom: var(--s8) }
.legal__head .h2 + p { margin-top: var(--s4); color: var(--ink-mute) }

/* Восемь колонок на 1440 — это 880 px, около 120 знаков в строке при норме
   45-75. Ширину назвал заказчик, и она сильнее шкалы (7.6); единственная
   законная компенсация — интерлиньяж: чем длиннее строка, тем он нужнее,
   потому что глаз теряется на возврате к началу следующей (7.22, 7.8). */
.legal__doc { line-height: 1.7 }
.legal__doc h2 {
  margin-top: var(--s8);
  margin-bottom: var(--s4);
  font-size: var(--t-l);          /* меньшая ступень шкалы: десяток разделов
                                     кеглем заголовка полосы читается как крик */
  line-height: 1.25;
}
.legal__doc h2:first-child { margin-top: 0 }
.legal__doc p { margin-top: var(--s4) }
.legal__doc ul { margin-top: var(--s4); display: grid; gap: var(--s3) }
.legal__doc li { position: relative; padding-left: var(--s5) }
.legal__doc li::before { content: '—'; position: absolute; left: 0 }
.legal__doc a { color: var(--accent); text-decoration: underline; text-underline-offset: 3px }

/* Шапка правовой страницы: своё состояние прямо в разметке, без скрипта */
.hdr--plain .hdr__bar { background: var(--bg-dark) }

/* Страница спасибо: та же раскладка правовой страницы, но полоса одна
   и без длинного текста — действие закрывает её (7.13). */
.thanks { min-height: 60vh }
.thanks__box .h2 + p { max-width: var(--measure); color: var(--ink) }
.thanks__act { margin-top: var(--s7) }