/*** ---------- Cards ----------  ***/
.card-container { container: card-container / inline-size; 
    .wpb-card { height: 100%; }
}

.wpb-card { --br: 1rem; --bg-clr: #fff; --border: 1px solid var(--clr-border); --p: 2.4rem; border-radius: var(--br); border: var(--border); background-color: var(--bg-clr); display: flex; flex-direction: column; position: relative; text-decoration: none;
    a { text-decoration: none; }
    .card-title { --fs: 2rem; display: block; text-wrap: balance; font-family: var(--font-secondary); line-height: 1.1; color: var(--clr-contrast, var(--clr-text)); font-family: var(--font-secondary); font-weight: 600; font-size: var(--fs); transition: color var(--ts-duration) var(--ts-function); }
    .card-excerpt { display: block; text-wrap: balance; color: var(--clr, var(--clr-text)); --excerpt-line-clamp: 2; display: -webkit-box; -webkit-line-clamp: var(--excerpt-line-clamp); -webkit-box-orient: vertical; overflow: hidden; }
    .card-quote { --fs: clamp(1.6rem, 1.7vw, 1.8rem); color: var(--clr-text); font-size: var(--fs); font-weight: 500; line-height: 1.7;
        &::before { content: '\201C'; font-size: var(--fs); line-height: 0; margin-left: calc(-1 * var(--fs) / 2.5); }
        &::after { content: '\201D'; }
    }
    .card-usps { --fs: 1.6rem; --gap: .5em; list-style: none; margin-top: 1em;
        li { font-size: var(--fs); line-height: 1.4; font-weight: 500; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis;
            i { margin-right: .8rem; font-size: .8em; color: var(--clr-primary); }
            + li { margin-top: var(--gap); }
        }
    }
    .card-contact-buttons { --size: 4rem; --fs: 1.3rem; --bg-clr: #FFFF; --clr: var(--clr-primary); --border: 1px solid transparent; --hover-bg-clr: var(--clr-primary); --hover-clr: #FFFF; --hover-border: 1px solid var(--hover-bg-clr); display: flex; align-items: center; gap: .8rem; flex-wrap: wrap; 
        a { display: inline-grid; place-items: center; width: var(--size); height: var(--size); min-width: var(--size); border-radius: 50%; background-color: var(--bg-clr); color: var(--clr); border: var(--border); font-size: var(--fs); text-decoration: none; transition: background-color var(--ts-duration) var(--ts-function), color var(--ts-duration) var(--ts-function), border var(--ts-duration) var(--ts-function);
            &:hover { background-color: var(--hover-bg-clr); color: var(--hover-clr); border: var(--hover-border); }        
        }
    }

    .wpb-card__header { display: flex; overflow: hidden; 
        .badge-group { position: absolute; top: 0; right: 0; left: 0; padding: var(--p); }
        img { width: 100%; height: auto; }

        &.wpb-card__header--ratio { --ratio: 75%; position: relative; overflow: hidden; z-index: 1;
            &::before { content: ''; display: block; width: 100%; padding-top: var(--ratio); }
            > img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; z-index: -1; }
        }
        &.wpb-card__header--scale { overflow: hidden;
            img { transition: transform var(--ts-duration) var(--ts-function); }
        }
        &.wpb-card__header--absolute { position: absolute; top: 0; right: 0; bottom: 0; left: 0; width: 100%; height: 100%; z-index: -1; border-radius: var(--br); overflow: hidden;
            img { width: 100%; height: 100%; object-fit: cover; }
            &::after { content: ''; display: block; position: absolute; top: 0; right: 0; bottom: 0; left: 0; width: 100%; height: 100%; background: linear-gradient(180deg, rgba(0, 0, 0, 0) 33.33%, rgba(0, 0, 0, .8) 100%); }
        }
        &.wpb-card__header--overlap { --overlap: 6rem; --mask-direction: to bottom; --mask-start: 0%; --mask-end: 100%; position: relative; z-index: -1; margin-bottom: calc(var(--overlap) * -1);
            img { mask-image: linear-gradient(var(--mask-direction), rgba(0, 0, 0, 1) var(--mask-start), rgba(0, 0, 0, 0) var(--mask-end)); }
        }
    }
    .wpb-card__body { padding: var(--p); -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; }
    .wpb-card__footer  { padding: var(--p); padding-top: 0; }

    .wpb-card__text { --mt: 1em; 
        > * + * { margin-top: var(--mt); }
    }
    .wpb-card__asset { pointer-events: none; }
    .wpb-card__video { position: absolute; top: 0; right: 0; bottom: 0; left: 0; width: 100%; height: 100%; object-fit: cover; opacity: 0; transition: opacity var(--ts-duration) var(--ts-function); 
        .wpb-card:has(&):hover & { opacity: 1; }
    }

    > *:first-child { border-top-left-radius: var(--br); border-top-right-radius: var(--br); 
        img { border-top-left-radius: var(--br); border-top-right-radius: var(--br); } 
    }
    > *:last-child { border-bottom-left-radius: var(--br); border-bottom-right-radius: var(--br); }

    &:hover .wpb-card__header--scale {  
        img { transform: scale(1.1); }
    }

    &:has(.wpb-card__header--absolute) { --border: none; z-index: 1; color: #fff; min-height: 19.5rem; justify-content: end;
        .wpb-card__body { flex-grow: 0; }
        .card-title { color: #fff; }
    }

    &:has(.wpb-card__header--overlap) { z-index: 1; }

    /* Card variations */
    &.wpb-card--simple { --border: none; --bg-clr: var(--clr-light);
        .wpb-card__body { padding-bottom: 1rem; 
            .card-title { --fs: clamp(1.8rem, 1.8vw, 2rem); }
            .wpb-card__text { --mt: .5em; 
                p { line-height: 1.4; }
            }
        }
        .wpb-card__footer .btn { width: 100%; }
    
        .wpb-bg-clr--light & { --bg-clr: #FFFF; }
    }

    &.wpb-card--blurb { --inner-p: clamp(1.2rem, 2vw, 2.4rem); --border: none; --bg-clr: var(--clr-dark); --card-clr: #FFFF; transition: background-color var(--ts-duration) ease;
        .wpb-card__header { --ratio: 70%;
            img{ object-position: var(--position, center); transform-origin: center; }
        }
        .wpb-card__body {
            .card-title { --fs: clamp(1.8rem, 1.8vw, 3.2rem); color: var(--card-clr); }
            .card-excerpt { color: var(--card-clr); padding-top: 1.2rem; }
        }
        .wpb-card__footer {
            hr { border: none; border-top: 1px solid var(--card-clr); opacity: .5; }
            .btn--link { --clr: var(--card-clr); --hover-clr: var(--card-clr); --icon-clr: var(--card-clr); --hover-icon-clr: var(--card-clr); padding-top: var(--inner-p);
                span { white-space: nowrap; text-overflow: ellipsis; min-width: 0; overflow: hidden; line-height: 1.4; }
                i { margin-bottom: .2rem; }
            }
        }
        &:has(.btn--link):hover { --bg-clr: var(--clr-primary); }
    }

    &.wpb-card--sector { --inner-p: clamp(1.2rem, 2vw, 2.4rem); --border: none; --bg-clr: var(--clr-light); display: grid; grid-template-columns: min(clamp(9rem, 24vw, 30.7rem), 40%) minmax(0, 1fr);
        .wpb-card__header { grid-row: span 2; border-top-right-radius: 0; border-bottom-left-radius: var(--br); overflow: hidden;
            img { transition: transform var(--ts-duration) ease; border-radius: 0; }
        }
        .wpb-card__body { padding-bottom: var(--inner-p);
            .card-title { --fs: clamp(1.8rem, 1.8vw, 3.2rem); transition: color var(--ts-duration) ease; }
            .card-excerpt { --excerpt-line-clamp: 3; padding-top: 1.2rem; }
        }
        .wpb-card__footer {
            hr { border: none; border-top: 1px solid var(--clr-border); }
            .btn--link { --hover-clr: var(--clr-primary); --hover-icon-clr: var(--hover-clr); padding-top: var(--inner-p); }
        }

        .wpb-bg-clr--light & { --bg-clr: #FFFF; }

        &:hover { 
            .wpb-card__header img{ transform: scale(1.1); }
            .wpb-card__body .card-title { color: var(--clr-primary); }
        }
    }

    &.wpb-card--service { --inner-p: clamp(1.2rem, 2vw, 2.4rem); --border: none; --bg-clr: var(--clr-light);
        .wpb-card__header { --ratio: 57%;
            img { transition: transform var(--ts-duration) ease; }
        }
        .wpb-card__body { padding-bottom: var(--inner-p);
            .card-title { --fs: clamp(1.8rem, 1.8vw, 3.2rem); }
            .card-excerpt { --excerpt-line-clamp: 3; padding-top: 1.2rem; }
        }
        .wpb-card__footer {
            hr { border: none; border-top: 1px solid var(--clr-border); }
            .btn--link { --hover-clr: var(--clr-primary); --hover-icon-clr: var(--hover-clr); padding-top: var(--inner-p); }
        }

        .wpb-bg-clr--light & { --bg-clr: #FFFF; }

        &:hover {
            .wpb-card__header img { transform: scale(1.1); }
            .wpb-card__body .card-title { color: var(--clr-primary); }
        }
    }

    &.wpb-card--blog { --inner-p: clamp(1.2rem, 2vw, 2.4rem); --border: none; --bg-clr: var(--clr-light);
        .wpb-card__header { --ratio: 54%;
            img { transition: transform var(--ts-duration) ease; }
        }
        .wpb-card__body {
            .wpb-subtitle { --fs: clamp(1.4rem, 1.5vw, 1.6rem); }
            .card-title { --fs: clamp(1.8rem, 2vw, 2.4rem); line-height: 1.3; }
        }
        .wpb-card__footer { margin-top: auto; 
            hr { border: none; border-top: 1px solid var(--clr-border); }
            .btn-group { justify-content: space-between; padding-top: var(--inner-p); }
            .wpb-user { --bg-clr: #FFFF; --profile-size: 3.2rem; }
        }
        .wpb-bg-clr--light & { --bg-clr: #FFFF; 
            .wpb-card__footer .wpb-user { --bg-clr: var(--clr-light); }
        }

        &:hover { 
            .wpb-card__header img{ transform: scale(1.1); }
            .wpb-card__footer .btn { --clr: var(--clr-primary); --clr-icon: var(--clr-primary); }
        }
    }

    &.wpb-card--blog-short { --bg-clr: transparent; --br: 0; --p: clamp(1.8rem, 2vw, 2.4rem); border: none; border-bottom: var(--border); flex-direction: row; align-items: center; padding-bottom: var(--p); gap: clamp(1.2rem, 1.6vw, 2rem);
        .wpb-card__header { --size: clamp(8rem, 9vw, 10rem); width: var(--size); min-width: var(--size); height: var(--size); border-radius: 1rem; overflow: hidden;
            img { width: 100%; height: 100%; object-fit: cover; transition: transform var(--ts-duration) ease; }
        }
        .wpb-card__body { padding: 0; 
            .wpb-subtitle { --fs: clamp(1.4rem, 1.4vw, 1.6rem); }
            .card-title{ --fs: clamp(1.6rem, 1.8vw, 2rem); --excerpt-line-clamp: 2; line-height: 1.25; display: -webkit-box; -webkit-line-clamp: var(--excerpt-line-clamp); -webkit-box-orient: vertical; overflow: hidden; }
        }
        &:hover {  
            .wpb-card__header img{ transform: scale(1.1); }
        }
    }

    &.wpb-card--case { --inner-p: clamp(1.2rem, 2vw, 2.4rem); --border: none; --bg-clr: var(--clr-dark); --card-clr: #FFFF;
        .wpb-card__header { --ratio: 56%;
            img { transition: transform var(--ts-duration) ease; }
            .badge-group { padding: clamp(1.2rem, 1.2vw, 2.8rem); z-index: 2; }
            .wpb-play-button { --size: clamp(3.2rem, 4vw, 5rem); --icon-size: 1.2rem; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); z-index: 2; transition: transform var(--ts-duration) var(--ts-function), opacity var(--ts-duration) ease; }
        }
        .wpb-card__body {
            .wpb-subtitle { --fs: clamp(1.4rem, 1.5vw, 1.6rem); --clr-subtitle: var(--clr-primary-60); margin-bottom: .8rem; }
            .card-title { --fs: clamp(2rem, 2.4vw, 3.2rem); line-height: 1.1; color: var(--card-clr); }
        }
        .wpb-card__footer { margin-top: auto; 
            hr { border: none; border-top: 1px solid rgba(255, 255, 255, 0.25); }
            .btn { --clr: var(--card-clr); --clr-icon: var(--clr-primary-60); --hover-clr: var(--clr-primary-60); padding-top: var(--inner-p); width: 100%; }
        }

        &.wpb-card--case--outline { --bg-clr: #FFFF; --border: 1px solid var(--clr-border); --card-clr: var(--clr-text);
            .wpb-card__body {
                .wpb-subtitle { --clr-subtitle: var(--clr-primary); }
                .card-title { --fs: clamp(1.8rem, 2vw, 2.4rem); line-height: 1.3; }
            }
            .wpb-card__footer {
                hr{ border-top: 1px solid var(--clr-border); }
                .btn { --clr-icon: var(--clr-primary); --hover-clr: var(--clr-primary); }
            }
            .wpb-bg-clr--light & { --border: none; }
        }
        &.wpb-card--case--quote{ transition: border var(--ts-duration) ease, background-color var(--ts-duration) ease;
            .card-case-quote { max-width: clamp(40rem, 50vw, 60rem);
                .card-case-quote__logo { --w: min(12.5rem, 100%); --br: 0; width: var(--w); height: auto; max-height: 5.6rem; display: flex; margin-bottom: clamp(1.8rem, 2.2vw, 2.8rem); 
                    img { width: 100%; height: auto; object-fit: contain; object-position: left; }
                }
                .card-case-quote__quote { --fs: clamp(2rem, 2.4vw, 3.6rem); color: var(--clr-text); font-size: var(--fs); font-weight: 600; line-height: 1.1;
                    &::before { content: '\201C'; font-size: var(--fs); line-height: 0; margin-left: calc(-1 * var(--fs) / 2.5); }
                    &::after { content: '\201D'; }

                    &:has(+ .wpb-featured-case__quote-author) { padding-bottom: clamp(1.6rem, 2.4vw, 3.2rem); }
                }
                .card-case-quote__author { --fs: clamp(1.4rem, 1.5vw, 1.6rem); --fs-title: clamp(1.8rem, 1.8vw, 2rem); color: var(--clr-text); line-height: 1.3; margin-top: clamp(1.8rem, 2.2vw, 2.8rem);
                    p { font-size: var(--fs); 
                        strong { font-size: var(--fs-title); font-weight: 600; }
                    }
                }
            }

            .wpb-card__body{ margin-top: auto; flex-grow: 0; 
                .wpb-subtitle { --fs: clamp(1.6rem, 1.6vw, 1.8rem); }
                .card-title { --fs: clamp(2rem, 2.4vw, 3.6rem); line-height: 1.3; }
            }
            .wpb-card__footer { margin-top: 0; }

            &:hover { --border: 1px solid rgb(var(--clr-dark-rgb), .25); 
                .wpb-bg-clr--light & { --border: none; --bg-clr: var(--clr-beige); }
            }
        }

        &:hover { 
            .wpb-card__header {
                img{ transform: scale(1.1); }
                .wpb-play-button { transform: translate(-50%, -50%) scale(0); opacity: 0; }
            }
            .wpb-card__footer .btn { --clr: var(--clr-primary); --clr-icon: var(--clr-primary); }
        }
    }

    &.wpb-card--quote { --bg-clr: var(--clr-light); --border: none; --p: clamp(1.8rem, 2.6vw, 3.2rem) clamp(2rem, 3vw, 4rem) clamp(2rem, 3vw, 4rem) clamp(2rem, 3vw, 4rem); overflow: hidden;
        .wpb-card__body { position: relative; z-index: 3;
            .wpb-subtitle { --fs: 1.6rem; margin-bottom: clamp(1.2rem, 1.4vw, 1.6rem); }
            .wpb-user { --profile-size: 4.2rem; --title-fs: var(--fs); --bg-clr: #FFFF; margin-top: 1.6rem;
                .wpb-user__description { gap: .1em; }
            }
        }
        .wpb-card__asset { position: absolute; top: -10rem; right: -10rem; bottom: 0; width: auto; height: 100%; z-index: 2;
            i { --w: 34rem; opacity: 1; }
        }
    }

    &.wpb-card--cta-graphic { --inner-p: 2.4rem; --border: none; --bg-clr: var(--clr-dark); --card-clr: #FFFF; overflow: hidden;
        .wpb-card__header { margin-top: -16rem; transform: rotate(25deg) translateX(7rem); --graphic-width: clamp(40rem, 48vw, 54rem); overflow: hidden; position: relative; overflow: visible;
            img { z-index: 3; width: var(--graphic-width); height: auto; object-fit: contain; object-position: center; transform: translateX(-5%); transition: transform var(--ts-duration) var(--ts-function); }
            .wpb-asset--droplet { --transform: none; --w: calc(var(--graphic-width) * 1.5); position: absolute; top: 0; left: -50%; z-index: 2; transform: rotate(-25deg); transition: transform var(--ts-duration) var(--ts-function), opacity var(--ts-duration) var(--ts-function); }
        }
        .wpb-card__body { flex-grow: 0; margin-top: auto; padding: var(--inner-p) var(--p) var(--p) var(--p);
            .wpb-card__text { --fs-h3: clamp(2.4rem, 2.8vw, 3.2rem);
                * { color: var(--card-clr); }
            }
            .btn--white { --hover-bg-clr: var(--clr-primary); --hover-clr: #FFFF; margin-top: var(--inner-p); }
        }
        &:hover .wpb-card__header {  
            img { transform: translateX(-5%) translateY(5%); }
            .wpb-asset--droplet { transform: rotate(-25deg) scale(1.2) translateY(-5%); opacity: .8; }
        }
    }

    &.wpb-card--work-at-elpress { --inner-p: clamp(1.2rem, 2vw, 2.4rem); --border: none; --bg-clr: var(--clr-light); overflow: hidden;
        .wpb-card__header { padding: var(--p); padding-bottom: clamp(2rem, 3vw, 4rem); }
        .wpb-card__body{ padding-bottom: var(--inner-p); padding-top: 0; }
        .wpb-card__footer { margin-top: auto; 
            hr { border: none; border-top: 1px solid var(--clr-border); }
            .btn--link { justify-content: space-between; padding-top: clamp(2rem, 2.4vw, 3.2rem); }
        }
        .wpb-card__asset { position: absolute; top: -10rem; right: -16rem; bottom: 0; width: auto; height: 100%; z-index: 2;
            i { --w: 30rem; opacity: 1; }
        }
        
        .wpb-bg-clr--light & { --bg-clr: #FFFF; }

        &:hover { 
            .wpb-card__footer .btn { --clr: var(--clr-primary); --clr-icon: var(--clr-primary); }
        }

        &.wpb-card--dark { --bg-clr: var(--clr-dark); --card-clr: #FFFF; 
            *:not(.wpb-statistic strong, .btn, .btn *) { color: var(--card-clr); } 
            .wpb-card__footer { 
                hr { border-top: 1px solid rgba(255, 255, 255, 0.2); }
                .btn--link { --clr: var(--card-clr); --clr-icon: var(--card-clr); --hover-clr: var(--clr-primary-60); --hover-icon-clr: var(--hover-clr); }
            }
            .wpb-card__asset i { --clr: rgb(var(--clr-primary-rgb), .3); }
        }
    }

    &.wpb-card--orientation-meeting { --bg-clr: transparent; --card-clr: var(--clr-text);
        .card-title { font-size: clamp(1.8rem, 1.8vw, 2rem); font-weight: 600; color: var(--card-clr); } 
        .wpb-user { --profile-size: 4.8rem; --bg-clr: var(--clr-primary-10); }

        .wpb-card__body { display: flex; align-items: center; gap: 2rem; padding-bottom: 2rem; 
            .wpb-card__text { max-width: 20rem;
                .card-description { margin-top: .5em; line-height: 1.2; }
            }
        }

        .wpb-quiz & { --bg-clr: transparent; --card-clr: #FFFF; --border: 1px solid rgba(255, 255, 255, 0.2); }
        .wpb-product-summary & { border: none; border-top: 1px solid var(--clr-border); border-radius: 0;
            .wpb-card__body { padding-inline: 0; padding-bottom: 0; }
            .wpb-card__footer { padding: 0; padding-top: 2rem; }
            .card-title { color: var(--clr-text); }
        }

        .wpb-bg-clr--light & { --bg-clr: #FFFF; --border: none; 
            .wpb-user { --bg-clr: var(--clr-light); }
        }

        &:hover .btn.btn--link { --clr: var(--clr-primary); }
    }

    &.wpb-card--hygiene-scan { --p: 3.2rem; --border: none; --bg-clr: var(--clr-dark); --card-clr: #FFFF;
        .wpb-card__header { --ratio: 63%; max-height: 20.6rem; }
        .wpb-card__body { padding-bottom: 1.2rem; flex-grow: 0; margin-top: auto; 
            .wpb-card__text * { color: var(--card-clr); }
        }
        .card-title { font-size: 3.2rem; }
    }

    &.wpb-card--usp { --border: none;
        .wpb-card__body {
            i { color: var(--clr-primary) }
            > * + * { margin-top: .5em; }
        }

        .wpb-bg-clr--transparent & { background-color: var(--clr-secondary); }
    }

    &.wpb-card--interactive-map { --border: none; --bg-clr: var(--clr-light); overflow: hidden;
        .wpb-card__header { padding: var(--p); padding-bottom: 0; z-index: 1; }
        .wpb-card__map { --top-offset: 5rem; flex-grow: 1; width: 100%; overflow: hidden; margin-top: calc(var(--top-offset) * -1);
            .wpb-locations-map { --min-height: clamp(32rem, 50vw, 48rem); --bottom-offset: 8rem; min-height: var(--min-height); height: 100%; width: 100%;
                mask-image: linear-gradient(to bottom, transparent 0%, black var(--top-offset), black calc(100% - var(--bottom-offset)), transparent 100%);
                -webkit-mask-image: linear-gradient(to bottom, transparent 0%, black var(--top-offset), black calc(100% - var(--bottom-offset)), transparent 100%);
            }
        }
        .wpb-card__footer { padding: var(--p); padding-top: 0; flex-grow: 0; margin-top: auto;
            .wpb-card__text { color: var(--card-clr); max-width: 44rem; 
                p { --fs: clamp(1.6rem, 1.6vw, 1.8rem); }
            }
        }
    }

    &.wpb-card--statistic { --bg-clr: var(--clr-dark); --card-clr: #FFFF; min-height: 20rem; overflow: hidden;
        .wpb-card__header { padding: var(--p);
            .wpb-statistic { --title-clr: var(--card-clr); color: var(--card-clr); }
            &:has(+ .wpb-card__body) { padding-bottom: 0; }
            &:has(+ .wpb-card__asset) { margin-top: auto; } 
        }
        .wpb-card__body { padding: var(--p); flex-grow: 0; margin-top: auto;
            .wpb-card__text { color: var(--card-clr); max-width: 22rem; 
                p { --fs: clamp(1.6rem, 1.6vw, 1.8rem); }
            }
        }
        .wpb-card__asset { position: absolute; top: -10rem; right: -16rem; bottom: 0; width: auto; height: 100%; z-index: 2;
            i { --w: 30rem; opacity: 1; }
        }

        &.wpb-card--primary { --bg-clr: var(--clr-primary); }
    }

    &.wpb-card--form { --border: none; --bg-clr: var(--clr-light);
        .wpb-card__header { padding: var(--p); padding-bottom: 2.4rem; 
            h3, h2 { text-wrap: pretty; }
            & + .wpb-card__body { padding-top: 0; }
        }

        &.wpb-card--form--newsletter {
            .gform_validation_errors { --clr: var(--clr-danger); --p: 0; --bg-clr: transparent; border-radius: 0;
                * { font-weight: 600; line-height: 1.2; }
            }
            .gform_confirmation_message { --fs-val: clamp(1.6rem, 1.6vw, 1.8rem); --clr: var(--clr-success); --p: 0; --bg-clr: transparent; border-radius: 0; line-height: 1.4; }
            form { --input-height: 5.2rem; --button-width: 15.5rem; position: relative;
                .gform-body {
                    .gform_fields{ gap: 0 !important; }
                    .gfield {
                        .gfield_label { display: none; }
                        input[type="email"] { height: var(--input-height); padding-right: calc(var(--button-width) + 1.6rem); transition: opacity var(--ts-duration) ease; }
                    }
                }
                .gform-footer {
                    button[type="submit"] { --fs: clamp(1.4rem, 1.5vw, 1.6rem); --min-height: var(--input-height); position: absolute; top: 0; right: 0; border-top-left-radius: 0; border-bottom-left-radius: 0; }
                }
                .gform_footer p.form-privacy-notice { opacity: .6;
                    a { transition: color var(--ts-duration) var(--ts-function);
                        &:hover { color: var(--clr-primary); }
                    }
                }
                [id^="gform_ajax_spinner"] { position: absolute; top: calc(var(--input-height) / 2 - 1rem); left: .6rem; }
                &:has([id^="gform_ajax_spinner"]) .gform-body .gfield input[type="email"] { opacity: .5; padding-left: 4.8rem; pointer-events: none; }
            }
        }

        &.wpb-card--form--single-newsletter { --bg-clr: var(--clr-dark); --card-clr: #FFFF; --p: clamp(2rem, 2.4vw, 3.6rem);
            .wpb-card__header { padding-bottom: 1.6rem;
                h3 { --fs-h3: clamp(1.8rem, 2vw, 2.4rem); }
                .wpb-card__text * { color: var(--card-clr); }
            }
            .gform_validation_errors { padding: 0; background-color: transparent; border-radius: 0; padding-bottom: 1.2rem; color: var(--clr-danger); 
                * { font-weight: 600; line-height: 1.2; }
            }
            .gform_confirmation_message { padding: 0; background-color: transparent; border-radius: 0; padding-bottom: 1.2rem; font-size: clamp(1.6rem, 1.6vw, 1.8rem); color: var(--clr-success); font-weight: 600; line-height: 1.4; }
            form { --input-height: 4rem; --button-width: 4rem; position: relative;
                .gform-body {
                    .gform_fields{ gap: 0 !important; }
                    .gfield {
                        .gfield_label { display: none; }
                        input[type="email"] { --input-mh: var(--input-height); height: var(--input-mh); min-height: var(--input-mh); padding-right: calc(var(--button-width) + 1.6rem); }
                    }
                }
                .gform-footer {
                    button[type="submit"] { --fs: clamp(1.4rem, 1.5vw, 1.6rem); --min-height: var(--input-height); --p: 0; --br: .4rem; position: absolute; top: 0; right: 0; min-width: var(--button-width); min-height: var(--input-height); justify-content: center;
                        .btn__text { display: none; }
                    }
                }
                .gform_footer p.form-privacy-notice { opacity: .6; font-size: 1.3rem; color: var(--card-clr); }
                [id^="gform_ajax_spinner"] { --size: 1.4rem; position: absolute; top: calc(var(--input-height) / 2 - .7rem); left: .6rem; }
                &:has([id^="gform_ajax_spinner"]) .gform-body .gfield input[type="email"] { padding-left: 4rem; pointer-events: none; }
            }
        }

        .wpb-bg-clr--light & { --bg-clr: #FFFF; }
    }

    &.wpb-card--team { --border: none; --bg-clr: var(--clr-light); --p: 1.6rem; border-radius: 0; background-color: transparent;
        .wpb-card__header { --ratio: 100%; background-color: var(--bg-clr); border-radius: var(--br); 
            .card-contact-buttons { position: absolute; top: clamp(1.25rem, 1.6vw, 2rem); right: 1.25rem; z-index: 2; }
        }
        .wpb-card__body { padding: var(--p) 0 0 0; 
            .card-title { --fs: clamp(1.6rem, 1.8vw, 2.4rem); }
            .wpb-subtitle { --fs: clamp(1.4rem, 1.5vw, 1.6rem); margin-top: .2em; }
        }
    }

    &.wpb-card--team-quote { --border: none; --bg-clr: var(--clr-light); 
        .card-quote { --fs: clamp(1.6rem, 1.8vw, 2rem); }
        .wpb-card__body:has(+ .wpb-card__footer) { padding-bottom: 2rem; }
        .wpb-card__footer .wpb-user { --profile-size: 4.2rem; --bg-clr: #FFFF; }
    }

    &.wpb-card--productgroup { --border: none; --bg-clr: var(--clr-light); padding: var(--p);
        .card-title { --fs: clamp(1.6rem, 1.8vw, 2rem); }
        .badge--sku { position: absolute; top: var(--p); left: var(--p); z-index: 2; }  
        .wpb-card__header { --ratio: 80%; 
            img { object-fit: contain; }
        }
        .wpb-card__body { padding: var(--p) 0; flex-grow: 0; margin-bottom: auto; }
        .wpb-card__footer { padding: var(--p) 0 0 0; border-top: 1px solid var(--clr-border); }

        &:hover {
            .card-title { color: var(--clr-primary); }
            .btn.btn--link { --clr: var(--clr-primary); }  
        }

        &.wpb-card--productgroup-parent {
            .wpb-card__header { --ratio: 75%; margin-inline: calc(var(--p) * -1); margin-top: calc(var(--p) * -1); overflow: hidden;
                img { width: 100%; height: 100%; object-fit: cover; transition: transform var(--ts-duration) var(--ts-function); }
            }

            &:hover .wpb-card__header img { transform: scale(1.1); }
        }
    }

    &.wpb-card--productgroup-single { --p: clamp(1.8rem, 2vw, 2.4rem); --border: none; --bg-clr: var(--clr-light); padding: var(--p); flex-direction: row; align-items: center; gap: 2rem; transition: background-color var(--ts-duration) ease;
        .wpb-card__header { --size: clamp(6.4rem, 7.2vw, 9rem); width: var(--size); height: var(--size);
            img { width: 100%; height: 100%; object-fit: contain; }
        }
        .wpb-card__body { padding: 0;
            .badge--sku { --fs: 1.2rem; --p: .4rem 1rem; margin-bottom: .8rem; min-height: 2.5rem; }  
            .card-title { --fs: clamp(1.68rem, 1.8vw, 2.4rem); }
        }
        .wpb-card__footer { padding: clamp(1.2rem, 1.8vw, 2.4rem); }

        &:hover { --bg-clr: var(--clr-primary-10); }
    }
    
    &.wpb-card--download { --p: 2rem; --bg-clr: transparent; --image-size: clamp(10rem, 10vw, 14rem); --gtc: minmax(0, 1fr); padding: var(--p); display: grid; grid-template-columns: var(--gtc); gap: clamp(1.2rem, 1.4vw, 2rem);
        .wpb-card__header { --br: 0; padding: 0;
            img { width: var(--image-size); height: auto; object-fit: contain; }
        }
        .wpb-card__body { padding: 0; }
        .wpb-card__footer { padding: 0;
            .btn { width: 100%; }
        }

        .wpb-bg-clr--light & { --bg-clr: #FFFF; --border: none; }
    }

    &.wpb-card--download-section { flex-direction: row; align-items: start; padding: var(--p); gap: var(--p);
        .wpb-card__header { --w: 13.4rem; width: var(--w); min-width: var(--w); padding: 0;
            img { width: 100%; height: auto; object-fit: contain; }
        }
        .wpb-card__body { padding: 0; }
    }

    &.wpb-card--author-statement { --border: none; --bg-clr: var(--clr-light); padding: var(--p); gap: clamp(2rem, 3.2vw, 4.8rem);
        .wpb-card__header { width: 100%; 
            .wpb-user { --bg-clr: #FFFF; }
        }

        .wpb-card__text p {font-size: 1.4rem; }
        .wpb-card__text .btn--link { margin-top: 1.2rem; }

        .card-container:has(&) {
            .authority-text { padding-top: 1.6rem; opacity: .5; font-size: 1.4rem; }
        }
    }

    &.wpb-card--vacancy { --thumbnail-width: 20rem; display: grid; grid-template-columns: var(--thumbnail-width) minmax(0, 1fr) auto; align-items: center; overflow: hidden;
        .wpb-card__header { border-radius: 0; overflow: hidden; height: 100%; width: var(--thumbnail-width); min-width: var(--thumbnail-width);
            img{ object-fit: cover; border-radius: 0; transition: transform var(--ts-duration) ease; }
        }
        .wpb-card__body {
            .card-title { --fs: clamp(1.8rem, 1.8vw, 2.4rem); }
            .wpb-meta-info { padding-top: .6rem; }
        }
        .wpb-card__footer { padding: var(--p) var(--p) var(--p) 0; }

        .wpb-bg-clr--light & { --bg-clr: #FFFF; --border: none; }

        &:hover {  
            .wpb-card__header img{ transform: scale(1.1); }
        }
    }

    &.wpb-card--contact-person {  
        .wpb-card__header { display: flex; justify-content: space-between; align-items: start; gap: 2rem; padding: var(--p) var(--p) 0 var(--p); 
            .wpb-card__text { --mt: .5em; 
                h3 { --fs-h3: clamp(1.8rem, 1.8vw, 2rem); }
            }
            .wpb-user { --profile-size: 4.8rem; }
        }
        .wpb-card__body { padding: 1.6rem var(--p) var(--p) var(--p); }
    }
}

@media (max-width: 575.98px) {
    .wpb-card { --p: 1.6rem;
        .card-usps { --fs: 1.4rem; --gap: .3em; margin-top: .8em; }
        &.wpb-card--blurb { --p: clamp(2rem, 2vw, 2.4rem); display: grid; grid-template-columns: clamp(9rem, 24vw, 16rem) minmax(0, 1fr);
            .wpb-card__header { grid-row: span 2; border-top-right-radius: 0; border-bottom-left-radius: var(--br); 
                img { border-radius: 0; }
            }
            &:has(.btn--link) .wpb-card__body { padding-bottom: 1rem;
                .card-excerpt { display: none; }
            }
        }
        &.wpb-card--sector { --p: clamp(2rem, 2vw, 2.4rem);
            .wpb-card__body { padding-bottom: 1rem;
                .card-excerpt { display: none; }
            }
        }
    }
}
@media (min-width: 576px) {
    .wpb-card {
        &.wpb-card--blurb { --footer-height: calc(clamp(4rem, 4vw, 5rem) + var(--inner-p)); overflow: hidden;
            .wpb-card__header { flex-grow: 1; transition: margin-top var(--ts-duration) ease; }
            .wpb-card__body { flex-grow: 0; transition: padding-bottom var(--ts-duration) ease; }
            .wpb-card__footer { height: var(--footer-height); max-height: 0px; overflow: hidden; padding-bottom: 0; transition: max-height var(--ts-duration) ease, padding-bottom var(--ts-duration) ease; }

            &:has(.btn--link):hover {
                .wpb-card__header { margin-top: calc(-1 * var(--footer-height)); }
                .wpb-card__body:has(+ .wpb-card__footer) { padding-bottom: var(--inner-p); }
                .wpb-card__footer { max-height: var(--footer-height); padding-bottom: var(--p); }
            }
        }
    }
}

@container card-container (max-width: 20rem) {
    .wpb-card {
        &.wpb-card--usp { --p: 2rem; }
    }
}
@container card-container (max-width: 30rem) {
    .wpb-card {
        &.wpb-card--blurb { --p: 2rem; }
        &.wpb-card--blog { --p: 2rem; }
    }
}
@container card-container (max-width: 36rem) {
    .wpb-card {
        &.wpb-card--hygiene-scan { --p: 2.4rem; position: relative;
            .wpb-card__header { max-height: 100%; --mask-direction: to left; --mask-start: 50%; width: 50%; height: 100%; border-radius: 0 var(--br) var(--br) 0; position: absolute; top: 0; right: 0; bottom: 0; margin-bottom: 0;
                img { border-radius: 0 var(--br) var(--br) 0; }
                .badge-group { display: none; }
            }
            .wpb-card__footer .btn { width: auto; }
            .card-title { font-size: 2.4rem; text-wrap: balance; }
            .card-excerpt { font-size: 1.2rem; text-wrap: balance; }
        }
    }
}
@container card-container (max-width: 46rem) {
    .wpb-card {
        &.wpb-card--download-section { flex-direction: column; 
            .wpb-card__body .btn { width: 100%; }
        }
    }
}
@container card-container (max-width: 58rem) {
    .wpb-card {
        &.wpb-card--vacancy { --thumbnail-width: clamp(12rem, 18vw, 18rem); grid-template-columns: var(--thumbnail-width) minmax(0, 1fr);
            .wpb-card__header { grid-row: span 2; }
            .wpb-card__body:has(+ .wpb-card__footer) { padding-bottom: 0; }
            .wpb-card__footer { padding: 1.8rem var(--p) var(--p) var(--p); 
                .btn { width: 100%; }
            }
        }
    }
}

@container card-container (min-width: 44rem) {
    .wpb-card {
        &.wpb-card--download { --gtc: var(--image-size) minmax(0, 1fr); 
            .wpb-card__footer { grid-column: span 2;
                .btn { width: 100%; }
            }
        }
    }
}


@media (min-width: 768px) {
    @container card-container (min-width: 26rem) { 
        .wpb-card {
            &.wpb-card--statistic { --p: 3.2rem; }
            &.wpb-card--interactive-map { --p: 3.2rem; }
        }
    }
    @container card-container (min-width: 32rem) { 
        .wpb-card {
            &.wpb-card--service { --p: 3.2rem; }
            &.wpb-card--cta-graphic { --p: 3.2rem; }
            &.wpb-card--work-at-elpress { --p: 2.8rem; }
            &.wpb-card--statistic { --p: 4.8rem; }
            &.wpb-card--interactive-map { --p: 4.8rem; }
            &.wpb-card--form { --p: 3.2rem; }
            &.wpb-card--case { --p: 3.2rem; }
            &.wpb-card--author-statement { --p: 3.2rem; }
            &.wpb-card--usp { --p: 3.2rem; 
                .card-title { font-size: 2.4rem; }
            }
            &.wpb-card--team-quote { --p: 3.2rem; }
            &.wpb-card--simple { --p: 3.2rem; }
        }
    }
    @container card-container (min-width: 40rem) { 
        .wpb-card {
            &.wpb-card--blog { --p: 3.2rem; }
            &.wpb-card--blurb { --p: 3.2rem; }
            &.wpb-card--work-at-elpress { --p: 3.2rem; }
            &.wpb-card--service { --p: 4.4rem; }
            &.wpb-card--form { --p: 4.4rem; }
            &.wpb-card--hygiene-scan .wpb-card__header { max-height: 100%; }
            &.wpb-card--orientation-meeting { --p: 2.4rem; }
            &.wpb-card--productgroup { --p: 3.2rem; 
                .card-title { --fs: 2.4rem; }
                .wpb-card__body { padding-bottom: 2.4rem; }
                .wpb-card__footer { padding-top: 2.4rem; }
            }
            &.wpb-card--contact-person { --p: 3.2rem; }
        }
    }
    @container card-container (min-width: 44rem) { 
        .wpb-card {
            &.wpb-card--cta-graphic { --p: 4.4rem; 
                .wpb-card__body .wpb-card__text { padding-right: 7rem; }
            }
            &.wpb-card--author-statement { --p: 4.8rem; }
            &.wpb-card--team-quote { --p: 4.8rem; }
        }
    }
    @container card-container (min-width: 52rem) { 
        .wpb-card {
            &.wpb-card--sector { --p: 3.2rem; }
            &.wpb-card--orientation-meeting { flex-direction: row; align-items: center; gap: var(--p); padding: var(--p);
                .wpb-card__body, .wpb-card__footer{ padding: 0; }
                .wpb-card__text { text-align: start; }
                .wpb-card__footer .btn { text-wrap: balance; }
            }
            &.wpb-card--download-section { --p: 3.2rem; }
            &.wpb-card--author-statement { display: grid; grid-template-columns: auto 1fr; align-items: start; }
        }
    }
    @container card-container (min-width: 64rem) { 
        .wpb-card { 
            &.wpb-card--blog { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); column-gap: var(--gap, 0px);
                .wpb-card__header { grid-row: span 2; border-top-right-radius: 0; border-bottom-left-radius: var(--br); 
                    img { border-radius: 0; }
                }
                .wpb-card__body { padding-left: calc(var(--p) - var(--gap, 0px));
                    .card-title{ --fs: clamp(2.4rem, 2.4vw, 3.2rem); }
                }
                .wpb-card__footer { padding-left: calc(var(--p) - var(--gap, 0px)); }
            }
            &.wpb-card--service { --p: clamp(3.2rem, 3.2vw, 4.8rem); display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: var(--gap, 0px);
                .wpb-card__header { grid-row: span 2; border-top-right-radius: 0; border-bottom-left-radius: var(--br);
                    img { border-radius: 0; }
                }
            }
            &.wpb-card--hygiene-scan { flex-direction: row; align-items: center;
                .wpb-card__header { --mask-direction: to right; border-top-right-radius: 0; border-bottom-left-radius: var(--br); width: 100%; max-width: max(15%, 26.8rem); max-height: 100%; height: auto; align-self: stretch; margin-bottom: 0; margin-right: calc(var(--overlap) * -1);
                    &::before { display: none; }
                    .badge-group { display: none; }
                    img { border-radius: 0; position: absolute; top: 0; right: 0; bottom: 0; left: 0;}
                }
                .wpb-card__body { flex-grow: 1; padding: var(--p); padding-left: 0; margin-top: 0; }
                .wpb-card__footer { padding: var(--p); padding-left: 0;
                    .btn { white-space: nowrap; }
                }
            }
            &.wpb-card--download { --gtc: 14rem 1fr auto; --p: clamp(2.4rem, 2.8vw, 3.2rem) clamp(3.2rem, 3.2vw, 6rem); align-items: center;
                .wpb-card__footer { grid-column: auto; }
            }
        }
    }
}