/* 블로그 카드 — 홈·진료·허브 공통 */
.blog-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-lg)}
.blog-card{display:flex;flex-direction:column;background:#fff;border:1px solid var(--color-line);border-radius:var(--radius-card);overflow:hidden;box-shadow:var(--shadow-soft);transition:transform .3s var(--ease-out),box-shadow .3s var(--ease-out);height:100%}
.blog-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-lift)}
.blog-card-thumb{aspect-ratio:4/3;background:var(--color-paper-2);overflow:hidden}
.blog-card-thumb img{width:100%;height:100%;object-fit:cover;object-position:top;transition:transform .5s var(--ease-out)}
.blog-card:hover .blog-card-thumb img{transform:scale(1.04)}
.blog-card-body{padding:var(--space-lg);display:flex;flex-direction:column;flex:1}
.blog-card-meta{display:flex;gap:6px;align-items:center;font-size:var(--text-xs);color:var(--color-muted);margin-bottom:8px;flex-wrap:wrap}
.blog-card-cat{background:var(--color-paper-2);color:var(--color-ink);font-weight:700;padding:2px 10px;border-radius:999px}
.blog-card-species{background:var(--color-paper-3);color:var(--color-accent-2-text);font-weight:700;padding:2px 10px;border-radius:999px}
.blog-card-title{font-size:1.06rem;line-height:1.45;margin:0 0 8px;font-weight:700}
.blog-card-excerpt{font-size:var(--text-sm);color:var(--color-ink-2);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;margin:0}
.blog-card-date{margin-top:auto;padding-top:var(--space-sm);font-size:var(--text-xs);color:var(--color-muted);font-family:var(--font-label)}
.blog-filter{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:var(--space-lg)}
.blog-filter button{padding:8px 18px;border-radius:999px;border:1px solid var(--color-line);background:#fff;font-weight:600;font-size:var(--text-sm);color:var(--color-ink)}
.blog-filter button[aria-pressed="true"]{background:var(--color-ink);border-color:var(--color-ink);color:#fff}
.blog-search{display:flex;align-items:center;gap:8px;background:#fff;border:1px solid var(--color-line);border-radius:999px;padding:4px 6px 4px 18px;max-width:420px;margin-bottom:var(--space-md)}
.blog-search input{flex:1;border:0;outline:0;font:inherit;background:none;padding:8px 0}
.blog-empty{padding:var(--space-2xl);text-align:center;color:var(--color-muted)}
@media (max-width:960px){.blog-grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:560px){.blog-grid{grid-template-columns:1fr}}