.blog-intro { background:var(--paper); border-bottom:1px solid var(--line); padding-block:48px; }
.blog-intro-inner { display:flex; align-items:center; justify-content:space-between; gap:28px; }
.blog-intro .eyebrow { margin-bottom:13px; }
.blog-intro h1 { font-size:36px; }
.blog-posts { max-width:1040px; padding-bottom:70px; }
.blog-back { margin-top:34px; }
.blog-post { display:grid; grid-template-columns:100px minmax(0,1fr); gap:45px; padding-block:60px; border-bottom:1px solid var(--line); }
.blog-post:last-child { border-bottom:0; }
.blog-date { display:block; align-self:start; padding:18px 8px; text-align:center; background:#f0f5e9; border:1px solid #e2eadb; border-radius:8px; color:#67745c; font-size:14px; line-height:1.6; }
.blog-date strong { display:block; color:#517c35; font:400 36px/1.2 var(--heading-font); margin-bottom:8px; }
.blog-copy { min-width:0; }
.blog-title { font-size:36px; margin-bottom:28px; overflow-wrap:anywhere; }
.blog-title a:hover { color:var(--green-deep); }
.blog-body { font-size:20px; line-height:1.8; color:#535e52; overflow-wrap:anywhere; }
.blog-body p { color:inherit; margin-bottom:24px; text-align:left; }
.blog-body p:empty { display:none; }
.blog-body a { color:var(--green-deep); text-decoration:underline; text-underline-offset:3px; }
.blog-body h2,.blog-body h3 { font-size:24px; color:var(--ink); margin-block:32px 18px; }
.blog-body h4,.blog-body h5 { font:500 20px/1.3 var(--heading-font); margin-block:25px 16px; }
.blog-body img { max-width:100%; height:auto; border-radius:6px; }
.blog-body pre { max-width:100%; overflow:auto; padding:22px; border:1px solid var(--line); border-radius:8px; background:var(--paper); color:#4e6341; font-size:14px; line-height:1.7; margin-block:24px; }
.blog-body code { font-size:.85em; background:#edf4e7; padding:2px 5px; border-radius:3px; }
.blog-body pre code { padding:0; background:none; }
.blog-body ul,.blog-body ol { padding-left:26px; margin-block:20px 26px; }
.blog-body li { margin-bottom:10px; }
.blog-signature { text-align:right; margin-top:32px; }
.blog-signature img { width:260px; height:auto; }
@media (max-width:700px) {
    .blog-intro { padding-block:32px; }
    .blog-intro-inner { align-items:flex-start; flex-direction:column; gap:24px; }
    .blog-intro h1,.blog-title { font-size:30px; }
    .blog-post { grid-template-columns:minmax(0,1fr); gap:20px; padding-block:38px; }
    .blog-date { display:flex; align-items:baseline; gap:7px; width:max-content; padding:0; background:none; border:0; font-size:14px; }
    .blog-date strong { font:600 14px/1.6 var(--body-font); margin:0; }
    .blog-date br { display:none; }
    .blog-date span { word-spacing:3px; }
    .blog-title { margin-bottom:22px; }
    .blog-body { font-size:20px; line-height:1.75; }
    .blog-posts { padding-bottom:30px; }
}