/* PERFORMANCE FIX SICURO - Miglioramenti velocità caricamento */

/* Ottimizzazione font loading */
@font-face {
    font-family: 'Optimized System';
    src: local('system-ui'), local('-apple-system'), local('BlinkMacSystemFont');
    font-display: swap;
}

/* Preload critical resources */
.critical-image {
    loading: eager;
    fetchpriority: high;
}

/* Lazy loading per immagini non critiche */
.lazy-image {
    loading: lazy;
    transition: opacity 0.3s ease;
}

.lazy-image:not([src]) {
    opacity: 0;
}

/* Ottimizzazione layout principale */
.main-container {
    contain: layout style;
}

/* Miglioramento rendering bottoni */
.btn {
    will-change: transform;
    backface-visibility: hidden;
    transform: translateZ(0);
}

.btn:hover {
    transform: translateY(-2px) translateZ(0);
}

/* Grid ottimizzato per performance */
.cars-grid {
    content-visibility: auto;
    contain-intrinsic-size: 300px;
}

.car-card {
    content-visibility: auto;
    contain-intrinsic-size: 400px;
}

/* Prevenzione layout shift */
.car-image-placeholder {
    aspect-ratio: 16/10;
    background: linear-gradient(135deg, #1a1a1a 0%, #2d2d2d 100%);
    display: flex;
    align-items: center;
    justify-content: center;
    color: #666;
    font-size: 0.9rem;
}

/* Ottimizzazione form */
.form-control {
    will-change: border-color;
}

.form-control:focus {
    will-change: auto;
}

/* Smooth scrolling performance */
html {
    scroll-behavior: smooth;
}

@media (prefers-reduced-motion: reduce) {
    html {
        scroll-behavior: auto;
    }
    
    * {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
    }
}

/* Ottimizzazione critiche per LCP */
.hero-section {
    contain: layout;
}

.hero-title {
    font-display: swap;
    contain: layout style;
}

/* Prevenzione FOUC */
.fade-in {
    opacity: 0;
    animation: fadeIn 0.5s ease forwards;
}

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

/* Ottimizzazione immagini responsive */
.responsive-image {
    height: auto;
    max-width: 100%;
    object-fit: cover;
    image-rendering: -webkit-optimize-contrast;
}

/* Fix per iOS Safari */
@supports (-webkit-touch-callout: none) {
    .btn {
        -webkit-appearance: none;
        -webkit-transform: translateZ(0);
    }
}

/* Miglioramento rendering testo */
body {
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

/* Cache-friendly animations */
@media (hover: hover) {
    .hover-lift:hover {
        transform: translateY(-4px);
        transition: transform 0.2s ease;
    }
}

/* Ottimizzazione per touch devices */
@media (hover: none) {
    .hover-effect {
        transform: none !important;
    }
}