.blog-list {
    display: grid;
    gap: 0.9rem;
}

.blog-card,
.blog-post {
    padding: 1.15rem;
}

.blog-card h2,
.blog-post h1 {
    margin: 0 0 0.8rem;
    text-transform: lowercase;
}

.blog-card p,
.blog-post-body p,
.blog-post-body li,
.blog-post-body blockquote {
    color: var(--text-muted);
    line-height: 1.85;
}

.blog-card .tag-row {
    margin: 0.9rem 0;
}

.blog-post {
    max-width: 56rem;
}

.blog-post-header {
    margin-bottom: 1rem;
}

.blog-post-body {
    display: grid;
    gap: 0.9rem;
}

.blog-post-body h2,
.blog-post-body h3,
.blog-post-body h4 {
    margin-bottom: 0.4rem;
    text-transform: lowercase;
}

.blog-post-body code,
.blog-post-body pre {
    font-family: "IBM Plex Mono", monospace;
}

.blog-post-body pre {
    overflow-x: auto;
    padding: 1rem;
    background: #060606;
    border: 1px solid var(--line);
}

.blog-post-body blockquote {
    margin: 0;
    padding-left: 1rem;
    border-left: 2px solid var(--line-strong);
}