body.article-page { background: var(--paper); }
.article-hero { padding: clamp(55px,9vw,115px) 0 45px; border-bottom: 1px solid var(--line-v2); }
.article-hero .wrap { max-width: 900px; }
.article-breadcrumb { color: var(--terracotta); font-size: .82rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; text-decoration: none; }
.article-hero h1 { max-width: 15ch; margin-top: 18px; font-size: clamp(2.5rem,6vw,4.9rem); line-height: .98; letter-spacing: -.04em; }
.article-meta { margin-top: 24px; color: var(--muted-v2); }
.article-layout { max-width: 1060px; display: grid; grid-template-columns: 210px minmax(0,690px); gap: 70px; align-items: start; padding-top: 60px; padding-bottom: 90px; }
.article-toc { position: sticky; top: 100px; font-size: .9rem; color: var(--muted-v2); }
.article-toc strong { display: block; margin-bottom: 9px; color: var(--navy); }
.article-toc a { color: inherit; }
.article-body { font-family: 'Fraunces',serif; font-size: 1.12rem; line-height: 1.72; }
.article-body p { color: var(--ink-v2); margin: 0 0 1.55em; }
.article-body p:first-child::first-letter { float: left; margin: .08em .11em 0 0; color: var(--terracotta); font-size: 4.3em; line-height: .72; }
.article-cta { margin-top: 55px; padding: 34px; border-radius: 20px; background: var(--navy); color: #fff; }
.article-cta h2 { color: #fff; }
.article-cta p { color: rgba(255,255,255,.76); font-family: 'Work Sans',sans-serif; font-size: 1rem; }
.article-nav { display: flex; justify-content: space-between; gap: 18px; margin-top: 40px; padding-top: 26px; border-top: 1px solid var(--line-v2); font-family: 'Work Sans',sans-serif; }
.article-nav a { color: var(--navy); font-weight: 600; }
@media(max-width:800px){.article-layout{grid-template-columns:1fr;gap:20px}.article-toc{position:static;padding:14px 16px;border:1px solid var(--line-v2);border-radius:12px}.article-body{font-size:1.05rem}.article-nav{flex-direction:column}}