/* ─────────────────────────────────────────
   EventCamp Scroll & Hover Animations
   ───────────────────────────────────────── */

/* ── 1. Fade up (default) ── */
.ec-animate {
    opacity: 0;
    transform: translateY(48px);
    transition: opacity 0.65s ease-out, transform 0.65s ease-out;
}
.ec-animate.ec-visible {
    opacity: 1;
    transform: translateY(0);
}

/* ── 2. Fade from left ── */
.ec-animate-left {
    opacity: 0;
    transform: translateX(-56px);
    transition: opacity 0.65s ease-out, transform 0.65s ease-out;
}
.ec-animate-left.ec-visible {
    opacity: 1;
    transform: translateX(0);
}

/* ── 3. Fade from right ── */
.ec-animate-right {
    opacity: 0;
    transform: translateX(56px);
    transition: opacity 0.65s ease-out, transform 0.65s ease-out;
}
.ec-animate-right.ec-visible {
    opacity: 1;
    transform: translateX(0);
}

/* ── 4. Scale in — pops in with a spring bounce ── */
.ec-animate-scale {
    opacity: 0;
    transform: scale(0.78);
    transition: opacity 0.6s ease-out, transform 0.6s cubic-bezier(0.34, 1.56, 0.64, 1);
}
.ec-animate-scale.ec-visible {
    opacity: 1;
    transform: scale(1);
}

/* ── 5. Blur fade — unsharpens into view ── */
.ec-animate-blur {
    opacity: 0;
    filter: blur(12px);
    transform: translateY(20px);
    transition: opacity 0.75s ease-out, filter 0.75s ease-out, transform 0.75s ease-out;
}
.ec-animate-blur.ec-visible {
    opacity: 1;
    filter: blur(0px);
    transform: translateY(0);
}

/* ── 6. 3D flip — tilts forward into place ── */
.ec-animate-flip {
    opacity: 0;
    transform: perspective(700px) rotateX(28deg) translateY(30px);
    transition: opacity 0.65s ease-out, transform 0.65s ease-out;
}
.ec-animate-flip.ec-visible {
    opacity: 1;
    transform: perspective(700px) rotateX(0deg) translateY(0);
}

/* ── Stagger delay helpers ── */
.ec-delay-1 { transition-delay: 0.10s; }
.ec-delay-2 { transition-delay: 0.20s; }
.ec-delay-3 { transition-delay: 0.32s; }
.ec-delay-4 { transition-delay: 0.44s; }
.ec-delay-5 { transition-delay: 0.56s; }

/* ─────────────────────────────────────────
   Hover effects
   ───────────────────────────────────────── */

/* Lift */
.ec-hover-lift {
    transition: transform 0.28s ease, box-shadow 0.28s ease;
}
.ec-hover-lift:hover {
    transform: translateY(-8px);
    box-shadow: 0 16px 40px rgba(0, 0, 0, 0.14);
}

/* Scale */
.ec-hover-scale {
    transition: transform 0.28s ease, box-shadow 0.28s ease;
}
.ec-hover-scale:hover {
    transform: scale(1.05);
    box-shadow: 0 10px 28px rgba(0, 0, 0, 0.12);
}

/* Glow — orange brand ring */
.ec-hover-glow {
    transition: box-shadow 0.3s ease, transform 0.3s ease;
}
.ec-hover-glow:hover {
    box-shadow: 0 0 0 3px rgba(255, 107, 0, 0.4), 0 10px 28px rgba(255, 107, 0, 0.2);
    transform: translateY(-4px);
}

/* ─────────────────────────────────────────
   Continuous animations
   ───────────────────────────────────────── */

/* Gentle pulse — for CTA badges */
@keyframes ec-pulse-anim {
    0%, 100% { transform: scale(1);    opacity: 1; }
    50%       { transform: scale(1.05); opacity: 0.9; }
}
.ec-pulse {
    animation: ec-pulse-anim 3s ease-in-out infinite;
}

/* Shimmer sweep — for hero images / banners */
@keyframes ec-shimmer-move {
    0%   { transform: translateX(-100%); }
    100% { transform: translateX(100%); }
}
.ec-shimmer {
    position: relative;
    overflow: hidden;
}
.ec-shimmer::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 60%;
    height: 100%;
    background: linear-gradient(
        105deg,
        transparent 20%,
        rgba(255, 255, 255, 0.22) 50%,
        transparent 80%
    );
    animation: ec-shimmer-move 3.2s ease-in-out infinite;
    pointer-events: none;
    border-radius: inherit;
}

/* ─────────────────────────────────────────
   Reduced motion — respect user preference
   ───────────────────────────────────────── */
@media (prefers-reduced-motion: reduce) {
    .ec-animate,
    .ec-animate-left,
    .ec-animate-right,
    .ec-animate-scale,
    .ec-animate-blur,
    .ec-animate-flip {
        opacity: 1;
        transform: none;
        filter: none;
        transition: none;
    }
    .ec-hover-lift:hover,
    .ec-hover-scale:hover,
    .ec-hover-glow:hover {
        transform: none;
        box-shadow: none;
    }
    .ec-pulse       { animation: none; }
    .ec-shimmer::after { animation: none; }
}