.promo-card {
  display: grid;
  gap: var(--gap-s);
  align-content: start;
  min-width: 240px;
  height: auto;
  border-radius: var(--border-radius-400);
  transition: box-shadow var(--transition);
}
@media (min-width: 1025px) {
  .promo-card {
    padding: var(--gap-s);
  }
}
@media (min-width: 1025px) and (hover: hover) {
  .promo-card:hover {
    box-shadow: var(--box-shadow-300);
  }
  .promo-card:hover .promo-card__title {
    color: var(--text-primary, var(--primary-500, #087BF7));
  }
}
.promo-card:focus-visible {
  box-shadow: var(--box-shadow-300);
}
.promo-card:focus-visible .promo-card__title {
  color: var(--text-primary, var(--primary-500, #087BF7));
}
.promo-card:active .promo-card__title {
  color: var(--text-primary-pressed, var(--primary-700, #06467F));
}
.promo-card__content {
  display: grid;
  gap: var(--gap-xxs);
  contain: inline-size;
}
.promo-card__image-container {
  position: relative;
  border-radius: var(--border-radius-300);
  overflow: hidden;
  aspect-ratio: 3/2;
}
@media (min-width: 768px) {
  .promo-card__image-container {
    min-width: 0;
  }
}
.promo-card__image {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.promo-card__image--empty {
  background-color: var(--background-neutral, var(--base-100, #F4F5F6));
  background-position: center;
  background-repeat: no-repeat;
}
.promo-card__labels {
  position: absolute;
  bottom: 0;
  left: 0;
  padding: 6px;
  display: flex;
  flex-wrap: wrap;
  gap: var(--gap-3xs);
  max-width: 100%;
}
.promo-card__label {
  min-width: 0;
}
.promo-card__label::part(text) {
  font-size: var(--font-size-xs, 12px);
}
.promo-card__title {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  word-break: break-word;
  font-size: var(--font-size-m, 16px);
  font-weight: 600;
  line-height: var(--line-height-m, 1.5);
  color: var(--text-default, var(--base-800, #171718));
  transition: color var(--transition, var(--transition-duration, 300ms) var(--transition-timing-function, ease));
}
@media (hover: hover) {
  .promo-card__title:hover {
    color: var(--text-primary, var(--primary-500, #087BF7));
  }
}
.promo-card__title:focus-visible {
  color: var(--text-primary, var(--primary-500, #087BF7));
}
.promo-card__title:active {
  color: var(--text-primary-pressed, var(--primary-700, #06467F));
}
.promo-card__description {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  word-break: break-word;
  font-size: var(--font-size-s, 14px);
  font-weight: 400;
  line-height: var(--line-height-s, 1.4);
  color: var(--text-secondary-color, var(--base-600, #5E5E62));
}
.promo-card__date {
  font-size: var(--font-size-s, 14px);
  font-weight: 400;
  line-height: var(--line-height-s, 1.4);
  display: flex;
  gap: var(--gap-xxs);
  color: var(--text-tertiary, var(--base-400, #919196));
}