/* 3er Spalte auf Landingpage / Startseite */

.section-gallery,
.projekte-views-block {
    position: relative;
    padding: 0;
    margin-bottom: calc(2 * var(--griditem));
    display: flex;
    flex-direction: row;
    gap: 10px;
    width: calc(100% - 40px);
    margin: 0 auto calc(2 * var(--griditem)) auto;
    box-sizing: border-box;
}

.section-gallery > .paragraph--type--vorschau,
.projekte-views-block > .views-row {
    flex: 1;
    position: relative;
    opacity: 1;
    transition: opacity 0.2s ease;
}

.section-gallery > .paragraph--type--vorschau img,
.projekte-views-block > .views-row img {
    margin-bottom: calc(0.25 * var(--griditem));
}

.section-gallery > .paragraph--type--vorschau p,
.projekte-views-block > .views-row p {
    font-weight: normal;
}

.section-gallery > .paragraph--type--vorschau a,
.projekte-views-block > .views-row a {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    text-indent: -9999px;
}

.section-gallery:hover > .paragraph--type--vorschau,
.projekte-views-block:hover > .views-row {
    opacity: 0.6;
}

.section-gallery > .paragraph--type--vorschau:hover,
.projekte-views-block > .views-row:hover {
    opacity: 1;
}

@media (max-width: 900px) {
    .section-paragraphs + .section-gallery {
        width: 100%;
    }

    body.content-type-projekt .section-gallery {
        width: calc(100% - 40px);
    }
    
    body.content-type-projekt .projekte-views-block {
        width: 100%;
    }

    .section-gallery,
    .projekte-views-block {
        flex-direction: column;
        margin-bottom: 1.25rem;
    }

    .section-gallery > .paragraph--type--vorschau,
    .projekte-views-block > .views-row {
        width: 100%;
    }
}