/* ============================================================
   PERFORMANCE OPTIMIZATIONS
   ============================================================ */

/* Will-Change for Animated Elements */
.hero,
.package-card-tiktok,
.package-card-modern,
.feature-card,
.review-card,
.btn-primary,
.btn-secondary {
    will-change: transform;
    transform: translateZ(0);
    backface-visibility: hidden;
}

/* GPU Acceleration */
.animated-element {
    transform: translate3d(0, 0, 0);
}

/* Optimize Images */
img {
    image-rendering: -webkit-optimize-contrast;
    image-rendering: crisp-edges;
}

/* Lazy Loading Support - Fixed to show images immediately */
img[loading="lazy"] {
    opacity: 1;
}

/* Reduce Paint on Scroll */
.fixed-element {
    position: fixed;
    will-change: transform;
}

/* Optimize Shadows */
.optimized-shadow {
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
}

.optimized-shadow:hover {
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.3);
}

/* Contain Layout Shifts */
.contain-layout {
    contain: layout;
}

.contain-paint {
    contain: paint;
}

/* Optimize Animations for Low-End Devices */
@media (prefers-reduced-motion: reduce) {
    * {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
    }
}

/* Optimize for Touch Devices */
@media (hover: none) and (pointer: coarse) {
    .hover-effect:hover {
        transform: none;
    }
    
    .hover-effect:active {
        transform: scale(0.98);
    }
}

/* Content Visibility for Off-Screen Elements */
.lazy-section {
    content-visibility: auto;
    contain-intrinsic-size: 0 500px;
}

/* Optimize Backdrop Filter */
.backdrop-blur {
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
}

@supports not (backdrop-filter: blur(10px)) {
    .backdrop-blur {
        background: rgba(0, 0, 0, 0.8);
    }
}