带循环从左到右加下划线

Question

我一直试图在此网站上执行相同的文本下划线效果

https://themads.agency/（单击汉堡菜单上的链接）

到目前为止，我可以在悬停时进行下划线显示，但是如何使它重复出现？

.HvrUnderline{
position:relative;
text-decoration:none;
display:inline-block;
}
.HvrUnderline:after {
    display: block;
    content: '';
    border-bottom: solid 3px #F16A70;
    transform: scaleX(0);
    transition: transform 250ms ease-in-out;
    transform-origin: 100% 50%
}
.HvrUnderline:hover:after {
    transform: scaleX(1);
    transform-origin: 0 50%;
}

非常感谢您的帮助