/* Editorial reading surface. Scoped so the shared header and store stay independent. */
.article-detail,
.articles-section {
    background: var(--brand-paper, #fbfafa);
    color: var(--brand-ink, #160f12);
    color-scheme: light;
    padding-block: clamp(32px, 5vw, 64px) clamp(56px, 8vw, 96px);
}
.article-detail .container,
.articles-section .container { width: min(1120px, 100% - 48px); }
.article-detail :is(h1, h2, h3),
.articles-section :is(h1, h2, h3) {
    font-family: var(--font-body, Barlow, Arial, sans-serif);
    text-transform: none;
    letter-spacing: -.025em;
    color: var(--brand-navy, #162051);
}
.article-detail a,
.articles-section a { color: var(--brand-navy, #162051); text-underline-offset: .22em; }
.article-detail a:hover,
.articles-section a:hover { color: var(--brand-ink, #160f12); text-decoration: underline; }
.article-detail :focus-visible,
.articles-section :focus-visible {
    outline: 3px solid var(--brand-navy, #162051);
    outline-offset: 4px;
    box-shadow: 0 0 0 7px var(--brand-paper, #fbfafa);
}
.article-detail .breadcrumb,
.articles-section .breadcrumb { color: #5b5355; margin-bottom: 32px; overflow-wrap: anywhere; }
.article-detail .breadcrumb a,
.articles-section .breadcrumb a { display: inline-flex; align-items: center; min-height: 44px; }
.article-detail .section-kicker,
.articles-section .section-kicker { color: var(--brand-navy, #162051); font-size: .85rem; letter-spacing: .13em; }
.article-heading { max-width: 880px; margin-bottom: 40px; }
.article-heading h1 { font-size: clamp(2rem, 4.3vw, 3.5rem); line-height: 1.12; margin-bottom: 24px; overflow-wrap: anywhere; }
.article-byline { font-size: .95rem; margin-bottom: 8px; }
.article-date { font-size: .875rem; color: #5b5355; line-height: 1.7; }
.article-summary { max-width: 730px; margin-top: 28px; padding-block: 24px 0; border-top: 1px solid var(--brand-taupe, #bbaea2); }
.article-summary-label { font-size: .8rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; margin-bottom: 8px; }
.article-lead { font-size: 1.2rem; line-height: 1.7; margin: 0; overflow-wrap: anywhere; }
.article-cover { width: 100%; max-width: 880px; height: auto; margin: 0 0 40px; }
.article-reading-layout { display: grid; grid-template-columns: minmax(0, 730px) minmax(210px, 1fr); gap: clamp(32px, 5vw, 72px); align-items: start; }
.article-content { min-width: 0; font-size: 1.075rem; line-height: 1.85; overflow-wrap: anywhere; }
.article-content h2,
.article-content h3 { scroll-margin-top: 112px; margin: 44px 0 20px; font-size: 1.8rem; line-height: 1.3; }
.article-content h3 { font-size: 1.35rem; margin-top: 32px; }
.article-content > :first-child { margin-top: 0; }
.article-content p { margin-bottom: 24px; }
.article-content ul { padding-left: 24px; margin: 24px 0; }
.article-content li { padding-left: 4px; margin-bottom: 12px; }
.article-content a { text-decoration: underline; }
.article-content code { white-space: pre-wrap; font-size: .95em; }
.article-sidebar { min-width: 0; position: sticky; top: 112px; }
.article-toc-desktop { padding-top: 16px; border-top: 1px solid var(--brand-taupe, #bbaea2); max-height: calc(100vh - 140px); overflow-y: auto; overscroll-behavior: contain; }
.article-toc-title { font-size: .8rem; text-transform: uppercase; font-weight: 700; letter-spacing: .1em; margin: 0 0 12px; }
.article-toc-desktop ol,
.article-toc-mobile ol { list-style: none; padding: 0; margin: 0; }
.article-toc-desktop a,
.article-toc-mobile a { display: flex; align-items: center; min-height: 44px; padding: 10px 4px; font-size: .94rem; line-height: 1.5; overflow-wrap: anywhere; }
.article-toc-desktop .toc-level-3,
.article-toc-mobile .toc-level-3 { margin-left: 16px; }
.article-toc-mobile { display: none; border-block: 1px solid var(--brand-taupe, #bbaea2); margin-bottom: 32px; }
.article-toc-mobile summary { min-height: 48px; padding: 12px 4px; cursor: pointer; font-weight: 600; }
.article-toc-mobile nav { padding: 0 4px 16px; }
.article-content .article-cta { padding: 24px 0; margin: 36px 0; border-block: 1px solid var(--brand-taupe, #bbaea2); font-size: 1rem; line-height: 1.65; }
.article-content .article-cta-title { font-weight: 700; color: var(--brand-navy, #162051); font-size: 1.15rem; margin-bottom: 8px; }
.article-content .article-cta p { margin-bottom: 12px; }
.article-cta-actions { display: flex; flex-wrap: wrap; gap: 4px 24px; }
.article-cta-actions a { display: inline-flex; align-items: center; min-height: 44px; font-weight: 600; }
.article-content .article-cta-end { background: var(--brand-navy, #162051); color: var(--brand-paper, #fbfafa); padding: clamp(20px, 4vw, 32px); border: 0; margin-bottom: 0; }
.article-content .article-cta-end .article-cta-title,
.article-content .article-cta-end a { color: var(--brand-paper, #fbfafa); }
.article-cta-end :focus-visible { outline-color: var(--brand-paper, #fbfafa); box-shadow: none; }
.article-related { max-width: 730px; margin-top: 56px; }
.article-related h2 { font-size: 1.8rem; }
.article-related > p { color: #5b5355; }
.article-related ul { list-style: none; padding: 0; }
.article-related li { padding-block: 20px; border-top: 1px solid var(--brand-taupe, #bbaea2); }
.article-related a { display: inline-flex; align-items: center; min-height: 44px; font-size: 1.15rem; font-weight: 600; }
.article-related li p { margin: 8px 0 0; overflow-wrap: anywhere; }
.article-return { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 8px 24px; border-top: 1px solid var(--brand-taupe, #bbaea2); margin-top: 48px; padding-top: 20px; }
.article-return a { display: inline-flex; align-items: center; min-height: 44px; text-decoration: underline; }
.article-empty { max-width: 730px; padding-block: 40px; }
.article-empty h1 { font-size: 2.1rem; }
.article-index-heading { max-width: 820px; margin: 12px 0 48px; }
.article-index-heading h1 { font-size: clamp(2.4rem, 5vw, 4rem); line-height: 1.08; }
.article-index-heading > p:last-child { max-width: 600px; font-size: 1.125rem; line-height: 1.7; }
.article-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 40px; }
.article-card { min-width: 0; border-top: 1px solid var(--brand-taupe, #bbaea2); }
.article-card-link { display: block; height: 100%; padding-top: 24px; }
.article-card-link:hover { text-decoration: none !important; }
.article-card-link:hover h2 { text-decoration: underline; text-underline-offset: .15em; }
.article-card img { width: 100%; height: auto; aspect-ratio: 16/9; object-fit: cover; margin-bottom: 24px; }
.article-card-body h2 { font-size: clamp(1.5rem, 2.6vw, 2rem); line-height: 1.25; margin-bottom: 16px; overflow-wrap: anywhere; }
.article-card-body p { color: var(--brand-ink, #160f12); line-height: 1.7; overflow-wrap: anywhere; }
.article-card-body .article-date { color: #5b5355; }
.article-read { display: inline-block; padding-block: 12px; text-decoration: underline; font-weight: 600; }
.articles-section .pagination { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 16px; margin-top: 40px; }
.articles-section .pagination a { display: inline-flex; align-items: center; min-height: 44px; text-decoration: underline; }
@media (max-width: 900px) {
    .article-reading-layout { grid-template-columns: minmax(0, 1fr); }
    .article-content { max-width: 730px; }
    .article-sidebar { display: none; }
    .article-toc-mobile { display: block; }
}
@media (max-width: 600px) {
    .article-detail .container,
    .articles-section .container { width: calc(100% - 32px); }
    .article-heading { margin-bottom: 28px; }
    .article-grid { grid-template-columns: minmax(0, 1fr); gap: 32px; }
    .article-content { font-size: 1rem; }
    .article-lead { font-size: 1.1rem; }
    .article-content h2 { font-size: 1.5rem; }
    .article-return { flex-direction: column; }
}
@media print {
    .article-sidebar, .article-toc-mobile, .article-cta, .article-return { display: none; }
    .article-reading-layout { display: block; }
    .article-detail { padding: 0; }
}