header{
    background-color: #fff !important;
    border-bottom: 1px solid var(--blue-400-opaque) !important;
}

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

header .pk-menu a{
    color: var(--text-400);
    text-decoration: none;
}

header .header-logo{
    border-left: 1px solid var(--blue-400-opaque);
    padding: .75rem 1.5rem 1rem 1.5rem;
}

header .header-logo img{
    max-width: 135px !important;
    height: unset !important;
}

header .pk-header-wrapper{
    max-width: var(--pk-container-width);
    margin-inline: auto;
    padding-inline: 0 !important;
}

header .mega-menu > a{
    display: flex;
    align-items: center;
    gap: .5rem;
    padding: 1.5rem 1rem;
    border-inline: 1px solid var(--blue-400-opaque);
}

header .mega-menu > .pk-submenu{
    width: 100vw !important;
    inset: 0 !important;
    top: var(--pk-header-height) !important;
    padding-inline: max(0px, calc((100vw - var(--pk-container-width)) / 2));
    padding-block: 0;

    --cutoff-distance: calc(var(--pk-container-width) + (100vw - var(--pk-container-width)) / 2);
    background-image: linear-gradient(90deg, white var(--cutoff-distance), var(--blue-150) var(--cutoff-distance));
}

header .mega-menu > a::after{
    content: '';
    width: .75em; height: .75em;
    background-color: currentColor;
    --mask-url: url("data:image/svg+xml,%3Csvg width='9' height='8' viewBox='0 0 9 8' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1.41241 1.30005H1.40217M6.72525 1.30005H6.71501M1.31004 6.11129H1.2998M6.72525 6.11129H6.71501' stroke='%2311122B' stroke-width='2.6' stroke-linecap='round'/%3E%3C/svg%3E%0A");
    mask: var(--mask-url) no-repeat center / contain;
    -webkit-mask: var(--mask-url) no-repeat center / contain;
}

.mega-menu .item-type-mitypes_menu_cta{
    background-color: var(--blue-150);
    padding: 4.5rem 3rem;
    display: flex;
    flex-direction: column;
}

.mega-menu .item-type-mitypes_menu_cta a{
    margin-top: auto;
    margin-bottom: 0 !important;
}

header .mega-menu > .pk-submenu > .pk-submenu-wrapper{
    display: grid;
    grid-template-columns: repeat(12, minmax(0,1fr)) !important;
    gap: 1.5rem;
    width: 100%;
}

header .mega-menu > .pk-submenu > .pk-submenu-wrapper > .pk-menu-item{
    grid-column-end: span 3;
}

header .mega-menu > .pk-submenu > .pk-submenu-wrapper > .pk-menu-item:not(.item-type-mytypes_menu_cta){
    padding-block: 3.5rem 4.5rem;
}

header .mega-menu > .pk-submenu > .pk-submenu-wrapper > .pk-menu-item a{
    color: var(--text-400);
    text-decoration: none;
}

header .mega-menu > .pk-submenu > .pk-submenu-wrapper > .pk-menu-item > a{
    display: block;
    font-size: var(--heading-4);
    font-weight: 500;
    margin-bottom: 1.5rem;
}

header .mega-menu > .pk-submenu > .pk-submenu-wrapper .pk-submenu-wrapper a{
    padding-block: 1rem;
    display: flex;
    --arrow-url: url("data:image/svg+xml,%3Csvg width='13' height='14' viewBox='0 0 13 14' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M12.1231 9.98765V0.400024M12.1231 0.400024H2.70949M12.1231 0.400024L0.290527 12.8894' stroke='%2311122B' stroke-width='0.8' stroke-miterlimit='10'/%3E%3C/svg%3E%0A");
} 

header .mega-menu > .pk-submenu > .pk-submenu-wrapper .pk-submenu-wrapper a::after{
    content: '';
    width: .75em; height: .75em;
    margin-left: auto;
    background-color: currentColor;
    mask: var(--arrow-url) no-repeat center / contain;
    -webkit-mask: var(--arrow-url) no-repeat center / contain;
}

header .mega-menu > .pk-submenu > .pk-submenu-wrapper .pk-submenu-wrapper .pk-menu-item:not(:last-child){
    border-bottom: 1px solid var(--blue-400-opaque);
}




header .pk-menu .menu-button a{
    display: flex;
    align-items: center;
    gap: .5rem;
    background-color: var(--blue-400-opaque);
    padding: 1.5rem 2rem;
    border-radius: 0;
    color: var(--text-400);
    margin-left: auto !important;

    transition: background-color 300ms ease-in-out;
}

header .pk-menu .menu-button a::after{
    content: '';
    width: .75em; height: .75em;
    background-color: currentColor;
    --arrow-url: url("data:image/svg+xml,%3Csvg width='13' height='14' viewBox='0 0 13 14' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M12.1231 9.98765V0.400024M12.1231 0.400024H2.70949M12.1231 0.400024L0.290527 12.8894' stroke='%2311122B' stroke-width='0.8' stroke-miterlimit='10'/%3E%3C/svg%3E%0A");
    mask: var(--arrow-url) no-repeat center / contain;
    -webkit-mask: var(--arrow-url) no-repeat center / contain;
}

header .pk-menu .menu-button a:is(:hover,:active,:focus){
    background-color: var(--blue-400);
}