.hero-content {
  width: min(90%, 850px);

  display: flex;
  flex-direction: column;
  align-items: center;

  gap: 16px;

  text-align: center;
}

.hero-copy {
  width: min(90%, 850px);
  display: flex;
  flex-direction: column;
  align-items: center;

  gap: clamp(16px, 2vw, 24px);
  text-align: center;
}

.hero-logo {
  width: clamp(120px, 15vw, 180px);
}

#hero-title {
  font-size: clamp(1rem, 1.7vw, 3.5rem);
  line-height: 1.1;
  font-weight: 600;
  text-wrap: balance;
}

#top-grid{
    display: flex;
    justify-content: center;
    align-items: center;

    flex-wrap: wrap;

    gap: 44px;
}


@media (max-width: 992px) {
  .hero-copy {
    width: min(92%, 700px);
  }

  #hero-title {
    font-size: clamp(1rem, 2.2vw, 2.4rem);
  }
}

@media (max-width: 768px) {

  .hero-copy {
    width: 100%;
  }

  #hero-title {
    font-size: clamp(1rem, 2.2vw, 2rem);
  }



  #hero {
    min-height: auto;

    padding: 48px 20px;

    gap: 40px;
  }

  #top-grid {
    gap: 64px;
  }

  #top-grid .company-logo {
    aspect-ratio: auto;
  }

}