.blog-hero {
  background: var(--blauw);
  color: white;
  padding: 56px 0;
  text-align: center;
}
.blog-hero h1 { font-size: 34px; font-weight: 800; margin-bottom: 8px; }
.blog-hero p { color: rgba(255,255,255,0.85); font-size: 16px; }

.blog-lijst-sectie { padding: 48px 24px 64px; }

.blog-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
  gap: 28px;
}

.blog-kaart {
  display: block;
  background: white;
  border: 1px solid var(--grijs);
  border-radius: 14px;
  overflow: hidden;
  text-decoration: none;
  color: var(--tekst);
  transition: box-shadow .2s ease, transform .2s ease;
}
.blog-kaart:hover { box-shadow: 0 8px 28px rgba(0,0,0,0.08); transform: translateY(-2px); }

.blog-kaart-afbeelding { aspect-ratio: 16/9; overflow: hidden; background: var(--lichtgrijs); }
.blog-kaart-afbeelding img { width: 100%; height: 100%; object-fit: cover; display: block; }

.blog-kaart-inhoud { padding: 18px 20px 22px; }
.blog-kaart-datum { font-size: 12px; color: var(--tekst-zacht); margin-bottom: 6px; }
.blog-kaart-titel { font-size: 18px; font-weight: 700; color: var(--blauw); margin-bottom: 8px; line-height: 1.35; }
.blog-kaart-samenvatting { font-size: 14px; color: var(--tekst-zacht); line-height: 1.6; }

.blog-paginering {
  display: flex; align-items: center; justify-content: center; gap: 16px;
  margin-top: 40px; font-size: 14px; color: var(--tekst-zacht);
}

.blog-artikel { max-width: 760px; padding: 40px 24px 72px; }
.blog-broodkruimel { margin-bottom: 20px; }
.blog-broodkruimel a { color: var(--tekst-zacht); font-size: 14px; text-decoration: none; }
.blog-broodkruimel a:hover { color: var(--blauw); }

.blog-artikel h1 { font-size: 32px; font-weight: 800; color: var(--blauw); line-height: 1.3; margin-bottom: 12px; }
.blog-artikel-meta { font-size: 14px; color: var(--tekst-zacht); margin-bottom: 24px; }

.blog-artikel-afbeelding { width: 100%; border-radius: 14px; margin-bottom: 28px; display: block; }

.blog-video-wrap { position: relative; width: 100%; padding-top: 56.25%; margin-bottom: 28px; border-radius: 14px; overflow: hidden; }
.blog-video-wrap iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }

/* Inhoud komt uit de tekst-editor (Quill) — algemene leesbare opmaak voor de opgemaakte tekst */
.blog-artikel-inhoud { font-size: 17px; line-height: 1.8; color: var(--tekst); }
.blog-artikel-inhoud p { margin-bottom: 18px; }
.blog-artikel-inhoud h2 { font-size: 24px; font-weight: 800; color: var(--blauw); margin: 36px 0 14px; }
.blog-artikel-inhoud h3 { font-size: 20px; font-weight: 700; color: var(--blauw); margin: 28px 0 12px; }
.blog-artikel-inhoud img { max-width: 100%; border-radius: 10px; margin: 20px 0; }
.blog-artikel-inhoud a { color: var(--oranje); font-weight: 600; }
.blog-artikel-inhoud ul, .blog-artikel-inhoud ol { margin: 0 0 18px 24px; }
.blog-artikel-inhoud li { margin-bottom: 6px; }
.blog-artikel-inhoud blockquote {
  border-left: 4px solid var(--oranje);
  padding: 4px 0 4px 18px;
  margin: 24px 0;
  color: var(--tekst-zacht);
  font-style: italic;
}

@media (max-width: 640px) {
  .blog-hero h1 { font-size: 26px; }
  .blog-artikel h1 { font-size: 26px; }
}