/* Blog views only (inc/blog.php). Everything else comes from the shared components in dist/main.css. */

/* Article cards: related-card plus a photo and a date. */
.post-card__img {
  display: block; width: 100%; height: auto; aspect-ratio: 16 / 10; object-fit: cover;
  border-radius: calc(var(--r-card) - 4px); margin-bottom: 1.25rem;
}
.related-card .post-card__date { margin-top: 0; font-size: var(--fs-sm); color: var(--muted); }
.related-card .post-card__date + h3 { margin-top: .5rem; }
.post-grid__empty { color: var(--muted); }

/* Pagination under the grid. */
.post-grid .nav-links { display: flex; flex-wrap: wrap; justify-content: center; gap: .5rem; margin-top: clamp(2rem, 1.5rem + 1vw, 3rem); }
.post-grid .page-numbers {
  display: inline-flex; align-items: center; justify-content: center; min-width: 44px; min-height: 44px; padding: 0 1rem;
  border: 1px solid var(--rule); border-radius: 8px; color: var(--ink); text-decoration: none; font-weight: 600;
}
.post-grid a.page-numbers:hover { border-color: var(--orange); }
.post-grid .page-numbers.current { background: var(--ink); border-color: var(--ink); color: var(--white); }

/* Single post: legal reading column plus a crumb, a lead photo, and body media. */
.post__crumb { font-size: var(--fs-sm); }
.post__crumb a { color: var(--muted); }
.post__figure { margin: var(--gap-bb) 0 0; }
.post__figure img { display: block; width: 100%; height: auto; border-radius: var(--r-card); }
.post__body img, .post__body figure { max-width: 100%; height: auto; }
.post__body h3 { margin-top: 2rem; font-size: var(--fs-h3-sm, 1.125rem); }
.post__body p, .post__body ul, .post__body ol { margin-top: 1rem; }
.post__body ul, .post__body ol { padding-left: 1.25rem; }
.post__body li + li { margin-top: .4rem; }
.post__body a { color: var(--orange-deep); }