.ctr-research-formula {
  background: var(--ctr-research-formula-section-bg, #ffffff);
  padding-top: var(--ctr-research-formula-padding-top, 0px);
  padding-bottom: var(--ctr-research-formula-padding-bottom, 0px);

  @media (max-width: 989px) {
    padding-top: var(--ctr-research-formula-padding-top-mobile, 0px);
    padding-bottom: var(--ctr-research-formula-padding-bottom-mobile, 0px);
  }
}

.ctr-research-formula * {
  box-sizing: border-box;
}

.ctr-research-formula__layout {
  display: flex;
  align-items: stretch;
  width: 100%;
  max-width: var(--ctr-research-formula-max-width, none);
  margin: 0 auto;

  @media (max-width: 989px) {
    flex-direction: column;
  }
}

.ctr-research-formula__media {
  position: relative;
  width: var(--ctr-research-formula-media-width, 50%);
  flex-shrink: 0;
  overflow: hidden;

  @media (max-width: 989px) {
    width: 100%;
    aspect-ratio: 390/250;
    max-height: 350px;
    order: 2;
  }
}

.ctr-research-formula__image {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center center;

  @media (min-width: 990px) {
    position: absolute;
    inset: 0;
  }
}

.ctr-research-formula__image--desktop {
  @media (max-width: 989px) {
    display: none;
  }
}

.ctr-research-formula__image--mobile {
  display: none;

  @media (max-width: 989px) {
    display: block;
  }
}

.ctr-research-formula__image-placeholder {
  width: 100%;
  height: 100%;
  min-height: 280px;
  display: grid;
  place-items: center;
  background: #f1f1f1;
  color: #666b6e;
  font-family: "Instrument Sans", sans-serif;
  font-size: 14px;

  @media (max-width: 989px) {
    min-height: var(--ctr-research-formula-mobile-image-height, 250px);
  }
}

.ctr-research-formula__content {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: var(--ctr-research-formula-content-gap, 32px);
  padding: var(--ctr-research-formula-content-padding-y, 32px) var(--ctr-research-formula-content-padding-x, 50px);

  @media (max-width: 989px) {
    order: 1;
    gap: var(--ctr-research-formula-content-gap-mobile, 32px);
    padding: var(--ctr-research-formula-content-padding-y-mobile, 32px) var(--ctr-research-formula-content-padding-x-mobile, 20px);
  }
}

.ctr-research-formula__title,
.ctr-research-formula__title p {
  margin: 0;
  color: var(--ctr-research-formula-title-color, #08597b);
  font-family: "Playfair Display", serif;
  font-size: var(--ctr-research-formula-title-size, 48px);
  font-weight: 400;
  line-height: 1.2;
  letter-spacing: 0;

  @media (max-width: 989px) {
    font-size: var(--ctr-research-formula-title-size-mobile, 32px);
  }
}

.ctr-research-formula__title em {
  font-style: italic;
}

.ctr-research-formula__text,
.ctr-research-formula__text p {
  margin: 0;
  color: var(--ctr-research-formula-text-color, #0f0f0f);
  font-family: "Instrument Sans", sans-serif;
  font-size: var(--ctr-research-formula-text-size, 16px);
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: 0;

  @media (max-width: 989px) {
    font-size: var(--ctr-research-formula-text-size-mobile, 16px);
  }
}

.ctr-research-formula__text p + p {
  margin-top: 12px;
}

.ctr-research-formula__text strong {
  font-weight: 700;
}

.ctr-research-formula__layout--image-right .ctr-research-formula__media {
  order: 2;

  @media (max-width: 989px) {
    order: 2;
  }
}

.ctr-research-formula__layout--image-right .ctr-research-formula__content {
  order: 1;

  @media (max-width: 989px) {
    order: 1;
  }
}