.hdr{display:flex;align-items:center;gap:14px;font-weight:800}
.hdr a{color:var(--fg);text-decoration:none}
.wide{max-width:1120px}
.crumbs{font-size:.9rem;color:var(--muted)}
.crumbs a{color:var(--muted)}
article h2{font-size:1.4rem}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:18px;margin-top:28px}
.post{display:flex;flex-direction:column;gap:8px;padding:20px;border:1px solid var(--line);border-radius:16px;color:var(--fg);text-decoration:none;transition:border-color .15s,transform .15s}
.post:hover{border-color:var(--brand);transform:translateY(-2px)}
.post h2{margin:0;font-size:1.15rem;line-height:1.3}
.post p{margin:0;color:var(--muted);font-size:.95rem;flex:1}
.cat{align-self:flex-start;background:var(--soft);color:var(--accent);font-weight:800;font-size:.75rem;text-transform:uppercase;letter-spacing:.06em;padding:4px 10px;border-radius:999px}
.cta{margin:40px 0 8px;padding:24px;border-radius:16px;background:var(--soft)}
.cta b{font-size:1.2rem;font-weight:900}
.cta p{margin:8px 0 16px}
.btn{display:inline-block;background:var(--brand);color:#fff;font-weight:800;text-decoration:none;padding:12px 22px;border-radius:999px}
.rel{border-top:1px solid var(--line);margin-top:32px}
.rel h2{font-size:1.1rem}
@media (max-width:420px){.grid{grid-template-columns:1fr}}
figure{margin:28px 0}
figure img,.post img{display:block;width:100%;height:auto;border-radius:16px}
.post img{border-radius:10px;margin-bottom:4px}