﻿.block__overview {
    padding: var(--padding-lg) 0;
}

    .block__overview h3 {
        transform: rotate(-1deg);
        margin-bottom: 3rem;
    }

.overview__items {
    display: flex;
    flex-flow: column;
    gap: 4rem;
}

.overview__item {
    display: flex;
    flex-flow: column;
    font-size: 1.8rem;
    line-height: 2.4rem;
    position: relative;
}

    .overview__item:nth-child(odd) {
        transform: rotate(1deg);
    }

    .overview__item:nth-child(even) {
        transform: rotate(-1deg);
    }

    .overview__item p {
        font-size: 1.8rem;
        line-height: 2.4rem;
    }

    .overview__item img {
        width: 100%;
        height: auto;
    }

    .overview__item > a {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background-image: none !important;
    }

.overview__image {
    background-color: var(--bordercolor);
    clip-path: polygon(1.5% 0, 99% 1%, 100% 100%, 0 98%);
    padding: 2rem 2.5rem 2.5rem 2.5rem;
    box-sizing: border-box;
    margin-bottom: 1rem;
}

@media(min-width: 992px) {
    .overview__items {
        flex-flow: row;
        flex-wrap: wrap;
    }

    .overview__item {
        width: calc(33% - calc(8rem / 3));
    }

        .overview__item:has(>a) {
            transition: var(--transition-default);
        }

        .overview__item:has(> a:hover) {
            transform: rotate(0deg);
        }

    .overview__image {
        padding: 2.5rem 2.5rem 2.5rem 2.5rem;
    }
}

@media(min-width: 1400px) {
    .overview__items {
        flex-flow: row;
        flex-wrap: wrap;
    }

    .overview__item {
        width: calc(25% - calc(12rem / 4));
    }
}
