.articles-top{ padding:56px 0 0; }
.articles-top h1{ font-size:clamp(1.9rem,3.4vw,2.6rem); max-width:760px; }

.filter-bar{ display:flex; gap:10px; flex-wrap:nowrap; overflow-x:auto; margin-top:30px; padding-bottom:4px; }
.filter-bar::-webkit-scrollbar{ height:6px; }
.filter-bar::-webkit-scrollbar-thumb{ background:rgba(143,124,255,.3); border-radius:999px; }
.filter-chip{
  background:var(--void-2); border:1px solid var(--line); color:var(--star-500);
  padding:.55em 1.2em; border-radius:999px; font-size:.85rem; cursor:pointer;
  transition:all .3s;
}
.filter-chip:hover{ color:var(--star-100); border-color:rgba(143,124,255,.5); }
.filter-chip.active{ background:var(--mass-violet); border-color:var(--mass-violet); color:#fff; }

.section-gap-sm{ margin-top:50px; }

.article-grid{
  display:grid; grid-template-columns:repeat(3, minmax(0, 1fr)); gap:22px;
}
.a-card{
  background:var(--grad-panel); border:1px solid var(--line); border-radius:var(--radius-md);
  padding:20px; display:flex; flex-direction:column; gap:10px; min-height:0;
  transition:border-color .35s, transform .35s; overflow:hidden;
}
.a-card:not(.ad-native):hover{ border-color:rgba(143,124,255,.5); }
.a-card-photo{ aspect-ratio:16/9; margin:-20px -20px 0; border-radius:var(--radius-md) var(--radius-md) 0 0; }
.a-card h3{ font-size:1.05rem; margin:0; }
.a-card p{ font-size:.85rem; color:var(--star-500); margin:0; flex:1; }
.ad-native{ padding:0; align-items:center; justify-content:center; background:transparent; border:none; }
.ad-native .ad-slot{ width:100%; height:100%; min-height:190px; }

@media (max-width:980px){ .article-grid{ grid-template-columns:1fr 1fr; } }
@media (max-width:620px){ .article-grid{ grid-template-columns:1fr; } }

/* Pagination */
.pagination{ display:flex; gap:10px; justify-content:center; align-items:center; margin:60px auto; }
.page-dot{
  width:40px; height:40px; border-radius:50%;
  background:var(--void-2); border:1px solid var(--line); color:var(--star-300);
  cursor:pointer; font-family:var(--font-mono); font-size:.85rem;
}
.page-dot.active{ background:var(--event-cyan); color:var(--void-0); border-color:var(--event-cyan); font-weight:700; }
.page-dot:disabled{ opacity:.35; cursor:not-allowed; }
.page-ellipsis{ color:var(--star-700); }