/* blog.css — the data-journalism blog (blog/*.html, revenue spec §8.2).
 * Posts are hand-written static HTML on the house chrome; this file only adds the
 * post/list primitives. Token references only — no new colors. */

/* DRAFT banner: shown on unpublished posts (noindex). Removed, along with the
 * robots noindex meta, only after owner approval. */
.draft-banner {
  background: var(--warn-bg);
  border: 1px solid var(--warn);
  border-radius: var(--r-sm);
  color: var(--warn);
  font-weight: 600;
  padding: var(--s-3) var(--s-4);
  margin-bottom: var(--s-6);
}

/* Post byline / dateline */
.post-meta {
  display: flex;
  flex-wrap: wrap;
  gap: var(--s-3);
  align-items: baseline;
  color: var(--faint);
  font-size: 0.88rem;
  margin-bottom: var(--s-6);
}

/* Big pull-stat inside a post */
.post-stat {
  background: var(--tint);
  border-radius: var(--r-md);
  padding: var(--s-5) var(--s-6);
  margin: var(--s-6) 0;
}
.post-stat .num {
  display: block;
  font-family: var(--font-display);
  font-weight: 700;
  font-size: clamp(2rem, 4vw, 3rem);
  line-height: 1.05;
  color: var(--forest);
}
.post-stat .lbl { color: var(--muted); }

/* Sourcing / methodology note at the foot of a post */
.post-source {
  margin-top: var(--s-7);
  padding-top: var(--s-5);
  border-top: 1px solid var(--line);
  font-size: 0.88rem;
  color: var(--faint);
}

/* Blog index cards */
.blog-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: var(--s-5);
  max-width: 760px;
}
.blog-list li {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--r-md);
  padding: var(--s-5) var(--s-6);
  box-shadow: var(--sh-1);
}
.blog-list h2 { font-size: clamp(1.2rem, 2vw, 1.5rem); margin-bottom: var(--s-2); }
.blog-list h2 a { text-decoration: none; color: var(--ink); }
.blog-list h2 a:hover { color: var(--forest-2); text-decoration: underline; }
.blog-list p { color: var(--muted); margin: 0; }
.blog-tag {
  display: inline-block;
  font-size: 0.78rem;
  font-weight: 600;
  color: var(--gold-dark);
  text-transform: uppercase;
  letter-spacing: 0.06em;
  margin-bottom: var(--s-2);
}