/*
 * С4 «Политика конфиденциальности» (privacy.html) и С5 «Согласие на обработку персональных данных» (consent.html).
 * Макета нет: текстовая страница в стиле служебных страниц (service.css), плашка-заглушка — как алерт «Внимание» ДС 12.2
 * (жёлтого цвета в токенах нет: контурная плашка с полосой акцента слева, как «меньше 2 часов» на 07).
 * Цвета, шрифты, размеры текста и отступы — только переменные из tokens.css.
 * Числа без переменных — ширина колонки текста и толщины линий.
 */

.doc { max-width: 760px; display: flex; flex-direction: column; gap: var(--space-6); padding-top: var(--space-12); padding-bottom: var(--space-24); }
.doc__head { display: flex; flex-direction: column; gap: var(--space-3); }
.doc__kicker { font: 600 var(--text-overline-size)/1 var(--font-mono); letter-spacing: var(--text-overline-tracking); color: var(--color-text-muted); }
.doc__title { font: 700 var(--text-h2-size)/var(--text-h2-line) var(--font-mono); letter-spacing: var(--text-h1-tracking); }
.doc__meta { font: 400 var(--text-body-s-size)/var(--text-body-s-line) var(--font-sans); color: var(--color-text-secondary); }

.doc__stub, .doc__back {
  display: flex;
  align-items: flex-start;
  gap: var(--space-3);
  padding: var(--space-4);
  border: 1px solid var(--color-border-strong);
  border-left: 4px solid var(--color-accent);
  font: 400 var(--text-body-s-size)/var(--text-body-s-line) var(--font-sans);
  color: var(--color-text-secondary);
}
.doc__stub b, .doc__back b { color: var(--color-text-primary); font-weight: 600; }
.doc__stub > .icon { color: var(--color-accent-text); }
.doc__back { border-left-color: var(--color-text-primary); }

.doc__body { display: flex; flex-direction: column; gap: var(--space-8); }
.doc__section { display: flex; flex-direction: column; gap: var(--space-3); }
.doc__section h2 { font: 700 var(--text-h4-size)/var(--text-h4-line) var(--font-mono); }
.doc__section p, .doc__section li { font: 400 var(--text-body-size)/var(--text-body-line) var(--font-sans); color: var(--color-text-secondary); }
.doc__section ul { margin: 0; padding-left: var(--space-6); display: flex; flex-direction: column; gap: var(--space-2); }
.doc__section a { color: var(--color-accent-text); text-decoration: underline; text-underline-offset: 3px; }
.doc__section b { color: var(--color-text-primary); font-weight: 600; }
/* Место, которое заполнит заказчик: «[ИНН]», «[дата]». */
.doc__gap { font: 500 var(--text-body-s-size)/1 var(--font-mono); color: var(--color-accent-text); }

.doc__actions { display: flex; flex-wrap: wrap; gap: var(--space-3); padding-top: var(--space-6); border-top: 1px solid var(--color-border); }

@media (max-width: 767px) {
  .wrap { padding: 0 var(--space-4); }
  .doc { padding-top: var(--space-6); padding-bottom: var(--space-16); gap: var(--space-5); }
  .doc__title { font-size: var(--text-h2-size-mobile); }
  .doc__section h2 { font-size: var(--text-h4-size-mobile); }
  .doc__actions { flex-direction: column; }
}