.blog{max-width:1160px;margin:auto;padding:42px 24px 0}
.crumb{color:var(--text-3);font-size:.92rem}
.crumb a{color:var(--text-2)}
.blog-hero{max-width:760px;margin-top:8px}
.blog-hero h1{margin:14px 0 0;color:var(--text-1);font-size:clamp(2rem,4.6vw,3rem);line-height:1.1;letter-spacing:-.03em}
.blog-hero p{margin-top:16px;color:var(--text-2);font-size:1.1rem;line-height:1.6}
.blog-trust{margin-top:10px;color:var(--text-3);font-size:.9rem}
.blog-trust a{color:var(--brand)}
.cats{display:flex;flex-wrap:wrap;gap:10px;margin:28px 0 0}
.cats a{padding:9px 16px;border:1px solid var(--border);border-radius:99px;background:var(--surface);color:var(--text-2);font-size:.9rem;font-weight:600;text-decoration:none;transition:.16s ease}
.cats a:hover{border-color:var(--brand-border);color:var(--brand);background:var(--brand-tint)}
.blog-section{padding:56px 0 0}
.blog-section-head{max-width:640px;margin-bottom:26px}
.blog-section-head h2{margin:0;color:var(--text-1);font-size:clamp(1.4rem,2.6vw,1.8rem);letter-spacing:-.02em}
.blog-section-head p{margin:8px 0 0;color:var(--text-2);font-size:.98rem;line-height:1.55}
.blog-section-head .view-all{display:inline-block;margin-top:12px;color:var(--brand);font-weight:700;font-size:.92rem;text-decoration:none}
.blog-section-head .view-all:hover{color:var(--brand-hover)}
.grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}
.grid.featured{grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.card{overflow:hidden;border:1px solid var(--border);border-radius:var(--radius-lg);background:var(--surface);transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease}
.card:hover{transform:translateY(-2px);box-shadow:var(--shadow);border-color:var(--border-2)}
.card img{display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:cover}
.card div{padding:18px}
.card small{display:inline-block;padding:4px 10px;border-radius:99px;background:var(--brand-soft);color:var(--brand);font-weight:700;font-size:.76rem;letter-spacing:.01em}
.card h2,.card h3{margin:10px 0 0;font-size:1.15rem;letter-spacing:-.015em}
.card h2 a,.card h3 a{color:var(--text-1);text-decoration:none}
.card h2 a:hover,.card h3 a:hover{color:var(--brand)}
.card p{margin-top:8px;color:var(--text-2);line-height:1.5;font-size:.95rem}
.card time{display:block;margin-top:10px;color:var(--text-3);font-size:.85rem}
.featured-related{margin-top:10px;font-size:.85rem}
.featured-related a{color:var(--brand);font-weight:700;text-decoration:none}
.featured-related a:hover{color:var(--brand-hover)}
.blog-cta{margin-top:64px;padding:48px 40px;border-radius:var(--radius-lg);background:linear-gradient(135deg,var(--brand-2),var(--brand));color:#fff;text-align:center}
.blog-cta h2{margin:0;font-size:clamp(1.5rem,3vw,2.1rem);letter-spacing:-.02em}
.blog-cta a.btn-cta{display:inline-flex;align-items:center;justify-content:center;margin-top:22px;padding:0 26px;min-height:48px;border-radius:var(--radius-sm);background:#fff;color:var(--brand);font-weight:700;font-size:15px;text-decoration:none;box-shadow:0 10px 24px hsl(236 64% 20% / .25)}
.blog-cta a.btn-cta:hover{background:var(--brand-tint)}
.site-footer.blog-footer{margin-top:64px}
@media(max-width:900px){.grid,.grid.featured{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:620px){.blog{padding:28px 18px 0}.grid,.grid.featured{grid-template-columns:1fr}.blog-cta{padding:36px 22px}}