/* ============================================================
   The Long Level — blog styles
   Loaded after styles.css on blog.html and every post page.
   Uses the same tokens (--paper, --ink, --gold, etc.) as the
   main stylesheet, so the blog always matches the rest of the site.
   ============================================================ */

/* ---------- Blog index: post list ---------- */

.post-list { list-style: none; margin: 0; padding: 0; }
.post-item { padding: 34px 0; border-bottom: 1px solid var(--line); }
.post-item:first-child { padding-top: 0; }
.post-item:last-child { border-bottom: none; }
.post-meta { text-transform: uppercase; letter-spacing: 0.12em; font-size: 0.78rem; color: var(--gold); margin-bottom: 10px; }
.post-item h2 { font-size: clamp(1.5rem, 2.8vw, 1.95rem); margin-bottom: 12px; }
.post-item h2 a { color: var(--ink); text-decoration: none; }
.post-item h2 a:hover { color: var(--green-deep); }
.post-item .excerpt { color: var(--ink-soft); margin-bottom: 14px; }
.read-more { font-size: 1rem; letter-spacing: 0.02em; text-decoration: none; border-bottom: 1px solid var(--gold); padding-bottom: 2px; }

/* ---------- Blog index: Substack feed ---------- */

.substack-band { background: var(--paper-deep); border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.feed-list { list-style: none; margin: 0 0 30px; padding: 0; text-align: left; }
.feed-list li { padding: 18px 0; border-bottom: 1px solid var(--line); }
.feed-list li:last-child { border-bottom: none; }
.feed-list .post-meta { margin-bottom: 4px; }
.feed-list a.feed-title { font-family: 'Playfair Display', Georgia, serif; font-size: 1.2rem; font-weight: 600; color: var(--ink); text-decoration: none; }
.feed-list a.feed-title:hover { color: var(--green-deep); }
.feed-list .feed-excerpt { color: var(--ink-soft); font-size: 1rem; margin: 6px 0 0; }
.feed-status { color: var(--ink-soft); font-style: italic; margin-bottom: 18px; }

/* ---------- Single post ---------- */

.post-header { padding: 72px 0 8px; text-align: center; }
.post-header .kicker { display: inline-block; text-transform: uppercase; letter-spacing: 0.16em; font-size: 0.85rem; color: var(--gold); margin-bottom: 16px; }
.post-header h1 { max-width: 18ch; margin-left: auto; margin-right: auto; }
.post-byline { color: var(--ink-soft); font-style: italic; margin-top: 14px; }
.post-body { max-width: 680px; margin: 0 auto; padding: 36px 28px 20px; }

/* Add class="dropcap" to the paragraph that should open with a large initial */
.post-body p.dropcap::first-letter { font-family: 'Playfair Display', Georgia, serif; float: left; font-size: 3.4em; line-height: 0.9; padding: 6px 10px 0 0; color: var(--green-deep); }

.post-body .signoff { font-style: italic; text-align: center; margin-top: 2em; }
.post-ornament { text-align: center; color: var(--gold); letter-spacing: 0.6em; margin: 36px 0; }
.post-footer { max-width: 680px; margin: 0 auto; padding: 0 28px 64px; text-align: center; }
.back-link { display: inline-block; margin-bottom: 30px; text-decoration: none; font-size: 1rem; }