/* Blog index + post — warm reading view */
body.blog-page { background: var(--bg-blog); color: var(--ink-blog); }
body.blog-page .nav.scrolled { background: rgba(26,26,30,0.78); }
body.blog-page .promise { background: var(--bg-blog); border-top-color: rgba(232,227,216,0.10); }
body.blog-page .promise-cols { border-top-color: rgba(232,227,216,0.10); }
body.blog-page .promise-foot { border-top-color: rgba(232,227,216,0.10); }
body.blog-page .promise-h, body.blog-page .promise-name { color: var(--ink-blog); }

.blog-hero { padding: 160px 0 60px; border-bottom: 1px solid rgba(232,227,216,0.10); }
.blog-hero h1 { font-size: clamp(2.25rem, 5vw, 3.5rem); font-weight: 500; letter-spacing: -0.025em; margin: 12px 0 0; line-height: 1.1; color: var(--ink-blog); }
.blog-hero p { color: var(--ink-blog-2); margin: 22px 0 0; font-size: 1.125rem; line-height: 1.6; max-width: 560px; }

.cats { display: flex; gap: 22px; padding: 28px 0; flex-wrap: wrap; border-bottom: 1px solid rgba(232,227,216,0.08); }
.cats a { font-size: 14px; color: var(--ink-blog-2); }
.cats a.on { color: var(--ink-blog); }

.posts { padding: 24px 0 100px; }
.post-row { display: grid; grid-template-columns: 130px 1fr 80px; gap: 32px; padding: 28px 0; border-bottom: 1px solid rgba(232,227,216,0.08); cursor: pointer; transition: opacity 200ms; align-items: baseline; text-decoration: none; color: inherit; }
.post-row:hover { opacity: 0.7; }
.post-row .date { color: var(--ink-blog-2); font-size: 13px; letter-spacing: 0.04em; font-variant-numeric: tabular-nums; }
.post-row h3 { margin: 0; font-size: 1.25rem; font-weight: 500; letter-spacing: -0.012em; line-height: 1.35; color: var(--ink-blog); }
.post-row .excerpt { color: var(--ink-blog-2); font-size: 14px; line-height: 1.55; margin: 8px 0 0; max-width: 580px; }
.post-row .cat { font-size: 11px; letter-spacing: 0.08em; text-transform: uppercase; color: var(--ink-blog-2); text-align: right; }
@media (max-width: 720px) {
  .post-row { grid-template-columns: 100px 1fr; }
  .post-row .cat { display: none; }
}