.blog-main, .blog-home { color: var(--navy, #061d39); overflow-wrap: break-word; }
.blog-crumb { display:flex; flex-wrap:wrap; align-items:center; gap:6px 12px; padding-block:22px 0; color:#53677b; font-size:13px; }
.blog-crumb a, .blog-crumb [aria-current] { padding-block:4px; }
.blog-crumb a:hover { color:#0056ba; text-decoration:underline; }
.blog-kicker, .blog-tag { color:#09599f; font-size:12px; font-weight:700; line-height:1.5; letter-spacing:.075em; text-transform:uppercase; }
.blog-kicker { display:flex; align-items:center; gap:10px; margin:0 0 16px; }
.blog-kicker::before { content:""; flex:none; width:26px; height:3px; background:#076be3; }
.blog-intro { padding-block:clamp(36px,5vw,72px) 34px; }
#site .blog-main h1 { font-size:clamp(34px,4.3vw,64px); line-height:1.06; letter-spacing:-.045em; }
.blog-lead { color:#41576d; max-width:70ch; font-size:clamp(16px,1.25vw,19px); line-height:1.75; }
.blog-intro .blog-lead { margin:20px 0 0; }
.blog-index-grid, .blog-home-grid, .blog-related-grid { display:grid; gap:26px; }
.blog-index-grid, .blog-related-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
.blog-index-grid { padding-bottom:clamp(56px,7vw,100px); }
.blog-home-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
.blog-card { min-width:0; border:1px solid #dce5ee; border-radius:16px; background:#fff; }
.blog-card-link { height:100%; display:flex; flex-direction:column; color:inherit; border-radius:inherit; }
.blog-card-media { aspect-ratio:2.1; overflow:hidden; border-radius:15px 15px 0 0; background:#e5eef5; }
.blog-card-media img, .blog-hero-photo img { width:100%; height:100%; object-fit:cover; }
.blog-card-copy { display:flex; flex:1; flex-direction:column; align-items:flex-start; padding:clamp(20px,2.2vw,30px); }
.blog-tag { display:flex; flex-wrap:wrap; align-items:center; gap:8px 12px; margin:0 0 11px; font-size:11px; }
.blog-feature-label { background:#dbeaff; color:#074b98; padding:4px 8px; border-radius:4px; }
#site .blog-card-title { font-size:clamp(19px,1.8vw,25px); letter-spacing:-.027em; line-height:1.3; }
.blog-excerpt { color:#4d6276; font-size:15px; line-height:1.7; margin:10px 0 20px; }
.blog-card-link:hover .blog-card-title, .blog-card-link:focus-visible .blog-card-title { color:#0559b8; text-decoration:underline; text-underline-offset:4px; }
.blog-read, .blog-inline-link { display:inline-flex; align-items:center; gap:9px; color:#075aa9; font-size:14px; font-weight:650; line-height:1.45; }
.blog-read { margin-top:auto; }
.blog-inline-link { min-height:44px; }
.blog-inline-link:hover { text-decoration:underline; text-underline-offset:4px; }
.blog-read span, .blog-inline-link span { font-size:1.2em; }
.blog-card--feature { grid-column:1/-1; background:#eff5fc; }
.blog-card--feature .blog-card-link { display:grid; grid-template-columns:1.1fr 1fr; align-items:stretch; }
.blog-card--feature .blog-card-media { border-radius:15px 0 0 15px; aspect-ratio:1.85; }
.blog-card--feature .blog-card-copy { justify-content:center; padding:clamp(24px,3.4vw,54px); }
#site .blog-card--feature .blog-card-title { font-size:clamp(26px,2.6vw,40px); line-height:1.15; }
.blog-card--feature .blog-read { margin-top:5px; }
.blog-home, .blog-related { padding-block:clamp(44px,5.5vw,84px); background:#f3f7fb; border-top:1px solid #e0e9f1; }
.blog-section-head { display:flex; align-items:flex-end; justify-content:space-between; flex-wrap:wrap; gap:9px 24px; margin-bottom:26px; }
.blog-section-head .blog-kicker { margin-bottom:9px; }
#site .blog-section-head h2 { font-size:clamp(28px,3vw,42px); line-height:1.16; letter-spacing:-.035em; }
.blog-article-hero { display:grid; grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr); gap:clamp(26px,4vw,70px); align-items:center; padding-block:clamp(34px,5vw,72px); }
#site .blog-article-hero h1 { font-size:clamp(32px,3.5vw,54px); line-height:1.14; }
.blog-byline { margin:18px 0; color:#50677b; font-size:13px; font-weight:550; }
.blog-byline span { padding-inline:3px; }
.blog-article-intro .blog-lead { margin:0; }
.blog-hero-photo { aspect-ratio:4/3; overflow:hidden; border-radius:16px; background:#e5eef5; }
.blog-reading { display:grid; grid-template-columns:minmax(185px,.42fr) minmax(0,1fr); gap:clamp(28px,5vw,88px); align-items:start; border-top:1px solid #dce5ee; padding-block:clamp(32px,4vw,60px) clamp(48px,6vw,90px); }
.blog-contents { max-width:340px; }
.blog-contents ol { margin:0; padding-left:1.5em; color:#0a589f; font-size:14px; font-weight:600; }
.blog-contents li::marker { font-variant-numeric:tabular-nums; }
.blog-contents li + li { border-top:1px solid #e2eaf1; }
.blog-contents a { display:flex; align-items:center; min-height:44px; padding:8px 3px; line-height:1.6; }
.blog-contents a:hover { text-decoration:underline; text-underline-offset:3px; }
.blog-prose { max-width:72ch; }
.blog-text-section { scroll-margin-top:112px; }
.blog-text-section + .blog-text-section, .blog-sources, .blog-service { margin-top:34px; }
#site .blog-text-section h2 { font-size:clamp(23px,2.1vw,31px); line-height:1.3; margin-bottom:15px; }
.blog-text-section p { font-size:clamp(16px,1.25vw,18px); line-height:1.85; margin:0; color:#294158; }
.blog-text-section p + p { margin-top:14px; }
.blog-sources { border-left:3px solid #b5d3f3; padding:2px 0 2px 18px; }
#site .blog-sources h2 { font-size:16px; line-height:1.5; }
.blog-sources ul { margin:5px 0 0; padding-left:18px; font-size:14px; line-height:1.75; }
.blog-sources a { color:#075aa9; text-decoration:underline; text-underline-offset:3px; overflow-wrap:anywhere; }
.blog-service { display:flex; align-items:center; flex-wrap:wrap; justify-content:space-between; gap:12px 22px; border-top:1px solid #dce5ee; padding-top:22px; }
@media (max-width:850px) {
  .blog-article-hero { grid-template-columns:minmax(0,1fr); }
  .blog-hero-photo { aspect-ratio:2; }
  .blog-home-grid { gap:14px; }
  .blog-home-grid .blog-excerpt { font-size:14px; }
}
@media (max-width:760px) {
  .blog-card--feature .blog-card-link { display:flex; }
  .blog-card--feature .blog-card-media { border-radius:15px 15px 0 0; aspect-ratio:2; }
  .blog-reading { grid-template-columns:minmax(0,1fr); }
  .blog-contents { max-width:none; }
}
@media (max-width:640px) {
  .blog-home-grid, .blog-related-grid, .blog-index-grid { grid-template-columns:minmax(0,1fr); gap:18px; }
  .blog-section-head { align-items:flex-start; }
  .blog-article-hero, .blog-crumb, .blog-reading, .blog-index-grid, .blog-intro, .blog-home .wrap, .blog-related .wrap { width:calc(100% - 36px); }
  .blog-section-head .blog-inline-link { align-self:flex-end; }
  .blog-byline { line-height:1.6; }
}

.blog-topic-nav { display:flex; flex-wrap:wrap; gap:8px; margin-top:26px; }
.blog-topic-nav a { display:inline-flex; align-items:center; gap:9px; min-height:42px; padding:7px 14px; background:#edf4fb; border:1px solid #d5e4f2; border-radius:22px; color:#114e84; font-size:14px; font-weight:600; }
.blog-topic-nav a span { color:#53677b; font-size:12px; font-variant-numeric:tabular-nums; }
.blog-topics { padding-bottom:clamp(50px,7vw,96px); }
.blog-topic { padding:clamp(26px,4vw,46px) 0; border-top:1px solid #cfdeea; scroll-margin-top:100px; }
#site .blog-topic h2 { font-size:clamp(24px,3vw,36px); letter-spacing:-.032em; line-height:1.2; }
.blog-topic-note { color:#52677a; max-width:75ch; margin:8px 0 15px; }
.blog-guide-list { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:0 clamp(24px,4vw,60px); list-style:none; padding:0; margin:0; }
.blog-guide-list li { border-bottom:1px solid #e4ebf1; }
.blog-guide-list a { display:block; padding:13px 0; color:#164e7f; font-weight:600; line-height:1.45; }
.blog-guide-list a:hover,.blog-topic-nav a:hover,.blog-text-section a { color:#075aa9; text-decoration:underline; text-underline-offset:3px; }
@media(max-width:700px) { .blog-guide-list { grid-template-columns:1fr; } }
.blog-cover { display:grid; grid-template-columns:minmax(0,1.3fr) minmax(0,.7fr); align-items:center; gap:clamp(20px,4vw,70px); }
.blog-cover-photo { aspect-ratio:2.3; overflow:hidden; border-radius:14px; margin:0; }
.blog-cover-photo img { width:100%; height:100%; object-fit:cover; }
@media(max-width:700px) { .blog-cover { grid-template-columns:1fr; } .blog-cover-photo { aspect-ratio:3; max-height:170px; } }
