/* The additional images are part of the desktop and tablet expertise composition. */
.offered-expertise__image-extra {
    display: none;
}

@media (min-width: 768px) {
    .offered-expertise-content {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        grid-template-areas:
            "title growth"
            "web portfolio"
            "wide wide";
        grid-template-rows: 270px 315px 295px;
        gap: 20px;
        align-content: start;
    }

    .offered-expertise__title-container {
        display: contents;
    }

    .offered-expertise-title {
        grid-area: title;
        margin: 0;
    }

    .offered-expertise__image-title {
        grid-area: growth;
    }

    .offered-expertise__image-content {
        grid-area: web;
    }

    .offered-expertise__image-extra:nth-child(3) {
        grid-area: portfolio;
    }

    .offered-expertise__image-extra:nth-child(4) {
        grid-area: wide;
    }

    .offered-expertise__image-title,
    .offered-expertise__image-content,
    .offered-expertise__image-extra {
        display: block;
        width: 100%;
        min-width: 0;
        min-height: 0;
    }

    .offered-expertise__image-title img,
    .offered-expertise__image-content img,
    .offered-expertise__image-extra img {
        display: block;
        width: 100%;
        height: 100%;
        object-fit: cover;
        border-radius: 20px;
    }

    .offered-expertise__image-title picture {
        display: block;
        height: 100%;
    }
}
