/* Suvichar Editorial v0.4: blog index spacing.
   Tighter hero and less space above the article cards. */

.blog-index .page-hero {
    padding-top: 56px;
    padding-bottom: 40px;
}
.blog-index .page-hero + .section {
    padding-top: 40px;
}

/* Incomplete last row.
   The shared card grid draws its dividers as a 1px gap over a grey background, so any empty slot
   shows as a grey block. Page 1 holds 12 articles (full rows). On a later page with fewer, the last
   card stretches across the empty slots, so no grey block appears. Three columns only (880px and up);
   below that the grid is a single column and needs nothing. */
@media (min-width: 880px) {
    .blog-index .lp-grid > .lp-card:last-child:nth-child(3n + 1) { grid-column: span 3; }
    .blog-index .lp-grid > .lp-card:last-child:nth-child(3n + 2) { grid-column: span 2; }
}

/* Pagination: space it away from the grid and set the page numbers apart. */
.blog-pager { margin-top: 32px; }
.blog-pager .nav-links { display: flex; flex-wrap: wrap; align-items: center; gap: 18px; font-family: var(--font-mono); font-size: 0.9rem; }
.blog-pager .page-numbers.current { color: var(--dark); font-weight: 700; }
