/* ---------- article ---------- */
.article-page{padding:56px 0 96px}
.article-page__head{max-width:820px;margin:0 auto 40px;text-align:center}
.article-page__head h1{font-size:clamp(30px,5vw,52px);line-height:1.08;letter-spacing:-.032em;margin:18px 0 22px}
.article-page__dek{font-size:19px;color:var(--muted);line-height:1.6;max-width:62ch;margin:0 auto 30px}
.article-page__byline{display:flex;flex-wrap:wrap;gap:8px 16px;align-items:center;justify-content:center;font-size:13px;color:var(--muted);padding-top:24px;border-top:1px solid var(--rule);max-width:420px;margin:0 auto}
.article-page__hero{max-width:1080px;margin:0 auto 56px;aspect-ratio:21/9;border-radius:2px;overflow:hidden}
.article-body{max-width:700px;margin:0 auto}
.article-body p{font-family:var(--serif);font-size:19px;line-height:1.78;color:#232C34;margin-bottom:28px}
.article-body p:first-of-type::first-letter{float:left;font-family:var(--serif);font-size:66px;line-height:.84;font-weight:700;color:var(--ink);padding:6px 12px 0 0}
.article-body blockquote{margin:40px 0;padding:4px 0 4px 28px;border-left:2px solid var(--accent);font-family:var(--serif);font-size:23px;line-height:1.45;color:var(--ink);letter-spacing:-.015em}
.article-foot{max-width:700px;margin:64px auto 0;padding-top:34px;border-top:1px solid var(--rule);display:flex;flex-wrap:wrap;gap:16px;align-items:center;justify-content:space-between}

@media (max-width:620px){
  .article-body p{font-size:17.5px}
  .article-body p:first-of-type::first-letter{font-size:54px}
  .article-body blockquote{font-size:20px;padding-left:20px}
}