/* ============================================
   ANIMATIONS - AOS Style
   ============================================ */

/* Fade Animations */
[data-aos] {
    opacity: 0;
    transition: all 0.8s cubic-bezier(0.4, 0, 0.2, 1);
}

[data-aos="fade-up"] {
    transform: translateY(30px);
}

[data-aos="fade-down"] {
    transform: translateY(-30px);
}

[data-aos="fade-left"] {
    transform: translateX(30px);
}

[data-aos="fade-right"] {
    transform: translateX(-30px);
}

[data-aos="fade-zoom"] {
    transform: scale(0.9);
}

[data-aos].aos-animate {
    opacity: 1;
    transform: translate(0) scale(1);
}

/* Slide Animations */
[data-aos="slide-up"] {
    transform: translateY(60px);
    opacity: 0;
}

[data-aos="slide-up"].aos-animate {
    transform: translateY(0);
    opacity: 1;
}

[data-aos="slide-left"] {
    transform: translateX(60px);
    opacity: 0;
}

[data-aos="slide-left"].aos-animate {
    transform: translateX(0);
    opacity: 1;
}

[data-aos="slide-right"] {
    transform: translateX(-60px);
    opacity: 0;
}

[data-aos="slide-right"].aos-animate {
    transform: translateX(0);
    opacity: 1;
}

/* Scale Animations */
[data-aos="scale-up"] {
    transform: scale(0.8);
    opacity: 0;
}

[data-aos="scale-up"].aos-animate {
    transform: scale(1);
    opacity: 1;
}

[data-aos="scale-down"] {
    transform: scale(1.2);
    opacity: 0;
}

[data-aos="scale-down"].aos-animate {
    transform: scale(1);
    opacity: 1;
}

/* Flip Animations */
[data-aos="flip-left"] {
    transform: perspective(400px) rotateY(-30deg);
    opacity: 0;
}

[data-aos="flip-left"].aos-animate {
    transform: perspective(400px) rotateY(0);
    opacity: 1;
}

[data-aos="flip-right"] {
    transform: perspective(400px) rotateY(30deg);
    opacity: 0;
}

[data-aos="flip-right"].aos-animate {
    transform: perspective(400px) rotateY(0);
    opacity: 1;
}

[data-aos="flip-up"] {
    transform: perspective(400px) rotateX(30deg);
    opacity: 0;
}

[data-aos="flip-up"].aos-animate {
    transform: perspective(400px) rotateX(0);
    opacity: 1;
}

/* Stagger Children */
.stagger-children > * {
    opacity: 0;
    transform: translateY(20px);
    transition: all 0.6s cubic-bezier(0.4, 0, 0.2, 1);
}

.stagger-children.aos-animate > *:nth-child(1) { transition-delay: 0.05s; opacity: 1; transform: translateY(0); }
.stagger-children.aos-animate > *:nth-child(2) { transition-delay: 0.1s; opacity: 1; transform: translateY(0); }
.stagger-children.aos-animate > *:nth-child(3) { transition-delay: 0.15s; opacity: 1; transform: translateY(0); }
.stagger-children.aos-animate > *:nth-child(4) { transition-delay: 0.2s; opacity: 1; transform: translateY(0); }
.stagger-children.aos-animate > *:nth-child(5) { transition-delay: 0.25s; opacity: 1; transform: translateY(0); }
.stagger-children.aos-animate > *:nth-child(6) { transition-delay: 0.3s; opacity: 1; transform: translateY(0); }

/* ============================================
   HOVER ANIMATIONS
   ============================================ */

/* Card Tilt */
.tilt-effect {
    transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.tilt-effect:hover {
    transform: perspective(800px) rotateX(2deg) rotateY(2deg) scale(1.02);
}

/* Glow Effect */
.glow-effect {
    transition: all 0.3s ease;
    position: relative;
}

.glow-effect::after {
    content: '';
    position: absolute;
    inset: -2px;
    border-radius: inherit;
    background: linear-gradient(135deg, var(--primary), var(--secondary));
    opacity: 0;
    transition: opacity 0.3s ease;
    z-index: -1;
}

.glow-effect:hover::after {
    opacity: 0.15;
}

/* Ripple Effect */
.ripple-btn {
    position: relative;
    overflow: hidden;
}

.ripple-btn .ripple {
    position: absolute;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.3);
    transform: scale(0);
    animation: rippleAnim 0.6s linear;
    pointer-events: none;
}

@keyframes rippleAnim {
    to {
        transform: scale(4);
        opacity: 0;
    }
}

/* ============================================
   LOADING & TRANSITIONS
   ============================================ */

/* Page Transition */
.page-transition {
    animation: pageFadeIn 0.8s cubic-bezier(0.4, 0, 0.2, 1);
}

@keyframes pageFadeIn {
    from { opacity: 0; transform: translateY(20px); }
    to { opacity: 1; transform: translateY(0); }
}

/* Section Reveal */
.section-reveal {
    opacity: 0;
    transform: translateY(40px);
    transition: all 0.8s cubic-bezier(0.4, 0, 0.2, 1);
}

.section-reveal.visible {
    opacity: 1;
    transform: translateY(0);
}

/* ============================================
   PARALLAX
   ============================================ */
.parallax {
    transition: transform 0.1s linear;
    will-change: transform;
}

/* ============================================
   FLOATING BADGES
   ============================================ */
.floating-badge {
    animation: floatBadge 3s ease-in-out infinite;
}

@keyframes floatBadge {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-8px); }
}

/* ============================================
   MOUSE TRACKING GLOW
   ============================================ */
.mouse-glow {
    position: relative;
}

.mouse-glow::before {
    content: '';
    position: absolute;
    width: 200px;
    height: 200px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(37, 99, 235, 0.06), transparent 70%);
    pointer-events: none;
    transform: translate(-50%, -50%);
    transition: opacity 0.3s ease;
    opacity: 0;
}

.mouse-glow:hover::before {
    opacity: 1;
}

/* ============================================
   KEYFRAMES - Shared
   ============================================ */
@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translateY(30px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes fadeInDown {
    from {
        opacity: 0;
        transform: translateY(-30px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes fadeInLeft {
    from {
        opacity: 0;
        transform: translateX(30px);
    }
    to {
        opacity: 1;
        transform: translateX(0);
    }
}

@keyframes fadeInRight {
    from {
        opacity: 0;
        transform: translateX(-30px);
    }
    to {
        opacity: 1;
        transform: translateX(0);
    }
}

@keyframes zoomIn {
    from {
        opacity: 0;
        transform: scale(0.8);
    }
    to {
        opacity: 1;
        transform: scale(1);
    }
}

/* Utility Animation Classes */
.animate-fade-up {
    animation: fadeInUp 0.8s ease forwards;
}

.animate-fade-down {
    animation: fadeInDown 0.8s ease forwards;
}

.animate-fade-left {
    animation: fadeInLeft 0.8s ease forwards;
}

.animate-fade-right {
    animation: fadeInRight 0.8s ease forwards;
}

.animate-zoom {
    animation: zoomIn 0.8s ease forwards;
}

.animate-delay-1 { animation-delay: 0.1s; }
.animate-delay-2 { animation-delay: 0.2s; }
.animate-delay-3 { animation-delay: 0.3s; }
.animate-delay-4 { animation-delay: 0.4s; }
.animate-delay-5 { animation-delay: 0.5s; }
.animate-delay-6 { animation-delay: 0.6s; }
.animate-delay-7 { animation-delay: 0.7s; }
.animate-delay-8 { animation-delay: 0.8s; }