body.--no-scroll { overflow-y: hidden; }

.wpb-navigation { --nav-height: calc(7.3rem + var(--wp-admin--admin-bar--height, 0rem)); --nav-bg-clr: #fff; background-color: var(--nav-bg-clr); position: relative; z-index: 1040; padding: 1.6rem 0; border-bottom: 1px solid rgb(var(--wpb-border-color)); }
.wpb-navigation .wpb-navigation__main { background-color: var(--nav-bg-clr); }
.wpb-navigation .container { position: static; }
.wpb-navigation .inner { width: 100%; display: flex; align-items: center; justify-content: space-between; gap: .5rem; }
.wpb-navigation .inner .wpb-woocommerce-mini-cart { margin-left: auto; z-index: 50; }
.wpb-navigation .inner .wpb-woocommerce-mini-cart .ag-icon__arrow-right { display: none; }
.wpb-navigation .logo { z-index: 50; display: inline-flex; }
.wpb-navigation .logo img { width: 100px; max-width: 18rem; height: auto; }

.wpb-navigation:has(+ .wpb-header--home) { --nav-bg-clr: var(--clr-primary); border-bottom: 0; } 
.wpb-navigation:has(+ .wpb-header--home) { background-color: var(--clr-primary); --nav-bg-clr: var(--clr-primary); border-bottom: 0; } 
.wpb-navigation:has(+ .wpb-header--home) .logo img { filter: brightness(0) invert(1); }
.wpb-navigation:has(+ .wpb-header--home) .nav-toggle { background-color: var(--clr-primary-110); border: none; }
.wpb-navigation:has(+ .wpb-header--home) .nav-toggle svg { fill: #fff; }
.wpb-navigation:has(+ .wpb-header--home) .btn.btn-secondary-smoke { --border: 1px solid var(var(--clr-primary-110)); --bg-color: var(--clr-primary-110-rgb); --color: 255,255,255; --hover-color: var(--wpb-heading); --hover-bg-color: 255,255,255; }  
.wpb-navigation:has(+ .wpb-header--home) .btn.btn-secondary-smoke::before { color: rgb(var(--wpb-heading)); }
.wpb-navigation:has(+ .wpb-header--home) .btn.btn-secondary-smoke:hover::before { color: #fff; }
.wpb-navigation:has(+ .wpb-header--home) .wpb-navigation__collapse { --collapse-bg-color: var(--clr-primary); }
.wpb-navigation:has(+ .wpb-header--home) .wpb-navigation__collapse .wpb-menu > .menu-item > .menu-link { color: #fff; }
.wpb-navigation:has(+ .wpb-header--home) .wpb-navigation__collapse .wpb-menu > .menu-item > .menu-link:hover { color: #fff; }
.wpb-navigation:has(+ .wpb-header--home) .menu-item-has-children .wpb-submenu__toggle i { --color: 255, 255, 255; }
.wpb-navigation:has(+ .wpb-header--home) .wpb-collapse__footer a { color: #fff; }
.wpb-navigation:has(+ .wpb-header--home) .wpb-sub-menu .wpb-sub-menu__header { font-size: 2rem; color: #fff; }

.nav-toggle { --color: #000; --bg-color: #fff; --border-radius: 50%; border-radius: var(--border-radius); padding: 4px; background-color: var(--bg-color); border: 1px solid rgb(var(--wpb-border-color)); color: rgb(var(--color)); display: inline-flex; justify-content: center; align-items: center; cursor: pointer; width: 4rem; height: 4rem; position: relative; z-index: 50; }
.nav-toggle svg { fill: var(--color); }
.nav-toggle svg rect { transition: y var(--ts-25) ease var(--ts-25), transform var(--ts-25) ease, opacity 0ms var(--ts-25); transform-origin: center; }
.nav-toggle[aria-expanded="true"] svg rect { transition: y var(--ts-25) ease, transform var(--ts-25) ease var(--ts-25), opacity 0ms var(--ts-25); }
.nav-toggle[aria-expanded="true"] svg .top { y: 45; transform: rotate(45deg); }
.nav-toggle[aria-expanded="true"] svg .middle { opacity: 0; }
.nav-toggle[aria-expanded="true"] svg .bottom { y: 45; transform: rotate(-45deg); }

.wpb-navigation__collapse { --collapse-bg-color: #fff; }
.wpb-navigation__collapse ul { list-style: none; }
.wpb-navigation__collapse .menu-item .menu-link { color: rgb(var(--wpb-text)); width: 100%; font-weight: 600; line-height: 1.15; text-decoration: none; display: inline-flex; align-items: center; column-gap: 1rem; line-height: 1; transition: color var(--ts-duration) var(--ts-function); }
.wpb-navigation__collapse .menu-item .menu-link:hover { color: rgb(var(--wpb-primary))  }
.wpb-navigation__collapse .menu-item.menu-item--current > .menu-link { color: rgb(var(--wpb-primary)) ; }
.wpb-navigation__collapse .menu-item-has-children { position: relative; } 

.wpb-navigation .wpb-collapse__footer a { font-size: 1.6rem; font-weight: 600; text-decoration: none; color: rgb(var(--wpb-primary)); display: flex!important; align-items: center; gap: .6rem; }

.wpb-navigation .inner > .wpb-dropdown { display: none; }
.wpb-navigation .inner > .wpb-dropdown .btn-outline { --padding-x: 1.4rem; }
.wpb-navigation .inner > .wpb-dropdown span { white-space: nowrap; }
.wpb-woocommerce-mini-cart > a .ag-icon__arrow-right { margin-left: auto; }

.wpb-navigation .btn-menu-toggle i { color: rgb(var(--wpb-text)); }
.wpb-navigation:has(+ .wpb-header--home) .btn-menu-toggle i { color: #fff; }

.menu-item.menu-item--seatbelt .wpb-icon__seatbelt { --width: 1rem; --height: 1.2rem; }

.wpb-navigation:has(+ .wpb-header--home) .menu-item.menu-item--seatbelt .wpb-icon__seatbelt { --color: 255,255,255; }

.wpb-sub-menu__subitems { display: flex; flex-direction: column; gap: 1.6rem; }
.wpb-sub-menu__subitems .submenu-item { color: #fff; display: grid; grid-template-columns: 1fr 3.2rem; align-items: end; text-decoration: none; background-color: var(--clr-primary-110); border-radius: 1.4rem; padding: 2rem; }
.wpb-sub-menu__subitems .submenu-item strong { font-size: 2.2rem; font-weight: 700; line-height: 1.1; display: flex; align-items: center; column-gap: .8rem; }
.wpb-sub-menu__subitems .submenu-item strong img { width: 1.5rem; height: 1.5rem; }
.wpb-sub-menu__subitems .submenu-item p { font-size: 1.6rem; display: -webkit-box; -webkit-line-clamp: 2; overflow: hidden; text-overflow: ellipsis; -webkit-box-orient: vertical; margin-top: .5rem; }
.wpb-sub-menu__subitems .submenu-item .submenu-item__arrow { width: 3.2rem; height: 3.2rem; border-radius: 50%; background: #fff; display: grid; place-items: center; color: var(--clr-primary); transition: transform 150ms ease-in-out; }
.wpb-sub-menu__subitems .submenu-item:hover .submenu-item__arrow { transform: rotate(-45deg); }

.wpb-sub-menu--mega .wpb-sub-menu__body { display: grid; gap: 1.6rem; }

/*** Navigation mobile ***/
@media (max-width: 991.98px) {
    .wpb-navigation__collapse { padding-top: var(--nav-height); max-width: 45rem; transform: translate3d(100%, 0, 0); width: 100%; display: none; flex-direction: column; position: fixed; top: 0; right: 0; bottom: 0; left: auto; background-color: var(--collapse-bg-color); z-index: 20; overflow: hidden; transition: transform var(--ts-35) ease; }
    .wpb-navigation__collapse.active { pointer-events: all; transform: translate3d(0%, 0, 0); }
    .wpb-navigation__collapse .wpb-collapse__header { font-size: 1.6rem; font-weight: bold; padding: 2rem; display: flex; justify-content: space-between; align-items: center; }
    .wpb-navigation__collapse .wpb-collapse__body { padding: 2rem; flex-grow: 1; overflow-y: auto; overscroll-behavior: contain; }
    .wpb-navigation__collapse .wpb-collapse__footer { padding: 2rem; }
    
    .wpb-navigation__collapse.wpb-navigation__collapse--left { transform: translate3d(-100%, 0, 0); left: 0; right: auto; }
    .wpb-navigation__collapse.wpb-navigation__collapse--left.active { transform: translate3d(0%, 0, 0); }

    .wpb-navigation__collapse .menu-item .menu-link { font-size: 2rem; padding: 1.5rem 0; }
    .wpb-navigation__collapse .menu-item-has-children > .menu-link > .btn { position: absolute; right: 0; top: 50%; transform: translateY(-50%); }

    
    .wpb-navigation .wpb-collapse__footer a { font-size: 2rem; }

    .wpb-sub-menu { padding-top: var(--nav-height); display: flex; flex-direction: column; height: 100%; overflow: hidden; list-style: none; position: fixed; top: 0; right: 0; bottom: 0; left: 0; background-color: #fff; z-index: 1; overflow-y: auto; transform: translate3d(100%, 0, 0); background-color: var(--collapse-bg-color); transition: transform var(--ts-35) ease; }
    .wpb-sub-menu.active { transform: translate3d(0, 0, 0); }
    .wpb-sub-menu .wpb-sub-menu__header { font-size: 1.6rem; font-weight: bold; padding: 2rem; display: flex; align-items: center; justify-content: space-between; }
    .wpb-sub-menu .wpb-sub-menu__body { padding: 2rem; }

    .wpb-navigation .btn-menu-toggle { display: grid; place-items: center; --bg-color: 255,255,255; --border: 1px solid rgb(var(--wpb-border-color)); padding: 0; width: 4rem; height: 4rem; border-radius: 50%; }
    .wpb-navigation .btn-menu-toggle i { color: rgb(var(--wpb-text)); }

    .wpb-navigation:has(+ .wpb-header--home) .menu-item a:not(.btn) { color: #fff; }
    .wpb-navigation:has(+ .wpb-header--home) .menu-item a:hover { color: #fff; }
    .wpb-navigation:has(+ .wpb-header--home) .btn-menu-toggle { --bg-color: var(--clr-primary-110-rgb); --border: none; } 
}

/*** Navigation desktop ***/
@media (min-width: 992px) {
    .wpb-navigation { padding: 0; }
    .wpb-navigation .inner { column-gap: 1.6rem; }

    .btn.btn--nav-toggle, .wpb-navigation__collapse :is(.wpb-collapse__header, .wpb-submenu__header) { display: none; }

    .wpb-navigation__collapse { width: 100%; display: flex!important; justify-content: space-between; align-items: center; }
    .wpb-navigation__collapse .menu-item .menu-link { font-size: 1.6rem; position: relative; padding: 1rem 1.6rem; }
    .wpb-navigation__collapse .menu-item-has-children > .menu-link > .btn { width: auto; height: auto; min-height: 0; }
    .wpb-navigation__collapse .wpb-menu { display: flex; align-items: center; }
    .wpb-navigation__collapse .wpb-menu > .menu-item > .menu-link { min-height: 10rem; padding: 1rem 1.4rem; } /* Hoogste niveau links */
    .wpb-navigation__collapse .wpb-menu > .menu-item > .menu-link > .btn { pointer-events: none; padding: 0; border: none; background: transparent; transform: rotate(90deg); }
    .wpb-navigation__collapse .wpb-menu > .menu-item > .menu-link > .btn i { transition: transform 150ms ease; }
    .wpb-navigation__collapse .menu-item-has-children:hover > .menu-link > .btn i { transform: rotate(180deg); }
    .wpb-navigation__collapse .menu-item-has-children:hover > .wpb-sub-menu { pointer-events: all; opacity: 1; }

    .wpb-navigation__collapse .wpb-collapse__body { margin-inline: auto; }

    .wpb-navigation .inner .wpb-woocommerce-mini-cart, .wpb-navigation .wpb-dropdown{ min-height: 10rem; } 

    .wpb-navigation .logo img { width: 100%; min-width: 11rem; }

    .wpb-sub-menu { border: 1px solid rgb(var(--wpb-border-color)); border-radius: 0 0 1.4rem 1.4rem; position: absolute; top: 100%; right: auto; bottom: auto; left: 50%; transform: translateX(-50%); width: 100%; padding: 0; min-width: 20rem; height: auto!important; background-color: #fff; opacity: 0; overflow: visible; pointer-events: none; transition: opacity var(--ts-25) ease; }
    .wpb-sub-menu .wpb-sub-menu { top: 0; left: 100%; transform: none; } 
    .wpb-sub-menu .wpb-sub-menu__header { display: none; }
    .wpb-sub-menu .menu-link { color: rgb(var(--clr-text)); }

    .nav-toggle { display: none; }

    .wpb-navigation .inner > .wpb-dropdown { display: flex; align-items: center; }

    .wpb-navigation__collapse .menu-item-has-children:has(.wpb-sub-menu--mega) { position: static; }
    .wpb-sub-menu--mega { padding-inline: calc((100vw - (var(--wpb-width) - 3.3rem)) / 2); border-radius: 0; border: none; border-top: 1px solid rgb(var(--wpb-border-color)); box-shadow: 0 0 6rem 2.3rem rgba(0,0,0,.25); z-index: -1; }
    .wpb-sub-menu--mega .wpb-sub-menu__body { padding: 4.8rem 0; grid-template-columns: 2fr 1fr; column-gap: 2rem; }

    .wpb-navigation:has(+ .wpb-header--home) .wpb-sub-menu--mega { background-color: var(--clr-primary); border: none; }
    .wpb-navigation:has(+ .wpb-header--home) .wpb-sub-menu--mega::before { --color: 0, 0, 0, .2; --mask: url('/wp-content/themes/wux/assets/icons/seat_belt_stitch.svg'); content: ''; width: 100%; height: 2.2rem; position: absolute; left: 0; top: 0; -webkit-mask-image: var(--mask); mask-image: var(--mask); -webkit-mask-size: contain; mask-size: contain; -webkit-mask-repeat: repeat-x; mask-repeat: repeat-x; -webkit-mask-position: left; mask-position: left; background-color: rgba(var(--color)); pointer-events: none; }

}

@media (min-width: 1200px) {
    .wpb-navigation .logo img { min-width: 14rem; }
    .wpb-navigation .inner .wpb-woocommerce-mini-cart .ag-icon__arrow-right { display: inline-block; }

    .wpb-sub-menu--mega .wpb-sub-menu__body { padding: 6rem 0; column-gap: 3.2rem; }
}

@media (min-width: 1400px) {
    .wpb-navigation .logo img { min-width: 20rem; }
}


.configure-seatbelt { background-color: var(--clr-primary-110); border-radius: 1.4rem; overflow: hidden; }
.configure-seatbelt .configure-seatbelt__text { display: flex; flex-direction: column; padding: 2rem; align-items: start; }
.configure-seatbelt .configure-seatbelt__text > * + * { margin-top: 1em; }
.configure-seatbelt .configure-seatbelt__text p { color: #fff; }
.configure-seatbelt .configure-seatbelt__text .h1 { font-size: clamp(3.8rem, 4vw, 5.4rem); line-height: 1.1; font-weight: 700; }
.configure-seatbelt .configure-seatbelt__image { min-height: 20rem; position: relative; clip-path: polygon(0 3.2rem, 100% 0, 100% 100%, 0% 100%); }
.configure-seatbelt .configure-seatbelt__image img { position: absolute; top: 0; right: 0; bottom: 0; left: 0; width: 100%; height: 100%; object-fit: cover; }

@media (min-width: 992px) { 
    .configure-seatbelt { --offset: 3.2rem; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .configure-seatbelt .configure-seatbelt__image { clip-path: polygon(var(--offset) 0, 100% 0, 100% 100%, 0% 100%); margin-left: calc((var(--offset) / 2) * -1); }
}

@media (min-width: 1200px) { 
    .configure-seatbelt .configure-seatbelt__text { padding: 3.2rem; }
    .configure-seatbelt .configure-seatbelt__text p { font-size: 2rem; }
}

@media (min-width: 1400px) { 
    .configure-seatbelt { --offset: 6.4rem; }
    .configure-seatbelt .configure-seatbelt__text { padding: 6.3rem 4.8rem; }
    .configure-seatbelt .configure-seatbelt__text p { font-size: 2.2rem; }
}