/* Animaciones CSS puras — sin librerías externas */

/* Reveal on scroll */
.reveal {
    opacity: 0;
    transform: translateY(32px);
    transition: opacity 0.7s var(--ease), transform 0.7s var(--ease);
}

.reveal--left  { transform: translateX(-32px); }
.reveal--right { transform: translateX(32px); }
.reveal--up    { transform: translateY(32px); }
.reveal--scale { transform: scale(0.94); }

.reveal.is-visible {
    opacity: 1;
    transform: none;
}

/* Delay helpers */
.delay-1 { transition-delay: 0.1s; }
.delay-2 { transition-delay: 0.2s; }
.delay-3 { transition-delay: 0.3s; }
.delay-4 { transition-delay: 0.4s; }
.delay-5 { transition-delay: 0.5s; }

/* Hero entrada */
@keyframes hero-fade-up {
    from { opacity: 0; transform: translateY(24px); }
    to   { opacity: 1; transform: translateY(0); }
}

.hero__venue-badge  { animation: hero-fade-up 0.6s var(--ease) 0.1s both; }
.hero__intro        { animation: hero-fade-up 0.6s var(--ease) 0.2s both; }
.hero__name         { animation: hero-fade-up 0.7s var(--ease) 0.3s both; }
.hero__presents     { animation: hero-fade-up 0.6s var(--ease) 0.4s both; }
.hero__album        { animation: hero-fade-up 0.6s var(--ease) 0.45s both; }
.hero__meta         { animation: hero-fade-up 0.6s var(--ease) 0.55s both; }
.hero .btn-cta      { animation: hero-fade-up 0.6s var(--ease) 0.65s both; }

/* Glow pulsante del botón */
@keyframes cta-glow {
    0%, 100% { box-shadow: var(--shadow-cta); }
    50%       { box-shadow: 0 0 60px rgba(232,160,32,0.6), 0 4px 30px rgba(0,0,0,0.5); }
}

.btn-cta { animation: cta-glow 3s ease-in-out infinite; }
.btn-cta:hover { animation: none; }

/* Countdown flip suave */
@keyframes flip {
    0%  { transform: rotateX(0deg); }
    50% { transform: rotateX(-90deg); }
    100%{ transform: rotateX(0deg); }
}

.countdown-flip { animation: flip 0.4s ease-in-out; }

/* Barra urgencia shimmer */
@keyframes shimmer {
    0%   { background-position: -200% center; }
    100% { background-position: 200% center; }
}

.urgency-bar {
    background: linear-gradient(
        90deg,
        var(--gold) 0%,
        var(--gold-light) 50%,
        var(--gold) 100%
    );
    background-size: 200% auto;
    animation: shimmer 3s linear infinite;
}