/* GRID –––––––––––––––––––––––––––––––––*/

.grid-book {
    display: grid;
    grid-template-columns: 1fr 2fr;
    padding-top: 20px;
    gap: var(--column-gap);
}


/* SWIPER –––––––––––––––––––––––––––––––––*/
.grid-book-2-1 {
    grid-column: 2 / span 2;
    aspect-ratio: 16 / 9;
    background-color: var(--color-grey-repro);
    width: 100%;
    height: auto;
}

.glider {
    aspect-ratio: 3 / 4;
    overflow: hidden;
}





/* SCHRIFT –––––––––––––––––––––––––––––––––*/

.book-author-ul {
    display: flex;
    flex-direction: column;
}

.book-author {
    font-size: var(--font-size-xl);
    font-weight: var(--font-weight-normal);
    line-height: var(--line-height-xl);
    color: var(--color-text);
    text-transform: uppercase;
    letter-spacing: 0.05rem;
    /* display: flex;
    flex-direction: column; */
}

.book-title {
    font-size: var(--font-size-xl);
    font-weight: var(--font-weight-semibold);
    line-height: var(--line-height-xl);
    color: var(--color-text);
    text-transform: uppercase;
    letter-spacing: 0.02rem;
}


.book-subtitle {
    font-size: var(--font-size-xl);
    font-weight: var(--font-weight-normal);
    line-height: var(--line-height-xl);
    color: var(--color-text);
    text-transform: uppercase;
    letter-spacing: 0.02rem;
}

.book-text {
    font-size: var(--font-size-m);
    line-height: var(--line-height-m);
    /* white-space: wrap; */
    color: var(--color-text);
    font-weight: var(--font-weight-normal);
    text-transform: none;
    letter-spacing: 0.05rem;
    -moz-hyphens: auto;
    -o-hyphens: auto;
    -webkit-hyphens: auto;
    -ms-hyphens: auto;
    hyphens: auto;

    /* width: 25vw; */
}

.book-biblio,
.book-extras {
    font-size: var(--font-size-s);
    line-height: var(--line-height-s);
    white-space: wraps;
    color: var(--color-text);
    /* width: 25vw; */
}

.book-partner {
    font-size: var(--font-size-m);
    line-height: var(--line-height-m);
    white-space: wrap;
    color: var(--color-text);
    /* width: 25vw; */
    margin-top: 0.8rem;
    margin-bottom: 0.8rem;
}

/* —————————————————————————————————————————————————— */
/* MEDIA 768px —————————————————————————————————————— */

@media only screen and (max-width:960px) {

    /* MOBILE GRID KOLUMNENLINIEN –––––––––––––––––––––––––––––––––*/
    .grid-book-eins,
    .grid-book-eins-1-1,
    .grid-book-eins-121 {
        display: none;
    }

    .grid-book {
        grid-template-columns: auto;
    }

    .grid-book-2-1 {
        grid-column: 1;
        grid-row: 1;
        width: var(--width);
    }

}