/* Animations */

/* 1. Fade In Up */
.reveal {
    opacity: 0;
    transform: translateY(30px);
    transition: all 0.8s cubic-bezier(0.5, 0, 0, 1);
}

.reveal.active {
    opacity: 1;
    transform: translateY(0);
}

/* 2. Fade In Left */
.reveal-left {
    opacity: 0;
    transform: translateX(-30px);
    transition: all 0.8s cubic-bezier(0.5, 0, 0, 1);
}

.reveal-left.active {
    opacity: 1;
    transform: translateX(0);
}

/* 3. Fade In Right */
.reveal-right {
    opacity: 0;
    transform: translateX(30px);
    transition: all 0.8s cubic-bezier(0.5, 0, 0, 1);
}

.reveal-right.active {
    opacity: 1;
    transform: translateX(0);
}

/* 4. Zoom In */
.zoom-in {
    opacity: 0;
    transform: scale(0.9);
    transition: all 0.6s cubic-bezier(0.5, 0, 0, 1);
}

.zoom-in.active {
    opacity: 1;
    transform: scale(1);
}

/* 5. Hover Float Effect */
.hover-float {
    transition: transform 0.3s ease;
}

.hover-float:hover {
    transform: translateY(-5px);
}

/* 6. Pulse Animation (Gold) */
@keyframes pulse-gold {
    0% {
        box-shadow: 0 0 0 0 rgba(220, 177, 9, 0.7);
    }

    70% {
        box-shadow: 0 0 0 15px rgba(220, 177, 9, 0);
    }

    100% {
        box-shadow: 0 0 0 0 rgba(220, 177, 9, 0);
    }
}

.pulse-anim {
    animation: pulse-gold 2s infinite;
}

/* 7. Shimmer Effect for Buttons */
@keyframes shimmer {
    0% {
        background-position: -1000px 0;
    }

    100% {
        background-position: 1000px 0;
    }
}

.shimmer-btn {
    background: linear-gradient(to right, #dcb109 0%, #fae16d 50%, #dcb109 100%);
    background-size: 200% auto;
    animation: shimmer 3s infinite linear;
}

/* 8. Floating Element (Continuous) */
@keyframes float {
    0% {
        transform: translateY(0px);
    }

    50% {
        transform: translateY(-10px);
    }

    100% {
        transform: translateY(0px);
    }
}

.floating-element {
    animation: float 4s ease-in-out infinite;
}

/* 9. Rotate on Hover */
.rotate-on-hover:hover {
    transform: rotate(360deg);
    transition: transform 0.6s ease-in-out;
}

/* 10. Blur Background Animation */
@keyframes blur-pulse {

    0%,
    100% {
        opacity: 0.6;
        transform: scale(1);
    }

    50% {
        opacity: 0.8;
        transform: scale(1.1);
    }
}

.blur-3xl {
    filter: blur(60px);
    animation: blur-pulse 6s infinite ease-in-out;
}

/* Transition Utilities */
.transition-all {
    transition: all 0.3s ease-in-out;
}

.hover-scale:hover {
    transform: scale(1.02);
}

.hover-border-danger:hover {
    border-color: #dc3545 !important;
}