@media (max-width: 1199px) {
  .am-about {
    --am-h2-size: 48px;
    --am-h2-line-height: 54px;
    --am-h3-size: 27px;
    --am-h3-line-height: 32px;
    --am-h4-size: 21px;
    --am-h4-line-height: 27px;
    --am-section-y: 70px;
    --am-section-head-y: 42px;
  }

  .am-milestone-grid {
    gap: 22px;
  }
}

@media (max-width: 1024px) {
  .am-about {
    --am-h2-size: 44px;
    --am-h2-line-height: 50px;
    --am-h3-size: 26px;
    --am-h3-line-height: 31px;
    --am-h4-size: 20px;
    --am-h4-line-height: 26px;
  }

}

@media (max-width: 991px) {
  .am-about {
    --am-h2-size: 40px;
    --am-h2-line-height: 46px;
    --am-h3-size: 25px;
    --am-h3-line-height: 30px;
    --am-h4-size: 20px;
    --am-h4-line-height: 26px;
  }

  .am-fluid {
    padding-left: 40px;
    padding-right: 40px;
  }

  .am-milestone-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .am-milestone {
    padding: 24px;
  }
}

@media (max-width: 768px) {
  .am-about {
    --am-h2-size: 34px;
    --am-h2-line-height: 40px;
    --am-h3-size: 23px;
    --am-h3-line-height: 28px;
    --am-h4-size: 19px;
    --am-h4-line-height: 25px;
    --am-section-y: 56px;
    --am-section-head-y: 34px;
  }

  .am-fluid {
    padding-left: 20px;
    padding-right: 20px;
  }

  .am-about-hero__copy {
    padding: 72px 0;
  }
}

@media (max-width: 767px) {
  .am-about {
    --am-h2-size: 30px;
    --am-h2-line-height: 36px;
    --am-h3-size: 22px;
    --am-h3-line-height: 27px;
    --am-h4-size: 18px;
    --am-h4-line-height: 24px;
    --am-section-y: 48px;
    --am-section-head-y: 30px;
  }

  .am-milestone-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 575px) {
  .am-fluid {
    padding-left: 16px;
    padding-right: 16px;
  }

  .am-about-hero__copy {
    padding: 56px 0;
  }
}

@media (max-width: 330px) {
  .am-about {
    --am-h2-size: 28px;
    --am-h2-line-height: 34px;
    --am-h3-size: 21px;
    --am-h3-line-height: 26px;
    --am-h4-size: 17px;
    --am-h4-line-height: 23px;
  }
}