.articles-overview__item {
    display: block;
    overflow: hidden;
    border-radius: var(--borderRadius);
    box-shadow:
        var(--boxShadow1),
        var(--boxShadow2);
    background-color: #FFFFFF;
    text-decoration: none;
    margin-bottom: 1.5rem;
}

.articles-overview__item:last-child {
    margin-bottom: 3rem;
}

.articles-overview__item:hover .articles-overview__title {
    text-decoration: underline;
}

.articles-overview__picture {
    aspect-ratio: 340 / 160;
}

.articles-overview__content {
    padding: 1rem;
}

.articles-overview__published-date {
    display: block;
    font-size: .75rem;
    line-height: 1.5;
    color: var(--greyColor30);
    margin-bottom: .5rem;
}

.articles-overview__title {
    font-size: 1.5rem;
    line-height: 1.25;
    color: var(--secondaryColor);
}

.articles-overview__intro {
    position: relative;
    max-height: 4.5rem;
    overflow: hidden;
    color: var(--greyColor20);
    padding-right: .5rem;
    margin: 0;
}

.articles-overview__intro::after {
    position: absolute;
    display: block;
    content: '...';
    bottom: 0;
    right: 0;
}

@media (min-width: 813px) {
    .articles-overview__item article {
        display: grid;
        grid-template-columns: 15.5rem 1fr;
    }

    .articles-overview__picture {
        align-self: stretch;
        aspect-ratio: unset;
    }
}