.article-hero { padding: calc(var(--nav-h) + var(--space-2xl)) var(--space-xl) var(--space-2xl); background: linear-gradient(135deg, #0b3a70, #102b4c); color: #fff; }
.article-hero__inner, .article-layout { max-width: 1120px; margin: 0 auto; }
.article-hero h1 { max-width: 850px; font-family: var(--font-display); font-size: clamp(2rem, 5vw, 3.7rem); line-height: 1.05; margin: var(--space-sm) 0 var(--space-md); }
.article-hero p { max-width: 760px; color: hsl(213 20% 82%); font-size: var(--text-lg); line-height: 1.6; }
.article-meta { display: flex; flex-wrap: wrap; gap: var(--space-sm); margin-top: var(--space-lg); font-size: var(--text-sm); color: hsl(213 20% 78%); }
.article-layout { display: grid; grid-template-columns: minmax(0, 1fr) 260px; gap: var(--space-2xl); padding: var(--space-2xl) var(--space-xl); }
.article-body { min-width: 0; }
.article-body h2 { color: var(--color-primary); font-family: var(--font-display); font-size: var(--text-xl); margin: var(--space-2xl) 0 var(--space-md); padding-top: var(--space-sm); border-top: 1px solid var(--color-border); }
.article-body h2:first-child { margin-top: 0; border-top: 0; }
.article-body h3 { color: var(--color-text); font-family: var(--font-display); margin: var(--space-lg) 0 var(--space-sm); }
.article-body p, .article-body li { color: var(--color-text-muted); line-height: 1.75; }
.article-body ul, .article-body ol { padding-left: var(--space-lg); margin-bottom: var(--space-md); }
.article-body li { margin-bottom: var(--space-xs); }
.article-callout { background: hsl(43 55% 96%); border-left: 4px solid #c9a64a; border-radius: var(--radius-sm); padding: var(--space-md); margin: var(--space-lg) 0; }
.article-table-wrap { overflow-x: auto; margin: var(--space-lg) 0; }
.article-table { width: 100%; border-collapse: collapse; min-width: 680px; }
.article-table th, .article-table td { border: 1px solid var(--color-border); padding: 0.8rem; text-align: left; vertical-align: top; line-height: 1.5; }
.article-table th { background: var(--color-primary); color: white; font-family: var(--font-display); }
.article-table tr:nth-child(even) td { background: hsl(213 35% 98%); }
.article-toc { position: sticky; top: calc(var(--nav-h) + var(--space-md)); align-self: start; border: 1px solid var(--color-border); border-radius: var(--radius-md); padding: var(--space-md); }
.article-toc strong { display: block; margin-bottom: var(--space-sm); color: var(--color-primary); }
.article-toc a { display: block; padding: 0.35rem 0; color: var(--color-text-muted); text-decoration: none; font-size: var(--text-sm); }
.article-sources { background: hsl(213 30% 97%); padding: var(--space-md); border-radius: var(--radius-md); }
.article-cta { background: #0b3a70; color: #fff; padding: var(--space-xl); border-radius: var(--radius-lg); margin-top: var(--space-2xl); }
.article-cta p { color: hsl(213 20% 82%); }
@media (max-width: 850px) { .article-layout { grid-template-columns: 1fr; } .article-toc { position: static; order: -1; } }