.articles-list {
    row-gap: 20px !important;
}

.article__img {
    padding-top: 58%;
    height: 100%;
    display: flex;
    align-items: end;
}

.article.artard {
    font-size: 20px;
    color: #ffffff;
    font-weight: 700;
}

.artard__ttl {
    position: relative;
    z-index: 2;
    width: 100%;
    padding: 15px;
}

/*.artard__ttl span {
    position: relative;
}*/

/*
.artard__ttl:before {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;

}
*/

.article.artard:hover .artard__ttl {
    color: var(--bs-white);
}

.article__img:after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: 30%;
    bottom: 0;
    background: linear-gradient(0deg, rgb(1 1 1 / 25%), rgb(255 255 255 / 0%));
    z-index: 1;
    backdrop-filter: blur(5px);
    mask-image: linear-gradient(to top, black, transparent);
    -webkit-mask-image: linear-gradient(to top, black, transparent);
}