/* Underline animado */

/* Innecesario si no querés que cambie el color cuando estás encima del link */
nav ul:not(.sidebar) li:not(.menu-button) a:hover:not([href*="github.com"]) {
    font-weight: 900;
    transition: font-weight 0.5s ease-in;
}

nav ul:not(.sidebar) li:not(.menu-button) a:not([href*="github.com"])::before {
    content: ""; /* contenido que se puedes mostrar conjunto al underline; también animado */
    position: absolute;
    width: 100%; /* largo del underline total */
    height: 2px; /* ancho del underline */
    bottom: -3px; /* ubicación del underline desde el margen inferior */
    left: 0;
    background-color: #ffffff; /* color del underline */
    transform: scaleX(0); /* oculta el underline inicialment; cambiando el valor hace que se muestre más o menos antes de realizada la animación */
    transition: transform 0.3s ease;
    transform-origin: center; /* origen de la animación*/
    will-change: transform; /* optimización para dispositivos de bajos recursos */
}

nav ul:not(.sidebar) li:not(.menu-button) a:not([href*="github.com"]) img {
    padding-bottom: 3px;
}

nav ul:not(.sidebar) li:not(.menu-button) a:hover:not([href*="github.com"])::before {
    transform: scaleX(1);
}