.blog-intro { max-width: 800px; margin: 28px auto 44px; text-align: center; }
.blog-intro h1 { font-size: clamp(2rem, 5vw, 3.5rem); letter-spacing: -.04em; }
.blog-intro p, .blog-date, .blog-card time { color: var(--av-muted); }
.blog-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; }
.blog-card { display: flex; flex-direction: column; min-width: 0; background: #fff; border: 1px solid var(--av-line); border-radius: 16px; padding: 28px; box-shadow: var(--av-shadow); }
.blog-card h2 { font-size: 1.35rem; margin: 16px 0; overflow-wrap: anywhere; }
.blog-card h2 a { color: var(--av-ink); }
.blog-card p { color: var(--av-muted); overflow-wrap: anywhere; }
.blog-read { margin-top: auto; font-weight: 700; }
.blog-article { max-width: 860px; margin: 20px auto; padding: clamp(24px, 5vw, 56px); background: #fff; border: 1px solid var(--av-line); border-radius: 18px; }
.blog-back { display: inline-block; margin-bottom: 32px; }
.blog-article h1 { font-size: clamp(2rem, 4vw, 3rem); letter-spacing: -.03em; overflow-wrap: anywhere; }
.blog-lead { font-size: 1.2rem; color: var(--av-muted); line-height: 1.8; margin-bottom: 32px; overflow-wrap: anywhere; }
.blog-content { line-height: 1.9; overflow-wrap: anywhere; }
.blog-content h2, .blog-content h3, .blog-content h4 { margin: 32px 0 16px; }
.blog-content img { max-width: 100%; height: auto; border-radius: 12px; }
.blog-content pre { overflow: auto; padding: 20px; background: #f5f6f8; border-radius: 10px; }
.blog-content blockquote { border-left: 4px solid var(--av-red); margin: 24px 0; padding: 12px 24px; background: #fff4f4; }
.blog-content table { display: block; max-width: 100%; overflow-x: auto; border-collapse: collapse; }
.blog-content th, .blog-content td { border: 1px solid var(--av-line); padding: 10px; }
.blog-tags { display: flex; flex-wrap: wrap; gap: 8px; border-top: 1px solid var(--av-line); margin-top: 32px; padding-top: 24px; }
#blog-editor-form .ck-editor__editable { min-height: 360px; max-height: 800px; }
#blog-editor-form fieldset { border-top: 1px solid var(--av-line); margin: 28px 0; padding-top: 20px; }
@media (max-width: 991px) { .blog-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 575px) { .blog-grid { grid-template-columns: 1fr; } }