/* ============================================
   Blogpost — Elementor single-post-sjabloon 2935:
   kruimelpad (crème), donkere kop met categorieën + titel, afbeelding en tekst.
   ============================================ */

/* Kruimelpad (Yoast) */
.blog-kruimel { background-color: var(--color-cream); padding: 3px 0; }
.blog-kruimel__inner { display: flex; align-items: center; gap: 14px; }
.blog-kruimel__pad {
  flex: 0 1 auto;
  min-width: 0;
  font-family: var(--font-ui);
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0.5px;
  text-transform: uppercase;
  color: var(--color-white);
}
.blog-kruimel__pad a { color: var(--color-grey); transition: color var(--t-color); }
.blog-kruimel__pad a:hover { color: #f8af77; }

/* Kop */
.blog-post-kop { background-color: var(--color-primary); padding: 80px 0; }
.blog-post-kop__inner {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 25px;
}
.blog-post-kop__meta {
  align-self: flex-start;
  max-width: 100%;
  padding-left: 5px;
  font-family: var(--font-ui);
  font-size: 15px;
  font-weight: 600;
  line-height: 1.7em;
  text-transform: uppercase;
  color: var(--color-accent);
}
.blog-post-kop__meta a { color: var(--color-accent); }
.blog-post-kop__titel {
  width: 100%;
  margin: 0;
  font-family: var(--font-heading);
  font-size: var(--h-primary-size);
  font-weight: 800;
  line-height: var(--h-primary-lh);
  color: var(--color-white);
}

/* Inhoud */
.blog-post-inhoud { padding: 75px 0; }
.blog-post-inhoud__inner { display: flex; flex-direction: column; gap: 14px; }
.blog-post-inhoud__beeld {
  display: block;
  width: 100%;
  max-width: 100%;
  height: 337px;
  object-fit: cover;
  object-position: center center;
}
.blog-post-tekst {
  min-width: 0;
  font-family: var(--font-ui);
  font-size: var(--body-size);
  font-weight: 400;
  line-height: var(--body-lh);
  color: var(--color-text);
}
.blog-post-tekst p { margin: 0; }
.blog-post-tekst hr {
  height: 0;
  margin: 0;
  border: none;
  border-top: 2px solid;
  color: #808080;
  overflow: visible;
}
/* Links in de lopende tekst: niet onderstreept, kleur #111 — in het origineel staat de posttekst in een
   Elementor-sjabloon (".elementor a { text-decoration: none }", kit "a { color: #111 }"); de
   Hello-regel ".page-content a { underline }" geldt daar niet. De huidige posts bevatten geen links. */
.blog-post-tekst a { color: var(--color-text); }

@media (max-width: 767px) {
  .blog-kruimel__pad { font-size: 18px; }
  .blog-post-kop { padding: 30px 15px 25px; }
  .blog-post-kop__inner { align-items: flex-start; gap: 15px; }
  .blog-post-kop__meta { font-size: 16px; line-height: 1.2em; }
  .blog-post-inhoud { padding: 50px 15px; }
}