#hero .container {
  padding: 0 15px;
  min-height: unset;
}

#hero .inner {
  background-image: image-set(
    url('../../images/about-us/about-hero.png') 1x,
    url('../../images/about-us/about-hero@2x.png') 2x);
}

#hero .title {
  font-size: 46px;
}

@media screen and (-webkit-min-device-pixel-ratio:0) {
  #hero .title {
    letter-spacing: -1px;
  }
}

#hero p {
  font-size: 18px;
  line-height: 26px;
  max-width: 686px;
}

@media screen and (max-width: 767px ) {
  #hero .inner {
    padding: 22px 20px 6px 20px;
  }
}

@media screen and (max-width: 567px ) {
  #hero .title {
    font-size: 36px;
  }
  #hero p {
    font-size: 16px;
    line-height: 24px;
    margin-top: 5px;
  }
}

@media screen and (max-width: 360px ) {
  #hero .title {
    font-size: 31px;
  }
}