/* Animations individuelles des icônes de navigation. */
.obt-menu-icon > .fa,
.menu-icon-animation-preview [data-menu-icon-preview-for] {
    transform-origin: center;
    will-change: transform, filter, opacity;
}

a:hover > .obt-menu-icon-animation-lift > .fa,
a:focus-visible > .obt-menu-icon-animation-lift > .fa,
.menu-icon-animation-preview.obt-menu-icon-animation-lift:hover [data-menu-icon-preview-for] {
    animation: obtMenuIconLift .42s ease both;
}

a:hover > .obt-menu-icon-animation-zoom > .fa,
a:focus-visible > .obt-menu-icon-animation-zoom > .fa,
.menu-icon-animation-preview.obt-menu-icon-animation-zoom:hover [data-menu-icon-preview-for] {
    animation: obtMenuIconZoom .42s ease both;
}

a:hover > .obt-menu-icon-animation-pulse > .fa,
a:focus-visible > .obt-menu-icon-animation-pulse > .fa,
.menu-icon-animation-preview.obt-menu-icon-animation-pulse:hover [data-menu-icon-preview-for] {
    animation: obtMenuIconPulse .62s ease both;
}

a:hover > .obt-menu-icon-animation-bounce > .fa,
a:focus-visible > .obt-menu-icon-animation-bounce > .fa,
.menu-icon-animation-preview.obt-menu-icon-animation-bounce:hover [data-menu-icon-preview-for] {
    animation: obtMenuIconBounce .58s ease both;
}

a:hover > .obt-menu-icon-animation-shake > .fa,
a:focus-visible > .obt-menu-icon-animation-shake > .fa,
.menu-icon-animation-preview.obt-menu-icon-animation-shake:hover [data-menu-icon-preview-for] {
    animation: obtMenuIconShake .5s ease both;
}

a:hover > .obt-menu-icon-animation-swing > .fa,
a:focus-visible > .obt-menu-icon-animation-swing > .fa,
.menu-icon-animation-preview.obt-menu-icon-animation-swing:hover [data-menu-icon-preview-for] {
    animation: obtMenuIconSwing .62s ease both;
    transform-origin: 50% 0;
}

a:hover > .obt-menu-icon-animation-spin > .fa,
a:focus-visible > .obt-menu-icon-animation-spin > .fa,
.menu-icon-animation-preview.obt-menu-icon-animation-spin:hover [data-menu-icon-preview-for] {
    animation: obtMenuIconSpin .62s ease-in-out both;
}

a:hover > .obt-menu-icon-animation-flip > .fa,
a:focus-visible > .obt-menu-icon-animation-flip > .fa,
.menu-icon-animation-preview.obt-menu-icon-animation-flip:hover [data-menu-icon-preview-for] {
    animation: obtMenuIconFlip .62s ease both;
}

a:hover > .obt-menu-icon-animation-tilt > .fa,
a:focus-visible > .obt-menu-icon-animation-tilt > .fa,
.menu-icon-animation-preview.obt-menu-icon-animation-tilt:hover [data-menu-icon-preview-for] {
    animation: obtMenuIconTilt .52s ease both;
}

a:hover > .obt-menu-icon-animation-glow > .fa,
a:focus-visible > .obt-menu-icon-animation-glow > .fa,
.menu-icon-animation-preview.obt-menu-icon-animation-glow:hover [data-menu-icon-preview-for] {
    animation: obtMenuIconGlow .68s ease both;
}

@keyframes obtMenuIconLift {
    0% { transform: translateY(0); }
    55% { transform: translateY(-5px); }
    100% { transform: translateY(-3px); }
}

@keyframes obtMenuIconZoom {
    0% { transform: scale(1); }
    60% { transform: scale(1.28); }
    100% { transform: scale(1.18); }
}

@keyframes obtMenuIconPulse {
    0%, 100% { transform: scale(1); }
    35% { transform: scale(1.3); }
    68% { transform: scale(.92); }
}

@keyframes obtMenuIconBounce {
    0%, 100% { transform: translateY(0); }
    35% { transform: translateY(-6px); }
    62% { transform: translateY(2px); }
    82% { transform: translateY(-2px); }
}

@keyframes obtMenuIconShake {
    0%, 100% { transform: translateX(0); }
    20%, 60% { transform: translateX(-3px); }
    40%, 80% { transform: translateX(3px); }
}

@keyframes obtMenuIconSwing {
    0%, 100% { transform: rotate(0); }
    25% { transform: rotate(17deg); }
    50% { transform: rotate(-13deg); }
    75% { transform: rotate(8deg); }
}

@keyframes obtMenuIconSpin {
    from { transform: rotate(0); }
    to { transform: rotate(360deg); }
}

@keyframes obtMenuIconFlip {
    0% { transform: perspective(180px) rotateY(0); }
    50% { transform: perspective(180px) rotateY(180deg); }
    100% { transform: perspective(180px) rotateY(360deg); }
}

@keyframes obtMenuIconTilt {
    0%, 100% { transform: rotate(0) scale(1); }
    35% { transform: rotate(-14deg) scale(1.12); }
    70% { transform: rotate(10deg) scale(1.08); }
}

@keyframes obtMenuIconGlow {
    0% { filter: drop-shadow(0 0 0 currentColor); opacity: 1; }
    55% { filter: drop-shadow(0 0 6px currentColor); opacity: .82; }
    100% { filter: drop-shadow(0 0 3px currentColor); opacity: 1; }
}

@media (prefers-reduced-motion: reduce) {
    [class*="obt-menu-icon-animation-"] > .fa,
    .menu-icon-animation-preview [data-menu-icon-preview-for] {
        animation: none !important;
        transform: none !important;
        filter: none !important;
    }
}
