/* --- STUDIO-UFOS-EFFECTS.CSS (VERSION CORRIGÉE) --- */


@keyframes ufo-disappear-left {
    0% { 
        transform: translateY(0) translateX(0) scaleX(-1) scale(1); 
        opacity: 1; 
    }
    100% { 
        transform: translateY(-150px) translateX(-180px) scaleX(-1) scale(0.3); 
        opacity: 0; 
    }
}

@keyframes ufo-disappear-right {
    0% { 
        transform: translateY(0) translateX(0) scale(1); 
        opacity: 1; 
    }
    100% { 
        transform: translateY(-350px) translateX(80px) scale(0.3); 
        opacity: 0; 
    }
}

.ufo-left, .ufo-right {
    display: inline-block !important;
    transition: all 0.3s ease;
}

.ufo-link:hover .ufo-left {
    animation: ufo-disappear-left 1s forwards ease-in !important;
    animation-delay: 0.1s !important; /* Mis à jour */
}

.ufo-link:hover .ufo-right {
    animation: ufo-disappear-right 1s forwards ease-in !important;
    animation-delay: 0.3s !important; /* Mis à jour */
}

.ufo-link {
    transition: color 0.3s ease, text-shadow 0.3s ease, border-color 0.3s ease !important;
}


.ufo-link:hover {
    color: #00f2ff !important; 
    border-bottom-color: #00f2ff !important; 
    transition: color 0.2s ease;
}

.ufo-link:hover .ufo-text {
    animation: text-glow-oscillation 0.08s infinite steps(2, start);
}

@keyframes text-glow-oscillation {
    0%, 100% {
        text-shadow: 
            0 0 2px #00f2ff, 
            0 0 5px rgba(0, 242, 255, 0.5); 
    }
    50% {
        text-shadow: 
            0 0 4px #00f2ff, 
            0 0 8px #00f2ff, 
            0 0 12px rgba(0, 242, 255, 0.6);
    }
}


.ufo-link {
    position: relative;
    display: inline-block;
    padding: 0 5px;
    text-decoration: none;
    z-index: 1;
}

.ufo-text {
    position: relative; 
    z-index: 5; 
    display: inline-block;
    color: #ffffff;
}

.ufo-link::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 8%; 
    right: 8%;
    height: 6px;
    margin-top: -3px;
    
    background: #00f2ff;
    box-shadow: 0 0 4px #00f2ff, 0 0 10px #fff;
    
    clip-path: polygon(
        0% 50%, 5% 10%, 10% 90%, 15% 5%, 20% 95%, 25% 15%, 30% 85%, 35% 10%, 40% 90%, 45% 5%, 
        50% 95%, 55% 15%, 60% 85%, 65% 10%, 70% 90%, 75% 5%, 80% 95%, 85% 15%, 90% 85%, 95% 10%, 100% 50%,
        95% 40%, 90% 60%, 85% 20%, 80% 80%, 75% 15%, 70% 85%, 65% 10%, 60% 90%, 55% 20%, 
        50% 80%, 45% 15%, 40% 85%, 35% 10%, 30% 90%, 25% 20%, 20% 80%, 15% 5%, 10% 95%, 5% 40%
    );
    
    opacity: 0;
    z-index: 100;
    animation: tesla-fine-oscillation 0.12s infinite linear;
    pointer-events: none;
}

.ufo-link:hover::after {
    opacity: 1; 
    display: block;
}

@keyframes tesla-fine-oscillation {
    0%, 100% {
        clip-path: polygon(
            0% 50%, 5% 10%, 10% 90%, 15% 5%, 20% 95%, 25% 15%, 30% 85%, 35% 10%, 40% 90%, 45% 5%, 
            50% 95%, 55% 15%, 60% 85%, 65% 10%, 70% 90%, 75% 5%, 80% 95%, 85% 15%, 90% 85%, 95% 10%, 100% 50%,
            95% 40%, 90% 60%, 85% 20%, 80% 80%, 75% 15%, 70% 85%, 65% 10%, 60% 90%, 55% 20%, 
            50% 80%, 45% 15%, 40% 85%, 35% 10%, 30% 90%, 25% 20%, 20% 80%, 15% 5%, 10% 95%, 5% 40%
        );
    }
    33% {
        clip-path: polygon(
            0% 52%, 6% 90%, 11% 5%, 16% 95%, 21% 10%, 26% 90%, 31% 5%, 36% 95%, 41% 15%, 46% 85%, 
            51% 10%, 56% 90%, 61% 5%, 66% 95%, 71% 10%, 76% 90%, 81% 5%, 86% 95%, 91% 15%, 96% 85%, 100% 50%,
            96% 60%, 91% 40%, 86% 80%, 81% 20%, 76% 85%, 71% 15%, 66% 90%, 61% 10%, 56% 80%, 
            51% 20%, 46% 85%, 41% 10%, 36% 90%, 31% 15%, 26% 85%, 21% 10%, 16% 90%, 11% 5%, 6% 60%
        );
    }
    66% {
        clip-path: polygon(
            0% 48%, 4% 15%, 9% 85%, 14% 10%, 19% 90%, 24% 5%, 29% 95%, 34% 15%, 39% 85%, 44% 10%, 
            49% 90%, 54% 5%, 59% 95%, 64% 15%, 69% 85%, 74% 10%, 79% 90%, 84% 5%, 89% 95%, 94% 15%, 100% 50%,
            94% 20%, 89% 80%, 84% 15%, 79% 85%, 74% 10%, 69% 90%, 64% 20%, 59% 80%, 54% 15%, 
            49% 85%, 44% 10%, 39% 90%, 34% 20%, 29% 80%, 24% 15%, 19% 85%, 14% 10%, 9% 90%, 4% 20%
        );
    }
}

.ufo-link:hover::after {
    /* On utilise une animation de sortie pour l'arc lui-même */
    animation: tesla-fine-oscillation 0.12s infinite linear, arc-burn-out 0.1s forwards;
    animation-delay: 0s, 0.30s;
}

@keyframes arc-burn-out {
    100% { opacity: 0; visibility: hidden; }
}


@keyframes ufo-fly-away-left {
    0% { 
        transform: scaleX(-1) translateY(0); 
        opacity: 1; 
    }
    100% { 
        transform: scaleX(-1) translateY(-200px) translateX(-50px) scale(0.2); 
        opacity: 0; 
    }
}

@keyframes ufo-fly-away-right {
    0% { 
        transform: translateY(0); 
        opacity: 1; 
    }
    100% { 
        transform: translateY(-200px) translateX(50px) scale(0.2); 
        opacity: 0; 
    }
}

.ufo-link:hover .ufo-text {
    color: #00f2ff !important;
    transition: color 0.3s;
}

.ufo-left, .ufo-right {
    position: relative;
    display: inline-block !important;
}

.ufo-left::before, .ufo-right::before {
    content: '';
    position: absolute;
    top: calc(50% + 4px);
    left: calc(50% - 2px);
    transform: translate(-50%, -50%);
    width: 25px;
    height: 25px;
    background: radial-gradient(circle, rgba(0, 242, 255, 0.6) 0%, rgba(0, 128, 255, 0) 70%);
    border-radius: 50%;
    z-index: -1;
    opacity: 0.5;
    animation: pulseHalo 3s infinite ease-in-out;
}

@keyframes pulseHalo {
    0%, 100% {
        transform: translate(-50%, -50%) scale(0.9);
        opacity: 0.4;
    }
    50% {
        transform: translate(-50%, -50%) scale(1.3);
        opacity: 0.8;
    }
}

.ufo-link:hover .ufo-left::before,
.ufo-link:hover .ufo-right::before {
    background: radial-gradient(circle, rgba(0, 255, 255, 0.9) 0%, rgba(0, 140, 255, 0.2) 75%);
    animation: vibrateHalo 0.3s infinite alternate ease-in-out;
}

@keyframes vibrateHalo {
    0% {
        transform: translate(-50%, -50%) scale(1.2) translate(-1px, 1px);
        opacity: 0.9;
    }
    100% {
        transform: translate(-50%, -50%) scale(1.4) translate(1px, -1px);
        opacity: 1;
    }
}

.soutien-studio-wrapper img[src*="beverage"],
.soutien-studio-wrapper img[src*="drink"] {
    display: inline-block;
    animation: softRock 3s ease-in-out infinite;
    transform-origin: bottom center;
}

@keyframes softRock {
    0%, 100% {
        transform: rotate(0deg);
    }
    25% {
        transform: rotate(-14deg);
    }
    75% {
        transform: rotate(14deg);
    }
}
