.blog-filter { display:flex; flex-wrap:wrap; gap:.5rem; margin:2rem 0 2.5rem; }
.blog-filter__btn { padding:.4rem 1rem; border-radius:50px; border:1.5px solid rgba(0,67,124,.2);
  background:white; color:var(--navy); font-size:.82rem; font-weight:600; cursor:pointer;
  transition:all .2s; font-family:inherit; }
.blog-filter__btn:hover { border-color:var(--sky); color:var(--sky); }
.blog-filter__btn.active { background:var(--navy); border-color:var(--navy); color:white; }

.post-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1.5rem; }
.post-grid .card:hover { border-color:rgba(10,179,235,.3); }
.post-grid .card.hidden { display:none; }
.post-grid .card__body { gap:.5rem; }
.post-grid .card__tag { margin-bottom:0; }
.post-grid .card__body h3 { font-size:.97rem; line-height:1.35; margin:0; }
.post-grid .card__body h3 a { color:var(--navy); text-decoration:none; }
.post-grid .card__body h3 a:hover { color:var(--sky); }
.post-grid .card__body p { font-size:.83rem; margin:0; }

.pagination { display:flex; gap:.5rem; justify-content:center; margin-top:3rem; flex-wrap:wrap; }
.pagination a, .pagination span { padding:.4rem .85rem; border-radius:8px; font-size:.85rem;
  font-weight:600; text-decoration:none; border:1.5px solid rgba(0,67,124,.15);
  color:var(--navy); transition:all .2s; }
.pagination a:hover { background:var(--navy); color:white; border-color:var(--navy); }
.pagination .current { background:var(--sky); color:white; border-color:var(--sky); }
.pagination .disabled { opacity:.4; pointer-events:none; }

.no-posts { text-align:center; padding:4rem 2rem; color:var(--mid); display:none; }
.no-posts.visible { display:block; }

@media(max-width:900px){ .post-grid{ grid-template-columns:1fr 1fr; } }
@media(max-width:600px){ .post-grid{ grid-template-columns:1fr; } }