/* Micro-animaciones solo para iconos del menú (independientes del VFX del desplegable). */
.navbar .menu-icon-vfx {
    display: inline-flex;
    align-items: center;
    justify-content: center;
}
.navbar .menu-icon-vfx i,
.navbar .menu-icon-vfx img {
    transition: transform 0.35s ease, filter 0.35s ease;
    transform-origin: center center;
    will-change: transform;
}
.navbar .menu-icon-vfx-1 i, .navbar .menu-icon-vfx-1 img { animation: navIconPulse 2.2s ease-in-out infinite; }
.navbar .menu-icon-vfx-2 i, .navbar .menu-icon-vfx-2 img { animation: navIconWiggle 1.8s ease-in-out infinite; }
.navbar .menu-icon-vfx-3 i, .navbar .menu-icon-vfx-3 img { animation: navIconSpin 6s linear infinite; }
.navbar .menu-icon-vfx-4 i, .navbar .menu-icon-vfx-4 img { filter: drop-shadow(0 0 6px rgba(56, 189, 248, 0.9)); }
.navbar .menu-icon-vfx-5 i, .navbar .menu-icon-vfx-5 img { animation: navIconBounce 1.4s ease infinite; }
.navbar .menu-icon-vfx-6 i, .navbar .menu-icon-vfx-6 img { animation: navIconHue 4s linear infinite; }
.navbar .menu-icon-vfx-7 i, .navbar .menu-icon-vfx-7 img { animation: navIconSwing 2s ease-in-out infinite; }
.navbar .menu-icon-vfx-8 i, .navbar .menu-icon-vfx-8 img { animation: navIconFlipY 2.8s ease-in-out infinite; }
.navbar .menu-icon-vfx-9 i, .navbar .menu-icon-vfx-9 img { animation: navIconShake 0.85s ease-in-out infinite; }
.navbar .menu-icon-vfx-10 i, .navbar .menu-icon-vfx-10 img { animation: navIconBreathe 1.8s ease-in-out infinite; }
.navbar .menu-icon-vfx-11 i, .navbar .menu-icon-vfx-11 img { animation: navIconSkew 2.4s ease-in-out infinite; }
.navbar .menu-icon-vfx-12 i, .navbar .menu-icon-vfx-12 img { animation: navIconOrbit 4s linear infinite; }
@keyframes navIconPulse {
    0%, 100% { transform: scale(1); opacity: 1; }
    50% { transform: scale(1.12); opacity: 0.88; }
}
@keyframes navIconWiggle {
    0%, 100% { transform: rotate(0deg); }
    25% { transform: rotate(-7deg); }
    75% { transform: rotate(7deg); }
}
@keyframes navIconSpin { to { transform: rotate(360deg); } }
@keyframes navIconBounce {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-3px); }
}
@keyframes navIconHue {
    0% { filter: hue-rotate(0deg) drop-shadow(0 0 4px #0ea5e9); }
    100% { filter: hue-rotate(360deg) drop-shadow(0 0 4px #a855f7); }
}

@keyframes navIconSwing {
    0%, 100% { transform: rotate(0deg); }
    25% { transform: rotate(14deg); }
    75% { transform: rotate(-14deg); }
}
@keyframes navIconFlipY {
    0%, 45%, 55%, 100% { transform: perspective(120px) rotateY(0deg); }
    50% { transform: perspective(120px) rotateY(180deg); }
}
@keyframes navIconShake {
    0%, 100% { transform: translateX(0); }
    20% { transform: translateX(-3px) rotate(-4deg); }
    40% { transform: translateX(3px) rotate(4deg); }
    60% { transform: translateX(-2px); }
    80% { transform: translateX(2px); }
}
@keyframes navIconBreathe {
    0%, 100% { transform: scale(1); filter: brightness(1); }
    50% { transform: scale(1.14); filter: brightness(1.15); }
}
@keyframes navIconSkew {
    0%, 100% { transform: skewX(0deg) rotate(0deg); }
    33% { transform: skewX(-6deg) rotate(-4deg); }
    66% { transform: skewX(6deg) rotate(4deg); }
}
@keyframes navIconOrbit {
    0% { transform: rotate(0deg) translateX(2px) rotate(0deg); }
    100% { transform: rotate(360deg) translateX(2px) rotate(-360deg); }
}
