article {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    margin-bottom: var(--spacing-3);
    padding: var(--spacing);
    border-radius: var(--border-radius-sm);
    overflow: hidden;
    @media screen and (width > 575px) {
        box-shadow: -2px 5px 10px rgb(0 0 0 / 20%);
        
    }
    & img {
        margin-bottom: var(--spacing-2);
        aspect-ratio: 16 / 9;
        object-fit: cover;
        &:first-child {
            max-width: calc(100% + var(--spacing)* 2);
            margin-top: calc(var(--spacing) * -1);
            margin-left: calc(var(--spacing) * -1);
            margin-right: calc(var(--spacing) * -1);
        }
    }

    & h1, h2, h3, h4, h5, h6, p {
        margin-top: 0;
        margin-bottom: var(--spacing);
    }

    & a {
        margin-top: auto;
    }
}