/* Page-specific blog styles, loaded after the shared site theme. */
.articles .article-intro { max-width: 780px; }
.articles .article-category { color: var(--primary); font-size: .8rem; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; }
.articles .article-filters { display: flex; flex-wrap: wrap; gap: .6rem; }
.articles .article-filters a { border: 1px solid var(--primary); border-radius: 2rem; padding: .55rem 1.1rem; color: var(--primary); font-weight: 600; }
.articles .article-filters a:hover, .articles .article-filters a[aria-current] { background: var(--primary); color: #fff; text-decoration: none; }
.articles .article-card { overflow: hidden; border-radius: 18px; box-shadow: 0 8px 25px #0000000c; }
.articles .article-card .card-img-top { width: 100%; height: auto; aspect-ratio: 16 / 9; object-fit: cover; }
.articles .article-card h3 { line-height: 1.3; letter-spacing: -.025em; text-transform: none; }
.articles .article-card h3 a { color: var(--primary); }
.articles .article-read-more { font-weight: 600; }
.articles a:focus-visible { outline: 3px solid var(--primary); outline-offset: 4px; }
.articles .article-heading { border-bottom: 5px solid var(--secondary); }
.articles .article-heading h1 { max-width: 1000px; font-size: clamp(2rem, 4vw, 3.75rem); line-height: 1.12; letter-spacing: -.035em; text-transform: none; overflow-wrap: anywhere; }
.articles .breadcrumb { line-height: 1.7; }
.articles .article-body { max-width: 780px; font-size: 1.08rem; line-height: 1.85; color: var(--dark, #333); overflow-wrap: anywhere; }
.articles .article-body p, .articles .article-body li { line-height: inherit; }
.articles .article-body h2 { margin-top: 2.5rem; font-size: 1.65rem; line-height: 1.35; letter-spacing: -.025em; text-transform: none; color: var(--primary); }
.articles .article-body img { display: block; max-width: 100%; height: auto; margin: 1.75rem auto; border-radius: 12px; }
.articles .article-body li { margin-bottom: 1rem; }
.articles .article-body .answers { display: block; font-weight: 600; color: var(--primary); }
.articles .article-body a { text-decoration: underline; text-underline-offset: .15em; }
.articles .article-sidebar { border-radius: 18px; }
.articles .article-topics li + li { margin-top: .75rem; }
.articles .article-topics a { font-weight: 600; }
@media (max-width: 575px) {
    .articles .article-filters a { padding: .45rem .8rem; font-size: .85rem; }
    .articles .article-body { font-size: 1rem; }
}