/* ==========================================================================
   المدار المتخصصة | AL MADAR AGENCY - ANIMATIONS SYSTEM
   ========================================================================== */

/* 1. Floating Animation (للأشكال ثلاثية الأبعاد والأورب الفضائي) */
@keyframes floatSlow {
    0%, 100% {
        transform: translateY(0px) rotate(0deg);
    }
    50% {
        transform: translateY(-20px) rotate(5deg);
    }
}

@keyframes floatReverse {
    0%, 100% {
        transform: translateY(0px) rotate(0deg);
    }
    50% {
        transform: translateY(20px) rotate(-5deg);
    }
}

/* 2. Pulsing Glow (لإبهار الزائر على الأزرار والأيقونات) */
@keyframes pulseGlow {
    0%, 100% {
        box-shadow: 0 0 25px rgba(75, 0, 246, 0.4), inset 0 0 15px rgba(205, 176, 255, 0.2);
    }
    50% {
        box-shadow: 0 0 50px rgba(75, 0, 246, 0.8), inset 0 0 25px rgba(205, 176, 255, 0.4);
    }
}

/* 3. Text Shimmer Gradient Effect */
@keyframes textShimmer {
    0% {
        background-position: 0% 50%;
    }
    50% {
        background-position: 100% 50%;
    }
    100% {
        background-position: 0% 50%;
    }
}

/* 4. Infinite Marquee (للشركاء وشعارات العملاء) */
@keyframes marqueeScroll {
    0% {
        transform: translateX(0%);
    }
    100% {
        transform: translateX(50%);
    }
}

/* 5. Border Glow Rotate (لإطار البطاقات الفاخرة) */
@keyframes borderRotate {
    0% {
        border-image-source: linear-gradient(0deg, #4B00F6, #CDB0FF, transparent);
    }
    50% {
        border-image-source: linear-gradient(180deg, #CDB0FF, #4B00F6, transparent);
    }
    100% {
        border-image-source: linear-gradient(360deg, #4B00F6, #CDB0FF, transparent);
    }
}

/* Utility Animation Classes */
.animate-float {
    animation: floatSlow 8s ease-in-out infinite;
}

.animate-float-reverse {
    animation: floatReverse 10s ease-in-out infinite;
}

.animate-pulse-glow {
    animation: pulseGlow 3s ease-in-out infinite;
}

.text-gradient-shimmer {
    background: linear-gradient(90deg, #FFFFFF 0%, #CDB0FF 30%, #4B00F6 70%, #FFFFFF 100%);
    background-size: 200% auto;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    animation: textShimmer 6s linear infinite;
}

.text-gradient-static {
    background: var(--grad-text);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.text-gradient-purple {
    background: var(--grad-text-purple);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}