/* Mobile-First Responsive Enhancements */

/* Mobile Navigation */
@media (max-width: 768px) {
    .top-bar {
        display: none;
    }
    
    .navbar-brand img {
        max-height: 40px;
    }
    
    .navbar-toggler {
        border: none;
        padding: 0.25rem 0.5rem;
    }
    
    .navbar-nav {
        text-align: center;
        padding: 1rem 0;
    }
    
    .dropdown-menu {
        border: none;
        box-shadow: 0 0.5rem 1rem rgba(0,0,0,0.15);
    }
}

/* Mobile Hero Section */
@media (max-width: 768px) {
    .hero-section {
        padding: 60px 0 40px;
    }
    
    .hero-content h1 {
        font-size: 2rem;
        line-height: 1.3;
        margin-bottom: 1rem;
    }
    
    .hero-content .lead {
        font-size: 1.1rem;
        margin-bottom: 1.5rem;
    }
    
    .hero-buttons {
        display: flex;
        flex-direction: column;
        gap: 1rem;
    }
    
    .hero-buttons .btn {
        width: 100%;
        padding: 1rem;
        font-size: 1rem;
    }
    
    .hero-image img {
        margin-top: 2rem;
        border-radius: 1rem;
    }
}

/* Mobile Contact Form */
@media (max-width: 768px) {
    .contact-form {
        padding: 1.5rem;
        border-radius: 0.5rem;
    }
    
    .contact-form .form-control {
        font-size: 16px; /* Prevents zoom on iOS */
        padding: 1rem;
    }
    
    .contact-info-card {
        margin-bottom: 1.5rem;
        padding: 1.5rem;
    }
    
    .contact-icon {
        width: 50px;
        height: 50px;
        font-size: 1.25rem;
    }
}

/* Mobile Product Cards */
@media (max-width: 768px) {
    .product-card,
    .facility-card,
    .region-card,
    .capability-card {
        margin-bottom: 1.5rem;
        padding: 1.5rem;
    }
    
    .product-icon,
    .facility-icon,
    .region-icon,
    .capability-icon {
        width: 50px;
        height: 50px;
        font-size: 1.25rem;
    }
}

/* Mobile Stats Section */
@media (max-width: 768px) {
    .stats-section {
        padding: 3rem 0;
    }
    
    .stat-item {
        padding: 1.5rem;
    }
    
    .stat-item h3 {
        font-size: 2rem;
    }
    
    .stat-item p {
        font-size: 1rem;
    }
}

/* Mobile Breadcrumb */
@media (max-width: 768px) {
    .breadcrumb {
        font-size: 0.875rem;
        flex-wrap: nowrap;
        overflow-x: auto;
        white-space: nowrap;
    }
    
    .breadcrumb-item {
        display: inline-block;
    }
}

/* Mobile Tables */
@media (max-width: 768px) {
    .table-responsive {
        font-size: 0.875rem;
    }
    
    .table th,
    .table td {
        padding: 0.5rem;
        vertical-align: top;
    }
}

/* Touch-Friendly Buttons */
@media (max-width: 768px) {
    .btn {
        min-height: 44px; /* iOS touch target minimum */
        padding: 0.75rem 1.5rem;
        font-size: 1rem;
    }
    
    .btn-sm {
        min-height: 38px;
        padding: 0.5rem 1rem;
        font-size: 0.875rem;
    }
}

/* Mobile Alerts */
@media (max-width: 768px) {
    .alert {
        padding: 1rem;
        font-size: 0.875rem;
    }
    
    .alert-dismissible .btn-close {
        padding: 1rem 1rem;
    }
}

/* Mobile Footer */
@media (max-width: 768px) {
    footer {
        text-align: center;
    }
    
    footer .row > div {
        margin-bottom: 2rem;
    }
    
    footer .social-links {
        justify-content: center;
    }
}

/* Performance Optimizations */
@media (max-width: 768px) {
    /* Disable animations on mobile for better performance */
    .aos-animate {
        animation: none !important;
    }
    
    [data-aos] {
        opacity: 1 !important;
        transform: none !important;
    }
    
    /* Optimize images for mobile */
    img {
        max-width: 100%;
        height: auto;
    }
    
    /* Reduce font weights for better rendering */
    body {
        font-weight: 400;
    }
    
    h1, h2, h3, h4, h5, h6 {
        font-weight: 600;
    }
}

/* Small Mobile Devices */
@media (max-width: 480px) {
    .container {
        padding: 0 1rem;
    }
    
    .hero-content h1 {
        font-size: 1.75rem;
    }
    
    .hero-content .lead {
        font-size: 1rem;
    }
    
    .page-title {
        font-size: 1.75rem;
    }
    
    .contact-form {
        padding: 1rem;
    }
    
    .btn {
        font-size: 0.875rem;
        padding: 0.75rem 1rem;
    }
}

/* Landscape Mobile */
@media (max-width: 768px) and (orientation: landscape) {
    .hero-section {
        padding: 40px 0;
    }
    
    .hero-content {
        text-align: center;
    }
    
    .hero-buttons {
        flex-direction: row;
        justify-content: center;
    }
    
    .hero-buttons .btn {
        width: auto;
        min-width: 150px;
    }
}

/* High DPI Displays */
@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
    .hero-image img,
    .product-image img {
        image-rendering: -webkit-optimize-contrast;
        image-rendering: crisp-edges;
        image-rendering: -webkit-crisp-edges;
    }
}

/* Dark Mode Support (Optional) */
@media (prefers-color-scheme: dark) {
    body {
        background-color: #1a202c;
        color: #e2e8f0;
    }
    
    .hero-section {
        background: linear-gradient(135deg, #2d3748 0%, #1a202c 100%);
    }
    
    .contact-form,
    .product-card,
    .facility-card {
        background-color: #2d3748;
        color: #e2e8f0;
    }
}
