/* ===========================================================================
   Правовые страницы: политика, условия, поддержка.
   Шапка и подвал те же, что на лендинге, поэтому здесь только колонка текста.
   Отдельного вида у этих страниц нет намеренно: документ, свёрстанный не как
   остальной сайт, читается как чужой, а доверие к нему и есть весь их смысл.
   =========================================================================== */

.doc { padding: 44px 0 8px; }
.doc-in { max-width: 46rem; margin: 0 auto; }

.doc h1 { font-size: clamp(30px, 5vw, 44px); margin-bottom: 14px; }
.doc .lede { font-size: 19px; margin-bottom: 10px; }
.doc .when { color: var(--muted); font-size: 15px; margin-bottom: 0; }

.doc h2 {
  font-size: clamp(21px, 2.6vw, 26px);
  margin: 40px 0 12px;
}
.doc h3 { font-size: 17.5px; margin: 24px 0 6px; }
.doc p { font-size: 17px; }
.doc ul, .doc ol { padding-left: 22px; margin: 0 0 14px; }
.doc li { margin: 7px 0; font-size: 17px; }

/* Карточка внутри текста: то, что человек будет искать глазами, а не читать
   подряд. Например, как удалить аккаунт. */
.doc .box {
  background: var(--surface);
  border-radius: var(--radius-sm);
  padding: 22px 24px;
  margin: 22px 0;
}
.doc .box h3:first-child { margin-top: 0; }
.doc .box p:last-child { margin-bottom: 0; }

/* Таблица данных прокручивается сама, а не тянет за собой страницу. */
.doc .rows {
  overflow-x: auto;
  background: var(--surface);
  border-radius: var(--radius-sm);
  margin: 22px 0;
}
.doc table { width: 100%; border-collapse: collapse; font-size: 16px; min-width: 480px; }
.doc th, .doc td { text-align: left; vertical-align: top; padding: 13px 18px; border-bottom: 1px solid var(--line); }
.doc th {
  font-family: var(--display);
  font-size: 11.5px;
  font-weight: 800;
  letter-spacing: 0.09em;
  text-transform: uppercase;
  color: var(--muted);
}
.doc tr:last-child td { border-bottom: 0; }

/* Соседние документы внизу: человек, дочитавший политику, часто идёт в оферту. */
.doc-next { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 14px; margin: 44px 0 8px; }
.doc-next a {
  background: var(--surface);
  border-radius: var(--radius-sm);
  padding: 18px 20px;
  text-decoration: none;
  color: var(--ink);
}
.doc-next a b { display: block; font-family: var(--display); font-weight: 800; font-size: 16.5px; margin-bottom: 3px; }
.doc-next a span { color: var(--muted); font-size: 14.5px; }
.doc-next a:hover { background: var(--sunk); }