.page-section__heading {
  margin-top: 3rem;
  padding: 2rem 0;
  text-align: center;
}

.page-section__title {
  font-family: Anton, "Roboto Condensed", Helvetica, Arial, sans-serif;
  font-size: 2.11765rem;
  font-weight: 400;
  line-height: 1;
  text-transform: uppercase;
  margin: 0;
  color: #008C44;
}

@media (min-width: 768px) {
  .page-section__title {
    font-size: 3.76471rem;
  }
}

.page-section__intro {
  margin-top: 0.11765rem;
  font-family: "Roboto Condensed", Helvetica, Arial, sans-serif;
  font-size: 1.05882rem;
  line-height: 1.2;
  letter-spacing: -0.015em;
  color: #008C44;
}

@media (min-width: 768px) {
  .page-section__intro {
    font-size: 1.41176rem;
  }
}

.page-section__heading--bg {
  background-color: #008C44;
  color: #FFFFFF;
}

.page-section__heading--bg .page-section__title,
.page-section__heading--bg .page-section__intro {
  color: currentColor;
}

.page-section__heading--bg-offset-right {
  background-color: #008C44;
  color: #FFFFFF;
}

@media (min-width: 1200px) {
  .page-section__heading--bg-offset-right {
    position: relative;
    overflow: hidden;
    background: none;
  }
  .page-section__heading--bg-offset-right::before {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: #008C44;
    -webkit-transform: translateX(-100px);
    transform: translateX(-100px);
  }
}

.page-section__heading--bg-offset-right .page-section__heading-content {
  position: relative;
}

.page-section__heading--bg-offset-right .page-section__title,
.page-section__heading--bg-offset-right .page-section__intro {
  color: currentColor;
}

.page-section__heading--bg-offset-left {
  background-color: #008C44;
  color: #FFFFFF;
}

@media (min-width: 1200px) {
  .page-section__heading--bg-offset-left {
    position: relative;
    overflow: hidden;
    background: none;
  }
  .page-section__heading--bg-offset-left::before {
    content: '';
    position: absolute;
    right: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: #008C44;
    -webkit-transform: translateX(100px);
    transform: translateX(100px);
  }
}

.page-section__heading--bg-offset-left .page-section__heading-content {
  position: relative;
}

.page-section__heading--bg-offset-left .page-section__title,
.page-section__heading--bg-offset-left .page-section__intro {
  color: currentColor;
}
