.pk-page header {
    --icon-down: url("data:image/svg+xml,%3Csvg width='13' height='7' viewBox='0 0 13 7' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M0.75 0.75L6.25 6.25L11.75 0.75' stroke='%23312019' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E%0A");
    --icon-right: url("data:image/svg+xml,%3Csvg width='7' height='13' viewBox='0 0 7 13' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M0.411398 12.0254C0.356545 12.0254 0.303651 12.0156 0.252716 11.996C0.201781 11.9764 0.156723 11.947 0.117542 11.9078C0.0391807 11.8295 0 11.7355 0 11.6257C0 11.516 0.0391807 11.422 0.117542 11.3436L5.48922 5.97197L0.199822 0.694327C0.12146 0.615966 0.0822795 0.519974 0.0822795 0.406349C0.0822795 0.292726 0.12146 0.196733 0.199822 0.118371C0.278183 0.0400095 0.374176 0.000828743 0.4878 0.000828743C0.601424 0.000828743 0.697417 0.0400095 0.775778 0.118371L6.33552 5.68987C6.41388 5.76823 6.45306 5.86226 6.45306 5.97197C6.45306 6.08168 6.41388 6.17571 6.33552 6.25407L0.693499 11.9078C0.654318 11.947 0.60926 11.9764 0.558325 11.996C0.50739 12.0156 0.458414 12.0254 0.411398 12.0254Z' fill='%23312019'/%3E%3C/svg%3E%0A");
}

.pk-page header{
background: rgba(11, 37, 38, 0.15);
backdrop-filter: blur(15px);
  transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -webkit-transition: all 0.3s ease-in-out;
}


body.home header:not(.header-scrolled) .menu-text {
  color: #fff;
}
body.home .pk-page header:not(.header-scrolled) .pk-menu .hamburger span {
  background: #fff;
}

.pk-page .header-scrolled{
  background: #FFF;
  backdrop-filter: blur(16.676469802856445px);
    transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -webkit-transition: all 0.3s ease-in-out;
}

body:not(.home) header{
  background: #FFF;
  backdrop-filter: blur(16.676469802856445px);
    transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -webkit-transition: all 0.3s ease-in-out;
}


body.home header:not(.header-scrolled) .header-logo img {
  filter:brightness(0) invert(1);
}

header .header-seperator {
  height: 35px;
  width: 1px;
  background: #312019;
  opacity: 0.45;
  margin: 0px 58px;
}

body.home header:not(.header-scrolled) .header-seperator{
    background: #fff;
}


.pk-submenu .pk-submenu-wrapper{
    display: flex;
    flex-direction: column;
    gap: .5rem;
	overflow: visible;
    height: fit-content;
}

header .pk-menu ul.menu li.pk-menu-item.menu-button > a {
  display: flex;
  align-items: last baseline;
  gap: 10px;
  background-color: #10383B;
  padding: 19px 32px;
  line-height: 1;
  border-radius: 1000px;
  text-decoration: none; font-size: unset; text-align: center;
}

body .menu-button svg{
    flex-shrink: 0;
    transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -webkit-transition: all 0.3s ease-in-out;
}

body .menu-button:hover svg,
body .menu-button:focus svg,
body .menu-button:active svg{
  transform:translateX(5px);
}

.pk-menu .menu-button a:hover,
.pk-menu .menu-button a:focus,
.pk-menu .menu-button a:active{
    color:#fff;
}

@media (min-width: 1301px) {
    header #pk-menu-list {
        justify-content: flex-end;
    }

    body header .pk-menu .menu-text {
        display: none;
    }

    body.home header:not(.header-scrolled) .pk-menu  ul.menu li.pk-menu-item.menu-button > a{
        border-radius: 1777.045px;
        background-color: rgba(255, 255, 255, 0.20);
    }


    body.home header:not(.header-scrolled) .pk-menu ul.menu li:not(.menu-button) a{
    color:#fff;
    }
}

@media (min-width: 1301px) and (max-width: 1495px) {
  header .pk-menu ul.menu > li.pk-menu-item:not(.menu-button) > a {
    padding: 0.75em 0.5em !important;
  }

  header .header-seperator {
    margin: 0px 28px !important;
  }
}

.pk-page header .pk-header-wrapper {
    gap: calc(1 * var(--su));
}

.pk-page header .header-logo {
    flex-shrink: 0;
}
.pk-page header .header-logo img {
    max-width: max(100px, calc(9 * var(--su)));
    height: auto;
    padding-block: max(1.25rem, calc(1.25 * var(--su)));
}

header .pk-menu {
    flex-grow: 1;
}

header .pk-menu .menu {
    gap: 0;
    justify-content: end;
}

header .pk-menu ul.menu .pk-button{
    background-color: #10383B;
    font-size: var(--desktop-body-xs);
}

header .pk-menu ul.menu > li.pk-menu-item:not(.menu-button) > a {
    display: flex;
    align-items: center;
    gap: .5em;
    position: relative;
    font-size: var(--desktop-body-sm);
    padding: 0.75em 1em;
    border-radius: 0.25em;
    transition: background-color 0.3s ease;
}

.pk-menu ul.menu li.has-submenu > a::after{
    content: '';
    flex-shrink: 0;
    width: .75em; height: .75em;
    background-color: currentColor;
    --mask-url: var(--icon-down);
    mask: var(--mask-url) no-repeat center / contain;
    -webkit-mask: var(--mask-url) no-repeat center / contain;
}

header .pk-menu .menu .pk-submenu {
    background-color: #ffffff;
    top: calc(100% + 20px);
    min-width: max(265px, calc(16 * var(--su)));
    max-width: 100vw; overflow-x: visible;
    padding: max(1rem, calc(1 * var(--su)));
    border: 1px solid #E4E4E4;
    transition: all .7s cubic-bezier(.2,1,.22,1);
    border-bottom-left-radius: .25em;
}
@media only screen and (min-width: 1300px){

    header .pk-menu .menu .pk-submenu {
        transform: translate(0px, -20px);
    }

    header .pk-menu .menu .pk-submenu .pk-submenu{
        transform: translate(-20px, 0px);
    }

    :is(.pk-menu-item, .pk-submenu-item).has-submenu:is(:hover,:active,:focus,:focus-within) > .pk-submenu{
        transform: translate(0px, 0px) !important;
    }


}

@media only screen and (max-width: 992px){
	header .pk-menu .menu .pk-submenu .pk-submenu,
    body .pk-menu .menu,
	header .pk-menu .menu .pk-submenu,
	.pk-submenu .pk-submenu-wrapper{
	    overflow-x: clip;
	    overflow-y: auto;
	}
}

header .pk-menu li.has-submenu:hover::after{
    content: '';
    position: absolute;
    left: 0;
    bottom: -30px;
    right: 0;
    height: 50px;
    display: inline-block;
}



header .pk-menu .menu .pk-submenu-wrapper{
    gap: 0;
}

/* Fix voor border */
header .pk-menu .menu .pk-submenu .pk-submenu{
    min-height: calc(100% + 2px);
    top: -1px;
    border-bottom-left-radius: 0;
    max-width: 100vw;
    overflow-x: visible;
}

header .pk-menu .menu .pk-submenu:not(:has(.pk-submenu)){
    border-bottom-right-radius: .25em;
}

header .pk-menu .pk-submenu li {
    position: static;
}
header .pk-menu .pk-submenu li a {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: .75em 1em;
    gap: 0.5em;
    border-radius: .25em;
    font-size: var(--desktop-body-sm);
    transition: background-color 0.3s ease;
}

header .pk-menu .pk-submenu li a:hover::before{
    content: '';
    width: 1.5rem;
    height: 100%;
    position: absolute;
    left: 100%;
    top: 0;
}

header .pk-menu .pk-submenu li:hover > a {
    background-color: #F7F5F2;
}
header .pk-menu .pk-submenu li.has-submenu > a::after {
    content: "";
    flex-shrink: 0;
    width:.75em; height: .75em;
    background-color: currentColor;
    --mask-url: var(--icon-right);
    mask: var(--mask-url) no-repeat center / contain;
    -webkit-mask: var(--mask-url) no-repeat center / contain;
}

header .pk-menu .menu .pk-submenu .menu-cta {
    display: flex;
    flex-direction: column;
    gap: max(.5rem, calc(.5 * var(--su)));
    padding: max(2rem, calc(2 * var(--su))) max(1.5rem, calc(1.5 * var(--su)));
    background-color: #10383B;
    font-size: var(--desktop-body-xs);
    color: #ffffff;
    border-radius: max(.25rem, calc(.25 * var(--su)));
    margin-top: max(.5rem, calc(0.5 * var(--su)));
}

header .pk-menu .menu .pk-submenu .menu-cta .title{
    font-family: var(--pk-heading-font-family);
    font-size: max(1.5rem, calc(1.5 * var(--su)));
    font-weight: 500;
    white-space: nowrap;
}

header .pk-menu .menu-button {
    margin-left: unset;
}

header .pk-menu .menu .pk-submenu .menu-cta .pk-button{
    display: block;
    width: fit-content;
    background-color: #8C3E12;
}

header .pk-menu ul.menu  li.pk-menu-item > a[href="#"] {
    cursor: default;
}

header .pk-menu .menu .menu-cta-icon .material-symbols-outlined {
    display: block;
    rotate: -45deg;
    font-size: 1.25em;
    transition: rotate 0.3s ease;
}
header .pk-menu .menu .menu-cta:hover .material-symbols-outlined {
    rotate: 0deg;
}
header .pk-menu .menu .menu-cta .pk-text,
header .pk-menu .menu .menu-cta .pk-heading {
    color: inherit;
}
header .pk-menu .menu .menu-cta .pk-heading {
    font-weight: 800;
}
header .pk-menu .menu .menu-cta .pk-text {
    margin-top: 1em;
}

@media screen and (max-width: 1300px) {
    .pk-page header .header-logo img {
        width: 150px;
        height: auto;
    }
    
    .pk-menu .hamburger {
        display: flex;
        flex-direction: column;
        gap: .35em;
        align-items: center;
        justify-content: center;
        width: fit-content;
        height: auto;
        aspect-ratio: 1;
        margin-left: auto;
        position: relative;
        z-index: 5;
        appearance: none;
        background: transparent;
        border: none;
        transition: gap 250ms ease-out;
    }

    .pk-menu .hamburger span {
        --delay: 0ms;
        --delay-out: 50ms;
        display: block;
        background-color: var(--pk-text-color);
        height: 2px;
        width: 1.5em;
        transform-origin: center;
        transition: rotate 250ms ease-out var(--delay),
                    scale 250ms ease-in-out var(--delay-out),
                    transform 250ms ease-out var(--delay),
                    translate 250ms ease-in-out var(--delay-out);
    }

    .pk-menu .hamburger span:nth-child(3) {
        transform: rotate(-180deg);
    }

    body:has(.pk-menu .menu.open) {
        overflow-y: hidden;
    }

    .pk-menu .hamburger:has(+ .menu.open) {
        gap: 0;
    }

    .pk-menu .hamburger:has(+ .menu.open) span {
        --delay: 125ms;
        --delay-out: 0ms;
        rotate: -135deg;
    }

    .pk-menu .hamburger:has(+ .menu.open) span:nth-child(1) {
        translate: 0 100%;
        transform: rotate(180deg);
    }

    .pk-menu .hamburger:has(+ .menu.open) span:nth-child(2) {
        scale: 0 100%;
    }

    .pk-menu .hamburger:has(+ .menu.open) span:nth-child(3) {
        transform: rotate(-90deg);
        translate: 0 -100%;
    }

    .pk-menu .menu:not(.open):not(.is_animating) {
        display: none;
    }

    body:has(.menu.is_animating) {
        overflow: hidden;
    }

	.pk-submenu .pk-submenu-wrapper {
		height: 100%;
	}

    body .pk-menu .menu,
	header .pk-menu .menu .pk-submenu {
        /*overflow: clip;*/
        padding-bottom: 1.5rem;
		padding-top: 2rem;
		top: var(--pk-header-height);
		background: #F7F5F2;
		height: calc(100dvh - var(--pk-header-height));
        overflow: visible;
        justify-content: start;
    }
	header .pk-menu .menu .pk-submenu {
		top: 0;
	}

	header .pk-menu .menu .pk-submenu:not(.open, .is_animating){
        display: none;
    }

    header .pk-menu .menu .back-button-wrapper {
		border: none;
		background: transparent;
		box-shadow: none;
	}

    header .pk-menu .menu .back-button-wrapper button {
        display: flex;
        align-items: center;
        gap: 0.5rem;
        position: relative;
        border: none;
        background: transparent;
        box-shadow: none;
    }
    header .pk-menu .menu .back-button-wrapper button::before {
        content: "";
        background-color: currentColor;
        width: .75rem; height: .75rem;
        flex-shrink: 0;
        --mask-url: var(--icon-right);
        mask: var(--mask-url) no-repeat center / contain;
        -webkit-mask: var(--mask-url) no-repeat center / contain;
        transform: scaleX(-1);
    }
    header .pk-menu .menu .back-button-wrapper button {
        appearance: none;
        border: none;
        margin: 0;
        padding: 0;
        width: 100%;
        text-align: left;
        background: transparent;
        font-size: 1rem;
        text-transform: capitalize;
    }

    header .pk-menu li {
        position: static;
        width: 100%;
    }

    header .pk-menu ul.menu li.has-submenu > a::after {
        flex-shrink: 0;
        --mask-url: var(--icon-right);
    }

    header .pk-menu li:not(:last-child) {
        margin-bottom: 0.5rem;
    }
    header .pk-menu ul.menu  li.pk-menu-item > a {
        padding: 1rem;
        justify-content: space-between;
		background-color: #ffffff;
    }

    header .pk-menu .menu .pk-button {
        width: 100%;
        justify-content: space-between;
    }
    header .pk-menu .menu .pk-button:first-of-type {
        /* margin-top: max(2.5rem, calc(2.5 * var(--su))); */
    }

}

@media screen and (max-width: 767px) {
    body header > .pk-header-wrapper,
    body .pk-menu .menu {
        padding-inline: 1.5rem;
    }
}

.menu-text {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  gap: 8px;
  line-height: 1;
  position: relative;
  z-index: 20;
  color: var(--HS-Donker-Grijs, #231F20);
  text-align: right;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
}

.pk-menu .menu-text {
  display:flex;
  align-items:flex-start;
  justify-content:flex-end;
  height:1.5rem;
  overflow:hidden
}
.pk-menu .menu-text div > span {
  text-decoration:none;
  display: block;
  height: 1.5rem;
  line-height: 1.5rem;
}
.pk-menu .menu-text > div {
  transition: transform 250ms ease-out;
}

.pk-menu.active .menu-text > div {
  transform: translateY(-50%);
}
