/* Verberg de originele Elementor header */
header.elementor-location-header,
.elementor-location-header,
#masthead,
.site-header,
header.site-header {
  display: none !important;
}
#bb {
  width: 100vw !important;
  position: relative !important;
  left: 50% !important;
  transform: translateX(-50%) !important;
}
/* Achtergrond van de contact-sectie */
.elementor-location-single .elementor-widget-form,
.page-id-37 .elementor-widget-form {
  background: transparent;
}
 
/* Formuliervelden */
.elementor-field-group input,
.elementor-field-group textarea,
.elementor-field-group select {
  background: #161616 !important;
  border: 1px solid #2a2a2a !important;
  border-radius: 0 !important;
  color: #ffffff !important;
  padding: 14px 16px !important;
  font-size: 14px !important;
  font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif !important;
  transition: border-color .2s !important;
  box-shadow: none !important;
}
 
.elementor-field-group input:focus,
.elementor-field-group textarea:focus,
.elementor-field-group select:focus {
  border-color: #00e5a0 !important;
  outline: none !important;
  box-shadow: none !important;
}
 
/* Placeholder tekst */
.elementor-field-group input::placeholder,
.elementor-field-group textarea::placeholder {
  color: rgba(255,255,255,0.3) !important;
}
 
/* Labels */
.elementor-field-label {
  color: rgba(255,255,255,0.4) !important;
  font-size: 10px !important;
  letter-spacing: 2px !important;
  text-transform: uppercase !important;
  font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif !important;
}
 
/* Verstuur-knop */
.elementor-button.elementor-size-md,
.elementor-field-type-submit .elementor-button {
  background: #00e5a0 !important;
  color: #0c0c0c !important;
  border: none !important;
  border-radius: 0 !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  letter-spacing: 3px !important;
  text-transform: uppercase !important;
  padding: 16px 36px !important;
  transition: background .2s !important;
  font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif !important;
}
 
.elementor-button.elementor-size-md:hover,
.elementor-field-type-submit .elementor-button:hover {
  background: #00ffb3 !important;
}
 
/* Succes- en foutmeldingen */
.elementor-message.elementor-message-success {
  background: rgba(0,229,160,0.1) !important;
  border-left: 3px solid #00e5a0 !important;
  color: #00e5a0 !important;
  border-radius: 0 !important;
}
.elementor-message.elementor-message-error {
  background: rgba(255,80,80,0.1) !important;
  border-left: 3px solid #ff5050 !important;
  color: #ff5050 !important;
  border-radius: 0 !important;
}
#bbp {
  width: 100vw !important;
  position: relative !important;
  left: 50% !important;
  transform: translateX(-50%) !important;
}
/* ================================================
   BLINGBOOST — Automatische WordPress Blogpagina
   Plak dit in: Uiterlijk → Aanpassen → Extra CSS
   ================================================ */

/* Pagina achtergrond donker maken */
.blog body,
.home body {
  background: #0c0c0c !important;
}

/* Verberg de standaard paginatitel "Blogs" */
.blog .entry-title,
.blog .page-title,
.blog h1.page-title {
  display: none !important;
}

/* Hoofdcontainer */
.blog .site-main,
.blog #main,
.blog .content-area {
  background: #0c0c0c !important;
  padding: 0 !important;
  max-width: 100% !important;
}

/* Blog grid van posts */
.blog .posts-grid,
.blog .site-main > .blog,
.blog article,
.blog .post {
  background: #0c0c0c !important;
}

/* Elk artikel als kaart */
.blog article.post,
.blog article.type-post {
  background: #161616 !important;
  border: none !important;
  border-radius: 0 !important;
  overflow: hidden;
  transition: background .2s !important;
  margin-bottom: 3px !important;
}
.blog article.post:hover {
  background: #1a1a1a !important;
}

/* Uitgelichte afbeelding */
.blog .post-thumbnail img,
.blog .wp-post-image {
  width: 100% !important;
  aspect-ratio: 16/9 !important;
  object-fit: cover !important;
  display: block !important;
}

/* Post content wrapper */
.blog .entry-summary,
.blog .post-content,
.blog .entry-content {
  padding: 24px !important;
  background: transparent !important;
}

/* Categorie tag */
.blog .cat-links a,
.blog .post-categories a {
  display: inline-block !important;
  background: #00e5a0 !important;
  color: #0c0c0c !important;
  font-size: 9px !important;
  font-weight: 700 !important;
  letter-spacing: 3px !important;
  text-transform: uppercase !important;
  padding: 4px 10px !important;
  text-decoration: none !important;
  border-radius: 0 !important;
  margin-bottom: 10px !important;
}

/* Datum */
.blog .posted-on,
.blog .entry-date,
.blog time {
  font-size: 10px !important;
  letter-spacing: 2px !important;
  color: rgba(255,255,255,.35) !important;
  text-transform: uppercase !important;
  font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif !important;
}

/* Post titel */
.blog h2.entry-title,
.blog .entry-title {
  display: block !important;
  font-size: clamp(16px, 4vw, 22px) !important;
  font-weight: 800 !important;
  line-height: 1.2 !important;
  margin-bottom: 10px !important;
  margin-top: 8px !important;
  text-transform: uppercase !important;
  letter-spacing: -.5px !important;
}
.blog h2.entry-title a,
.blog .entry-title a {
  color: #fff !important;
  text-decoration: none !important;
  transition: color .2s !important;
}
.blog h2.entry-title a:hover,
.blog .entry-title a:hover {
  color: #00e5a0 !important;
}

/* Excerpt tekst */
.blog .entry-summary p,
.blog .entry-excerpt {
  font-size: 13px !important;
  color: rgba(255,255,255,.55) !important;
  line-height: 1.7 !important;
  font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif !important;
}

/* Lees meer link */
.blog .more-link,
.blog a.more-link,
.blog .read-more a {
  display: inline-block !important;
  margin-top: 14px !important;
  font-size: 10px !important;
  font-weight: 700 !important;
  letter-spacing: 2px !important;
  text-transform: uppercase !important;
  color: #00e5a0 !important;
  text-decoration: none !important;
  background: transparent !important;
  padding: 0 !important;
  border: none !important;
  border-radius: 0 !important;
}
.blog .more-link::after {
  content: ' →' !important;
}

/* Grid layout — 2 kolommen op tablet, 3 op desktop */
@media (min-width: 600px) {
  .blog .site-main,
  .blog #main {
    display: grid !important;
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 3px !important;
    padding: 24px !important;
  }
}
@media (min-width: 1024px) {
  .blog .site-main,
  .blog #main {
    grid-template-columns: repeat(3, 1fr) !important;
    padding: 32px 56px !important;
  }
}

/* Paginering */
.blog .nav-links,
.blog .pagination {
  grid-column: 1 / -1 !important;
  display: flex !important;
  gap: 8px !important;
  justify-content: center !important;
  padding: 32px 0 !important;
}
.blog .page-numbers {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 40px !important;
  height: 40px !important;
  border: 1px solid #2a2a2a !important;
  color: rgba(255,255,255,.5) !important;
  text-decoration: none !important;
  font-size: 13px !important;
  transition: border-color .2s, color .2s !important;
  background: transparent !important;
  border-radius: 0 !important;
}
.blog .page-numbers:hover,
.blog .page-numbers.current {
  border-color: #00e5a0 !important;
  color: #00e5a0 !important;
}

/* Individuele blogpost stijl */
.single-post body {
  background: #0c0c0c !important;
}
.single-post .site-main,
.single-post #main {
  background: #0c0c0c !important;
  max-width: 800px !important;
  margin: 0 auto !important;
  padding: 40px 24px 80px !important;
}
.single-post .entry-title {
  font-size: clamp(28px, 7vw, 52px) !important;
  font-weight: 900 !important;
  text-transform: uppercase !important;
  line-height: .95 !important;
  letter-spacing: -1px !important;
  color: #fff !important;
  margin-bottom: 24px !important;
}
.single-post .entry-content h2 {
  font-size: clamp(20px, 5vw, 28px) !important;
  font-weight: 900 !important;
  text-transform: uppercase !important;
  color: #fff !important;
  margin: 40px 0 16px !important;
}
.single-post .entry-content h3 {
  font-size: 18px !important;
  font-weight: 800 !important;
  color: #fff !important;
  margin: 28px 0 12px !important;
}
.single-post .entry-content p {
  font-size: 15px !important;
  color: rgba(255,255,255,.65) !important;
  line-height: 1.8 !important;
  margin-bottom: 16px !important;
}
.single-post .entry-content p strong {
  color: #fff !important;
}
.single-post .entry-content ul,
.single-post .entry-content ol {
  padding-left: 20px !important;
  margin-bottom: 24px !important;
}
.single-post .entry-content li {
  font-size: 15px !important;
  color: rgba(255,255,255,.65) !important;
  line-height: 1.8 !important;
  margin-bottom: 8px !important;
}
.single-post .entry-content a {
  color: #00e5a0 !important;
}
.single-post .entry-content hr {
  border: none !important;
  border-top: 1px solid #1e1e1e !important;
  margin: 36px 0 !important;
}
.single-post .post-thumbnail img {
  width: 100% !important;
  aspect-ratio: 16/9 !important;
  object-fit: cover !important;
  margin-bottom: 32px !important;
}