/* blog.css — blog list and article pages */
.cat-head{display:flex;align-items:center;gap:1rem}
.cat-ic{width:56px;height:56px;flex:none;border-radius:16px;display:grid;place-items:center;font-size:1.6rem;color:#fff;background:linear-gradient(135deg,var(--accent),var(--accent-2))}
.cat-title{font-size:clamp(1.3rem,3vw,1.8rem);font-weight:800;margin:0 0 .2rem}
.toolbar .search-box{max-width:none;padding-block:.15rem}

.blog-card{position:relative;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;height:100%;transition:border-color .2s,transform .2s}
.blog-card:hover{border-color:var(--accent);transform:translateY(-3px)}
.blog-img{aspect-ratio:16/9;background-size:cover;background-position:center}
.blog-title{font-size:1rem;font-weight:700;line-height:1.7;margin:0 0 .4rem}
.blog-meta{display:flex;gap:1rem;font-size:.75rem;color:var(--muted)}
.blog-meta i{margin-inline-end:.25rem}

.article-title{font-size:clamp(1.5rem,3.5vw,2.1rem);font-weight:800;line-height:1.6}
.cover{aspect-ratio:21/9;max-height:260px;width:100%;border-radius:var(--radius);border:1px solid var(--line);background-size:cover;background-position:center}
.article{margin-top:1.5rem}
.article h2{font-size:1.25rem;font-weight:800;margin:2rem 0 .8rem}
.article p{line-height:2.1;color:var(--text);margin-bottom:1rem}
.article .note{border-inline-start:3px solid var(--accent);background:var(--surface);padding:.9rem 1rem;border-radius:10px;color:var(--muted);margin:1.2rem 0;line-height:1.9}
.article .note i{color:var(--gold);margin-inline-end:.3rem}