/* Blog-only styling: shared frontpage palette and a comfortable reading measure. */
.blog-design {
    --blog-ink: #142f49;
    --blog-muted: #586b7e;
    --blog-blue: #2463a4;
    --blog-green: #00845d;
    font-family: 'Open Sans', sans-serif;
    color: var(--blog-ink);
    font-size: 1rem;
}
.blog-design h1, .blog-design h2, .blog-design h3, .blog-design h4 {
    font-family: inherit;
    font-weight: 700;
    color: var(--blog-ink) !important;
    line-height: 1.2;
    letter-spacing: -.025em;
}
.blog-design h1 { font-size: clamp(2rem, 4vw, 3.4rem); letter-spacing: -.045em; }
.blog-design h2 { font-size: 1.75rem; }
.blog-design h3 { font-size: 1.35rem; }
.blog-design h4 { font-size: 1.15rem; }
.blog-design a:focus-visible, .blog-design button:focus-visible, .blog-design input:focus-visible {
    outline: 3px solid #2463a4;
    outline-offset: 4px;
}
.blog-eyebrow { display: inline-flex; align-items: center; gap: .65rem; color: var(--blog-blue); font-size: .8rem; font-weight: 700; letter-spacing: .065em; text-transform: uppercase; margin-bottom: 1rem; }
.blog-eyebrow::before { content: ''; width: 22px; height: 2px; background: currentColor; flex-shrink: 0; }
.blog-overview-hero { padding: clamp(1.5rem, 4vw, 3rem); margin: 0 0 2rem; border: 1px solid #e2eaf2; border-radius: 16px; background: linear-gradient(115deg, #f5f8fc 30%, #e5eff9); }
.blog-overview-hero h1 { max-width: 850px; margin-top: 0; }
.blog-overview-hero .lead { font-size: 1.05rem; line-height: 1.7; color: var(--blog-muted); max-width: 760px; margin-bottom: .6rem; }
.blog-category-hero > .row { align-items: center; }
.blog-category-hero > .row > .col-6 { width: 62%; }
.blog-category-hero img { width: 100%; max-width: 320px; height: auto; }
.blog-navigation { display: flex; flex-wrap: wrap; gap: .5rem; padding-bottom: 1.5rem; border-bottom: 1px solid #dce5ec; margin-bottom: 1rem; }
.blog-navigation a { color: var(--blog-blue); text-decoration: none; border: 1px solid #dce5ec; border-radius: 6px; padding: .6rem .9rem; font-size: .875rem; line-height: 1.4; }
.blog-navigation a:hover, .blog-navigation a.active { background: #e5eff9; border-color: #b6cee5; color: #142f49; }
.blog-design .blog-articles > [class*='col-'] { margin-top: 1rem !important; margin-bottom: 1rem !important; padding-bottom: 0 !important; border-bottom: 0 !important; }
.blog-design .blog-articles > [class*='col-'] > a { display: block; height: 100%; }
.blog-design .blog-articles .card { border: 1px solid #dce5ec; border-radius: 12px; overflow: hidden; box-shadow: none; transition: box-shadow .2s, transform .2s; }
.blog-design .blog-articles a:hover .card { box-shadow: 0 10px 28px #142f4910; transform: translateY(-3px); }
.blog-design .blog-articles .card-img { width: 100%; height: auto; aspect-ratio: 1200 / 630; object-fit: cover; }
.blog-design .blog-articles .card-body { padding: 1.4rem; }
.blog-design .blog-articles .card-title { font-size: 1.25rem; line-height: 1.35; margin-bottom: .8rem; }
.blog-design .blog-articles .card-text { font-size: .95rem; line-height: 1.7; color: var(--blog-muted); font-weight: 400; }
.blog-design .blog-articles .cat, .blog-design .blog-articles .card-footer { font-size: .78rem; line-height: 1.7; }
.blog-design .blog-articles .card-footer { padding: 0 1.4rem 1.4rem; }
.blog-design .text-info { color: var(--blog-blue) !important; }
.blog-detail > article { font-size: 1.0625rem; line-height: 1.7; }
.blog-detail > article > header { padding: 0 0 2.5rem; margin-bottom: 2.5rem; border-bottom: 1px solid #dce5ec; }
.blog-detail > article > header h1 { margin-bottom: 1.2rem; }
.blog-detail .blog-deck { color: var(--blog-muted); font-size: 1.125rem; line-height: 1.7; }
.blog-detail .quick-info { font-size: .8rem; line-height: 1.8; display: flex; flex-wrap: wrap; gap: .5rem; margin: 1rem 0 1.5rem; }
.blog-detail .quick-info span { padding-right: .8rem; }
.blog-detail > article > header img { border-radius: 12px; max-width: 100%; height: auto; }
.blog-reading-grid { display: grid; grid-template-columns: minmax(0, 720px) minmax(240px, 280px); justify-content: center; align-items: start; gap: 3rem; }
.blog-reading-column { min-width: 0; }
.blog-reading-column #target { overflow-wrap: anywhere; }
.blog-reading-column #target p, .blog-reading-column #target li { font-size: 1.0625rem; line-height: 1.7; }
.blog-reading-column #target p, .blog-reading-column #target ul, .blog-reading-column #target ol { margin-bottom: 1.2rem; }
.blog-reading-column #target li { margin-bottom: .5rem; }
.blog-reading-column #target h2 { margin: 2.5rem 0 1rem; scroll-margin-top: 6rem; }
.blog-reading-column #target h3 { margin: 1.8rem 0 .8rem; }
.blog-reading-column #target img { max-width: 100%; height: auto; }
.blog-reading-column #target blockquote { padding: 1.25rem 1.5rem; border-left: 3px solid var(--blog-blue); background: #f0f5fa; border-radius: 0 8px 8px 0; margin: 1.5rem 0; }
.blog-reading-column #target table { display: block; max-width: 100%; overflow-x: auto; font-size: .95rem; }
.blog-reading-column #target th, .blog-reading-column #target td { padding: .75rem; border-color: #dce5ec; }
.blog-sidebar { position: sticky; top: 6rem; }
.blog-design .blog-promo { padding: 1.6rem; border: 1px solid #d6e4ee; border-radius: 12px; background: linear-gradient(125deg, #f3f7fb, #e5eff9); margin: 2rem 0; font-style: normal; }
.blog-design .blog-promo-image { display: block; width: 100%; height: auto; max-width: 270px; margin: 0 auto 1.25rem; }
.blog-design .blog-promo h2, .blog-design #target .blog-promo h2 { font-size: 1.35rem; margin: 0 0 .8rem; line-height: 1.3; }
.blog-design .blog-promo p, .blog-design #target .blog-promo p { font-size: .95rem; line-height: 1.65; margin-bottom: 1.2rem; color: var(--blog-muted); }
.blog-design .blog-promo small { display: block; font-size: .75rem; line-height: 1.6; color: var(--blog-muted); margin-top: .85rem; }
.blog-design .blog-button { display: inline-flex; align-items: center; justify-content: center; min-height: 48px; padding: .85rem 1.2rem; border-radius: 6px; background: var(--blog-green); color: #fff; font-size: .95rem; font-weight: 700; text-decoration: none !important; text-align: center; line-height: 1.5; }
.blog-design .blog-button:hover { background: #006d4d; color: #fff; }
.blog-design .blog-promo--sidebar { margin: 0; padding: 1.25rem; }
.blog-design .blog-promo--sidebar .blog-button { width: 100%; }
.blog-design .blog-promo--overview { display: flex; align-items: center; gap: 2rem; margin: 1rem 0; padding: 2rem; }
.blog-design .blog-promo--overview .blog-promo-image { width: 32%; margin: 0; }
.blog-design .blog-promo--overview h2, .blog-design .blog-promo--closing h2 { font-size: 1.65rem; }
.blog-design .blog-promo--closing { margin-bottom: 3rem; }
.blog-design .blog-import-label { display: block; margin: 1.25rem 0 .6rem; font-size: .9rem; font-weight: 600; }
.blog-design #blog-import-file { max-width: 100%; font-size: .8rem; }
.blog-design .blog-text-link { border: 0; padding: .5rem 0; background: transparent; color: var(--blog-blue); font-size: .9rem; font-weight: 700; text-decoration: underline; cursor: pointer; }
.blog-design #blog-import-form[aria-busy='true'] { opacity: .7; }
.blog-design .blog-import-status { margin-top: .8rem; }
.blog-related { margin-top: 3rem; }
@media (max-width: 991.98px) {
    .blog-reading-grid { display: block; max-width: 720px; margin-inline: auto; }
    .blog-sidebar { display: none; }
}
@media (max-width: 575.98px) {
    .blog-detail > article, .blog-reading-column #target p, .blog-reading-column #target li { font-size: 1rem; }
    .blog-design h1 { font-size: 2rem; }
    .blog-design h2 { font-size: 1.5rem; }
    .blog-category-hero > .row > .col-6 { width: 100%; }
    .blog-category-hero > .row > .col { display: none; }
    .blog-design .blog-promo--overview { display: block; padding: 1.5rem; }
    .blog-design .blog-promo--overview .blog-promo-image { width: 60%; margin: 0 auto 1rem; }
    .blog-detail .blog-deck { font-size: 1rem; }
    .blog-design .blog-promo { padding: 1.25rem; }
}
@media (prefers-reduced-motion: reduce) {
    .blog-design .blog-articles .card { transition: none; }
    .blog-design .blog-articles a:hover .card { transform: none; }
}

.blog-design #blog-import-form.is-enhanced .blog-import-label { color: var(--blog-blue); text-decoration: underline; cursor: pointer; }
.blog-design #blog-import-form.is-enhanced input[type='file'] { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
.blog-design #blog-import-form.is-enhanced button { display: none; }
.blog-design #blog-import-form:focus-within .blog-import-label { outline: 3px solid var(--blog-blue); outline-offset: 4px; }