/* ============================================================================
   KLAAS PUUL - HOMEPAGE SECTIES CSS
   Gebaseerd op Figma design (desktop 1920px)
   Fonts: "sofia-pro" (headings), "acumin-pro" (body)
   Primaire kleur: #0D1C38 (donkerblauw)
   ============================================================================ */

/* ============================================================================
   GLOBAL: KP Button Styles
   ============================================================================ */

.kp-btn {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    padding: 16px 32px;
    font-family: var(--font-main, "acumin-pro", sans-serif);
    font-size: 16px;
    line-height: 150%;
    font-weight: 400;
    text-decoration: none;
    transition: all 0.3s ease;
    height: 56px;
    box-sizing: border-box;
    width: fit-content;
}
.kp-btn__arrow {
    display: inline-flex;
    align-items: center;
    flex-shrink: 0;
    transition: transform 0.3s ease;
}
.kp-btn:hover .kp-btn__arrow {
    transform: translateX(4px);
}
/* Primair wit (op donkere achtergrond) */

.kp-btn.btn-primary-white {
    background: #ffffff;
    color: var(--color-primary, #0D1C38);
}
.kp-btn.btn-primary-white:hover {
    background: rgba(255, 255, 255, 0.85);
}
/* Outline wit */

.kp-btn.btn-outline-white {
    background: transparent;
    border: 1px solid #ffffff;
    color: #ffffff;
}
.kp-btn.btn-outline-white:hover {
    background: rgba(255, 255, 255, 0.1);
}
/* Primair donker (op lichte achtergrond) */

.kp-btn.btn-primary-dark {
    background: var(--color-primary, #0D1C38);
    color: #ffffff;
}
.kp-btn.btn-primary-dark:hover {
    background: var(--color-primary-hover, #091428);
}
/* Outline donker */

.kp-btn.btn-outline-dark {
    background: transparent;
    border: 1px solid var(--color-primary, #0D1C38);
    color: var(--color-primary, #0D1C38);
}
.kp-btn.btn-outline-dark:hover {
    background: rgba(13, 28, 56, 0.05);
}
/* ============================================================================
   1. KP HERO BANNER
   ============================================================================ */

.kp-hero-banner {
    position: relative;
    width: 100%;
}
.kp-hero-banner__bg {
    position: relative;
    width: 100%;
    min-height: 500px;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
}
.kp-hero-banner__overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(to top, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.1));
    pointer-events: none;
}
.kp-hero-banner__content {
    position: relative;
    z-index: 2;
    padding: 80px 0;
}
.kp-hero-banner__title {
    color: #ffffff;
    font-family: var(--font-heading, "sofia-pro", sans-serif);
    font-size: 32px;
    line-height: 120%;
    font-weight: 400;
    max-width: 1361px;
    margin-bottom: 40px;
}
.kp-hero-banner__title:last-child {
    margin-bottom: 0;
}
/* Centered hero variant (thank you page, etc.) */
.kp-hero-banner.kp-hero-centered .kp-hero-banner__content {
    padding: 160px 0;
}
.kp-hero-banner.kp-hero-centered .kp-hero-banner__content .inner {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
}
.kp-hero-banner.kp-hero-centered .kp-hero-banner__title {
    text-align: center;
    width: 100%;
}
.kp-hero-banner.kp-hero-centered .kp-hero-banner__description {
    text-align: center;
}
.kp-hero-banner.kp-hero-centered .kp-hero-banner__buttons {
    justify-content: center;
}
.kp-hero-banner__deco-img {
    width: 95px;
    height: auto;
    margin-bottom: 40px;
}
.kp-hero-banner__deco {
    position: absolute;
    inset: 0;
    pointer-events: none;
    z-index: 0;
    display: none;
}
@media (min-width: 1024px) {
    .kp-hero-banner__deco {
        display: block;
    }
}
.kp-hero-banner__content .inner > *:not(.kp-hero-banner__deco) {
    position: relative;
    z-index: 1;
}
.kp-hero-banner__description {
    color: #ffffff;
    font-family: var(--font-main, "acumin-pro", sans-serif);
    font-size: 18px;
    line-height: 150%;
    font-weight: 400;
    max-width: 921px;
    margin: 0 0 40px 0;
}
.kp-hero-banner__description:last-child {
    margin-bottom: 0;
}
.kp-hero-banner__usps {
    list-style: none;
    margin: 24px 0 32px;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.kp-hero-banner__usp {
    display: flex;
    align-items: center;
    gap: 8px;
    font-family: var(--font-main, 'acumin-pro', sans-serif);
    font-size: 16px;
    line-height: 150%;
    color: #ffffff;
}
.kp-hero-banner__usp svg {
    flex-shrink: 0;
    width: 18px;
    height: 18px;
}
.kp-hero-banner__usp span strong,
.kp-hero-banner__usp span b {
    font-weight: 700;
}
.kp-hero-banner__buttons {
    display: flex;
    gap: 16px;
    flex-wrap: wrap;
}

/* Hero search bar — Figma mobile: full width, padding 12px, gap 12px, bg linear-gradient(rgba(235,241,248,0.5)) */
.kp-hero-banner__search {
    display: flex;
    align-items: center;
    gap: 12px;
    width: 100%;
    padding: 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);
    box-sizing: border-box;
    margin-top: 24px;
}
@media (min-width: 1024px) {
    .kp-hero-banner__search {
        max-width: 720px;
        margin-top: 32px;
    }
}
.kp-hero-banner__search-icon {
    flex-shrink: 0;
    width: 24px;
    height: 24px;
    color: var(--color-primary, #0D1C38);
}
.kp-hero-banner__search-input {
    flex: 1;
    border: none;
    background: transparent;
    outline: none;
    font-family: var(--font-main, "acumin-pro", sans-serif);
    font-size: 16px;
    line-height: 150%;
    color: #000;
    padding: 0;
}
.kp-hero-banner__search-input::placeholder {
    color: rgba(0, 0, 0, 0.6);
}

/* Pagebuilder breadcrumbs — sits inside dark hero area */
.breadcrumbs {
    background: var(--color-primary, #0D1C38);
    padding: 12px 0 0;
    position: relative; z-index: 2;
}
.breadcrumbs .inner {
    font-family: var(--font-main, "acumin-pro", sans-serif);
    font-size: 14px; line-height: 150%;
    color: #ffffff;
}
.breadcrumbs a { color: #ffffff; text-decoration: underline; }
.breadcrumbs a:hover { text-decoration: none; }
.breadcrumbs .separator {
    font-size: 0;
    display: inline-flex; align-items: center; justify-content: center;
    margin: 0 8px; vertical-align: middle; width: 6px; height: 14px;
}
.breadcrumbs .separator::after {
    content: ''; display: block; width: 6px; height: 14px;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='6' height='14' viewBox='0 0 6 14' fill='none'%3E%3Cpath d='M0 0C0.018969 1.33921 0.682885 2.85673 1.91208 4.08781C3.14127 5.3189 4.66069 5.98091 5.9999 5.99988L0 0Z' fill='white'/%3E%3Cpath d='M5.9999 7.08887C4.66069 7.10784 3.14317 7.77175 1.91208 9.00094C0.680988 10.2301 0.018969 11.7495 0 13.0887L5.9999 7.08887Z' fill='white'/%3E%3C/svg%3E") no-repeat center / contain;
}
.breadcrumbs .rank-math-breadcrumb a { color: #ffffff; }
.breadcrumbs .rank-math-breadcrumb .last { opacity: 0.7; }

/* Compact hero variant (subpages like product overview) */
.kp-hero-banner.hero-compact {
    padding: 0 !important;
}
.kp-hero-banner.hero-compact .kp-hero-banner__bg {
    min-height: 280px; height: auto;
}
.kp-hero-banner.hero-compact .kp-hero-banner__content {
    padding: 0;
    display: flex; align-items: flex-end;
}
.kp-hero-banner.hero-compact .kp-hero-banner__content .inner {
    padding: 80px 16px;
}
.kp-hero-banner.hero-compact .kp-hero-banner__title {
    font-size: clamp(24px, 2vw + 16px, 48px);
}
@media (max-width: 1023px) {
    .kp-hero-banner.hero-compact .kp-hero-banner__bg {
        min-height: auto; height: auto; min-height: 200px;
    }
    .kp-hero-banner.hero-compact .kp-hero-banner__content {
        padding: 0;
    }
    .kp-hero-banner.hero-compact .kp-hero-banner__content .inner {
        padding: 40px 16px;
    }
}

/* Desktop */

@media (min-width: 1024px) {
    .kp-hero-banner__bg {
        min-height: 430px;
    }
    .kp-hero-banner__content {
        padding: 80px 0rem;
    }
    .kp-hero-banner__title {
        font-size: clamp(32px, 2.5vw, 48px);
    }
}
/* ============================================================================
   2. KP SECTION LABEL
   ============================================================================ */

.kp-section-label {
    padding: 3rem 0;
    /* 48px */
}
.kp-section-label.bg-white {
    background: #ffffff;
}
.kp-section-label.bg-dark {
    background: var(--color-primary, #0D1C38);
}
.kp-section-label.text-light {
    color: #ffffff;
}
.kp-section-label.text-dark {
    color: var(--color-primary, #0D1C38);
}
.kp-section-label .inner {
    padding-left: 1rem;
    padding-right: 1rem;
}
.kp-section-label__inner {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}
.kp-section-label__inner--with-btn {
    justify-content: space-between;
    width: 100%;
    gap: 16px;
}
.kp-section-label__left {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}
.kp-section-label__btn {
    display: none;
}
@media (min-width: 1024px) {
    .kp-section-label__btn {
        display: inline-flex;
    }
}
.kp-section-label__arrow {
    display: inline-flex;
    flex-shrink: 0;
}
.kp-section-label__text {
    font-family: var(--font-main, "acumin-pro", sans-serif);
    font-size: 1.125rem;
    /* 18px */
    line-height: 150%;
    font-weight: 400;
}
/* Large variant: sofia-pro heading font, 32px desktop / 24px mobile */
.kp-section-label--large .kp-section-label__text {
    font-family: var(--font-heading, "sofia-pro", sans-serif);
    font-size: clamp(1.5rem, 1.2rem + 0.5vw, 2rem); /* 24px → 32px */
    line-height: 130%;
}
.kp-section-label--large .kp-section-label__chevron {
    width: 12px; height: 26px;
}
@media (max-width: 1024px) {
    .kp-section-label .inner {
        padding-left: 1rem;
        padding-right: 1rem;
    }
}
/* ============================================================================
   3. KP TEKST + USP BLOKKEN
   ============================================================================ */

.kp-text-usp {
    background: #ffffff;
}
.kp-text-usp .inner {
    padding-left: 1rem;
    padding-right: 1rem;
}
.kp-text-usp__grid {
    display: flex;
    flex-direction: column;
    gap: 80px;
}
.kp-text-usp__title {
    font-family: var(--font-heading, "sofia-pro", sans-serif);
    font-size: 48px;
    line-height: 100%;
    font-weight: 400;
    color: var(--color-primary, #0D1C38);
    margin-bottom: 24px;
}
.kp-text-usp__text {
    font-family: var(--font-main, "acumin-pro", sans-serif);
    font-size: 20px;
    line-height: 150%;
    color: var(--color-primary, #0D1C38);
    margin-bottom: 40px;
}
.kp-text-usp__buttons {
    display: flex;
    gap: 16px;
    flex-wrap: wrap;
}
.kp-text-usp__item {
    padding: 0 0 40px 0;
}
.kp-text-usp__item-title {
    font-family: var(--font-heading, "sofia-pro", sans-serif);
    font-size: 24px;
    line-height: 130%;
    font-weight: 400;
    color: var(--color-primary, #0D1C38);
    margin-bottom: 16px;
}
.kp-text-usp__item-text {
    font-family: var(--font-main, "acumin-pro", sans-serif);
    font-size: 16px;
    line-height: 150%;
    color: var(--color-primary, #0D1C38);
}
.kp-text-usp__divider {
    border-top: 1px solid rgba(13, 28, 56, 0.25);
    margin-bottom: 40px;
}
.kp-text-usp__divider:last-child {
    margin-bottom: 0;
}
/* Desktop: twee kolommen */

@media (min-width: 1024px) {
    .kp-text-usp__grid {
        flex-direction: row;
        gap: var(--kp-content-gap, 200px);
    }
    .kp-text-usp__left {
        /* Figma: 817px / 1720px content = 47.5% */
        flex: 0 0 47.5%;
    }
    .kp-text-usp__right {
        flex: 1;
    }
    .kp-text-usp__title {
        font-size: clamp(48px, 5.2vw, 64px);
    }
    .kp-text-usp__text {
        font-size: clamp(20px, 1.25vw, 24px);
    }
    .kp-text-usp__item-title {
        font-size: clamp(24px, 1.667vw, 32px);
    }
}
@media (max-width: 1024px) {
    .kp-text-usp .inner {
        padding-left: 1rem;
        padding-right: 1rem;
    }
}
/* ============================================================================
   4. KP FULLSCREEN MARKTEN
   ============================================================================ */

.kp-fullscreen-markets {
    position: relative;
    width: 100%;
    min-height: 100vh;
    background-size: cover;
    background-position: center;
    display: flex;
    align-items: center;
    color: #ffffff;
    overflow: hidden;
}
.kp-fullscreen-markets__overlay {
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.25);
    pointer-events: none;
    z-index: 0;
}
.kp-fullscreen-markets__sidebar {
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 123px;
    z-index: 2;
    border-right: 1px solid rgba(255, 255, 255, 0.25);
    display: none;
}
.kp-fullscreen-markets__sidebar-inner {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    transform: rotate(-90deg);
    transform-origin: left bottom;
    position: absolute;
    bottom: 3rem;
    left: 3.75rem;
    white-space: nowrap;
    color: #ffffff;
}
.kp-fullscreen-markets__sidebar-text {
    font-family: var(--font-main, "acumin-pro", sans-serif);
    font-size: 18px;
    line-height: 150%;
}
.kp-fullscreen-markets__content {
    position: relative;
    z-index: 2;
    display: flex;
    flex-direction: column;
    gap: 40px;
    width: 100%;
    padding: 80px 1rem;
}
.kp-fullscreen-markets__title {
    font-family: var(--font-heading, "sofia-pro", sans-serif);
    font-size: 48px;
    line-height: 120%;
    font-weight: 400;
    color: #ffffff;
}
.kp-fullscreen-markets__text {
    font-family: var(--font-main, "acumin-pro", sans-serif);
    font-size: 20px;
    line-height: 140%;
    color: #ffffff;
    max-width: 495px;
}
.kp-fullscreen-markets__right {
    background: #ffffff;
    padding: 24px;
}
.kp-fullscreen-markets__images-grid {
    position: relative;
    width: 100%;
    aspect-ratio: 1;
    overflow: hidden;
}
.kp-fullscreen-markets__shape {
    position: absolute;
    width: 40px;
    height: 40px;
}
.kp-fullscreen-markets__shape--tl { top: 0; left: 0; }
.kp-fullscreen-markets__shape--tr { top: 0; right: 0; }
.kp-fullscreen-markets__shape--bl { bottom: 0; left: 0; }
.kp-fullscreen-markets__shape--br { bottom: 0; right: 0; }
.kp-fullscreen-markets__image-item img {
    width: 100%;
    height: auto;
    display: block;
}
.kp-fullscreen-markets__caption {
    color: #000000;
    text-align: center;
    font-family: var(--font-main, "acumin-pro", sans-serif);
    font-size: 24px;
    padding-top: 16px;
}
/* Desktop */

@media (min-width: 1024px) {
    .kp-fullscreen-markets__sidebar {
        display: block;
    }
    .kp-fullscreen-markets__content {
        flex-direction: row;
        justify-content: space-between;
        align-items: center;
        padding: 0 clamp(80px, 10.42vw, 200px);
    }
    .kp-fullscreen-markets__left {
        flex: 1;
        display: flex;
        flex-direction: column;
        gap: 32px;
    }
    .kp-fullscreen-markets__right {
        /* Figma: 580px grid op 1920px = 30.2vw */
        flex: 0 0 clamp(380px, 30.2vw, 600px);
        height: clamp(380px, 30.2vw, 600px);
        display: flex;
        flex-direction: column;
        justify-content: space-between;
    }
    .kp-fullscreen-markets__title {
        font-size: clamp(48px, 5.2vw, 64px);
    }
    .kp-fullscreen-markets__text {
        font-size: clamp(20px, 1.25vw, 24px);
    }
}
/* ============================================================================
   5. KP PRODUCT CARDS (SLIDER)
   ============================================================================ */

.kp-product-cards {
    background: #ffffff;
}
.kp-product-cards .inner {
    padding-left: 1rem;
    padding-right: 1rem;
}
.kp-product-cards__grid {
    display: flex;
    gap: 16px;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
}
.kp-product-cards__grid::-webkit-scrollbar {
    display: none;
}
/* When owl is active, reset flex/scroll so owl controls layout */

.kp-product-cards__grid.owl-loaded {
    display: block;
    overflow: visible;
    scroll-snap-type: none;
    gap: 0;
}
.kp-product-cards__grid.owl-loaded .owl-stage {
    touch-action: pan-y;
    -ms-touch-action: pan-y;
}
.kp-product-cards__grid.owl-loaded .owl-item {
    touch-action: pan-y;
}
.kp-product-card {
    flex: 0 0 calc(33.333% - 11px);
    min-width: 280px;
    display: flex;
    flex-direction: column;
    gap: 32px;
    scroll-snap-align: start;
}
.owl-loaded .kp-product-card {
    flex: none;
    min-width: 0;
    width: 100%;
}
.kp-product-card__image {
    width: 100%;
    aspect-ratio: 1/1.3;
    overflow: hidden;
    border: 1px solid rgba(13, 28, 56, 0.25);
    max-height:33.86806rem;
}
.kp-product-card__image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.kp-product-card__content {
    display: flex;
    flex-direction: column;
    gap: 16px;
    padding-right: 16px;
}
.kp-product-card__header {
    display: flex;
    flex-direction: column;
    gap: 0;
}
.kp-product-card__title {
    font-family: var(--font-heading, "sofia-pro", sans-serif);
    font-size: 24px;
    line-height: 130%;
    font-weight: 400;
    color: var(--color-primary, #0D1C38);
}
.kp-product-card__subtitle {
    font-family: var(--font-main, "acumin-pro", sans-serif);
    font-size: 16px;
    line-height: 150%;
    color: var(--color-primary, #0D1C38);
    font-style: italic;
}
.kp-product-card__text {
    font-family: var(--font-main, "acumin-pro", sans-serif);
    font-size: 16px;
    line-height: 150%;
    color: var(--color-primary, #0D1C38);
}
/* Slider nav */

.kp-product-cards__nav {
    display: flex;
    align-items: center;
    gap: 24px;
    margin-top: 40px;
}
.kp-product-cards__line {
    flex: 1;
    height: 4px;
    background: rgba(13, 28, 56, 0.25);
    position: relative;
}
.kp-product-cards__line-progress {
    position: absolute;
    top: 0;
    left: 0;
    height: 4px;
    background: #0D1C38;
    transition: width 0.3s ease;
    width: 0%;
}
.kp-product-cards__arrows {
    display: flex;
    gap: 16px;
}
.kp-slider-arrow {
    width: 48px;
    height: 48px;
    border-radius: 50px;
    border: 1px solid var(--color-primary, #0D1C38);
    background: #ffffff;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: all 0.3s ease;
    color: var(--color-primary, #0D1C38);
}
.kp-slider-arrow:hover {
    background: var(--color-primary, #0D1C38);
    color: #ffffff;
}
@media (min-width: 1024px) {
    .kp-product-card__title {
        font-size: clamp(24px, 1.667vw, 32px);
    }
}
@media (max-width: 1024px) {
    .kp-product-cards .inner {
        padding-left: 1rem;
        padding-right: 1rem;
    }
    .kp-product-card {
        flex: 0 0 85%;
    }
}
/* ============================================================================
   6. KP ACCORDION RIJEN
   ============================================================================ */

.kp-accordion-rows {
    background: #ffffff;
}
.kp-accordion-rows.bg-dark {
    background: var(--color-primary, #0D1C38);
}
.kp-accordion-rows .inner {
    padding-left: 1rem;
    padding-right: 1rem;
}
.kp-accordion-rows__header {
    display: flex;
    flex-direction: column;
    gap: 40px;
    margin-bottom: 120px;
}
.kp-accordion-rows .kp-pd-cert__logos {
    margin-bottom: 80px;
}
.kp-accordion-rows__title {
    font-family: var(--font-heading, "sofia-pro", sans-serif);
    font-size: 48px;
    line-height: 100%;
    font-weight: 400;
    color: var(--color-primary, #0D1C38);
}
.kp-accordion-rows.text-light .kp-accordion-rows__title, .kp-accordion-rows.text-light .kp-accordion-rows__intro, .kp-accordion-rows.text-light .kp-accordion-rows__item-title {
    color: #ffffff;
}
.kp-accordion-rows__intro {
    font-family: var(--font-main, "acumin-pro", sans-serif);
    font-size: 20px;
    line-height: 150%;
    color: var(--color-primary, #0D1C38);
}
.kp-accordion-rows__item-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 40px 0;
    cursor: pointer;
}
.kp-accordion-rows__item:first-child .kp-accordion-rows__item-header {
    padding-top: 0;
}
.kp-accordion-rows__item-title {
    font-family: var(--font-heading, "sofia-pro", sans-serif);
    font-size: 24px;
    line-height: 130%;
    font-weight: 400;
    color: var(--color-primary, #0D1C38);
}
.kp-accordion-rows__item-arrow {
    display: inline-flex;
    transition: transform 0.3s ease;
    color: var(--color-primary, #0D1C38);
}
.kp-accordion-rows.text-light .kp-accordion-rows__item-arrow {
    color: #ffffff;
}
.kp-accordion-rows__item[aria-expanded="true"] .kp-accordion-rows__item-arrow {
    transform: rotate(180deg);
}
.kp-accordion-rows__item-body {
    display: grid;
    grid-template-rows: 0fr;
    transition: grid-template-rows 0.35s ease;
}
.kp-accordion-rows__item-body>* {
    overflow: hidden;
    min-height: 0;
}
.kp-accordion-rows__item.is-open .kp-accordion-rows__item-body {
    grid-template-rows: 1fr;
}
.kp-accordion-rows__item-body-inner {}
.kp-accordion-rows__item-body .kp-accordion-rows__item-text {
    font-family: var(--font-main, "acumin-pro", sans-serif);
    font-size: 16px;
    line-height: 150%;
    margin-bottom: 24px;
    max-width: calc(100% - 2rem);
}
.kp-accordion-rows__divider {
    border-top: 1px solid rgba(13, 28, 56, 0.25);
}
.kp-accordion-rows.text-light .kp-accordion-rows__divider {
    border-top-color: rgba(255, 255, 255, 0.25);
}
/* Desktop */

@media (min-width: 1024px) {
    .kp-accordion-rows__header {
        flex-direction: row;
        gap: var(--kp-content-gap, 200px);
        align-items: flex-end;
    }
    .kp-accordion-rows__title {
        flex: 1;
        font-size: clamp(48px, 5.2vw, 64px);
    }
    .kp-accordion-rows__intro {
        /* Figma: 703px / 1720px content = 40.87% */
        width: 40.87%;
        font-size: clamp(20px, 1.25vw, 24px);
    }
    .kp-accordion-rows__item-title {
        font-size: clamp(24px, 1.667vw, 32px);
    }
}
@media (max-width: 1024px) {
    .kp-accordion-rows .inner {
        padding-left: 1rem;
        padding-right: 1rem;
    }
    .kp-accordion-rows__header {
        margin-bottom: 40px;
    }
}
/* ============================================================================
   7. KP MERKEN CARDS
   ============================================================================ */

.kp-brand-cards {
    background: #ffffff;
}
.kp-brand-cards .inner {
    padding-left: 1rem;
    padding-right: 1rem;
}
.kp-brand-cards__grid {
    display: flex;
    gap: 16px;
    flex-wrap: wrap;
}
.kp-brand-card {
    flex: 1;
    min-width: 280px;
    display: flex;
    flex-direction: column;
    gap: 32px;
}
.kp-brand-card__image {
    width: 100%;
    aspect-ratio: 1/1.3;
    overflow: hidden;
    border: 1px solid rgba(13, 28, 56, 0.25);
    max-height: 33.86806rem;
}
.kp-brand-card__image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.kp-brand-card__content {
    display: flex;
    flex-direction: column;
    gap: 16px;
    padding-right: 1rem;
}
.kp-brand-card__title {
    font-family: var(--font-heading, "sofia-pro", sans-serif);
    font-size: 24px;
    line-height: 130%;
    font-weight: 400;
    color: var(--color-primary, #0D1C38);
}
.kp-brand-card__text {
    font-family: var(--font-main, "acumin-pro", sans-serif);
    font-size: 16px;
    line-height: 150%;
    color: var(--color-primary, #0D1C38);
}
.kp-brand-card__text p+p {
    margin-top: 1rem;
}
@media (min-width: 1024px) {
    .kp-brand-card__title {
        font-size: clamp(24px, 1.667vw, 32px);
    }
}
@media (max-width: 1024px) {
    .kp-brand-cards .inner {
        padding-left: 1rem;
        padding-right: 1rem;
    }
    .kp-brand-cards__grid {
        flex-direction: column;
    }
    .kp-brand-cards__grid.is-brand-slider {
        display: block;
        flex-direction: initial;
    }
}
/* ============================================================================
   7b. KP BRAND CARDS — Slider mode (>3 items)
   ============================================================================ */

.kp-brand-cards__grid.is-brand-slider {
    display: block; /* Owl needs block, not flex */
    flex-wrap: initial;
}
.kp-brand-cards__grid.is-brand-slider .owl-stage {
    display: flex;
    /* gap handled by Owl margin config */
    touch-action: pan-y;
    -ms-touch-action: pan-y;
}
.kp-brand-cards__grid.is-brand-slider .owl-item {
    flex-shrink: 0;
    touch-action: pan-y;
}
.kp-brand-cards__grid.is-brand-slider .kp-brand-card {
    flex: none;
    min-width: 0;
    width: 100%;
}
.kp-brand-cards__nav {
    margin-top: 40px;
}
@media (max-width: 1024px) {
    .kp-brand-cards__nav { margin-top: 24px; }
    .kp-brand-cards__grid.is-brand-slider .kp-brand-card { min-width: 0; }
}

/* ============================================================================
   7c. KP FULLWIDTH IMAGE — Carousel met dots (PDP-stijl)
   ============================================================================ */

.kp-fullwidth-carousel {
    position: relative;
    width: 100%;
    overflow: hidden;
}
.kp-fullwidth-carousel__track {
    display: flex;
    transition: transform 0.4s ease;
    will-change: transform;
}
.kp-fullwidth-carousel__slide {
    flex: 0 0 100%;
    min-width: 0;
}
.kp-fullwidth-carousel__img {
    width: 100%;
    height: auto;
    display: block;
    object-fit: cover;
}
.kp-fullwidth-carousel__dots {
    position: absolute;
    bottom: 12px;
    left: 16px;
    z-index: 2;
    display: flex;
    gap: 6px;
    background: rgba(0, 0, 0, 0.1);
    backdrop-filter: blur(6px);
    border-radius: 8px;
    padding: 4px 8px;
}
.kp-fullwidth-carousel__dot {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: #ffffff;
    border: none;
    cursor: pointer;
    padding: 0;
    transition: background 0.2s ease;
}
.kp-fullwidth-carousel__dot.is-active {
    background: #18181B;
}

/* ============================================================================
   8. KP CONTACT CTA
   ============================================================================ */

.kp-contact-cta {
    position: relative;
    background-color: var(--color-primary, #0D1C38);
    color: #ffffff;
    text-align: center;
}
.kp-contact-cta__overlay {
    position: absolute;
    inset: 0;
    background: rgba(13, 28, 56, 0.6);
    pointer-events: none;
}
.kp-contact-cta .inner {
    position: relative;
    z-index: 2;
}
.kp-contact-cta__content {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 24px;
}
.kp-contact-cta__title {
    font-family: var(--font-heading, "sofia-pro", sans-serif);
    font-size: 40px;
    line-height: 120%;
    font-weight: 400;
    color: #ffffff;
}
.kp-contact-cta__text {
    font-family: var(--font-main, "acumin-pro", sans-serif);
    font-size: 20px;
    line-height: 150%;
    color: #ffffff;
}
.kp-contact-cta__buttons {
    display: flex;
    gap: 16px;
    flex-wrap: wrap;
    justify-content: center;
}

/* Gravity Form inside dark CTA section — CENTERED/NEWSLETTER variant only */
.kp-contact-cta__content .kp-contact-cta__form { width: 100%; max-width: 720px; }
.kp-contact-cta__content .kp-contact-cta__form .gform_heading { display: none; }
.kp-contact-cta__content .kp-contact-cta__form .gform_validation_container { display: none !important; }
.kp-contact-cta__content .kp-contact-cta__form .gform_fields {
    display: flex !important;
    flex-direction: column;
    gap: 8px;
    align-items: stretch;
}
@media (min-width: 1024px) {
    .kp-contact-cta__content .kp-contact-cta__form .gform_fields {
        flex-direction: row;
        align-items: flex-end;
    }
}
.kp-contact-cta__content .kp-contact-cta__form .gfield--type-email { flex: 1; }
.kp-contact-cta__content .kp-contact-cta__form .gfield--type-email .gfield_label { display: none; }
/* Figma: input width 560px, padding 8px 12px, bg linear-gradient(rgba(235,241,248,0.9)), border rgba(255,255,255,0.25), gap 12px with mail icon 24px */
.kp-contact-cta__content .kp-contact-cta__form .gfield--type-email input {
    width: 100%;
    height: 56px;
    padding: 8px 12px 8px 12px;
    font-family: var(--font-main, "acumin-pro", sans-serif);
    font-size: 16px;
    line-height: 150%;
    color: var(--color-primary, #0D1C38);
    background-color: rgba(235, 241, 248, 0.9);
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='21' height='17' viewBox='0 0 21 17' fill='none'%3E%3Cpath d='M1.20312 1.89746V15.1016H19.0957V2.29395L18.3203 2.80371L10.3643 8.04199C10.3039 8.07364 10.2515 8.09931 10.2061 8.11719C10.2029 8.11818 10.1861 8.12305 10.1494 8.12305C10.1121 8.12304 10.0955 8.11806 10.0928 8.11719C10.0471 8.09922 9.99432 8.07387 9.93359 8.04199L2.20312 2.95117V2.55176L9.87598 7.57715L10.1494 7.75684L10.4229 7.57812L18.7695 2.12793L19.7803 1.4668C19.7959 1.5446 19.8047 1.625 19.8047 1.70898V14.6016C19.8047 14.9228 19.6924 15.1963 19.4434 15.4443C19.1945 15.6924 18.9197 15.8047 18.5957 15.8047H1.70312C1.38141 15.8047 1.10823 15.6923 0.860352 15.4443L0.773438 15.3506C0.58577 15.1278 0.5 14.8831 0.5 14.6016V1.70898C0.500017 1.62046 0.509066 1.53575 0.526367 1.4541L1.20312 1.89746ZM1.70312 0.5H18.5957C18.9191 0.5 19.1933 0.613174 19.4424 0.862305H19.4434C19.553 0.971962 19.6346 1.08743 19.6934 1.20898H0.610352C0.669035 1.08699 0.750804 0.971226 0.860352 0.861328H0.861328C1.1093 0.612456 1.38205 0.500029 1.70312 0.5Z' fill='%230D1C38' stroke='%230D1C38'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: calc(50% - 75px) center;
    background-size: 24px auto;
    border: 1px solid rgba(255, 255, 255, 0.25);
    border-radius: 0;
    outline: none;
    box-sizing: border-box;
    text-align: center;
    -webkit-appearance: none;
}
.kp-contact-cta__content .kp-contact-cta__form .gfield--type-email input::placeholder { color: rgba(0, 0, 0, 0.6); }
.kp-contact-cta__content .kp-contact-cta__form .gfield--type-email input:focus { border-color: #6BABD3; }
.kp-contact-cta__content .kp-contact-cta__form .spacer.gfield { display: none !important; }
.kp-contact-cta__content .kp-contact-cta__form .gfield--type-submit { flex-shrink: 0; }
.kp-contact-cta__content .kp-contact-cta__form .gfield--type-submit .gfield_label { display: none; }
.kp-contact-cta__content .kp-contact-cta__form .brochure-submit-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    height: 56px;
    padding: 16px 32px;
    background: #ffffff;
    border: none;
    cursor: pointer;
    font-family: var(--font-main, "acumin-pro", sans-serif);
    font-size: 16px;
    line-height: 150%;
    font-weight: 400;
    color: var(--color-primary, #0D1C38);
    white-space: nowrap;
    width: 100%;
    transition: background 0.2s ease;
}
.kp-contact-cta__content .kp-contact-cta__form .brochure-submit-btn:hover { background: #EBF1F8; }
.kp-contact-cta__content .kp-contact-cta__form .brochure-submit-btn .kp-btn__chevron path { fill: var(--color-primary, #0D1C38); }
@media (min-width: 1024px) {
    .kp-contact-cta__content .kp-contact-cta__form .gform_fields {
        gap: 16px;
    }
    .kp-contact-cta__content .kp-contact-cta__form .gfield--type-email {
        flex: 0 0 560px;
        max-width: 560px;
    }
    .kp-contact-cta__content .kp-contact-cta__form .gfield--type-email input {
        text-align: left;
        text-indent: 0;
        background-position: 12px center;
        padding-left: 48px;
    }
    .kp-contact-cta__content .kp-contact-cta__form .gfield--type-email input::placeholder { text-align: left; }
    .kp-contact-cta__content .kp-contact-cta__form .brochure-submit-btn { width: fit-content; }
}
.kp-contact-cta__content .kp-contact-cta__form .gform-footer { display: none; }
.kp-contact-cta__content .kp-contact-cta__form .gform_required_legend { display: none; }

/* Validation errors on dark bg */
.kp-contact-cta__form .gform_validation_errors {
    background: rgba(220, 53, 69, 0.15);
    border: 1px solid rgba(220, 53, 69, 0.5);
    padding: 12px 16px;
    margin-bottom: 16px;
    border-radius: 0;
}
.kp-contact-cta__form .gform_validation_errors h2 {
    font-family: var(--font-main, "acumin-pro", sans-serif);
    font-size: 14px;
    line-height: 150%;
    font-weight: 400;
    color: #ffffff;
    margin: 0;
    display: flex;
    align-items: center;
    gap: 8px;
}
.kp-contact-cta__form .gform_validation_errors .gform-icon { display: none; }
.kp-contact-cta__form .gfield_error input {
    border-color: #dc3545 !important;
}
.kp-contact-cta__form .validation_message {
    font-family: var(--font-main, "acumin-pro", sans-serif);
    font-size: 13px;
    line-height: 150%;
    color: #ff8a8a;
    margin-top: 4px;
    padding: 0;
}
/* Prevent button from being pushed off on error state */
.kp-contact-cta__form .gfield_error .ginput_container { margin-bottom: 0; }
@media (min-width: 1024px) {
    .kp-contact-cta__form .validation_message {
        position: absolute;
        bottom: -20px;
        left: 0;
    }
    .kp-contact-cta__form .gfield--type-email {
        position: relative;
    }
}
@media (min-width: 1024px) {
    .kp-contact-cta__content {
        gap: 40px;
    }
    .kp-contact-cta__title {
        font-size: clamp(40px, 2.5vw, 48px);
    }
    .kp-contact-cta__text {
        font-size: 20px;
    }
}

/* Contact CTA: two-column layout with contact card + form */
.kp-contact-cta__grid {
    display: flex;
    flex-direction: column;
    gap: 40px;
    position: relative;
    z-index: 2;
    width: 100%;
    text-align: left;
}
.kp-contact-cta__left {
    display: flex;
    flex-direction: column;
    gap: 40px;
}
.kp-contact-cta__header {
    display: flex;
    flex-direction: column;
    gap: 40px;
}
/* Company info block in grid left column */
.kp-contact-cta__company-info {
    display: flex;
    flex-direction: column;
    gap: 24px;
}
@media (min-width: 1024px) {
    .kp-contact-cta__company-info {
        flex-direction: row;
        gap: 56px;
    }
}
.kp-contact-cta__info-block {
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.kp-contact-cta__info-line {
    color: #ffffff;
    font-family: var(--font-main, "acumin-pro", sans-serif);
    font-size: 16px;
    line-height: 150%;
}
.kp-contact-cta__info-link {
    color: #6babd3;
    font-family: var(--font-main, "acumin-pro", sans-serif);
    font-size: 16px;
    line-height: 150%;
    text-decoration: underline;
}
.kp-contact-cta__info-link:hover {
    color: #ffffff;
}
.kp-contact-cta__socials {
    display: flex;
    flex-direction: column;
    gap: 16px;
}
.kp-contact-cta__social-link {
    display: flex;
    flex-direction: row;
    gap: 8px;
    align-items: center;
    color: #ffffff;
    font-family: var(--font-main, "acumin-pro", sans-serif);
    font-size: 16px;
    line-height: 150%;
    text-decoration: none;
    transition: opacity 0.2s ease;
}
.kp-contact-cta__social-link:hover {
    opacity: 0.7;
}
.kp-contact-cta__social-link svg {
    width: 24px;
    height: 24px;
    flex-shrink: 0;
}

.kp-contact-cta__contact-card {
    background: #ffffff;
    display: flex;
    flex-direction: column;
    gap: 10px;
    max-width: 451px;
}
.kp-contact-cta__contact-top {
    padding: 24px;
    display: flex;
    flex-direction: row;
    gap: 24px;
    align-items: flex-start;
}
.kp-contact-cta__contact-img {
    position: relative;
    width: 111px;
    height: 111px;
    flex-shrink: 0;
    overflow: hidden;
}
.kp-contact-cta__contact-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.kp-contact-cta__shape {
    position: absolute;
    pointer-events: none;
}
.kp-contact-cta__shape--tl { top: 0; left: 0; }
.kp-contact-cta__shape--tr { top: 0; right: 0; }
.kp-contact-cta__shape--bl { bottom: 0; left: 0; }
.kp-contact-cta__shape--br { bottom: 0; right: 0; }
.kp-contact-cta__contact-info {
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.kp-contact-cta__contact-name {
    color: #0d1c38;
    font-family: var(--font-heading, "sofia-pro", sans-serif);
    font-size: 32px;
    line-height: 130%;
    font-weight: 400;
    margin: 0;
}
.kp-contact-cta__contact-role {
    color: #0d1c38;
    font-family: var(--font-main, "acumin-pro", sans-serif);
    font-size: 16px;
    line-height: 150%;
}
.kp-contact-cta__contact-actions {
    display: flex;
    flex-direction: row;
    gap: 8px;
    padding: 0 24px 24px 24px;
}
.kp-contact-cta__contact-phone {
    width: fit-content;
}
.kp-contact-cta__contact-phone svg {
    width: 24px;
    height: 24px;
    flex-shrink: 0;
}
.kp-contact-cta__contact-email {
    border: 1px solid #0d1c38;
    padding: 16px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 56px;
    width: 56px;
    box-sizing: border-box;
    text-decoration: none;
    color: #0d1c38;
    transition: background 0.2s ease;
}
.kp-contact-cta__contact-email:hover {
    background: rgba(13, 28, 56, 0.05);
}
.kp-contact-cta__contact-email svg {
    width: 24px;
    height: 24px;
}
/* Grid form: layout sizing only — dark form styling comes from .kp-sv-form-section__form in kp-single-vacature.css */
.kp-contact-cta__grid .kp-contact-cta__form {
    max-width: 100%;
}

@media (min-width: 1024px) {
    .kp-contact-cta__grid {
        flex-direction: row;
        gap: 40px;
        align-items: flex-start;
        justify-content: center;
    }
    .kp-contact-cta__left {
        width: 610px;
        flex-shrink: 0;
        gap: 80px;
    }
    .kp-contact-cta__grid .kp-contact-cta__form {
        flex: 1;
        max-width: 710px;
    }
    .kp-contact-cta__grid .kp-contact-cta__title {
        font-size: 40px;
    }
    .kp-contact-cta__grid .kp-contact-cta__text {
        font-size: 20px;
    }
}

/* Contact CTA: LIGHT variant (white bg, dark text, dark form borders) */
.kp-contact-cta--light {
    color: #0d1c38;
    text-align: left;
}
.kp-contact-cta--light .kp-contact-cta__overlay {
    display: none;
}
.kp-contact-cta--light .kp-contact-cta__title {
    color: #0d1c38;
}
.kp-contact-cta--light .kp-contact-cta__text {
    color: #0d1c38;
}
.kp-contact-cta--light .kp-contact-cta__info-line {
    color: #0d1c38;
}
.kp-contact-cta--light .kp-contact-cta__info-link {
    color: #0d1c38;
    text-decoration: underline;
}
.kp-contact-cta--light .kp-contact-cta__social-link {
    color: #0d1c38;
}
/* Light variant form: dark labels, dark borders, dark placeholders */
.kp-contact-cta--light .kp-sv-form-section__form .gfield_label,
.kp-contact-cta--light .kp-sv-form-section__form label.gfield_label {
    color: #0d1c38 !important;
}
.kp-contact-cta--light .kp-sv-form-section__form input[type="text"],
.kp-contact-cta--light .kp-sv-form-section__form input[type="email"],
.kp-contact-cta--light .kp-sv-form-section__form input[type="tel"],
.kp-contact-cta--light .kp-sv-form-section__form input[type="url"],
.kp-contact-cta--light .kp-sv-form-section__form select,
.kp-contact-cta--light .kp-sv-form-section__form textarea {
    background: transparent !important;
    border: 1px solid rgba(13, 28, 56, 0.25) !important;
    color: #0d1c38 !important;
}
.kp-contact-cta--light .kp-sv-form-section__form input::placeholder,
.kp-contact-cta--light .kp-sv-form-section__form textarea::placeholder {
    color: rgba(13, 28, 56, 0.25) !important;
}
.kp-contact-cta--light .kp-sv-form-section__form .gform-field-label--type-sub {
    color: #0d1c38 !important;
}
.kp-contact-cta--light .kp-sv-form-section__form .gform_footer {
    border-top-color: rgba(13, 28, 56, 0.25);
}
.kp-contact-cta--light .kp-sv-form-section__form .gform_footer input[type="submit"],
.kp-contact-cta--light .kp-sv-form-section__form .brochure-submit-btn {
    background: #0d1c38 !important;
    color: #ffffff !important;
}
.kp-contact-cta--light .kp-sv-form-section__form .brochure-submit-btn .kp-btn__chevron path {
    fill: #ffffff !important;
}
.kp-contact-cta--light .kp-sv-form-section__form .brochure-submit-btn .btn-text {
    color: #ffffff !important;
}
/* Light variant: contact card inverts to dark bg, all content white */
.kp-contact-cta--light .kp-contact-cta__contact-card {
    background: #0d1c38;
    color: #ffffff;
}
.kp-contact-cta--light .kp-contact-cta__contact-name,
.kp-contact-cta--light .kp-contact-cta__contact-role,
.kp-contact-cta--light .kp-contact-cta__contact-actions,
.kp-contact-cta--light .kp-contact-cta__contact-actions * {
    color: #ffffff;
}
.kp-contact-cta--light .kp-contact-cta__contact-phone.btn-primary-dark {
    background: #ffffff !important;
    color: #0d1c38 !important;
}
.kp-contact-cta--light .kp-contact-cta__contact-phone.btn-primary-dark * {
    color: #0d1c38 !important;
}
.kp-contact-cta--light .kp-contact-cta__contact-email {
    border-color: #ffffff;
    color: #ffffff;
}

/* Gravity Forms: ensure gfield is a positioning context for validation messages */
.gform_wrapper .gfield {
    position: relative;
}
/* Gravity Forms: consistent label spacing across all forms */
/* ============================================================================
   GLOBAL: Padding utility classes
   ============================================================================ */

.compact-padding {
    padding-top: 3rem !important;
    padding-bottom: 3rem !important;
}
/* 48px */

.small-padding {
    padding-top: 2.5rem !important;
    padding-bottom: 2.5rem !important;
}
/* 40px */

.medium-padding {
    padding-top: 5rem !important;
    padding-bottom: 5rem !important;
}
/* 80px */

.large-padding {
    padding-top: 7.5rem !important;
    padding-bottom: 7.5rem !important;
}
/* 120px */

.xl-padding {
    padding-top: 10rem !important;
    padding-bottom: 10rem !important;
}
/* 160px */

.no-padding {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}
/* ============================================================================
   NO SPACE TOP / BOTTOM — Global spacing overrides
   ============================================================================ */

.no-space-top {
    margin-top: 0 !important;
    padding-top: 0 !important;
}
.no-space-bottom {
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
}
/* Border utilities (ACF-driven) */

.has-border-top {
    border-top: 1px solid rgba(13, 28, 56, 0.25);
}
.has-border-bottom {
    border-bottom: 1px solid rgba(13, 28, 56, 0.25);
}
.has-border-top.border-light, .has-border-bottom.border-light {
    border-color: rgba(255, 255, 255, 0.25);
}
/* ============================================================================
   13. KP FULLWIDTH IMAGE
   ============================================================================ */

.kp-fullwidth-image {
    width: 100%;
    line-height: 0;
    padding-bottom: 2rem;
}
.kp-fullwidth-image__img {
    width: 100%;
    height: auto;
    display: block;
    object-fit: cover;
}
/* Accordion open state */

.kp-accordion-rows__item.is-open .kp-accordion-rows__item-arrow {
    transform: rotate(180deg);
}
.kp-accordion-rows__item-header {
    cursor: pointer;
    user-select: none;
}
@media (min-width: 1025px) {
    .kp-fullwidth-image {
        padding-bottom: 56px;
    }
    body.kp-transparent-header .nav-menu > li > a {
padding: 0.5rem 0.75rem;

    }
    body.kp-transparent-header .nav-menu > li > a:hover {
background: rgba(255, 255, 255, 0.60);
color: #fff !important;
opacity:1;
    }
    body .nav-menu {
        gap:1rem;
    }
        .kp-product-card__image {
    max-height:33.86806rem;
}
 .kp-accordion-rows__item-header {
        transition:opacity 0.6s;
 }
 .kp-accordion-rows__item-header:hover {
    opacity: 0.6;
    transition:opacity 0.6s;
}
}
@media (min-width: 1440px) {
    .kp-hero-banner__bg {
        min-height: 430px;
    }
    .kp-accordion-rows__item-body .kp-accordion-rows__item-text {
        font-size: clamp(16px, 1.25vw, 24px);
        font-style: normal;
        font-weight: 400;
        line-height: 150%;
        max-width: calc(100% - 2rem);
        /* 36px */
    }
    
    body .nav-menu {
        gap:1.5rem;
    }
}
@media (max-width: 1023px) {
    .kp-accordion-rows__item-arrow {
        margin-top: 8px;
        max-width: 20px;
    }
    .kp-accordion-rows__item-header {
        align-items: flex-start;
    }
    .kp-hero-banner__buttons,.kp-text-usp__buttons{

    width: fit-content;
    }
    body .kp-hero-banner__buttons .kp-btn, body .kp-text-usp__buttons .kp-btn {
        width:100%;
            justify-content: center;
    }
}

body .cmplz-document {
    font-size: 20px !important;
    max-width: 100% !important;
}
body .cmplz-document ul {
   list-style-position: inside;
}

body .cmplz-document  p {
    margin: 1rem 0;
    font-size: 20px !important;
}

body .cmplz-document a {
color: #0D1C38;
    text-decoration: underline;
}
body .cmplz-document a:hover {

    text-decoration: unset;
}

.kp-content .kp-text-usp__right{
display: none;
}


@media (min-width: 1024px) {

    .kp-content .kp-text-usp__left {
        flex: 0 0 60%;
    }
}

/* ============================================================================
   10. PRODUCT GRID (Overview page — static grid, not slider)
   ============================================================================ */
.kp-product-grid {
    background: #ffffff;
    padding: 0 0 clamp(80px, 8.33vw, 160px);
}
.kp-product-grid__items {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 64px 16px;
}
.kp-product-grid__card {
    display: flex; flex-direction: column; gap: 32px;
    text-decoration: none; color: inherit;
}
.kp-product-grid__card-image {
    aspect-ratio: 1 / 1; overflow: hidden;
    border: 1px solid rgba(13, 28, 56, 0.25);
    background: #ffffff;
}
.kp-product-grid__card-image img {
    width: 100%; height: 100%; object-fit: cover;
    transition: transform 0.4s ease;
}
.kp-product-grid__card:hover .kp-product-grid__card-image img {
    transform: scale(1.05);
}
.kp-product-grid__card-content {
    display: flex; flex-direction: column; gap: 8px;
    padding: 0 16px 0 0;
}
.kp-product-grid__card-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;
}
/* "Bekijk meer" link — visible only on mobile */
.kp-product-grid__card-link {
    display: none;
    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: underline;
    align-items: center; gap: 8px;
}
.kp-product-grid__card-link svg { flex-shrink: 0; }

/* Mobile: horizontal card layout */
@media (max-width: 1023px) {
    .kp-product-grid {
        padding: 0 0 24px;
    }
    .kp-product-grid__items {
        grid-template-columns: 1fr;
        gap: 16px;
    }
    .kp-product-grid__card {
        flex-direction: row; gap: 16px;
    }
    .kp-product-grid__card-image {
        width: 136px; height: 136px; flex-shrink: 0;
        aspect-ratio: auto;
    }
    .kp-product-grid__card-content {
        flex: 1; justify-content: center; padding: 0;
    }
    .kp-product-grid__card-title {
        font-size: 20px;
    }
    .kp-product-grid__card-link {
        display: inline-flex;
    }
}

/* Detail cards (manual/value-added style) */
.kp-product-grid--manual .kp-product-grid__items {
    display: flex; flex-wrap: wrap; gap: 16px;
}
.kp-product-grid__card--detail {
    display: flex; flex-direction: column; gap: 0;
    background: #ffffff;
    border: 1px solid rgba(13, 28, 56, 0.25);
    width: calc(25% - 12px);
    text-decoration: none; color: inherit;
}
.kp-product-grid__card-image--placeholder {
    height: 280px; background: #d2d2d7;
    border: none; aspect-ratio: auto; overflow: hidden;
}
.kp-product-grid__card-image--placeholder img {
    width: 100%; height: 100%; object-fit: cover;
}
.kp-product-grid__card-body {
    padding: 32px;
    display: flex; flex-direction: column; gap: 8px;
}
.kp-product-grid__card-body .kp-product-grid__card-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;
}
.kp-product-grid__card-desc {
    font-family: var(--font-main, "acumin-pro", sans-serif);
    font-size: 16px; line-height: 150%; font-weight: 400;
    color: var(--color-primary, #0D1C38); margin: 0;
}
@media (max-width: 1023px) {
    .kp-product-grid--manual .kp-product-grid__items {
        display: flex; flex-wrap: nowrap; overflow-x: auto;
        gap: 16px; padding-bottom: 16px;
        -webkit-overflow-scrolling: touch;
        scroll-snap-type: x mandatory;
    }
    .kp-product-grid__card--detail {
        width: 320px; min-width: 320px; flex-shrink: 0;
        scroll-snap-align: start;
    }
    .kp-product-grid__card-image--placeholder {
        height: 200px;
    }
    .kp-product-grid__card-body {
        padding: 16px;
    }
    .kp-product-grid__card-body .kp-product-grid__card-title {
        font-size: 20px;
    }
}

/* ===================================================================
   USP COLUMNS — "Gebouwd op kwaliteit, compliance en continuïteit"
   =================================================================== */
.kp-usp-columns {
    background-color: #ffffff;
}
.kp-usp-columns__title {
    font-family: var(--font-heading, "sofia-pro", sans-serif);
    font-size: clamp(28px, 2.5vw, 40px);
    font-weight: 400;
    line-height: 120%;
    color: var(--color-primary, #0D1C38);
    text-align: center;
    margin-bottom: clamp(40px, 5vw, 80px);
}
.kp-usp-columns__grid {
    display: flex;
    flex-direction: column;
    gap: 24px;
}
.kp-usp-columns__divider {
    height: 1px;
    background: rgba(13, 28, 56, 0.25);
}
.kp-usp-columns__item {
    display: flex;
    flex-direction: column;
    gap: 16px;
}
.kp-usp-columns__item-header {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 16px;
}
.kp-usp-columns__item-icon {
    flex-shrink: 0;
    width: 24px;
    height: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.kp-usp-columns__item-icon svg {
    width: 24px;
    height: 24px;
}
.kp-usp-columns__item-title {
    font-family: var(--font-heading, "sofia-pro", sans-serif);
    font-size: 24px;
    font-weight: 400;
    line-height: 140%;
    color: var(--color-primary, #0D1C38);
}
.kp-usp-columns__item-text {
    font-family: var(--font-main, "acumin-pro", sans-serif);
    font-size: 16px;
    font-weight: 400;
    line-height: 150%;
    color: var(--color-primary, #0D1C38);
}

@media (min-width: 1024px) {
    .kp-usp-columns__title {
        text-align: center;
    }
    .kp-usp-columns__grid {
        flex-direction: row;
        gap: 64px;
        align-items: flex-start;
    }
    .kp-usp-columns__divider {
        width: 1px;
        height: auto;
        align-self: stretch;
    }
    .kp-usp-columns__item {
        flex: 1;
    }
}

@media (max-width: 1023px) {
    .kp-usp-columns__title {
        text-align: left;
    }
}

/* ============================================================
   KP COMPLIANCE GRID
   ============================================================ */
.kp-compliance-grid {
    background: #ffffff;
}
.kp-compliance-grid__title {
    font-family: var(--font-heading, 'sofia-pro', sans-serif);
    font-size: clamp(32px, 3vw, 40px);
    font-weight: 400;
    line-height: 120%;
    color: var(--color-primary, #0D1C38);
    text-align: center;
    margin: 0 0 80px;
}
.kp-compliance-grid__items {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 40px 64px;
}
.kp-compliance-grid__item {
    display: flex;
    flex-direction: row;
    gap: 16px;
    position: relative;
    align-items: flex-start;
}
/* Vertical divider left on 2nd and 3rd column items */
.kp-compliance-grid__item:nth-child(3n+2)::before,
.kp-compliance-grid__item:nth-child(3n)::before {
    content: '';
    position: absolute;
    left: -32px;
    top: 50%;
    transform: translateY(-50%);
    height: 98px;
    width: 1px;
    background: rgba(13, 28, 56, 0.25);
}
.kp-compliance-grid__item-icon {
    flex-shrink: 0;
    width: 24px;
    height: 24px;
    color: var(--color-primary, #0D1C38);
    margin-top: 4px;
}
.kp-compliance-grid__item-title {
    font-family: var(--font-heading, 'sofia-pro', sans-serif);
    font-size: 24px;
    font-weight: 400;
    line-height: 140%;
    color: var(--color-primary, #0D1C38);
    margin: 0 0 8px;
}
.kp-compliance-grid__item-text {
    font-family: var(--font-main, 'acumin-pro', sans-serif);
    font-size: 16px;
    line-height: 150%;
    color: var(--color-primary, #0D1C38);
    margin: 0;
}

@media (max-width: 1023px) {
    .kp-compliance-grid__items {
        grid-template-columns: 1fr;
    }
    .kp-compliance-grid__item {
        padding: 24px 0;
        border-bottom: 1px solid rgba(13, 28, 56, 0.25);
    }
    .kp-compliance-grid__item::before {
        display: none !important;
    }
    .kp-compliance-grid__item:last-child {
        border-bottom: none;
    }
    .kp-compliance-grid__title {
        margin-bottom: 40px;
    }
}

/* ============================================================
   KP CASES CAROUSEL
   Figma: horizontal card (image left 560px + content right 560px)
   Non-active cards opacity: 0.4
   ============================================================ */
.kp-cases-carousel {
    background: rgba(13, 28, 56, 0.75);
    position: relative;
    overflow: hidden;
}
.kp-cases-carousel .inner {
    position: relative;
    z-index: 1;
    max-width: unset !important;
    padding: 0 !important;
    overflow: visible !important;
}
/* Nav stays within grid width — matches .inner-breed .inner max-width */
.kp-cases-carousel .kp-product-cards__nav {
    max-width: 109.5rem;
    margin: 80px auto 0;
    padding: 0 clamp(16px, 4vw, 100px);
}
.kp-cases-carousel__card {
    display: flex;
    flex-direction: row;
    overflow: hidden;
    height: 519px;
}
.kp-cases-carousel .owl-stage-outer,
.kp-cases-carousel .owl-carousel {
    overflow: visible;
}
.kp-cases-carousel .owl-carousel .owl-stage {
    touch-action: pan-y;
    -ms-touch-action: pan-y;
}
.kp-cases-carousel .owl-item {
    opacity: 0.4;
    transition: opacity 0.4s ease;
}
.kp-cases-carousel .owl-item.center {
    opacity: 1;
}
.kp-cases-carousel__card-image {
    position: relative;
    width: 50%;
    flex-shrink: 0;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    align-items: flex-end;
    padding: 32px;
    background: linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(0,0,0,0.25) 61%), rgba(0,0,0,0.1);
}
.kp-cases-carousel__card-image img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    z-index: 0;
}
.kp-cases-carousel__card-image::after {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(0,0,0,0.25) 61%);
    z-index: 1;
}
.kp-cases-carousel__card-result {
    position: relative;
    z-index: 2;
    background: rgba(255, 255, 255, 0.25);
    border: 1px solid rgba(255, 255, 255, 0.25);
    padding: 16px;
    align-self: stretch;
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.kp-cases-carousel__card-result-label {
    font-family: var(--font-main, 'acumin-pro', sans-serif);
    font-size: 16px;
    font-weight: 400;
    line-height: 150%;
    color: rgba(255, 255, 255, 0.7);
}
.kp-cases-carousel__card-result-value {
    font-family: var(--font-heading, 'sofia-pro', sans-serif);
    font-size: 24px;
    font-weight: 400;
    line-height: 140%;
    color: #ffffff;
}
.kp-cases-carousel__card-body {
    width: 50%;
    flex-shrink: 0;
    background: #ffffff;
    padding: 48px;
    display: flex;
    flex-direction: column;
    gap: 24px;
}
.kp-cases-carousel__card-logo {
    font-family: 'Inter', var(--font-heading, 'sofia-pro', sans-serif);
    font-size: 14px;
    font-weight: 700;
    color: #1d1d1f;
    margin-bottom: 23px; /* total gap from logo to quote = 47px (24px gap + 23px margin) */
}
.kp-cases-carousel__card-quote {
    font-family: var(--font-main, 'acumin-pro', sans-serif);
    font-size: 16px;
    line-height: 150%;
    color: #1d1d1f;
    margin: 0;
    font-style: normal;
}
.kp-cases-carousel__card-divider {
    border-top: 1px solid rgba(13, 28, 56, 0.25);
}
.kp-cases-carousel__card-author {
    display: flex;
    flex-direction: column;
    gap: 0;
}
.kp-cases-carousel__card-name {
    font-family: var(--font-main, 'acumin-pro', sans-serif);
    font-size: 16px;
    font-weight: 600;
    line-height: 150%;
    color: #1d1d1f;
}
.kp-cases-carousel__card-role {
    font-family: var(--font-main, 'acumin-pro', sans-serif);
    font-size: 16px;
    font-weight: 400;
    line-height: 150%;
    color: #1d1d1f;
}

/* Slider nav on dark bg */
.kp-cases-carousel .kp-product-cards__nav {
    border-color: rgba(255, 255, 255, 0.25);
}
.kp-cases-carousel .kp-product-cards__line {
    background: rgba(255, 255, 255, 0.15);
}
.kp-cases-carousel .kp-product-cards__line-progress {
    background: #ffffff;
}
.kp-cases-carousel .kp-slider-arrow {
    border-color: rgba(255, 255, 255, 0.5);
    background: transparent;
    color: #ffffff;
}
.kp-cases-carousel .kp-slider-arrow:hover {
    border-color: #ffffff;
    background: rgba(255, 255, 255, 0.1);
}
.kp-cases-carousel .owl-stage {
    display: flex;
}

@media (max-width: 1023px) {
    .kp-cases-carousel__card {
        flex-direction: column;
        height: auto;
    }
    .kp-cases-carousel__card-image {
        width: 100%;
        aspect-ratio: 16/10;
    }
    .kp-cases-carousel__card-body {
        width: 100%;
        padding: 32px 24px;
        gap: 24px;
    }
    .kp-cases-carousel .owl-item {
        opacity: 1;
    }
}

/* ============================================================
   KP PRIVATE LABEL
   ============================================================ */
.kp-private-label {
    background: #ffffff;
}
.kp-private-label__grid {
    display: grid;
    grid-template-columns: minmax(0, 640px) 1fr;
    gap: clamp(40px, 8vw, 150px);
    align-items: start;
}
.kp-private-label__content {
    display: flex;
    flex-direction: column;
    gap: 40px;
}
.kp-private-label__title {
    font-family: var(--font-heading, 'sofia-pro', sans-serif);
    font-size: clamp(32px, 3vw, 48px);
    font-weight: 400;
    line-height: 120%;
    color: var(--color-primary, #0D1C38);
    margin: 0;
}
.kp-private-label__text {
    font-family: var(--font-main, 'acumin-pro', sans-serif);
    font-size: 20px;
    line-height: 150%;
    color: var(--color-primary, #0D1C38);
    margin: 0;
}
.kp-private-label__divider {
    border-top: 1px solid rgba(13, 28, 56, 0.25);
}
.kp-private-label__items {
    display: flex;
    flex-direction: column;
    gap: 24px;
}
.kp-private-label__item {
    display: flex;
    gap: 16px;
    align-items: flex-start;
}
.kp-private-label__item-icon {
    flex-shrink: 0;
    width: 24px;
    height: 24px;
    margin-top: 2px;
}
.kp-private-label__item-title {
    font-family: var(--font-heading, 'sofia-pro', sans-serif);
    font-size: 20px;
    font-weight: 400;
    line-height: 140%;
    color: var(--color-primary, #0D1C38);
    margin: 0 0 4px;
}
.kp-private-label__item-text {
    font-family: var(--font-main, 'acumin-pro', sans-serif);
    font-size: 16px;
    line-height: 150%;
    color: var(--color-primary, #0D1C38);
    margin: 0;
}
.kp-private-label__image {
    border-radius: 0;
    overflow: hidden;
}
.kp-private-label__image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    aspect-ratio: 4/3;
}

@media (max-width: 1023px) {
    .kp-private-label__grid {
        grid-template-columns: 1fr;
        gap: 40px;
    }
    .kp-private-label__image {
        order: -1;
    }
}

/* ================================================================
   KP PROCESS STEPS
   2-column: content left + image right
   Figma: padding 160px 100px, gap 150px
   ================================================================ */
.kp-process-steps { background: #ffffff; }
.kp-process-steps__grid {
    display: grid;
    grid-template-columns: 640px 1fr;
    gap: clamp(40px, 8vw, 150px);
    align-items: start;
}
.kp-process-steps__content {
    display: flex;
    flex-direction: column;
    gap: 40px;
}
.kp-process-steps__intro {
    display: flex;
    flex-direction: column;
    gap: 24px;
}
.kp-process-steps__title {
    font-family: var(--font-heading, 'sofia-pro', sans-serif);
    font-size: clamp(28px, 2.5vw, 40px);
    line-height: 120%;
    font-weight: 400;
    color: var(--color-primary, #0D1C38);
    margin: 0;
}
.kp-process-steps__desc {
    font-family: var(--font-main, 'acumin-pro', sans-serif);
    font-size: clamp(16px, 1.1vw, 20px);
    line-height: 150%;
    font-weight: 400;
    color: var(--color-primary, #0D1C38);
    margin: 0;
}
.kp-process-steps__items {
    display: flex;
    flex-direction: column;
    gap: 24px;
}
.kp-process-steps__item {
    display: flex;
    flex-direction: column;
    gap: 16px;
}
.kp-process-steps__item-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;
}
.kp-process-steps__item-text {
    font-family: var(--font-main, 'acumin-pro', sans-serif);
    font-size: 16px;
    line-height: 150%;
    font-weight: 400;
    color: var(--color-primary, #0D1C38);
    margin: 0;
}
.kp-process-steps__divider {
    border-top: 1px solid rgba(13, 28, 56, 0.25);
}
.kp-process-steps__btn { width: fit-content; }
.kp-process-steps__image {
    position: relative;
    overflow: hidden;
}
.kp-process-steps__image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

@media (max-width: 1023px) {
    .kp-process-steps__grid {
        grid-template-columns: 1fr;
        gap: 40px;
    }
    .kp-process-steps__image {
        order: -1;
        max-height: 300px;
    }
}
/* ============================================================================
   KENNIS & INSPIRATIE: KP ARTICLE GRID
   ============================================================================ */

/* Figma: bg white */
.kp-article-grid {
    background: #ffffff;
}
.kp-article-grid .inner {
    padding-left: 1rem;
    padding-right: 1rem;
}

/* Filter bar — Figma mobile: transparent bg, column, gap 8px, no extra margin */
.kp-article-grid__filter-bar {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin-bottom: 24px;
}
/* Figma mobile: horizontal scroll, no wrap */
.kp-article-grid__filters {
    display: flex;
    flex-wrap: nowrap;
    gap: 8px;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
}
.kp-article-grid__filters::-webkit-scrollbar { display: none; }
/* Figma: buttons bg #ebf1f8, padding 8px 32px, height 56px, flex-shrink 0 */
.kp-article-grid__filter-pill {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 8px 32px;
    height: 56px;
    font-family: var(--font-main, "acumin-pro", sans-serif);
    font-size: 16px;
    line-height: 150%;
    font-weight: 400;
    color: var(--color-primary, #0D1C38);
    background: #EBF1F8;
    border: none;
    cursor: pointer;
    transition: all 0.2s ease;
    white-space: nowrap;
    flex-shrink: 0;
}
.kp-article-grid__filter-pill:hover,
.kp-article-grid__filter-pill.is-active {
    background: rgba(13, 28, 56, 0.1);
}
/* Figma mobile: count above filters via order */
.kp-article-grid__count {
    font-family: var(--font-main, "acumin-pro", sans-serif);
    font-size: 14px;
    line-height: 150%;
    color: var(--color-primary, #0D1C38);
    order: -1;
}

/* Card grid — Figma mobile: gap 24px, desktop: 32px 16px */
.kp-article-grid__grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 24px;
}

/* Article card — Figma: bg white, border 1px rgba(13,28,56,0.25), padding 16px */
.kp-article-card {
    background: #ffffff;
    border: 1px solid rgba(13, 28, 56, 0.25);
    padding: 16px;
    display: flex;
    flex-direction: column;
    gap: 0;
    flex: 1;
}
.kp-article-card__image-link {
    display: block;
}
.kp-article-card__img {
    width: 100%;
    height: auto;
    aspect-ratio: 530.67 / 334.49;
    object-fit: cover;
    display: block;
    align-self: stretch;
}
/* Figma mobile: padding 24px 0 0 0, gap 16px (between meta and title) */
.kp-article-card__body {
    padding: 24px 0 0 0;
    display: flex;
    flex-direction: column;
    gap: 16px;
}

/* Metadata — Figma: flex column mobile (gap 4px), flex row desktop (gap 40px) */
.kp-article-card__meta {
    display: flex;
    flex-direction: column;
    gap: 4px;
}
.kp-article-card__meta-item {
    display: flex;
    align-items: center;
    gap: 8px;
}
/* Figma: AcuminPro-Bold, 16px */
.kp-article-card__meta-label {
    font-family: var(--font-main, "acumin-pro", sans-serif);
    font-size: 16px;
    line-height: 150%;
    font-weight: 700;
    color: var(--color-primary, #0D1C38);
}
/* Figma: AcuminPro-Regular, 16px */
.kp-article-card__meta-value {
    font-family: var(--font-main, "acumin-pro", sans-serif);
    font-size: 16px;
    line-height: 150%;
    color: var(--color-primary, #0D1C38);
}

/* Category pill — Figma: border-radius 52px, padding 6px 10px 4px 10px (desktop), 4px 8px 2px 8px (mobile) */
.kp-article-card__category-pill {
    display: inline-flex;
    align-items: center;
    padding: 4px 8px 2px 8px;
    font-family: var(--font-main, "acumin-pro", sans-serif);
    font-size: 14px;
    line-height: 150%;
    font-weight: 400;
    border: 1px solid currentColor;
    border-radius: 52px;
    white-space: nowrap;
}

/* Card title */
.kp-article-card__title-link {
    text-decoration: none;
}
.kp-article-card__title {
    font-family: var(--font-heading, "sofia-pro", sans-serif);
    font-size: 20px;
    line-height: 150%;
    font-weight: 400;
    color: var(--color-primary, #0D1C38);
    text-decoration: underline;
    text-underline-offset: 3px;
    margin: 0;
}
.kp-article-card__title-link:hover .kp-article-card__title {
    text-decoration: none;
}

/* Load more — Figma mobile: padding 24px 16px, desktop: 48px 100px */
.kp-article-grid__load-more-wrap {
    display: flex;
    justify-content: center;
    padding: 24px 0;
    border-bottom: 1px solid rgba(13, 28, 56, 0.25);
}
.kp-article-grid__load-more {
    width: fit-content;
}

/* Desktop */
@media (min-width: 1024px) {
    .kp-article-grid__filter-bar {
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
        background: #EBF1F8;
        padding: 8px 16px 8px 8px;
        margin-bottom: 48px;
    }
    .kp-article-grid__filters {
        flex-wrap: wrap;
        overflow-x: visible;
    }
    .kp-article-grid__filter-pill {
        background: transparent;
    }
    .kp-article-grid__filter-pill:hover,
    .kp-article-grid__filter-pill.is-active {
        background: rgba(255, 255, 255, 0.6);
    }
    .kp-article-grid__count {
        order: 0;
    }
    .kp-article-card__category-pill {
        padding: 6px 10px 4px 10px;
        font-size: 16px;
    }
    .kp-article-grid__grid {
        grid-template-columns: repeat(3, 1fr);
        gap: 32px 16px;
    }
    .kp-article-card__body {
        padding: 32px 16px 16px 16px;
        gap: 32px;
    }
    .kp-article-card__meta {
        flex-direction: row;
        align-items: center;
        gap: 40px;
    }
    .kp-article-grid__load-more-wrap {
        padding: 48px 0;
    }
    .kp-article-card__title {
        font-size: clamp(20px, 1.25vw, 24px);
        line-height: 140%;
        text-decoration: none;
    }
    .kp-article-card__title-link:hover .kp-article-card__title {
        text-decoration: underline;
        text-underline-offset: 3px;
    }
}

/* ============================================================================
   KENNIS & INSPIRATIE: KP EVENT CARDS
   ============================================================================ */

/* Figma mobile: padding-bottom 16px, desktop: 160px */
.kp-event-cards {
    background: #ffffff;
}
.kp-event-cards .inner {
    padding-left: 1rem;
    padding-right: 1rem;
    padding-bottom: 16px;
}
/* Figma: gap 48px between event cards wrapper and content */
.kp-event-cards__grid {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

/* Event card — Figma: border 1px, padding 16px mobile / 24px desktop, gap 24px */
.kp-event-card {
    border: 1px solid rgba(13, 28, 56, 0.25);
    padding: 16px;
    display: flex;
    flex-direction: column;
    gap: 24px;
}
/* Top row: date box + details side by side */
.kp-event-card__top {
    display: flex;
    flex-direction: row;
    gap: 24px;
    align-items: flex-start;
}

/* Date box — Figma: bg #ebf1f8, padding 4px 16px */
.kp-event-card__date-box {
    background: #EBF1F8;
    padding: 4px 16px;
    display: flex;
    flex-direction: column;
    align-items: center;
    flex-shrink: 0;
}
/* Figma: sofia-pro 32px, height 48px */
.kp-event-card__date-day {
    font-family: var(--font-heading, "sofia-pro", sans-serif);
    font-size: 32px;
    line-height: 140%;
    font-weight: 400;
    color: var(--color-primary, #0D1C38);
    height: 48px;
    display: flex;
    align-items: center;
}
/* Figma: acumin 18px, margin-top -12px */
.kp-event-card__date-month {
    font-family: var(--font-main, "acumin-pro", sans-serif);
    font-size: 18px;
    line-height: 150%;
    font-weight: 400;
    color: var(--color-primary, #0D1C38);
    text-transform: uppercase;
    margin-top: -12px;
}

/* Event details — Figma: flex column, gap 4px */
.kp-event-card__details {
    display: flex;
    flex-direction: column;
    gap: 4px;
}
/* Figma: acumin 18px */
.kp-event-card__detail {
    display: flex;
    align-items: center;
    gap: 6px;
    font-family: var(--font-main, "acumin-pro", sans-serif);
    font-size: 18px;
    line-height: 150%;
    color: var(--color-primary, #0D1C38);
}
.kp-event-card__detail svg {
    flex-shrink: 0;
    width: 16px;
    height: 16px;
    color: var(--color-primary, #0D1C38);
}

/* Event title — Figma: sofia-pro 24px */
.kp-event-card__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-align: left;
    margin: 0;
}

/* Event description — Figma: acumin 16px */
.kp-event-card__description {
    font-family: var(--font-main, "acumin-pro", sans-serif);
    font-size: 16px;
    line-height: 150%;
    color: var(--color-primary, #0D1C38);
    margin: 0;
}

/* Desktop — Figma: 3 cards in row, padding 24px, bottom padding 160px */
@media (min-width: 1024px) {
    .kp-event-cards .inner {
        padding-bottom: 160px;
    }
    .kp-event-cards__grid {
        flex-direction: row;
        gap: 16px;
    }
    .kp-event-card {
        flex: 1;
        padding: 24px;
    }
}

/* ============================================================================
   KENNIS & INSPIRATIE: KP NEWSLETTER
   ============================================================================ */

.kp-newsletter {
    background: var(--color-primary, #0D1C38);
}
.kp-newsletter .inner {
    padding-left: 1rem;
    padding-right: 1rem;
}
/* Figma mobile: padding 64px 0, gap 24px. Desktop: 120px 0, gap 40px */
.kp-newsletter__content {
    display: flex;
    flex-direction: column;
    gap: 24px;
    padding: 64px 0;
    align-items: center;
    text-align: center;
}

/* Title */
.kp-newsletter__title {
    font-family: var(--font-heading, "sofia-pro", sans-serif);
    font-size: clamp(28px, 2vw + 12px, 40px);
    line-height: 120%;
    font-weight: 400;
    color: #ffffff;
    margin: 0;
}

/* Description */
.kp-newsletter__description {
    font-family: var(--font-main, "acumin-pro", sans-serif);
    font-size: 16px;
    line-height: 150%;
    color: #ffffff;
    margin: 0;
    opacity: 0.85;
}

/* Form */
.kp-newsletter__form {
    width: 100%;
}
/* Figma mobile: gap 8px, stacked column */
.kp-newsletter__input-group {
    display: flex;
    flex-direction: column;
    gap: 8px;
    width: 100%;
}
/* Figma mobile: bg rgba(235,241,248,0.9), border rgba(255,255,255,0.25), padding 8px 12px 8px 48px, height 56px, mail icon 24px, centered content */
.kp-newsletter__input {
    width: 100%;
    padding: 8px 12px 8px 48px;
    font-family: var(--font-main, "acumin-pro", sans-serif);
    font-size: 16px;
    line-height: 150%;
    color: var(--color-primary, #0D1C38);
    background-color: rgba(235, 241, 248, 0.9);
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='21' height='17' viewBox='0 0 21 17' fill='none'%3E%3Cpath d='M1.20312 1.89746V15.1016H19.0957V2.29395L18.3203 2.80371L10.3643 8.04199C10.3039 8.07364 10.2515 8.09931 10.2061 8.11719C10.2029 8.11818 10.1861 8.12305 10.1494 8.12305C10.1121 8.12304 10.0955 8.11806 10.0928 8.11719C10.0471 8.09922 9.99432 8.07387 9.93359 8.04199L2.20312 2.95117V2.55176L9.87598 7.57715L10.1494 7.75684L10.4229 7.57812L18.7695 2.12793L19.7803 1.4668C19.7959 1.5446 19.8047 1.625 19.8047 1.70898V14.6016C19.8047 14.9228 19.6924 15.1963 19.4434 15.4443C19.1945 15.6924 18.9197 15.8047 18.5957 15.8047H1.70312C1.38141 15.8047 1.10823 15.6923 0.860352 15.4443L0.773438 15.3506C0.58577 15.1278 0.5 14.8831 0.5 14.6016V1.70898C0.500017 1.62046 0.509066 1.53575 0.526367 1.4541L1.20312 1.89746ZM1.70312 0.5H18.5957C18.9191 0.5 19.1933 0.613174 19.4424 0.862305H19.4434C19.553 0.971962 19.6346 1.08743 19.6934 1.20898H0.610352C0.669035 1.08699 0.750804 0.971226 0.860352 0.861328H0.861328C1.1093 0.612456 1.38205 0.500029 1.70312 0.5Z' fill='%230D1C38' stroke='%230D1C38'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: 12px center;
    background-size: 24px auto;
    border: 1px solid rgba(255, 255, 255, 0.25);
    outline: none;
    box-sizing: border-box;
    height: 56px;
    text-align: center;
    -webkit-appearance: none;
}
.kp-newsletter__input::placeholder {
    color: rgba(0, 0, 0, 0.6);
    text-align: center;
}
.kp-newsletter__input:focus {
    border-color: #6BABD3;
}
/* Figma mobile: button full width (align-self: stretch), white bg, height 56px, justify-content center */
.kp-newsletter .kp-newsletter__submit.kp-btn {
    width: 100%;
    justify-content: center;
}

/* Desktop: Figma padding 120px 100px, input + button side by side, gap 16px */
@media (min-width: 1024px) {
    .kp-newsletter__content {
        padding: 120px 0;
        gap: 40px;
    }
    .kp-newsletter__input-group {
        flex-direction: row;
        gap: 16px;
    }
    .kp-newsletter__input {
        flex: 1;
        text-align: left;
    }
    .kp-newsletter__input::placeholder {
        text-align: left;
    }
    .kp-newsletter .kp-newsletter__submit.kp-btn {
        width: fit-content;
        flex-shrink: 0;
    }
}

/* Gravity Forms override inside newsletter */
.kp-newsletter .gform_wrapper { width: 100%; }
.kp-newsletter .gform_heading { display: none; }
.kp-newsletter .gform_validation_container { display: none !important; }
.kp-newsletter .gform_footer { display: none; }
.kp-newsletter .spacer.gfield { display: none !important; }
.kp-newsletter .gfield_label { display: none; }
.kp-newsletter .gform_fields {
    display: flex !important;
    flex-direction: column;
    gap: 8px;
}
.kp-newsletter .gform_wrapper input[type="email"],
.kp-newsletter .gform_wrapper input[type="text"] {
    width: 100%;
    height: 56px;
    padding: 8px 12px 8px 48px;
    font-family: var(--font-main, "acumin-pro", sans-serif);
    font-size: 16px;
    line-height: 150%;
    color: var(--color-primary, #0D1C38);
    background-color: rgba(235, 241, 248, 0.9);
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='21' height='17' viewBox='0 0 21 17' fill='none'%3E%3Cpath d='M1.20312 1.89746V15.1016H19.0957V2.29395L18.3203 2.80371L10.3643 8.04199C10.3039 8.07364 10.2515 8.09931 10.2061 8.11719C10.2029 8.11818 10.1861 8.12305 10.1494 8.12305C10.1121 8.12304 10.0955 8.11806 10.0928 8.11719C10.0471 8.09922 9.99432 8.07387 9.93359 8.04199L2.20312 2.95117V2.55176L9.87598 7.57715L10.1494 7.75684L10.4229 7.57812L18.7695 2.12793L19.7803 1.4668C19.7959 1.5446 19.8047 1.625 19.8047 1.70898V14.6016C19.8047 14.9228 19.6924 15.1963 19.4434 15.4443C19.1945 15.6924 18.9197 15.8047 18.5957 15.8047H1.70312C1.38141 15.8047 1.10823 15.6923 0.860352 15.4443L0.773438 15.3506C0.58577 15.1278 0.5 14.8831 0.5 14.6016V1.70898C0.500017 1.62046 0.509066 1.53575 0.526367 1.4541L1.20312 1.89746ZM1.70312 0.5H18.5957C18.9191 0.5 19.1933 0.613174 19.4424 0.862305H19.4434C19.553 0.971962 19.6346 1.08743 19.6934 1.20898H0.610352C0.669035 1.08699 0.750804 0.971226 0.860352 0.861328H0.861328C1.1093 0.612456 1.38205 0.500029 1.70312 0.5Z' fill='%230D1C38' stroke='%230D1C38'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: 12px center;
    background-size: 24px auto;
    border: 1px solid rgba(255, 255, 255, 0.25);
    border-radius: 0;
    outline: none;
    box-sizing: border-box;
    text-align: center;
    -webkit-appearance: none;
}
.kp-newsletter .gform_wrapper input[type="email"]::placeholder,
.kp-newsletter .gform_wrapper input[type="text"]::placeholder {
    color: rgba(0, 0, 0, 0.6);
    text-align: center;
}
.kp-newsletter .brochure-submit-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    width: 100%;
    height: 56px;
    padding: 16px 32px;
    background: #ffffff;
    border: none;
    cursor: pointer;
    font-family: var(--font-main, "acumin-pro", sans-serif);
    font-size: 16px;
    line-height: 150%;
    color: var(--color-primary, #0D1C38);
    transition: background 0.2s ease;
}
.kp-newsletter .brochure-submit-btn:hover { background: #EBF1F8; }
@media (min-width: 1024px) {
    .kp-newsletter .gform_fields {
        flex-direction: row;
        gap: 16px;
    }
    .kp-newsletter .gfield--type-email { flex: 1; }
    .kp-newsletter .gform_wrapper input[type="email"],
    .kp-newsletter .gform_wrapper input[type="text"] {
        text-align: left;
    }
    .kp-newsletter .gform_wrapper input[type="email"]::placeholder,
    .kp-newsletter .gform_wrapper input[type="text"]::placeholder {
        text-align: left;
    }
    .kp-newsletter .brochure-submit-btn { width: fit-content; }
}

/* Desktop newsletter text-col and form-col layout */
@media (min-width: 1024px) {
    .kp-newsletter__text-col {
        flex: 1;
        display: flex;
        flex-direction: column;
        gap: 16px;
    }
    .kp-newsletter__form-col {
        flex: 0 0 auto;
        min-width: 400px;
    }
}

/* ============================================================================
   KP News Rows (homepage "Kennis en inspiratie")
   Desktop: 3 full-width gestapelde rows met text-LINKS + image-RECHTS (540×340)
   Mobile : Owl horizontale slider met cards (320px)
   ============================================================================ */
.kp-news-rows {
    background: #ffffff;
}
/* ── DESKTOP: stacked rows ── */
.kp-news-rows__list { display: block; }
.kp-news-rows__mobile { display: none; }

.kp-news-row {
    background: #ffffff;
    border-bottom: 1px solid rgba(13, 28, 56, 0.25);
}
.kp-news-row__inner {
    padding: 64px 0;
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    /* Figma: gap 400px @ 1920 viewport — schaalt naar beneden */
    gap: clamp(40px, calc(25vw - 80px), 400px);
}
.kp-news-row__text {
    flex: 1 1 0%;
    min-width: 0;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: space-between;
    gap: 40px;
    align-self: stretch;
}
.kp-news-row__meta {
    display: flex;
    flex-direction: row;
    gap: 40px;
    flex-wrap: wrap;
}
.kp-news-row__meta-item {
    display: flex;
    flex-direction: row;
    gap: 8px;
    align-items: baseline;
}
.kp-news-row__meta-label {
    color: #0d1c38;
    font-family: "acumin-pro", sans-serif;
    font-size: 16px;
    line-height: 150%;
    font-weight: 700;
}
.kp-news-row__meta-value {
    color: #0d1c38;
    font-family: "acumin-pro", sans-serif;
    font-size: 16px;
    line-height: 150%;
    font-weight: 400;
}
.kp-news-row__title-link {
    text-decoration: none;
    align-self: stretch;
}
.kp-news-row__title {
    color: #0d1c38;
    font-family: "sofia-pro", sans-serif;
    font-size: 32px;
    line-height: 130%;
    font-weight: 400;
    margin: 0;
    transition: color .2s ease;
}
.kp-news-row__title-link:hover .kp-news-row__title { color: #6BABD3; }
.kp-news-row__text-body {
    color: #0d1c38;
    font-family: "acumin-pro", sans-serif;
    font-size: 16px;
    line-height: 150%;
    font-weight: 400;
    margin: 0;
}
.kp-news-row__image {
    flex: 0 1 540px;
    width: 540px;
    max-width: 40%;
    aspect-ratio: 540 / 340;
    background: #c4c4c4;
    overflow: hidden;
    display: block;
}
.kp-news-row__image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

/* Footer button (centered, met border-bottom op section) */
.kp-news-rows__footer {
    background: #ffffff;
    border-bottom: 1px solid rgba(13, 28, 56, 0.25);
}
.kp-news-rows__footer .inner {
    padding: 48px 0;
    display: flex;
    align-items: center;
    justify-content: center;
}
.kp-news-rows__btn {
    display: inline-flex;
    align-items: center;
    gap: 16px;
}

/* ── MOBILE (< 1024px) ── */
@media (max-width: 1023px) {
    .kp-news-rows__list { display: none; }
    .kp-news-rows__mobile { display: block; }
    .kp-news-rows__mobile .inner {
        padding: 0 16px 64px 16px;
    }
    .kp-news-rows__slider {
        margin: 0;
    }
    .kp-news-card {
        background: #ffffff;
        border: 1px solid rgba(13, 28, 56, 0.25);
        padding: 16px;
        display: flex;
        flex-direction: column;
        width: 100%;
    }
    .kp-news-card__image-link {
        display: block;
        width: 100%;
        aspect-ratio: 288 / 181.53;
        overflow: hidden;
    }
    .kp-news-card__image {
        width: 100%;
        height: 100%;
        object-fit: cover;
        display: block;
    }
    .kp-news-card__body {
        padding: 24px 0 0 0;
        display: flex;
        flex-direction: column;
        gap: 16px;
    }
    .kp-news-card__meta {
        display: flex;
        flex-direction: column;
        gap: 4px;
    }
    .kp-news-card__meta-item {
        display: flex;
        flex-direction: row;
        gap: 8px;
        align-items: center;
    }
    .kp-news-card__meta-label {
        color: #0d1c38;
        font-family: "acumin-pro", sans-serif;
        font-size: 16px;
        line-height: 150%;
        font-weight: 700;
    }
    .kp-news-card__meta-value {
        color: #0d1c38;
        font-family: "acumin-pro", sans-serif;
        font-size: 16px;
        line-height: 150%;
        font-weight: 400;
    }
    .kp-news-card__category-pill {
        display: inline-block;
        background: #fdf5ec;
        border: 1px solid #e8821a;
        border-radius: 52px;
        padding: 4px 8px 2px 8px;
        font-family: "acumin-pro", sans-serif;
        font-size: 14px;
        line-height: 150%;
        font-weight: 400;
        color: #e8821a;
    }
    .kp-news-card__title-link { text-decoration: none; }
    .kp-news-card__title {
        color: #0d1c38;
        font-family: "sofia-pro", sans-serif;
        font-size: 20px;
        line-height: 150%;
        font-weight: 400;
        text-decoration: underline;
        margin: 0;
    }

    /* Slider nav (progress lijn + arrows) */
    .kp-news-rows__nav {
        display: flex;
        align-items: center;
        gap: 24px;
        margin-top: 24px;
    }
    .kp-news-rows__line {
        flex: 1;
        height: 1px;
        background: rgba(13, 28, 56, 0.25);
        position: relative;
    }
    .kp-news-rows__line-progress {
        position: absolute;
        top: 0;
        left: 0;
        height: 1px;
        background: #0d1c38;
        width: 0%;
        transition: width .3s ease;
    }
    .kp-news-rows__arrows {
        display: flex;
        gap: 16px;
        flex-shrink: 0;
    }
    .kp-news-rows__arrow {
        background: #ffffff;
        border: 1px solid #0d1c38;
        border-radius: 50px;
        padding: 12px;
        width: 48px;
        height: 48px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        cursor: pointer;
        color: #0d1c38;
        transition: background .2s ease, color .2s ease;
    }
    .kp-news-rows__arrow:hover {
        background: #0d1c38;
        color: #ffffff;
    }
    .kp-news-rows__arrow svg { width: 24px; height: 24px; display: block; }

    /* Mobile section heeft border-bottom als geheel, niet per row */
    .kp-news-row { border-bottom: none; }

    .kp-news-rows__footer .inner {
        padding: 24px 16px;
    }
}