/* BPC Core – structurele CSS van de widgets. Kleuren, typografie en maten komen uit de Elementor-controls
   (als CSS-variabelen of directe eigenschappen). Hier alleen layout, animaties en positionering. */

:root {
  --bpc-ease: cubic-bezier(.2, .7, .2, 1);
}

/* ---------- Reveal (progressive enhancement: alleen als JS de html-klasse zet) */
.bpc-reveal {
  transition: opacity var(--bpc-reveal-d, 1s) var(--bpc-ease) var(--bpc-reveal-delay, 0ms),
              transform var(--bpc-reveal-d, 1s) var(--bpc-ease) var(--bpc-reveal-delay, 0ms);
}
.bpc-reveal--item { --bpc-reveal-d: .8s; }
html.bpc-js body:not(.elementor-editor-active) .bpc-reveal:not(.is-revealed) {
  opacity: 0;
  transform: translateY(26px);
}
.bpc-reveal.is-revealed { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) {
  .bpc-reveal { transition: none; opacity: 1 !important; transform: none !important; }
}

/* ---------- Zoom bij hover */
.bpc-zoom { display: block; position: absolute; inset: 0; transition: transform 1s var(--bpc-ease); will-change: transform; }
.bpc-has-zoom:hover .bpc-zoom { transform: scale(var(--bpc-zoom, 1.06)); }
.bpc-cover, .bpc-zoom img { display: block; width: 100%; height: 100%; object-fit: cover; }

/* ---------- Knoppen */
.bpc-btn {
  display: inline-flex; align-items: center; justify-content: center;
  text-decoration: none; cursor: pointer; white-space: nowrap;
  border-style: solid; border-width: 0; border-radius: 100px;
  transition: background-color .25s ease, color .25s ease, border-color .25s ease;
  line-height: 1;
}
.bpc-btn:hover, .bpc-btn:focus { text-decoration: none; }

.bpc-editor-note { padding: 12px 14px; border: 1px dashed #b5713a; border-radius: 10px; font: 13px/1.5 sans-serif; color: #7a4a28; background: #fafaf8; }

/* ---------- Kaarten (planner, cases) */
.bpc-card {
  position: relative; display: flex; flex-direction: column; overflow: hidden;
  border: 1px solid transparent; text-decoration: none; color: inherit;
  transition: border-color .25s ease;
}
a.bpc-card:hover { text-decoration: none; color: inherit; }
.bpc-card__media { position: relative; display: block; overflow: hidden; width: 100%; aspect-ratio: 4/3; }
.bpc-card__body { display: flex; flex-direction: column; flex: 1; }
.bpc-card__body > * { display: block; margin: 0; }

/* ---------- Grids */
.bpc-planner__grid, .bpc-steps__grid, .bpc-stats__grid, .bpc-icards__grid {
  display: grid;
  grid-template-columns: repeat(var(--bpc-fill, auto-fill), minmax(min(var(--bpc-min, 210px), 100%), 1fr));
}
.bpc-stats__grid, .bpc-steps__grid, .bpc-icards__grid { --bpc-fill: auto-fit; }
.bpc-cases__grid, .bpc-reviews__grid {
  display: grid;
  /* auto-fit met een ondergrens én een maximum aantal kolommen (--bpc-maxcols) */
  grid-template-columns: repeat(auto-fit, minmax(min(100%, max(var(--bpc-min, 290px), calc((100% - (var(--bpc-maxcols, 3) - 1) * var(--bpc-gap, 22px)) / var(--bpc-maxcols, 3)))), 1fr));
}

/* ---------- Seizoensplanner */
.bpc-badge-soon {
  position: absolute; top: 12px; left: 12px; z-index: 2; border-radius: 100px; white-space: nowrap;
}
.bpc-planner__title { margin: 0; }

/* ---------- Hero slider */
.bpc-hero { position: relative; width: 100%; overflow: hidden; }
.bpc-hero__slides, .bpc-hero__overlay, .bpc-hero__content { position: absolute; inset: 0; }
.bpc-hero__slide { position: absolute; inset: 0; opacity: 0; transition: opacity var(--bpc-hero-fade, 1100ms) ease; }
.bpc-hero__slide.is-active { opacity: 1; z-index: 1; }
.bpc-hero__media { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.bpc-hero__poster { display: none; }
.bpc-hero__overlay {
  z-index: 2; pointer-events: none;
  background: linear-gradient(var(--bpc-ov-angle, 90deg),
    var(--bpc-ov-c1, rgba(20,12,4,.82)) var(--bpc-ov-p1, 0%),
    var(--bpc-ov-c2, rgba(20,12,4,.5)) var(--bpc-ov-p2, 42%),
    var(--bpc-ov-c3, rgba(20,12,4,.12)) var(--bpc-ov-p3, 72%),
    var(--bpc-ov-c4, rgba(20,12,4,.28)) var(--bpc-ov-p4, 100%));
}
.bpc-hero__content { z-index: 3; display: flex; align-items: center; pointer-events: none; }
.bpc-hero__inner { width: 100%; margin: 0 auto; pointer-events: auto; }
.bpc-hero__pill { display: inline-flex; align-items: center; gap: 9px; border: 1px solid transparent; border-radius: 100px; }
.bpc-hero__pill-dot { width: 7px; height: 7px; border-radius: 50%; }
.bpc-hero__title { margin: 0; text-wrap: balance; }
.bpc-hero__body { margin: 0; }
.bpc-hero__buttons { display: flex; flex-wrap: wrap; }
.bpc-hero__arrow {
  position: absolute; top: 50%; transform: translateY(-50%); z-index: 4;
  display: flex; align-items: center; justify-content: center;
  border: 1px solid transparent; border-radius: 50%; padding: 0; cursor: pointer; line-height: 1;
  transition: background-color .25s ease;
  font-family: inherit; appearance: none;
}
.bpc-hero__arrow--prev { left: 20px; }
.bpc-hero__arrow--next { right: 20px; }
.bpc-hero__dots { position: absolute; bottom: 26px; left: 50%; transform: translateX(-50%); z-index: 4; display: flex; }
.bpc-hero__dot { display: block; border: 0; padding: 0; border-radius: 100px; cursor: pointer; transition: background-color .3s, width .3s; appearance: none; }
/* Elementor-kit knopstijlen (.elementor-kit-x button) mogen de dots en pijlen niet opblazen. */
[class*="elementor-kit-"] .bpc-hero__dot, .bpc-hero .bpc-hero__dot { padding: 0; min-height: 0; line-height: 0; font-size: 0; box-shadow: none; }
[class*="elementor-kit-"] .bpc-hero__arrow, .bpc-hero .bpc-hero__arrow { padding: 0; min-height: 0; line-height: 1; box-shadow: none; }
@media (max-width: 767px) {
  .bpc-hero--hide-arrows-mobile .bpc-hero__arrow { display: none; }
  .bpc-hero--novideo-mobile .bpc-hero__video { display: none; }
  .bpc-hero--novideo-mobile .bpc-hero__poster { display: block; }
}

/* ---------- Eerstvolgende gelegenheid */
.bpc-next--banner {
  position: relative; overflow: hidden;
  display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between;
  background: linear-gradient(var(--bpc-gangle, 115deg), var(--bpc-g1, #16233f), var(--bpc-g2, #2c4570));
}
.bpc-next__circle { position: absolute; top: -60px; right: -30px; width: 260px; height: 260px; border-radius: 50%; pointer-events: none; }
.bpc-next__left { position: relative; flex: 1 1 420px; min-width: 0; }
.bpc-next__badge { display: inline-flex; align-items: center; gap: 9px; border-radius: 100px; }
.bpc-next__badge-dot { width: 7px; height: 7px; border-radius: 50%; flex: none; }
.bpc-next__title { margin: 0; }
.bpc-next__meta { margin: 0; }
.bpc-next__meta a { text-decoration: underline; text-underline-offset: 3px; transition: color .2s ease; }
.bpc-next__buttons { position: relative; display: flex; flex-wrap: wrap; }
.bpc-next--badge .bpc-next__badge { margin-bottom: 0; }
.bpc-next__badge--plain { background: none; padding: 0; border-radius: 0; }

/* ---------- Countdown */
.bpc-countdown-wrap { display: flex; width: 100%; }
.bpc-countdown { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); width: 100%; }
.bpc-countdown--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.bpc-countdown__tile { display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; min-width: 0; border-style: solid; border-width: 0; }
.bpc-countdown__num { display: block; font-variant-numeric: tabular-nums; }
.bpc-countdown__label { display: block; }

/* ---------- Beeldkaarten */
.bpc-icard { position: relative; display: flex; flex-direction: column; overflow: hidden; text-decoration: none; color: inherit; border: 0 solid transparent; transition: border-color .25s ease; }
a.bpc-icard:hover { text-decoration: none; color: inherit; }
.bpc-icard--under { border-width: 1px; }
.bpc-icard__media { position: relative; display: block; width: 100%; overflow: hidden; }
.bpc-icard--overlay .bpc-icard__media { position: absolute; inset: 0; aspect-ratio: auto; }
.bpc-icard--overlay { aspect-ratio: var(--bpc-ratio, 9/11); }
.bpc-icard--overlay .bpc-icard__overlay {
  position: absolute; inset: 0; pointer-events: none;
  background: linear-gradient(to top,
    var(--bpc-ov-c1, rgba(28,16,8,.92)) var(--bpc-ov-p1, 6%),
    var(--bpc-ov-c2, rgba(28,16,8,.28)) var(--bpc-ov-p2, 52%),
    var(--bpc-ov-c3, transparent) var(--bpc-ov-p3, 78%));
}
.bpc-icard__body { position: relative; display: flex; flex-direction: column; flex: 1; z-index: 1; }
.bpc-icard--overlay .bpc-icard__body { justify-content: flex-end; height: 100%; }
.bpc-icard__title, .bpc-icard__text, .bpc-icard__link { display: block; margin: 0; }
.bpc-icard--under .bpc-icard__text { flex: 1; }

/* ---------- Logo marquee */
@keyframes bpc-marquee { from { transform: translateX(0); } to { transform: translateX(-50%); } }
.bpc-marquee { width: 100%; }
.bpc-marquee__label { text-align: center; }
.bpc-marquee__mask {
  overflow: hidden;
  -webkit-mask-image: linear-gradient(90deg, transparent, #000 var(--bpc-mask, 12%), #000 calc(100% - var(--bpc-mask, 12%)), transparent);
  mask-image: linear-gradient(90deg, transparent, #000 var(--bpc-mask, 12%), #000 calc(100% - var(--bpc-mask, 12%)), transparent);
}
.bpc-marquee__track { display: flex; width: max-content; align-items: center; animation: bpc-marquee 34s linear infinite; }
.bpc-marquee__set { display: flex; align-items: center; flex: none; }
.bpc-marquee__name { white-space: nowrap; }
.bpc-marquee__logo { display: block; width: auto; height: 28px; object-fit: contain; }
@media (prefers-reduced-motion: reduce) { .bpc-marquee__track { animation-play-state: paused; } }

/* ---------- Cases */
.bpc-case__badge { position: absolute; top: 14px; left: 14px; z-index: 2; border-radius: 100px; white-space: nowrap; }
.bpc-case__company { margin: 0; }
.bpc-case__result { flex: 1; }
.bpc-case__quote { border-top: 1px solid transparent; }
.bpc-case__link { transition: color .2s ease; }
.bpc-case--compact .bpc-case__result, .bpc-case--compact .bpc-case__quote, .bpc-case--compact .bpc-case__badge, .bpc-case--compact .bpc-case__link { display: none; }

/* ---------- Case detail */
.bpc-cd { display: flex; flex-direction: column; align-items: stretch; }
.bpc-cd > * { margin: 0; }
.bpc-cd__part { width: 100%; max-width: var(--bpc-cd-w, 1000px); margin-left: auto; margin-right: auto; box-sizing: border-box; }
.bpc-cd__badges { display: flex; flex-wrap: wrap; align-items: center; }
.bpc-cd__badge { display: inline-block; white-space: nowrap; line-height: 1.2; }
.bpc-cd__title { text-wrap: balance; }
.bpc-cd__image { position: relative; overflow: hidden; width: 100%; max-width: var(--bpc-cd-imgw, 1200px); margin-left: auto; margin-right: auto; }
.bpc-cd__image img { position: absolute; inset: 0; width: 100%; height: 100%; }
.bpc-cd__cols { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(var(--bpc-min, 260px), 100%), 1fr)); }
.bpc-cd__col-text > :first-child { margin-top: 0; }
.bpc-cd__col-text > :last-child { margin-bottom: 0; }
.bpc-cd__col-text p { margin: 0 0 .8em; }
.bpc-cd__gallery { display: grid; grid-template-columns: repeat(var(--bpc-cols, 2), minmax(0, 1fr)); }
.bpc-cd__gallery img { display: block; width: 100%; height: 100%; object-fit: cover; }
.bpc-cd__quote { border: 1px solid transparent; }
.bpc-cd__quote-text { margin: 0; text-wrap: balance; }
.bpc-cd__quote-name { display: block; font-style: normal; }
.bpc-cd__content > :first-child { margin-top: 0; }
.bpc-cd__content > :last-child { margin-bottom: 0; }
.bpc-cd__cta { display: flex; }

/* ---------- Reviews */
.bpc-review { display: flex; flex-direction: column; border: 1px solid transparent; }
.bpc-review__name { margin: 0; }
.bpc-review__text { flex: 1; }
.bpc-review__text p { margin: 0 0 .6em; }
.bpc-review__text p:last-child { margin: 0; }
.bpc-review__source { border-top: 1px solid transparent; }
.bpc-review__stars { letter-spacing: .08em; line-height: 1; }

/* ---------- Stappen en stats */
.bpc-step { display: flex; flex-direction: column; align-items: flex-start; border: 1px solid transparent; }
.bpc-step__num { display: flex; align-items: center; justify-content: center; flex: none; }
.bpc-step__title, .bpc-step__text { margin: 0; }
.bpc-stat__num, .bpc-stat__label { display: block; }

/* ---------- Checklist */
.bpc-check { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; }
.bpc-check__item { display: flex; align-items: flex-start; }
.bpc-check__icon { flex: none; display: flex; align-items: center; justify-content: center; border-radius: 50%; line-height: 1; }

/* ---------- Heading */
.bpc-heading { margin: 0; }

/* ---------- Linklijst */
.bpc-linklist__items { display: flex; flex-direction: column; }
.bpc-linklist__text { display: inline-block; text-decoration: none; transition: color .2s ease; }
a.bpc-linklist__text:hover { text-decoration: none; }

/* ---------- WhatsApp-knop (widget) */
.bpc-wa-wrap { display: flex; }
.bpc-btn--wa svg { flex: none; }

/* ---------- Zwevende WhatsApp-knop */
.bpc-wa {
  position: fixed; bottom: 22px; right: 22px; z-index: 9000;
  display: flex; align-items: center; gap: 10px; text-decoration: none;
}
.bpc-wa--left { right: auto; left: 22px; flex-direction: row-reverse; }
.bpc-wa__btn {
  display: flex; align-items: center; justify-content: center;
  width: 56px; height: 56px; border-radius: 50%;
  background: var(--bpc-wa-color, #25D366); color: #fff;
  box-shadow: 0 10px 24px rgba(0,0,0,.18);
  transition: transform .25s var(--bpc-ease);
}
.bpc-wa__btn svg { width: 28px; height: 28px; }
.bpc-wa:hover .bpc-wa__btn, .bpc-wa:focus-visible .bpc-wa__btn { transform: scale(1.05); }
.bpc-wa__label {
  font-family: 'Mulish', sans-serif; font-weight: 600; font-size: 13px; color: #3a2517;
  background: #ffffff; padding: 9px 14px; border-radius: 100px; white-space: nowrap;
  box-shadow: 0 6px 18px rgba(58,37,23,.14);
  opacity: 0; transform: translateX(8px); pointer-events: none;
  transition: opacity .25s ease, transform .25s var(--bpc-ease);
}
.bpc-wa--left .bpc-wa__label { transform: translateX(-8px); }
.bpc-wa:hover .bpc-wa__label, .bpc-wa:focus-visible .bpc-wa__label { opacity: 1; transform: none; }
@media (max-width: 767px) {
  .bpc-wa { bottom: 16px; right: 16px; }
  .bpc-wa--left { left: 16px; right: auto; }
  .bpc-wa__label { display: none; }
}

/* ---------- WPForms-bevestiging */
.bpc-confirm { text-align: center; padding: 36px 0; }
.bpc-confirm__icon {
  display: flex; align-items: center; justify-content: center; margin: 0 auto 20px;
  width: 70px; height: 70px; border-radius: 50%;
  background: var(--bpc-form-icon-bg, #eef0f4); color: var(--bpc-form-icon, #16233f);
  font-size: 34px; line-height: 1;
}
.bpc-confirm__title { font-family: 'Newsreader', serif; font-weight: 600; font-size: 29px; line-height: 1.15; color: var(--bpc-form-heading, #3a2517); margin: 0 0 12px; }
.bpc-confirm__text { font-family: 'Mulish', sans-serif; font-size: 16px; line-height: 1.7; color: var(--bpc-form-text, #6a5344); max-width: 400px; margin: 0 auto; }
.bpc-confirm__text p { margin: 0 0 .6em; }
.bpc-confirm__text p:last-child { margin: 0; }

/* ---------- Fallback-archief (zonder Pro/Elementor-template) */
.bpc-archive-fallback { max-width: 1320px; margin: 0 auto; padding: clamp(116px,14vh,160px) clamp(20px,5vw,72px) clamp(52px,7vh,90px); }
.bpc-archive-fallback .bpc-cases__grid { gap: 22px; }
.bpc-archive-fallback .bpc-card { border-color: #e9e7e1; border-radius: 18px; background: #ffffff; }
.bpc-archive-fallback .bpc-card__body { padding: 22px 24px 24px; gap: 9px; }