/**
 * Prayagraj Rooms - Advanced Scroll Animations & Interactive Motion System
 * Hardware accelerated (translate3d, will-change, cubic-bezier)
 * Safe progressive enhancement (elements never stay hidden if JS is inactive)
 */

/* ==========================================================================
   1. Scroll Reveal Core Engine
   ========================================================================== */
.reveal-ready {
    opacity: 0;
    transform: translate3d(0, 30px, 0);
    transition: opacity 0.7s cubic-bezier(0.16, 1, 0.3, 1),
                transform 0.7s cubic-bezier(0.16, 1, 0.3, 1);
    will-change: opacity, transform;
}

.reveal-ready.reveal-left {
    transform: translate3d(-40px, 0, 0);
}

.reveal-ready.reveal-right {
    transform: translate3d(40px, 0, 0);
}

.reveal-ready.reveal-down {
    transform: translate3d(0, -30px, 0);
}

.reveal-ready.reveal-zoom {
    transform: scale(0.92);
}

.reveal-ready.reveal-flip {
    transform: perspective(600px) rotateX(15deg);
}

/* Triggered State */
.reveal-ready.is-revealed {
    opacity: 1 !important;
    transform: translate3d(0, 0, 0) scale(1) rotate(0deg) !important;
}

/* ==========================================================================
   2. Stagger Delays (Cascading Children)
   ========================================================================== */
.delay-100 { transition-delay: 100ms !important; }
.delay-150 { transition-delay: 150ms !important; }
.delay-200 { transition-delay: 200ms !important; }
.delay-250 { transition-delay: 250ms !important; }
.delay-300 { transition-delay: 300ms !important; }
.delay-400 { transition-delay: 400ms !important; }
.delay-500 { transition-delay: 500ms !important; }
.delay-600 { transition-delay: 600ms !important; }
.delay-700 { transition-delay: 700ms !important; }

/* Dynamic room card entry animation */
.room-card.card-enter {
    animation: roomCardEnter 0.55s cubic-bezier(0.16, 1, 0.3, 1) both;
}

@keyframes roomCardEnter {
    from {
        opacity: 0;
        transform: translate3d(0, 24px, 0);
    }
    to {
        opacity: 1;
        transform: translate3d(0, 0, 0);
    }
}

/* ==========================================================================
   3. Ambient & Continuous Micro-Animations
   ========================================================================== */
/* Gentle floating for badges, icons, and floating buttons */
.anim-float {
    animation: animFloat 3.5s ease-in-out infinite;
}

@keyframes animFloat {
    0%, 100% {
        transform: translateY(0);
    }
    50% {
        transform: translateY(-6px);
    }
}

/* Soft radiant pulse for live indicators */
.anim-pulse-glow {
    animation: animPulseGlow 2.5s ease-in-out infinite;
}

@keyframes animPulseGlow {
    0%, 100% {
        box-shadow: 0 0 0 0 rgba(16, 185, 129, 0.45);
    }
    50% {
        box-shadow: 0 0 0 10px rgba(16, 185, 129, 0);
    }
}

/* Shimmer sweep on prominent CTA buttons */
.btn-shimmer {
    position: relative;
    overflow: hidden;
}

.btn-shimmer::after {
    content: '';
    position: absolute;
    top: -50%;
    left: -75%;
    width: 50%;
    height: 200%;
    background: linear-gradient(
        90deg,
        rgba(255, 255, 255, 0) 0%,
        rgba(255, 255, 255, 0.28) 50%,
        rgba(255, 255, 255, 0) 100%
    );
    transform: rotate(30deg);
    pointer-events: none;
    animation: shimmerSweep 4s infinite;
}

@keyframes shimmerSweep {
    0% {
        left: -75%;
    }
    20%, 100% {
        left: 140%;
    }
}

/* Interactive card hover glow */
.interactive-card {
    transition: transform 0.35s cubic-bezier(0.16, 1, 0.3, 1),
                box-shadow 0.35s cubic-bezier(0.16, 1, 0.3, 1),
                border-color 0.3s ease !important;
}

.interactive-card:hover {
    transform: translateY(-6px) translateZ(0) !important;
}

/* Dynamic metric counters */
.metric-value.counter-running {
    display: inline-block;
    transition: color 0.3s ease;
}

/* Smooth hero search bar focus animation */
.hero-search-form {
    transition: transform 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease;
}

.hero-search-form:focus-within {
    transform: translateY(-2px);
    box-shadow: 0 14px 36px rgba(37, 99, 235, 0.18), 0 0 0 2px rgba(59, 130, 246, 0.4);
}

/* Trust pills hover bounce */
.hero-trust-strip .trust-pill {
    transition: transform 0.25s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.25s ease;
}

.hero-trust-strip .trust-pill:hover {
    transform: translateY(-3px);
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.08);
}

/* Testimonial card quote icon pulse */
.testimonial-card:hover .quote-svg-bg {
    transform: scale(1.1) rotate(-5deg);
    transition: transform 0.4s cubic-bezier(0.16, 1, 0.3, 1);
    color: var(--primary-accent, #3b82f6) !important;
}

.testimonial-card .quote-svg-bg {
    transition: transform 0.4s ease, color 0.4s ease;
}

/* ==========================================================================
   4. Accessibility & Reduced Motion Preferences
   ========================================================================== */
@media (prefers-reduced-motion: reduce) {
    .reveal-ready,
    .reveal-ready.reveal-left,
    .reveal-ready.reveal-right,
    .reveal-ready.reveal-down,
    .reveal-ready.reveal-zoom,
    .reveal-ready.reveal-flip {
        opacity: 1 !important;
        transform: none !important;
        transition: none !important;
    }

    .room-card.card-enter {
        animation: none !important;
    }

    .anim-float,
    .anim-pulse-glow,
    .btn-shimmer::after {
        animation: none !important;
    }

    .interactive-card:hover {
        transform: none !important;
    }
}