.glass-effect {
    background: rgba(255, 255, 255, 0.7);
    backdrop-filter: blur(20px) saturate(180%);
    -webkit-backdrop-filter: blur(20px) saturate(180%);
    border: 1px solid rgba(255, 255, 255, 0.3);
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.06);
}

.glass-badge {
    background: rgba(65, 105, 225, 0.1);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    border: 1px solid rgba(65, 105, 225, 0.2);
}

.header.glass-effect {
    background: rgba(255, 255, 255, 0.92);
    backdrop-filter: blur(20px) saturate(150%);
    -webkit-backdrop-filter: blur(20px) saturate(150%);
    box-shadow: 0 0 1px rgba(0, 0, 0, 0.1);
    border: 1.5px solid rgba(5, 150, 105, 0.25);
    /* Anti-artifact protection */
    transform: translateZ(0);
    -webkit-transform: translateZ(0);
    will-change: transform;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    overflow: visible;
}

.stat-card.glass-effect:hover,
.category-card.glass-effect:hover,
.product-card.glass-effect:hover {
    background: rgba(255, 255, 255, 0.85);
    backdrop-filter: blur(25px) saturate(200%);
    -webkit-backdrop-filter: blur(25px) saturate(200%);
}



.footer.glass-effect {
    background: rgba(255, 255, 255, 0.6);
    backdrop-filter: blur(20px) saturate(180%);
    -webkit-backdrop-filter: blur(20px) saturate(180%);
}

@supports not (backdrop-filter: blur(20px)) {
    .glass-effect {
        background: rgba(255, 255, 255, 0.95);
    }
    
    .header.glass-effect {
        background: rgba(255, 255, 255, 0.98);
    }
}