/* Standalone premium blog views. Loaded only by the dedicated blog route. */
.xantum-blog-page { background: var(--mist); color: var(--navy); }
.xantum-blog-header { position: relative; height: 95px; background: var(--navy); color: var(--white); }
.xantum-blog-header nav { display: flex; }
.xantum-blog-header .is-current { color: var(--green); border-bottom: 1px solid var(--green); }
.xantum-blog-main { background: var(--mist); min-height: 68vh; }
.xantum-blog-hero, .xantum-article-hero { background: var(--navy); color: var(--white); padding: 76px 6% 104px; }
.xantum-blog-hero .section-kicker { color: #bfd3e5; margin-bottom: 42px; }
.xantum-blog-hero h1 { margin: 0; max-width: 1020px; font-size: clamp(56px, 10vw, 164px); line-height: .87; letter-spacing: -.075em; }
.xantum-blog-hero h1 span, .xantum-article-hero h1 span { color: var(--green); }
.xantum-blog-hero > p { max-width: 550px; margin: 40px 0 0; color: #d8e5ef; font-size: clamp(18px, 2vw, 25px); line-height: 1.5; }
.xantum-blog-listing { max-width: 1500px; margin: 0 auto; padding: 76px 6% 100px; }
.blog-topic-filter { display: flex; flex-wrap: wrap; gap: 9px; margin: 0 0 34px; }
.blog-topic-filter a { padding: 9px 12px; border: 1px solid #b9cedd; color: #274a68; font: 11px/1.3 "DM Mono", monospace; text-transform: uppercase; }
.blog-topic-filter span { padding: 9px 12px; border: 1px solid #d5e0e8; color: #526879; font: 11px/1.3 "DM Mono", monospace; text-transform: uppercase; }
.blog-topic-filter a:hover, .blog-topic-filter a:focus-visible, .blog-topic-filter a[aria-current="page"] { border-color: var(--navy); background: var(--navy); color: var(--white); }
.xantum-post-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; }
.xantum-post-card { min-width: 0; min-height: 390px; display: flex; flex-direction: column; padding: clamp(24px, 2.7vw, 42px); background: var(--white); border: 1px solid #c8d8e5; border-top: 5px solid var(--blue); }
.xantum-post-card:nth-child(3n + 2) { border-top-color: var(--green); }
.xantum-post-card:nth-child(3n) { border-top-color: var(--sky); }
.blog-meta { display: flex; justify-content: space-between; gap: 14px; padding-bottom: 20px; border-bottom: 1px solid #d4e0e9; color: #49657b; font: 11px/1.5 "DM Mono", monospace; letter-spacing: .02em; text-transform: uppercase; }
.xantum-post-card h2 { margin: 27px 0 16px; font-size: clamp(25px, 2vw, 32px); line-height: 1.08; letter-spacing: -.045em; overflow-wrap: break-word; hyphens: auto; }
.xantum-post-card h2 a:hover, .xantum-post-card h2 a:focus-visible { text-decoration: underline; text-underline-offset: 5px; }
.xantum-post-card p { margin: 0; color: #34516a; font-size: 16px; line-height: 1.65; }
.post-read { display: flex; justify-content: space-between; align-items: center; gap: 18px; margin-top: 28px; padding-top: 22px; border-top: 1px solid #d4e0e9; color: #123c67; font-size: 15px; font-weight: 800; }
.post-read span { color: var(--blue); font-size: 25px; }
.blog-pagination { display: flex; align-items: center; justify-content: space-between; gap: 24px; margin-top: 52px; padding-top: 23px; border-top: 1px solid #bfd0dd; color: #466077; font: 12px/1.5 "DM Mono", monospace; text-transform: uppercase; }
.blog-pagination a { color: var(--navy); font-weight: 700; }
.blog-pagination a:hover { color: var(--blue); }
.xantum-article-hero { padding-bottom: 80px; border-bottom: 4px solid var(--green); }
.blog-back { display: inline-block; margin-bottom: 70px; color: #bfd3e5; font: 12px/1.6 "DM Mono", monospace; }
.blog-back:hover { color: var(--green); }
.xantum-article-hero .blog-meta { max-width: 800px; color: #b9cfdf; border-color: #ffffff2e; }
.xantum-article-hero h1 { max-width: 1160px; margin: 30px 0 0; font-size: clamp(42px, 5vw, 86px); line-height: 1.03; letter-spacing: -.065em; overflow-wrap: break-word; hyphens: auto; }
.xantum-article-lead { max-width: 760px; margin: 36px 0 0; color: #dce8f1; font-size: clamp(19px, 2.15vw, 28px); line-height: 1.48; }
.xantum-article-body { max-width: 864px; margin: 0 auto; padding: 76px 32px 30px; color: #243f56; font-size: 18px; line-height: 1.82; }
.xantum-article-body > *:first-child { margin-top: 0; }
.xantum-article-body p, .xantum-article-body ul, .xantum-article-body ol, .xantum-article-body blockquote, .xantum-article-body table, .xantum-article-body pre { margin: 0 0 28px; }
.xantum-article-body h2, .xantum-article-body h3 { color: var(--navy); line-height: 1.12; letter-spacing: -.045em; scroll-margin-top: 30px; }
.xantum-article-body h2 { margin: 62px 0 22px; font-size: clamp(31px, 4.2vw, 52px); }
.xantum-article-body h3 { margin: 42px 0 17px; font-size: clamp(23px, 3vw, 33px); }
.xantum-article-body a { color: #17558d; text-decoration: underline; text-underline-offset: 4px; overflow-wrap: break-word; hyphens: auto; }
.xantum-article-body li + li { margin-top: 8px; }
.xantum-article-body blockquote { padding: 7px 0 7px 28px; border-left: 4px solid var(--green); color: #164673; font-size: clamp(20px, 2.4vw, 28px); font-weight: 600; line-height: 1.48; }
.xantum-article-body img { max-width: 100%; height: auto; }
.xantum-article-body table { display: block; width: 100%; overflow-x: auto; border-collapse: collapse; font-size: 15px; }
.xantum-article-body th, .xantum-article-body td { min-width: 150px; padding: 12px 15px; border: 1px solid #c6d5e1; text-align: left; vertical-align: top; }
.xantum-article-body th { background: #dce8f1; color: var(--navy); }
.xantum-article-body pre { overflow-x: auto; padding: 20px; background: var(--navy); color: var(--white); font: 13px/1.6 "DM Mono", monospace; }
.xantum-article-footer { max-width: 864px; margin: 0 auto; padding: 30px 32px 90px; display: flex; justify-content: space-between; gap: 24px; border-top: 1px solid #c6d5e1; font-size: 15px; font-weight: 700; }
.xantum-article-footer a { color: #164673; }
.xantum-article-footer .original-source { color: #567087; font-size: 13px; font-weight: 500; }
.blog-state { padding: 42px; background: var(--white); border: 1px solid #c8d8e5; color: #29485f; }
.blog-state p { margin: 0 0 16px; font-size: 18px; line-height: 1.6; }
.blog-state a { color: #164673; font-weight: 700; text-decoration: underline; text-underline-offset: 4px; }
.blog-state-full { min-height: 58vh; padding: 12vh 6%; background: var(--navy); color: var(--white); }
.blog-state-full > span { color: var(--green); font: 14px/1.5 "DM Mono", monospace; }
.blog-state-full h1 { max-width: 850px; margin: 20px 0; font-size: clamp(42px, 7vw, 100px); line-height: .95; letter-spacing: -.06em; }
.blog-state-full p { max-width: 600px; color: #d5e3ee; }
.blog-state-full a { color: var(--green); }
.xantum-blog-footer { z-index: 1; }
@media (max-width: 900px) { .xantum-post-grid { grid-template-columns: 1fr; } .xantum-post-card { min-height: 0; } .xantum-post-card p { max-width: 690px; } }
@media (max-width: 680px) { .xantum-blog-header { height: auto; min-height: 80px; flex-wrap: wrap; gap: 15px; padding: 19px 6%; } .xantum-blog-header nav { width: 100%; justify-content: space-between; gap: 12px; font-size: 11px; } .xantum-blog-hero, .xantum-article-hero { padding: 46px 6% 58px; } .xantum-blog-hero .section-kicker > span:last-child { display: none; } .xantum-blog-hero h1 { font-size: clamp(52px, 16vw, 90px); } .xantum-blog-hero > p { margin-top: 29px; } .xantum-blog-listing { padding: 45px 6% 62px; } .blog-topic-filter { margin-bottom: 25px; gap: 7px; } .blog-topic-filter a, .blog-topic-filter span { padding: 8px 9px; font-size: 10px; } .xantum-post-card { padding: 25px; } .blog-pagination { align-items: flex-start; flex-wrap: wrap; margin-top: 38px; } .blog-pagination span { order: -1; width: 100%; } .blog-back { margin-bottom: 38px; } .xantum-article-hero h1 { margin-top: 24px; font-size: clamp(43px, 12vw, 70px); } .xantum-article-body { padding: 48px 6% 30px; font-size: 17px; line-height: 1.76; } .xantum-article-body h2 { margin-top: 47px; } .xantum-article-footer { padding: 30px 6% 58px; flex-direction: column; } }

/* Locally migrated lead images keep their original ratio on every screen. */
.xantum-article-featured { max-width: 1140px; margin: 0 auto; padding: 44px 6% 0; }
.xantum-article-featured img { display: block; width: 100%; max-width: 100%; height: auto; border-radius: 3px; }
@media (max-width: 680px) { .xantum-article-featured { padding-top: 28px; } }