.card {
    overflow: hidden;
    margin: 0;
}

.card__image {
    display: flex;
    height: 250px;
    justify-content: center;
    align-items: center;
    align-self: stretch;
    margin: 0;
}

.card__image img {
    object-fit: cover;
    width: 100%;
    height: 100%;
    /* Requires focal point plugin: https://github.com/hirasso/focal-point-picker */
    object-position: calc(var(--focal-point-left, 0.5) * 100%) calc(var(--focal-point-top, 0.5) * 100%);
}

.card__content {
    display: flex;
    height: 202px;
    padding: var(--wp--custom--spacing--2-rem);
    flex-direction: column;
    align-items: flex-start;
    align-self: stretch;
    background: white;
}

.card__content > * {
    margin: 0;
}

.card__content__date {
    font-size: 14px;
    margin-bottom: 1em;
    color: var(--wp--preset--color--vivid-red);
}

.card__content__articlenumber {
    margin: 0 0 var(--wp--custom--spacing--1-rem) 0;
}

.card__content__description {
    margin: auto 0 0 0;
    max-height: calc(1.25rem * 3);
    overflow: hidden;
}

.card__content .wp-block-button__link {
    text-align: left;
}

.card__content__button {
    margin-top: auto;
}

.card--product {
    display: flex;
    max-width: 312px;
    padding: 0;
    flex-direction: column;
    align-items: flex-start;
    border-radius: 4px;
    box-shadow: 0px 5px 20px 0px rgba(0, 0, 0, 0.1);
}

.card--news {
    display: flex;
    max-width: 312px;
    padding: 0;
    flex-direction: column;
    align-items: flex-start;
    border-radius: 4px;
    box-shadow: 0px 5px 20px 0px rgba(0, 0, 0, 0.1);
}

.card--news .card__image {
    height: 200px;
}
