// Typography
// ==========================================================================

// Text
p {
  margin-top: em(5, 16 );
  margin-bottom: em(20, 16);

  @include media(tablet) {
    margin-top: em(5);
    margin-bottom: em(20);
  }

}

// Lede, or intro text
.lede {
  @include core-24;
  font-family: inherit;
}

// Set a max-width for text blocks
// Less than 75 characters per line of text
.text {
  max-width: 30em;
}

form .text {
  max-width: none;
}

// Code styles
pre,
code {
  font-size: 13px;
  line-height: 19px;
  color: $black;
  background-color: $highlight-colour;
  border: 1px solid $border-colour;
  padding: 3px 7px;
}


h1 {
  @include heading-48();
  @include bold-48();
  font-family: inherit;
}

h2 {
  @include heading-36();
  @include bold-36();
  font-family: inherit;
}

h3 {
  @include heading-24;
  @include bold-24();
  font-family: inherit;
}

h4 {
  @include bold-19();
  font-family: inherit;
}