%h1 
  %span Here is some multi line text

@import url('https://fonts.googleapis.com/css?family=Red+Hat+Display:900&display=swap');

$color: #111fff;

body {
  display: grid;
  place-content: center;
  height: 100vh;
  background: $color;
  font-family: 'Red Hat Display', sans-serif;
}

h1 {
  font-size: 10vw;
  max-width: 75vw;
  color: #fefefe;

  span {
    background-image: linear-gradient(
      transparent calc(65% - 5px),
      darken($color, 15%) 5px,
    );
    background-size: 0;
    background-repeat: no-repeat;
    display: inline;
    transition: 0.5s ease;
  }
  
  &:hover {
    span {
      background-size: 100%;
    }
  }
}