/* Professional Animation Styles */
.animate-fade-up {
    opacity: 0;
    transform: translateY(60px);
    transition: all 0.8s cubic-bezier(0.4, 0, 0.2, 1);
}

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

.animate-sun-fade-up {
    opacity: 0;
    transform: translateY(200px) translateX(-50%) !important;
    transition: all 0.8s cubic-bezier(0.4, 0, 0.2, 1);
}

.animate-sun-fade-up.animate-in {
    opacity: 1;
    transform: translateY(0) translateX(-50%) !important;
}

.animate-sun-tir-fade-up {
    opacity: 0;
    transform: translateY(200px) translateX(-52%) !important;
    transition: all 0.8s cubic-bezier(0.4, 0, 0.2, 1);
}

.animate-sun-tir-fade-up.animate-in {
    opacity: 1;
    transform: translateY(0) translateX(-52%) !important;
}



.animate-hero-background-image {
    background: linear-gradient(to bottom, #000000 0%,
            #4a0000 25%,
            #c70000 50%,
            #ff4e00 75%,
            #ffcc00 100%);
    background-size: 100% 1000%;
    background-position: bottom;
    animation: gradientShift 2s linear forwards;
}

@keyframes gradientShift {
    0% {
        background-position: bottom;
    }

    100% {
        background-position: center center;
        background-size: 100% 100%;
    }
}

/* .animate-hero-background-image.animate {
    background: linear-gradient(to bottom,
            #000000 0%,
            #4a0000 25%,
            #c70000 50%,
            #ff4e00 75%,
            #ffcc00 100%);
} */

.animate-fade-down {
    opacity: 0;
    transform: translateY(-60px);
    transition: all 0.8s cubic-bezier(0.4, 0, 0.2, 1);
}

.animate-fade-down.animate-in {
    opacity: 1;
    transform: translateY(0);
}

.animate-fade-left {
    opacity: 0;
    transform: translateX(-60px);
    transition: all 0.8s cubic-bezier(0.4, 0, 0.2, 1);
}

.animate-fade-left.animate-in {
    opacity: 1;
    transform: translateX(0);
}

.animate-fade-right {
    opacity: 0;
    transform: translateX(60px);
    transition: all 0.8s cubic-bezier(0.4, 0, 0.2, 1);
}

.animate-fade-right.animate-in {
    opacity: 1;
    transform: translateX(0);
}

.animate-scale-up {
    opacity: 0;
    transform: scale(0.8);
    transition: all 0.8s cubic-bezier(0.4, 0, 0.2, 1);
}

.animate-scale-up.animate-in {
    opacity: 1;
    transform: scale(1);
}

.animate-scale-down {
    opacity: 0;
    transform: scale(1.2);
    transition: all 0.8s cubic-bezier(0.4, 0, 0.2, 1);
}

.animate-scale-down-5 {
    opacity: 0;
    transform: scale(1.5);
    transition: all 0.8s cubic-bezier(0.4, 0, 0.2, 1);
}

.animate-scale-down.animate-in,
.animate-scale-down-5.animate-in {
    opacity: 1;
    transform: scale(1);
}

.animate-fade-in {
    opacity: 0;
    transition: all 0.8s cubic-bezier(0.4, 0, 0.2, 1);
}

.animate-fade-in.animate-in {
    opacity: 1;
}

.animate-slide-up {
    opacity: 0;
    transform: translateY(80px);
    transition: all 1s cubic-bezier(0.4, 0, 0.2, 1);
}

.animate-slide-up.animate-in {
    opacity: 1;
    transform: translateY(0);
}

.animate-slide-down {
    opacity: 0;
    transform: translateY(-80px);
    transition: all 1s cubic-bezier(0.4, 0, 0.2, 1);
}

.animate-slide-down.animate-in {
    opacity: 1;
    transform: translateY(0);
}

.animate-slide-left {
    opacity: 0;
    transform: translateX(-80px);
    transition: all 1s cubic-bezier(0.4, 0, 0.2, 1);
}

.animate-slide-left.animate-in {
    opacity: 1;
    transform: translateX(0);
}

.animate-slide-right {
    opacity: 0;
    transform: translateX(80px);
    transition: all 1s cubic-bezier(0.4, 0, 0.2, 1);
}

.animate-slide-right.animate-in {
    opacity: 1;
    transform: translateX(0);
}

.animate-rotate-in {
    opacity: 0;
    transform: rotate(-180deg) scale(0.8);
    transition: all 1s cubic-bezier(0.4, 0, 0.2, 1);
}

.animate-rotate-in.animate-in {
    opacity: 1;
    transform: rotate(0deg) scale(1);
}

.animate-flip-x {
    opacity: 0;
    transform: rotateX(90deg);
    transition: all 0.8s cubic-bezier(0.4, 0, 0.2, 1);
}

.animate-flip-x.animate-in {
    opacity: 1;
    transform: rotateX(0deg);
}

.animate-flip-y {
    opacity: 0;
    transform: rotateY(90deg);
    transition: all 0.8s cubic-bezier(0.4, 0, 0.2, 1);
}

.animate-flip-y.animate-in {
    opacity: 1;
    transform: rotateY(0deg);
}

.animate-zoom-in {
    opacity: 0;
    transform: scale(0.3);
    transition: all 0.8s cubic-bezier(0.4, 0, 0.2, 1);
}

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

.animate-zoom-out {
    opacity: 0;
    transform: scale(1.5);
    transition: all 0.8s cubic-bezier(0.4, 0, 0.2, 1);
}

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

/* Stagger delays for sequential animation */
.animate-delay-100 {
    transition-delay: 0.1s;
}

.animate-delay-200 {
    transition-delay: 0.2s;
}

.animate-delay-300 {
    transition-delay: 0.3s;
}

.animate-delay-400 {
    transition-delay: 0.4s;
}

.animate-delay-500 {
    transition-delay: 0.5s;
}

.animate-delay-600 {
    transition-delay: 0.6s;
}

.animate-delay-700 {
    transition-delay: 0.7s;
}

.animate-delay-800 {
    transition-delay: 0.8s;
}

.animate-delay-900 {
    transition-delay: 0.9s;
}

.animate-delay-1000 {
    transition-delay: 1s;
}

.animate-delay-1100 {
    transition-delay: 1.1s;
}

.animate-delay-1200 {
    transition-delay: 1.2s;
}

.animate-delay-1300 {
    transition-delay: 1.3s;
}

.animate-delay-1400 {
    transition-delay: 1.4s;
}

.animate-delay-1500 {
    transition-delay: 1.5s;
}

.animate-delay-1600 {
    transition-delay: 1.6s;
}

.animate-delay-1700 {
    transition-delay: 1.7s;
}

.animate-delay-1800 {
    transition-delay: 1.8s;
}

.animate-delay-1900 {
    transition-delay: 1.9s;
}

.animate-delay-2000 {
    transition-delay: 2s;
}

/* Duration variations */
.animate-duration-sun-slow {
    transition-duration: 1.5s !important;
}

.animate-duration-slow {
    transition-duration: 1.2s !important;
}

.animate-duration-normal {
    transition-duration: 0.8s !important;
}

.animate-duration-fast {
    transition-duration: 0.4s !important;
}

/* Easing variations */
.animate-ease-linear {
    transition-timing-function: linear !important;
}

.animate-ease-in {
    transition-timing-function: cubic-bezier(0.4, 0, 1, 1) !important;
}

.animate-ease-out {
    transition-timing-function: cubic-bezier(0, 0, 0.2, 1) !important;
}

.animate-ease-in-out {
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1) !important;
}

.animate-ease-bounce {
    transition-timing-function: cubic-bezier(0.68, -0.55, 0.265, 1.55) !important;
}

/* Special animations */
.animate-pulse {
    animation: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
}

@keyframes pulse {

    0%,
    100% {
        opacity: 1;
    }

    50% {
        opacity: 0.5;
    }
}

.animate-bounce {
    animation: bounce 1s infinite;
}

@keyframes bounce {

    0%,
    100% {
        transform: translateY(0);
        animation-timing-function: cubic-bezier(0.8, 0, 1, 1);
    }

    50% {
        transform: translateY(-25%);
        animation-timing-function: cubic-bezier(0, 0, 0.2, 1);
    }
}

.animate-shake {
    animation: shake 0.5s cubic-bezier(0.36, 0.07, 0.19, 0.97);
}

@keyframes shake {

    10%,
    90% {
        transform: translateX(-1px);
    }

    20%,
    80% {
        transform: translateX(2px);
    }

    30%,
    50%,
    70% {
        transform: translateX(-4px);
    }

    40%,
    60% {
        transform: translateX(4px);
    }
}

.animate-wiggle {
    animation: wiggle 1s ease-in-out infinite;
}

@keyframes wiggle {

    0%,
    7% {
        transform: rotateZ(0);
    }

    15% {
        transform: rotateZ(-15deg);
    }

    20% {
        transform: rotateZ(10deg);
    }

    25% {
        transform: rotateZ(-10deg);
    }

    30% {
        transform: rotateZ(6deg);
    }

    35% {
        transform: rotateZ(-4deg);
    }

    40%,
    100% {
        transform: rotateZ(0);
    }
}

/* Smooth page load animation */
/* .page-wrapper {
    opacity: 0;
    animation: pageLoad 0.8s ease-out forwards;
}

@keyframes pageLoad {
    to {
        opacity: 1;
    }
} */

/* Hover effects for interactive elements */
.animate-hover-lift {
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.animate-hover-lift:hover {
    transform: translateY(-4px);
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.15);
}

.animate-hover-scale {
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.animate-hover-scale:hover {
    transform: scale(1.05);
}

.animate-hover-rotate {
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.animate-hover-rotate:hover {
    transform: rotate(5deg);
}

/* Smooth scroll behavior */
html {
    scroll-behavior: smooth;
}

/* Accessibility - Reduce motion for users who prefer it */
@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;
    }
}