.c-hero {
  position: relative;
  padding-top: ($spacer * 6);
  margin: 0 auto;
  color: $light;
}

.c-hero__img {
  position: absolute;
  z-index: 0;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background-position: center;
  background-size: cover;
}

.c-hero__body {
  position: relative;
  z-index: 1;
  max-width: $site-max-width;
  padding: ($spacer * 2);
  margin: 0 auto;
}

.c-hero__title {
  @include trafalgar;
}

@include md {
  .c-hero__title,
  .c-hero__text {
    width: 60%;
  }
}