
.anim-slide {
    display: inline-block;
    position: relative;
    overflow: hidden;
    & > :first-child {
        display: block;
        width: 100%;
        height: 100%;
        overflow: hidden;
        & > img {
            width: 100%;
            aspect-ratio: 2/3;
            object-fit: cover;
            object-position: center top;
        }
        & > .card-header {
            overflow: hidden;
            height: 5.45rem;
            -webkit-box-orient: vertical;
            -webkit-line-clamp: 3;
            text-overflow: ellipsis;
            display: -webkit-box;
        }
    }
    & > :nth-child(2) {
        display: block;
        transition-property: transform, opacity;
        transition-duration: 0.25s;
        width: 100%;
        height: 100%;
        overflow: hidden;
        position: absolute;
        z-index: 100;
        top: 100%;
        color: #fff;
        background-color: var(--bs-primary);
        border: 0 none;
        opacity: 0;
    }
    &:hover,
    &:focus {
        & > :nth-child(2) {
            transform: translateY(-100%);
            opacity: 1;
        }
    }
}