/* One editorial template for every article, independent of its topic. */
.blog-article-page.wrap {
    --article-rule: #e4e5e8;
    width: calc(100% - 170px);
    max-width: 1200px;
    margin: 0 auto;
    padding: 32px 0 88px;
    color: var(--article-ink);
    text-align: start;
}
.blog-article *, .blog-article *::before, .blog-article *::after { box-sizing: border-box; }
.blog-article a { color: inherit; text-underline-offset: 4px; }
.blog-article a:focus-visible, .blog-article summary:focus-visible { outline: 3px solid #467dc4; outline-offset: 5px; }
.blog-article .blog-article-header { max-width: 1000px; margin: 0 auto 30px; }
.blog-article .blog-article-breadcrumb { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; margin-bottom: 26px; color: var(--article-muted); font-size: 15px; line-height: 1.5; }
.blog-article .blog-article-breadcrumb a { text-decoration: none; }
.blog-article .blog-article-breadcrumb a:hover { text-decoration: underline; }
.blog-article h1 { margin: 0 0 24px; font-size: clamp(2.5rem, 4.8vw, 4.25rem); overflow-wrap: break-word; }
.blog-article .blog-article-deck { max-width: 860px; margin: 0; font-size: clamp(1.125rem, 1.6vw, 1.4rem); }
.blog-article .blog-article-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; margin-top: 28px; font-size: 15px; line-height: 1.5; color: var(--article-muted); }
.blog-article .blog-article-meta > span:first-child { color: var(--article-ink); font-weight: 500; }
.blog-article .blog-article-cover { width: 100%; margin: 0 0 54px; aspect-ratio: 2 / 1; overflow: hidden; background: #f1f2f4; }
.blog-article .blog-article-cover img { display: block; width: 100%; height: 100%; object-fit: cover; }
.blog-article .blog-article-body { width: 100%; max-width: 740px; margin: 0 auto; font-size: 19px; line-height: 1.8; }
.blog-article .blog-article-body p { margin: 0 0 24px; font-size: inherit; line-height: inherit; }
.blog-article .blog-article-body .blog-article-opening { font-size: 22px; line-height: 1.65; letter-spacing: -.012em; }
.blog-article .blog-article-outline { margin: 32px 0 44px; padding: 18px 0; border-top: 1px solid var(--article-rule); border-bottom: 1px solid var(--article-rule); }
.blog-article .blog-article-outline summary { width: fit-content; cursor: pointer; font-size: 16px; line-height: 1.5; font-weight: 500; }
.blog-article .blog-article-outline nav { margin-top: 18px; font-size: 16px; line-height: 1.6; }
.blog-article .blog-article-outline a { text-decoration: none; }
.blog-article .blog-article-outline a:hover { text-decoration: underline; }
.blog-article .blog-article-body h2 { margin: 0 0 18px; font-size: clamp(1.6rem, 2.5vw, 2rem); }
.blog-article .blog-article-section { margin: 0 0 44px; }
.blog-article .blog-article-body ul, .blog-article .blog-article-body ol { margin: 16px 0 0; padding: 0; padding-inline-start: 24px; list-style-position: outside; }
.blog-article .blog-article-body ul { list-style-type: disc; }
.blog-article .blog-article-body ol { list-style-type: decimal; }
.blog-article .blog-article-body li { margin: 0 0 10px; padding-inline-start: 4px; font-size: inherit; line-height: inherit; }
.blog-article .blog-article-body li:last-child { margin-bottom: 0; }
.blog-article .blog-article-takeaway { margin-top: 50px; padding: 4px 0 4px 26px; padding-inline-start: 26px; padding-inline-end: 0; border-inline-start: 3px solid #282c36; }
.blog-article .blog-article-takeaway .blog-article-caption { margin-bottom: 16px; color: var(--article-muted); font-size: 14px; line-height: 1.5; }
.blog-article .blog-article-footer { margin-top: 46px; padding-top: 28px; border-top: 1px solid var(--article-rule); font-size: 16px; color: var(--article-muted); }
.blog-article .blog-article-footer > p { margin-bottom: 18px; }
.blog-article .blog-article-links { display: flex; flex-wrap: wrap; gap: 12px 24px; color: var(--article-ink); }
.blog-article .blog-article-links a { text-decoration: underline; }
.blog-article .blog-article-back { display: inline-block; margin-top: 32px; font-weight: 500; color: var(--article-ink); text-decoration: none; }
.blog-article .blog-article-back:hover { text-decoration: underline; }
html[dir="rtl"] .blog-article h1 { line-height: 1.4; }
html[dir="rtl"] .blog-article .blog-article-deck { line-height: 1.8; }
html[dir="rtl"] .blog-article .blog-article-body { line-height: 1.95; }
html[dir="rtl"] .blog-article .blog-article-body .blog-article-opening { line-height: 1.9; }
html[dir="rtl"] .blog-article .blog-article-body h2 { line-height: 1.6; }
@media (max-width: 768px) {
    .blog-article-page.wrap { padding-top: 24px; padding-bottom: 60px; }
    .blog-article .blog-article-header { margin-bottom: 26px; }
    .blog-article .blog-article-breadcrumb { margin-bottom: 22px; }
    .blog-article .blog-article-cover { aspect-ratio: 16 / 10; margin-bottom: 36px; }
    .blog-article .blog-article-body { font-size: 18px; }
    .blog-article .blog-article-body .blog-article-opening { font-size: 20px; }
    .blog-article .blog-article-section { margin-bottom: 36px; }
}
@media (max-width: 479px) {
    .blog-article-page.wrap { width: calc(100% - 60px); }
    .blog-article h1 { font-size: 2.4rem; }
    .blog-article .blog-article-takeaway { padding-inline-start: 18px; }
}