.offer-card-wrapper,
.offer-card {
  height: 100%;
}

.offer-card-wrapper {
  padding-top: 0;
}

.offer-card__wrapper {
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--surface-soft-blue);
  padding: var(--spacing-30) var(--spacing-18) var(--spacing-27) 0;
  text-align: left;
  height: 100%;
  gap: var(--sizing-2xs);

  @media (width >= 768px) {
    flex-direction: column;
    padding: var(--spacing-28) var(--sizing-xl) var(--spacing-big);
    gap: 0;
  }
}

.offer-card__media {
  position: relative;
  display: flex;
  align-items: center;

  @media (width >= 768px) {
    margin-bottom: var(--spacing-50);
  }
}

.offer-card__background {
  object-fit: contain;
  width: 100%;
}

.offer-card__image {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  object-fit: contain;
  width: 84px;
  height: 84px;

  @media (width >= 768px) {
    width: 122px;
    height: 122px;
  }
}

.offer-card__media picture source {
  display: none;
}

.offer-card__content {
  display: flex;
  width: 100%;
}

.offer-card__text {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-14);

  @media (width >= 768px) {
    gap: var(--sizing-l);
  }
}

.offer-card__title {
  width: 100%;
  color: var(--neutrals-sub-texts-paragraphs);
  font-size: var(--fs-large);
  font-weight: var(--fw-600);
  line-height: 120%;
  letter-spacing: var(--ls-0063);

  @media (width >= 768px) {
    gap: var(--sizing-xl);
  }
}

.offer-card__subtitle {
  width: 100%;
  color: var(--neutrals-sub-texts-paragraphs);
  font-size: var(--fs-medium);
  font-weight: var(--fw-400);
  line-height: 120%;
  letter-spacing: var(--ls-0063);

  @media (width >= 768px) {
    gap: var(--sizing-l);
  }
}