/* ============================================
   Text Glow Effect
   ============================================ */

/* Word Spans */
.word-glow {
    display: inline-block;
    text-shadow: 0 0 0 rgba(255, 255, 255, 0),
                 0 0 0 rgba(255, 255, 255, 0);
    transition: text-shadow 1s ease-out;
    cursor: default;
    /* Performance: GPU-Beschleunigung */
    transform: translateZ(0);
    backface-visibility: hidden;
}

/* Glowing State - pulsierender Leuchteffekt (synchron mit Überschrift) */
.word-glow.glowing {
    animation: word-glow-pulse 6s ease-in-out infinite;
    transition: text-shadow 0.8s ease-in-out;
}

/* Leuchteffekt Animation für Wörter - Performance-optimiert mit text-shadow statt filter */
@keyframes word-glow-pulse {
    0%, 100% {
        text-shadow: 0 0 calc(3px * var(--glow-intensity, 1)) rgba(255, 255, 255, var(--glow-intensity, 1)),
                     0 0 calc(9px * var(--glow-intensity, 1)) rgba(255, 255, 255, calc(0.8 * var(--glow-intensity, 1)));
    }
    50% {
        text-shadow: 0 0 calc(4.5px * var(--glow-intensity, 1)) rgba(255, 255, 255, var(--glow-intensity, 1)),
                     0 0 calc(18px * var(--glow-intensity, 1)) rgba(255, 255, 255, var(--glow-intensity, 1));
    }
}

/* Performance Optimierung */
.word-glow {
    will-change: text-shadow;
}

/* Accessibility: Respektiere prefers-reduced-motion */
@media (prefers-reduced-motion: reduce) {
    .word-glow.glowing {
        animation: none;
        text-shadow: 0 0 3px rgba(255, 255, 255, var(--glow-intensity, 1)),
                     0 0 9px rgba(255, 255, 255, calc(0.8 * var(--glow-intensity, 1)));
    }
}