/* Blog add-on — loaded only on blog.html and post.html */
.blog-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:36px 28px;padding:56px 0 96px}
.post-card{background:#fff;border:1px solid var(--line);text-decoration:none;color:inherit;display:flex;flex-direction:column;transition:transform .2s,box-shadow .2s}
.post-card:hover{transform:translateY(-4px);box-shadow:0 18px 40px rgba(13,28,48,.10)}
.post-card:hover .filled > img{transform:scale(1.045)}
.post-img{aspect-ratio:16/10;width:100%}
.post-img.filled::after{content:"";position:absolute;inset:10px;border:1px solid rgba(255,255,255,.55);pointer-events:none;z-index:1}
.post-body{padding:22px 24px 26px;flex:1;display:flex;flex-direction:column}
.post-meta{font-size:.75rem;letter-spacing:.14em;text-transform:uppercase;color:var(--green);margin-bottom:10px;font-weight:500}
.post-card h3{font-size:1.45rem;margin-bottom:10px}
.post-card p{color:var(--muted);font-size:.98rem;margin-bottom:18px}
.post-card .card-more{margin-top:auto}

.article{max-width:760px;margin:0 auto;padding:56px 24px 40px}
.article-cover{aspect-ratio:16/9;width:100%;margin-bottom:40px}
.article-cover.filled::after{content:"";position:absolute;inset:12px;border:1px solid rgba(255,255,255,.55);pointer-events:none;z-index:1}
.article h2{font-size:1.9rem;margin:40px 0 14px}
.article p{font-size:1.1rem;line-height:1.8;margin-bottom:18px;color:var(--ink)}
.article-lead p:first-child{font-size:1.25rem;color:var(--navy)}
.article-cta{max-width:760px;margin:0 auto 96px;padding:36px 40px;background:var(--sand);border:1px solid var(--line);display:flex;flex-wrap:wrap;gap:14px;align-items:center;justify-content:space-between}
.article-cta h3{font-size:1.6rem;flex:1 1 280px}
.article-cta .btns{display:flex;gap:12px;flex-wrap:wrap}
.more-posts{border-top:1px solid var(--line);background:#fff}
.more-posts .blog-grid{grid-template-columns:repeat(2,1fr);padding-bottom:0}

@media(max-width:900px){
  .blog-grid{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:560px){
  .blog-grid,.more-posts .blog-grid{grid-template-columns:1fr}
  .article p{font-size:1.05rem}
  .article-cta{padding:28px 22px;margin:0 16px 64px}
}
