/*
 * DO NOT EDIT THIS FILE.
 * See the following change record for more information,
 * https://www.drupal.org/node/3084859
 * @preserve
 */.card { display: flex; overflow: hidden; flex-direction: column; border: 1px solid #ccc; border-radius: 1rem; }
.card .card__image { -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; }
.card .card__categories { display: inline-flex; flex-wrap: wrap; padding: 0.875rem; column-gap: 0.875rem; row-gap: 0.5rem; }
.card .card__categories span { align-items: center; justify-content: center; padding: 0 0.3125rem; color: var(--color--white); border-radius: 0.25rem; background: #0009; font-size: 0.75rem; font-weight: 700; line-height: 1.5rem; }
.card__body { display: flex; flex-direction: column; flex-grow: 1; justify-content: space-between; padding: 1rem 0.75rem; background-color: var(--color--white); gap: 0.5rem; }
.card__body .card__title { flex-grow: 1; color: var(--color--light-gray); font-size: var(--font-size-base); font-weight: 600; }

@media (max-width: 37.5rem) { .card__body .card__title { font-size: var(--font-size-xs); font-weight: 700; } }
.card__body .card__date,
.card__body .card__subtitle { min-width: 1rem; color: var(--text-light-disabled); font-size: var(--font-size-xs); flex-shurink: 0; }

@media (max-width: 37.5rem) { .card__body .card__date,
  .card__body .card__subtitle { font-size: var(--font-size-xxs); font-weight: 400; } }
.card__body .card__subtitle { color: var(--text-light-disabled); font-size: var(--font-size-xs); }

@media (max-width: 37.5rem) { .card__body .card__subtitle { font-size: var(--font-size-xxs); font-weight: 400; } }
.card__body .card__date { justify-content: flex-end; color: var(--text-light-disabled); font-size: var(--font-size-xs); }

@media (max-width: 37.5rem) {
  .card__body .card__date { font-size: var(--font-size-xxs); font-weight: 400; }
  .card__body { padding: 0.625rem; }
}
