/* ============================================================
   GmarUp — Animations (Refined & Subtle)
   ============================================================ */

/* Scroll-reveal */
.fade-in-up {
    opacity: 0;
    transform: translateY(24px);
    transition: opacity .6s ease, transform .6s ease;
}

.fade-in-up.visible {
    opacity: 1;
    transform: translateY(0);
}

/* Loading spinner */
.loading-spinner {
    width: 18px;
    height: 18px;
    border: 2px solid transparent;
    border-top-color: currentColor;
    border-radius: 50%;
    animation: spin .7s linear infinite;
}

@keyframes spin {
    to { transform: rotate(360deg); }
}

/* Subtle pulse for live indicator */
.pulse {
    animation: pulse 2.5s ease-in-out infinite;
}

@keyframes pulse {
    0%, 100% { opacity: 1; }
    50% { opacity: .5; }
}

/* Toast slide-in */
.slide-in-right {
    animation: slideInRight .3s ease-out;
}

@keyframes slideInRight {
    from { transform: translateX(100%); opacity: 0; }
    to { transform: translateX(0); opacity: 1; }
}

/* Form error shake */
.shake {
    animation: shake .45s ease-in-out;
}

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

/* Success bounce */
.bounce {
    animation: bounce .5s ease-out;
}

@keyframes bounce {
    0%, 100% { transform: scale(1); }
    50% { transform: scale(1.03); }
}

/* Hover lift */
.hover-lift {
    transition: transform .25s ease, box-shadow .25s ease;
}
.hover-lift:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 24px rgba(0,0,0,.08);
}

/* Form states */
.form-success {
    animation: formSuccess .4s ease-out;
}

@keyframes formSuccess {
    0% { background: var(--white); }
    50% { background: var(--gold-pale, #faf5e8); }
    100% { background: var(--white); }
}

.form-error {
    animation: formError .45s ease-out;
}

@keyframes formError {
    0%, 100% { transform: translateX(0); }
    25%, 75% { transform: translateX(-2px); }
    50% { transform: translateX(2px); }
}

/* Button loading */
.btn-loading {
    animation: btnPulse 1.5s ease-in-out infinite;
    pointer-events: none;
}

@keyframes btnPulse {
    0%, 100% { opacity: 1; }
    50% { opacity: .6; }
}

/* Mobile adjustments */
@media (max-width: 768px) {
    .fade-in-up {
        transform: translateY(16px);
    }

    .hover-lift:hover {
        transform: none;
        box-shadow: none;
    }

    .hover-lift:active {
        transform: scale(.98);
        transition: transform .1s ease;
    }
}

/* Accessibility */
@media (prefers-reduced-motion: reduce) {
    *,
    ::before,
    ::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
        scroll-behavior: auto !important;
    }

    .fade-in-up,
    .feature-card,
    .step,
    .audience-card,
    .faq__item {
        opacity: 1;
        transform: none;
        transition: none;
    }
}
