/* Blog pages. Uses the design tokens from main.css. */
.blog-hero{padding-block:56px 40px;background:var(--surface-alt);border-bottom:1px solid var(--line)}
.blog-hero__h1{font-family:var(--font);font-size:clamp(28px,4.5vw,44px);line-height:1.12;max-width:20ch;margin:8px 0 14px}
.blog-hero__sub{max-width:62ch;color:var(--ink-soft);font-size:18px;line-height:1.55}

.blog-grid{display:grid;gap:24px;grid-template-columns:repeat(auto-fill,minmax(min(100%,320px),1fr))}
.blog-card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;display:flex;flex-direction:column;box-shadow:var(--shadow-sm)}
.blog-card__img{display:block;background:var(--surface-alt);aspect-ratio:1024/536}
.blog-card__img img{display:block;width:100%;height:100%;object-fit:cover}
.blog-card__body{padding:18px 20px 22px;display:flex;flex-direction:column;gap:8px}
.blog-card__meta,.blog-card__date{margin:0;font-size:13px;color:var(--ink-faint);font-family:var(--mono);letter-spacing:.01em}
.blog-card__title{margin:0;font-family:var(--font);font-size:20px;line-height:1.25}
.blog-card__title a{color:var(--ink);text-decoration:none}
.blog-card__title a:hover{color:var(--brand-dark);text-decoration:underline}
.blog-card__excerpt{margin:0;color:var(--ink-soft);line-height:1.55}
.blog-pager{display:flex;justify-content:center;align-items:center;gap:20px;margin-top:36px;color:var(--ink-soft)}
.blog-empty{color:var(--ink-soft);font-size:18px}

.blog-crumb{font-size:14px;color:var(--ink-faint);margin:0 0 14px}
.blog-crumb a{color:var(--ink-soft)}
.blog-post__head{padding-top:44px;max-width:780px}
.blog-post__h1{font-family:var(--font);font-size:clamp(28px,4.6vw,42px);line-height:1.15;margin:0 0 12px}
.blog-post__meta{color:var(--ink-faint);font-size:14px;margin:0 0 24px}
.blog-post__hero{max-width:780px;margin:0 auto 28px;padding-inline:var(--gutter)}
.blog-post__hero img{display:block;width:100%;height:auto;border-radius:var(--radius);aspect-ratio:1024/536;object-fit:cover;background:var(--surface-alt)}
.blog-post__body{max-width:780px;padding-bottom:56px;font-family:var(--font-body);font-size:18px;line-height:1.7;color:var(--ink)}
.blog-post__body h2{font-family:var(--font);font-size:26px;line-height:1.25;margin:40px 0 12px}
.blog-post__body h3{font-family:var(--font);font-size:19px;margin:22px 0 6px}
.blog-post__body p{margin:0 0 16px}
.blog-post__body ul{margin:0 0 18px;padding-left:22px}
.blog-post__body li{margin-bottom:8px}
.blog-post__body a{color:var(--brand-dark);text-underline-offset:3px}
.blog-lead{font-size:20px;line-height:1.6;color:var(--ink-soft)}
.blog-faq{border-top:1px solid var(--line);margin-bottom:24px}
.blog-cta{margin-top:40px;padding:26px 28px;border-radius:var(--radius);background:var(--surface-dark);color:#fff}
.blog-cta h2{margin:0 0 8px;color:#fff;font-size:24px}
.blog-cta p{color:#d9dbe0;margin:0 0 16px}
.blog-related__h{font-family:var(--font);font-size:26px;margin:0 0 20px}
@media (max-width:600px){.blog-post__body{font-size:17px}.blog-lead{font-size:18px}}