/**
 * SEO Performance Optimizations
 * This file contains CSS optimizations to improve page speed and SEO performance
 */

/* Critical rendering path optimizations */
.hero, .hero-image, .logo, header, .mobile-menu-btn {
    content-visibility: auto;
    contain-intrinsic-size: auto;
}

/* Font display optimizations */
@font-face {
    font-display: swap; /* Ensures text remains visible during webfont load */
}

/* Image optimizations */
img {
    max-width: 100%;
    height: auto;
}

/* Responsive image size specifications */
.product-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

@media (max-width: 768px) {
    .product-img img {
        height: 180px;
    }
}

@media (max-width: 576px) {
    .product-img img {
        height: 150px;
    }
}

/* Optimize above-the-fold rendering */
.hero, header, .slider-section {
    will-change: transform;
}

/* Reduce layout shifts */
.hero-content, .product-card, .footer-content {
    min-height: fit-content;
    box-sizing: border-box;
}

/* Optimize for Core Web Vitals - Layout stability */
.product-card {
    aspect-ratio: 3/4;
}

.hero-image img {
    aspect-ratio: 16/9;
}

/* Optimize for Core Web Vitals - Interaction delays */
button, 
a.btn, 
input[type="submit"],
.nav-call-btn, 
#callNowBtn, 
#footerCallBtn {
    touch-action: manipulation;
    cursor: pointer;
}

/* Optimize mobile tap targets */
@media (max-width: 576px) {
    nav ul li a,
    .btn,
    .nav-call-btn,
    #callNowBtn,
    #footerCallBtn,
    .category-nav .swiper-slide {
        min-height: 48px;
        min-width: 48px;
        display: flex;
        align-items: center;
        justify-content: center;
    }
}

/* Improve visibility of focus states for accessibility */
a:focus, 
button:focus, 
input:focus, 
textarea:focus, 
select:focus {
    outline: 2px solid #4CAF50;
    outline-offset: 2px;
}

/* Reduce motion for users who prefer reduced motion */
@media (prefers-reduced-motion: reduce) {
    * {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
        scroll-behavior: auto !important;
    }
}

/* Print styles for better SEO */
@media print {
    body {
        color: #000;
        background: #fff;
    }
    
    a {
        color: #000;
        text-decoration: underline;
    }
    
    /* Show URLs for links when printing */
    a[href]:after {
        content: " (" attr(href) ")";
    }
}