/*
Theme Name: zwei 
Description: Ein modernes Wordpress-Theme für Zwei 
Author: Studio Tillack Knöll, Design Practice 
Author URI: https://www.studiotillackknoell.com 
Text Domain: zwei 
Version: 1.0
*/

a {
    color: inherit;
    text-decoration: none;
}

li {
    list-style: none;
}

section + section,
article + article {
    padding-top: var(--gutter);
}

article {
    padding: var(--padding) var(--padding) calc( 6 * var(--padding) ) var(--padding);
}

article:nth-of-type(odd) {
    background: black;
    color: white;
}

article:nth-of-type(even) {
    color: black;
    background: white;
}

    a[data-do="open-single"] {
        transition: .2s ease-in-out all;
    }

    a[data-do="open-single"]:hover {
        color: rgb(200, 200, 200);
    }

.section--copy h2 + p,
h2 + .section--copy {
    padding-top: var(--padding);
}

.kuenstler--single + .kuenstler--single {
    padding-top: calc( 4.5 * var(--padding));

}

.kuenstler--single__arbeiten {
    padding-top: calc( 2* var(--padding) ); 
    padding-left: 6.25vw;
}

.section--copy {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
}

    .section--copy p {
        width: 80%;
    }

    @media (max-width: 768px) {
        .section--copy {
            grid-template-columns: 1fr;
        }

        .section--copy p {
            width: 100%;
        }

        .aufzahlungspunkt--single {
            flex-direction: column;
        }
    }

.kuenstler--single__arbeiten--detail {
    display: none;
    pointer-events: none;
}

.kuenstler--single__arbeiten--detail.is-open {
    display: block;
    pointer-events: all;
}

.kuenstler--single__arbeiten--detail__loader {
    display: none;
}

.kuenstler--single__arbeiten--detail__loader.is-visible {
    display: block;
}

.section__intro {
    width: 100vw;
    height: 100vh;
}

#article--2 {
    padding: 0 !important;
}

.section__intro video {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.section__intro div {
    z-index: 2;
    position: absolute;
    display: flex;
    align-content: space-between;
    flex-direction: column;
    height: 100vh;
    width: 100vw;
    justify-content: space-between;
    padding: 20px;
    mix-blend-mode: difference;
}

.section__intro h1,
.section__intro h2 {
    mix-blend-mode: difference;
    max-width: 50%;
}

@media (max-width: 768px) {
    .section__intro h1,
.section__intro h2 {
    max-width: 100%;
}  
}

.section__intro h1 span,
.section__intro h2 span {
    background: var(--black);
    color: var(--white);
    mix-blend-mode: difference;
    padding: 5px 10px;
    -webkit-box-decoration-break: clone;
}

.aufzahlungspunkt--single {
    display: flex;
    padding-bottom: var(--padding);
    gap: var(--padding);
}

.section--aufzahlung__content {
    width: 80%;
}

    @media (max-width: 768px) {
        .section--aufzahlung__content {
            width: 100%;
        }   
    }

.aufzahlung__content--links.is-lonely {
    display: block;
}

.aufzahlungspunkt--single .section--aufzahlung__dt,
.aufzahlungspunkt--single .section--aufzahlung__en {
    flex: 1;
}

footer ul,
.wrapper--sponsors {
    padding: var(--padding);
}

.wrapper--sponsors {

    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr;
}



    @media (max-width: 1024px) {
        .wrapper--sponsors {
            grid-template-columns: 1fr 1fr;
        }
    }

    @media (max-width: 786px) {
        .wrapper--sponsors {
            grid-template-columns: 1fr;
        }
    }

    @media (min-width: 1024px) {
        .kuenstler--single__arbeiten--item a {
            max-width: 50%;
            display: block;
        }
    }


.kuenstler--single__arbeiten--content {
    padding-bottom: calc( 4* var(--padding) );
}

.kuenstler--single__socials a {
    display: inline-block;
}