.start-animation {
    position: fixed;
    inset: 0;
    z-index: 10000;
    display: flex;
    align-items: center;
    justify-content: center;
    background: radial-gradient(circle at center, rgba(230, 230, 230, 0.45) 0%, rgba(20, 21, 26, 0.96) 55%, rgba(12, 13, 16, 1) 100%);
    backdrop-filter: blur(4px);
    transition: opacity 0.6s ease;
}

.start-animation.fade-out {
    opacity: 0;
    pointer-events: none;
}

.animation-stage {
    text-align: center;
    color: var(--kumpel-cream, #f7f5f2);
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1.4rem;
}

.animation-stage img {
    max-width: clamp(160px, 26vw, 320px);
    height: auto;
    filter: drop-shadow(0 12px 30px rgba(0, 0, 0, 0.35));
    animation: fadein 0.6s ease;
}

.animation-text {
    font-size: clamp(1.3rem, 2.2vw, 2rem);
    letter-spacing: 0.14em;
    text-transform: uppercase;
    animation: fadein 0.6s ease;
}

.animation-title {
    font-family: var(--font-display, 'Space Grotesk', sans-serif);
    font-size: clamp(1.6rem, 3vw, 2.6rem);
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--kumpel-cream, #f7f5f2);
    animation: fadein 0.6s ease;
}

.animation-eyebrow {
    font-size: clamp(0.9rem, 1.8vw, 1.2rem);
    letter-spacing: 0.2em;
    text-transform: uppercase;
    color: rgba(230, 230, 230, 0.75);
}

@keyframes fadein {
    from {
        opacity: 0;
        transform: translateY(12px) scale(0.98);
    }
    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}
