/* ══════════════════════════════════════════════════════════════════════
   КОПИЯ из лендинга: engrise_landing/landing2/docs.css (ветка
   landing/cinema-canvas-final). Лежит здесь, а не там, потому что
   юридические страницы обязан отдавать боевой домен — nginx этого
   репозитория, — и они должны открываться, даже когда лендинга ещё нет,
   а приложение лежит. Правки, нужные обеим сторонам, вносить в ОБА
   файла. Расхождения с оригиналом — .doc__state и .doc h3 ниже, оба
   помечены.

   Юридические страницы: оферта, политика, согласие на рассылку.
   Их читают, а не разглядывают, поэтому здесь нет ни одного украшения:
   одна колонка в 68 знаков, крупный межстрочник и честная нумерация,
   чтобы на пункт можно было сослаться. Шрифты общие с лендингом.
   Требование закона — свободный доступ: без скачивания, без регистрации,
   без модальных окон. Поэтому это обычный HTML, отдающийся по адресу.
   ══════════════════════════════════════════════════════════════════════ */
:root {
  --ink: #141414;
  --muted: #6B6660;
  --line: #14141416;
  --line-2: #1414142e;
  --field: #FAF8F4;
  --plate: #F4EFE6;
  --blue: #1B44EE;
  --coral: #FF6B4A;

  --display: 'Unbounded', system-ui, sans-serif;
  --text: 'Nunito', system-ui, -apple-system, sans-serif;
  --mono: 'JetBrains Mono', ui-monospace, Menlo, monospace;
}
* { box-sizing: border-box; }
html, body { margin: 0; padding: 0; }
body {
  background: #fff; color: var(--ink);
  font-family: var(--text); font-size: 16px; font-weight: 600; line-height: 1.62;
  -webkit-font-smoothing: antialiased;
}
.doc { max-width: 720px; margin: 0 auto; padding: clamp(28px, 6vw, 68px) clamp(20px, 5vw, 40px) clamp(40px, 8vw, 90px); }

/* ── шапка ── */
.doc__brand {
  display: inline-flex; align-items: center; gap: 8px;
  font-family: var(--mono); font-size: 11px; font-weight: 500;
  letter-spacing: .22em; text-transform: uppercase; color: var(--muted); text-decoration: none;
}
.doc__brand:hover { color: var(--ink); }
.doc__brand::before { content: '←'; letter-spacing: 0; }
.doc__h {
  margin: clamp(20px, 4vh, 34px) 0 0;
  font-family: var(--display); font-weight: 800;
  font-size: clamp(28px, 5.4vw, 44px); line-height: 1.05; letter-spacing: -.03em;
  text-wrap: balance;
  /* Расхождение с лендингом №3 — и это его баг, не наш: перенести правку
     обратно. На 360 px колонка 320 px, а «конфиденциальности» — одно слово
     в 18 знаков, в Unbounded при нижней границе clamp (28px) оно занимает
     ~410 px. Заголовок вылезал за экран и тянул за собой горизонтальный
     скролл ВСЕЙ страницы (замерено: documentElement.scrollWidth 430 при
     innerWidth 360; на остальных пяти документах ровно 360 — там просто
     нет такого длинного слова, поэтому глазами это не находится).
     `text-wrap: balance` здесь не помогает: он распределяет строки, а не
     разрывает слова. Уменьшать нижнюю границу clamp пришлось бы до 21px —
     это испортило бы все заголовки ради одного слова.
     hyphens впереди: если словарь переносов доступен, слово разорвётся по
     слогам; break-word — запасной вариант, срабатывает только когда слово
     иначе не помещается. */
  hyphens: auto;
  overflow-wrap: break-word;
}
.doc__meta {
  margin: 14px 0 0; font-family: var(--mono); font-size: 11px; font-weight: 500;
  letter-spacing: .1em; text-transform: uppercase; color: var(--muted);
}

/* Правила .doc__draft и .doc__todo сняты вместе с самими плашками:
   документы перешли из черновика в действующую редакцию, и место для
   пометок «не решено» в опубликованном договоре отсутствует по смыслу. */

/* Расхождение с лендингом №1. Плашка «что действует прямо сейчас»:
   документы опубликованы до открытия регистрации и оплаты, и без такой
   отметки они описывали бы обработку и договор, которых пока нет.
   Спокойная серая, а не тревожная: это действующая редакция, а не
   черновик, — красная .doc__draft у лендинга была именно про черновик и
   снята вместе с ним. Снимать эту плашку в день запуска, все пять
   страниц разом. */
.doc__state {
  margin: clamp(20px, 3vh, 30px) 0 0; padding: 16px 18px; border-radius: 14px;
  background: var(--field); border: 1px solid var(--line-2);
  font-size: 14.5px; line-height: 1.55;
}
.doc__state b { color: var(--ink); }

/* ── текст ── */
.doc__lead { margin: clamp(22px, 3.4vh, 34px) 0 0; font-size: 17px; color: var(--muted); }
.doc h2 {
  margin: clamp(30px, 4.6vh, 50px) 0 0;
  font-family: var(--display); font-weight: 700;
  font-size: clamp(18px, 2.6vw, 23px); line-height: 1.2; letter-spacing: -.02em;
}
.doc h2 b { color: var(--muted); font-weight: 700; margin-right: 10px; }
/* Расхождение с лендингом №2: там подразделов не было. В политике раздел
   3 разбит на «обрабатывается сейчас» и «после запуска». Заголовок
   намеренно текстовым шрифтом, а не Unbounded: подраздел не должен
   спорить по весу с разделом над ним. */
.doc h3 {
  margin: clamp(20px, 3vh, 28px) 0 0;
  font-size: 16px; font-weight: 800; letter-spacing: -.01em; color: var(--ink);
}
.doc p { margin: 12px 0 0; }
.doc ul { margin: 12px 0 0; padding-left: 22px; }
.doc li { margin: 6px 0 0; }
.doc a { color: var(--blue); text-decoration: none; border-bottom: 1px solid #1B44EE3d; }
.doc a:hover { border-bottom-color: currentColor; }

/* Место под будущий текст: заметное, чтобы не уехало в прод незаполненным. */
.tbd {
  display: inline-block; padding: 1px 8px; border-radius: 6px;
  background: #B4F227; color: #0A1B6E;
  font-family: var(--mono); font-size: .86em; font-weight: 500;
}
/* ── подвал ── */
.foot {
  margin-top: clamp(40px, 7vh, 80px); padding-top: clamp(20px, 3vh, 30px);
  border-top: 1px solid var(--line);
  font-size: 13px; font-weight: 600; color: var(--muted); line-height: 1.6;
}
.foot__links { display: flex; flex-wrap: wrap; gap: 8px 20px; }
.foot__links a { color: var(--ink); text-decoration: none; border-bottom: 1px solid var(--line-2); }
.foot__links a:hover { border-bottom-color: currentColor; }
.foot__req { margin: 14px 0 0; }
.foot__req span { white-space: nowrap; }

@media (prefers-reduced-motion: reduce) { * { transition: none !important; } }