/* BLOCK: The main component container */
.card {
  border-radius: 1.8rem;
}

/* ELEMENTS: Semantic parts of the card */
.card__header {
}

.card__image {

}

.card__image img {
  aspect-ratio: 4/3;
}

.card__body {
}

.card__title {
}

.card__text {
}

.card__footer {
}

.card__button {
}

/* MODIFIERS: Variations of the Block (.card) */
.card--small {
}

.card--large {
}

.card--primary {
}

.card--warning {
}

.card--horizontal {
}

.card--disabled {
}

/* MODIFIERS: Variations of an Element (e.g., .card__image) */
.card__image--rounded {
}

.card__title--uppercase {
}