/* ==============================================
   Dynamic Text Colors - Wave Background Harmony
   ============================================== */

/* Hero Section Text - Wave-Harmonized Gradient */
.static-hero .slide-title {
    background: linear-gradient(
        90deg,
        #ffffff,      /* White - high contrast */
        #e0f7fa,      /* Light cyan */
        #00c896,      /* Turquoise */
        #ffffff       /* Back to white */
    );
    background-size: 300% 300%;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    animation: textGradientShift 8s ease infinite;
    filter: drop-shadow(0 0 15px rgba(0, 200, 150, 0.4)) 
            drop-shadow(0 0 30px rgba(255, 255, 255, 0.3));
    font-weight: 700 !important;
}

/* Arrow Icon - Clean without glow */
.static-hero .slide-title .icon {
    display: inline-block;
    animation: iconFloat 3s ease-in-out infinite;
    position: relative;
}

/* Glow effect removed */

.static-hero .slide-title .icon img {
    /* No filter - use original SVG colors */
    opacity: 1;
}

/* Icon Glow Animation */
@keyframes iconGlow {
    0%, 100% {
        opacity: 0.6;
        filter: blur(15px);
    }
    50% {
        opacity: 0.8;
        filter: blur(20px);
    }
}

/* Icon Float Animation */
@keyframes iconFloat {
    0%, 100% {
        transform: translateY(0) rotate(0deg);
    }
    25% {
        transform: translateY(-5px) rotate(-5deg);
    }
    50% {
        transform: translateY(0) rotate(0deg);
    }
    75% {
        transform: translateY(-3px) rotate(5deg);
    }
}

/* Subtitle (Prasetyo) - Complementary to Background */
.static-hero .sud-title {
    background: linear-gradient(
        90deg,
        #ffffff,      /* White */
        #a7ffeb,      /* Light turquoise */
        #64ffda,      /* Cyan accent */
        #00c896,      /* Turquoise */
        #ffffff       /* White */
    );
    background-size: 300% 300%;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    animation: textGradientShift 8s ease infinite;
    animation-delay: 0.5s;
    filter: drop-shadow(0 0 20px rgba(255, 255, 255, 0.6))
            drop-shadow(0 0 35px rgba(0, 200, 150, 0.5))
            drop-shadow(0 0 50px rgba(100, 255, 218, 0.3));
    font-weight: 700 !important;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

/* Gradient Animation Keyframes */
@keyframes textGradientShift {
    0% {
        background-position: 0% 50%;
    }
    50% {
        background-position: 100% 50%;
    }
    100% {
        background-position: 0% 50%;
    }
}

/* Description Text - Subtle Enhancement */
.static-hero .description {
    color: rgba(255, 255, 255, 0.9);
    text-shadow: 
        0 0 10px rgba(0, 200, 150, 0.3),
        0 0 20px rgba(255, 255, 255, 0.2),
        0 2px 4px rgba(0, 18, 51, 0.5);
    font-weight: 400;
}

/* Button Contrast Enhancement */
.static-hero .btn,
.static-hero .button {
    border: 2px solid rgba(255, 255, 255, 0.3);
    background: rgba(0, 200, 150, 0.1);
    backdrop-filter: blur(10px);
    color: #ffffff;
    transition: all 0.3s ease;
}

.static-hero .btn:hover,
.static-hero .button:hover {
    background: rgba(0, 200, 150, 0.3);
    border-color: #00c896;
    box-shadow: 
        0 0 20px rgba(0, 200, 150, 0.5),
        0 0 40px rgba(100, 255, 218, 0.3);
    transform: translateY(-2px);
}

/* Responsive Adjustments */
@media (max-width: 768px) {
    .static-hero .slide-title,
    .static-hero .sud-title {
        filter: drop-shadow(0 0 10px rgba(255, 255, 255, 0.5))
                drop-shadow(0 0 20px rgba(0, 200, 150, 0.3));
    }
}