.elementor-34 .elementor-element.elementor-element-1acfbb8b{--display:flex;--min-height:80px;--flex-direction:row;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--align-items:center;--gap:0px 0px;--row-gap:0px;--column-gap:0px;--flex-wrap:wrap;--padding-top:0%;--padding-bottom:0%;--padding-left:2%;--padding-right:2%;--z-index:60;}.elementor-34 .elementor-element.elementor-element-1acfbb8b.e-con{--align-self:center;}.elementor-34 .elementor-element.elementor-element-568ef230{--display:flex;--flex-direction:row;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--justify-content:flex-start;--align-items:center;--gap:10px 10px;--row-gap:10px;--column-gap:10px;--margin-top:-50px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-34 .elementor-element.elementor-element-568ef230.e-con{--align-self:center;}.elementor-34 .elementor-element.elementor-element-1de2ae6{text-align:start;}.elementor-34 .elementor-element.elementor-element-1de2ae6 img{width:260px;}.elementor-34 .elementor-element.elementor-element-89e7551{text-align:start;}.elementor-34 .elementor-element.elementor-element-89e7551 img{width:260px;}.elementor-34 .elementor-element.elementor-element-c32ba3d{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--justify-content:flex-end;}.elementor-34 .elementor-element.elementor-element-699c9468 .elementor-button:hover, .elementor-34 .elementor-element.elementor-element-699c9468 .elementor-button:focus{color:var( --e-global-color-secondary );}.elementor-34 .elementor-element.elementor-element-699c9468 .elementor-button:hover svg, .elementor-34 .elementor-element.elementor-element-699c9468 .elementor-button:focus svg{fill:var( --e-global-color-secondary );}.elementor-34 .elementor-element.elementor-element-699c9468 .elementor-button{border-radius:0px 0px 0px 0px;}.elementor-34 .elementor-element.elementor-element-97f3afb .elementor-icon-wrapper{text-align:center;}.elementor-34 .elementor-element.elementor-element-97f3afb.elementor-view-stacked .elementor-icon{background-color:var( --e-global-color-secondary );color:var( --e-global-color-text );}.elementor-34 .elementor-element.elementor-element-97f3afb.elementor-view-framed .elementor-icon, .elementor-34 .elementor-element.elementor-element-97f3afb.elementor-view-default .elementor-icon{color:var( --e-global-color-secondary );border-color:var( --e-global-color-secondary );}.elementor-34 .elementor-element.elementor-element-97f3afb.elementor-view-framed .elementor-icon, .elementor-34 .elementor-element.elementor-element-97f3afb.elementor-view-default .elementor-icon svg{fill:var( --e-global-color-secondary );}.elementor-34 .elementor-element.elementor-element-97f3afb.elementor-view-framed .elementor-icon{background-color:var( --e-global-color-text );}.elementor-34 .elementor-element.elementor-element-97f3afb.elementor-view-stacked .elementor-icon svg{fill:var( --e-global-color-text );}.elementor-34 .elementor-element.elementor-element-97f3afb.elementor-view-stacked .elementor-icon:hover{background-color:var( --e-global-color-text );color:var( --e-global-color-secondary );}.elementor-34 .elementor-element.elementor-element-97f3afb.elementor-view-framed .elementor-icon:hover, .elementor-34 .elementor-element.elementor-element-97f3afb.elementor-view-default .elementor-icon:hover{color:var( --e-global-color-text );border-color:var( --e-global-color-text );}.elementor-34 .elementor-element.elementor-element-97f3afb.elementor-view-framed .elementor-icon:hover, .elementor-34 .elementor-element.elementor-element-97f3afb.elementor-view-default .elementor-icon:hover svg{fill:var( --e-global-color-text );}.elementor-34 .elementor-element.elementor-element-97f3afb.elementor-view-framed .elementor-icon:hover{background-color:var( --e-global-color-secondary );}.elementor-34 .elementor-element.elementor-element-97f3afb.elementor-view-stacked .elementor-icon:hover svg{fill:var( --e-global-color-secondary );}.elementor-34 .elementor-element.elementor-element-97f3afb .elementor-icon{font-size:23px;}.elementor-34 .elementor-element.elementor-element-97f3afb .elementor-icon svg{height:23px;}.elementor-theme-builder-content-area{height:400px;}.elementor-location-header:before, .elementor-location-footer:before{content:"";display:table;clear:both;}@media(min-width:768px){.elementor-34 .elementor-element.elementor-element-1acfbb8b{--content-width:1280px;}.elementor-34 .elementor-element.elementor-element-568ef230{--width:70%;}.elementor-34 .elementor-element.elementor-element-c32ba3d{--width:30%;}}@media(max-width:1024px) and (min-width:768px){.elementor-34 .elementor-element.elementor-element-1acfbb8b{--content-width:100%;}.elementor-34 .elementor-element.elementor-element-568ef230{--width:200px;}.elementor-34 .elementor-element.elementor-element-c32ba3d{--width:500px;}}@media(max-width:1024px){.elementor-34 .elementor-element.elementor-element-1acfbb8b{--justify-content:center;}.elementor-34 .elementor-element.elementor-element-568ef230{--padding-top:20px;--padding-bottom:20px;--padding-left:15px;--padding-right:15px;}}@media(max-width:767px){.elementor-34 .elementor-element.elementor-element-1acfbb8b{--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:20px;--padding-right:20px;--z-index:999;}.elementor-34 .elementor-element.elementor-element-568ef230{--width:60%;--justify-content:center;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:15px;}.elementor-34 .elementor-element.elementor-element-1de2ae6{padding:0px 0px 0px 15px;}.elementor-34 .elementor-element.elementor-element-89e7551{padding:0px 0px 0px 15px;}.elementor-34 .elementor-element.elementor-element-c32ba3d{--width:40%;}.elementor-34 .elementor-element.elementor-element-699c9468 .elementor-button{padding:15px 20px 15px 20px;}.elementor-34 .elementor-element.elementor-element-97f3afb{padding:0px 15px 0px 0px;}}/* Start custom CSS for image, class: .elementor-element-89e7551 *//* standaard */
.kleur-logo {
    display: none;
}

/* wanneer sticky actief wordt */
.elementor-sticky--effects .wit-logo {
    display: none !important;
}
.elementor-sticky--effects .kleur-logo {
    display: block !important;
}


/* Standaard witte menu-items */
header .elementor-nav-menu a {
    color: #ffffff;
}

/* Bij scroll (sticky active) */
.elementor-sticky--effects .elementor-nav-menu a {
    color: #F9B700; /* kies jouw kleur */
}/* End custom CSS */
/* Start custom CSS for button, class: .elementor-element-699c9468 */.elementor-34 .elementor-element.elementor-element-699c9468 a:hover{
    color: #F9BA0D!important;
}/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-1acfbb8b *//* =========================================================
   DEFAULT / MOBIEL-SAFE BASIS
   (Alles wat ook op mobiel OK is)
   ========================================================= */

/* Kleuren van links (mag overal) */
.topbalk:not(.bg-white) a { color: #434341 !important; }
.topbalk.bg-white a { color: #333 !important; text-shadow: none !important; }

/* =========================================================
   LOGO – DEFAULT (MOBIEL + ALGEMEEN)
   Op mobiel: alleen wit logo zichtbaar
   ========================================================= */

.logo-wrapper{
  width: 260px;
  position: relative;
  display: flex !important;
  justify-content: flex-start !important;
  align-items: center !important;
}

/* Forceer mobiel/default */
.logo-wit{
  opacity: 1 !important;
  position: relative;
}

.logo-kleur{
  opacity: 0 !important;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
}

/* =========================================================
   DESKTOP-ONLY (fade / blur / reveal / hover / parallax)
   ========================================================= */
@media (min-width: 769px) {

  /* =========================================================
     SAFARI FIXES + HERO FADE (desktop-only)
     ========================================================= */

  .topbalk {
      isolation: isolate;
      will-change: background-color, opacity;
      --fade-opacity: 0;
      --transition-base: cubic-bezier(0.4, 0, 0.2, 1);

      background-color: rgba(255, 255, 255, var(--fade-opacity));

      transition:
          background-color .6s var(--transition-base),
          box-shadow .6s var(--transition-base);
  }

  .hero-section {
      --hero-opacity: 1;
      opacity: calc(var(--hero-opacity) * 1);
      transition: opacity .25s linear;
      will-change: opacity;
  }

  /* Blur ONLY when passed hero */
  .topbalk.bg-white {
      backdrop-filter: blur(16px);
      background-color: rgba(255,255,255,0.96) !important;
      box-shadow: 0 2px 24px rgba(0,0,0,0.06);
      --fade-opacity: 1 !important;
  }

  /* =========================================================
     LOGO CROSSFADE – desktop-only
     ========================================================= */

  .logo-wit,
  .logo-kleur {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      transition: opacity .45s ease;
  }

  .logo-wit { opacity: 1 !important; }
  .logo-kleur { opacity: 0 !important; }

  .topbalk.logo-colored .logo-wit { opacity: 0 !important; }
  .topbalk.logo-colored .logo-kleur { opacity: 1 !important; }

  /* ============================================================
     SCROLL-IN ANIMATIONS (desktop-only)
     ============================================================ */

  .reveal {
      opacity: 0;
      transform: translateY(40px);
      transition: opacity .8s ease-out, transform .8s ease-out;
      will-change: opacity, transform;
  }

  .reveal.visible {
      opacity: 1;
      transform: translateY(0);
  }

  .reveal.delay-1 { transition-delay: .05s; }
  .reveal.delay-2 { transition-delay: .10s; }
  .reveal.delay-3 { transition-delay: .15s; }
  .reveal.delay-4 { transition-delay: .20s; }
  .reveal.delay-5 { transition-delay: .25s; }
  .reveal.delay-6 { transition-delay: .30s; }

  /* Smooth reveal scale */
  .reveal-scale {
      opacity: 0;
      transform: scale(0.96);
      transition:
          opacity 0.6s cubic-bezier(0.4, 0, 0.2, 1),
          transform 0.6s cubic-bezier(0.4, 0, 0.2, 1);
      will-change: opacity, transform;
  }

  .reveal-scale.reveal-visible {
      opacity: 1;
      transform: scale(1);
  }

  /* =========================================================
     PARALLAX HOVER PROJECTFOTO'S (desktop-only)
     ========================================================= */

  .project-card { perspective: 800px; }

  .project-card img {
      transform: translateZ(0);
      transition: transform 0.4s cubic-bezier(.25,.46,.45,.94);
      will-change: transform;
  }

  .project-card:hover img {
      transform: scale(1.03) translateY(-6px) rotateX(4deg) rotateY(2deg);
  }

  .scroll-float {
      transform: none !important;
      position: relative;
      will-change: transform;
      transition: transform 0.15s ease-out;
  }

  /* =========================================================
     OVER ONS FOTO – Modern Reveal (desktop-only)
     ========================================================= */

  .overons-foto.reveal-photo {
      opacity: 0;
      transform: translateY(40px) scale(0.96);
      clip-path: inset(0 0 0 0 round 24px);
      transition:
          opacity .9s cubic-bezier(0.22, 1, 0.36, 1),
          transform 0.9s cubic-bezier(0.22, 1, 0.36, 1),
          clip-path 1.1s cubic-bezier(0.22, 1, 0.36, 1);
      will-change: opacity, transform, clip-path;
  }

  .overons-foto.reveal-photo.visible {
      opacity: 1;
      transform: translateY(0) scale(1);
      clip-path: inset(0 0 0 0 round 0px);
  }

  .overons-foto.delay-1 { transition-delay: .15s; }
  .overons-foto.delay-2 { transition-delay: .25s; }
  .overons-foto.delay-3 { transition-delay: .35s; }

  .overons-foto:hover img {
      transform: scale(1.04) translateY(-4px);
      transition: transform 0.35s ease-out;
  }

  .overons-foto img {
      transition: transform 0.35s ease-out;
      will-change: transform;
  }

  /* =========================================================
     DARK MODE (desktop-only, want dit hangt samen met blur/fade)
     ========================================================= */

  .topbalk.darkmode.bg-white {
      background-color: rgba(20,20,20,0.85) !important;
      box-shadow: 0 2px 30px rgba(0,0,0,0.4);
  }

  .topbalk.darkmode.bg-white a {
      color: #eee !important;
  }
}

/* =========================================================
   MOBIEL – expliciet: geen blur/animaties/hover nodig
   (optioneel: alleen wat je écht wil)
   ========================================================= */
@media (max-width: 768px) {
  /* Als je wil: zorg dat reveal-elementen niet verborgen zijn */
  .reveal,
  .reveal-scale,
  .overons-foto.reveal-photo {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
    clip-path: none !important;
  }

  /* Project hover effecten uit (voor zekerheid) */
  .project-card img,
  .overons-foto img {
    transform: none !important;
    transition: none !important;
  }
}/* End custom CSS */