//mixin-font-face
@function str-replace($string, $search, $replace: "") {
  $index: str-index($string, $search);
  @if $index {
    @return str-slice($string, 1, $index - 1) + $replace + str-replace(str-slice($string, $index + str-length($search)), $search, $replace);
  }
  @return $string;
}

@mixin font-face($name, $path, $weight: null, $style: null, $exts: woff2 woff ttf svg) {
  $src: null;
  $extmods: (
    svg: "#" + str-replace($name, " ", "_")
  );
  $formats: (
    ttf: "truetype"
  );
  @each $ext in $exts {
    $extmod: if(map-has-key($extmods, $ext), $ext + map-get($extmods, $ext), $ext);
    $format: if(map-has-key($formats, $ext), map-get($formats, $ext), $ext);
    $src: append($src, url(quote($path + "." + $extmod)) format(quote($format)), comma);
  }
  @font-face {
    font-family: quote($name);
    font-style: $style;
    font-weight: $weight;
    src: $src;
  }
}

//generate-font-face
@include font-face("NeueHaasGrotDisp-45Light", "assets/fonts/NeueHaasGrotDisp-45Light", 300, normal, woff);
@include font-face("NeueHaasGrotDisp-55Roman", "assets/fonts/NeueHaasGrotDisp-55Roman", normal, normal, woff);
@include font-face("NeueHaasUnicaPro", "assets/fonts/NeueHaasUnicaPro-Regular", normal, normal, woff);
@include font-face("NeueHaasUnicaPro", "assets/fonts/NeueHaasUnicaPro-Medium", 500, normal, woff);

%LaTypeFaceDisplay {
  font-size: 34px;
  font-family: NeueHaasGrotDisp-45Light, sans-serif;
  font-weight: 300;
  letter-spacing: -1.4px;
  line-height: 40px;
}

%LaTypeFaceTitle-1 {
  font-size: 23px;
  font-family: NeueHaasGrotDisp-55Roman, sans-serif;
  font-weight: normal;
  letter-spacing: -0.55px;
  line-height: 28px;
}

%LaTypeFaceTitle-2 {
  font-size: 17px;
  font-family: NeueHaasUnicaPro, sans-serif;
  font-weight: normal;
  letter-spacing: -0.6px;
  line-height: 20.4px;
}

%LaTypeFaceTitle-3 {
  font-size: 15px;
  font-family: NeueHaasUnicaPro, sans-serif;
  font-weight: normal;
  letter-spacing: -0.62px;
  line-height: 18px;
}

%LaTypeFaceTitle-4 {
  font-size: 13px;
  font-family: NeueHaasUnicaPro, sans-serif;
  font-weight: normal;
  letter-spacing: -0.34px;
  line-height: 16px;
}

%LaTypeFaceCaption {
  font-size: 13px;
  font-family: NeueHaasUnicaPro, sans-serif;
  font-weight: 500;
  letter-spacing: -0.34px;
  line-height: 16px;
}

%LaTypeFaceButton {
  font-size: 17px;
  font-family: NeueHaasUnicaPro, sans-serif;
  font-weight: 500;
  text-align: center;
  letter-spacing: -0.7px;
  line-height: 20.4px;
}

%LaTypeFaceBold {
  font-family: NeueHaasUnicaPro, sans-serif;
  font-weight: 500;
}
