// Headings
//
// Markup: headings.twig
//
// Weight: 1
//
// Style guide: base.type.headings

h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 {
  font-family: $headings-font-family;
  font-weight: $headings-font-weight;
  line-height: $headings-line-height;
  margin: 1rem 0 0.5rem;
  transition: 0.3s;

  a {
    font-weight: inherit;
    color: inherit;

    &:focus,
    &:hover {
      color: inherit;
    }
  }

  small,
  .small {
    font-weight: normal;
    line-height: 1;
    color: $headings-small-color;
  }
}

h1, .h1,
h2, .h2,
h3, .h3 {

  small,
  .small {
    font-size: 65%;
  }
}
h4, .h4,
h5, .h5,
h6, .h6 {

  small,
  .small {
    font-size: 75%;
  }
}

h1, .h1 {
  font-size: 2rem;
  font-weight: 700;

  @include for-tablet-landscape-up {
    font-size: 3rem;
  }

}

h2, .h2 {
  font-size: 1.5rem;

  @include for-tablet-landscape-up {
    font-size: 2rem;
  }
}

h3, .h3 {
  font-size: 1.25rem;

  @include for-tablet-landscape-up {
    font-size: 1.5rem;
  }
}

h4, .h4 {
  font-size: 1.2rem;

  @include for-tablet-landscape-up {
    font-size: 1.25rem;
  }

}

h5, .h5{
  font-size: 1rem;
  line-height: 1.625rem;
}

h6, .h6 {
  font-size: 0.875rem;
}
