.preview-featured {
    font-size: 0.8rem;

    .preview-link {
        display: block;
        padding:0;
        border-radius: $card-radius;
        overflow: hidden;
        text-decoration: none;
        .preview-item {
            width: 100%;
            height: auto;
            aspect-ratio: 16 / 9;
            background-size:100% auto;
            background-position: center center;
            transition: background-size .5s;
            
            &:hover {
                background-size: 120% auto;
            }
        }
    }

    .preview-overlay {
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        align-items: flex-start;
        height:100%;
        color: white !important;
        background: linear-gradient(to top, rgba(0, 0, 0, 0.75) 0%, rgba(0, 0, 0, 0) 60%);
        padding:$lineheight / 8;

        h2 {
            text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.7);
        }
    }
}