.cards {
  position: relative;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(275px, 1fr));
  gap: clamp(1.125rem, 2.5vw, 2rem);
}

.card {
  display: flex;
  flex-direction: column;
  height: 100%;
}
.card__image img {
  display: block;
  width: 100%;
  height: auto;
}
.card__content {
  display: flex;
  flex-direction: column;
  flex: 1;
  padding: 1.5rem;
  background-color: white;
}
.card__title {
  font-size: 1.25rem;
  text-transform: uppercase;
  font-weight: 500;
}
.card__title:not(:last-child) {
  margin-bottom: 1.125rem;
}
.card__text:not(:last-child) {
  margin-bottom: 1.5rem;
}
.card__buttons {
  margin-top: auto;
}
@media (min-width: 30rem) {
  .card__content {
    padding: 2rem;
  }
}