/**
 * GW Elementor - Elemento Flutuante
 * Animações CSS para elementos flutuantes
 * Desenvolvido por Gerencie Web
 */

/* =============================================
   VARIÁVEIS CSS PADRÃO
   ============================================= */
.gw-floating-element {
    --gw-float-distance: 15px;
    --gw-float-duration: 3s;
    --gw-float-easing: ease-in-out;
    --gw-float-delay: 0s;
    --gw-float-direction: alternate;
    --gw-float-initial-rotate: 0deg;
    display: inline-block;
    will-change: transform;
}

/* =============================================
   WRAPPER
   ============================================= */
.gw-floating-wrapper {
    line-height: 0;
}

.gw-floating-wrapper img {
    display: inline-block;
    vertical-align: middle;
}

/* =============================================
   VELOCIDADES PRÉ-DEFINIDAS
   ============================================= */
.gw-speed-very-slow {
    --gw-float-duration: 8s;
}

.gw-speed-slow {
    --gw-float-duration: 5s;
}

.gw-speed-normal {
    --gw-float-duration: 3s;
}

.gw-speed-fast {
    --gw-float-duration: 1.5s;
}

.gw-speed-very-fast {
    --gw-float-duration: 0.8s;
}

/* Custom usa o valor definido via seletor inline do Elementor */

/* =============================================
   PAUSAR NO HOVER
   ============================================= */
.gw-pause-on-hover:hover {
    animation-play-state: paused !important;
}

/* =============================================
   ANIMAÇÃO: Flutuar Cima/Baixo
   ============================================= */
.gw-anim-float-up-down {
    animation: gw-float-up-down var(--gw-float-duration) var(--gw-float-easing) var(--gw-float-delay) infinite var(--gw-float-direction);
}

@keyframes gw-float-up-down {
    0% {
        transform: translateY(0) rotate(var(--gw-float-initial-rotate));
    }
    50% {
        transform: translateY(calc(var(--gw-float-distance) * -1)) rotate(var(--gw-float-initial-rotate));
    }
    100% {
        transform: translateY(0) rotate(var(--gw-float-initial-rotate));
    }
}

/* =============================================
   ANIMAÇÃO: Flutuar Esquerda/Direita
   ============================================= */
.gw-anim-float-left-right {
    animation: gw-float-left-right var(--gw-float-duration) var(--gw-float-easing) var(--gw-float-delay) infinite var(--gw-float-direction);
}

@keyframes gw-float-left-right {
    0% {
        transform: translateX(0) rotate(var(--gw-float-initial-rotate));
    }
    50% {
        transform: translateX(var(--gw-float-distance)) rotate(var(--gw-float-initial-rotate));
    }
    100% {
        transform: translateX(0) rotate(var(--gw-float-initial-rotate));
    }
}

/* =============================================
   ANIMAÇÃO: Flutuar Diagonal
   ============================================= */
.gw-anim-float-diagonal {
    animation: gw-float-diagonal var(--gw-float-duration) var(--gw-float-easing) var(--gw-float-delay) infinite var(--gw-float-direction);
}

@keyframes gw-float-diagonal {
    0% {
        transform: translate(0, 0) rotate(var(--gw-float-initial-rotate));
    }
    50% {
        transform: translate(var(--gw-float-distance), calc(var(--gw-float-distance) * -1)) rotate(var(--gw-float-initial-rotate));
    }
    100% {
        transform: translate(0, 0) rotate(var(--gw-float-initial-rotate));
    }
}

/* =============================================
   ANIMAÇÃO: Movimento Circular
   ============================================= */
.gw-anim-float-circular {
    animation: gw-float-circular var(--gw-float-duration) var(--gw-float-easing) var(--gw-float-delay) infinite var(--gw-float-direction);
}

@keyframes gw-float-circular {
    0% {
        transform: translate(0, 0) rotate(var(--gw-float-initial-rotate));
    }
    25% {
        transform: translate(var(--gw-float-distance), 0) rotate(var(--gw-float-initial-rotate));
    }
    50% {
        transform: translate(var(--gw-float-distance), calc(var(--gw-float-distance) * -1)) rotate(var(--gw-float-initial-rotate));
    }
    75% {
        transform: translate(0, calc(var(--gw-float-distance) * -1)) rotate(var(--gw-float-initial-rotate));
    }
    100% {
        transform: translate(0, 0) rotate(var(--gw-float-initial-rotate));
    }
}

/* =============================================
   ANIMAÇÃO: Movimento Elíptico
   ============================================= */
.gw-anim-float-ellipse {
    animation: gw-float-ellipse var(--gw-float-duration) var(--gw-float-easing) var(--gw-float-delay) infinite var(--gw-float-direction);
}

@keyframes gw-float-ellipse {
    0% {
        transform: translate(0, 0) rotate(var(--gw-float-initial-rotate));
    }
    25% {
        transform: translate(var(--gw-float-distance), calc(var(--gw-float-distance) * -0.5)) rotate(var(--gw-float-initial-rotate));
    }
    50% {
        transform: translate(0, calc(var(--gw-float-distance) * -1)) rotate(var(--gw-float-initial-rotate));
    }
    75% {
        transform: translate(calc(var(--gw-float-distance) * -1), calc(var(--gw-float-distance) * -0.5)) rotate(var(--gw-float-initial-rotate));
    }
    100% {
        transform: translate(0, 0) rotate(var(--gw-float-initial-rotate));
    }
}

/* =============================================
   ANIMAÇÃO: Pulsar (Zoom)
   ============================================= */
.gw-anim-float-zoom {
    animation: gw-float-zoom var(--gw-float-duration) var(--gw-float-easing) var(--gw-float-delay) infinite var(--gw-float-direction);
}

@keyframes gw-float-zoom {
    0% {
        transform: scale(1) rotate(var(--gw-float-initial-rotate));
    }
    50% {
        transform: scale(1.08) rotate(var(--gw-float-initial-rotate));
    }
    100% {
        transform: scale(1) rotate(var(--gw-float-initial-rotate));
    }
}

/* =============================================
   ANIMAÇÃO: Rotação Suave
   ============================================= */
.gw-anim-float-rotate {
    animation: gw-float-rotate var(--gw-float-duration) linear var(--gw-float-delay) infinite normal;
}

@keyframes gw-float-rotate {
    0% {
        transform: rotate(0deg);
    }
    100% {
        transform: rotate(360deg);
    }
}

/* =============================================
   ANIMAÇÃO: Balanço (Swing)
   ============================================= */
.gw-anim-float-swing {
    transform-origin: top center;
    animation: gw-float-swing var(--gw-float-duration) var(--gw-float-easing) var(--gw-float-delay) infinite var(--gw-float-direction);
}

@keyframes gw-float-swing {
    0% {
        transform: rotate(var(--gw-float-initial-rotate));
    }
    25% {
        transform: rotate(calc(var(--gw-float-initial-rotate) + 8deg));
    }
    50% {
        transform: rotate(var(--gw-float-initial-rotate));
    }
    75% {
        transform: rotate(calc(var(--gw-float-initial-rotate) - 8deg));
    }
    100% {
        transform: rotate(var(--gw-float-initial-rotate));
    }
}

/* =============================================
   ANIMAÇÃO: Quicar (Bounce)
   ============================================= */
.gw-anim-float-bounce {
    animation: gw-float-bounce var(--gw-float-duration) cubic-bezier(0.28, 0.84, 0.42, 1) var(--gw-float-delay) infinite var(--gw-float-direction);
}

@keyframes gw-float-bounce {
    0% {
        transform: translateY(0) rotate(var(--gw-float-initial-rotate));
    }
    30% {
        transform: translateY(calc(var(--gw-float-distance) * -1)) rotate(var(--gw-float-initial-rotate));
    }
    50% {
        transform: translateY(0) rotate(var(--gw-float-initial-rotate));
    }
    65% {
        transform: translateY(calc(var(--gw-float-distance) * -0.5)) rotate(var(--gw-float-initial-rotate));
    }
    80% {
        transform: translateY(0) rotate(var(--gw-float-initial-rotate));
    }
    90% {
        transform: translateY(calc(var(--gw-float-distance) * -0.2)) rotate(var(--gw-float-initial-rotate));
    }
    100% {
        transform: translateY(0) rotate(var(--gw-float-initial-rotate));
    }
}

/* =============================================
   ANIMAÇÃO: Tremer (Wobble)
   ============================================= */
.gw-anim-float-wobble {
    animation: gw-float-wobble var(--gw-float-duration) var(--gw-float-easing) var(--gw-float-delay) infinite var(--gw-float-direction);
}

@keyframes gw-float-wobble {
    0% {
        transform: translate(0, 0) rotate(var(--gw-float-initial-rotate));
    }
    15% {
        transform: translate(calc(var(--gw-float-distance) * -0.4), 0) rotate(calc(var(--gw-float-initial-rotate) - 3deg));
    }
    30% {
        transform: translate(calc(var(--gw-float-distance) * 0.3), 0) rotate(calc(var(--gw-float-initial-rotate) + 2deg));
    }
    45% {
        transform: translate(calc(var(--gw-float-distance) * -0.2), 0) rotate(calc(var(--gw-float-initial-rotate) - 1.5deg));
    }
    60% {
        transform: translate(calc(var(--gw-float-distance) * 0.15), 0) rotate(calc(var(--gw-float-initial-rotate) + 1deg));
    }
    75% {
        transform: translate(calc(var(--gw-float-distance) * -0.08), 0) rotate(calc(var(--gw-float-initial-rotate) - 0.5deg));
    }
    100% {
        transform: translate(0, 0) rotate(var(--gw-float-initial-rotate));
    }
}

/* =============================================
   ANIMAÇÃO: Gelatina (Jelly)
   ============================================= */
.gw-anim-float-jelly {
    animation: gw-float-jelly var(--gw-float-duration) var(--gw-float-easing) var(--gw-float-delay) infinite var(--gw-float-direction);
}

@keyframes gw-float-jelly {
    0% {
        transform: scale(1, 1) rotate(var(--gw-float-initial-rotate));
    }
    25% {
        transform: scale(0.95, 1.05) rotate(var(--gw-float-initial-rotate));
    }
    50% {
        transform: scale(1.05, 0.95) rotate(var(--gw-float-initial-rotate));
    }
    75% {
        transform: scale(0.98, 1.02) rotate(var(--gw-float-initial-rotate));
    }
    100% {
        transform: scale(1, 1) rotate(var(--gw-float-initial-rotate));
    }
}

/* =============================================
   ANIMAÇÃO: Espiral
   ============================================= */
.gw-anim-float-spiral {
    animation: gw-float-spiral var(--gw-float-duration) linear var(--gw-float-delay) infinite normal;
}

@keyframes gw-float-spiral {
    0% {
        transform: translate(0, 0) rotate(0deg);
    }
    25% {
        transform: translate(var(--gw-float-distance), calc(var(--gw-float-distance) * -0.5)) rotate(90deg);
    }
    50% {
        transform: translate(0, calc(var(--gw-float-distance) * -1)) rotate(180deg);
    }
    75% {
        transform: translate(calc(var(--gw-float-distance) * -1), calc(var(--gw-float-distance) * -0.5)) rotate(270deg);
    }
    100% {
        transform: translate(0, 0) rotate(360deg);
    }
}

/* =============================================
   RESPONSIVIDADE
   ============================================= */

/* Desktop: > 1024px */
@media (min-width: 1025px) {
    .gw-hide-desktop {
        display: none !important;
    }
}

/* Tablet: 768px - 1024px */
@media (min-width: 768px) and (max-width: 1024px) {
    .gw-hide-tablet {
        display: none !important;
    }
}

/* Mobile: < 768px */
@media (max-width: 767px) {
    .gw-hide-mobile {
        display: none !important;
    }
}

/* =============================================
   ACESSIBILIDADE: Respeitar preferência de
   movimento reduzido do sistema operacional
   ============================================= */
@media (prefers-reduced-motion: reduce) {
    .gw-floating-element {
        animation: none !important;
    }
}
