/* Image Lazy Loading Optimization */
img {
    /* Prevent layout shift while loading */
    background-color: #f0f0f0;
    /* Smooth transition when loaded */
    transition: opacity 0.3s ease;
}

img[loading="lazy"] {
    opacity: 0.95;
}

img.loaded {
    opacity: 1;
}

/* Background image optimization */
[data-bg-image] {
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    background-attachment: scroll;
}

[data-bg-image].bg-loaded {
    animation: fadeIn 0.4s ease;
}

@keyframes fadeIn {
    from { opacity: 0.8; }
    to { opacity: 1; }
}

/* Category images optimization */
.category-image,
.category-image-optimized {
    display: block;
    width: 100%;
    height: auto;
    max-width: 100%;
}

/* Package result images optimization */
.before-image img,
.after-image img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* Hero banner background optimization */
.slide-content {
    will-change: background-image;
    contain: layout style;
}

/* Reduce cumulative layout shift */
img[loading="lazy"]:not([src]) {
    min-height: 100px;
}

/* Optimize article/featured images */
.card-img-top {
    object-fit: cover;
    background-color: #f0f0f0;
}

/* Mobile image optimization */
@media (max-width: 768px) {
    [data-bg-image] {
        background-attachment: scroll;
    }
    
    img {
        width: 100%;
        height: auto;
    }
}