Generated by SassMeister.com.

SassMeister-input.scss

// ----
// Sass (v3.3.14)
// Compass (v1.0.1)
// Scut (v1.0.1)
// ----

@import "scut";

@mixin typeset( $type: body-copy ) {
  $types: (
    primary-heading: ( font-size: 48px, font-weight: 800 ),
    secondary-heading: ( font-size: 16px, font-weight: 700, line-height: 22px ),
    body-copy: ( font-size: 16px, line-height: 24px ),
    link: ( font-weight: bold, text-decoration: underline )
  );
  
  @each $property, $value in map-get($types, $type) {
    @if (type-of($value) == number and unit($value) == 'px') {
      #{$property}: scut-em($value);
    } @else {
      #{$property}: $value;
    }
    
  }
}

h1 {
  @include typeset(primary-heading);
}

h2 {
  @include typeset(secondary-heading);
}

p {
  @include typeset(body-copy);
}

a {
  @include typeset(link);
}

// _hero.scss
.Hero {
  .Hero-heading {
    @include typeset(secondary-heading);
  }
}

SassMeister-output.css

/*
* Scut, a collection of Sass utilities
* to ease and improve our implementations of common style-code patterns.
* v1.0.1
* Docs at http://davidtheclark.github.io/scut
*/
h1 {
  font-size: 3em;
  font-weight: 800;
}

h2 {
  font-size: 1em;
  font-weight: 700;
  line-height: 1.375em;
}

p {
  font-size: 1em;
  line-height: 1.5em;
}

a {
  font-weight: bold;
  text-decoration: underline;
}

.Hero .Hero-heading {
  font-size: 1em;
  font-weight: 700;
  line-height: 1.375em;
}