.blog-main { padding-bottom: 80px }
.blog-heading { padding-top: 32px; padding-bottom: 40px }
.blog-heading .breadcrumb { margin-bottom: 42px }
.blog-heading h1 {
    max-width: 850px;
    font-size: clamp(2.45rem, 4.4vw, 4rem);
    font-weight: 500;
    line-height: 1.1;
    margin-bottom: 25px;
    overflow-wrap: anywhere
}
.blog-heading h1 em { font-family: Georgia, serif; color: var(--brand-green); font-weight: 400 }
.blog-intro { max-width: 620px; font-size: 1.03rem; line-height: 1.8; margin-bottom: 0 }
.blog-empty { padding: clamp(25px, 4vw, 48px); background: var(--soft); border: 1px solid var(--line); border-radius: 5px }
.blog-empty .icon { color: var(--brand-green); width: 30px; height: 30px; margin-bottom: 20px }
.blog-empty h2 { font-size: clamp(1.5rem, 3vw, 2rem) }
.blog-empty p { margin-bottom: 8px }
.blog-card { padding-bottom: 30px }
.blog-card h3 { margin: 15px 0 }
.blog-card h3 a { text-decoration: none }
.blog-card h3 a:hover { text-decoration: underline }
.blog-card img { aspect-ratio: 3/2; object-fit: cover; width: 100%; border-radius: 5px; margin-bottom: 20px }
.blog-meta { color: var(--muted); font-size: .85rem }
.blog-reading { max-width: 760px; padding-top: 32px; overflow-wrap: anywhere }
.blog-reading .blog-heading { padding-top: 20px }
.blog-reading .blog-heading h1 { font-size: clamp(2.2rem, 4vw, 3.4rem) }
.blog-reading figure { margin: 0 0 35px }
.blog-reading figure img { width: 100%; border-radius: 5px }
.blog-reading figcaption { font-size: .85rem; color: var(--muted); margin-top: 12px }
.blog-prose { font-size: 1.05rem; line-height: 1.85 }
.blog-prose p { color: var(--ink) }
.blog-prose h2 { font-size: 1.9rem; margin: 40px 0 20px }
.blog-prose h3 { font-size: 1.4rem; margin: 30px 0 15px }
.blog-prose a { color: var(--brand-green) }
.blog-prose li + li { margin-top: 8px }
.blog-related { border-top: 1px solid var(--line); padding-top: 26px; margin-top: 36px }
.blog-related h2 { font-size: 1.4rem }
@media(max-width:600px) {
    .blog-main { padding-bottom: 55px }
    .blog-heading .breadcrumb { margin-bottom: 30px }
    .blog-intro { font-size: .96rem }
}