/**
 * Klaas Puul — Header & Navigation (Clean Build)
 * Zero legacy artifacts. All structural + visual in one file.
 * Fonts: "sofia-pro", "acumin-pro" (Adobe Typekit)
 * Primary: #0D1C38
 */

/* ============================================================================
   1. VARIABLES
   ============================================================================ */
:root {
    --header-height: 80px;
    --header-bg: #ffffff;
    --transition: all 0.3s ease;
}

/* ============================================================================
   2. ACCESSIBILITY
   ============================================================================ */
.skip-link {
    position: absolute;
    left: -9999px;
    z-index: 999999;
    padding: 8px 16px;
    background: #000;
    color: #fff;
    text-decoration: none;
}
.skip-link:focus { left: 6px; top: 7px; }

.sr-only {
    position: absolute !important;
    width: 1px; height: 1px;
    padding: 0; margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap; border: 0;
}

/* ============================================================================
   3. TOP HEADER (optional bar)
   ============================================================================ */
.header-top {
    background: #f5f5f5;
    font-size: 14px;
    padding: 6px 0;
    height: 48px;
    transition: transform 0.3s ease;
    z-index: 1000;
}
.header-top.position-absolute {
    position: absolute; top: 0; left: 0; right: 0; z-index: 1000;
}
.header-top.position-fixed {
    position: fixed; top: 0; left: 0; right: 0; z-index: 1001;
}
.header-top.is-hidden,
.header-top.position-fixed.is-hidden { transform: translateY(-100%); }

.header-top .th-grid {
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: center; gap: 16px;
}
.th-zone--left, .th-zone--center, .th-zone--right {
    display: flex; gap: 12px; align-items: center; flex-wrap: wrap;
}
.th-zone--left   { justify-self: start; }
.th-zone--center { justify-self: center; }
.th-zone--right  { justify-self: end; }

.th-btns { display: flex; gap: 0; flex-wrap: wrap; }
.th-btn {
    padding: 8px 12px; text-decoration: none;
    font-family: var(--font-main, "acumin-pro", sans-serif);
    font-size: 0.875rem; font-weight: 700; line-height: 150%;
}
.th-btn--primary { background: var(--color-primary, #0D1C38); color: #fff; }
.th-btn--secondary {
    background: transparent;
    border: 2px solid var(--color-primary, #0D1C38);
    color: var(--color-primary, #0D1C38);
}
.th-btn:hover { background: rgba(0, 0, 0, 0.05); }

.th-socials { display: flex; gap: 4px; list-style: none; margin: 0; padding: 0; }
.th-socials__item {
    display: block; width: 24px; height: 24px;
    background-color: var(--color-primary, #0D1C38);
    border-radius: 8px; transition: 0.1s ease-in-out;
}
.th-socials__item:hover { opacity: 0.75; }
.th-socials__item a {
    display: flex; width: 100%; height: 100%;
    justify-content: center; align-items: center;
}
.th-socials__icon { width: 16px; }

.th-search form {
    display: flex; align-items: center;
    border: 1px solid #ddd; background: #fff;
}
.th-search input[type="search"] { border: none; padding: 6px 10px; font-size: 14px; flex: 1; }
.th-search input[type="search"]:focus { outline: none; }
.th-search input[type="submit"], .th-search button {
    border: none; background: var(--color-primary, #0D1C38);
    color: #fff; padding: 6px 10px; cursor: pointer;
}
.th-contact { text-decoration: none; color: var(--color-primary, #0D1C38); }

/* Top header body offsets */
body.has-top-header:not(.has-fixed-top-header) .site-header { top: 48px; }
body.has-fixed-top-header .site-header { top: 40px; }
body.has-top-header .site { padding-top: 208px; }
body.has-fixed-top-header .site-header.is-hidden {
    transform: translateY(calc(-100% - 40px));
}

@media (max-width: 1023px) { .header-top.desktop-only { display: none; } }
@media (min-width: 1280px) {
    .header-top.mobile-only { display: none; }
    .header-top.position-absolute { display: flex; align-items: center; }
    .th-socials__item { width: 32px; height: 32px; }
    .th-socials__icon { width: 20px; }
}

/* ============================================================================
   4. MAIN HEADER
   ============================================================================ */
.site-header-wrapper {
    position: sticky;
    top: 0;
    z-index: 1000;
}
.site-header {
    height: var(--header-height);
    background: var(--header-bg);
    z-index: 1000;
    transition: var(--transition);
}

/* Desktop auto-hide on scroll down, reveal on scroll up */
@media (min-width: 1025px) {
    .site-header-wrapper {
        transition: top 1.4s cubic-bezier(0.16, 1, 0.3, 1);
    }
    .site-header-wrapper.header--hidden {
        top: calc(var(--header-height, 80px) * -1 - 48px);
        pointer-events: none;
    }
    .site-header {
        transition: box-shadow 0.3s ease, background 0.3s ease;
    }
}
.site { padding-top: var(--header-height); }

.site-header .inner {
    height: 100%;
    max-width: 116rem;
    margin: 0 auto;
    padding: 0 16px;
    display: flex; align-items: center; justify-content: center;
}

.site-header .header-container {
    display: flex; align-items: center; justify-content: space-between;
    width: 100%; height: 100%;
}

.site-header-wrapper.is-scrolled .site-header { box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15); }

/* ============================================================================
   5. TRANSPARENT / GLASSMORPHISM HEADER (Homepage)
   ============================================================================ */
body.kp-transparent-header .site-header {
    background: transparent; box-shadow: none;
    height: auto;
}
body.kp-transparent-header .site { padding-top: 0; }

body.kp-transparent-header .site-header .inner {
    max-width: 100%;
    padding: 24px;
}
/* Transparent header: shelf closer to header-container (compensate for inner padding-bottom) */
body.kp-transparent-header .mega-panels-shelf,
body.kp-transparent-header .qs-search-overlay {
    top: calc(100% - 16px);
}

body.kp-transparent-header .site-header .header-container {
    background: rgba(255, 255, 255, 0.2);
    backdrop-filter: blur(5px); -webkit-backdrop-filter: blur(5px);
    padding: 24px 32px;
    max-width: 1824px;
    margin: 0 auto;
    transition: background 0.3s ease;
}

/* White elements on transparent header */
body.kp-transparent-header .site-logo svg path,
body.kp-transparent-header .site-logo svg rect,
body.kp-transparent-header .site-logo svg polygon,
body.kp-transparent-header .site-logo svg circle,
body.kp-transparent-header .site-logo__svg path,
body.kp-transparent-header .site-logo__svg rect,
body.kp-transparent-header .site-logo__svg polygon,
body.kp-transparent-header .site-logo__svg circle { fill: #ffffff; }
body.kp-transparent-header .site-logo__img { filter: brightness(0) invert(1); }
body.kp-transparent-header .nav-menu > li > a { color: #ffffff; }
body.kp-transparent-header .nav-menu > li:not(.menu-item-has-children) > a:hover { color: var(--color-primary, #0D1C38); }
body.kp-transparent-header .nav-menu > li.menu-item-has-children > a:hover { color: #0D1C38 !important; background: rgba(255, 255, 255, 0.60); }
body.kp-transparent-header .nav-menu > li.menu-item-has-children.is-hovering > a { color: #0D1C38 !important; background: rgba(255, 255, 255, 0.60); }
body.kp-transparent-header .nav-menu > li.menu-item-has-children.mega-active > a { color: #ffffff !important; background: #2C3C5B; }
body.kp-transparent-header .nav-menu > li.menu-item-has-children > a:hover::after,
body.kp-transparent-header .nav-menu > li.menu-item-has-children.is-hovering > a::after { filter: none; }
body.kp-transparent-header .nav-menu > li.menu-item-has-children.mega-active > a::after { filter: brightness(0) invert(1); }

body.kp-transparent-header .cta-btn { background: #ffffff; color: var(--color-primary, #0D1C38); }
body.kp-transparent-header .cta-btn:hover { background: rgba(255, 255, 255, 0.85); }
body.kp-transparent-header .cta-btn--secondary {
    background: transparent; border-color: #ffffff; color: #ffffff;
}
body.kp-transparent-header .cta-btn--secondary:hover { background: rgba(255, 255, 255, 0.1); }

body.kp-transparent-header .mobile-menu-toggle .mobile-menu-toggle__text,
body.kp-transparent-header .mobile-menu-toggle .mobile-menu-toggle__icon { color: #ffffff; }

/* Scrolled: solid dark blue container (keeps glassmorphism shape) */
body.kp-transparent-header .site-header-wrapper.is-scrolled .site-header {
    background: transparent; box-shadow: none;
}
body.kp-transparent-header .site-header-wrapper.is-scrolled .site-header .header-container {
    background: var(--color-primary, #0D1C38);
    backdrop-filter: none; -webkit-backdrop-filter: none;
    transition: background 0.3s ease;
}
/* When hovering a menu item at top of page (not scrolled), keep glassmorphism — NOT on solid header pages */
body.kp-transparent-header:not(.mobile-menu-open):not(.kp-solid-header) .site-header-wrapper:not(.is-scrolled) .site-header .header-container {
    background: rgba(255, 255, 255, 0.2) !important;
    backdrop-filter: blur(5px) !important; -webkit-backdrop-filter: blur(5px) !important;
}
/* Mobile menu open: solid dark header */
body.mobile-menu-open .site-header .header-container {
    background: var(--color-primary, #0D1C38) !important;
    backdrop-filter: none !important; -webkit-backdrop-filter: none !important;
}

/* Scrolled: logo + text stay white */
body.kp-transparent-header .site-header-wrapper.is-scrolled .site-header .nav-menu > li > a { color: #ffffff; }
body.kp-transparent-header .site-header-wrapper.is-scrolled .site-header .nav-menu > li.menu-item-has-children > a:hover { color: #0D1C38 !important; background: rgba(255, 255, 255, 0.60); }
body.kp-transparent-header .site-header-wrapper.is-scrolled .site-header .nav-menu > li.menu-item-has-children.is-hovering > a { color: #0D1C38 !important; background: rgba(255, 255, 255, 0.60); }
body.kp-transparent-header .site-header-wrapper.is-scrolled .site-header .nav-menu > li.menu-item-has-children.mega-active > a { color: #ffffff !important; background: #2C3C5B; }
body.kp-transparent-header .site-header-wrapper.is-scrolled .site-header .nav-menu > li.menu-item-has-children.mega-active > a::after { filter: brightness(0) invert(1); }
body.kp-transparent-header .site-header-wrapper.is-scrolled .site-header .site-logo svg path,
body.kp-transparent-header .site-header-wrapper.is-scrolled .site-header .site-logo svg rect,
body.kp-transparent-header .site-header-wrapper.is-scrolled .site-header .site-logo svg polygon,
body.kp-transparent-header .site-header-wrapper.is-scrolled .site-header .site-logo svg circle,
body.kp-transparent-header .site-header-wrapper.is-scrolled .site-header .site-logo__svg path,
body.kp-transparent-header .site-header-wrapper.is-scrolled .site-header .site-logo__svg rect,
body.kp-transparent-header .site-header-wrapper.is-scrolled .site-header .site-logo__svg polygon,
body.kp-transparent-header .site-header-wrapper.is-scrolled .site-header .site-logo__svg circle { fill: #ffffff; }
body.kp-transparent-header .site-header-wrapper.is-scrolled .site-header .site-logo__img { filter: brightness(0) invert(1); }
body.kp-transparent-header .site-header-wrapper.is-scrolled .site-header .cta-btn { background: #ffffff; color: var(--color-primary, #0D1C38); }
body.kp-transparent-header .site-header-wrapper.is-scrolled .site-header .mobile-menu-toggle .mobile-menu-toggle__text,
body.kp-transparent-header .site-header-wrapper.is-scrolled .site-header .mobile-menu-toggle .mobile-menu-toggle__icon { color: #ffffff; }

/* ============================================================================
   6. LOGO
   ============================================================================ */
.site-logo {
    display: flex; align-items: center;
    text-decoration: none; color: var(--color-primary, #0D1C38);
    font-size: 24px; font-weight: bold; z-index: 10;
    max-width: 42px; max-height: 42px; height: auto;
}
.site-logo svg,
.site-logo__svg { display: block; height: 100%; width: auto; }
.site-logo img,
.site-logo__img { max-width: 42px; max-height: 42px; display: block; }

/* ============================================================================
   7. DESKTOP NAVIGATION
   ============================================================================ */
.desktop-navigation { display: none; }

.cta-btn {
    display: inline-flex; align-items: center;
    padding: 12px 16px;
    background: var(--color-primary, #0D1C38);
    text-decoration: none; color: #ffffff;
    font-family: var(--font-main, "acumin-pro", sans-serif);
    font-size: 1rem; font-weight: 400; line-height: 150%;
    min-height: 48px; transition: var(--transition);
}
.cta-btn:hover { opacity: 0.85; }

.cta-btn--secondary {
    background: transparent;
    color: var(--color-primary, #0D1C38);
    border: 1px solid var(--color-primary, #0D1C38);
}
.cta-btn--secondary:hover { background: rgba(13, 28, 56, 0.05); }

.header-cta-buttons.desktop-only { display: none; }

@media (min-width: 1280px) {
    .site-logo { max-width: 65px; max-height: 65px; height: auto; }
    .site-logo img,
    .site-logo__img { max-width: 65px; max-height: 65px; }
    .site-logo svg,
    .site-logo__svg { max-width: 65px; max-height: 65px; }

    .desktop-navigation { display: block; flex: 1; margin: 0; }

    .nav-menu {
        display: flex; list-style: none; margin: 0; padding: 0;
        align-items: center; gap: 32px; justify-content: flex-end;
    }
    .nav-menu > li { position: relative; }
    .nav-menu > li > a {
        font-family: var(--font-main, "acumin-pro", sans-serif);
        font-size: 16px; line-height: 150%; font-weight: 400;
        color: var(--color-primary, #0D1C38);
        text-decoration: none; display: inline-block; padding: 10px 0;
        transition: opacity 0.2s ease, color 0.2s ease, background 0.2s ease;
    }
    .nav-menu > li > a:hover { opacity: 1; }
    body:not(.kp-transparent-header) .nav-menu > li > a:hover { color: var(--color-primary, #0D1C38); }

    /* Parent items with children: dropdown chevron */
    .nav-menu > li.menu-item-has-children > a::after {
        content: '';
        display: inline-block;
        width: 13px;
        height: 13px;
        margin-left: 8px;
        vertical-align: middle;
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='6' viewBox='0 0 14 6' fill='none'%3E%3Cpath d='M13.0898 5.72181e-07C11.7506 0.0189698 10.2331 0.682896 9.00195 1.91211C7.77084 3.14132 7.10881 4.66077 7.08984 6L13.0898 5.72181e-07Z' fill='currentColor'/%3E%3Cpath d='M6.00001 6C5.98104 4.66077 5.31711 3.14322 4.0879 1.91211C2.85868 0.681 1.33924 0.0189697-2.14568e-07 3.09913e-07L6.00001 6Z' fill='currentColor'/%3E%3C/svg%3E");
        background-size: contain;
        background-repeat: no-repeat;
        background-position: center;
        flex-shrink: 0;
        transition: transform 0.2s ease;
    }

    /* Hover state for parent items with children — light bg + rotate chevron */
    .nav-menu > li.menu-item-has-children > a:hover {
        background: rgba(255, 255, 255, 0.60);
        color: #0D1C38 !important;
    }
    .nav-menu > li.menu-item-has-children > a:hover::after,
    .nav-menu > li.menu-item-has-children.is-hovering > a::after {
        transform: rotate(180deg);
    }

    /* Active state — mega menu panel is open */
    .nav-menu > li.menu-item-has-children.mega-active > a {
        background: #2C3C5B;
        color: #ffffff !important;
    }

    /* Transparent header white chevrons */
    body.kp-transparent-header .nav-menu > li.menu-item-has-children > a::after {
        filter: brightness(0) invert(1);
    }
    body.kp-transparent-header .nav-menu > li.menu-item-has-children > a:hover::after,
    body.kp-transparent-header .nav-menu > li.menu-item-has-children.is-hovering > a::after {
        filter: none;
    }
    body.kp-transparent-header .nav-menu > li.menu-item-has-children.mega-active > a::after {
        filter: brightness(0) invert(1);
    }

    /* Dropdown */
    .nav-menu > li:not(.has-mega) > .sub-menu {
        position: absolute; top: 100%; left: 10px; min-width: fit-content;
        margin: 0; padding: 10px 0; list-style: none;
        background: #fff; box-shadow: 0 10px 30px rgba(0, 0, 0, 0.15);
        opacity: 0; visibility: hidden; transform: translateY(-10px);
        transition: all 0.3s ease;
    }
    .nav-menu > li:not(.has-mega):hover > .sub-menu,
    .nav-menu > li:not(.has-mega):focus-within > .sub-menu {
        opacity: 1; visibility: visible; transform: translateY(0);
    }
    .nav-menu > li:not(.has-mega) > .sub-menu a {
        display: block; padding: 10px 20px;
        color: var(--color-primary, #0D1C38); text-decoration: none;
        font-family: var(--font-main, "acumin-pro", sans-serif); font-size: 16px;
    }
    .nav-menu > li:not(.has-mega) > .sub-menu a:hover { background: #f5f5f5; }

    /* Third level */
    .nav-menu > li:not(.has-mega) > .sub-menu .sub-menu {
        position: absolute; top: 0; left: 100%; min-width: 220px;
        background: #fff; box-shadow: 0 10px 30px rgba(0, 0, 0, 0.15);
        opacity: 0; visibility: hidden; transition: all 0.3s ease;
    }
    .nav-menu > li:not(.has-mega) > .sub-menu li:hover > .sub-menu {
        opacity: 1; visibility: visible;
    }

    .header-cta-buttons.desktop-only { display: flex; gap: 8px; align-items: center; margin-left: 16px; }
    .mobile-menu-toggle { display: none; }

    /* Language selector in desktop nav */
    .nav-menu > li.lang-selector {
    
    }
    .nav-menu > li.lang-selector > a {
        display: flex;
        gap: 4px;
        align-items: center;
    }
    .nav-menu > li.lang-selector > a::before {
        content: '';
        display: inline-block;
        width: 16px;
        height: 16px;
        /* De geoptimaliseerde SVG data-uri */
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 15 15' fill='none'%3E%3Cpath d='M13.193 10.72C13.8794 9.60177 14.2418 8.31498 14.24 7.00294V7.00269C14.2418 5.69063 13.8793 4.40383 13.193 3.28562L13.1891 3.27951C12.5523 2.24165 11.66 1.38443 10.5975 0.789753C9.53494 0.195077 8.33766 -0.117183 7.12002 -0.117187C5.90239 -0.117192 4.7051 0.195057 3.64256 0.789725C2.58001 1.38439 1.68772 2.24161 1.05094 3.27946L1.04698 3.28564C0.362319 4.40463 5.08198e-06 5.69096 0 7.00279C-5.08187e-06 8.31461 0.362299 9.60096 1.04695 10.7199L1.05098 10.7262C1.68776 11.764 2.58005 12.6213 3.64259 13.2159C4.70512 13.8106 5.9024 14.1228 7.12003 14.1228C8.33765 14.1228 9.53492 13.8105 10.5975 13.2159C11.66 12.6212 12.5523 11.764 13.189 10.7262L13.193 10.72ZM8.0301 12.9025C7.89442 13.0334 7.73826 13.1413 7.56779 13.2218C7.42787 13.2883 7.27491 13.3228 7.12 13.3228C6.96508 13.3228 6.81212 13.2883 6.6722 13.2218C6.3478 13.0561 6.0701 12.8118 5.8645 12.5111C5.44461 11.9043 5.13343 11.2291 4.94488 10.5158C5.66919 10.4712 6.39423 10.4485 7.12 10.4476C7.84547 10.4476 8.57055 10.4704 9.29523 10.5158C9.19087 10.8826 9.06051 11.2414 8.90515 11.5897C8.70057 12.0795 8.40347 12.5252 8.0301 12.9025ZM0.81392 7.40281H3.68576C3.70446 8.20416 3.79132 9.00246 3.9454 9.78908C3.16035 9.85816 2.37731 9.95304 1.59627 10.0737C1.13891 9.25318 0.871553 8.34044 0.81392 7.40281ZM1.59626 3.93189C2.37699 4.05288 3.16031 4.14778 3.94622 4.2166C3.79184 5.00317 3.70479 5.80146 3.68602 6.60281H0.81392C0.871549 5.66518 1.1389 4.75244 1.59626 3.93189ZM6.20989 1.10308C6.34556 0.972161 6.50172 0.864307 6.6722 0.783778C6.81212 0.717296 6.96508 0.682802 7.12 0.682802C7.27491 0.682802 7.42787 0.717296 7.56779 0.783778C7.89219 0.949479 8.16989 1.19385 8.37549 1.49455C8.79538 2.10131 9.10655 2.77647 9.2951 3.48985C8.57079 3.53442 7.84576 3.55713 7.12 3.55797C6.39453 3.55796 5.66945 3.53525 4.94476 3.48984C5.04912 3.12305 5.17948 2.76416 5.33484 2.4159C5.53942 1.92611 5.83653 1.48036 6.20989 1.10308ZM13.4261 6.60281H10.5542C10.5355 5.80146 10.4487 5.00315 10.2946 4.21653C11.0797 4.14745 11.8627 4.05257 12.6437 3.93189C13.1011 4.75244 13.3684 5.66518 13.4261 6.60281ZM4.75001 9.72688C4.59356 8.96151 4.5052 8.18378 4.48597 7.40281H9.75411C9.73505 8.18377 9.64685 8.96151 9.49055 9.72691C8.70123 9.67511 7.91105 9.64869 7.12 9.64766C6.32952 9.64765 5.53953 9.67406 4.75001 9.72688ZM9.48998 4.27872C9.64642 5.04411 9.73478 5.82184 9.75401 6.60281H4.48588C4.50494 5.82184 4.59313 5.0441 4.74944 4.27869C5.53876 4.33048 6.32894 4.3569 7.12 4.35796C7.91048 4.35796 8.70047 4.33154 9.48998 4.27872ZM10.554 7.40281H13.4261C13.3684 8.34044 13.1011 9.25318 12.6437 10.0737C11.863 9.95272 11.0797 9.85782 10.2938 9.78901C10.4482 9.00245 10.5352 8.20416 10.554 7.40281ZM12.1641 3.19558C11.4815 3.29406 10.7968 3.37204 10.1101 3.4295C9.98667 2.96999 9.8275 2.52084 9.63402 2.08617C9.45738 1.68616 9.23512 1.3079 8.97165 0.958919C10.2449 1.34941 11.3622 2.13222 12.1641 3.19558ZM2.65106 2.53388C3.38145 1.8028 4.28002 1.26204 5.26801 0.959014C5.25302 0.978428 5.2376 0.996982 5.22282 1.0168C4.715 1.74783 4.3451 2.56555 4.13136 3.42962C3.44462 3.37146 2.75948 3.29344 2.07593 3.19558C2.25222 2.96207 2.44439 2.74098 2.65106 2.53388ZM2.07593 10.81C2.75853 10.7115 3.44319 10.6336 4.12989 10.5761C4.25331 11.0356 4.41249 11.4848 4.60597 11.9195C4.78261 12.3195 5.00488 12.6977 5.26834 13.0467C3.99508 12.6562 2.87776 11.8734 2.07593 10.81ZM11.5889 11.4717C10.8585 12.2028 9.95997 12.7436 8.97198 13.0466C8.98697 13.0272 9.00238 13.0086 9.01717 12.9888C9.52499 12.2578 9.8949 11.4401 10.1086 10.576C10.7954 10.6342 11.4805 10.7122 12.1641 10.81C11.9878 11.0435 11.7956 11.2646 11.5889 11.4717' fill='currentColor'/%3E%3C/svg%3E");
        background-size: contain;
        background-repeat: no-repeat;
        background-position: center;
        flex-shrink: 0;
        vertical-align: middle;
        transition: filter 0.2s ease;
    }
    .nav-menu > li.lang-selector > a::after {
        CONTAIN-INTRINSIC-BLOCK-SIZE: AUTO 100PX;
        content: '';
        display: inline-block;
        width: 13px;
        height: 13px;
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='6' viewBox='0 0 14 6' fill='none'%3E%3Cpath d='M13.0898 5.72181e-07C11.7506 0.0189698 10.2331 0.682896 9.00195 1.91211C7.77084 3.14132 7.10881 4.66077 7.08984 6L13.0898 5.72181e-07Z' fill='currentColor'/%3E%3Cpath d='M6.00001 6C5.98104 4.66077 5.31711 3.14322 4.0879 1.91211C2.85868 0.681 1.33924 0.0189697-2.14568e-07 3.09913e-07L6.00001 6Z' fill='currentColor'/%3E%3C/svg%3E");
        background-size: contain;
        background-repeat: no-repeat;
        flex-shrink: 0;
        display: flex;
        background-position: center center;
        transition: filter 0.2s ease;
    }

    /* Transparent header: white icons via filter */
    body.kp-transparent-header .nav-menu > li.lang-selector > a::before,
    body.kp-transparent-header .nav-menu > li.lang-selector > a::after {
        filter: brightness(0) invert(1);
    }
    body.kp-transparent-header .site-header-wrapper.is-scrolled .site-header .nav-menu > li.lang-selector > a::before,
    body.kp-transparent-header .site-header-wrapper.is-scrolled .site-header .nav-menu > li.lang-selector > a::after {
        filter: brightness(0) invert(1);
    }

    /* Hover: ALLES op dezelfde li:hover EN is-hovering zodat tekst + icons synchroon transitioneren */
    body.kp-transparent-header .nav-menu > li.lang-selector:hover > a,
    body.kp-transparent-header .nav-menu > li.lang-selector.is-hovering > a {
        color: #0D1C38 !important;
        background: rgba(255, 255, 255, 0.60);
        transition: color 0.2s ease, background 0.2s ease;
    }
    body.kp-transparent-header .nav-menu > li.lang-selector:hover > a::before,
    body.kp-transparent-header .nav-menu > li.lang-selector:hover > a::after,
    body.kp-transparent-header .nav-menu > li.lang-selector.is-hovering > a::before,
    body.kp-transparent-header .nav-menu > li.lang-selector.is-hovering > a::after {
        filter: none;
    }
    body.kp-transparent-header .site-header-wrapper.is-scrolled .site-header .nav-menu > li.lang-selector:hover > a,
    body.kp-transparent-header .site-header-wrapper.is-scrolled .site-header .nav-menu > li.lang-selector.is-hovering > a {
        color: #0D1C38 !important;
        background: rgba(255, 255, 255, 0.60);
        transition: color 0.2s ease, background 0.2s ease;
    }
    body.kp-transparent-header .site-header-wrapper.is-scrolled .site-header .nav-menu > li.lang-selector:hover > a::before,
    body.kp-transparent-header .site-header-wrapper.is-scrolled .site-header .nav-menu > li.lang-selector:hover > a::after,
    body.kp-transparent-header .site-header-wrapper.is-scrolled .site-header .nav-menu > li.lang-selector.is-hovering > a::before,
    body.kp-transparent-header .site-header-wrapper.is-scrolled .site-header .nav-menu > li.lang-selector.is-hovering > a::after {
        filter: none;
    }
}

/* ============================================================================
   8. MEGA MENU — Shelf approach
   ============================================================================ */
/* Shelf sits inside <header> which is position:sticky.
   top:100% = directly below the header bar.
   height:0 + overflow:visible = no layout impact. */
/* Shelf: positioned below header with 8px gap */
.mega-panels-shelf {
    position: absolute;
    top: calc(100% + 8px);
    left: 24px;
    right: 24px;
    z-index: 999;
    pointer-events: none;
}

/* Invisible hover bridge — catches mouse in the 8px gap */
.mega-panels-shelf::before {
    content: '';
    position: absolute;
    top: -8px;
    left: 0;
    right: 0;
    height: 8px;
    pointer-events: auto;
}

.mega-menu__panel {
    display: none;
    background: #fff;
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.08);
    max-width: 1824px;
    margin: 0 auto;
    pointer-events: auto;
}
.mega-menu__panel.is-open { display: block; }

.mega-menu__backdrop {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0);
    z-index: 998; /* below header (1000) and shelf (999) */
    pointer-events: none; visibility: hidden;
    transition: background 0.3s ease;
}
.mega-menu__backdrop.is-active {
    background: rgba(0, 0, 0, 0.3); pointer-events: auto; visibility: visible;
}

/* Figma: panel-inner is the main flex container inside the white panel */
.mega-menu__panel-inner {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    padding: 32px;
}

/* Left: navigation columns */
.mega-menu__columns {
    flex: 0 0 auto;
    width: 390px;
    display: flex;
    flex-direction: column;
    gap: 24px;
    min-width: 0;
}

/* Multi-column layout (e.g. Producten with 4 columns) */
.mega-menu__columns > .mega-menu {
    display: flex;
    gap: 0;
    list-style: none;
    margin: 0;
    padding: 0;
}
.mega-menu__columns > .mega-menu[data-mega-cols="4"] {
    width: auto;
}
.mega-menu__columns > .mega-menu[data-mega-cols="4"] ~ .mega-menu__footer { display: none; }

/* Main title above columns (e.g. "Producten", "Over Klaas Puul") */
.mega-menu__main-title {
    font-family: var(--font-heading, "sofia-pro", sans-serif);
    font-size: 24px;
    line-height: 140%;
    font-weight: 400;
    color: var(--color-primary, #0D1C38);
    text-decoration: none;
    display: block;
}
a.mega-menu__main-title:hover {
    opacity: 0.7;
}

/* Column header */
.mega-menu__panel .mega-col {
    min-width: 0;
}
.mega-menu__panel .mega-col__header {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 24px;
}
.mega-menu__panel .mega-col__icon { width: 24px; height: 24px; object-fit: contain; }
.mega-menu__panel .mega-col__title {
    font-family: var(--font-heading, "sofia-pro", sans-serif);
    font-size: 24px;
    line-height: 140%;
    font-weight: 400;
    color: var(--color-primary, #0D1C38);
    margin: 0;
}
.mega-menu__panel a.mega-col__title { text-decoration: none; display: inline-block; }
.mega-menu__panel a.mega-col__title:hover { opacity: 0.7; }
.mega-menu__panel .mega-col__desc { font-size: 14px; color: #666; margin-top: 4px; }

/* Sub-menu items with KP chevron */
.mega-menu__panel .sub-menu {
    list-style: none;
    margin: 0;
    padding: 0;
}
.mega-menu__panel .sub-menu > li > a {
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 4px 8px;
    font-family: var(--font-main, "acumin-pro", sans-serif);
    font-size: 16px;
    line-height: 150%;
    font-weight: 400;
    color: var(--color-primary, #0D1C38);
    text-decoration: none;
    transition: opacity 0.2s ease;
}
.mega-menu__panel .sub-menu > li > a::before {
    content: '';
    display: inline-block;
    width: 8px;
    height: 18px;
    flex-shrink: 0;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8' height='18' viewBox='0 0 8 18' fill='none'%3E%3Cpath d='M0 0C0.025 1.786.91 3.809 2.55 5.45 4.188 7.092 6.214 7.975 8 8L0 0Z' fill='%230D1C38'/%3E%3Cpath d='M8 9.452C6.214 9.477 4.191 10.362 2.55 12.001.908 13.64.025 15.666 0 17.452L8 9.452Z' fill='%230D1C38'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-size: contain;
}
.mega-menu__panel .sub-menu > li > a:hover {
    opacity: 1;
    text-decoration: underline;
    text-underline-offset: 4px;
}

/* Footer link */
.mega-menu__footer { display: flex; flex-direction: column; gap: 24px; }
.mega-menu__footer-divider { border: none; border-top: 1px solid rgba(13, 28, 56, 0.25); margin: 0; }
.mega-menu__footer-link {
    display: inline-flex; align-items: center; gap: 10px;
    font-family: var(--font-main, "acumin-pro", sans-serif);
    font-size: 16px; font-weight: 500;
    color: var(--color-primary, #0D1C38); text-decoration: none;
}
.mega-menu__footer-link svg { width: 24px; height: 24px; transition: transform 0.2s ease; }
.mega-menu__footer-link:hover svg { transform: translateX(4px); }

/* Right: highlight cards */
.mega-menu__highlights {
    display: flex;
    gap: 16px;
    flex-shrink: 0;
    align-self: flex-start;
    overflow: hidden;
}
.mega-highlight {
    width: clamp(200px, 15vw, 320px);
    flex-shrink: 0;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    text-decoration: none;
    border: 0.5px solid #909090;
    background: #fff;
}
.mega-highlight__image {
    width: 100%;
    height: 254px;
    object-fit: cover;
    display: block;
}
/* Fallback for background-image style cards */
.mega-highlight[style*="background-image"] {
    min-height: 318px;
}
.mega-highlight__content {
    margin-top: auto;
}
.mega-highlight__btn {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 20px 24px;
    background: #fff;
    font-family: var(--font-main, "acumin-pro", sans-serif);
    font-size: 16px;
    font-weight: 400;
    line-height: 150%;
    color: var(--color-primary, #0D1C38);
    text-decoration: none;
}
.mega-highlight__btn-icon { width: 8px; height: 18px; flex-shrink: 0; transition: transform 0.3s ease; }
.mega-highlight:hover .mega-highlight__btn-icon { transform: translateX(4px); }

/* Multi-column mega (Producten): wider left, 2x2 grid layout */
.mega-menu__columns:has(> .mega-menu[data-mega-cols="3"]),
.mega-menu__columns:has(> .mega-menu[data-mega-cols="4"]) {
    width: 976px;
    flex: none;
}

/* Producten 4-col: display as 2x2 grid */
.mega-menu__columns > .mega-menu[data-mega-cols="4"] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    column-gap: 24px;
    row-gap: 40px;
}

/* Subtitels in multi-col: 18px instead of 24px, less margin */
.mega-menu__columns > .mega-menu[data-mega-cols="4"] .mega-col__title {
    font-size: 18px;
}
.mega-menu__columns > .mega-menu[data-mega-cols="4"] .mega-col__header {
    margin-bottom: 8px;
}

/* Each column fixed width in multi-col */
.mega-menu__columns > .mega-menu[data-mega-cols="4"] .mega-col {
    min-width: 0;
}

/* Sub-items: no gap between them */
.mega-menu__columns > .mega-menu[data-mega-cols="4"] .sub-menu {
    display: flex;
    flex-direction: column;
    gap: 0;
}

.mega-menu__columns > .mega-menu[data-mega-cols="3"] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    column-gap: 24px;
}

@media (min-width: 1280px) {
    .nav-menu > li.has-mega { position: unset; }
    .nav-menu > li.has-mega .mega-menu .sub-menu {
        position: static; opacity: 1; visibility: visible; transform: none;
        box-shadow: none; background: transparent; margin: 0; padding: 0;
    }
    a.mega-col__title {
        font-weight: 700; margin: 0 0 6px 0; display: inline-block;
        color: var(--color-primary, #0D1C38); text-decoration: none;
    }
    a.mega-col__title:hover { opacity: 0.7; }
}

/* ============================================================================
   9. MOBILE MENU TOGGLE
   ============================================================================ */
body button.mobile-menu-toggle,
body .mobile-menu-toggle {
    width: auto; height: auto; padding: 0;
    background: none; border: none; cursor: pointer;
    display: flex; gap: 8px; align-items: center;
    position: relative; z-index: 1100;
    color: var(--color-primary, #0D1C38);
}
body button.mobile-menu-toggle::before,
body .mobile-menu-toggle::before { content: none; display: none; }

body .mobile-menu-toggle .mobile-menu-toggle__text { display: none; }

/* Mobile header controls wrapper — lang toggle + hamburger with 16px gap */
.mobile-header-controls {
    display: flex;
    align-items: center;
    gap: 16px;
}
@media (min-width: 1280px) { .mobile-header-controls { display: none; } }

/* Mobile language toggle — LEFT of hamburger (Figma: globe 16px + "NL" text, gap 4px) */
.mobile-lang-toggle {
    position: relative;
    z-index: 1100;
}
.mobile-lang-toggle__btn {
    display: flex; align-items: center; gap: 4px;
    background: none; border: none; cursor: pointer; padding: 8px 0;
    color: var(--color-primary, #0D1C38); text-decoration: none;
    height: 24px;
}
.mobile-lang-toggle__globe { width: 16px; height: 16px; flex-shrink: 0; color: inherit; }
.mobile-lang-toggle__text {
    font-family: var(--font-main, "acumin-pro", sans-serif);
    font-size: 16px; line-height: 150%; font-weight: 400; color: inherit;
}
.mobile-lang-toggle__dropdown {
    display: none;
    position: absolute;
    top: calc(100% + 8px);
    left: 0;
    list-style: none;
    margin: 0;
    padding: 8px 0;
    background: #fff;
    box-shadow: 0 4px 12px rgba(0,0,0,0.15);
    min-width: unset;
    z-index: 1200;
}
.mobile-lang-toggle.is-open .mobile-lang-toggle__dropdown { display: block; }
.mobile-lang-toggle__dropdown li a {
    display: block;
    padding: 6px 16px;
    font-family: var(--font-main, "acumin-pro", sans-serif);
    font-size: 16px; line-height: 150%; font-weight: 400;
    color: var(--color-primary, #0D1C38);
    text-decoration: none;
}
.mobile-lang-toggle__dropdown li a:hover { background: #EBF1F8; }
body.kp-transparent-header .mobile-lang-toggle__btn { color: #ffffff; }
body.kp-transparent-header .site-header-wrapper.is-scrolled .mobile-lang-toggle__btn { color: #ffffff; }
@media (min-width: 1280px) { .mobile-lang-toggle { display: none; } }
body .mobile-menu-toggle .mobile-menu-toggle__icon {
    width: 24px; height: 24px; flex-shrink: 0;
    color: var(--color-primary, #0D1C38);
}
/* Hide language selector from expanded mobile menu (moved to header) */
.mobile-menu__footer .mobile-menu__lang-selector { display: none; }
body .mobile-menu-toggle.is-active .mobile-menu-toggle__icon--open { display: none !important; }
body .mobile-menu-toggle.is-active .mobile-menu-toggle__icon--close { display: block !important; }
body .mobile-menu-toggle .hamburger, .hamburger { display: none; }

@media (min-width: 1280px) {
    body button.mobile-menu-toggle, body .mobile-menu-toggle { display: none; }
    body .mobile-menu { display: none !important; }
}

/* ============================================================================
   10. MOBILE MENU
   ============================================================================ */
body .mobile-menu {
    position: fixed; inset: 0; z-index: 1050;
    pointer-events: none; visibility: hidden;
    background: var(--color-primary, #0D1C38);
    opacity: 0;
    transition: opacity 0.3s ease, visibility 0s linear 0.3s;
}
body .mobile-menu.is-active {
    pointer-events: auto; visibility: visible;
    opacity: 1;
    transition: opacity 0.3s ease, visibility 0s linear 0s;
}

body .mobile-menu .mobile-menu-overlay {
    position: absolute; inset: 0;
    background: var(--color-primary, #0D1C38); opacity: 0;
    transition: opacity 0.15s ease 0.2s; /* delay fade-out until content slides away */
}
body .mobile-menu.is-active .mobile-menu-overlay { opacity: 1; transition-delay: 0s; }

body .mobile-menu .mobile-menu__header {
    position: absolute; top: var(--top-header-offset, 0px); left: 0; right: 0;
    background: var(--color-primary, #0D1C38); display: flex; align-items: center;
    justify-content: center;
    padding: 16px;
    z-index: 20;
    /* Geen translate — logo en sluit-knop staan meteen op hun plek */
    opacity: 0; transition: opacity 0.15s ease;
}
body .mobile-menu.is-active .mobile-menu__header { opacity: 1; }

/* Inner bar that mirrors .header-container glassmorphism */
body .mobile-menu .mobile-menu__header-inner {
    display: flex; align-items: center; justify-content: space-between;
    width: 100%; max-width: calc(100% - 0px);
    background: var(--color-primary, #0D1C38);
    padding: 0;
    box-sizing: border-box;
}
body .mobile-menu .mobile-menu__header {
    min-height: 72px;
}
body .mobile-menu .mobile-menu__logo {
    display: flex; align-items: center; max-width: 42px; max-height: 42px; height: auto;
    text-decoration: none; flex-shrink: 0;
}
body .mobile-menu .mobile-menu__logo svg,
body .mobile-menu .mobile-menu__logo-svg { display: block; height: 100%; width: auto; }
body .mobile-menu .mobile-menu__logo-img { display: block; max-width: 42px; max-height: 42px; }

body .mobile-menu .mobile-menu__close {
    display: flex; gap: 8px; align-items: center;
    padding: 0; background: none; border: none; cursor: pointer;
    color: #ffffff;
}
body .mobile-menu .mobile-menu__close-text {
    font-family: var(--font-main, "acumin-pro", sans-serif);
    font-size: 16px; line-height: 150%; color: #ffffff;
}
body .mobile-menu .mobile-menu__close-icon { width: 24px; height: 24px; color: #ffffff; }

body .mobile-menu .mobile-nav-menu > li.lang-selector {
    display: none;
}

body .mobile-menu .mobile-menu-content {
    position: absolute; top: 0; right: 0;
    width: 100%; max-width: 100vw; height: 100%;
    background: var(--color-primary, #0D1C38); display: flex; flex-direction: column;
    padding-top: calc(88px + var(--top-header-offset, 0px));
    transform: translateX(100%); transition: transform 0.3s ease;
    overflow: hidden;
}
body .mobile-menu.is-active .mobile-menu-content { transform: translateX(0); }

body .mobile-menu .mobile-menu__cta-links {
    padding: 24px 16px 0; display: flex; justify-content: space-between; flex-shrink: 0;
}
body .mobile-menu .mobile-menu__cta-link {
    color: #ffffff;
    font-family: var(--font-main, "acumin-pro", sans-serif);
    font-size: 16px; line-height: 150%; font-weight: 700; text-decoration: underline;
}

body .mobile-menu .mobile-menu__items {
    flex: 1; overflow-y: auto; overflow-x: hidden;
    position: relative; padding-top: 24px;
    -webkit-overflow-scrolling: touch;
}

body .mobile-menu .mobile-nav-menu {
    list-style: none; margin: 0; padding: 0 16px;
    display: flex; flex-direction: column;
}
body .mobile-menu .mobile-nav-menu > li > a {
    display: flex; align-items: center; justify-content: space-between;
    padding: 14px 18px 12px 18px;
    font-family: var(--font-main, "acumin-pro", sans-serif);
    font-size: 16px; line-height: 150%;
    color: #ffffff; text-decoration: none; background: none;
}
body .mobile-menu .mobile-nav-menu > li + li {
    border-top: 1px solid rgba(255, 255, 255, 0.25);
}
body .mobile-menu .mobile-nav-menu > li + li::before { display: none; }

/* KP chevron arrow for menu items with children */
body .mobile-menu .mobile-nav-menu > li.menu-item-has-children > a::after {
    content: ''; width: 8px; height: 18px; flex-shrink: 0;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8' height='18' viewBox='0 0 8 18' fill='none'%3E%3Cpath d='M0 0C.025 1.786.91 3.809 2.55 5.45 4.188 7.092 6.214 7.975 8 8L0 0Z' fill='%23ffffff'/%3E%3Cpath d='M8 9.452C6.214 9.477 4.191 10.362 2.55 12.001.908 13.64.025 15.666 0 17.452L8 9.452Z' fill='%23ffffff'/%3E%3C/svg%3E");
    background-size: contain; background-repeat: no-repeat;
}

body .mobile-menu .mobile-nav-menu .submenu-toggle { display: none; }
body .mobile-menu .mobile-nav-menu .sub-menu { display: none; }
body .mobile-menu .mobile-cta-buttons { display: none; }

/* ============================================================================
   11. MOBILE SUBMENU PANELS — Drill-down
   ============================================================================ */
body .mobile-submenu-panel {
    position: absolute; inset: 0; background: #0D1C38;
    transform: translateX(100%); transition: transform 0.3s ease;
    z-index: 10; display: flex; flex-direction: column;
    overflow: hidden; padding-top: 24px;
}
body .mobile-submenu-panel.is-active { transform: translateX(0); }
body .mobile-submenu-panel__scroll { flex: 1; overflow-y: auto; -webkit-overflow-scrolling: touch; padding: 0 16px; }

body .mobile-submenu-panel__back {
    display: flex; gap: 8px; align-items: center;
    padding: 14px 18px 12px 18px; cursor: pointer;
    background: none; border: none; width: 100%; text-align: left;
    font-family: var(--font-main, "acumin-pro", sans-serif);
    font-size: 16px; line-height: 150%; font-weight: 600;
    color: #ffffff; margin: 0 16px;
}
body .mobile-submenu-panel__back svg { width: 8px; height: 18px; transform: rotate(180deg); color: #ffffff; }

body .mobile-submenu-panel__back + .mobile-submenu-panel__divider {
    border: none; border-top: 1px solid rgba(255, 255, 255, 0.25); margin: 0 16px;
}

body .mobile-submenu-panel__list { list-style: none; margin: 0; padding: 0; }
body .mobile-submenu-panel__list > li > a {
    display: flex; align-items: center; justify-content: space-between;
    padding: 14px 18px 12px 18px;
    font-family: var(--font-main, "acumin-pro", sans-serif);
    font-size: 16px; line-height: 150%;
    color: #ffffff; text-decoration: none;
}
/* KP chevron on submenu items with children */
body .mobile-submenu-panel__list > li.has-children > a::after {
    content: ''; width: 8px; height: 18px; flex-shrink: 0;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8' height='18' viewBox='0 0 8 18' fill='none'%3E%3Cpath d='M0 0C.025 1.786.91 3.809 2.55 5.45 4.188 7.092 6.214 7.975 8 8L0 0Z' fill='%23ffffff'/%3E%3Cpath d='M8 9.452C6.214 9.477 4.191 10.362 2.55 12.001.908 13.64.025 15.666 0 17.452L8 9.452Z' fill='%23ffffff'/%3E%3C/svg%3E");
    background-size: contain; background-repeat: no-repeat;
}
body .mobile-submenu-panel__list > li + li { border-top: 1px solid rgba(255, 255, 255, 0.25); }
/* Parent link as first item in panel — bold styling */
body .mobile-submenu-panel__parent-link > a {
    font-weight: 600;
    text-decoration: underline;
    text-underline-offset: 4px;
}

body .mobile-submenu-panel__footer { padding: 14px 18px 12px 18px; border-top: 1px solid rgba(255, 255, 255, 0.25); }
body .mobile-submenu-panel__footer a {
    font-family: var(--font-main, "acumin-pro", sans-serif);
    font-size: 16px; font-weight: 600;
    color: #ffffff; text-decoration: underline;
}

/* Mobile search input */
body .mobile-menu .mobile-menu__search {
    padding: 24px 16px;
    flex-shrink: 0;
}
body .mobile-menu .mobile-menu__search-input-wrap {
    display: flex;
    align-items: center;
    gap: 12px;
    background: linear-gradient(to left, rgba(235, 241, 248, 0.5), rgba(235, 241, 248, 0.5)), #ffffff;
    border: 1px solid rgba(13, 28, 56, 0.25);
    padding: 12px;
    cursor: pointer;
}
body .mobile-menu .mobile-menu__search-icon {
    flex-shrink: 0;
    width: 24px;
    height: 24px;
}
body .mobile-menu .mobile-menu__search-input {
    flex: 1;
    border: none;
    background: transparent;
    outline: none;
    font-family: var(--font-main, "acumin-pro", sans-serif);
    font-size: 16px;
    font-weight: 400;
    line-height: 150%;
    color: #000;
    cursor: pointer;
}
body .mobile-menu .mobile-menu__search-input::placeholder {
    color: rgba(0, 0, 0, 0.6);
}

/* Mobile language selector */
body .mobile-menu .mobile-menu__footer {
    flex-shrink: 0; padding: 24px 0px;
    margin-top: auto;
}
body .mobile-menu .mobile-menu__lang-selector {
    display: none !important; align-items: center; gap: 8px;
    padding: 16px;
    border-top: 1px solid rgba(255, 255, 255, 0.25);
    border-bottom: 1px solid rgba(255, 255, 255, 0.25);
    background: transparent; text-decoration: none; cursor: pointer;
    color: #ffffff;
    margin: 0;
    position: relative;
}
body .mobile-menu .mobile-menu__lang-selector:active { background: rgba(255, 255, 255, 0.05); }
body .mobile-menu .mobile-menu__lang-globe {
    flex-shrink: 0; width: 16px; height: 16px; color: #ffffff;
}
body .mobile-menu .mobile-menu__lang-text {
    font-family: var(--font-main, "acumin-pro", sans-serif);
    font-size: 16px; line-height: 150%; color: #ffffff; flex: 1;
}
body .mobile-menu .mobile-menu__lang-chevron {
    flex-shrink: 0; width: 6px; height: 14px; color: #ffffff;
    transition: transform 0.2s ease;
}
body .mobile-menu .mobile-menu__lang-selector.is-open .mobile-menu__lang-chevron {
    transform: rotate(90deg);
}

/* Language dropdown */
body .mobile-menu .mobile-menu__lang-dropdown {
    display: none;
    position: absolute; bottom: 100%; left: 0; right: 0;
    list-style: none; margin: 0; padding: 0;
    background: var(--color-primary, #0D1C38);
    border-top: 1px solid rgba(255, 255, 255, 0.25);
}
body .mobile-menu .mobile-menu__lang-selector.is-open .mobile-menu__lang-dropdown {
    display: block;
}
body .mobile-menu .mobile-menu__lang-dropdown li a {
    display: block; padding: 12px 16px;
    color: #ffffff; text-decoration: none;
    font-family: var(--font-main, "acumin-pro", sans-serif);
    font-size: 16px; line-height: 150%;
}
body .mobile-menu .mobile-menu__lang-dropdown li a:hover,
body .mobile-menu .mobile-menu__lang-dropdown li a:active {
    background: rgba(255, 255, 255, 0.05);
}

/* ============================================================================
   12. RESPONSIVE BREAKPOINTS
   ============================================================================ */
@media (max-width: 1279px) {
    .desktop-navigation { display: none !important; }
    .header-cta-buttons.desktop-only { display: none !important; }
    .mega-panels-shelf { display: none !important; }
    .site-header { height: 64px; }
    :root { --header-height: 64px; }

    body.kp-transparent-header .site-header .inner {
        margin: 16px auto; padding: 0;
    }
    body.kp-transparent-header .site-header .header-container {
        max-width: calc(100% - 32px); padding: 16px;
    }
}

@media (max-width: 1024px) {
    body.kp-transparent-header .site-header .inner {
        margin: 16px auto; padding: 0;
    }
    body.kp-transparent-header .site-header .header-container {
        max-width: calc(100% - 32px); padding: 16px;
    }
}

/* Body state */
body.menu-open { overflow: hidden !important; }
@media (min-width: 1280px) {
    body.menu-open { overflow: auto !important; position: static; }
}

/* Lang selector hover handled above in desktop nav section */