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


/*** FOR TESTING ONLY ***/
/* html {
  zoom: 0.9;
} */

:root {
    /* Font variables */
    --fs            : 1.6rem;
    --lh            : 1.6;

    --fs-h1         : clamp(3.2rem, 3vw, 5.6rem);
    --fs-h2         : clamp(2.4rem, 3vw, 3.6rem);
    --fs-h3         : clamp(2rem, 3vw, 2.4rem);

    --br-20         : 1.2rem;
    --br-30         : 1.6rem;
    --br-40         : 2rem;
    --br-100        : 2.8rem;
        
    /* Color variables */
    --clr-primary-120   : #2377AA; 

    --clr-primary-rgb   : 45, 144, 202;
    --clr-primary          : #2D90CA;
    --clr-primary-500      : #B1DFF9;
    --clr-primary-450      : #B0DFF9;
    --clr-primary-350      : #9AD0F4;
    --clr-primary-300      : #CAEAFF;
    --clr-primary-200      : #D2EDFF;
    --clr-primary-100      : #EDF5FA;
    
    --clr-secondary     : #F2962E;
    --clr-secondary-80  : #efa857;
    --clr-secondary-rgb : 242, 150, 46;

    --clr-accent        : #66C7C0;
    --clr-accent-2      : #C64763;
    
    --clr-dark-110      : #1A3E6A;
    --clr-dark-110-rgb  : 26, 62, 106;
    
    --clr-dark          : #26517D;
    --clr-dark-rgb      : 38, 81, 125;
    --clr-dark-750      : #475867;

    --clr-heading       : var(--clr-dark);
    --clr-text          : var(--clr-dark);
    
    --clr-light         : #E1F2FD;
    --clr-light-40      : #edf7fe;

    --clr-border-light  : #EEF1F5; 
    --clr-border        : #DEE5EC; 
    --clr-border-120    : #9DB1C5;
    --clr-border-dark   : var(--clr-dark);

    --clr-danger        : #e2401c;
    --clr-info          : #3d9cd2;
    --clr-success       : #1CB435;

    --gradient-primary  : linear-gradient(81deg, #30A6DD 0%, var(--clr-dark) 100%);
    --gradient-primary-2: linear-gradient(90deg, #18B6EB 0%, #3191CC 100%);
    --gradient-primary-3: linear-gradient(276deg, #1D74A6 35%, #30A6DD 137%);
    
    /* Font variables */
    --font-primary      : 'Poppins', sans-serif;

    /* Container variables */
    --container-width       : 100%;
    --container-width--sm   : 540px;
    --container-width--md   : 720px;
    --container-width--lg   : 960px;
    --container-width--xl   : 1140px;
    --container-width--xxl  : 1240px;
    --container-width--xxxl : 1396px;

    /* Trransition variables */
    --ts-duration            : var(--ts-25);
    --ts-function            : cubic-bezier(.58,.22,.2,.96);

}

@media (min-width: 768px) {
    :root {
        --fs: 1.6rem;
    }
}

@media (min-width: 1200px) {
    :root {
        --br-100: 3.6rem;
    }
}

/*** ---------- 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: 1.8rem; }
.wpb-wst--medium { --pt: 2.5rem; }
.wpb-wst--large { --pt: 6rem;
    /* &.wpb-bg-clr--light { --pt: 3.6rem; } */
}

.wpb-wsb--none { --pb: 0; }
.wpb-wsb--small { --pb: 1.8rem; }
.wpb-wsb--medium { --pb: 2.5rem; }
.wpb-wsb--large { --pb: 6rem;
    /* &.wpb-bg-clr--light { --pb: 3.6rem; } */
}

@media (min-width: 768px) {
    .wpb-wst--large { --pt: 6.4rem;
        &.wpb-bg-clr--light { --pt: 6.4rem; }
    }
    .wpb-wsb--large { --pb: 6.4rem;
        &.wpb-bg-clr--light { --pb: 6.4rem; }
    }
}

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

/*** ---------- Background colors ---------- ***/
.wpb-bg-clr--transparent { background-color: transparent; }
.wpb-bg-clr--white { background-color: #fff; }
.wpb-bg-clr--grey { background-color: #f2f2f2; }
.wpb-bg-clr--primary { background-color: var(--clr-primary); }
.wpb-bg-clr--primary-350 { background-color: var(--clr-primary-350); }
.wpb-bg-clr--primary-300 { background-color: var(--clr-primary-300); }
.wpb-bg-clr--primary-200 { background-color: var(--clr-primary-200); }
.wpb-bg-clr--primary-100 { background-color: var(--clr-primary-100); }
.wpb-bg-clr--secondary { background-color: var(--clr-secondary); }
.wpb-bg-clr--light { background-color: var(--clr-light); }
.wpb-bg-clr--dark { background-color: var(--clr-dark); }
.wpb-bg-clr--gradient { --clr-contrast: #fff; background: var(--gradient-primary); 
    .wpb-text h2 em::after { background: var(--clr-primary-500); }
}

[class*="wpb-bg-clr--"] .wpb-text :is(h1, h2, h3, h4, p, ul, ol, .wpb-social-proof, a, .wpb-breadcrumbs *):not(.wpb-card, .wpb-card *, .btn, em, h2 em){ color: var(--clr-contrast, var(--clr-text)); }
.wpb-bg-clr--gradient .wpb-accordion { --clr: #fff; --active-clr: #fff; }




/*** ---------- Animations ---------- ***/
.wpb-animation--wave {
    animation: wave-0-70 2s infinite forwards ease-in-out;
    transform-origin: 70% 70%;
    display: inline-block;
}

.wpb-animation--pulse {
    animation: pulse--noshadow 2s infinite forwards;
    transform-origin: center;
    display: inline-block;
}


.wpb-block--timeline:is(.wpb-bg-clr--white, .wpb-bg-clr--transparent) .wpb-timeline__item-body { background-color: var(--clr-light); }
.wpb-block--timeline:is(.wpb-bg-clr--white, .wpb-bg-clr--transparent) .wpb-timeline__item-body::before { background-color: var(--clr-light); }

.wpb-section__slider--multi .inner { display: grid; grid-template-columns: repeat(var(--gc, 1), minmax(0, 1fr)); padding-bottom: 4rem; }
.wpb-section__slider--multi .inner .wpb-tab-selector { width: fit-content; min-width: 24rem; margin: 0 auto; font-size: clamp(1.6rem, 1.8vw, 1.8rem); }
.wpb-section__slider--multi .inner .swiper-tools { padding-top: 0; align-content: center; margin-left: auto; }

.js-tab { display: none; opacity: 0; transition: opacity 0.3s ease-in-out; }
.js-tab.is-active { display: block; opacity: 1; }

.wpb-tab-btns { width: 100%; position: relative; border: 1px solid var(--clr-border); padding: .4rem .5rem; display: flex; flex-direction: column; flex-wrap: wrap; justify-content: start; gap: 0; border-radius: 2.7rem; }
.wpb-tab-btns .btn { width: 100%; --fs: 1.6rem; --bg-clr: transparent; --border: none; --clr: var(--clr-text); min-height: 4.4rem; --p: 0 1.6rem; }
.wpb-tab-btns .btn.is-active { --bg-clr: var(--clr-light); }

@media (min-width: 576px) {
    .wpb-tab-btns { width: fit-content; }
    .wpb-tab-btns .btn { width: fit-content; }
}

@media (min-width: 786px) {
    .wpb-tab-btns { flex-direction: row; }
}

@media (min-width: 992px) {
    .wpb-section__slider--multi .inner { --gc: 3; }
}



/*** Mobile styling ***/
@media(max-width: 575.98px) {
    .wpb-section__header, .wpb-header--archive, .single-news .wpb-header--subpage {
        .wpb-text { text-align: center; 
            .btn-group, .wpb-breadcrumbs > span { justify-content: center; }
        }
    }

    .wpb-block--references .wpb-section__header {
        &:has(+ .wpb-section__body--industry-colleagues) .wpb-text { text-align: left; }
        &:has(+ .hidden-on-mobile) .wpb-text { text-align: center; }
    }

    .wpb-block--made-for--default .wpb-section__footer { 
        .wpb-text { align-items: center; }
    }
}