/* ============================================
   PREMIUM SCROLL ANIMATIONS V1
   Smooth & Professional
   ============================================ */

/* Base Animation Setup */
[data-animate] {
    opacity: 0;
    transition: all 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

[data-animate].animated {
    opacity: 1;
}

/* ============================================
   FADE & SLIDE ANIMATIONS
   ============================================ */

/* Fade In from Left */
[data-animate="fadeInLeft"] {
    transform: translateX(-100px);
}

[data-animate="fadeInLeft"].animated {
    transform: translateX(0);
}

/* Fade In from Right */
[data-animate="fadeInRight"] {
    transform: translateX(100px);
}

[data-animate="fadeInRight"].animated {
    transform: translateX(0);
}

/* Fade In from Top */
[data-animate="fadeInUp"] {
    transform: translateY(80px);
}

[data-animate="fadeInUp"].animated {
    transform: translateY(0);
}

/* Fade In from Bottom */
[data-animate="fadeInDown"] {
    transform: translateY(-80px);
}

[data-animate="fadeInDown"].animated {
    transform: translateY(0);
}

/* ============================================
   ZOOM ANIMATIONS
   ============================================ */

/* Zoom In */
[data-animate="zoomIn"] {
    transform: scale(0.7);
}

[data-animate="zoomIn"].animated {
    transform: scale(1);
}

/* Zoom In Up */
[data-animate="zoomInUp"] {
    transform: scale(0.7) translateY(60px);
}

[data-animate="zoomInUp"].animated {
    transform: scale(1) translateY(0);
}

/* Zoom Out */
[data-animate="zoomOut"] {
    transform: scale(1.3);
}

[data-animate="zoomOut"].animated {
    transform: scale(1);
}

/* ============================================
   ROTATE & FLIP ANIMATIONS
   ============================================ */

/* Rotate In */
[data-animate="rotateIn"] {
    transform: rotate(-180deg) scale(0.7);
}

[data-animate="rotateIn"].animated {
    transform: rotate(0deg) scale(1);
}

/* Flip In X */
[data-animate="flipInX"] {
    transform: perspective(800px) rotateX(-90deg);
}

[data-animate="flipInX"].animated {
    transform: perspective(800px) rotateX(0);
}

/* Flip In Y */
[data-animate="flipInY"] {
    transform: perspective(800px) rotateY(-90deg);
}

[data-animate="flipInY"].animated {
    transform: perspective(800px) rotateY(0);
}

/* ============================================
   BOUNCE & ELASTIC ANIMATIONS
   ============================================ */

/* Bounce In */
[data-animate="bounceIn"] {
    transform: scale(0.3);
    animation-timing-function: cubic-bezier(0.68, -0.55, 0.265, 1.55);
}

[data-animate="bounceIn"].animated {
    transform: scale(1);
}

/* Bounce In Up */
[data-animate="bounceInUp"] {
    transform: translateY(100px);
    animation-timing-function: cubic-bezier(0.68, -0.55, 0.265, 1.55);
}

[data-animate="bounceInUp"].animated {
    transform: translateY(0);
}

/* ============================================
   BLUR & REVEAL ANIMATIONS
   ============================================ */

/* Blur In */
[data-animate="blurIn"] {
    filter: blur(20px);
    transform: scale(1.1);
}

[data-animate="blurIn"].animated {
    filter: blur(0);
    transform: scale(1);
}

/* Reveal Left */
[data-animate="revealLeft"] {
    clip-path: inset(0 100% 0 0);
}

[data-animate="revealLeft"].animated {
    clip-path: inset(0 0 0 0);
}

/* Reveal Right */
[data-animate="revealRight"] {
    clip-path: inset(0 0 0 100%);
}

[data-animate="revealRight"].animated {
    clip-path: inset(0 0 0 0);
}

/* ============================================
   STAGGER ANIMATIONS (for multiple items)
   ============================================ */

[data-animate-stagger] > * {
    opacity: 0;
    transform: translateY(40px);
    transition: all 0.6s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

[data-animate-stagger].animated > *:nth-child(1) { 
    transition-delay: 0.1s; 
    opacity: 1; 
    transform: translateY(0); 
}
[data-animate-stagger].animated > *:nth-child(2) { 
    transition-delay: 0.2s; 
    opacity: 1; 
    transform: translateY(0); 
}
[data-animate-stagger].animated > *:nth-child(3) { 
    transition-delay: 0.3s; 
    opacity: 1; 
    transform: translateY(0); 
}
[data-animate-stagger].animated > *:nth-child(4) { 
    transition-delay: 0.4s; 
    opacity: 1; 
    transform: translateY(0); 
}
[data-animate-stagger].animated > *:nth-child(5) { 
    transition-delay: 0.5s; 
    opacity: 1; 
    transform: translateY(0); 
}
[data-animate-stagger].animated > *:nth-child(6) { 
    transition-delay: 0.6s; 
    opacity: 1; 
    transform: translateY(0); 
}

/* ============================================
   SECTION-SPECIFIC ANIMATIONS
   ============================================ */

/* Hero Content Animation */
.hero-content {
    opacity: 0;
    transform: translateX(-80px);
    transition: all 1s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.hero-content.animated {
    opacity: 1;
    transform: translateX(0);
}

/* Hero Form Animation */
.quote-form {
    opacity: 0;
    transform: translateX(80px) scale(0.95);
    transition: all 1s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.2s;
}

.quote-form.animated {
    opacity: 1;
    transform: translateX(0) scale(1);
}

/* Turnkey Cards Animation */
.turnkey-left {
    opacity: 0;
    transform: translateX(-60px);
    transition: all 0.9s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.turnkey-left.animated {
    opacity: 1;
    transform: translateX(0);
}

.card {
    opacity: 0;
    transform: translateY(60px) scale(0.9);
    transition: all 0.8s cubic-bezier(0.34, 1.56, 0.64, 1);
}

.card:nth-child(1).animated {
    opacity: 1;
    transform: translateY(0) scale(1);
    transition-delay: 0.1s;
}

.card:nth-child(2).animated {
    opacity: 1;
    transform: translateY(0) scale(1);
    transition-delay: 0.2s;
}

.card:nth-child(3).animated {
    opacity: 1;
    transform: translateY(0) scale(1);
    transition-delay: 0.3s;
}

/* Steps Animation */
.step-item {
    opacity: 0;
    transform: scale(0.5) rotate(-10deg);
    transition: all 0.7s cubic-bezier(0.34, 1.56, 0.64, 1);
}

.step-item.animated {
    opacity: 1;
    transform: scale(1) rotate(0);
}

.step-item:nth-child(odd).animated {
    transition-delay: 0.1s;
}

.step-item:nth-child(even).animated {
    transition-delay: 0.2s;
}

/* Work Showcase Animation */
.work-preview {
    opacity: 0;
    transform: translateX(-100px) scale(0.9);
    transition: all 1s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.work-preview.animated {
    opacity: 1;
    transform: translateX(0) scale(1);
}

.work-content {
    opacity: 0;
    transform: translateX(100px);
    transition: all 1s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.2s;
}

.work-content.animated {
    opacity: 1;
    transform: translateX(0);
}

/* Interior Cards Animation */
.interior-card {
    opacity: 0;
    transform: scale(0.8) rotateY(-20deg);
    transition: all 0.8s cubic-bezier(0.34, 1.56, 0.64, 1);
}

.interior-card.animated {
    opacity: 1;
    transform: scale(1) rotateY(0);
}

.interior-card:nth-child(odd).animated {
    transition-delay: 0.1s;
}

.interior-card:nth-child(even).animated {
    transition-delay: 0.25s;
}

/* Why Cards - Continuous Scroll Effect */
.why-card {
    animation: floatCard 3s ease-in-out infinite alternate;
}

.why-card:nth-child(odd) {
    animation-delay: 0.5s;
}

@keyframes floatCard {
    0% { transform: translateY(0px); }
    100% { transform: translateY(-10px); }
}

/* Tour 360 Cards */
.tour-card {
    opacity: 0;
    transform: perspective(800px) rotateY(-30deg) translateX(-50px);
    transition: all 0.8s cubic-bezier(0.34, 1.56, 0.64, 1);
}

.tour-card.animated {
    opacity: 1;
    transform: perspective(800px) rotateY(0) translateX(0);
}

.tour-card:nth-child(1).animated { transition-delay: 0.1s; }
.tour-card:nth-child(2).animated { transition-delay: 0.2s; }
.tour-card:nth-child(3).animated { transition-delay: 0.3s; }
.tour-card:nth-child(4).animated { transition-delay: 0.4s; }

/* Compare Section */
.compare-col {
    opacity: 0;
    transition: all 1s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.compare-col:first-child {
    transform: translateX(-80px);
}

.compare-col:last-child {
    transform: translateX(80px);
}

.compare-col.animated {
    opacity: 1;
    transform: translateX(0);
}

/* Client Cards */
.client-card {
    opacity: 0;
    transform: translateY(60px) scale(0.95);
    transition: all 0.7s cubic-bezier(0.34, 1.56, 0.64, 1);
}

.client-card.animated {
    opacity: 1;
    transform: translateY(0) scale(1);
}

/* Team Cards */
.team-card {
    opacity: 0;
    transform: translateY(80px) rotateX(-15deg);
    transition: all 0.9s cubic-bezier(0.34, 1.56, 0.64, 1);
}

.team-card.animated {
    opacity: 1;
    transform: translateY(0) rotateX(0);
}

.team-card:nth-child(1).animated { transition-delay: 0.1s; }
.team-card:nth-child(2).animated { transition-delay: 0.25s; }
.team-card:nth-child(3).animated { transition-delay: 0.4s; }

/* FAQ Items */
.faq-item {
    opacity: 0;
    transform: translateX(-40px);
    transition: all 0.6s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.faq-item.animated {
    opacity: 1;
    transform: translateX(0);
}

.faq-item:nth-child(odd).animated {
    transition-delay: 0.05s;
}

.faq-item:nth-child(even).animated {
    transition-delay: 0.15s;
}

/* Contact Section */
.contact-image {
    opacity: 0;
    transform: translateX(-100px) scale(0.95);
    transition: all 1s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.contact-image.animated {
    opacity: 1;
    transform: translateX(0) scale(1);
}

.contact-form-box {
    opacity: 0;
    transform: translateX(100px);
    transition: all 1s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.2s;
}

.contact-form-box.animated {
    opacity: 1;
    transform: translateX(0);
}

/* ============================================
   MOBILE OPTIMIZATIONS
   ============================================ */

@media (max-width: 968px) {
    [data-animate] {
        transition-duration: 0.6s;
    }
    
    [data-animate="fadeInLeft"],
    [data-animate="fadeInRight"] {
        transform: translateY(40px);
    }
    
    [data-animate="fadeInLeft"].animated,
    [data-animate="fadeInRight"].animated {
        transform: translateY(0);
    }
}