/* Blog page specific styles – minimal, building on base.css */
.blog-hero {
  padding: var(--space-11) 0 var(--space-10);
  background: radial-gradient(1200px 600px at 10% -10%, color-mix(in srgb, var(--color-secondary) 20%, transparent), transparent),
              radial-gradient(900px 500px at 100% 0%, color-mix(in srgb, var(--color-primary) 22%, transparent), transparent);
}
.blog-hero p { color: var(--color-text-muted); }
.hero-ctas { margin-top: var(--space-6); display: flex; gap: var(--space-4); flex-wrap: wrap; }

.featured-post { padding: var(--space-10) 0; }
.featured-grid { align-items: center; gap: var(--space-7); }
.featured-media img { width: 100%; height: auto; aspect-ratio: 16 / 10; object-fit: cover; border-radius: var(--radius-lg); }

.posts-list { padding: 0 0 var(--space-12); }
.posts-list h2 { margin-bottom: var(--space-7); }

.post-media { margin-bottom: var(--space-5); }
.post-media img { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; border-radius: var(--radius-md); box-shadow: var(--shadow-sm); }

.post-card:focus-within { outline: 2px solid var(--color-primary-700); outline-offset: 4px; }

/* Reveal on scroll (respects reduced motion by JS check) */
[data-reveal] { opacity: 0; transform: translateY(14px); transition: opacity var(--duration-slow) var(--easing-standard), transform var(--duration-slow) var(--easing-standard); }
[data-reveal].is-visible { opacity: 1; transform: translateY(0); }

@media (max-width: 920px) {
  .featured-grid { display: grid; grid-template-columns: 1fr; }
}

.grid-auto-fit {
    grid-template-columns: repeat(auto-fit, minmax(min(360px, 100%), 1fr));
}