/* ==========================================================================
   VANDENBOORN AUTOMOTIVE - header + schermvullend menu (v3)
   Header 1:1 overgenomen van carlink.nl (Bootstrap 5 raster, root 16px).
   Font header: Montserrat (zoals bron). Rest van de site: Poppins.
   Zwart #000000 | wit #FFFFFF | groen #51A04E | creme #FAFAF5
   ========================================================================== */

:root{
  --vdb-font:'Poppins',sans-serif;
  --vdb-hdr-font:'Montserrat',sans-serif;
  --vdb-header-h:133px;
  --vdb-container:1320px;   /* .container @ >=1400px */
  --vdb-gutter:12px;        /* --bs-gutter-x / 2 */
  --vdb-green:#51A04E;
  --vdb-green-hover:#407E3D;
  --vdb-cream:#FAFAF5;
}

/* ---------- Poppins over de rest van de site ---------- */
body,button,input,select,textarea,
h1,h2,h3,h4,h5,h6,
.vdb-btn,.vdb-eyebrow,.vdb-lede,.vdb-muted,
.vdb-clients__item,.vdb-service h3,.vdb-stat__value,.vdb-stat__label,
.vdb-card__title,.vdb-card__sub,.vdb-card__price,.vdb-card__badge,.vdb-invite__link,
.vdb-vcard__title,.vdb-vcard__trim,.vdb-vcard__price,.vdb-vcard__more,.vdb-vcard__status,
.vdb-view button,.vdb-empty h3,
.elementor-button,.elementor-item,.elementor-heading-title,
.jet-filter-label,.jet-search-filter__input{
  font-family:var(--vdb-font)!important;
}

/* ==========================================================================
   1. HEADER  (= carlink <header>)
   ========================================================================== */

/* Buitenste container = <header>. Elementor-eigen breedtebeperking uitzetten. */
.vdb-header.e-con{
  display:block!important;
  --width:100%;max-width:100%;width:100%;
  padding:0!important;margin:0!important;
  background-color:#000000;
  box-sizing:border-box;
  font-family:var(--vdb-hdr-font)!important;
  font-size:16px;line-height:1.5;color:#FFFFFF;
}
.vdb-header .e-con{--width:100%;max-width:100%;--padding:0;--margin:0;}
.vdb-header .e-con > .e-con-inner{display:contents;}
.vdb-header a{text-decoration:none;}
.vdb-header .elementor-widget{margin:0;width:auto;}
.vdb-header .elementor-widget-container{margin:0;padding:0;}
.vdb-header,
.vdb-header .elementor-button,
.vdb-header .elementor-heading-title,
.vdb-header .elementor-button-text{font-family:var(--vdb-hdr-font)!important;}

/* .container + .row + .col in een: max-width per breakpoint, 12px gutter. */
.vdb-header__top.e-con,
.vdb-header__main.e-con{
  display:flex!important;
  flex-direction:row!important;
  flex-wrap:nowrap!important;
  align-items:center;
  width:100%;max-width:var(--vdb-container);
  margin:0 auto!important;
  padding:0 var(--vdb-gutter)!important;
  gap:0;
  box-sizing:border-box;
}

/* .sub-header{padding:1rem 0 .5rem 0}  .main-header{padding:1rem 0} */
.vdb-header__top.e-con{padding-top:16px!important;padding-bottom:8px!important;}
.vdb-header__main.e-con{padding-top:16px!important;padding-bottom:16px!important;}

/* ---------- Regel 1, links: aankondiging (.col-xxl, font 16px/600) ---------- */
.vdb-header__tag{flex:1 0 0%!important;width:auto!important;max-width:none!important;min-width:0;padding:0 var(--vdb-gutter);}
.vdb-header__tag .elementor-heading-title{
  font-size:16px!important;font-weight:600!important;line-height:1.5!important;letter-spacing:0!important;
  text-transform:uppercase!important;color:#FFFFFF!important;margin:0!important;padding:0!important;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}

/* ---------- Regel 1, rechts: CONTACT US (outline) + CALL US (groen) ---------- */
.vdb-header__actions.e-con{
  display:flex!important;flex-direction:row!important;flex-wrap:nowrap!important;
  align-items:center;justify-content:flex-end;
  flex:1 0 0%!important;min-width:0;width:auto!important;max-width:none!important;
  padding:0 var(--vdb-gutter)!important;
  gap:8px!important; /* .ms-2 */
}
.vdb-header .elementor-widget-button{flex:0 0 auto;width:auto;}
.vdb-header .elementor-widget-button .elementor-button-wrapper{line-height:0;}

/* button,.btn basis van carlink */
.vdb-header .elementor-widget-button .elementor-button{
  display:inline-block;
  font-family:var(--vdb-hdr-font)!important;
  font-weight:600!important;line-height:1.2!important;letter-spacing:0!important;
  text-transform:uppercase!important;text-align:center;white-space:nowrap;
  border-radius:10px!important;border:1px solid transparent!important;
  box-shadow:none!important;background-image:none!important;
  transition:all ease .3s;
}
.vdb-header .elementor-button .elementor-button-content-wrapper{display:inline-flex;align-items:center;justify-content:center;gap:0;}

/* .sub-header nav a{font-size:.8rem;padding:.7rem 1.5rem} */
.vdb-cta-line .elementor-button,
.vdb-cta-call .elementor-button{font-size:12.8px!important;padding:11.2px 24px!important;}

/* .btn-outline */
.vdb-cta-line .elementor-button{background-color:transparent!important;color:#FFFFFF!important;border-color:#FFFFFF!important;}
.vdb-cta-line .elementor-button:hover,
.vdb-cta-line .elementor-button:focus,
.vdb-cta-line .elementor-button:active{background-color:#FFFFFF!important;color:#000000!important;border-color:#FFFFFF!important;}

/* .btn-green */
.vdb-cta-call .elementor-button{background-color:var(--vdb-green)!important;color:#FFFFFF!important;border-color:var(--vdb-green)!important;}
.vdb-cta-call .elementor-button:hover,
.vdb-cta-call .elementor-button:focus,
.vdb-cta-call .elementor-button:active{background-color:var(--vdb-green-hover)!important;color:#FFFFFF!important;border-color:var(--vdb-green-hover)!important;}

/* ---------- Regel 2: drie gelijke .col's (flex:1 0 0%, 12px gutter) ---------- */
.vdb-header__main > .e-con{
  display:flex!important;flex-direction:row!important;flex-wrap:nowrap!important;
  align-items:center;
  flex:1 0 0%!important;width:auto!important;min-width:0;
  padding:0 var(--vdb-gutter)!important;gap:0!important;
}
.vdb-header__main > .e-con:nth-child(1){justify-content:flex-start;}
.vdb-header__main > .e-con:nth-child(2){justify-content:center;}
.vdb-header__main > .e-con:nth-child(3){justify-content:flex-end;}

/* .btn-tertiary{font-size:1rem;padding:.5rem 2rem;background:#fafaf5} */
.vdb-cta-stock .elementor-button{
  font-size:16px!important;padding:8px 32px!important;
  background-color:var(--vdb-cream)!important;color:#000000!important;border-color:var(--vdb-cream)!important;
}
.vdb-cta-stock .elementor-button:hover,
.vdb-cta-stock .elementor-button:focus,
.vdb-cta-stock .elementor-button:active{background-color:var(--vdb-green)!important;color:#FFFFFF!important;border-color:var(--vdb-green)!important;}

/* ---------- Logo: .main-header .logo img{height:1.7rem;width:auto} ---------- */
.vdb-logo{width:auto;flex:0 0 auto;}
.vdb-logo .elementor-widget-container,
.vdb-logo .elementor-image,
.vdb-logo a{display:block;line-height:0;}
.vdb-logo img{display:block;height:27.2px!important;width:auto!important;max-width:none!important;}

/* ---------- Login: .userGreet{font-weight:600;display:flex} i{margin-left:.5rem;font-size:1.2rem} ---------- */
.vdb-signin{flex:0 0 auto;width:auto!important;max-width:none!important;margin:0!important;padding:0!important;}
.vdb-signin .elementor-button-wrapper{line-height:normal;}
.vdb-signin .elementor-button{
  display:inline-flex!important;align-items:center;
  height:auto;padding:0!important;border:0!important;border-radius:0!important;
  background-color:transparent!important;color:#FFFFFF!important;
  font-size:16px!important;font-weight:600!important;line-height:1.5!important;
  text-transform:none!important;letter-spacing:0!important;
  transition:all ease .3s;
}
.vdb-signin .elementor-button:hover,
.vdb-signin .elementor-button:focus-visible{color:var(--vdb-green)!important;background-color:transparent!important;}
.vdb-signin .elementor-button-content-wrapper{display:inline-flex;align-items:center;gap:0!important;}
.vdb-signin .elementor-button-text{order:1;line-height:1.5;}
.vdb-signin .elementor-button-icon{order:2;display:flex;align-items:center;margin:0 0 0 8px!important;line-height:1;}
.vdb-signin .elementor-button-icon svg,
.vdb-signin .elementor-button-icon i{width:19.2px;height:19.2px;font-size:19.2px;fill:currentColor;color:currentColor;display:block;line-height:1;}

/* ---------- Hamburger: padding-left 1.5rem, box 1.75rem, balkjes 3px/radius 4px, +-8px ---------- */
.vdb-burger{flex:0 0 auto;width:auto;padding-left:24px;}
.vdb-burger .elementor-widget-container{line-height:0;}
.vdb-burger__btn{
  appearance:none;-webkit-appearance:none;
  display:block;position:relative;
  width:28px;height:19px;padding:0;margin:0;
  background:transparent;border:0;border-radius:0;cursor:pointer;
  color:#FFFFFF;box-shadow:none;
  transition:opacity .15s linear;
}
.vdb-burger__btn:focus-visible{outline:2px solid var(--vdb-green);outline-offset:6px;}
.vdb-burger__bar{
  position:absolute;left:0;width:100%;height:3px;
  background:currentColor;border-radius:4px;
  transition:transform .15s ease,opacity .15s ease,top .15s ease;
}
.vdb-burger__bar:nth-child(1){top:0;}
.vdb-burger__bar:nth-child(2){top:8px;}
.vdb-burger__bar:nth-child(3){top:16px;}
.vdb-burger__btn[aria-expanded="true"] .vdb-burger__bar:nth-child(1){top:8px;transform:rotate(45deg);}
.vdb-burger__btn[aria-expanded="true"] .vdb-burger__bar:nth-child(2){opacity:0;}
.vdb-burger__btn[aria-expanded="true"] .vdb-burger__bar:nth-child(3){top:8px;transform:rotate(-45deg);}

/* ==========================================================================
   2. SCHERMVULLEND MENU
   ========================================================================== */
.vdb-menu.e-con{
  position:fixed;left:0;right:0;top:var(--vdb-header-h);bottom:0;
  display:block!important;
  --width:100%;max-width:100%;width:auto;
  padding:0!important;
  background-color:#000000;
  z-index:90;overflow-y:auto;
  opacity:0;visibility:hidden;
  transition:opacity .2s ease,visibility .2s ease;
  font-family:var(--vdb-hdr-font)!important;
}
.vdb-menu.is-open{opacity:1;visibility:visible;}
body.vdb-menu-open{overflow:hidden;}
.vdb-menu .e-con{--width:100%;max-width:100%;}
.vdb-menu .e-con > .e-con-inner{display:contents;}

.vdb-menu__inner.e-con{
  display:flex!important;flex-direction:row!important;align-items:flex-start;
  width:100%;max-width:var(--vdb-container);margin:0 auto;
  padding:72px var(--vdb-gutter) 80px!important;
  gap:48px;box-sizing:border-box;
}
.vdb-menu__nav{flex:1 1 55%;min-width:0;}
.vdb-menu__aside{
  flex:1 1 45%;min-width:0;text-align:right;
  display:flex!important;flex-direction:column!important;gap:40px;
}
.vdb-menu__aside > .e-con{display:flex!important;flex-direction:column!important;gap:12px;align-items:stretch;}

.vdb-menu__nav .elementor-nav-menu{display:flex;flex-direction:column;}
.vdb-menu__nav .elementor-nav-menu li{width:100%;}
.vdb-menu__nav .elementor-nav-menu a.elementor-item{
  font-family:var(--vdb-hdr-font)!important;
  font-size:2.6rem!important;font-weight:700!important;
  line-height:1!important;letter-spacing:0;text-transform:uppercase;
  color:#FFFFFF!important;background-color:transparent!important;
  display:inline-block;width:auto;
  padding:0 0 10px 0!important;margin:0 0 36px 0;
  border-bottom:4px solid transparent;
  transition:border-color .18s ease;
}
.vdb-menu__nav .elementor-nav-menu li:last-child a.elementor-item{margin-bottom:0;}
.vdb-menu__nav .elementor-nav-menu a.elementor-item:hover,
.vdb-menu__nav .elementor-nav-menu a.elementor-item:focus-visible,
.vdb-menu__nav .elementor-nav-menu a.elementor-item.elementor-item-active{
  border-bottom-color:var(--vdb-green);color:#FFFFFF!important;
}

.vdb-menu__aside .elementor-heading-title{
  font-family:var(--vdb-hdr-font)!important;
  font-size:1.25rem;font-weight:700;line-height:1.35;color:#FFFFFF;margin:0;
}
.vdb-menu__aside .elementor-widget-text-editor{
  font-family:var(--vdb-hdr-font)!important;
  font-size:1rem;font-weight:400;line-height:1.5;color:#FFFFFF;
}
.vdb-menu__aside .elementor-widget-text-editor p{margin:0 0 16px;}
.vdb-menu__aside .elementor-widget-text-editor p:last-child{margin-bottom:0;}
.vdb-menu__aside a{color:#FFFFFF;}
.vdb-menu__aside a:hover{color:var(--vdb-green);}
.vdb-menu__aside .vdb-todo{
  background-color:rgba(255,255,255,0.12);color:#E4E4DC;
  font-size:12px;font-weight:600;letter-spacing:0.06em;
  padding:2px 6px;border-radius:2px;display:inline-block;
}

.elementor-editor-active .vdb-menu.e-con,
.elementor-editor-preview .vdb-menu.e-con{position:static;opacity:1;visibility:visible;}

.vdb-menu__nav .elementor-nav-menu--dropdown,
.vdb-menu__nav .elementor-menu-toggle{display:none!important;}
.vdb-menu__nav .elementor-nav-menu--main{display:flex!important;}
.vdb-menu__nav .elementor-nav-menu--main > .elementor-nav-menu{display:flex!important;flex-direction:column!important;}
.vdb-menu__nav nav{display:block!important;}

/* ==========================================================================
   3. RESPONSIVE - Bootstrap-breakpoints van de bron
   .container: 1320 (>=1400) | 1140 (>=1200) | 960 (>=992) | 720 (>=768) | 540 (>=576)
   sub-header: d-none d-md-block | CTA's: d-none d-lg-flex | stocklist: d-none d-md-flex
   ========================================================================== */
@media (max-width:1399.98px){ :root{--vdb-container:1140px;} }
@media (max-width:1199.98px){ :root{--vdb-container:960px;} }
@media (max-width:991.98px){
  :root{--vdb-container:720px;}
  .vdb-header__actions.e-con{display:none!important;}
  .vdb-header__tag{flex:1 1 100%;}
  .vdb-menu__nav .elementor-nav-menu a.elementor-item{font-size:2.2rem!important;margin-bottom:30px;}
}
@media (max-width:767.98px){
  :root{--vdb-container:540px;--vdb-header-h:69px;}
  .vdb-header__top.e-con{display:none!important;}
  /* Bron verbergt de stocklist-kolom; kolom blijft leeg staan zodat het logo gecentreerd blijft. */
  .vdb-header__main > .e-con:nth-child(1) .elementor-widget{visibility:hidden;pointer-events:none;}
  .vdb-menu__inner.e-con{flex-direction:column!important;gap:48px;padding-top:56px!important;}
  .vdb-menu__aside{text-align:left;width:100%;flex:1 1 auto;}
  .vdb-menu__nav{width:100%;flex:1 1 auto;}
  .vdb-menu__nav .elementor-nav-menu a.elementor-item{font-size:1.9rem!important;margin-bottom:26px;}
}
@media (max-width:575.98px){
  :root{--vdb-container:100%;}
  .vdb-header__main > .e-con:nth-child(1){display:none!important;}
  .vdb-header__main > .e-con:nth-child(2){justify-content:flex-start;}
  .vdb-signin .elementor-button-text{display:none;}
  .vdb-signin .elementor-button-icon{margin-left:0!important;}
  .vdb-burger{padding-left:20px;}
  .vdb-menu__nav .elementor-nav-menu a.elementor-item{font-size:1.6rem!important;margin-bottom:22px;border-bottom-width:3px;}
  .vdb-menu__aside .elementor-heading-title{font-size:1.1rem;}
}

@media (prefers-reduced-motion:reduce){
  .vdb-menu.e-con,.vdb-header .elementor-button,.vdb-burger__bar,
  .vdb-menu__nav .elementor-nav-menu a.elementor-item{transition:none;}
}