/* Правовые страницы сайта: политика конфиденциальности и всё, что к ней
   примыкает. Шапка, подвал, контейнер и переключатель языка — общие, из
   /shared/tokens.css; здесь только типографика длинного текста. */

.legal {
  overflow-x: hidden;
}

/* Ширину задаёт не сама колонка, а её содержимое.
   `.prose` — это и есть `.container`, общий для всего сайта: сузив его до 760,
   мы сузили бы и рамку страницы, и текст начинался бы на 140 пикселей правее
   логотипа над ним. При переходе с лендинга сюда «съезжал» весь лист — это и
   читалось как разная ширина страниц. Поэтому рамка остаётся общей, а 760
   получают абзацы: левый край один и тот же на всех страницах сайта, а строка
   остаётся такой длины, какой её удобно читать. Тот же приём — у страницы
   модуля в shared/catalog.css. */
.prose {
  padding-top: 48px;
  padding-bottom: 24px;
  color: var(--text-secondary);
  font-size: 1rem;
  line-height: 1.7;
}

/* Ширина колонки и оглавление — общие правила `.with-toc` в tokens.css. */

.prose h1 {
  margin: 0 0 8px;
  font-size: 2rem;
  font-weight: 800;
  letter-spacing: -0.02em;
  color: var(--text-primary);
}

.prose h2 {
  margin: 36px 0 12px;
  font-size: 1.15rem;
  font-weight: 700;
  letter-spacing: -0.01em;
  color: var(--text-primary);
}

.prose p { margin: 0 0 14px; }

.prose ul,
.prose ol {
  margin: 0 0 14px;
  padding-left: 22px;
}

.prose li { margin-bottom: 10px; }

.prose b { color: var(--text-primary); font-weight: 600; }

/* Длинные строки без пробелов — адреса вроде myaccount.google.com/permissions —
   иначе распирают колонку на узком экране. */
.prose { overflow-wrap: break-word; }

/* Страница «не найдено». Тот же контейнер, что у правовых страниц: своя
   вёрстка ради одного экрана — лишняя сущность, которая разойдётся с общей. */
.notfound { padding-top: 80px; text-align: center; }
.notfound-code {
  margin: 0 0 8px;
  font-size: 4rem;
  font-weight: 800;
  line-height: 1;
  letter-spacing: -0.04em;
  color: var(--text-muted);
  opacity: 0.5;
}
.notfound-links { display: flex; justify-content: center; gap: 12px; flex-wrap: wrap; margin-top: 24px; }

@media (max-width: 640px) {
  .prose { padding-top: 32px; font-size: 0.95rem; }
  .prose h1 { font-size: 1.6rem; }
  .notfound { padding-top: 48px; }
  .notfound-code { font-size: 3rem; }
}