/*-------------------------------------------------
    [ ## Heading ]
*/
h1, h2, h3, h4, h5, h6 {
	clear: both;
	line-height: $font__line-height-heading;
	color: $color__heading;
	font-weight: 600;
  -webkit-font-smoothing: antialiased;
  font-family: $font_heading;
}
h1 {
  font-size: $heading__one;
  @media only screen and (max-width: 991px) {
    font-size: 40px;
  }
  @media only screen and (max-width: 575px) {
    font-size: 30px;
  }
}
h2 {
  font-size: $heading__two;
  @media only screen and (max-width: 991px) {
    font-size: 32px;
  }
  @media only screen and (max-width: 575px) {
    font-size: 28px;
  }
}
h3 {
  font-size: $heading__three;
  @media only screen and (max-width: 991px) {
    font-size: 20px;
  }
}
h4 {
  font-size: $heading__four;
}
h5 {
  font-size: $heading__five;
}
h6 {
  font-size: $heading__six;
}
h1 a,
h2 a,
h3 a,
h4 a,
h5 a {
  color: inherit;
  text-decoration: none;
}
h1 a:hover,
h2 a:hover,
h3 a:hover,
h4 a:hover {
  color: inherit;
  text-decoration: none;
}
.section-header-wrapper{
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  justify-content: space-between;
  margin-bottom: 50px;
  @media only screen and (max-width: 991px) {
    margin-bottom: 30px;
  }
  .section-header{
    margin-bottom: 0;
    width: 50%;
    @media only screen and (max-width: 1199px) {
      width: 70%;
    }
    @media only screen and (max-width: 991px) {
      width: 100%;
      margin-bottom: 20px;
    }
  }
}
.sub-title{
  font-size: 14px;
  text-transform: uppercase;
  font-weight: 600;
  color: $text--base;
  margin-bottom: 20px;
  @media only screen and (max-width: 575px) {
    font-size: 12px;
  }
}
.section-header{
  margin-bottom: 50px;
  position: relative;
  z-index: 9;
  @media only screen and (max-width: 991px) {
    margin-bottom: 30px;
  }
  &.white{
    .section-title{
      color: $white;
    }
    p{
      color: $white;
    }
  }
  &.left{
    margin-bottom: 30px;
  }
  .section-title {
    margin-bottom: 20px;
    position: relative;
    font-weight: 700;
    margin-top: -8px;
    text-transform: capitalize;
    @media only screen and (max-width: 991px) {
      margin-top: -5px;
    }
    span{
      color: $text--base;
    }
    &.two{
      text-transform: unset;
    }
  }
  p{
    margin-top: 10px;
  }
}