sass-site/source/assets/stylesheets/foundation/_headings.scss

// ===========================================================================
// HEADINGS



$heading-1-text-color: $venus       !default;
$heading-2-text-color: $pale-sky    !default;
$heading-3-text-color: $regent-grey !default;



// ---------------------------------------------------------------------------
// MOBILE

#{headings(1, 3)} {
  @extend %block-text;
  line-height: $line-height-reset;
}

h1,
h3 {
  @extend %chaparral-pro-regular;
  letter-spacing: -0.05em;
}

h1 {
  @include font-size($font-size-x-large);
  color: $heading-1-text-color;
}

h2 {
  @extend  %caps;
  color: $heading-2-text-color;
}

h3 {
  padding-bottom: 0;
  @include font-size($font-size-large);
  color: $heading-3-text-color;
}



// ---------------------------------------------------------------------------
// SMALL TABLET

@mixin headings-small-tablet {
  h1 { @include font-size($font-size-xx-large); }
}