.interactive-form-text-item {
  display: flex;
  flex-direction: column;
  align-self: flex-start;
  height: 100%;

  .interactive-form-text-item-form-container {
    background: var(--color-brand-secondary-600);
    padding: var(--spacing-medium) var(--spacing-small);

    @media (width >= 768px) {
      padding: var(--spacing-big) var(--spacing-medium);
    }
  }

  .interactive-form-text-item-title,
  .interactive-form-text-item-text {
    color: var(--text-color);
  }

  .interactive-form-text-item-text p {
    font-size: var(--body-font-size-l);

    @media (width >= 768px) {
      font-size: var(--body-font-size-xl);
    }
  }

  .interactive-form-text-item-title * {
    font-weight: var(--font-weight-800);
    font-size: var(--body-font-size-xxl);
    margin-top: 0;
    margin-bottom: var(--spacing-small);
    word-break: break-word;
    hyphens: auto;
    overflow-wrap: break-word;

    @media (width >= 768px) {
      margin-top: var(--spacing-l);
      font-size: var(--body-font-size-2xl-3xl);
    }

    @media (width >= 1400px) {
      font-size: var(--body-font-size-2xl-3xl-xxxl);
    }
  }

  .interactive-form-text-item-container-text {
    :is(h1, h2, h3, h4, h5, h6) {
      margin-top: 0;
      margin-bottom: var(--spacing-xbig);
      font-size: var(--heading-font-size-xl);
      line-height: var(--heading-line-height-l);

      @media (width >= 1440px) {
        line-height: var(--heading-line-height-xl);
      }
    }
  }
}

.bg-blue-dark .interactive-form-text-item {
  .interactive-form-text-item-title,
  .interactive-form-text-item-text {
    color: var(--color-neutral-50);
  }
}