/*
 * Блок doc (blocks/doc.php): статья или документ — колонка ~ 820px, оглавление в рамке, заголовки разделов,
 * списки с синими маркерами (нумерованные — синими цифрами).
 */

.doc__in { max-width: 860px; }
.doc__updated { margin-bottom: 20px; color: var(--c-muted); font-size: 15px; }
.doc__toc { margin-bottom: 40px; padding: 26px 30px; border: 1px solid var(--c-line); border-radius: 20px; background: #f7faff; }
.doc__toc-title { margin-bottom: 10px; color: var(--c-ink); font-size: 18px; font-weight: 700; }
.doc__toc ol { display: grid; gap: 6px; padding-left: 22px; list-style: decimal; color: var(--c-muted); }
.doc__toc a { color: var(--c-primary); }
.doc__toc a:hover { text-decoration: underline; text-underline-offset: 3px; }

.doc__body { color: var(--c-text); font-size: 18px; line-height: 1.75; }
.doc__body h2 { margin: 44px 0 16px; color: var(--c-ink); font-size: 30px; font-weight: 700; line-height: 1.2; letter-spacing: -.025em; scroll-margin-top: 110px; }
.doc__body h2:first-child { margin-top: 0; }
.doc__body p + p { margin-top: 16px; }
.doc__body p + ul, .doc__body p + ol, .doc__body ul + p, .doc__body ol + p { margin-top: 16px; }
.doc__body ul, .doc__body ol { display: grid; gap: 10px; }
.doc__body ul li { position: relative; padding-left: 26px; }
.doc__body ul li::before { content: ""; position: absolute; top: .72em; left: 2px; width: 8px; height: 8px; border-radius: 50%; background: var(--c-primary); }
.doc__body ol { counter-reset: doc; }
.doc__body ol li { position: relative; padding-left: 34px; counter-increment: doc; }
.doc__body ol li::before { content: counter(doc) "."; position: absolute; left: 0; color: var(--c-primary); font-weight: 700; }
.doc__body a { color: var(--c-primary); text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 3px; }

@media (max-width: 640px) {
    .doc__toc { padding: 20px; }
    .doc__body { font-size: 16px; line-height: 1.7; }
    .doc__body h2 { margin-top: 34px; font-size: 22px; }
}