@charset "UTF-8";

// Gradient hack to get our custom underline to wrap:
// https://www.dannyguo.com/blog/animated-multiline-link-underlines-with-css/
@function underline-hack($color) {
  // Calculate lighter underline color compared to text color by
  // mix()'ing with background (#fff) to give the impression of
  // opacity but with MUCH better compatibility.
  $color-opaque: mix($color, $color-background, $link-opacity);

  // Return non-gradient linear-gradient():
  @return linear-gradient($color-opaque, $color-opaque);
}

// Web fonts (see components/_webfonts.scss)
@mixin font-face($family, $src-local, $src-local-alt, $src,
                 $style: normal, $weight: normal, $display: swap) {
	@font-face {
    font-family: $family;
    font-style: $style;
    font-weight: $weight;
    font-display: $display;
    src: local('#{$src-local}'), local('#{$src-local-alt}'),
         url('#{$src}.woff2') format('woff2'),
         url('#{$src}.woff') format('woff');
    //   url('#{$src}.ttf') format('truetype'),
    //   url('#{$src}.eot') format('embedded-opentype');
  }
}