/* Enhanced Mobile Fixes */
:root {
    --mobile-max-width: 100vw;
    --mobile-padding: env(safe-area-inset-left);
}

/* Base Mobile Styles */
html {
    box-sizing: border-box;
    -webkit-text-size-adjust: 100%;
    overflow-x: hidden;
}

body {
    position: relative;
    width: 100%;
    max-width: 100%;
    overflow-x: hidden;
    touch-action: pan-y;
}

/* iOS Specific Fixes */
@supports (-webkit-touch-callout: none) {
    body {
        width: var(--mobile-max-width);
        min-width: var(--mobile-max-width);
    }
    
    input, textarea {
        font-size: 16px !important;
    }
}

/* Android Specific Fixes */
@supports (font: -apple-system-body) and (-webkit-appearance: none) {
    * {
        -webkit-tap-highlight-color: transparent;
    }
}

/* Layout Containers */
.container, .navbar, 
.hero-content, .section, 
.services-grid, .gallery-grid, 
.contact-container {
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
    padding-left: max(1rem, var(--mobile-padding));
    padding-right: max(1rem, var(--mobile-padding));
}

/* Mobile Navigation and Logo Adjustments */
@media (max-width: 768px) {
    .navbar .logo img {
        height: 2rem;
    }
    
    .navbar .logo {
        font-size: 1.5rem;
        gap: 0.5rem;
    }

    body {
        position: fixed;
        width: 100%;
        height: 100%;
        overflow-y: auto;
    }
    
    .mobile-nav {
        width: 100vw;
        left: 0;
        right: 0;
    }
    
    .burger {
        right: max(1rem, var(--mobile-padding));
    }
}


/* Gallery Mobile Optimization */
@media (max-width: 768px) {
    .product-card {
        margin: 0 5px;
    }
    
    .swiper-slide {
        width: 85%;
    }
}


/* Product Card Mobile */
@media (max-width: 768px) {
    .product-card {
        margin: 0 5px;
        min-height: 280px;
    }
    .product-info {
        padding: 12px 8px;
    }
    .product-info h3 {
        font-size: 1rem;
    }
    .product-info p {
        font-size: 0.85rem;
    }
    .product-tag {
        font-size: 0.75rem;
    }
}

/* Safe Area Handling */
@supports (padding: max(0px)) {
    body {
        padding-left: 0;
        padding-right: 0;
        margin-left: env(safe-area-inset-left);
        margin-right: env(safe-area-inset-right);
    }
}

/* Reduced Motion */
@media (prefers-reduced-motion: reduce) {
    * {
        animation: none !important;
        transition: none !important;
    }
}

/* Responsive Text Sizes for Hero Section */
@media (max-width: 768px) {
    .hero h1 {
        font-size: 23.5px !important;
        line-height: 1.3;
        
    }
    .hero p {
        font-size: 1rem !important;
    }
}

/* Social Media Buttons Mobile Optimization */
@media (max-width: 768px) {
    .social-buttons {
        flex-direction: column;
        gap: 0.8rem;
        margin: 1.5rem 0;
    }
    
    .social-button {
        width: 90%;
        padding: 0.7rem 1rem;
        font-size: 0.9rem;
    }
    
    /* iOS specific adjustments */
    @supports (-webkit-touch-callout: none) {
        .social-button {
            padding: 0.8rem 1rem;
        }
    }
    
    /* Android specific adjustments */
    @supports (font: -apple-system-body) and (-webkit-appearance: none) {
        .social-button {
            letter-spacing: 0.5px;
        }
    }
}