.elementor-kit-5{--e-global-color-primary:#111418;--e-global-color-secondary:#606770;--e-global-color-text:#111418;--e-global-color-accent:#729CE8;--e-global-color-0962066:#FFFFFF;--e-global-color-71f06c6:#F7F8FA;--e-global-color-58943b9:#195E98;--e-global-color-4409bcf:#C66000;--e-global-typography-primary-font-family:"Inter";--e-global-typography-primary-font-size:16px;--e-global-typography-primary-font-weight:400;--e-global-typography-secondary-font-family:"Inter";--e-global-typography-secondary-font-size:10px;--e-global-typography-secondary-font-weight:400;--e-global-typography-text-font-family:"Inter";--e-global-typography-text-font-size:16px;--e-global-typography-text-font-weight:400;--e-global-typography-accent-font-family:"Inter";--e-global-typography-accent-font-weight:500;color:var( --e-global-color-text );font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-size:var( --e-global-typography-text-font-size );font-weight:var( --e-global-typography-text-font-weight );}.elementor-kit-5 button,.elementor-kit-5 input[type="button"],.elementor-kit-5 input[type="submit"],.elementor-kit-5 .elementor-button{background-color:#FFFFFF;font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-size:var( --e-global-typography-primary-font-size );font-weight:var( --e-global-typography-primary-font-weight );color:var( --e-global-color-text );border-style:solid;border-width:1px 1px 1px 1px;border-radius:0px 0px 0px 0px;padding:22px 18px 22px 18px;}.elementor-kit-5 button:hover,.elementor-kit-5 button:focus,.elementor-kit-5 input[type="button"]:hover,.elementor-kit-5 input[type="button"]:focus,.elementor-kit-5 input[type="submit"]:hover,.elementor-kit-5 input[type="submit"]:focus,.elementor-kit-5 .elementor-button:hover,.elementor-kit-5 .elementor-button:focus{background-color:#60677036;border-style:solid;border-width:1px 1px 1px 1px;}.elementor-kit-5 e-page-transition{background-color:#FFBC7D;}.elementor-kit-5 a{color:var( --e-global-color-primary );}.elementor-kit-5 h1{color:var( --e-global-color-text );font-family:"Inter", Sans-serif;font-size:56px;font-weight:700;}.elementor-kit-5 h2{color:var( --e-global-color-text );font-size:36px;font-weight:600;}.elementor-kit-5 h3{color:var( --e-global-color-text );font-size:23px;font-weight:600;}.elementor-kit-5 h4{color:var( --e-global-color-text );font-size:23px;font-weight:600;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:100%;}.e-con{--container-max-width:100%;--container-default-padding-top:35px;--container-default-padding-right:11px;--container-default-padding-bottom:35px;--container-default-padding-left:11px;}.elementor-widget:not(:last-child){--kit-widget-spacing:24px;}.elementor-element{--widgets-spacing:24px 24px;--widgets-spacing-row:24px;--widgets-spacing-column:24px;}{}h1.entry-title{display:var(--page-title-display);}@media(max-width:1024px){.elementor-kit-5{font-size:var( --e-global-typography-text-font-size );}.elementor-kit-5 button,.elementor-kit-5 input[type="button"],.elementor-kit-5 input[type="submit"],.elementor-kit-5 .elementor-button{font-size:var( --e-global-typography-primary-font-size );}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1140px;}.e-con{--container-max-width:1140px;--container-default-padding-top:40px;--container-default-padding-right:15px;--container-default-padding-bottom:40px;--container-default-padding-left:15px;}}@media(max-width:767px){.elementor-kit-5{font-size:var( --e-global-typography-text-font-size );}.elementor-kit-5 h2{letter-spacing:0.1px;}.elementor-kit-5 h3{line-height:0.2em;}.elementor-kit-5 h4{letter-spacing:0.2px;}.elementor-kit-5 button,.elementor-kit-5 input[type="button"],.elementor-kit-5 input[type="submit"],.elementor-kit-5 .elementor-button{font-size:var( --e-global-typography-primary-font-size );}.elementor-section.elementor-section-boxed > .elementor-container{max-width:767px;}.e-con{--container-max-width:767px;--container-default-padding-top:28px;--container-default-padding-right:12px;--container-default-padding-bottom:28px;--container-default-padding-left:12px;}}/* Start custom CSS *//* =========================================================
   BASIS / TYPOGRAFIE / KAARTEN
   ========================================================= */

/* Focus: goed zichtbaar voor toetsenbordnavigatie */
a:focus, button:focus {
  outline: 2px solid var(--e-global-color-accent);
  outline-offset: 2px;
}

/* Captions onder afbeeldingen */
figcaption {
  color: var(--e-global-color-text);
  opacity: .8;
  font-size: .9rem;
}

/* Uniforme kaart-stijl (pas class .card toe op containers) */
.card {
  background: var(--e-global-color-3);
  border-radius: 12px;
  padding: 24px;
}

/* =========================================================
   LAYOUT: VASTE LINKER ZIJBALK
   - Laat ruimte op alle pagina's behalve Landing (id=230)
   ========================================================= */
body:not(.page-id-230) .elementor-location-body {
  margin-left: 280px;
}

/* Op tablet/mobiel geen marge (zijbalk klapt in) */
@media (max-width: 1024px) {
  body .elementor-location-body { margin-left: 0; }
}

/* =========================================================
   MENU STYLES (Elementor Nav Menu)
   Doelen:
   1) Blauwe onderlijning alleen onder de tekst (animatie)
   2) Werkt in verticale layout én in dropdown (mobiel/tablet)
   3) Geen achtergrond op hover/actief/focus
   ========================================================= */

/* --- 0) HELPER: maak links tekst-breed en klaar voor lijntje --- */
/* Werkt als je zelf .nav-text-underline gebruikt EN ook in de dropdown-kloon */
.nav-text-underline .elementor-item,
.nav-text-underline .elementor-sub-item,
.elementor-nav-menu--dropdown a.elementor-item,
.elementor-nav-menu--dropdown a.elementor-sub-item,
.elementor-nav-menu--layout-vertical a.elementor-item,
.elementor-nav-menu--layout-vertical a.elementor-sub-item {
  display: inline-block !important;   /* link zo breed als de tekst */
  width: auto !important;
  position: relative;
  padding-bottom: 2px;                /* ruimte voor het lijntje */
  text-decoration: none;              /* voorkom dubbele underline */
}

/* --- 1) Het blauwe lijntje (onder de tekst) --- */
.nav-text-underline .elementor-item::after,
.nav-text-underline .elementor-sub-item::after,
.elementor-nav-menu--dropdown a.elementor-item::after,
.elementor-nav-menu--dropdown a.elementor-sub-item::after,
.elementor-nav-menu--layout-vertical a.elementor-item::after,
.elementor-nav-menu--layout-vertical a.elementor-sub-item::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  height: 2px;
  width: 0;
  background: #729CE8;                /* KLEUR */
  transition: width .42s ease;
}

/* Toon het lijntje bij hover/actief/focus (incl. toetsenbord) */
.nav-text-underline .elementor-item:hover::after,
.nav-text-underline .elementor-sub-item:hover::after,
.nav-text-underline .elementor-item.elementor-item-active::after,
.nav-text-underline .elementor-sub-item.elementor-item-active::after,
.elementor-nav-menu--dropdown a.elementor-item:hover::after,
.elementor-nav-menu--dropdown a.elementor-sub-item:hover::after,
.elementor-nav-menu--dropdown a.elementor-item.elementor-item-active::after,
.elementor-nav-menu--dropdown a.elementor-sub-item.elementor-item-active::after,
.elementor-nav-menu--layout-vertical a.elementor-item:hover::after,
.elementor-nav-menu--layout-vertical a.elementor-sub-item:hover::after,
.elementor-nav-menu--layout-vertical a.elementor-item.elementor-item-active::after,
.elementor-nav-menu--layout-vertical a.elementor-sub-item.elementor-item-active::after,
.nav-text-underline .elementor-item:focus-visible::after,
.nav-text-underline .elementor-sub-item:focus-visible::after,
.elementor-nav-menu--dropdown a.elementor-item:focus-visible::after,
.elementor-nav-menu--dropdown a.elementor-sub-item:focus-visible::after,
.elementor-nav-menu--layout-vertical a.elementor-item:focus-visible::after,
.elementor-nav-menu--layout-vertical a.elementor-sub-item:focus-visible::after {
  width: 100%;
}

/* Optioneel: actieve link iets sterker (typografisch) */
.elementor-item.elementor-item-active,
.elementor-sub-item.elementor-item-active {
  font-weight: 600; /* verwijder als je geen bold wil */
}

/* --- 2) Verwijder ALLE achtergronden op hover/actief/focus --- */
:where(.elementor-nav-menu--layout-vertical, .elementor-nav-menu--dropdown) a.elementor-item,
:where(.elementor-nav-menu--layout-vertical, .elementor-nav-menu--dropdown) a.elementor-sub-item {
  background: transparent !important;
  box-shadow: none !important; /* sommige thema's gebruiken schaduw als highlight */
}

/* Alle toestanden expliciet transparant */
:where(.elementor-nav-menu--layout-vertical, .elementor-nav-menu--dropdown) a.elementor-item:hover,
:where(.elementor-nav-menu--layout-vertical, .elementor-nav-menu--dropdown) a.elementor-item:focus,
:where(.elementor-nav-menu--layout-vertical, .elementor-nav-menu--dropdown) a.elementor-item:active,
:where(.elementor-nav-menu--layout-vertical, .elementor-nav-menu--dropdown) a.elementor-item.elementor-item-active,
:where(.elementor-nav-menu--layout-vertical, .elementor-nav-menu--dropdown) a.elementor-sub-item:hover,
:where(.elementor-nav-menu--layout-vertical, .elementor-nav-menu--dropdown) a.elementor-sub-item:focus,
:where(.elementor-nav-menu--layout-vertical, .elementor-nav-menu--dropdown) a.elementor-sub-item:active,
:where(.elementor-nav-menu--layout-vertical, .elementor-nav-menu--dropdown) a.elementor-sub-item.elementor-item-active,
:where(.elementor-nav-menu--layout-vertical, .elementor-nav-menu--dropdown) .current-menu-item > a,
:where(.elementor-nav-menu--layout-vertical, .elementor-nav-menu--dropdown) .current_page_item > a,
:where(.elementor-nav-menu--layout-vertical, .elementor-nav-menu--dropdown) .current-menu-ancestor > a {
  background: transparent !important;
  box-shadow: none !important;
}

/* Sommige thema's doen een overlay via ::before */
:where(.elementor-nav-menu--layout-vertical, .elementor-nav-menu--dropdown) a.elementor-item::before,
:where(.elementor-nav-menu--layout-vertical, .elementor-nav-menu--dropdown) a.elementor-sub-item::before {
  background: transparent !important;
}

/* Voor de zekerheid ook li-containers niet laten kleuren */
:where(.elementor-nav-menu--layout-vertical, .elementor-nav-menu--dropdown) li:hover,
:where(.elementor-nav-menu--layout-vertical, .elementor-nav-menu--dropdown) li:focus-within {
  background: transparent !important;
}

/* --- 3) Toegankelijkheid: duidelijke focus-ring in menus --- */
.elementor-nav-menu--layout-vertical .elementor-item:focus,
.elementor-nav-menu--dropdown a.elementor-item:focus,
.elementor-nav-menu--dropdown a.elementor-sub-item:focus {
  outline: 2px solid var(--e-global-color-accent);
  outline-offset: 2px;
}

/* --- 4) Respecteer reduced motion --- */
@media (prefers-reduced-motion: reduce) {
  .nav-text-underline .elementor-item::after,
  .nav-text-underline .elementor-sub-item::after,
  .elementor-nav-menu--dropdown a.elementor-item::after,
  .elementor-nav-menu--dropdown a.elementor-sub-item::after,
  .elementor-nav-menu--layout-vertical a.elementor-item::after,
  .elementor-nav-menu--layout-vertical a.elementor-sub-item::after {
    transition: none;
  }
}
/* === MENU: hou de tekstkleur gelijk (geen wit op hover/actief) === */
/* Basis */
:where(.elementor-nav-menu--layout-vertical, .elementor-nav-menu--dropdown) a.elementor-item,
:where(.elementor-nav-menu--layout-vertical, .elementor-nav-menu--dropdown) a.elementor-sub-item {
  color: var(--e-global-color-text) !important;
  text-decoration: none;
}

/* Hover / Focus / Actief + WordPress 'current' klassen */
:where(.elementor-nav-menu--layout-vertical, .elementor-nav-menu--dropdown) a.elementor-item:hover,
:where(.elementor-nav-menu--layout-vertical, .elementor-nav-menu--dropdown) a.elementor-item:focus,
:where(.elementor-nav-menu--layout-vertical, .elementor-nav-menu--dropdown) a.elementor-item:active,
:where(.elementor-nav-menu--layout-vertical, .elementor-nav-menu--dropdown) a.elementor-item.elementor-item-active,
:where(.elementor-nav-menu--layout-vertical, .elementor-nav-menu--dropdown) a.elementor-sub-item:hover,
:where(.elementor-nav-menu--layout-vertical, .elementor-nav-menu--dropdown) a.elementor-sub-item:focus,
:where(.elementor-nav-menu--layout-vertical, .elementor-nav-menu--dropdown) a.elementor-sub-item:active,
:where(.elementor-nav-menu--layout-vertical, .elementor-nav-menu--dropdown) a.elementor-sub-item.elementor-item-active,
:where(.elementor-nav-menu--layout-vertical, .elementor-nav-menu--dropdown) .current-menu-item > a,
:where(.elementor-nav-menu--layout-vertical, .elementor-nav-menu--dropdown) .current_page_item > a,
:where(.elementor-nav-menu--layout-vertical, .elementor-nav-menu--dropdown) [aria-current="page"] {
  color: var(--e-global-color-text) !important;
}

/* (optioneel) als submenus een andere variabele gebruiken */
.elementor-nav-menu--dropdown a.elementor-item,
.elementor-nav-menu--dropdown a.elementor-sub-item {
  --e-dropdown-menu-color: var(--e-global-color-text);
}

/* Wil je expliciet een andere hoverkleur? Vervang de regel hierboven door bv.:
   color: #1f2937 !important;  // donkergrijs, of een andere kleur naar wens
*/
/* Stel de sidebar-breedte in (desktop) */
:root { --sidebar-w: 280px; }

/* Alleen op pagina's (niet op posts) de footer rechts van de sidebar zetten */
@media (min-width: 1025px){
  body.page .elementor-location-footer {
    margin-left: var(--sidebar-w);
    width: calc(100% - var(--sidebar-w));
  }
}

/* Op tablet/mobiel gewoon volle breedte onder elkaar */
@media (max-width: 1024px){
  body.page .elementor-location-footer {
    margin-left: 0;
    width: 100%;
  }
}
/* PROJECTEN: footer rechts naast de linker kolom van 280px */
@media (min-width: 1025px){
  body.single-project .elementor-location-footer > .e-con,
  body.single-project .elementor-location-footer .elementor-section .elementor-container {
    margin-left: 280px;
    width: calc(100% - 280px);
    max-width: none;
  }
}

/* Tablet & mobiel: footer volle breedte onder de content */
@media (max-width: 1024px){
  body.single-project .elementor-location-footer > .e-con,
  body.single-project .elementor-location-footer .elementor-section .elementor-container {
    margin-left: 0;
    width: 100%;
    max-width: 100%;
  }
}/* End custom CSS */