/*
Theme Name: Wux Theme
Author: Wux
Author URI: https://wux.nl/
Description: Wux is het custom wordpress thema van Wux - Internetbureau
Version: 2.0
Requires PHP: 8.3.0
Text Domain: wuxnl-theme
*/

:root {
    --fs: 1.5rem;
    --lh: 1.6;
    
    /* Custom beziers */
    --cb--smooth: cubic-bezier(.58,.22,.2,.96);

    /* Color variables */
    --clr-primary: rgba(167, 199, 19, 1);
    --clr-primary-rgb: 167, 199, 19;

    --clr-secondary: rgba(37, 41, 17, 1);
    --clr-secondary-rgb: 37, 41, 17;
    --clr-secondary-110: rgba(24, 28, 9, 1);

    --clr-heading: rgba(19, 19, 19, 1);
    --clr-text: rgba(78, 78, 78, 1);

    --clr-dark: rgba(19, 19, 19, 1);
    --clr-dark-rgb: 19, 19, 19;
    --clr-dark-40: rgba(181, 181, 181, 1);
    --clr-dark-30: rgba(210, 210, 210, 1);
    --clr-dark-20: rgba(235, 235, 235, 1);
    --clr-dark-10: rgba(246, 246, 246, 1);

    --clr-light: var(--clr-dark-10);
    --clr-border: var(--clr-dark-20); 
    
    --clr-danger: #e2401c;
    --clr-info: #3d9cd2;
    --clr-success: #1CB435;

    /* Font variables */
    --font-heading: 'FormulaCondensed', sans-serif;
    --font-primary: 'Aspekta', sans-serif;

    /* Container max-width variables */
    --container-width: 100%;
    --container-width--sm: 640px;
    --container-width--md: 820px;
    --container-width--lg: 1020px;
    --container-width--xl: 1220px;
    --container-width--xxl: 1440px;
    --container-width--xxxl: 1590px;

    --block-offset: 0;

    --ts-duration: var(--ts-25);
    --ts-function: var(--cb--smooth);

    --nexpact-beeldmark: url('/app/themes/wuxnl-theme/assets/icons/default/nexpact-beeldmark.svg');
    --nexpact-angle: url('/app/themes/wuxnl-theme/assets/img/nexpact-dot--angle-asset.svg');

    /* Background asset URL's */
    --bg-asset: url('/app/themes/wuxnl-theme/assets/img/nexpact-bg-asset.svg'); /* Dit vervangen met een andere URL, is nu nog de wide asset*/
    --bg-asset--small: url('/app/themes/wuxnl-theme/assets/img/nexpact-bg-asset--small.svg');
    --bg-asset--wide: url('/app/themes/wuxnl-theme/assets/img/nexpact-bg-asset--wide.svg');
    --bg-asset--shape: url('/app/themes/wuxnl-theme/assets/img/nexpact-bg-asset--shape.svg');
    --bg-asset--card: url('/app/themes/wuxnl-theme/assets/img/nexpact-bg-asset--card.svg');

    --bg-asset--wide--animate: url('/app/themes/wuxnl-theme/assets/img/nexpact-bg-asset--wide--animate.svg');

    /* Clip paths */
    --clip-path-size: 3.5rem;    
    --clip-path-TopR: polygon(calc(100% - var(--clip-path-size)) 0, 100% var(--clip-path-size), 100% 100%, 0 100%, 0 0);
    --clip-path-TopL: polygon(var(--clip-path-size) 0%, 100% 0, 100% 100%, 0 100%, 0 var(--clip-path-size));
    --clip-path-BottomR: polygon(100% 0, 100% calc(100% - var(--clip-path-size)), calc(100% - var(--clip-path-size)) 100%, 0 100%, 0 0);
    --clip-path-BottomL: polygon(0 0, 100% 0, 100% 100%, var(--clip-path-size) 100%, 0 calc(100% - var(--clip-path-size)));

    --clip-path: var(--clip-path-BottomR); /*Default clip path*/
}
@media (min-width: 576px) {
    :root{
        --block-offset: 1.2rem;
    }
}
@media (min-width: 768px) {
    :root {
        --fs: 1.6rem;
        --clip-path-size: 4.5rem; 
    }
}
@media (min-width: 1200px) {
    :root {
        --fs: 2rem;
        --clip-path-size: 6.5rem;   
    }
}

body { font-family: var(--font-primary); }

/*** ---------- Typography ---------- ***/
h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6 { font-family: var(--font-heading); color: var(--clr-heading); font-weight: 300; text-transform: uppercase; letter-spacing: .5px; }
:is(h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6) strong{ font-weight: 700; }
h1, .h1 { --fs: clamp(4.8rem, 7vw, 12rem); --lh: 1; }
h2, .h2 { --fs: clamp(3.8rem, 5.5vw, 8rem); --lh: 1; }
h3, .h3 { --fs: clamp(2.4rem, 4vw, 3.2rem); --lh: 1; font-weight: 750; text-transform: none; }
h4, .h4 { --fs: clamp(2rem, 3vw, 2.8rem); --lh: 1.2; font-weight: 750; text-transform: none; font-family: var(--font-primary); letter-spacing: 0; text-wrap: pretty; }

.wpb-text p:has(+ :is(h1, h2, h3)):has(em:only-child){ --clr: var(--clr-primary); color: var(--clr); font-size: clamp(2rem, 3vw, 2.8rem); font-weight: 750; line-height: 1.2; }
.wpb-text p:has(+ :is(h1, h2, h3)) em:only-child{ font-style: normal; letter-spacing: -0.025em; }
.wpb-text p:has(em:only-child) + :is(h1, h2, h3){ --mt: 2rem; }

@media (min-width: 576px) {
    h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6{ letter-spacing: 2px; }
}

@media (min-width: 992px) {
    .wpb-text p:has(em:only-child) + :is(h1, h2, h3){ --mt: 3.2rem; }
}

.wpb-content :is(h2, .h2){ --fs: clamp(3.2rem, 4vw, 4.8rem); font-weight: 700; }

.wpb-text .wpb-text__footer{ margin-top: auto; }

/*** ---------- Whitespace ---------- ***/
[class*="wpb-wst"] { --pt: 0; padding-top: var(--pt); }
[class*="wpb-wsb"] { --pb: 0; padding-bottom: var(--pb); }

.wpb-wst--none      { --pt: 0; }
.wpb-wst--small     { --pt: 2.4rem; }
.wpb-wst--medium    { --pt: 3.8rem; }
.wpb-wst--large     { --pt: 5rem; }

.wpb-wsb--none      { --pb: 0; }
.wpb-wsb--small     { --pb: 2.4rem; }
.wpb-wsb--medium    { --pb: 3.8rem; }
.wpb-wsb--large     { --pb: 5rem; }

@media (min-width: 992px) {
    .wpb-wst--small     { --pt: 6.4rem; }
    .wpb-wst--medium    { --pt: 8rem; }
    .wpb-wst--large     { --pt: 11rem; }
    
    .wpb-wsb--small     { --pb: 6.4rem; }
    .wpb-wsb--medium    { --pb: 8rem; }
    .wpb-wsb--large     { --pb: 11rem; }
}

/* Whitespace: Single content  ----------- */
.content-section.wpb-wst--small     { --pt: 2.4rem; }
.content-section.wpb-wst--medium    { --pt: 5rem; }
.content-section.wpb-wst--large     { --pt: 7rem; }

.content-section.wpb-wsb--small     { --pb: 2.4rem; }
.content-section.wpb-wsb--medium    { --pb: 5rem; }
.content-section.wpb-wsb--large     { --pb: 7rem; }

@media (min-width: 992px) {
    .content-section.wpb-wst--small { --pt: 6.4rem; }
    .content-section.wpb-wst--medium{ --pt: 8rem; }
    .content-section.wpb-wst--large { --pt: 11rem; }
    
    .content-section.wpb-wsb--small { --pb: 6.4rem; }
    .content-section.wpb-wsb--medium{ --pb: 8rem; }
    .content-section.wpb-wsb--large { --pb: 11rem; }
}

/*** ---------- Background colors ---------- ***/
.wpb-bg-clr--primary    { background-color: var(--clr-primary); }
.wpb-bg-clr--secondary  { background-color: var(--clr-secondary); }
.wpb-bg-clr--dark       { background-color: var(--clr-dark); }
.wpb-bg-clr--light      { background-color: var(--clr-light); }

:is(.wpb-bg-clr--primary, .wpb-bg-clr--secondary, .wpb-bg-clr--dark) .wpb-text *:not(.btn, .btn *, .wpb-card, .wpb-card *, p:has(em:only-child), p:has(em:only-child) *){ --clr-text: #fff; --clr--heading: #fff; color: var(--clr-text); }

/*** ---------- Header ---------- ***/
.wpb-header { 
    --gc: 1; --gap: 3.2rem; --min-height: 40vh; --clip-path-size: 8rem; --header-border: .7rem solid var(--clr-primary); 
    margin: var(--block-offset);
}
:is(.wpb-header, .wpb-header__top) > .container{ min-height: var(--min-height); }

.wpb-header.wpb-header--home{ border-bottom: var(--header-border); clip-path: var(--clip-path-BottomR); -webkit-clip-path: var(--clip-path-BottomR); transform: translateZ(0); will-change: transform; }
.wpb-header.wpb-header--home .container{ display: flex; flex-direction: column; justify-content: space-between; gap: 7rem; }
.wpb-header.wpb-header--home .wpb-text{ display: flex; flex-direction: column; max-width: 100rem; }
.wpb-header.wpb-header--home .wpb-text--footer{ font-size: clamp(1.8rem, 2vw, 2.8rem); max-width: 75rem; padding-right: 5rem; }
.wpb-header.wpb-header--home .wpb-bg-assets .wpb-bg-asset{ --h: 24rem; }

.wpb-header.wpb-header--subpage{ --clip-path-size: 8rem; --min-height: 30vh; clip-path: var(--clip-path-BottomR); -webkit-clip-path: var(--clip-path-BottomR); transform: translateZ(0); will-change: transform; }
.wpb-header.wpb-header--subpage .wpb-text{ --align: center; text-align: var(--align); max-width: 85rem; }
.wpb-header.wpb-header--subpage .wpb-text p{ font-size: clamp(1.8rem, 2vw, 2.8rem); }
.wpb-header.wpb-header--subpage .wpb-text .wpb-breadcrumbs > span{ justify-content: var(--align); }
.wpb-header.wpb-header--subpage .wpb-text .btn-group{ justify-content: var(--align); }
.wpb-header.wpb-header--subpage.has-background-asset::after{ background: rgba(var(--clr-dark-rgb), .5); }
.wpb-header.wpb-header--subpage .wpb-bg-assets{ z-index: 2; }
.wpb-header.wpb-header--subpage .wpb-bg-assets .wpb-bg-asset:first-child{ --left: 25rem; --top: 0; --right: auto; --bottom: auto; --h: 16.5rem; --w: 52rem; rotate: 180deg; }
.wpb-header.wpb-header--subpage .wpb-bg-assets .wpb-bg-asset:nth-child(2){ --w: 54rem; --h: 34rem;}
.wpb-header.wpb-header--subpage:has(.wpb-header__bottom) .wpb-bg-assets .wpb-bg-asset:nth-child(2){ display: none; --bottom: 9rem; }
.wpb-header .wpb-header__bottom{ padding: 2.4rem 0; position: relative; z-index: 5; background-color: var(--clr-secondary); border-top: var(--header-border); }
.wpb-header .wpb-header__bottom .container{ display: flex; align-items: center; flex-wrap: wrap; gap: 4.8rem; }
.wpb-header .wpb-header__bottom .container .wpb-usp-container{ display: none; max-width: calc(100% - 10rem); }
.wpb-header .wpb-header__bottom .container::before{ --size: 5rem; content: ''; display: none; position: relative; width: var(--size); min-width: var(--size); height: var(--size); background-image: var(--nexpact-beeldmark); background-size: contain; background-repeat: no-repeat; }
.wpb-header .wpb-header__bottom *:not(.btn, .btn *){ color: #fff; }

.wpb-header.wpb-header--werkenbij{ --padding-sides: 0; position: relative; background: linear-gradient(55deg, var(--clr-primary), var(--clr-dark) 40%, var(--clr-secondary) 65%); overflow: hidden; padding-left: var(--padding-sides); padding-right: var(--padding-sides); }
.wpb-header.wpb-header--werkenbij .wpb-text p:has(+ :is(h1, h2, h3)):has(em:only-child){ color: #FFFF; }
.wpb-header.wpb-header--werkenbij .container{ --min-height: auto; --gap: 2.4rem; display: grid; gap: var(--gap) }
.wpb-header.wpb-header--werkenbij .container video{ width: 100%; height: 100%; object-fit: cover; order: 999; }
.wpb-header.wpb-header--werkenbij .container--main .wpb-image{ max-height: 34.6rem; }
.wpb-header.wpb-header--werkenbij .container--secondary{ position: relative; }
.wpb-header.wpb-header--werkenbij .container--secondary .wpb-image{ position: absolute; top: 0; bottom: 5rem; display: none; }
.wpb-header.wpb-header--werkenbij .container--secondary .wpb-text{ max-width: 54rem; }
.wpb-header.wpb-header--werkenbij .container--secondary .wpb-text p{ font-size: clamp(1.8rem, 2vw, 2.8rem); line-height: 1.4; }
.wpb-header.wpb-header--werkenbij .container--secondary .wpb-image img{ width: auto; max-height: 29rem; }
.wpb-header.wpb-header--werkenbij .wpb-bg-assets .wpb-bg-asset:first-child{ --left: 24%; --top: 0; --right: auto; --bottom: auto; --h: 20rem; --w: 54rem; rotate: 180deg; }
.wpb-header.wpb-header--werkenbij .wpb-bg-assets .wpb-bg-asset:nth-child(2){ --w: 57.5rem; --h: 16.3rem; --bottom: 1.2rem; --right: 1.2rem; }
.wpb-header.wpb-header--werkenbij::before{ --size: 90vw; content: ''; position: absolute; top: -50vw; right: -10vw; background: radial-gradient(rgb(var(--clr-primary-rgb), .6), transparent 60%); width: var(--size); height: var(--size); pointer-events: none; }
.wpb-header.wpb-header--werkenbij::after{ --size: 95vw; content: ''; position: absolute; bottom: -35vw; right: -45vw; background: radial-gradient(rgb(var(--clr-primary-rgb), .6), transparent 60%); width: var(--size); height: var(--size); pointer-events: none; }

.wpb-header.wpb-header--archive { --min-height: auto; --align: center; }
.wpb-header.wpb-header--archive .wpb-text{ text-align: var(--align); }
.wpb-header.wpb-header--archive .wpb-text h1{ --fs: clamp(5.5rem, 7vw, 12rem); font-weight: 700; text-wrap: auto; word-break: break-word; hyphens: auto; }
.wpb-header.wpb-header--archive .wpb-text p{ font-size: clamp(1.8rem, 2vw, 2.8rem); }
.wpb-header.wpb-header--archive .wpb-text .wpb-breadcrumbs > span{ justify-content: var(--align); }

.wpb-header.wpb-header--single .wpb-header__wrapper{ position: relative; }
.wpb-header.wpb-header--single .wpb-text h1{ --mt: clamp(2rem, 4vw, 4rem); font-size: clamp(3.8rem, 5.5vw, 8rem); font-weight: 700; }
.wpb-header.wpb-header--single .wpb-text p{ font-size: clamp(1.8rem, 2vw, 2.4rem); }
.wpb-header.wpb-header--single .wpb-text *:has(+ .wpb-text__footer){ margin-bottom: 6rem; }
.wpb-header.wpb-header--single .wpb-text .wpb-text__footer{ display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 1.2rem; padding-bottom: 1.2rem; border-bottom: 4px dotted var(--clr-dark-30); } 
.wpb-header.wpb-header--single .wpb-user .wpb-user__text{ font-size: clamp(1.6rem, 1.5vw, 1.8rem); }
.wpb-header.wpb-header--single .wpb-user .wpb-user__text strong{ font-size: clamp(1.4rem, 1.5vw, 1.6rem); }
.wpb-header.wpb-header--single .container{ display: grid; gap: 4.8rem; }
.wpb-header.wpb-header--single .container .wpb-image img{ max-height: 58.5rem; object-fit: cover; clip-path: var(--clip-path-BottomL); }

.wpb-header.wpb-header--author{ --min-height: auto; }
.wpb-header.wpb-header--author .container{ display: grid; gap: 2.4rem; }
.wpb-header.wpb-header--author .container h1{ --fs: clamp(5rem, 7vw, 12rem); font-weight: 700; }
.wpb-header.wpb-header--author .container .wpb-image img{ max-height: 44rem; object-fit: cover; clip-path: var(--clip-path-BottomR); }
.wpb-header.wpb-header--author .container .wpb-text{ padding-bottom: 3.2rem; border-bottom: 4px dotted var(--clr-dark-30); }

@media (min-width: 576px) {
    .wpb-header .wpb-header__bottom .container::before{ display: block; }
    .wpb-header .wpb-header__bottom .container .wpb-usp-container{ display: flex; }

    .wpb-header.wpb-header--werkenbij{ --padding-sides: 2.4rem; }

    .wpb-header.wpb-header--subpage.has-background-asset::after{ background: linear-gradient(to bottom, rgba(var(--clr-dark-rgb), .35), rgba(var(--clr-dark-rgb), .5), rgba(var(--clr-dark-rgb), 1) ); }
}
@media (min-width: 768px) {
    .wpb-header { --clip-path-size: 12rem; --min-height: 50dvh; --header-border: 1.1rem solid var(--clr-primary); }
    .wpb-header.wpb-header--subpage{ --min-height: 40vh; }
    .wpb-header.wpb-header--subpage:has(.wpb-header__bottom) .wpb-bg-assets .wpb-bg-asset:nth-child(2){ display: block; }
    .wpb-header .wpb-header__bottom{ padding: 4.8rem 0; }
    .wpb-header.wpb-header--werkenbij{ --padding-sides: 4.8rem; }

    .wpb-header.wpb-header--werkenbij .container{ --gap: 4.8rem; }
    .wpb-header.wpb-header--werkenbij .container video{ order: -1; }
    .wpb-header.wpb-header--werkenbij .container--main{ grid-template-columns: 1fr 24rem; }
    .wpb-header.wpb-header--werkenbij .container--secondary{ grid-template-columns: 32rem 1fr; }
    .wpb-header.wpb-header--werkenbij .container--secondary .wpb-text{ padding: 2.4rem 0; }

    .wpb-header.wpb-header--single .container{ --text-width: 40rem; position: static; display: grid; grid-template-columns: var(--text-width) 1fr; }
    .wpb-header.wpb-header--single .container .wpb-image{ --image-width: calc(var(--wpb-width) - var(--text-width)); position: absolute; right: 0; top: -4.8rem; bottom: 0; width: calc(92% - var(--image-width)); }
    .wpb-header.wpb-header--single .container .wpb-image img{ width: 100%; height: 100%; max-height: 100%; }

    .wpb-header.wpb-header--author .container{ grid-template-columns: 30rem 1fr; gap: 4.8rem; }
}
@media (min-width: 992px) {
    .wpb-header:is(.wpb-header--home, .wpb-header--subpage) .container{ --p: 3.2rem; }

    .wpb-header.wpb-header--werkenbij .container--main{ grid-template-columns: 1fr 38rem; }
    .wpb-header.wpb-header--werkenbij .container--secondary{ grid-template-columns: 42rem 1fr 10rem; }
    .wpb-header.wpb-header--werkenbij .container--secondary .wpb-image{ display: block; left: calc(100% - 6rem); }
    .wpb-header.wpb-header--werkenbij .container--secondary .wpb-text .wpb-featured-button{ --mt: 4.8rem; }

    .wpb-header.wpb-header--single .container{ --text-width: 55rem; }
    .wpb-header.wpb-header--single .container .wpb-image{ width: calc(85% - var(--image-width)); }
    .wpb-header.wpb-header--single .wpb-text *:has(+ .wpb-text__footer){ margin-bottom: 12rem; }
    .wpb-header.wpb-header--single .wpb-text .wpb-text__footer{ padding-bottom: 3.6rem; }

    .wpb-header.wpb-header--author .container{ grid-template-columns: 40rem 1fr; gap: 8rem; }
    .wpb-header.wpb-header--author .container .wpb-image img{ max-height: 54rem; }
}
@media (min-width: 1200px) {
    .wpb-header { --min-height: 60dvh; }
    .wpb-header.wpb-header--home .wpb-bg-assets .wpb-bg-asset{ --h: 36rem; }
    .wpb-header.wpb-header--subpage{ --min-height: 50vh; }
    
    .wpb-header .wpb-header__bottom .container{ column-gap: 8rem; flex-wrap: nowrap; }
    .wpb-header .wpb-header__bottom .wpb-featured-button{ margin-left: auto; }

    .wpb-header.wpb-header--werkenbij{ --padding-sides: 8rem; }
    .wpb-header.wpb-header--werkenbij .container{ --gap: 8rem; }
    .wpb-header.wpb-header--werkenbij .container--secondary{ grid-template-columns: 58rem 1fr 10rem; }
    .wpb-header.wpb-header--werkenbij .container--secondary .wpb-image{ bottom: 10rem; left: calc(100% - -3rem); }

    .wpb-header.wpb-header--single .container{ --text-width: 64rem; }
    .wpb-header.wpb-header--single .container .wpb-image{ width: calc(66% - var(--image-width)); max-width: 85rem; }
}
@media (min-width: 1400px) {
    .wpb-header.wpb-header--werkenbij .container--secondary{ grid-template-columns: 74rem 1fr 14rem; }
    .wpb-header.wpb-header--werkenbij .container--secondary .wpb-image{ left: calc(100%); }

    .wpb-header.wpb-header--single .container{ --text-width: 78rem; }
    .wpb-header.wpb-header--single .container .wpb-image{ width: calc(53% - var(--image-width)); }
}
@media (min-width: 1600px) {
    .wpb-header.wpb-header--werkenbij .container--secondary .wpb-image{ left: calc(100% - 18rem); }
}

.wpb-written-by h2{ --fs: clamp(2.8rem, 3vw, 4.8rem); font-weight: 700; }
.wpb-written-by .wpb-section__header{ padding-bottom: 2.4rem; }
.wpb-written-by .wpb-section__body .container{ display: grid; grid-template-columns: repeat(auto-fit, minmax(35.5rem, 1fr)); gap: 2.4rem; }

/* Menu */
ul.wpb-menu-column{ display: flex; flex-direction: column; align-items: start; gap: .4rem; }
ul.wpb-menu-column .wpb-menu-column__title{ font-size: clamp(1.2rem, 1.5vw, 1.4rem); text-transform: uppercase; opacity: .75; margin-bottom: .8rem; }
ul.wpb-menu-column li { list-style: none; line-height: 1.5; }
ul.wpb-menu-column li a{ display: flex; align-items: center; gap: 1.2rem; text-decoration: none; transition: opacity var(--ts-25) ease; }
ul.wpb-menu-column li a:hover{ opacity: .5; }


.inner.inner--menus ul.wpb-menu-column:is(:first-child, :nth-child(2)) li a{ display: flex; font-size: clamp(1.8rem, 2vw, 2.4rem); font-weight: 500; line-height: 1.2; }
.inner.inner--menus ul.wpb-menu-column:is(:first-child, :nth-child(2)) li + li a{ padding-top: .4em; }
.inner.inner--menus ul.wpb-menu-column:is(:first-child, :nth-child(2)) li a span.count{ --size: 3rem; font-size: 2rem; width: var(--size); min-width: var(--size); height: var(--size); min-height: var(--size); border-radius: 50%; display: flex; justify-content: center; align-items: center; background-color: var(--clr-primary); color: #FFFF; }

@media (min-width: 992px) {
    ul.wpb-menu-column .wpb-menu-column__title{ margin-bottom: 2.4rem; }
}

/*** ---------- Single content ---------- ***/

.content-section .inner[class*="wpb-bg-clr--"]:not(.wpb-bg-clr--transparent){ --p: 2.4rem; padding: var(--p); }

.content-section.content-section--text .wpb-user{ --mt: 3.2rem; --size: 6rem; }
.content-section.content-section--text .wpb-user .wpb-user__text strong{ font-size: clamp(1.4rem, 1.5vw, 1.6rem); }
.content-section.content-section--text .wpb-usp-block-container{ padding-top: 4rem; }

.content-section.content-section--images .inner{ display: grid; grid-template-columns: repeat(auto-fit, minmax(30rem, 1fr)); gap: 2.4rem; }
.content-section.content-section--images .inner .wpb-image{ clip-path: var(--clip-path-BottomR); }
.content-section.content-section--images .inner .wpb-image img{ height: 100%; object-fit: cover; }

.content-section.content-section--quote .inner{ --border: 4px dotted var(--clr-dark-30); padding: clamp(2.4rem, 4vw, 4.8rem) clamp(0rem, 8vw, 25rem); display: flex; flex-direction: column; align-items: center; gap: 2.8rem; border-top: var(--border); border-bottom: var(--border); }
.content-section.content-section--quote .inner .wpb-user{ --size: 6rem; }
.content-section.content-section--quote .inner .wpb-text{ text-align: center; }
.content-section.content-section--quote .inner .wpb-text p{ font-size: clamp(1.8rem, 2vw, 2.4rem); color: var(--clr-heading); }
.content-section.content-section--quote .inner .wpb-author{ display: flex; flex-direction: column; align-items: center; color: var(--clr-heading); }
.content-section.content-section--quote .inner .wpb-image img{ max-height: 5rem; width: auto; }

.content-section.content-section--faq .inner > .wpb-text{ margin-bottom: 2.4rem; }

@media(min-width: 768px){
    .content-section .inner[class*="wpb-bg-clr--"]:not(.w     pb-bg-clr--transparent){ --p: 4.8rem; }
    
    .content-section.content-section--images .inner .wpb-image{ max-height: 60rem; }
    .content-section.content-section--images .inner:has(.wpb-image + .wpb-image) .wpb-image{ clip-path: var(--clip-path-BottomL);  }
    .content-section.content-section--images .inner:has(.wpb-image + .wpb-image) .wpb-image:nth-child(2n){ clip-path: var(--clip-path-TopL);  }
}
@media(min-width: 992px){
    .content-section .inner[class*="wpb-bg-clr--"]:not(.wpb-bg-clr--transparent){ --p: 6.4rem; }
}

/*** ---------- Footer ---------- ***/
.wpb-footer{ margin-top: auto; }
.wpb-footer .wpb-footer__main .container{ display: grid; gap: 3.2rem; }
.wpb-footer .inner.inner--menus{ --col-width: 12.5rem; display: grid; grid-template-columns: repeat(auto-fit, minmax(var(--col-width), 1fr)); gap: 4.8rem; }
.wpb-footer ul.wpb-menu-column li a{ color: var(--clr-dark); }


.wpb-footer .wpb-footer__main { --p: 3.2rem; padding: var(--p) 0; }

.wpb-footer .wpb-footer__bottom { --clr-text: rgb(var(--clr-dark-rgb), .5); display: grid; --p: 2rem; padding: var(--p) 0; }
.wpb-footer .wpb-footer__bottom .container { display: flex; flex-direction: column; justify-content: space-between; align-items: center; column-gap: 2rem; row-gap: 2rem; }
.wpb-footer .wpb-footer__bottom .wpb-footer__sub-links { --fs: 1.2rem; font-size: var(--fs); text-align: center;  display: flex; flex-wrap: wrap; column-gap: 1.6rem;  }
.wpb-footer .wpb-footer__bottom .wpb-footer__sub-links * { font-weight: 500; color: var(--clr-text); display: flex; column-gap: 1.6rem; text-decoration: none; transition: color var(--ts-duration) var(--ts-function); }
.wpb-footer .wpb-footer__bottom .wpb-footer__sub-links *:hover{ color: var(--clr-primary); }
.wpb-footer .wpb-footer__bottom .wpb-footer__sub-links * + *::before { content: '|'; color: var(--clr-text) !important; }

.wpb-footer .wpb-footer__bottom .wpb-footer__logo{ display: flex; align-items: center; column-gap: 3.2rem; row-gap: 1.2rem; color: var(--clr-text); font-size: 1.2rem; font-weight: 500; }
.wpb-footer .wpb-footer__bottom .wpb-footer__logo .logo img{ width: 10rem; height: auto; }

.wpb-footer .wpb-footer__credit-links{ display: flex; align-items: center; gap: 1.4rem; flex-wrap: wrap; }
.wpb-footer .wpb-footer__credit-links > a { display: flex; align-items: center; gap: .4rem; text-decoration: none; transition: opacity var(--ts-duration) var(--ts-function); }
.wpb-footer .wpb-footer__credit-links > a span { font-size: 1.2rem; color: var(--clr-text); font-weight: 500; line-height: 1; }
.wpb-footer .wpb-footer__credit-links > a img { height: 2.2rem; width: auto; }
.wpb-footer .wpb-footer__credit-links > a:hover{ opacity: .7; }

.wpb-footer .wpb-footer__asset{ 
    --animation-src: var(--bg-asset--wide--animate); --w: 100%; --h: 25rem; position: relative; background-image: var(--bg-asset--wide); background-size: cover; background-position: bottom; 
    background-repeat: no-repeat; margin: var(--block-offset); margin-top: 6rem; height: var(--h); width: calc(100% - var(--block-offset) - var(--block-offset));
}
.wpb-footer .wpb-footer__asset::before{ 
    --animation: bg-asset-animate 5s infinite; content: ''; background-image: var(--animation-src); background-size: cover; background-position: bottom; 
    background-repeat: no-repeat; width: var(--w); height: var(--h); position: absolute; filter: invert(1); animation: var(--animation);
}

@media (max-width: 449.98px) {
    ul.wpb-menu-column:nth-child(1){ order: 1; }
    ul.wpb-menu-column:nth-child(2){ order: 0; grid-column: span 2; }
    ul.wpb-menu-column:nth-child(3){ order: 3; }
    ul.wpb-menu-column:nth-child(4){ order: 2; }
}
@media (min-width: 500px) {
    .wpb-footer .inner.inner--menus{ --col-width: 20rem; }
}
@media (min-width: 768px) {
    .wpb-footer .inner.inner--menus{ --col-width: 25rem; }
    .wpb-footer .wpb-footer__bottom .container { flex-direction: row; }
    .wpb-footer .wpb-footer__main { --p: 6.4rem; }

    .wpb-footer .wpb-footer__asset{ --h: 40rem; }
}
@media (min-width: 992px) {
    .wpb-footer .wpb-footer__main .container{ gap: 4.8rem; }
}
@media (min-width: 1200px) {
    .wpb-footer .wpb-footer__main { --p: 8rem; }
}

/* Component assets */
.wpb-angle-asset{ --w: 20rem; --h: 8rem; background-image: var(--nexpact-angle); background-size: cover; background-repeat: no-repeat; width: var(--w); min-width: var(--h); height: var(--h); }

/* Block background asset */
.wpb-bg-assets{ position: absolute; top: 0; right: 0; bottom: 0; left: 0; overflow: hidden; pointer-events: none; opacity: .7; }
*:has(> .wpb-bg-assets){ position: relative; }
*:has(> .wpb-bg-assets) > *:not(.wpb-bg-assets, .is-background-asset){ position: relative; z-index: 3; }

.wpb-bg-assets .wpb-bg-asset { 
    --src: var(--bg-asset); --w: 35rem; --h: 35rem; --top: auto; --right: 0; --bottom: 0; --left: auto; background-image: var(--src); background-size: cover; width: var(--w); height: var(--h); position: absolute; 
    top: var(--top); right: var(--right); bottom: var(--bottom); left: var(--left);
}
.wpb-bg-assets .wpb-bg-asset.wpb-bg-asset--small{ --src: var(--bg-asset--small); }
.wpb-bg-assets .wpb-bg-asset.wpb-bg-asset--shape{ --src: var(--bg-asset--shape); --w: 22rem; --h: 22rem; }

/* Geanimeerde asset -> */
.wpb-bg-assets .wpb-bg-asset.wpb-bg-asset--wide{ --src: var(--bg-asset--wide); --animation-src: var(--bg-asset--wide--animate); --w: 100%; }
.wpb-bg-assets .wpb-bg-asset.wpb-bg-asset--wide::before{ --animation: bg-asset-animate 5s infinite; content: ''; background-image: var(--animation-src); background-size: cover; width: var(--w); height: var(--h); position: absolute; animation: var(--animation); }

:is(.has-background-asset, .wpb-bg-clr--dark, .wpb-bg-clr--secondary, .--is-dark-bg) .wpb-bg-assets .wpb-bg-asset{ filter: invert(1); }
:is(.has-background-asset, .wpb-bg-clr--dark, .wpb-bg-clr--secondary, .--is-dark-bg) .wpb-bg-assets .wpb-bg-asset::before{ filter: invert(1); }


/* Animatie keyframes */
@keyframes bg-asset-animate {
    0%, 50%, 100%{
        opacity: 0;
    }
    25%, 75%{
        opacity: 1; 
    }
}

@media(min-width: 768px){
    .wpb-bg-assets{ opacity: 1; }
}