.post{position:relative;display:flex;flex-direction:column;height:100%;border-radius:var(--radius);overflow:hidden;background:var(--c-surface)}
.post__media{aspect-ratio:16/9;background:var(--c-bg)}
.post__media img,.post__media svg{width:100%;height:100%;object-fit:cover}
.post__body{padding:1rem 1.1rem 1.25rem}
.post__title{margin:0 0 .35rem;font-size:1.05rem}
.post__title a{color:var(--c-text);text-decoration:none}
.post__title a::after{content:"";position:absolute;inset:0}
.post:has(.post__title a:focus-visible){outline:2px solid var(--c-link);outline-offset:2px}
.post__title a:focus-visible{outline:0}
.post:hover .post__title a{color:var(--c-link)}
.post__meta{margin:0 0 .5rem;font-size:.82rem;color:var(--c-muted)}
.post__excerpt{margin:0;font-size:.92rem;color:var(--c-muted)}
.posts{grid-template-columns:1fr}
@media (min-width:750px){.posts{grid-template-columns:repeat(2,1fr)}}
@media (min-width:990px){.posts{grid-template-columns:repeat(3,1fr)}}
.article{max-width:760px;margin-inline:auto}
.article__hero{margin:1rem 0 1.5rem;border-radius:var(--radius);overflow:hidden}
.article__hero img{width:100%;height:auto}
.article__meta{color:var(--c-muted);font-size:.9rem}
.article__author{display:flex;gap:1rem;align-items:flex-start;margin-top:2.5rem;padding:1.25rem;border:1px solid var(--c-border);border-radius:var(--radius);background:var(--c-surface)}
.article__author p{margin:0}
.article__tags{display:flex;flex-wrap:wrap;gap:.5rem;margin:1.5rem 0 0;padding:0;list-style:none}
.article__tags a{display:inline-flex;min-height:36px;align-items:center;padding:.2rem .8rem;border:1px solid var(--c-border);border-radius:999px;color:var(--c-text);text-decoration:none;font-size:.85rem}
.article__nav{display:flex;justify-content:space-between;gap:1rem;margin-top:2rem}
.blog-tags{display:flex;flex-wrap:wrap;gap:.5rem;margin:0 0 1.5rem;padding:0;list-style:none}
.blog-tags a{display:inline-flex;min-height:40px;align-items:center;padding:.3rem .9rem;border:1px solid var(--c-border);border-radius:999px;color:var(--c-text);text-decoration:none}
.blog-tags [aria-current]{background:var(--c-btn);border-color:var(--c-btn);color:var(--c-btn-text)}
.comments{margin-top:2.5rem}
.comment{padding:1rem 0;border-bottom:1px solid var(--c-border)}
