Animované podtržení textu

Chcete udělat na hover podtržení textu? To lze celkem jednoduše, jenže co dělat, když to chce člověk udělat více smooth, respektive tam přidat nějakou animaci? Níže přikládám kód, kterým toho lze docílit.

a {
  position: relative;
  text-decoration: none;
}

a::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -2px; /* Odsazení podtržení */
  width: 100%;
  height: 2px; /* Šířka podtržení */
  background: #e4c490; /* Barva podtržení */
  transform: scaleX(0); /* Skryje se podtržení */
  transform-origin: left;
  transition: transform 0.3s ease-in-out;
}

a:hover::after {
  transform: scaleX(1); /* Zviditelní se podtržení */
}