/* ==========================================================================
   VARA FARM HAVEN — ANIMATIONS STYLESHEET
   Based on design.md (Sections 30 - 32 & 40)
   ========================================================================== */

/* --------------------------------------------------------------------------
   31. Scroll Reveal Animations
   -------------------------------------------------------------------------- */
.reveal {
    opacity: 0;
    transform: translateY(30px);
    transition: opacity 700ms cubic-bezier(0.16, 1, 0.3, 1), transform 700ms cubic-bezier(0.16, 1, 0.3, 1);
    will-change: opacity, transform;
}

.reveal.visible {
    opacity: 1;
    transform: translateY(0);
}

.reveal-delay-1 {
    transition-delay: 150ms;
}

.reveal-delay-2 {
    transition-delay: 300ms;
}

.reveal-delay-3 {
    transition-delay: 450ms;
}

/* --------------------------------------------------------------------------
   32. Image Reveal (Clipping Mask)
   -------------------------------------------------------------------------- */
.image-reveal {
    clip-path: inset(0 100% 0 0);
    transition: clip-path 1000ms cubic-bezier(0.77, 0, 0.18, 1);
    will-change: clip-path;
}

.image-reveal.visible,
.reveal.visible .image-reveal,
.reveal.visible.image-reveal {
    clip-path: inset(0 0 0 0);
}

/* Subtle Scale Effect on Image Container */
.img-zoom-container {
    overflow: hidden;
    position: relative;
}

.img-zoom-container img {
    transition: transform var(--transition-slow);
}

.img-zoom-container:hover img {
    transform: scale(1.04);
}

/* --------------------------------------------------------------------------
   Pulse Animation for Destination Marker
   -------------------------------------------------------------------------- */
@keyframes pulse-ring {
    0% {
        transform: scale(0.95);
        opacity: 0.8;
    }
    50% {
        transform: scale(1.3);
        opacity: 0.2;
    }
    100% {
        transform: scale(0.95);
        opacity: 0.8;
    }
}

.pulsing-marker {
    animation: pulse-ring 2.5s infinite ease-in-out;
}

/* --------------------------------------------------------------------------
   33. Parallax Motion Engine Utilities
   -------------------------------------------------------------------------- */
.parallax-img-wrap {
    position: relative;
    overflow: hidden;
    width: 100%;
    height: 100%;
}

.parallax-img {
    will-change: transform;
    transform: translate3d(0, var(--parallax-y, 0px), 0) scale(1.12);
    transition: transform 120ms cubic-bezier(0.25, 1, 0.5, 1);
}

.img-zoom-container .parallax-img {
    height: 118%;
    width: 100%;
    object-fit: cover;
    margin-top: -9%;
}

.parallax-card {
    will-change: transform;
    transform: translate3d(0, var(--parallax-card-y, 0px), 0);
    transition: transform 120ms cubic-bezier(0.25, 1, 0.5, 1);
}

/* --------------------------------------------------------------------------
   34. GSAP Heading Text Reveal Wrappers
   -------------------------------------------------------------------------- */
.gsap-heading-wrap {
    overflow: hidden;
    display: inline-block;
    vertical-align: top;
    line-height: 1.15;
    padding-bottom: 0.08em;
    margin-bottom: -0.08em;
}

.gsap-word-reveal {
    display: inline-block;
    will-change: transform, opacity;
    transform-origin: 0% 100%;
}

/* --------------------------------------------------------------------------
   40. Reduced Motion Support
   -------------------------------------------------------------------------- */
@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
        scroll-behavior: auto !important;
    }
    .reveal {
        opacity: 1 !important;
        transform: none !important;
    }
    .image-reveal {
        clip-path: inset(0 0 0 0) !important;
    }
    .parallax-img,
    .parallax-card {
        transform: none !important;
        transition: none !important;
    }
}