.card {
    background-color: $color-shade-lightest;
    border-radius: $border-radius-md;
    box-shadow: $shadow-2;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    overflow: hidden;
    position: relative;
    transition: $transition-default;

    &:hover {
        box-shadow: $shadow-3;
        text-decoration: none;
        transform: translateY(-$spacing-sm);
    }
}

.card__image-container {
    position: relative;

    img {
        height: 100%;
        -o-object-fit: cover;
        object-fit: cover;
        width: 100%;
    }
}

.card__content {
    padding: $spacing-md;
}

.card__footer {
    align-items: center;
    display: flex;
    justify-content: flex-end;
    padding: $spacing-md;
}

.card__link-overlay {
    inset: 0;
    position: absolute;
}
