/* =========================================================
   Правовые документы: политика и согласие.
   Дополняет style.css — токены, кнопки и футер оттуда.
   Все отступы кратны 4.
   ========================================================= */

.doc-page { background: var(--bg); color-scheme: dark; }

/* ——— шапка ——— */
.dhead {
  border-bottom: 1px solid var(--hair);
  background: rgba(10, 10, 11, 0.9);
  backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px);
  position: sticky; top: 0; z-index: 30;
}
.dhead__in { display: flex; align-items: center; gap: 16px; padding-block: 16px; }
.dhead__back { margin-left: auto; font-size: 14px; color: var(--muted); }
.dhead__back:hover { color: var(--text); }

/* ——— полотно ——— */
.doc { max-width: 760px; padding-block: 48px 96px; }
.doc__eyebrow {
  font-size: 12px; letter-spacing: 0.1em; text-transform: uppercase;
  color: var(--orange-2); margin-bottom: 12px;
}
.doc__title {
  font-family: var(--font-display); font-weight: 700; line-height: 1.15;
  font-size: 32px; margin-bottom: 16px;
}
.doc__meta {
  display: flex; flex-wrap: wrap; gap: 4px 16px;
  font-size: 13px; color: var(--dim); padding-bottom: 32px;
  border-bottom: 1px solid var(--hair);
}

/* ——— содержание ——— */
.doc__toc { padding: 20px 24px; margin-block: 32px; background: var(--surface); border-radius: var(--r-md); }
.doc__toc h2 { font-family: var(--font-display); font-size: 13px; font-weight: 600; margin-bottom: 12px; }
.doc__toc ol { display: grid; gap: 8px; counter-reset: toc; font-size: 14px; }
.doc__toc li { counter-increment: toc; color: var(--muted); }
.doc__toc li::before { content: counter(toc) '. '; color: var(--dim); }
.doc__toc a:hover { color: var(--orange-2); }

/* ——— текст ——— */
.doc section { padding-top: 40px; scroll-margin-top: 88px; }
.doc h2 {
  font-family: var(--font-display); font-weight: 600; font-size: 19px;
  line-height: 1.3; margin-bottom: 16px;
}
.doc h2 span { color: var(--dim); font-weight: 400; margin-right: 4px; }
.doc h3 { font-size: 16px; font-weight: 600; margin: 24px 0 12px; }
.doc p { font-size: 15px; line-height: 1.6; color: var(--muted); margin-bottom: 12px; }
.doc p:last-child { margin-bottom: 0; }
.doc a { color: var(--orange-2); text-decoration: underline; text-underline-offset: 3px; }
.doc a:hover { color: var(--orange); }
.doc b, .doc strong { color: var(--text); font-weight: 500; }

.doc ul, .doc ol.doc__num { display: grid; gap: 8px; margin-bottom: 16px; }
.doc ul li, .doc ol.doc__num li {
  position: relative; padding-left: 20px;
  font-size: 15px; line-height: 1.55; color: var(--muted);
}
.doc ul li::before {
  content: ''; position: absolute; left: 4px; top: 10px;
  width: 4px; height: 4px; border-radius: 50%; background: var(--orange);
}
.doc ol.doc__num { counter-reset: item; padding-left: 0; }
.doc ol.doc__num li { counter-increment: item; padding-left: 28px; }
.doc ol.doc__num li::before {
  content: counter(item) ')'; position: absolute; left: 0; top: 0;
  color: var(--dim); font-size: 14px;
}

/* ——— реквизиты и выноски ——— */
.doc__card {
  padding: 20px 24px; margin-block: 16px;
  background: var(--surface); border: 1px solid var(--hair); border-radius: var(--r-md);
}
.doc__card dl { display: grid; grid-template-columns: 200px 1fr; gap: 8px 20px; font-size: 15px; }
.doc__card dt { color: var(--dim); }
.doc__card dd { margin: 0; color: var(--text); overflow-wrap: anywhere; }

.doc__note {
  padding: 16px 20px; margin-block: 16px;
  border-left: 2px solid var(--orange); background: rgba(255, 90, 31, 0.06);
  border-radius: 0 var(--r-md) var(--r-md) 0;
}
.doc__note p { color: var(--text); margin-bottom: 0; font-size: 14px; }

/* незаполненное место — видно и в вёрстке, и на странице */
.doc__todo {
  display: inline-block; padding: 2px 8px; border-radius: 4px;
  background: rgba(255, 77, 77, 0.16); color: #ffb3b3;
  font-size: 14px; font-weight: 500;
}

.doc__updated { margin-top: 48px; padding-top: 24px; border-top: 1px solid var(--hair); font-size: 13px; color: var(--dim); }

@media (max-width: 640px) {
  .doc { padding-block: 32px 64px; }
  .doc__title { font-size: 25px; }
  .doc section { padding-top: 32px; }
  .doc h2 { font-size: 17px; }
  .doc p, .doc ul li, .doc ol.doc__num li { font-size: 14px; }
  .doc__card { padding: 16px; }
  .doc__card dl { grid-template-columns: 1fr; gap: 2px; }
  .doc__card dt { margin-top: 8px; }
  .doc__toc { padding: 16px; }
}