/*** ---------- Block ---------- ***/
:is(section, header, footer) { position: relative; }
:is(section, header, footer) .container:has(.wpb-bg-assets){ z-index: 2; }
:is(section, header, footer) .wpb-bg-assets{ position: absolute; top: 0; right: 0; bottom: 0; left: 0; pointer-events: none; overflow: hidden; z-index: -1; }
:is(.wpb-block, .wpb-header, .wpb-product-content) .wpb-bg-assets{ top: -30rem; }

.wpb-bg-assets .wpb-bg-style{ 
    --w: 80rem; --h: 40rem; --top: calc(-1 * var(--h) / 10); --right: auto; --bottom: auto; --left: calc(-1 * var(--w) / 2.7); --color-1: rgba(255, 255, 255, 0); --color-2: rgba(244, 250, 242, 1); position: absolute; transform: rotate(-45deg); 
    --bg: linear-gradient(to bottom, var(--color-1) 65%, var(--color-2) 80%, var(--color-1) 80%, var(--color-2)); width: var(--w); height: var(--h); top: var(--top); right: var(--right); bottom: var(--bottom); left: var(--left); background: var(--bg); 
}
.wpb-bg-assets .wpb-bg-style.wpb-bg-style--2{ --top: calc(var(--h) / 5); --right: calc(-1 * var(--w) / 2.7); --bottom: auto; --left: auto; }
.wpb-bg-assets .wpb-bg-style.wpb-bg-style--2::before{ position: absolute; content: ''; width: var(--w); height: var(--h); background: linear-gradient(to right, #fff, #fff0 30%); }

@media (min-width: 768px) {
    .wpb-bg-assets .wpb-bg-style{ --w: 140rem; --h: 60rem; }
}

/*** ---------- Block: Text & Media ---------- ***/
.wpb-block--text-media .wpb-text .btn-group{ --mt: 4rem; }
.wpb-block--text-media ul{ --mt: 2.8rem; }

@media (min-width: 768px) {
    .wpb-block--text-media .wpb-row .wpb-image{ height: calc(100% + 4.4rem); position: relative; }
    .wpb-block--text-media .wpb-row .wpb-image > img{ position: absolute; width: 100%; height: 100%; object-fit: cover; }
    .wpb-block--text-media .wpb-row > .order-md-1{ margin-top: 4.4rem; }
    .wpb-block--text-media .wpb-row > .order-md-1:has(img){ height: calc(100% - 4.4rem); }
}

/*** ---------- Block: Media ---------- ***/
.wpb-block--media .wpb-text { margin-bottom: 2rem; }

/*** ---------- Block: Merken / Brands ---------- ***/
.wpb-block--brands .wpb-section__body { padding-top: 3.2rem; }

@media (min-width: 1200px) {
    .wpb-block--brands .wpb-section__body { padding-top: 4.7rem; }
    .wpb-block--brands .blaze-slider :is(.blaze-pagination-container, .blaze-nav-container){ display: none; }
}

/*** ---------- Block: Reviews ---------- ***/
@media (width < 768px){
    .wpb-block--reviews .wpb-section__header .container .btn{ display: none; }
}
@media (min-width: 768px){
    .wpb-block--reviews .blaze-slider .blaze-nav-container .btn{ display: none; }
}
@media (min-width: 1200px) {
    .wpb-block--reviews .blaze-slider :is(.blaze-pagination-container, .blaze-nav-container){ display: none; }
}


/*** ---------- Block: Featured single product ---------- ***/
.wpb-block--featured-single-product .wpb-characteristics{ --border: 1px solid rgba(255, 255, 255, 0.2); --p: 1.8rem; border: var(--border); width: 100%; min-width: 30rem; }
.wpb-block--featured-single-product .wpb-characteristics .wpb-characteristics__header{ border-bottom: var(--border); padding-block: .8rem; margin: 0; }
.wpb-block--featured-single-product .wpb-characteristics > *{ padding: var(--p); }

.wpb-block--featured-single-product .wpb-image{ position: relative; }
.wpb-block--featured-single-product .wpb-image:has(.wpb-person)::before{ content: ''; position: absolute; top: 0; right: 0; bottom: 0; left: 0; background: linear-gradient(to bottom, rgb(var(--clr-dark-rgb), 0) 50%, rgb(var(--clr-dark-rgb), 0.5)); pointer-events: none; }
.wpb-block--featured-single-product .wpb-image:has(.wpb-person) > img{ z-index: -1; }
.wpb-block--featured-single-product .wpb-image .wpb-person{ --offset: 2.4rem; position: absolute; left: var(--offset); bottom: var(--offset); color: #fff; }

.wpb-block--featured-single-product .btn{ margin-left: auto; }

@media (min-width: 768px) {
    .wpb-block--featured-single-product .wpb-characteristics{ width: fit-content; }
}
@media (min-width: 992px) {
    .wpb-block--featured-single-product .wpb-image .wpb-person{ --offset: 4rem; }
}

/*** ---------- Block: Featured news ---------- ***/
.wpb-block--featured-news .wpb-section__header .button-group{ display: none; }

@media (min-width: 768px) {
    .wpb-block--featured-news .wpb-section__header .button-group{ display: block; }
    .wpb-block--featured-news .blaze-slider .blaze-nav-container .button-group{ display: none; }
}
/*** ---------- Block: FAQ ---------- ***/
.wpb-block--faq { --gc: 1; }
.wpb-block--faq .container { display: grid; grid-template-columns: repeat(var(--gc), minmax(0, 1fr)); column-gap: 2rem; row-gap: 2rem; }

@media (min-width: 992px) {
    .wpb-block--faq-primary, .wpb-block--faq-secondary { --gc: 2; align-items: start; }
    .wpb-block--faq-primary .container, .wpb-block--faq-secondary .container { column-gap: 3.2rem; }
    .wpb-block--faq-primary .container .wpb-accordion { order: -1; }
}

@media (min-width: 1200px) {
    .wpb-block--faq-primary .container, .wpb-block--faq-secondary .container { column-gap: 6.4rem; }
}


/*** ---------- Block: Blurb ---------- ***/
.wpb-block--blurb .wpb-text { margin-bottom: 2rem; }
.wpb-block--blurb .wpb-card.wpb-card--blurb .wpb-card__header img { aspect-ratio: 16/9; object-fit: cover; }


/*** ---------- Block: Carousel ---------- ***/
.wpb-block--carousel .wpb-text { margin-bottom: 2rem; }
.wpb-block--carousel .wpb-image { position: relative; }
.wpb-block--carousel .wpb-image img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; }
.wpb-block--carousel .wpb-image::after { content: ''; display: block; width: 100%; padding-top: 75%; }

/*** ---------- Block: Header ---------- ***/
.wpb-header.wpb-header--search form { position: relative; }
.wpb-header.wpb-header--search form [type="submit"] { display: inline-flex; cursor: pointer; user-select: none; padding: 0.25rem 1rem; border: none; background: none; position: absolute; right: 0; top: 50%; transform: translateY(-50%); }
.wpb-header.wpb-header--search form [type="submit"] img { width: 1.5rem; }

.wpb-header .wpb-header__toolbar { display: flex; align-items: center; gap: 1.6rem; padding-bottom: 2.8rem; }
.wpb-header .wpb-header__toolbar .btn { white-space: nowrap; }
.wpb-header .wpb-header__toolbar .wpb-breadcrumbs { margin: 0; --excerpt-line-clamp: 1; display: -webkit-box; -webkit-line-clamp: var(--excerpt-line-clamp); -webkit-box-orient: vertical; overflow: hidden; }
.wpb-header .wpb-header__toolbar .wpb-breadcrumbs > span > span:not(.breadcrumb_last) { opacity: .65; }

/*** ---------- Block: Text media tabs ---------- ***/
.wpb-block--media-tabs .container > .wpb-text { margin-bottom: 2rem; }
.wpb-block--media-tabs .inner { gap: 3.2rem; align-items: center; }
.wpb-block--media-tabs .tab__images { display: grid; overflow: hidden; } 
.wpb-block--media-tabs .tab__images > figure { grid-row: 1/-1; grid-column: 1/-1; opacity: 0; transition: opacity var(--ts-15) ease; transition-delay: var(--ts-35); }
.wpb-block--media-tabs .tab__images figure.active { opacity: 1; transform: scale(1); }
.wpb-block--media-tabs .tab__images figure img { height: 100%; width: 100%; object-fit: contain; }
.wpb-block--media-tabs .tab__content { display: grid; position: relative; gap: 2rem; }
.wpb-block--media-tabs .tab__item { display: grid; align-items: center; }
.wpb-block--media-tabs .tab__item.has-icon { grid-template-columns: 6.4rem 1fr; -ms-grid-columns: 6.4rem 1fr; gap: 1.6rem; }
.wpb-block--media-tabs .tab__item .icon { background-color: var(--wpb-primary); border-radius: 50%; width: 6.4rem; height: 6.4rem; padding: 1.4rem; transition: box-shadow var(--ts-15) ease; }
.wpb-block--media-tabs .tab__item .icon img { width: 100%; height: 100%; object-fit: contain; }

@media (min-width: 992px) {
    .wpb-block--media-tabs .inner { gap: 8.2rem; }
}


/*** ---------- Block: Tabs ---------- ***/
.wpb-block--tabs .wpb-text { margin-bottom: 2rem; }



/*** ---------- Block: Featured ---------- ***/

@media (width < 768px) {
    .wpb-block--featured .wpb-section__header .container .button-group{ display: none; }
}
@media (min-width: 768px) {
    .wpb-block--featured .blaze-slider .blaze-nav-container .button-group{ display: none; }
}

/*** ---------- Block: Text Shortcode ---------- ***/
.wpb-block--text-shortcode .container { column-gap: 2rem; row-gap: 2rem; }

@media (min-width: 992px) {
    .wpb-block--text-shortcode .container { column-gap: 3.2rem; }
    .wpb-block--text-shortcode-primary .wpb-card { order: -1; }
}

@media (min-width: 1200px) {
    .wpb-block--text-shortcode .container { column-gap: 6.4rem; }
}

@media (min-width: 1200px) {
    .wpb-block--text-shortcode .container { column-gap: 9.8rem; }
}



/*** ---------- Block: Youtube embed ---------- ***/
.wpb-block--youtube .container { column-gap: 2rem; row-gap: 2rem; }
.wpb-block--youtube .wpb-ratio :is(iframe, img) { border-radius: .5rem; }
.wpb-block--youtube .wpb-ratio .youtube-play { position: absolute; top: 0; right: 0; bottom: 0; left: 0; z-index: 5; cursor: pointer; transition: opacity var(--ts-35) ease; }
.wpb-block--youtube .wpb-ratio .youtube-play img { object-fit: cover; width: 100%; height: 100%; }
.wpb-block--youtube .wpb-ratio .youtube-play .play-icon { position: absolute; top: calc(50% - 3.2rem); left: calc(50% - 3.2rem); display: grid; place-items: center; z-index: 2; background-color: var(--clr-primary); border-radius: 50%; width: 6.4rem; height: 6.4rem; transition: .25s ease; }
.wpb-block--youtube .wpb-ratio .youtube-play .play-icon i { color: rgb(255,255,255); }
.wpb-block--youtube .wpb-ratio:hover .youtube-play .play-icon { transform: scale(1.065); }

@media (min-width: 992px) {
    .wpb-block--youtube .container { column-gap: 3.2rem; }
    .wpb-block--youtube.wpb-block--youtube-primary .wpb-ratio { order: -1; }
}

@media (min-width: 1200px) {
    .wpb-block--youtube .container { column-gap: 6.4rem; }
}

@media (min-width: 1400px) {
    .wpb-block--youtube .container { column-gap: 9.8rem; }
}



/*** ---------- Block: Timeframe ---------- ***/
.wpb-block--timeframe .wpb-text { margin-bottom: 2rem; }
.wpb-block--timeframe .wpb-timeframe__content { padding: 3.2rem 0; display: -ms-grid; display: grid; overflow-x: auto; }
.wpb-block--timeframe .wpb-timeframe__content::-webkit-scrollbar { height: 1rem; }
.wpb-block--timeframe .wpb-timeframe__content::-webkit-scrollbar-track { background: #ccc; border-radius: .35rem; }
.wpb-block--timeframe .wpb-timeframe__content::-webkit-scrollbar-thumb { background: #000; border-radius: .35rem; }

.wpb-block--timeframe .wpb-timeframe__content .wpb-timeframe__grid { grid-row: 1/-1; grid-column: 1/-1; position: relative; display: grid; grid-template-columns: repeat(99, minmax(0, 1fr)); gap: 1.5rem 0; } 
.wpb-block--timeframe .wpb-timeframe__content .wpb-timeframe__grid--items { z-index: 3; margin: 2.2rem 0; }
.wpb-block--timeframe .wpb-timeframe__content .wpb-timeframe__grid--indicators { z-index: 1; }

.timeframe-item { background-color: var(--clr-primary); display: inline-block; padding: 1rem 1.5rem; border-radius: .5rem; position: relative; margin-right: .5rem; margin-left: .5rem; }
.timeframe-item.timeframe-item--primary { background-color: var(--clr-primary); }
.timeframe-item.timeframe-item--striped :is(strong, span) { color: #fff; position: relative; z-index: 2; }
.timeframe-item.timeframe-item--striped::before { content: ''; border-radius: .8rem; position: absolute; top: 0; right: 0; bottom: 0; left: 0; background: repeating-linear-gradient(-65deg, rgba(255,255,255,.1), rgba(255,255,255,.1) 1.25rem, transparent 1.25rem, transparent 2.5rem); }

.timeframe-item strong { display: block; font-size: 1.6rem; line-height: 1.4; color: #fff; }
.timeframe-item span { display: block; font-size: 1.4rem; line-height: 1.4; color: #fff;  }
.timeframe-item:first-child { margin-left: 0!important; }
.timeframe-item:last-child { margin-right: 0!important; }

.wpb-timeframe__indicator { position: relative; width: .1rem; background-color: var(--clr-border); }
.wpb-timeframe__indicator::before { content: attr(data-phase); color: var(--clr-text); position: absolute; bottom: calc(100% + 1rem); left: 50%; transform: translateX(-50%); white-space: nowrap; font-size: 1.4rem; line-height: 1.4; }
.wpb-timeframe__indicator:first-of-type::before { left: 100%; transform: none; }
.wpb-timeframe__indicator:last-of-type::before { left: auto; right: 100%; transform: none; }
