.elementor-kit-9{--e-global-color-primary:#DDD2C0;--e-global-color-secondary:#F5F1E5;--e-global-color-text:#6B6260;--e-global-color-accent:#8C9880;--e-global-color-ecd9547:#FFFFFF;--e-global-typography-primary-font-family:"Playfair Display";--e-global-typography-primary-font-weight:600;--e-global-typography-secondary-font-family:"Montserrat";--e-global-typography-secondary-font-weight:400;--e-global-typography-text-font-family:"Montserrat";--e-global-typography-text-font-size:18px;--e-global-typography-text-font-weight:400;--e-global-typography-text-line-height:28px;--e-global-typography-accent-font-family:"Montserrat";--e-global-typography-accent-font-size:18px;--e-global-typography-accent-font-weight:400;background-color:var( --e-global-color-secondary );}.elementor-kit-9 e-page-transition{background-color:#FFBC7D;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1140px;}.e-con{--container-max-width:1140px;}.elementor-widget:not(:last-child){--kit-widget-spacing:20px;}.elementor-element{--widgets-spacing:20px 20px;--widgets-spacing-row:20px;--widgets-spacing-column:20px;}{}h1.entry-title{display:var(--page-title-display);}.site-header .site-branding{flex-direction:column;align-items:stretch;}.site-header{padding-inline-end:0px;padding-inline-start:0px;}.site-footer .site-branding{flex-direction:column;align-items:stretch;}@media(max-width:1024px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:1024px;}.e-con{--container-max-width:1024px;}}@media(max-width:767px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:767px;}.e-con{--container-max-width:767px;}}
/* Start custom CSS *//* 1. Hoofdinstellingen voor de header */
header.sticky-header {
	--header-height: 160px;
	--shrink-header-to: 0.64;
	--transition: .45s cubic-bezier(.4, 0, .2, 1);
	background-color: rgba(245, 241, 229, 1);
	transition: background-color var(--transition),
				backdrop-filter var(--transition),
				box-shadow var(--transition);
}

/* 2. Effecten wanneer er wordt gescrold (Sticky actief) */
header.sticky-header.elementor-sticky--effects {
	background-color: rgba(245, 241, 229, 1);
	box-shadow: 0px 15px 33px -10px rgba(0, 0, 0, 0.07);
	-webkit-backdrop-filter: saturate(180%) blur(20px);
	backdrop-filter: saturate(180%) blur(20px);
}

header.sticky-header > .elementor-container {
	min-height: var(--header-height);
	transition: min-height var(--transition);
}

header.sticky-header.elementor-sticky--effects > .elementor-container {
	min-height: calc( var(--header-height) * var(--shrink-header-to) );
}

/* 3. Aangepaste hoogte voor mobiel */
@media only screen and (max-width: 767px) {
	header.sticky-header {
		--header-height: 70px;
	}
}

/* 4. Logo instellingen: Echte hoogte aanpassen ipv transform */
header.sticky-header .logo img {
	transition: max-height var(--transition);
	max-height: 117px; /* De originele hoogte van je logo */
	width: auto !important; /* Zorgt dat de verhoudingen intact blijven */
}

header.sticky-header.elementor-sticky--effects .logo img {
	max-height: 70px; /* 60% van 160px. Hierdoor krimpt de echte ruimte */
}

/* 5. Zorg dat het logo netjes links blijft */
.sticky-header .logo img {
	margin-left: 0 !important;
	margin-right: auto !important;
	object-position: left center !important;
}

.kolom {
    position: relative;
}
.kolom::after {
    content: '';
    position: absolute;
    top: 20px;    /* Afstand vanaf de bovenkant */
    bottom: 20px; /* Afstand vanaf de onderkant */
    left: 20px;   /* Afstand vanaf links */
    right: 20px;  /* Afstand vanaf rechts */
    border: 1px solid #4a4a4a; /* Dikte, stijl en kleur van de rand */
    pointer-events: none; /* Zorgt dat de inhoud eronder aanklikbaar blijft */
    z-index: 10;
}

/* Dit is de basis van het vlak. De transition zorgt voor de 'ease' (de soepele beweging) */
.zweef-vlak {
  transition: transform 0.3s ease;
}

/* Dit gebeurt er bij een mouse over (hover). Het vlak gaat 10 pixels omhoog */
.zweef-vlak:hover {
  transform: translateY(-10px);
}/* End custom CSS */