.blog-page #header {background:#fff; color:#253e58; border-bottom:1px solid #e7edf4}
.blog-page #header a {color:#273c52}
.blog-page #header .site-logo a {background-position:0 -70px}
.blog-page #contents {padding:138px 0 72px; min-height:70vh}
.mc-blog {color:#294159; font-size:16px; line-height:1.7}
.mc-blog a {color:inherit}
.mc-blog a:focus-visible,.mc-blog button:focus-visible,.mc-blog input:focus-visible,.blog-home a:focus-visible {outline:3px solid #3376bd; outline-offset:4px}
.blog-breadcrumb {display:flex; flex-wrap:wrap; gap:10px; font-size:13px; color:#728296; margin-bottom:24px}
.blog-tabs {display:flex; gap:28px; border-bottom:1px solid #e3eaf2; margin-bottom:36px}
.blog-tabs a {padding:12px 2px; color:#687b8f; font-weight:500}
.blog-tabs a[aria-current] {color:#245f9f; border-bottom:2px solid #245f9f; font-weight:600}
.blog-heading {margin-bottom:30px; max-width:850px}
.blog-eyebrow {font-size:12px; font-weight:500; letter-spacing:1.3px; color:#527da9; margin:0 0 10px}
.blog-heading h1 {font-size:36px; line-height:1.3; margin:0 0 14px; color:#233e59}
.blog-heading > p:last-child {color:#6a7d90; word-break:keep-all}
.blog-filters {display:flex; flex-wrap:wrap; gap:8px; margin-bottom:22px}
.blog-filters a {padding:7px 16px; border:1px solid #e0e8f1; border-radius:5px; font-size:14px; background:#fff}
.blog-filters a:hover,.blog-filters a[aria-current] {background:#edf4fb; color:#245f9f; border-color:#cbddee}
.blog-search {display:flex; gap:8px; padding:14px; border:1px solid #e5edf6; border-radius:7px; background:#f6f9fc; margin-bottom:24px}
.blog-search input {min-width:0; width:100%; height:46px; padding:0 14px; font-size:15px; border:1px solid #d7e2ed; border-radius:5px; background:#fff}
.blog-search button {flex-shrink:0; padding:0 24px; background:#245f9f; color:#fff; border:0; border-radius:5px; font-size:15px; cursor:pointer}
.blog-count {font-size:14px; color:#728296; margin-bottom:18px}
.blog-grid {display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:26px}
.blog-grid .blog-card {display:flex; flex-direction:column; min-width:0; border:1px solid #e0e8f1; border-radius:9px; overflow:hidden; background:#fff; color:#294159; text-decoration:none; transition:border-color .2s,box-shadow .2s}
.blog-grid .blog-card:hover {border-color:#93b5d5; box-shadow:0 6px 20px #21384f0a}
.blog-card > img {width:100%; height:auto; aspect-ratio:16/10; object-fit:cover; object-position:center; display:block; background:#f4f7fb}
.blog-card-content {padding:23px; display:flex; flex-direction:column; flex:1; align-items:flex-start}
.blog-topic {display:inline-block; font-size:12px; font-weight:500; color:#48739f; background:#f0f5fa; padding:3px 9px; border-radius:4px}
.blog-card h2 {font-size:21px; line-height:1.5; font-weight:600; color:#27445f; margin:13px 0 10px; word-break:keep-all; overflow-wrap:anywhere}
.blog-card p {font-size:14px; line-height:1.75; color:#728296; margin:0 0 24px; word-break:keep-all; overflow-wrap:anywhere}
.blog-card-foot {display:flex; justify-content:space-between; align-items:center; gap:12px; width:100%; margin-top:auto; font-size:12px; color:#75899d}
.blog-card-foot > span {color:#3d6c9a; font-weight:500}
.blog-article {max-width:900px; margin:0 auto}
.blog-article-heading h1 {font-size:36px; line-height:1.45; font-weight:700; margin:18px 0 16px; color:#233e59; word-break:keep-all; overflow-wrap:anywhere}
.blog-article-heading > p {color:#6a7d90; margin-bottom:18px; word-break:keep-all}
.blog-byline {display:flex; flex-wrap:wrap; gap:6px 18px; font-size:13px; color:#75869a; padding-bottom:24px}
.blog-hero {display:block; width:100%; height:auto; max-height:430px; aspect-ratio:2/1; object-fit:cover; border-radius:8px; margin-bottom:35px; background:#f5f8fb}
.blog-body {color:#405268}
.blog-body h2:first-child {margin-top:0}
.blog-related {padding:24px; margin-top:40px; border:1px solid #dfe9f3; border-radius:8px; background:#f7fafd}
.blog-related h2 {font-size:19px; margin:0 0 16px; font-weight:600}
.blog-related > div {display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px}
.blog-related a {display:flex; flex-direction:column; gap:5px; padding:15px; border:1px solid #e2eaf3; border-radius:5px; background:#fff}
.blog-related small {font-size:12px; color:#73889c}
.blog-related strong {font-size:16px; font-weight:500; color:#315f8d}
.blog-article-footer {display:flex; justify-content:space-between; flex-wrap:wrap; gap:15px; font-size:14px; border-top:1px solid #e1e9f2; padding-top:24px; margin-top:35px; color:#446f99}
.blog-home {padding:70px 0; background:#f8fafc}
.blog-home-heading {display:flex; align-items:flex-end; justify-content:space-between; gap:20px; margin-bottom:28px}
.blog-home-heading h2 {font-size:30px; color:#294159; font-weight:600; margin-bottom:10px}
.blog-home-heading div > p:last-child {font-size:15px; color:#728296}
.blog-home-heading > a {font-size:14px; color:#245f9f; flex-shrink:0}
@media(max-width:1023px) {
    .blog-grid {grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px}
    .blog-home .blog-grid .blog-card:last-child {grid-column:1/-1}
    .blog-home .blog-grid .blog-card:last-child > img {max-height:230px}
}
@media(max-width:767px) {
    .blog-page #contents {padding:106px 0 50px}
    .blog-page #header .site-logo a {background-position:0 -52px}
    .blog-breadcrumb {font-size:12px; margin-bottom:16px}
    .blog-tabs {margin-bottom:28px}
    .blog-heading h1,.blog-article-heading h1 {font-size:28px}
    .blog-heading > p:last-child,.blog-article-heading > p {font-size:15px}
    .blog-filters {gap:7px}
    .blog-filters a {font-size:13px; padding:6px 12px}
    .blog-search {padding:10px}
    .blog-search input {font-size:14px; padding:0 10px}
    .blog-search button {padding:0 17px}
    .blog-card-content {padding:20px}
    .blog-card h2 {font-size:20px}
    .blog-hero {margin-bottom:28px}
    .blog-related {padding:18px}
    .blog-related > div {grid-template-columns:1fr}
    .blog-home {padding:45px 0}
    .blog-home-heading {display:block}
    .blog-home-heading h2 {font-size:25px}
    .blog-home-heading > a {display:inline-block; margin-top:16px}
}
@media(max-width:560px) {
    .blog-grid {grid-template-columns:1fr}
    .blog-home .blog-grid .blog-card:last-child {grid-column:auto}
}