@charset "UTF-8";
/* Плашка даты: день над месяцем (Figma: Date 4223:11606 / 4680:27596 / 4680:28202).
   По умолчанию — малая (H3), тёмная. --large — крупная (H2), --white — светлая, --green — на зелёной карточке (фон green-dark). */
.date {
  font-family: var(--font-heading);
  font-weight: 800;
  text-transform: uppercase;
  font-size: 1.75rem;
  line-height: 1;
}
@media (min-width: 1280px) {
  .date {
    font-size: 2rem;
  }
}
.date {
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  padding: 0.375rem 0.625rem;
  overflow: hidden;
  color: var(--color-white);
  text-align: center;
  background-color: var(--color-black-bg);
  border-radius: var(--radius-6);
}
@media (min-width: 1280px) {
  .date {
    padding: 0.5rem 0.75rem;
    border-radius: var(--radius-8);
  }
}
.date__day {
  margin-bottom: -0.25rem;
}
@media (min-width: 1280px) {
  .date__day {
    margin-bottom: 0;
  }
}
.date--large {
  font-family: var(--font-heading);
  font-weight: 800;
  text-transform: uppercase;
  font-size: 3rem;
  line-height: 0.96;
}
@media (min-width: 768px) {
  .date--large {
    font-size: 3.5rem;
    line-height: 0.92;
  }
}
@media (min-width: 1280px) {
  .date--large {
    font-size: 4rem;
    line-height: 0.94;
  }
}
.date--large {
  padding: 0.25rem 0.625rem;
  border-radius: var(--radius-8);
}
@media (min-width: 768px) {
  .date--large {
    padding: 0.25rem 0.75rem;
  }
}
.date--large .date__day {
  margin-bottom: -0.25rem;
}
.date--white {
  color: var(--color-black-bg);
  background-color: var(--color-white);
}
.date--green {
  background-color: var(--color-green-dark);
}
