/* Правовые страницы: политика, согласие, условия использования.
   Задача «публикация правовых документов», 28.09.2026 (vm-frontend).

   Своих цветов здесь нет ни одного. Палитра живёт только в web/brand/theme.css
   (единственный источник токенов, память `single-source-theme-tokens`), а каркас,
   шапка, подвал, кнопки и таблицы приходят из landing.css — страницы подключают оба
   файла в том же порядке, что и витрина. Здесь остаётся ровно то, чего у витрины нет:
   типографика длинного документа, который читают подряд и печатают.

   Почему документ, а не раздел витрины. Ст. 18.1 ч. 2 152-ФЗ требует публикации
   документа, а ст. 9 ч. 1 — оформления согласия отдельно от иных подтверждаемых
   документов. Три отдельные страницы по постоянным адресам — это и есть исполнение
   обеих норм; одна страница с тремя якорями исполнила бы только первую. */

/* ---------- полотно документа ----------
   Ширина колонки задана в знаках, а не в пикселях: длинную юридическую фразу читают
   глазами, и строка длиннее ~75 знаков теряется при переходе на следующую. */
.doc{padding:40px 0 64px}
.doc .wrap{max-width:74ch}
/* Заголовок документа тише, чем заголовок витрины: там обещание, здесь название
   документа. Витринный clamp(30px,6.4vw,54px) на правовой странице выглядел вывеской. */
.doc h1{font-size:clamp(23px,4.2vw,34px);margin:0 0 6px;max-width:26ch}
.doc h2{font-size:clamp(18px,2.6vw,23px);max-width:none;margin:34px 0 10px;
  padding-top:14px;border-top:1px solid var(--rule-soft)}
.doc h2:first-of-type{border-top:0;padding-top:0}
.doc h3{font-family:var(--f-display);font-weight:500;font-size:16.5px;letter-spacing:.01em;
  margin:22px 0 8px}
.doc p{margin:0 0 12px}
.doc ul,.doc ol{margin:0 0 14px;padding-left:22px}
.doc li{margin:0 0 6px}
.doc strong,.doc b{color:var(--ink)}
.doc code{font-family:var(--f-mono);font-size:.92em;background:var(--surface-2);
  border:1px solid var(--rule-soft);border-radius:var(--r-s);padding:1px 5px;
  /* Адрес почты и путь не обязаны влезать в 375 пикселей целиком: перенос внутри
     слова дешевле горизонтальной прокрутки всей страницы. */
  overflow-wrap:anywhere}
.doc a{overflow-wrap:anywhere}

/* ---------- шапка документа: редакция, дата, идентификатор ----------
   Идентификатор редакции виден человеку намеренно. Служба пишет в запись о согласии
   строку версии (`vm.config` → `consent_privacy_version`), и ст. 9 ч. 3 152-ФЗ
   возлагает доказывание согласия на оператора: номер, не указывающий ни на какой
   опубликованный текст, доказательством не является. Значит номер обязан стоять на
   самом тексте, а не только в базе. */
.docmeta{background:var(--surface);border:1px solid var(--rule-soft);border-radius:var(--r);
  padding:14px 16px;margin:0 0 26px;font-size:13px;color:var(--ink-2)}
.docmeta dl{display:grid;grid-template-columns:auto minmax(0,1fr);gap:4px 14px;margin:0}
.docmeta dt{color:var(--ink-3);white-space:nowrap}
.docmeta dd{margin:0;color:var(--ink)}
.docmeta .ver{font-family:var(--f-mono);font-size:12.5px}

/* ---------- ключ-значение: таблицы «Цель / Основание / Перечень данных» ----------
   В источнике это двухколоночные таблицы. На узком экране таблица с длинным значением
   в ячейке — первая причина горизонтальной прокрутки, поэтому ниже 560 пикселей она
   раскладывается в два ряда: подпись сверху, значение под ней. Прокрутки не остаётся
   вовсе — в отличие от обёртки .scroll, которая её лишь прячет внутрь рамки. */
.kv{width:100%;border-collapse:collapse;background:var(--surface);font-size:13.5px;
  border:1px solid var(--rule-soft);margin:0 0 18px}
.kv th,.kv td{text-align:left;padding:10px 13px;border-bottom:1px solid var(--rule-soft);
  vertical-align:top}
.kv tr:last-child th,.kv tr:last-child td{border-bottom:0}
.kv th{font-weight:600;color:var(--ink-2);width:30%;min-width:150px}
.kv td{color:var(--ink)}
@media (max-width:560px){
  .kv,.kv tbody,.kv tr,.kv th,.kv td{display:block;width:auto;min-width:0}
  .kv tr{border-bottom:1px solid var(--rule-soft);padding:4px 0}
  .kv tr:last-child{border-bottom:0}
  .kv th{border-bottom:0;padding:9px 13px 0;font-size:12px;letter-spacing:.06em;
    text-transform:uppercase;color:var(--ink-3)}
  .kv td{border-bottom:0;padding:2px 13px 9px}
}
/* Таблица получателей — три колонки, сжимать нечего: отдаётся в .scroll из landing.css. */

/* ---------- переход между тремя документами ----------
   Три документа связаны: согласие ссылается на политику, условия — на оба. Человек,
   открывший один из них по ссылке от галочки, обязан видеть остальные без возврата. */
.docnav{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 28px}
.docnav a,.docnav span{display:inline-flex;align-items:center;min-height:36px;
  padding:7px 12px;border:1px solid var(--edge-quiet);border-radius:var(--r-s);
  font-size:13px;text-decoration:none;color:var(--ink-2);background:var(--surface)}
.docnav a:hover{border-color:var(--accent);color:var(--accent)}
.docnav [aria-current="page"]{background:var(--surface-3);color:var(--ink);
  border-color:var(--edge);font-weight:600}

/* ---------- концовка ---------- */
.docend{margin-top:34px;padding-top:16px;border-top:1px solid var(--rule);
  font-size:12.5px;color:var(--ink-2)}

/* ---------- печать ----------
   Документ печатают и прикладывают к делу: на бумаге не нужны ни шапка, ни подвал, ни
   выбор темы, а адрес каждой ссылки нужен — иначе распечатка теряет то, на что текст
   ссылается. Фон печатаем белым независимо от выбранной темы. */
@media print{
  .topbar,footer,.docnav,.skip{display:none !important}
  html,body{background:#fff;color:#000}
  .doc{padding:0}
  .doc .wrap{max-width:none;padding:0}
  .doc a{color:#000;text-decoration:underline}
  .doc a[href^="http"]::after,.doc a[href^="/"]::after{content:" (" attr(href) ")";
    font-size:.85em;color:#333}
  .kv,.docmeta{border-color:#999;background:#fff}
  .doc h2{page-break-after:avoid}
  .kv tr{page-break-inside:avoid}
}

/* Шапка правовой страницы: полосы якорей у неё нет (документ читают подряд, а не
   прыжками), а именно `.topnav` прижимала правую группу к краю через margin-left:auto.
   Без неё выбор темы и кнопка уезжали к логотипу. */
.topbar .topact{margin-left:auto}