.article-page { background:var(--paper); color:var(--ink); }
.article-header { position:relative; color:var(--ink); background:var(--paper); mix-blend-mode:normal; }
.article-header .wordmark { font-size:1.25rem; }
.article-nav { color:var(--ink); }
.article-hero { max-width:76rem; margin:0 auto; padding:9rem 7vw 5rem; }
.article-hero h1 { max-width:12ch; margin:1.5rem 0 2rem; font-family:var(--serif); font-size:clamp(4rem,10vw,9.5rem); font-weight:500; line-height:.82; letter-spacing:-.08em; }
.article-hero h1 em { color:var(--clay); font-style:normal; }
.article-dek { max-width:37rem; font-size:clamp(1.1rem,2vw,1.55rem); line-height:1.25; }
.article-meta { margin-top:2.5rem; font-family:var(--mono); font-size:.64rem; letter-spacing:.04em; text-transform:uppercase; }
.article-image { max-width:76rem; margin:0 auto; padding:0 7vw; }
.article-image img { width:100%; max-height:42rem; object-fit:cover; }
.article-image figcaption { margin-top:.8rem; font-family:var(--mono); font-size:.62rem; text-transform:uppercase; }
.article-body { max-width:42rem; margin:5rem auto 8rem; padding:0 1.5rem; }
.article-body p { font-size:1.08rem; line-height:1.65; }
.article-body .lead { margin-bottom:2.5rem; font-family:var(--serif); font-size:clamp(1.8rem,3vw,2.5rem); line-height:1.08; letter-spacing:-.035em; }
.article-body h2 { margin:4rem 0 1rem; font-family:var(--serif); font-size:clamp(2rem,4vw,3.2rem); font-weight:500; line-height:1; letter-spacing:-.06em; }
.article-body blockquote { margin:3rem -5rem; padding:1.5rem 2rem; color:var(--paper); background:var(--forest); font-size:clamp(1.8rem,3vw,2.6rem); }
.article-source { margin-top:4rem; padding:1.3rem 0; border-top:1px solid var(--ink); }
.article-source p:last-child { font-size:.85rem; line-height:1.5; }
.article-source a { color:var(--clay); }
@media (max-width:760px) { .article-hero { padding-top:5rem; } .article-body { margin-top:3.5rem; } .article-body blockquote { margin:2.5rem 0; } }