.decorated_text
{
    position: relative;
}

.decorated_text:after
{
    position:                   absolute;
    bottom:                     0;
    left:                       0;

    width:                      100%;
    height:                     0.1em;

    background-color:           var(--color-palette-white-smoke);

    opacity:                    1;

    transform:                  scaleX(0);
    transform-origin:           bottom right;
    transition-property:        transform;
    transition-duration:        0.2s;
    transition-timing-function: ease-out;
    transition-delay:           0s;

    content:                    "";
    transition-behavior:        normal;
}

.decorated_text:hover::after,
.decorated_text:focus::after
{
    transform:        scale(1);
    transform-origin: bottom left;

}