.blog-main{padding:2.5rem 0 3rem}
.blog-hero h1{font-size:clamp(1.75rem,3vw,2.25rem);font-weight:700;letter-spacing:-.02em;color:#0f172a}
.blog-hero p{margin-top:.5rem;color:#64748b;font-size:.95rem}
.blog-list{list-style:none;margin:1.25rem 0 0;padding:0;display:grid;gap:.875rem}
.blog-card{display:block;background:#fff;border:1px solid #e2e8f0;border-radius:.75rem;padding:1.1rem 1.25rem;color:#0f172a;text-decoration:none;transition:border-color .15s,box-shadow .15s}
.blog-card:hover{border-color:#bfdbfe;box-shadow:0 8px 24px rgba(30,64,175,.08);text-decoration:none}
.blog-card-title{font-size:1.05rem;font-weight:600;line-height:1.45}
.blog-card-meta{margin-top:.4rem;font-size:.8125rem;color:#64748b}
.blog-empty{color:#64748b;padding:2rem 0}
.article-main{padding:2rem 0 3rem}
.article-crumb{font-size:.8125rem;color:#64748b;margin-bottom:1rem}
.article-crumb a{color:#64748b;text-decoration:none}
.article-crumb a:hover{color:#1d4ed8}
.article-panel{background:#fff;border:1px solid #e2e8f0;border-radius:.75rem;padding:clamp(1.25rem,3vw,2.25rem);box-shadow:0 8px 28px rgba(15,23,42,.04)}
.article-meta{font-size:.8125rem;color:#64748b;margin-bottom:.6rem}
.article-panel>h1{font-size:clamp(1.4rem,3vw,2rem);line-height:1.35;margin:0 0 1.25rem;letter-spacing:-.02em;color:#0f172a}
.article-cover{display:block;width:100%;max-height:420px;object-fit:cover;border-radius:.75rem;margin:0 0 1.5rem;background:#eff6ff}
.article-content h2{font-size:1.25rem;margin:2rem 0 .75rem;padding-top:.75rem;border-top:1px solid #e2e8f0;line-height:1.4;color:#0f172a}
.article-content h2:first-child{border-top:0;padding-top:0;margin-top:0}
.article-content h3{font-size:1.05rem;margin:1.35rem 0 .55rem}
.article-content p,.article-content li{margin:0 0 .85rem;font-size:1rem;color:#334155;line-height:1.75}
.article-content ul,.article-content ol{margin:0 0 1rem;padding-left:1.35em}
.article-content strong{color:#0f172a;font-weight:650}
.article-content a{color:#1d4ed8;word-break:break-all}
.article-content blockquote{margin:1rem 0;padding:.75rem 1rem;border-left:3px solid #1d4ed8;background:#eff6ff;color:#64748b}
.nav-blog-active{color:#1d4ed8!important}
@media (max-width:640px){.article-panel{border-radius:0;border-left:0;border-right:0;box-shadow:none}}