/* GROW Journal — blog index + article styles. Loaded after club.css (blog.html, blog/*.html). */

/* ---- index: numbered entries ---- */
.entries { list-style: none; margin: 0; padding: 0; border-top: 1.5px solid var(--ink); counter-reset: entry; }
.entry { counter-increment: entry; display: grid; gap: 14px; padding: 36px 0; border-bottom: 1px dashed var(--dash); position: relative; }
@media (min-width: 760px) { .entry { grid-template-columns: 96px 1fr; gap: 32px; padding: 48px 0; } }
.entry .no { font: 700 15px var(--mono); color: var(--signal); }
.entry .no::before { content: counter(entry, decimal-leading-zero); }
.entry h3 a { text-decoration: none; }
.entry h3 a:hover { color: var(--signal); }
.entry p.excerpt { margin-top: 14px; color: var(--ink-80); max-width: 60ch; }
.entry .more { display: inline-block; margin-top: 18px; font: 700 12px var(--mono); letter-spacing: .08em; text-transform: uppercase; text-decoration: none; border-bottom: 2px solid var(--signal); padding-bottom: 3px; }
.entry .more:hover { color: var(--signal); }

/* ---- article ---- */
.article-head { padding: 40px 0 36px; border-bottom: 1.5px solid var(--ink); }
@media (min-width: 760px) { .article-head { padding: 64px 0 48px; } }
.article-head .back { display: inline-block; margin-bottom: 28px; font: 11px var(--mono); letter-spacing: .08em; text-transform: uppercase; text-decoration: none; }
.article-head .back:hover { color: var(--signal); }
.article-head h1 { font-size: clamp(30px, 5.2vw, 64px); max-width: 22ch; line-height: 1; }
.article-body { padding: 48px 0 24px; font-size: 18px; line-height: 1.62; }
@media (min-width: 760px) { .article-body { padding: 72px 0 32px; } }
.article-body.prose { max-width: 68ch; }
.article-body.prose > p:first-of-type { font-size: clamp(19px, 1.8vw, 22px); line-height: 1.5; }
.article-body.prose h2 { font-size: clamp(26px, 3vw, 38px); margin-top: 56px; line-height: 1.02; }
.article-body.prose h3 { font-size: 22px; line-height: 1.1; }
.article-body.prose ul li::marker, .article-body.prose ol li::marker { color: var(--signal); font-weight: 700; }
.article-cta { margin: 48px 0 0; max-width: 68ch; }
.article-cta h3 { font-size: clamp(24px, 3vw, 34px); margin: 0 0 12px; }
.article-cta p { color: var(--ink-80); margin-bottom: 22px; }
.keep-reading { margin-top: 56px; max-width: 68ch; }
.keep-reading ul { list-style: none; margin: 14px 0 0; padding: 0; border-top: 1.5px solid var(--ink); }
.keep-reading li { border-bottom: 1px dashed var(--dash); }
.keep-reading a { display: block; padding: 16px 0; font: clamp(18px, 2vw, 22px)/1.15 var(--head); text-decoration: none; }
.keep-reading a:hover { color: var(--signal); }