/* Информационные статьи используют общую палитру, шрифт и контейнер сайта. */
.blog-reading { max-width: 880px; }
.blog-head { padding-bottom: var(--space-6); }
.blog-head h1 { max-width: 25ch; font-size: clamp(2rem, 4.5vw, 3.25rem); line-height: 1.15; overflow-wrap: anywhere; }
.blog-lead { max-width: 70ch; font-size: var(--fs-lg); line-height: var(--lh-relaxed); margin-top: var(--space-6); }
.blog-date, .blog-body figcaption { color: var(--color-fg-muted); font-size: var(--fs-sm); }
.blog-body { padding-bottom: var(--gt-layout-section, 48px); line-height: var(--lh-relaxed); }
.blog-body section { margin-top: var(--gt-layout-section, 48px); }
.blog-body p, .blog-body ul { margin-block: var(--space-4); }
.blog-body h2 { margin-bottom: var(--space-5); scroll-margin-top: 100px; }
.blog-body h3 { margin-top: var(--space-6); }
.blog-body ul, .blog-body ol { padding-left: var(--space-6); }
.blog-body li { margin-block: var(--space-2); }
.blog-body figure { margin-block: var(--space-8); }
.blog-body img, .blog-card img { width: 100%; height: auto; display: block; }
.blog-body figcaption { margin-top: var(--space-2); }
.blog-toc, .blog-contact { padding: var(--space-6); background: var(--color-bg-elev); border-left: 3px solid var(--color-accent); margin-block: var(--space-8); }
.blog-table { overflow-x: auto; margin-block: var(--space-6); }
.blog-table table { border-collapse: collapse; min-width: 660px; width: 100%; font-size: var(--fs-sm); line-height: var(--lh-normal); }
.blog-table caption { text-align: left; margin-bottom: var(--space-3); color: var(--color-fg-muted); }
.blog-table th, .blog-table td { padding: var(--space-4); text-align: left; vertical-align: top; border: 1px solid var(--color-border); }
.blog-table thead { background: var(--color-surface-dark); color: var(--color-fg-on-dark); }
.blog-table tbody th { width: 20%; }
.blog-sources { font-size: var(--fs-sm); overflow-wrap: anywhere; }
.blog-back { padding-block: var(--space-8); }
.blog-diagnosis { padding: var(--space-6); border: 1px solid var(--color-border); background: var(--color-bg-elev); }
.blog-diagnosis figcaption { margin: 0 0 var(--space-6); }
.blog-diagnosis figcaption strong { display: block; color: var(--color-fg); font-size: var(--fs-xl); margin-top: var(--space-2); }
.blog-diagnosis-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-5); }
.blog-diagnosis-grid > div { border-top: 3px solid var(--color-accent); padding-top: var(--space-4); }
.blog-step { font-size: var(--fs-xs); font-family: var(--font-mono); color: var(--color-fg-muted); }
.blog-diagnosis-grid h3 { margin-top: var(--space-3); font-size: var(--fs-md); line-height: var(--lh-tight); }
.blog-diagnosis-grid p { font-size: var(--fs-sm); line-height: var(--lh-normal); }
.blog-arrow { display: block; font-size: var(--fs-xl); color: var(--color-accent-strong); }
.blog-result { font-weight: var(--fw-semibold); }
.blog-diagnosis-note { font-size: var(--fs-xs); color: var(--color-fg-muted); border-top: 1px solid var(--color-border); padding-top: var(--space-4); }
@media (max-width: 640px) { .blog-diagnosis-grid { grid-template-columns: 1fr; } .blog-diagnosis { padding: var(--space-4); } }
.blog-cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 360px), 600px)); gap: var(--space-8); }
.blog-card { border: 1px solid var(--color-border); }
.blog-card-body { padding: var(--space-6); }
.blog-card h2 { margin-block: var(--space-4); font-size: var(--fs-xl); line-height: var(--lh-tight); }
.blog-card p { margin-bottom: var(--space-5); }
@media (max-width: 480px) { .blog-lead { font-size: var(--fs-md); } .blog-toc, .blog-contact { padding: var(--space-4); } }