/* News page and articles. Colours and type come from each theme's own variables; the container class
   outranks the theme's own heading sizes, which load later. */
.news-content { padding-top: 0; }
.news-content .news-date { display: block; margin-bottom: 10px; font-family: var(--display, var(--sans, sans-serif)); font-size: .8125rem; letter-spacing: .04em; color: var(--muted, inherit); }

.news-content .news-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 300px), 1fr)); gap: 56px 36px; margin: 0; padding: 0; list-style: none; }
.news-content .news-card article { display: flex; flex-direction: column; height: 100%; }
.news-content .news-card-image { display: block; margin-bottom: 20px; overflow: hidden; border-radius: var(--news-radius, 14px); background: var(--line, #ddd); }
.news-content .news-card-image img { width: 100%; height: auto; aspect-ratio: 4 / 3; object-fit: cover; transition: transform .35s; }
.news-content .news-card:hover .news-card-image img { transform: scale(1.03); }
.news-content .news-card h2 { margin: 0 0 12px; font-size: clamp(1.5rem, 2.2vw, 1.875rem); line-height: 1.15; letter-spacing: -.01em; }
.news-content .news-card h2 a { color: inherit; text-decoration: none; }
.news-content .news-card h2 a:hover { text-decoration: underline; text-underline-offset: 4px; }
.news-content .news-excerpt { margin: 0; color: var(--muted, inherit); font-size: 1rem; }

.news-page.article-page .page-intro h1 { max-width: 22ch; }
/* Article columns stay aligned with the page title, whatever width the theme gives its sections. */
.news-content.article-content > * { max-width: 880px; }
.news-content .article-cover { margin: 0 0 48px; }
.news-content .article-cover img { width: 100%; height: auto; max-height: 640px; object-fit: cover; border-radius: var(--news-radius, 14px); }
.news-content .article-section { padding: 32px 0; border-top: 1px solid var(--line, currentColor); }
.news-content .article-section:first-child, .news-content .article-cover + .article-section { border-top: 0; padding-top: 0; }
.news-content .article-section h2 { margin: 0 0 20px; font-size: clamp(1.75rem, 3vw, 2.5rem); line-height: 1.12; }
.news-content .article-copy { max-width: 68ch; }
.news-content .article-copy p { margin: 0 0 16px; max-width: none; }
.news-content .article-images { display: grid; gap: 16px; margin-top: 24px; }
.news-content .article-images.is-gallery { grid-template-columns: repeat(auto-fit, minmax(min(100%, 240px), 1fr)); align-items: start; }
.news-content .article-images figure { margin: 0; }
.news-content .article-images img { width: 100%; height: auto; max-height: 720px; object-fit: contain; border-radius: var(--news-radius, 14px); }
.news-content .article-images.is-gallery img { aspect-ratio: 1; object-fit: cover; }
.news-content .article-images figcaption { padding-top: 10px; font-size: .8125rem; line-height: 1.5; color: var(--muted, inherit); }
.news-content .article-links { display: flex; flex-wrap: wrap; gap: 12px 28px; margin: 20px 0 0; }

.news-content .article-pager { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px 36px; margin-top: 32px; padding-top: 40px; border-top: 1px solid var(--line, currentColor); }
.news-content .article-neighbour { display: flex; flex-direction: column; gap: 8px; color: inherit; text-decoration: none; }
.news-content .article-neighbour[rel="next"] { grid-column: 2; text-align: right; }
.news-content .article-neighbour-title { font-family: var(--display, var(--serif, serif)); font-size: 1.25rem; line-height: 1.2; }
.news-content .article-neighbour:hover .article-neighbour-title { text-decoration: underline; text-underline-offset: 4px; }
.news-content .article-back { grid-column: 1 / -1; justify-self: center; }

@media (max-width: 740px) {
  .news-content .news-list { gap: 44px; }
  .news-content .article-cover { margin-bottom: 32px; }
  .news-content .article-pager { grid-template-columns: 1fr; }
  .news-content .article-neighbour[rel="next"] { grid-column: 1; text-align: left; }
}
@media (prefers-reduced-motion: reduce) { .news-content .news-card-image img { transition: none; } }
