/* ShipmentAgency - Responsive Styles */

/* Large Devices (desktops, less than 1200px) */
@media (max-width: 1199.98px) {
    .hero-section:not(.hero-section--v3) .hero-title { font-size: 3rem; }
    .section-title { font-size: 2.2rem; }
}

/* Medium Devices (tablets, less than 992px) */
@media (max-width: 991.98px) {
    .hero-section:not(.hero-section--v3) .hero-title { font-size: 2.5rem; }
    .hero-section:not(.hero-section--v3) .hero-subtitle { font-size: 1.2rem; }
    
    .quick-booking { position: relative; bottom: 0; margin-top: -50px; }
    .hero-section:not(.hero-section--v3) + .features-section { margin-top: 50px; }
    
    .navbar-collapse {
        background: #fff;
        padding: 20px;
        border-radius: 8px;
        box-shadow: 0 4px 20px rgba(0,0,0,0.15);
        margin-top: 15px;
    }
    
    .nav-cta { margin-top: 15px; }
    
    .about-image { margin-bottom: 40px; }
    
    .footer-widget { margin-bottom: 30px; }
}

/* Small Devices (landscape phones, less than 768px) */
@media (max-width: 767.98px) {
    html { font-size: 14px; }
    
    .hero-section:not(.hero-section--v3) { min-height: auto; padding: 120px 0 80px; }
    .hero-section:not(.hero-section--v3) .hero-title { font-size: 2rem; }
    .hero-section:not(.hero-section--v3) .hero-subtitle { font-size: 1rem; }
    .hero-section:not(.hero-section--v3) .hero-buttons { flex-direction: column; align-items: center; }
    .hero-section:not(.hero-section--v3) .hero-buttons .btn { width: 100%; max-width: 280px; margin-bottom: 10px; }
    
    .section-title { font-size: 1.8rem; }
    .section-header { margin-bottom: 30px; }
    
    .quick-booking-card { padding: 20px; }
    
    .feature-card { padding: 20px 15px; margin-bottom: 20px; }
    .feature-icon { width: 60px; height: 60px; }
    .feature-icon i { font-size: 1.5rem; }
    
    .service-card { padding: 20px; margin-bottom: 20px; }
    
    .stat-item { padding: 10px; margin-bottom: 15px; }
    .stat-number { font-size: 1.5rem; }
    
    .tracking-form .input-group { flex-direction: column; }
    .tracking-form .form-control { border-radius: 8px !important; margin-bottom: 10px; }
    .tracking-form .btn { border-radius: 8px !important; width: 100%; }
    
    .testimonial-card { padding: 20px; margin-bottom: 20px; }
    
    .top-bar { font-size: 0.75rem; }
    .top-bar .top-info a { display: block; margin-bottom: 5px; }
    .top-bar .top-links { text-align: left !important; margin-top: 10px; }
    
    .page-header { padding: 60px 0; }
    .page-header h1 { font-size: 2rem; }
    
    .whatsapp-float { bottom: 15px; right: 15px; width: 50px; height: 50px; font-size: 1.5rem; }
}

/* Extra Small Devices (portrait phones, less than 576px) */
@media (max-width: 575.98px) {
    .container { padding-left: 15px; padding-right: 15px; }
    
    .hero-section:not(.hero-section--v3) .hero-title { font-size: 1.75rem; }
    .hero-section:not(.hero-section--v3) .hero-content { padding: 60px 0; }
    
    .section-padding { padding: 40px 0; }
    
    .btn-lg { padding: 12px 25px; font-size: 1rem; }
    
    .navbar-brand img { height: 40px; }
    .brand-text { font-size: 1.2rem; }
    
    .experience-badge { position: relative; bottom: 0; right: 0; margin-top: 20px; display: inline-block; }
    
    .footer-bottom { text-align: center; }
    .footer-bottom .social-links { justify-content: center; margin-top: 15px; }
}

/* Print Styles */
@media print {
    .top-bar, .navbar, .whatsapp-float, .footer, .quick-booking { display: none !important; }
    .hero-section:not(.hero-section--v3) { min-height: auto; padding: 20px 0; background: #fff !important; }
    .hero-section:not(.hero-section--v3) .hero-title,
    .hero-section:not(.hero-section--v3) .hero-subtitle { color: #333 !important; }
    body { font-size: 12pt; }
    a[href]:after { content: " (" attr(href) ")"; }
}

/* High Contrast Mode */
@media (prefers-contrast: high) {
    :root {
        --primary-color: #000080;
        --secondary-color: #ff8c00;
        --text-color: #000;
    }
}

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

/* Dark Mode Support */
@media (prefers-color-scheme: dark) {
    :root {
        --light-color: #1a1a1a;
        --text-color: #e0e0e0;
        --border-color: #333;
    }
}