.article-body{max-width:900px;margin:0 auto}
.article-body .article-meta{display:flex;flex-wrap:wrap;gap:8px 16px;margin:0 0 20px;color:#66717c;font-size:14px}
.article-body .article-lead{font-size:19px;line-height:1.72;color:#25313d;max-width:850px;margin:0 0 26px}
.article-figure{margin:0 0 32px;border-radius:18px;overflow:hidden;background:#e5eaf0;border:1px solid #dce1e6}
.article-figure img{display:block;width:100%;height:auto;aspect-ratio:1672/941;object-fit:cover}
.article-figure figcaption{padding:11px 16px;color:#596470;font-size:13px;line-height:1.5;background:#fff}
.article-toc{padding:22px 26px;margin:0 0 40px;background:#fff;border:1px solid #dce1e6;border-left:5px solid #ffdc34;border-radius:12px}
.article-toc strong{display:block;margin-bottom:9px;font-size:17px;color:#1b222c}
.article-toc ol{margin:0;padding-left:21px;columns:2;column-gap:30px}
.article-toc li{break-inside:avoid;padding:4px 0}
.article-body section[id]{scroll-margin-top:24px}
.article-body section+section{margin-top:42px}
.article-example{margin:42px 0;padding:24px 28px;background:#fff;border:1px solid #dce1e6;border-radius:14px}
.article-example h2{font-size:25px;margin-bottom:12px}
.article-example p{margin:0}
.article-checks{margin:36px 0 44px;padding:24px 28px;background:#fff8d8;border:1px solid #e6cf70;border-radius:14px}
.article-checks h2{font-size:25px;margin-bottom:12px}
.article-checks ul{margin:0;padding-left:22px}
.article-checks li+li{margin-top:7px}
.page-card .blog-thumb{display:block;width:calc(100% + 52px);max-width:none;height:auto;aspect-ratio:1672/941;object-fit:cover;margin:-26px -26px 22px;border-radius:15px 15px 0 0}
.page-card:has(.blog-thumb){overflow:hidden}
.article-body .page-callout{margin-top:44px}
@media(max-width:700px){.article-body .article-lead{font-size:17px}.article-toc ol{columns:1}.article-figure{border-radius:12px}.article-example,.article-checks,.article-toc{padding:20px}.page-card .blog-thumb{width:calc(100% + 52px)}}

/* Reading layout for long-form articles. */
.article-body section[id] > h2{font-size:clamp(27px,3vw,35px);line-height:1.18;margin-bottom:18px}
.article-body section[id] > p{max-width:72ch;font-size:17px;line-height:1.78}
.article-body section[id] > p + p{margin-top:17px}
.article-scanlist{margin:28px 0 5px;padding:22px;background:#eef1f4;border:1px solid #dce1e6;border-radius:16px}
.article-scanlist > p{margin:0 0 15px!important;color:#36414c!important;font-size:15px!important;font-weight:800;line-height:1.35!important}
.article-scanlist ul{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;list-style:none;counter-reset:article-point;margin:0;padding:0}
.article-scanlist li{counter-increment:article-point;min-width:0;padding:17px 16px 18px;background:#fff;border:1px solid #dce1e6;border-top:4px solid #ffdc34;border-radius:10px;box-shadow:0 8px 22px rgba(27,34,44,.04)}
.article-scanlist li::before{content:counter(article-point,decimal-leading-zero);display:block;margin-bottom:12px;color:#7b6500;font-size:13px;font-weight:900;letter-spacing:.08em}
.article-scanlist li strong{display:block;margin-bottom:6px;color:#1b222c;font-size:16px;line-height:1.35}
.article-scanlist li span{display:block;color:#4d5864;font-size:15px;line-height:1.55;overflow-wrap:anywhere}
.article-choices{margin:28px 0 5px;padding:23px 25px;background:#1b222c;color:#fff;border-radius:16px}
.article-choices h3{margin:0 0 17px!important;color:#fff;font-size:21px;line-height:1.3}
.article-choices dl{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:11px;margin:0}
.article-choices--three dl{grid-template-columns:repeat(3,minmax(0,1fr))}
.article-choices dl > div{min-width:0;padding:16px;border:1px solid #59636d;border-radius:9px;background:#26313c}
.article-choices dt{margin:0 0 7px;color:#ffdc34;font-size:16px;font-weight:800}
.article-choices dd{margin:0;color:#e5ebf0;font-size:15px;line-height:1.55;overflow-wrap:anywhere}
@media(max-width:700px){.article-body section[id] > h2{font-size:27px}.article-body section[id] > p{font-size:16px;line-height:1.72}.article-scanlist{padding:16px}.article-scanlist ul,.article-choices dl,.article-choices--three dl{grid-template-columns:1fr}.article-scanlist li{padding:14px 15px}.article-choices{padding:19px}}

.page-card .blog-thumb-link{display:block;margin:-26px -26px 22px;overflow:hidden;border-radius:15px 15px 0 0}
.page-card .blog-thumb-link .blog-thumb{display:block;width:100%;margin:0;border-radius:0}
.page-card .blog-thumb-link:focus-visible{outline:3px solid #1b222c;outline-offset:-3px}