.formatto-database-page-hero {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  min-height: 51.096875rem;
  padding: 8rem 19.9375rem;
  background: radial-gradient(29.18% 20% at 50% 0%, #fafafa 0%, #eef9ff 100%);
}

.formatto-database-page-hero__content {
  display: flex;
  flex: 0 0 32.75rem;
  flex-direction: column;
  gap: 3.5rem;
  align-items: flex-start;
  justify-content: center;
  width: 32.75rem;
  word-break: break-word;
}

.formatto-database-page-hero h1,
.formatto-database-page-hero p {
  margin: 0;
  font-family: var(--font-body);
  text-box-edge: cap alphabetic;
}

.formatto-database-page-hero h1 {
  width: 32.75rem;
  color: var(--color-blue-600);
  font-size: 2.5rem;
  font-weight: 600;
  line-height: 1.2;
  letter-spacing: -0.025rem;
}

.formatto-database-page-hero h1 strong {
  color: #00588a;
  font-weight: 600;
}

.formatto-database-page-hero__text {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
  width: 32.75rem;
  color: #004972;
}

.formatto-database-page-hero__text p {
  width: 100%;
  font-size: 1rem;
  font-weight: 500;
  line-height: 1.5;
  letter-spacing: -0.01rem;
}

.formatto-database-page-hero__text strong {
  font-weight: 700;
}

.formatto-database-page-hero__media {
  position: relative;
  flex: 0 0 43.12475rem;
  width: 43.12475rem;
  height: 35.0971875rem;
}

.formatto-database-page-hero__image {
  position: absolute;
  overflow: hidden;
  border-radius: 1.6653125rem;
  background: #e3e5e7;
  box-shadow: 0 0 3.4555rem rgba(0, 47, 76, 0.1);
}

.formatto-database-page-hero__image img {
  position: absolute;
  max-width: none;
  object-fit: cover;
  pointer-events: none;
}

.formatto-database-page-hero__image--doctor {
  left: 0;
  top: 0;
  z-index: 1;
  width: 25.9855625rem;
  height: 26.331125rem;
}

.formatto-database-page-hero__image--doctor img {
  left: -10.78125rem;
  top: -14.375rem;
  width: 42.9176875rem;
  height: 42.9176875rem;
}

.formatto-database-page-hero__image--dentist {
  left: 15.94125rem;
  top: 13.10875rem;
  z-index: 2;
  width: 27.1835rem;
  height: 21.9884375rem;
}

.formatto-database-page-hero__image--dentist img {
  left: -9.86rem;
  top: -9.721875rem;
  width: 37.04325rem;
  height: 37.04325rem;
}

@media (min-width: 1280px) and (max-width: 1919px) {
  .formatto-database-page-hero {
    padding-right: calc((100vw - 80rem) / 2);
    padding-left: calc((100vw - 80rem) / 2);
  }
}

@media (min-width: 768px) and (max-width: 1279px) {
  .formatto-database-page-hero {
    min-height: 63.871094vw;
    justify-content: flex-start;
    gap: 5.3125vw;
    padding: 10vw 5vw;
  }

  .formatto-database-page-hero__content {
    flex-basis: 40.9375vw;
    gap: 4.375vw;
    width: 40.9375vw;
  }

  .formatto-database-page-hero h1,
  .formatto-database-page-hero__text {
    width: 40.9375vw;
  }

  .formatto-database-page-hero h1 {
    font-size: 3.125vw;
    letter-spacing: -0.03125vw;
  }

  .formatto-database-page-hero__text {
    gap: 1.875vw;
  }

  .formatto-database-page-hero__text p {
    font-size: 1.25vw;
    letter-spacing: -0.0125vw;
  }

  .formatto-database-page-hero__media {
    flex-basis: 43.75vw;
    width: 43.75vw;
    height: 35.606049vw;
  }

  .formatto-database-page-hero__image {
    border-radius: 1.689458vw;
    box-shadow: 0 0 3.5056vw rgba(0, 47, 76, 0.1);
  }

  .formatto-database-page-hero__image--doctor {
    width: 26.362318vw;
    height: 26.71289vw;
  }

  .formatto-database-page-hero__image--doctor img {
    left: -10.937564vw;
    top: -14.583418vw;
    width: 43.539935vw;
    height: 43.539935vw;
  }

  .formatto-database-page-hero__image--dentist {
    left: 16.172377vw;
    top: 13.29881vw;
    width: 27.577624vw;
    height: 22.30724vw;
  }

  .formatto-database-page-hero__image--dentist img {
    left: -10.002957vw;
    top: -9.862829vw;
    width: 37.580327vw;
    height: 37.580327vw;
  }
}

@media (max-width: 767px) {
  .formatto-database-page-hero {
    flex-direction: column-reverse;
    align-items: flex-start;
    gap: 10vw;
    min-height: auto;
    padding: 10vw 5vw;
  }

  .formatto-database-page-hero__content,
  .formatto-database-page-hero h1,
  .formatto-database-page-hero__text {
    flex-basis: auto;
    width: 90vw;
  }

  .formatto-database-page-hero__content {
    gap: 8vw;
  }

  .formatto-database-page-hero h1 {
    font-size: 8.75vw;
    letter-spacing: -0.0875vw;
  }

  .formatto-database-page-hero__text {
    gap: 4vw;
  }

  .formatto-database-page-hero__text p {
    font-size: 4.071247vw;
    letter-spacing: -0.040712vw;
  }

  .formatto-database-page-hero__media {
    flex-basis: auto;
    width: 90vw;
    height: 73.229vw;
  }

  .formatto-database-page-hero__image {
    border-radius: 4vw;
  }

  .formatto-database-page-hero__image--doctor {
    width: 54.219vw;
    height: 54.94vw;
  }

  .formatto-database-page-hero__image--doctor img {
    left: -22.5vw;
    top: -30vw;
    width: 89.537vw;
    height: 89.537vw;
  }

  .formatto-database-page-hero__image--dentist {
    left: 33.269vw;
    top: 27.351vw;
    width: 56.731vw;
    height: 45.878vw;
  }

  .formatto-database-page-hero__image--dentist img {
    left: -20.573vw;
    top: -20.284vw;
    width: 77.27vw;
    height: 77.27vw;
  }
}
