/* Документы Envoy: политика конфиденциальности и пользовательское соглашение.
   Токены, шрифт, шапка и кнопки из landing.css. На компьютере оглавление слева (липкое), текст справа колонкой ~68 знаков;
   до 1023 px оглавление над текстом. Подвал тёмный, как у лендинга. */

.head .wrap { justify-content: space-between; }
.head .head-cta { display: inline-flex; }

.legal { padding-block: calc(var(--head) + 56px) 96px; }
.legal .grid { align-items: start; row-gap: 40px; }
.legal-title { grid-column: 5 / 13; }
.legal-h1 { font-size: var(--fs-h2); line-height: 1.08; font-weight: 620; letter-spacing: -0.02em; max-width: 18ch; }
.legal-date { margin-top: 16px; font-size: 15px; line-height: 1.45; color: var(--graphite); }

/* Оглавление: номера по порядку, текущий раздел при переходе по якорю тёмный */
.toc { grid-column: 1 / 4; grid-row: 1 / span 2; position: sticky; top: calc(var(--head) + 32px); }
.toc-h { font-size: 14px; line-height: 1.45; font-weight: 600; }
.toc ol { margin: 12px 0 0; padding: 0; list-style: none; counter-reset: toc; }
.toc li { counter-increment: toc; }
.toc a {
  display: flex; gap: 10px; min-height: 32px; align-items: center; border-radius: var(--r-sm);
  font-size: 15px; line-height: 1.3; color: var(--graphite); text-decoration: none;
  transition: color var(--t-hover) var(--ease);
}
.toc a::before { content: counter(toc); flex: none; width: 20px; font-variant-numeric: tabular-nums; }
@media (hover: hover) and (pointer: fine) { .toc a:hover { color: var(--ink); } }

/* Текст документа */
.doc { grid-column: 5 / 13; max-width: 68ch; }
.doc section { scroll-margin-top: calc(var(--head) + 24px); }
.doc section + section { margin-top: 48px; }
.doc h2 { font-size: 22px; line-height: 1.3; font-weight: 600; letter-spacing: -0.01em; }
.doc p, .doc ul, .doc dl { margin: 12px 0 0; }
.doc ul { padding-left: 22px; }
.doc li + li { margin-top: 6px; }
.doc li::marker { color: var(--graphite); }
.doc a { text-underline-offset: 3px; text-decoration-thickness: 1px; border-radius: 2px; }
@media (hover: hover) and (pointer: fine) { .doc a:hover { text-decoration-thickness: 2px; } }
.doc-dl dt { margin-top: 16px; font-weight: 600; }
.doc-dl dd { margin: 4px 0 0; }
.doc-act { padding-top: 8px; }
.doc-contacts { display: flex; flex-wrap: wrap; gap: 8px 32px; font-size: 20px; line-height: 1.4; font-weight: 600; }
.doc-contacts a { text-decoration: none; font-variant-numeric: tabular-nums; }
@media (hover: hover) and (pointer: fine) { .doc-contacts a:hover { text-decoration: underline; } }

/* Подвал: знак, ссылки на оба документа, копирайт */
.legal-foot { padding-block: 48px calc(48px + env(safe-area-inset-bottom, 0px)); }
.legal-foot .wrap { display: flex; flex-wrap: wrap; align-items: center; gap: 16px 40px; }
.legal-foot .logo { color: var(--hall-text); }
.legal-foot-links { display: flex; flex-wrap: wrap; gap: 4px 24px; }
.legal-foot-links a { display: inline-flex; align-items: center; min-height: 44px; border-radius: var(--r-sm); font-size: 15px; color: var(--hall-small); text-underline-offset: 4px; }
.legal-foot-links a[aria-current="page"] { color: var(--hall-text); text-decoration: none; }
.legal-foot-c { margin-left: auto; font-size: 14px; line-height: 1.45; color: var(--hall-small); }

@media (max-width: 1023px) {
  .legal-title, .toc, .doc { grid-column: 1 / -1; }
  .toc { grid-row: auto; position: static; padding-bottom: 24px; border-bottom: 1px solid var(--paper-line); }
}
@media (max-width: 767px) {
  .head .head-cta { display: none; }
  .legal { padding-block: calc(var(--head) + 32px) 72px; }
  .legal .grid { row-gap: 28px; }
  .doc section + section { margin-top: 40px; }
  .doc h2 { font-size: 20px; }
  .legal-foot-c { margin-left: 0; }
}