/*
Theme Name:		Brühwiler
Theme URI: 		https://migagentur.ch
Version: 		1.12
Author: 		mig
Author URI: 	https://migagentur.ch
*/

@import "https://use.typekit.net/oog0xcj.css";
@import "https://fonts.googleapis.com/css2?family=Geist:wght@100..900&display=swap";
/* @import "assets/css/glightbox.css";*/


* {
    /* font-smoothing: antialiased;
    -webkit-font-smoothing: antialiased; */
}

html, body {
    position: relative;
    overflow-x: hidden;
}

body {
    --padding-left-right: 3em;
    --padding-top-bottom: 6em;
    --header-height: 7.5em;
}

body#tinymce {
    padding-top: 0 !important;
}

@media (max-width: 1200px) {
    body {
        --wp--preset--font-size--medium: 16px;
    }
}

@media (max-width: 750px) {
    body {
        --header-height: 5em;
    }
}

@media (max-width: 450px) {
    body {
        --padding-top-bottom: 2em;
        --padding-left-right: 1em;
    }
}

body:not(.home) {
    padding-top: var(--header-height);
}

*:first-child {
    margin-top: 0;
}

*:last-child {
    margin-bottom: 0;
}


h1 strong, h2 strong, h3 strong, h4 strong, h5 strong, h6 strong {
    font-weight: 750;
}

h2.has-small-font-size {
    font-size: 2.4em !important;
    line-height: 1.1 !important;
}

h4 + h4 {
    margin-top: 0.25em !important;
}


header {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 99999999;
    background: rgba(255, 255, 255, 0.05);
    padding: 0
}

header .contact {
    margin: 1em 0 2em 0 !important
}

header .contact a {
    display: inline-block !important;
    text-underline-offset: 0.25em;
    text-decoration-thickness: 0.15em;
    text-decoration-color: var(--wp--preset--color--primary);
}

.scrolled header {
    background: rgba(255, 255, 255, 1) !important;
    box-shadow: 0 0 1em rgba(0, 0, 0, 0.1);
}

    header .wp-block-group:first-child {
        padding: 0;
        position: relative;
        z-index: 99;
    }

    header .wp-block-site-logo img {
        width: var(--header-height) !important;
        height: auto;
    }

    @media (max-width: 1400px) {
        header .wp-block-site-logo {
            margin-left: var(--padding-left-right);
        }
    }

    header .header-nav-toggle {
        display: flex;
        width: 2.7em;
        height: 2.5em;
        background: url(assets/images/nav-toggle.svg) no-repeat center center;
        cursor: pointer;
    }

        @media (max-width: 1400px) {
            header .header-nav-toggle {
                position: absolute;
                right: 3em;
            }
        }

    .nav-open header .header-nav-toggle {
        background-image: url(assets/images/nav-close.svg);
    }

.overlay-nav {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: transparent;
    z-index: 9;
}   

.frontend .overlay-nav {
    transform: translateY(-100%);
    opacity: 0;
    pointer-events: none;
    transition: all 0.3s ease-out;
}

    .frontend.nav-open .overlay-nav {
        transform: translateY(0);
        opacity: 1;
        pointer-events: all;
    }

    .overlay-nav > .wp-block-group {
        height: 100%;
    }

    .overlay-nav .wp-block-columns {
        display: flex;
        flex-flow: row wrap;
        gap: 0;
        max-width: 33em;
        height: 100%;
        margin-right: 0 !important;
    }

    
    .overlay-nav .wp-block-columns::after {
        content: "";
        position: absolute;
        top: 0;
        left: 100%;
        width: 50vw;
        height: 100%;
        background: var(--wp--preset--color--background);
        z-index: 0;
    }


    .overlay-nav .wp-block-columns > .wp-block-column {
        padding-top: var(--header-height) ;
        overflow: hidden;
    }

    .overlay-nav .wp-block-columns > .wp-block-column:first-child {
        padding-left: 1.75em !important;
        padding-right: 1.75em !important;
        display: flex;
        flex-flow: column;
        justify-content: flex-end !important;
    }

    @media (max-width: 781px) {
        .overlay-nav .wp-block-columns > .wp-block-column:first-child {
            display: none
        }
    }

    .overlay-nav .wp-block-columns > .wp-block-column:first-child figure {
        transform: translateX(-15%) translateY(5%);
        margin-left: -1.75em;
    }


    .overlay-nav .wp-block-columns > .wp-block-column:last-child {
        padding-left: 1em !important;
        padding-right: 0 !important;
        padding-bottom: 10em !important;
        display: flex;
        flex-flow: column;
        justify-content: center !important;
    }

    @media (max-width: 1400px) {
        .overlay-nav .wp-block-columns > .wp-block-column:last-child {
            padding-left: 1em !important;
            padding-right: 3em !important;
        }
    }

    .overlay-nav .wp-block-columns > .wp-block-column:last-child > .wp-block-social-links {
        position: absolute;
        bottom: 6em;
        right: 0;
    }

    @media (max-width: 1400px) {
        .overlay-nav .wp-block-columns > .wp-block-column:last-child > .wp-block-social-links {
            bottom: 2em;
            right: 2em;
        }
    }

    .overlay-nav .wp-block-columns > .wp-block-column:last-child nav {
        font-size: 2em;
        line-height: 1.1;
    }

    .overlay-nav .wp-block-columns > .wp-block-column:last-child nav li + li {
        margin-top: 0.5em !important;
        display: block
    }


.entry-content {
    margin-top: 0 !important;
}

.entry-content > .wp-block-group.has-background {
    padding: var(--padding-top-bottom) var(--padding-left-right);
}


.entry-content > .wp-block-group.has-background-background-color + .wp-block-group.has-background-background-color {
    margin-top: calc(var(--padding-top-bottom) * -0.5) !important;
}

    @media (max-width: 600px) {
        .entry-content > .wp-block-group.has-background-background-color + .wp-block-group.has-background-background-color {
            margin-top: calc(var(--padding-top-bottom) * -1) !important;
        }
    }

.entry-content > .wp-block-group + .wp-block-group,
.entry-content > .wp-block-cover + .wp-block-group,
.entry-content > .wp-block-group + .wp-block-cover {
    margin-top: 0 !important;
}

@media (max-width: 750px) {
    .wp-block-cover[style*="100vh"] {
        min-height: 50vh !important;
    }
}

.wp-block-button.is-style-link .wp-block-button__link {
    font-size: 1.2em;
    font-weight: 750;
    line-height: 1.1;
    padding: 0 0 0.25em 0;
    background: none !important;
    border-radius: 0;
    border: 0;
    border-bottom: 3px solid var(--wp--preset--color--primary);
    text-align: left;
    color: inherit !important;
}

.wp-block-button.is-style-link .wp-block-button__link.has-background-background-color {
    border-bottom-color: var(--wp--preset--color--background) !important;
}

.wp-block-button.is-style-link.is-active .wp-block-button__link {
    background: var(--wp--preset--color--primary) !important;
    color: #fff !important;
}

.wp-block-button.is-style-outline a {
    border-radius: 0 !important;
    text-transform: uppercase !important;
    padding: 0.5em 2.5em !important;
    font-weight: 400 !important;
    font-family: var(--wp--preset--font-family--headlines) !important;
    transition: all 0.2s ease-out !important;
}

.wp-block-button.is-style-outline a:hover {
    background: var(--wp--preset--color--background) !important;
    color: var(--wp--preset--color--primary) !important;
}

.hover-boxes {
    display: flex;
    flex-flow: row wrap;
    --gap: 3em;
    gap: var(--gap);
}

    @media (max-width: 1500px) {
        .hover-boxes {
            --gap: 1em;
        }
    }

    .hover-boxes > .wp-block-cover {
        width: 100%;
        padding: 2em;
        aspect-ratio: 1/1;
        cursor: pointer;
    }

    @media (min-width: 750px) {
        .hover-boxes > .wp-block-cover {
            width: calc(50% - calc(var(--gap) * 0.5));
            padding: 2em;
            aspect-ratio: 1/1;
        }
    }

    @media (min-width: 1200px) {
        .hover-boxes > .wp-block-cover {
            width: calc(33.33333333333333% - calc(var(--gap) * 0.667));
            padding: 2em;
            aspect-ratio: 1/1;
        }
    }

    .is-root-container .hover-boxes > .wp-block-cover {
        aspect-ratio: unset !important;
    }

    .hover-boxes > .wp-block-cover .wp-block-cover__inner-container {
        display: flex;
        flex-flow: column;
        justify-content: space-between;
        height: 100%;
        text-align: left;
        position: relative;
        z-index: 2;
        width: 100% !important;
    }

    .hover-boxes > .wp-block-cover .wp-block-cover__inner-container:before {
        content: "";
        position: absolute;
        top: -2em;
        left: -2em;
        width: calc(100% + 4em);
        height: calc(100% + 4em);
        background: var(--wp--preset--color--primary);
        z-index: 1;
        transform-origin: top;
        transform: scaleY(0);
        transition: transform 0.3s ease-in-out;
    }

    .hover-boxes > .wp-block-cover:hover .wp-block-cover__inner-container:before {
        transform: scaleY(1);
    }

    .hover-boxes > .wp-block-cover .wp-block-cover__inner-container > * {
        margin-left: 0 !important;
        width: 100%;
        position: relative;
        z-index: 9;
    }

    .hover-boxes .wp-block-buttons {
        margin-top: 2em
    }

    .frontend .hover-boxes .hover-text { 
        opacity: 0;
        pointer-events: none;
        transition: opacity 0.2s ease-in-out;
        position: absolute;
        bottom: 3.5em;
        width: 100%;
    }
    .frontend .hover-boxes .default-text { 
        opacity: 1;
        pointer-events: all;
        transition: opacity 0.2s ease-in-out;
        position: absolute;
        bottom: 3.5em;
        width: 100%;
    }

    .frontend .hover-boxes > .wp-block-cover:hover .hover-text { opacity: 1; pointer-events: all; }
    .frontend .hover-boxes > .wp-block-cover:hover .default-text { opacity: 0; pointer-events: none; }

    .hover-boxes h2.has-small-font-size {
        font-size: 1.2em !important;
    }


.wp-block-media-text .wp-block-media-text__content > .wp-block-group.has-background {
    padding: 2.5em 4em 2.5em 4em;
}

@media (max-width: 750px) {
    .wp-block-media-text .wp-block-media-text__content > .wp-block-group.has-background {
        padding: 0;
    }
}

.wp-block-media-text .wp-block-media-text__content > figure {
    width: 100%;
    height: auto;
    margin-top: 5em !important;
}

@media (max-width: 599px) {
    .wp-block-media-text>.wp-block-media-text__content {
        padding: 0;
        padding-top: 1em;
    }
    .wp-block-media-text .wp-block-media-text__content > figure {
        margin-left: calc(var(--padding-left-right) * -1);
        margin-right: calc(var(--padding-left-right) * -1);
        width: calc(100% + calc(var(--padding-left-right) * 2));
    }
}

.wp-block-media-text .wp-block-media-text__content > figure img {
    width: 100%;
    height: auto;
}


@media (mi-width: 600px) {
        .wp-block-media-text .wp-block-media-text__media {
            transform: translateX(-6em);
        }
        .wp-block-media-text.has-media-on-the-right .wp-block-media-text__media {
            transform: translateX(6em);
        }
}

@media (max-width: 750px) {
    .wp-block-media-text .wp-block-media-text__media {
        /* display: none; */
    }
}

.wp-block-media-text.has-background-color .wp-block-media-text__media,
.wp-block-media-text.has-background .wp-block-media-text__media {
    transform: none;
}

.wp-block-media-text.has-background-color .wp-block-media-text__content {
    padding: 5.5em 4.5em;
}

@media (max-width: 750px) {
    .wp-block-media-text.has-background-color .wp-block-media-text__content {
        padding: 2em;
    }
}

.yoast-breadcrumbs {
    font-size: 1.4em;
    line-height: 1.1;
}

    @media (max-width: 450px) {
        .yoast-breadcrumbs {
            font-size: 1em !important;
            margin-top: 0em !important;
        }
    }

    .yoast-breadcrumbs a {
        text-decoration: none;
    }

    .yoast-breadcrumbs .breadcrumb_last {
        font-weight: 750;
    }


.entry-content > .wp-block-cover {
    min-height: 40vw;
}

.team-holder {
    margin-top: 5em;

}

.team-holder > ul {
    display: flex;
    flex-flow: row wrap;
    --gap: 2.5em;
    gap: calc(var(--gap) * 1.75) var(--gap);
}

    .team-holder > .wp-block-cover,
    .team-holder > ul > li {
        width: 100%;
        margin-top: 0 !important;
    }

    .team-holder .wp-block-cover {
        padding: 0;
        aspect-ratio: 3 / 4;
        overflow: hidden;
    }

    @media (min-width: 600px) {
        .team-holder > .wp-block-cover,
        .team-holder > ul > li {
            width: calc(50% - calc(var(--gap) * 0.5));
        }
    }

    @media (min-width: 1000px) {
        .team-holder > .wp-block-cover,
        .team-holder > ul > li {
            width: calc(33.33333333333333% - calc(var(--gap) * 0.667));
        }
    }


    .team-holder .wp-block-cover .wp-block-cover__inner-container {
        width: 100% !important;
    }

    .team-holder .wp-block-cover .wp-block-cover__inner-container > .wp-block-group.has-background {
        padding: 1.5em 1em;
        width: calc(100% - 4em);
        margin-left: 0 !important;
        /* position: absolute;
        left: 0; */

    }

    .team-holder h4 {
        text-transform: uppercase;
    }

    .team-holder h4 + p {
        margin-top: 0.25em;
    }

     h4 + p ~ * {
        display: none;
    }


.news-holder {
    margin-top: 5em !important;
    margin-bottom: 5em !important;
}


    .news-holder ul.wp-block-post-template > li + li {
        margin-top: 4em !important;
    }

    .news-holder .wp-block-media-text__media img {
        aspect-ratio: 16 / 9;
        object-fit: cover;
    }

    .news-holder .wp-block-post-date + h2 {
        margin-top: 0.5em !important;
    }


.wp-block-column iframe[src*="maps"] {
    width: 100%;
    height: 100%;
    min-height: 100%;
    max-width: 100% !important;
}

    @media (max-width: 782px) {
        .wp-block-column iframe[src*="maps"] {
            aspect-ratio: 1 / 1 !important;
            height: unset !important;

        }
    }

    @media (min-width: 782px) {
        .current-page-kontakt .wp-block-group.has-primary-background-color .wp-block-column:nth-child(2) {
            padding-left: 5em !important;
        }
    }


.wp-block-columns.is-style-accordion {
    display: block;
    margin-top: 3em  !important;
    border-bottom: 3px solid var(--wp--preset--color--secondary);
}
    
    .wp-block-columns.is-style-accordion > .wp-block-column:nth-child(1) {
        padding: 0.5em 3em 2.5em 0;
        cursor: pointer;
        position: relative;
    }
    
    .wp-block-columns.is-style-accordion > .wp-block-column:nth-child(1)::after {
        content: "";
        position: absolute;
        right: 0;
        top: 0.5em;
        width: 1.5em;
        height: 1.5em;
        background-image: url(assets/images/accordion-open.svg);
        background-size: contain;
        background-repeat: no-repeat;
        background-position: center;
        transition: transform 0.2s ease-in-out;
    }
    
    .wp-block-columns.is-style-accordion.is-open > .wp-block-column:nth-child(1)::after {
        transform: rotate(-45deg);
    }
    
    .wp-block-columns.is-style-accordion + .wp-block-columns.is-style-accordion {
        border-top: 1px solid;
        margin-top: -1px !important;
    }
    
    .wp-block-columns.is-style-accordion > .wp-block-column:nth-child(2) {
        padding: 1em 0 2em 0;
        display: none;
    }

    .is-root-container .wp-block-columns.is-style-accordion > .wp-block-column:nth-child(2) {
        display: block !important;
    }
    
    .wp-block-columns.is-style-accordion.is-open > .wp-block-column:nth-child(2) {
        /* display: block; */
    }




    @media (min-width: 782px) {
        .wp-block-columns.is-style-media-text-left > .wp-block-column:nth-child(1) {
            padding-right: 4em !important;
        }

        .wp-block-columns.is-style-media-text-left > .wp-block-column:nth-child(1) > * {
            transform: translateX(-4em);
        }
    }

    .wp-block-columns.is-style-media-text-left > .wp-block-column:nth-child(1) > figure,
    .wp-block-columns.is-style-media-text-left > .wp-block-column:nth-child(1) > figure img {
        width: 100%;
        height: auto;
    }


    @media (min-width: 782px) {
        .wp-block-columns.is-style-media-text-right > .wp-block-column:nth-child(2) {
            padding-left: 4em !important;
        }

        .wp-block-columns.is-style-media-text-right > .wp-block-column:nth-child(2) > * {
            transform: translateX(4em);
        }
    }

    .wp-block-columns.is-style-media-text-right > .wp-block-column:nth-child(2) > figure,
    .wp-block-columns.is-style-media-text-right > .wp-block-column:nth-child(2) > figure img {
        width: 100%;
        height: auto;
    }

/* .wp-block-list.is-style-arrows {
    padding-left: 0 !important;
    list-style: none;
}

.wp-block-list.is-style-arrows li {
    position: relative;
    padding-left: 1.5em;
}

    .wp-block-list.is-style-arrows li::before {
        content: ">";
        position: absolute;
        left: 0;
        top: -0.1em;
} */

.references-holder {
    margin-top: 5em !important;
}

.references-holder ul.wp-block-post-template,
.gallery-slider .wp-block-gallery {
    --gap: 1.2em;
    gap: var(--gap);
    display: flex;
    flex-flow: row wrap;
}

    .reference-address {
        font-size: 1.4em;
        line-height: 1.1;
    }
    
    h3 + .reference-address {
        margin-top: 0.25em;
    }

    .references-holder ul.wp-block-post-template li {
        width: 100%;
    }

    @media (min-width: 700px) {
        .references-holder ul.wp-block-post-template li {
            width: calc(50% - calc(var(--gap) * 0.5));
        }

        .references-holder ul.wp-block-post-template li .wp-block-cover {
            aspect-ratio: 4 / 3;
            min-height: 100%;
            max-width: 100%;
            cursor: pointer;
            padding: 1.25em 4em 1.5em 1.25em;
        }

        .references-holder ul.wp-block-post-template li .wp-block-cover::after {
            content: "";
            position: absolute;
            bottom: 1.25em;
            right: 1.25em;
            width: 2em;
            height: 2em;
            background-image: url(assets/images/arrow-reference.svg);
            background-size: contain;
            background-repeat: no-repeat;
            background-position: center;
            z-index: 99;
        }

        .references-holder ul.wp-block-post-template li .wp-block-cover .wp-block-cover__image-background {
            transition: transform 0.3s ease-out;
        }

        .references-holder ul.wp-block-post-template li .wp-block-cover:hover .wp-block-cover__image-background {
            transform: scale(1.1);
        }

        .references-holder ul.wp-block-post-template li:nth-child(9n+1),
        .references-holder ul.wp-block-post-template li:nth-child(9n+6) {
            width: calc(40% - calc(var(--gap) * 0.5));
        }

        .references-holder ul.wp-block-post-template li:nth-child(9n+1) .wp-block-cover,
        .references-holder ul.wp-block-post-template li:nth-child(9n+6) .wp-block-cover {
            aspect-ratio: 3 / 4;
        }

        .references-holder ul.wp-block-post-template li:nth-child(9n+2),
        .references-holder ul.wp-block-post-template li:nth-child(9n+5) {
            width: calc(60% - calc(var(--gap) * 0.5));
        }
    }



  
    .slider .references-holder {
        margin-top: 0 !important;
    }

    .slider .references-holder ul.wp-block-post-template,
    .gallery-slider .wp-block-gallery {
        margin-left: -1.2em !important;
        width: calc(100% + 3.4em) !important;
        max-width: unset !important;
    }

    .slider .references-holder ul.wp-block-post-template li,
    .gallery-slider .wp-block-gallery .wp-block-image,
    .gallery-slider .wp-block-gallery .wp-slider-first-slide {
        width: calc(50% - calc(var(--gap) * 0.5)) !important;
        padding: 1.2em !important;
        box-sizing: border-box;
    }

    @media (max-width: 750px) {
        .slider .references-holder ul.wp-block-post-template li,
        .gallery-slider .wp-block-gallery > *  {
            width: 100% !important;
        }
    }

    @media (max-width: 450px) {
        .slider .references-holder ul.wp-block-post-template li,
        .gallery-slider .wp-block-gallery .wp-block-image {
            width: calc(100% - 1em) !important;
            padding: 1.2em !important;
            box-sizing: border-box;
        }

        .gallery-slider .wp-block-gallery .wp-slider-first-slide {
            width: 75% !important;
        }
    }

    .slider .references-holder ul.wp-block-post-template li > .wp-block-cover,
    .slider .references-holder ul.wp-block-post-template li > .wp-block-group,
    .gallery-slider .wp-block-gallery .wp-block-image {
        aspect-ratio: 1 / 1 !important;
    }

    .gallery-slider .wp-block-gallery .wp-block-image img {
        width: 100%;
        aspect-ratio: 1 / 1;
        object-fit: cover;
    }

    .slider .references-holder ul.wp-block-post-template li > .wp-block-group,
    .gallery-slider .wp-block-gallery .wp-block-image > .wp-block-group {
        display: flex;
        flex-flow: column;
        align-items: center;
        justify-content: center;
        padding-right: 8em;
    }

    @media (max-width: 599px) {
        .slider .references-holder ul.wp-block-post-template li > .wp-block-group,
        .gallery-slider .wp-block-gallery .wp-block-image > .wp-block-group {
            padding-right: 3em !important;
        }
    }

    .slider ul.wp-block-post-template.flickity-enabled,
    .gallery-slider .wp-block-gallery.flickity-enabled {
        display: block !important;
    }

    .slider .js-slide-next,
    .gallery-slider .js-slide-next {
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        right: calc(50% + 1.5em);
        width: 5em;
        height: 5em;
        background-image: url(assets/images/slider-next.svg);
        background-size: contain;
        background-repeat: no-repeat;
        background-position: center;
        cursor: pointer;
        z-index: 99;
        transition: transform 0.2s ease-out;
        transition-delay: 0.4s;
    }

    .slider .js-slide-prev,
    .gallery-slider .js-slide-prev {
        display: none;
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        left: 0em;
        width: 5em;
        height: 5em;
        background-image: url(assets/images/slider-next.svg);
        background-size: contain;
        background-repeat: no-repeat;
        background-position: center;
        cursor: pointer;
        transform: translateY(-50%) rotate(180deg);
        z-index: 99;
        transition: transform 0.2s ease-out;
        transition-delay: 0.4s;
    }

    @media (max-width: 750px) {
        .slider .js-slide-next,
        .gallery-slider .js-slide-next {
            right: -1em;
            width: 4.5em;
            height: 4.5em;
        }

        .slider .js-slide-prev,
        .gallery-slider .js-slide-prev {
            left: -1em;
            width: 4.5em;
            height: 4.5em;
        }
    }

    .slider.has-reached-end .js-slide-next,
    .gallery-slider.has-reached-end .js-slide-next {
        transform: translateY(-50%) rotate(180deg);
        opacity: 0;
        pointer-events: none;
    }


footer {
    margin-top: 0 !important;
    font-family: var(--wp--preset--font-family--headlines);
    line-height: 1.1;
}

    footer > .wp-block-group {
        padding: calc(var(--padding-top-bottom) * 0.5) var(--padding-left-right) var(--padding-top-bottom) var(--padding-left-right);
    }

    .footer-logo {
        width: 11em;
        height: auto;
    }

    footer .wp-block-columns {
        gap: 5em;
        min-width: 30em;
    }

    @media (max-width: 750px) {
        footer .wp-block-columns {
            min-width: unset;
            text-align: center;
        }

        footer .wp-block-columns > * {
            text-align: center;
        }

        footer .is-nowrap {
            flex-flow: column !important;
        }

        footer * {
            margin-left: auto !important;
            margin-right: auto !important;
        }

        footer .wp-block-social-links {
            justify-content: center !important;
        }

        footer .wp-block-social-links > * {
            margin-left: 0 !important;
            margin-right: 0 !important;
        }
    }

    footer .wp-block-columns p {
        margin-top: 0.5em !important;
    }

    footer a {
        display: inline-block;
        text-underline-offset: 0.25em;
        text-decoration-thickness: 0.15em;
        text-decoration-color: var(--wp--preset--color--primary);
    }

    .wp-block-social-links {
        gap: 0.5em;
    }

    footer .wp-block-social-links {
        margin-bottom: 1.2em;
    }

    .wp-block-social-links a {
        border-radius: 0;
        border: 2px solid var(--wp--preset--color--foreground) !important;
        width: 2em;
        height: 2em;
        display: flex;
        align-items: center;
        justify-content: center;
        transition: all 0.3s ease-in-out;
        padding: 0;
        margin: 0;
        box-sizing: border-box;
        transition: all 0.2s ease-out;
    }

    .wp-block-social-links .wp-social-link {
        transform: scale(1) !important;
    }

    .wp-block-social-links a:hover {
        transform: scale(1.1);
        background: var(--wp--preset--color--primary) !important;
        border-color: var(--wp--preset--color--primary) !important;
        color: var(--wp--preset--color--background) !important;
    }


    .jobs-toggle {
        position: fixed;
        bottom: 10em;
        right: 0;
        width: 100%;
        text-align: center;
        padding: 1em 0;
        background: var(--wp--preset--color--primary);
        color: var(--wp--preset--color--background);
        border: 2px solid var(--wp--preset--color--primary);
        font-size: 1.2em;
        line-height: 1;
        text-transform: uppercase;
        display: block;
        padding: 0.5em 2.5em;
        text-decoration: none;
        width: fit-content;
        font-family: var(--wp--preset--font-family--headlines);
        transform: rotate(-90deg) translateY(2px);
        transform-origin: right bottom;
        transition: all 0.2s ease-out;
    }

    .jobs-toggle:hover {
        background: var(--wp--preset--color--background);
        color: var(--wp--preset--color--primary);
    }


.number-grid {
    display: flex;
    flex-flow: row wrap;
    gap: 0;
    --border-color: #74CD9A;
    position: relative;
}

    @media (max-width: 781px) {
        .number-grid {
            margin-bottom: 4em !important;
        }
    }

    .number-grid > * {
        width: 25%;
        border: 1px solid var(--border-color);
        aspect-ratio: 1 / 1;
        position: relative;
        display: flex;
        flex-flow: column;
        padding: 2em
    }

    @media (max-width: 750px) {
        .number-grid > * {
            width: 50%;
        }
    }

    .number-grid > *:nth-child(1)::before,
    .number-grid > *:nth-child(2)::before,
    .number-grid > *:nth-child(3)::before,
    .number-grid > *:nth-child(4)::before,
    .number-grid::after {
        content: "";
        position: absolute;
        width: 0.6em;
        height: 0.6em;
        background: var(--border-color);
        border-radius: 50%;
        bottom: 0;
        left: 0;
        margin-left: -0.3em;
        margin-bottom: -0.3em;
        transition: all 0.2s ease-out;
    }

        .number-grid > *:nth-child(2)::before {
            bottom: unset;
            top: 0;
            margin-left: -0.3em;
            margin-top: -0.3em;
        }

        .number-grid::after {
            bottom: unset;
            top: 0;
            left: unset;
            right: 0;
            margin-right: -0.3em;
            margin-top: -0.3em;
        }

        .number-grid h2.has-x-large-font-size {
            font-size: 3em !important;
            line-height: 1 !important;
        }

        .number-grid > *:nth-child(1) h2.has-x-large-font-size {
            font-size: 4em !important;
            line-height: 1 !important;
        }

        @media (min-width: 1400px) {
            .number-grid h2.has-x-large-font-size {
                font-size: 4em !important;
                line-height: 1 !important;
            }

            .number-grid > *:nth-child(1) h2.has-x-large-font-size {
                font-size: 6em !important;
                line-height: 1 !important;
            }
        }

        @media (max-width: 750px) {
            .number-grid h2.has-x-large-font-size {
                font-size: 3em !important;
            }

            .number-grid > *:nth-child(1) h2.has-x-large-font-size {
                font-size: 4em !important;
            }
        }

        @media (max-width: 450px) {
            .number-grid > * {
                padding: 1em;
            }
            .number-grid h2.has-x-large-font-size {
                font-size: 2em !important;
            }

            .number-grid > *:nth-child(1) h2.has-x-large-font-size {
                font-size: 3em !important;
            }
        }

        @media (max-width: 370px) {
            .number-grid > * {
                padding: 1em;
            }
            .number-grid h2.has-x-large-font-size {
                font-size: 1.5em !important;
            }

            .number-grid > *:nth-child(1) h2.has-x-large-font-size {
                font-size: 2em !important;
            }
        }

        .number-grid h2.has-x-large-font-size + p {
            margin-top: 0 !important;
        }

    .number-grid:hover > *:nth-child(1)::before,
    .number-grid:hover > *:nth-child(2)::before,
    .number-grid:hover > *:nth-child(3)::before,
    .number-grid:hover > *:nth-child(4)::before,
    .number-grid:hover::after {
        transform: scale(1.5);
    }  

    .number-grid > *:nth-child(2)::after {
        content: "";
        position: absolute;
        width: 100%;
        height: 100%;
        top: 0;
        left: 0;
        border-radius: 0 100% 0 0;
        border-top: 1px solid var(--border-color);
        border-right: 1px solid var(--border-color);
        transition: all 0.2s ease-out;
        pointer-events: none;
    }

    .number-grid > *:nth-child(4)::after {
        content: "";
        position: absolute;
        width: 100%;
        height: 100%;
        top: 0;
        left: 0;
        border-radius: 0 0 100% 0;
        border-bottom: 1px solid var(--border-color);
        border-right: 1px solid var(--border-color);
        transition: all 0.2s ease-out;
        pointer-events: none;
    }

    .number-grid:hover > *:nth-child(2)::after {
        border-top: 4px solid var(--border-color);
        border-right: 4px solid var(--border-color);
    }

    .number-grid:hover > *:nth-child(4)::after {
        border-bottom: 4px solid var(--border-color);
        border-right: 4px solid var(--border-color);
    }



    .number-grid > *:nth-child(1) {
        justify-content: center;
    }

    .number-grid > *:nth-child(2) {
        justify-content: flex-end;
    }

        .number-grid > *:nth-child(2) > * {
            text-align: right;
            margin-right: 0 !important;
        }

    .number-grid > *:nth-child(3) {
        justify-content: center;
    }

    .number-grid > *:nth-child(4) {
        justify-content: flex-start;
    }

        .number-grid > *:nth-child(4) > * {
            text-align: left;
            margin-left: 0 !important;
        }

    .number-grid > * > * {
        transition: all 0.2s ease-out;
    }

    .number-grid:hover > *:nth-child(2) > * {
        transform-origin: right bottom;
    }

    .number-grid:hover > *:nth-child(4) > * {
        transform-origin: left top;
    }

    .number-grid:hover > * > * {
        transform: scale(1.2);
    }
    

.map-holder {
    position: relative;
}

.ch_map {
    margin-top: 2em !important;
    width: 100%;
    height: auto;
}

    @media (max-width: 450px) {
        .ch_map {
            transform: scale(1.2);
        }
    }

    .ch_map path {
        pointer-events: none;
    }

    .ch_map path[data-label] {
        pointer-events: all;
        transition: all 0.2s ease-out;
        position: relative;
    }

    @media (max-width: 750px) {
        .ch_map path:not([data-label]) {
            fill: transparent !important;
        }

        .ch_map path[data-label='SG'] {
            fill: #003D1A !important;
        }
    }


    .ch_map path[data-label]:hover {
        /* transform: scale(1.5) translate(-23%, 12%);
        z-index: 9999999 !important; */
        fill: #fff !important;
        opacity: 1 !important;
    }

    .ch_map path[data-label]:hover::before {
        content: attr(data-label);
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background: var(--wp--preset--color--primary);
        color: var(--wp--preset--color--background);
    }

    .ch_map_label {
        background-color: #000;
        position: absolute;
        pointer-events: none;
        top: 3em;
        right: 3em;
        padding: 0.5em 1em;
        color: #fff;
        font-size: 1.2em;
        line-height: 1;
        text-transform: uppercase;
        box-shadow: 0 0 1em rgba(0, 0, 0, 0.2);
    }


.history-slider {
    --border-color: #74CD9A;
    --border-width: 3px;
    --line-bottom-offset: 6em;
}

    .history-slider .slide {
        display: flex;
        flex-flow: row wrap;
        gap: 0;
        width: 2200px;
        position: relative;
        height: calc(100vh - var(--header-height) * 0.5);
        max-height: 50em;
    }

        .history-slider .slide-line-bottom {
            position: absolute;
            bottom: var(--line-bottom-offset);
            left: 0;
            width: 100%;
            height: var(--border-width);
            background-color: var(--border-color);
            z-index: 999;
        }

        .slide-1 .slide-content::after,
        .slide-3 .slide-content::after,
        .slide-5 .slide-content::after,
        .slide-7 .slide-content::after,
        .slide-8 .slide-content::after {
            content: "";
            position: absolute;
            top: 0;
            right: 4em;
            width: var(--border-width);
            height: 100%;
            background-color: var(--border-color);
        }

            .slide-3 .slide-content::after {
                left: -8em;
                right: unset;
            }

            .slide-5 .slide-content::after {
                right: 1em;
            }

            .slide-7 .slide-content::after {
                left: -8em;
                right: unset;
            }

            .slide-8 .slide-content::after {
                right: -10em;
            }

        .slide-1 .slide-image::after,
        .slide-3 .slide-content::before,
        .slide-4 .slide-image::after,
        .slide-5 .slide-image::after,
        .slide-7 .slide-content::before,
        .slide-8 .slide-image::after {
            content: "";
            position: absolute;
            top: 0;
            left: -4em;
            width: calc(100% + 4em);
            height: calc(100% - var(--line-bottom-offset) - var(--border-width));
            border-bottom: var(--border-width) solid var(--border-color);
            border-right: var(--border-width) solid var(--border-color);
            border-radius: 0 0 100% 0;
            pointer-events: none;
        }

            .slide-3 .slide-content::before,
            .slide-7 .slide-content::before {
                left: -8em;
                width: calc(100% + 8em + 4em);
                right: unset;
            }

            .slide-4 .slide-image::after {
                left: 0;
                width: 100%;
                border-bottom: var(--border-width) solid var(--border-color);
                border-left: var(--border-width) solid var(--border-color);
                border-radius: 0 0 0 100%;
                border-top: none;
                border-right: none;
            }

            .slide-5 .slide-image::after {
                left: -1em;
                width: calc(100% + 1em);
            }

            .slide-8 .slide-image::after {
                left: 10em;
                width: calc(100% - 4em);
            }

            .slide-8 .slide-image {
                z-index: 999 !important;
            }

    .history-slider .slide-content {
        box-sizing: border-box;
        width: 50%;
        height: 100%;
        background-color: var(--wp--preset--color--primary);
        color: var(--wp--preset--color--background);
        display: flex;
        flex-flow: column;
        justify-content: flex-start;
        align-items: center;
        padding: 6em 8em 8em 8em;
        position: relative;
        z-index: 99;
        
    }

        .history-slider .slide-content h2.year {
            font-family: var(--wp--preset--font-family--numbers);
            display: block;
            width: fit-content;
            border: 2px solid var(--wp--preset--color--background);
            padding: 0.25em !important;
        }

        .history-slider .slide-content h2.small {
            font-size: 1.5em;
            line-height: 1.2;
        }


    .history-slider .slide-image {
        width: 50%;
        position: relative;
        z-index: 9;
    }

    .history-slider .slide-image img {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        object-fit: cover;
    }
    
    .history-slider-holder {
        position: relative;
    }

    @media (max-width: 1400px) {
        .history-slider-holder {
            font-size: 0.75rem !important;
        }
        .history-slider .slide-content {
            width: 20% !important;
        }
    }

    @media (max-width: 500px) {
        .history-slider-holder {
            font-size: 0.5rem !important;
        }
        .history-slider .slide-content {
            width: 10% !important;
        }

        /* .history-slider h2.small {
            font-size: 0.7rem !important;
        } */

        .history-slider .slide-content {
            padding: 2em 4em 4em 4em !important;
        }
    }

    .history-slider-holder .js-slide-next,
    .history-slider-holder .js-slide-prev {
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        right: 2em;
        width: 5em;
        height: 5em;
        background-image: url(assets/images/slider-next.svg);
        background-size: contain;
        background-repeat: no-repeat;
        background-position: center;
        cursor: pointer;
        z-index: 9999;
        transition: all 0.2s ease-out;
    }

    .history-slider-holder .js-slide-prev {
        left: 2em;
        transform: translateY(-50%) rotate(180deg);
        display: none;
    }

    .slide-1 .slide-animated-image {
        position: absolute;
        bottom: 3em;
        left: calc(50% - 9em);
        width: 18em;
        height: auto;
        z-index: 9999;
    }

    @media (max-width: 1400px) {
        .slide-1 .slide-animated-image {
           left: calc(20% - 9em) !important;
        }
    }
    @media (max-width: 500px) {
        .slide-1 .slide-animated-image {
            left: calc(10% - 9em) !important;
        }
    }

    .slide-1.is-selected .slide-animated-image {
        animation: ani1 1s linear infinite;
    }

    @keyframes ani1 {
        0% {
            transform: rotate(0deg);
        }
        50% {
            transform: rotate(20deg);
        }
        100% {
            transform: rotate(0deg);
        }
    }

    .slide-2 .slide-animated-image {
        position: absolute;
        bottom: 3em;
        left: calc(50% - 9em);
        width: 31em;
        height: auto;
        z-index: 9999;
    }

    @media (max-width: 1400px) {
        .slide-2 .slide-animated-image {
            left: calc(20% - 9em) !important;
        }
    }

    @media (max-width: 500px) {
        .slide-2 .slide-animated-image {
            left: calc(10% - 9em) !important;
        }
    }

    .slide-2.is-selected .slide-animated-image {
        animation: ani2 0.1s linear 0s 20;
    }

    @keyframes ani2 {
        0% {
            transform: translate(0, 0);
        }
        50% {
            transform: translate(0.25em, 0);
        }
        100% {
            transform: translate(0, 0);
        }
    }


    .slide-3 .slide-animated-image {
        position: absolute;
        bottom: calc(100% - 15em);
        left: calc(50% - 7em);
        width: 15em;
        height: auto;
        z-index: 9999;
        transition: all 1s ease-out;
        transition-delay: 0.25s;
    }

    @media (max-width: 1400px) {
        .slide-3 .slide-animated-image {
            left: calc(20% - 7em) !important;
        }
    }

    @media (max-width: 500px) {
        .slide-3 .slide-animated-image {
            left: calc(10% - 7em) !important;
        }
    }

    .slide-3.is-selected .slide-animated-image {
        bottom: 1em;
    }


    .slide-4 .slide-animated-image {
        position: absolute;
        top: 20em;
        left: calc(50% - 12em);
        width: 20em;
        height: auto;
        z-index: 9999;
        transition: all 1s ease-out;
        transition-delay: 0.25s;
    }

    @media (max-width: 1400px) {
        .slide-4 .slide-animated-image {
            left: calc(20% - 12em) !important;
        }
    }

    @media (max-width: 500px) {
        .slide-4 .slide-animated-image {
            left: calc(10% - 12em) !important;
        }
    }

    .slide-4.is-selected .slide-animated-image {
        top: 5em
    }

    @media (max-width: 500px) {
        .slide-4.is-selected .slide-animated-image {
            top: unset !important;
            bottom: 2em !important;
        }
    }

    .slide-6 .slide-animated-image {
        position: absolute;
        bottom: calc(100% - 15em);
        left: calc(50% - 10em);
        width: 15em;
        height: auto;
        z-index: 9999;
        transition: all 1s ease-out;
        transition-delay: 0.25s;
    }

    @media (max-width: 1400px) {
        .slide-6 .slide-animated-image {
            left: calc(20% - 10em) !important;
        }
    }

    @media (max-width: 500px) {
        .slide-6 .slide-animated-image {
            left: calc(10% - 10em) !important;
        }
    }

    .slide-6.is-selected .slide-animated-image {
        bottom: 1em;
    }


    .slide-8 .slide-animated-image {
        position: absolute;
        bottom: 0;
        left: calc(50% - 10em);
        width: 20em;
        height: auto;
        z-index: 9999;
        transition: all 1s ease-out;
        transition-delay: 0.25s;
    }

    @media (max-width: 1400px) {
        .slide-8 .slide-animated-image {
            left: calc(20% - 10em) !important;
        }
    }

    @media (max-width: 500px) {
        .slide-8 .slide-animated-image {
            left: calc(10% - 10em) !important;
        }
    }

    .slide-8.is-selected .slide-animated-image {
        left: calc(50% + 5em);
    }


    @media (max-width: 600px) {
        .wp-block-spacer {
            display: none;
        }
    }

    @media (max-width: 750px) {
        h2 {
            max-width: 100% !important;
        }


    }



    @media (max-width: 500px) {
        h1, h2 {
            font-size: 1.8em !important;
            text-align: left !important;
        }

        

        .wp-block-buttons.is-content-justification-right {
            justify-content: flex-start !important;
        }
    }

    @media (max-width: 599px) {
        .entry-content > .wp-block-group:not(.has-background) {
            padding-left: var(--padding-left-right) !important;
            padding-right: var(--padding-left-right) !important;
        }
    }


.single-referenz h4 {
    font-weight: 700;
}

.wp-block-social-link.wp-social-link-facebook a {
    background: url(https://projects.odoson.com/bw/app/uploads/2025/09/Bruehwiler_SoMe-Icons_schwarz_RGB_Facebook.svg) no-repeat center center;
    background-size: contain !important;
    border: none !important;
}

    .wp-block-social-link.wp-social-link-facebook a svg {
        display: none;
    }

    .wp-block-social-links .wp-block-social-link.wp-social-link-facebook a:hover {
        background-color: transparent !important;
        background-image: url(https://projects.odoson.com/bw/app/uploads/2025/09/Bruehwiler_SoMe-Icons_gruen-Neg_RGB_Facebook.svg) !important;
    }

.wp-block-social-link.wp-social-link-youtube a {
    background: url(https://projects.odoson.com/bw/app/uploads/2025/09/Bruehwiler_SoMe-Icons_schwarz_RGB_YouTube.svg) no-repeat center center;
    background-size: contain !important;
    border: none !important;
}

    .wp-block-social-link.wp-social-link-youtube a svg {
        display: none;
    }

    .wp-block-social-links .wp-block-social-link.wp-social-link-youtube a:hover {
        background-color: transparent !important;
        background-image: url(https://projects.odoson.com/bw/app/uploads/2025/09/Bruehwiler_SoMe-Icons_gruen-Neg_RGB_YouTube.svg) !important;
    }

.wp-block-social-link.wp-social-link-linkedin a {
    background: url(https://projects.odoson.com/bw/app/uploads/2025/09/Bruehwiler_SoMe-Icons_schwarz_RGB_LinkedIn.svg) no-repeat center center;
    background-size: contain !important;
    border: none !important;
}

    .wp-block-social-link.wp-social-link-linkedin a svg {
        display: none;
    }

    .wp-block-social-links .wp-block-social-link.wp-social-link-linkedin a:hover {
        background-color: transparent !important;
        background-image: url(https://projects.odoson.com/bw/app/uploads/2025/09/Bruehwiler_SoMe-Icons_gruen-Neg_RGB_LinkedIn.svg) !important;
    }

.wp-block-social-link.wp-social-link-instagram a {
    background: url(https://projects.odoson.com/bw/app/uploads/2025/09/Bruehwiler_SoMe-Icons_schwarz_RGB_Insta.svg) no-repeat center center;
    background-size: contain !important;
    border: none !important;
}

    .wp-block-social-link.wp-social-link-instagram a svg {
        display: none;
    }

    .wp-block-social-links .wp-block-social-link.wp-social-link-instagram a:hover {
        background-color: transparent !important;
        background-image: url(https://projects.odoson.com/bw/app/uploads/2025/09/Bruehwiler_SoMe-Icons_gruen-Neg_RGB_Insta.svg) !important;
    }


.is-job-accordion > .wp-block-column:first-child p:first-child {
    width: 40%;
}

@media (max-width: 600px) {
    .is-job-accordion > .wp-block-column:first-child .is-nowrap.is-layout-flex {
        flex-flow: row wrap !important;
    }
    .is-job-accordion > .wp-block-column:first-child p:first-child {
        width: 100%;
    }
}

.benefits-with-icons {
    display: flex;
    flex-flow: row wrap;
    --gap: 2.5em;
    gap: calc(var(--gap) * 1.75) var(--gap);
    justify-content: space-between;
    margin-top: 5em !important;
}


.benefits-with-icons > .wp-block-group {
    width: 100%;
    margin: 0 !important;
}

@media (min-width: 750px) {
    .benefits-with-icons > .wp-block-group {
        width: calc(50% - calc(var(--gap) * 0.5));
    }
}

@media (min-width: 1200px) {
    .benefits-with-icons > .wp-block-group {
        width: calc(33.33333333333333% - calc(var(--gap) * 0.667));
        padding: 0 2em;
    }

    .benefits-with-icons > .wp-block-group:nth-child(2) {
        transform: translateY(50%);
    }
}

.benefits-with-icons .wp-block-image {
    text-align: center;
}

.benefits-with-icons .wp-block-image img {
    width: 70%;
    height: auto;
    max-width: 10em;
}

@media (max-width: 450px) {

    .benefits-with-icons .wp-block-image img {
        max-width: 6em;
    }
}

.referenzen-back-btn {
    background: none !important;
    border: none !important;
    padding: 0 !important;
    margin: 0 !important;
    font-size: 1.1em !important;
    font-weight: 700 !important;
    color: var(--wp--preset--color--foreground) !important;
    text-decoration: underline !important;
    text-underline-offset: 0.25em !important;
    text-decoration-thickness: 0.15em !important;
    text-decoration-color: var(--wp--preset--color--primary) !important;
    cursor: pointer !important;
}


.news_sidebar {
    position: fixed;
    right: 0;
    top: 0;
    height: 100vh;
    width: 33em;
    max-width: 80%;
    background: #fff;
    box-shadow: 0 0 1rem rgba(0,0,0,0.15);
    z-index: 9999;
    padding: 0;
    border-radius: 0;
    box-sizing: border-box;
    z-index: 999999999;
}
.news_sidebar.hidden {
    display: none;
}
.news_sidebar__close {
    position: absolute;
    top: 8px;
    right: 12px;
    background: none;
    border: none;
    font-size: 4em;
    cursor: pointer;
    color: var(--wp--preset--color--primary);
    line-height: 1;
    padding: 0;
    width: 1em;
    height: 1em;
}
.news_sidebar__close:hover {
    color: #000;
}
.news_sidebar__content {
    max-height: calc(100% - 5em);
    overflow-y: auto;
    padding: 2.5em;
}

.news_sidebar__content * {
    max-width: 100%;
}