/* 1. Basis & Core Web Vitals */
img {
    max-width: 100%;
    height: auto;
    aspect-ratio: auto attr(width) / attr(height);
    object-fit: contain; /* Behoudt verhouding zonder te croppen */
    display: block;
    content-visibility: auto;
    decoding: async;
    }

/* 2. LCP Priority (Cruciaal voor Pagespeed) */
#logo, #bigpic, .logo, .primary_block .product-image img {
    content-visibility: visible !important;
    decoding: sync !important;
    contain: none !important;
    fetchpriority: high; /* Browser hint */
}

/* 3. Lazyload Animation */
img[loading="lazy"] {
    opacity: 1; /* Browser regelt dit zelf */
}

img.lazyload {
    opacity: 0;
    will-change: opacity;
}

img.lazyload-loaded, img.lazyloaded {
    opacity: 1;
    transition: opacity 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

/* 4. Product Lijsten Performance */
.product-list li, .product_list .ajax_block_product {
    contain: layout style paint;
    content-visibility: auto;
    contain-intrinsic-size: auto 400px;
}

/* 5. Zoom & Helpers */
.jqzoom img, #views_block img {
    max-width: none;
    height: auto;
    content-visibility: visible;
}