.badge-wrapper {
  position: absolute;
  left: var(--hh-space-xs);
  top: var(--hh-space-xs);
  display: flex;
  gap: var(--hh-space-xs);
  z-index: 1;
}

.badge-item {
  display: block;
  padding: var(--hh-space-xs) var(--hh-space-sm);
  background-color: var(--hh-color-reverse);
  border-radius: var(--hh-border-radius-sm);
  text-align: center;
  text-transform: capitalize;
}

@media screen and (max-width: 749px) {
  .badge-item {
    padding: var(--hh-space-2xs) var(--hh-space-xs);
  }

  .badge-item.caption {
    --hh-font-size-mobile: 12;
  }
}