.section-api-rich-text__content {
  margin-top: 1.625rem;

  @media (min-width: 990px) {
    margin-top: 86px;
  }
}

.section-api-rich-text__content__wrapper {
  max-width: 335px;

  @media (min-width: 990px) {
    max-width: 582px;
  }
}

.section-api-rich-text > .section-api-rich-text__content .section-api-rich-text__content__text {
  font-size: 1rem;
  font-weight: var(--font-weight-medium);

  @media (min-width: 990px) {
    font-size: 1.375rem;
  }
}

.section-api-rich-text > .section-api-rich-text__content .section-api-rich-text__content__title {
  font-size: 2rem;

  @media (min-width: 990px) {
    font-size: 47.15px;
  }
}

.section-api-description {
  max-width: 712px;
}

.section-api-description .section-api-description__item {
  width: 335px;
  border-radius: 0.75rem;
  padding-left: 1.5rem;
  padding-right: 1.5rem;

  @media (min-width: 375px) {
    margin: 0 auto;
  }

  @media (min-width: 990px) {
    max-width: 348px;
    width: 100%;
    padding-left: 1.75rem;
    padding-right: 1.75rem;
  }
}

.section-api-description .section-api-description__item__title {
  font-weight: var(--font-weight-medium);
  font-size: 0.9375rem;
}

.section-api-description .section-api-description__item__description {
  font-size: 13px;

  @media (min-width: 990px) {
    font-size: 0.875rem;
  }
}

.api-page-contact-form > .api-page-contact-form__container {
  border: 1px solid var(--color-blue);
  border-radius: 1.5rem;
  margin: 4.6875rem 1.25rem 127px;

  @media (min-width: 720px) {
    margin: 4.6875rem auto 127px;
  }

  @media (min-width: 990px) {
    border-radius: 1.25rem;
    margin: 2.5rem auto 127px;
  }
}

.api-page-contact-form .api-page-contact-form__form input[name="contact[name]"],
.api-page-contact-form .api-page-contact-form__form input[name="contact[email]"],
.api-page-contact-form .api-page-contact-form__form input[name="contact[phone]"],
.api-page-contact-form .api-page-contact-form__form textarea[name="contact[body]"], 
.api-page-contact-form .api-page-contact-form__form input[type="submit"] {
  box-shadow: inset 0 0 0 var(--input-border-width) var(--color-blue);
}

.api-page-contact-form > .api-page-contact-form__container .api-page-contact-form__form input:not([type="submit"]) {
  color: var(--color-blue);
}

.api-page-contact-form .api-page-contact-form__form input[name="contact[name]"]:focus,
.api-page-contact-form .api-page-contact-form__form input[name="contact[email]"]:focus,
.api-page-contact-form .api-page-contact-form__form input[name="contact[phone]"]:focus,
.api-page-contact-form .api-page-contact-form__form textarea[name="contact[body]"]:focus {
  outline-color: var(--color-blue);
}

.contact__gooey-btn {
  background-color: var(--color-blue);
}

.contact__gooey-btn__surface:hover {
  color: var(--color-blue);
}