/* Blog listing */
.blog-page { padding: 48px 0 80px; }
.blog-header { max-width: 60ch; margin-bottom: 32px; }
.blog-header h1 { font-size: clamp(1.9rem, 3vw, 2.6rem); font-weight: 500; margin-top: 6px; }

.pillar-filter {
  display: flex;
  gap: 10px;
  margin-bottom: 40px;
  flex-wrap: wrap;
}
.pillar-filter a {
  text-decoration: none;
  color: var(--sage);
  border: 1px solid var(--sage-line);
  border-radius: 999px;
  padding: 6px 16px;
  font-size: 0.85rem;
  font-weight: 500;
}
.pillar-filter a.active,
.pillar-filter a:hover {
  color: var(--parchment);
  background: var(--pine);
  border-color: var(--pine);
}

.blog-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 20px;
}
@media (max-width: 860px) {
  .blog-grid { grid-template-columns: 1fr; }
}

.empty-state { color: var(--sage); padding: 40px 0; }

/* Article page */
.article-page { padding: 48px 0 80px; }
.article-inner { max-width: 68ch; margin: 0 auto; }
.article-inner .post-pillar { display: inline-block; font-size: 0.78rem; letter-spacing: 0.03em; color: var(--gold); font-weight: 600; margin-bottom: 14px; }
.article-inner h1 { font-size: clamp(2rem, 3.4vw, 2.8rem); font-weight: 500; line-height: 1.2; margin-bottom: 14px; }
.affiliate-note { background: #F1ECDE; border-left: 3px solid var(--gold); border-radius: 4px; padding: 10px 14px; margin: 0 0 24px; color: var(--sage); font-size: 0.84rem; line-height: 1.5; }
.affiliate-note a { color: var(--pine); }
.article-meta { color: var(--sage); font-size: 0.88rem; margin-bottom: 32px; }
.article-hero-img { width: 100%; height: auto; border-radius: 8px; margin-bottom: 32px; display: block; }
.article-body { font-size: 1.05rem; line-height: 1.7; }
.article-body p { margin: 0 0 22px; }
.article-body p a, .article-body li a { color: var(--pine); font-weight: 600; text-decoration: underline; text-decoration-color: var(--gold); text-underline-offset: 3px; }
.article-body p a:hover, .article-body li a:hover { color: var(--gold); }
.article-body h2 { font-size: 1.4rem; font-weight: 500; margin: 40px 0 16px; }
.article-body ul { margin: 0 0 22px; padding-left: 22px; }
.article-body li { margin-bottom: 8px; }

.article-cross-sell {
  margin-top: 48px;
  padding: 24px;
  background: #F1ECDE;
  border-radius: 6px;
}
.article-cross-sell p { margin: 0 0 12px; font-size: 0.92rem; }
.article-cross-sell a { color: var(--pine); font-weight: 600; text-decoration: none; margin-right: 20px; }
.article-cross-sell a:hover { color: var(--gold); }


@media (max-width: 860px) {
  .blog-grid { grid-template-columns: 1fr; }
}

/* Inline article images */
.article-figure { margin: 28px auto; max-width: 480px; }
.article-figure img { width: 100%; height: auto; border-radius: 8px; display: block; }
.article-figure figcaption { font-size: 0.85rem; color: #5b6660; margin-top: 8px; text-align: center; line-height: 1.4; }