/* Responsive Styles */

/* Large Devices (desktops, less than 1200px) */
@media (max-width: 1199.98px) {
    h1 { font-size: 2.25rem; }
    h2 { font-size: 1.75rem; }
    h3 { font-size: 1.35rem; }
    
    .hero-section h1 { font-size: 2.5rem; }
    .hero-section h2 { font-size: 1.5rem; }
}

/* Medium Devices (tablets, less than 992px) */
@media (max-width: 991.98px) {
    h1 { font-size: 2rem; }
    h2 { font-size: 1.5rem; }
    h3 { font-size: 1.25rem; }
    
    .hero-section {
        min-height: 80vh;
    }
    
    .hero-section h1 { font-size: 2.25rem; }
    .hero-section h2 { font-size: 1.35rem; }
    .hero-section p { font-size: 1rem; }
    
    .navbar-brand {
    font-size: 12px !important; font-size: 1.35rem; }
    
    section { padding: 3rem 0; }
    
    .process-step { margin-bottom: 2rem; }
    
    .timeline::before { display: none; }
    .timeline-item { text-align: left; padding-left: 2rem; }
    .timeline-item::before { 
        left: 0; 
        transform: translateY(-50%); 
    }
    
    .metric-number { font-size: 2.5rem; }
    
    .team-member { margin-bottom: 2rem; }
}

/* Small Devices (landscape phones, less than 768px) */
@media (max-width: 767.98px) {
    body { font-size: 15px; }
    
    h1 { font-size: 1.75rem; }
    h2 { font-size: 1.35rem; }
    h3 { font-size: 1.15rem; }
    h4 { font-size: 1.1rem; }
    h5 { font-size: 1rem; }
    
    p { font-size: 0.95rem; }
    
    .hero-section {
        min-height: 100vh;
        text-align: center;
    }
    
    .hero-section h1 { font-size: 2rem; }
    .hero-section h2 { font-size: 1.25rem; }
    .hero-section p { font-size: 0.95rem; }
    
    .navbar-brand {
    font-size: 12px !important; font-size: 1.25rem; }
    .navbar-nav .nav-link {
    font-size: 10px !important; font-size: 0.9rem; }
    
    section { padding: 2.5rem 0; }
    
    .feature-box, .service-card, .price-card, .case-card, .blog-card,
    .methodology-card, .industry-box, .workshop-card, .implementation-card, 
    .digital-card, .metric-card, .partnership-card {
        padding: 1.5rem;
        margin-bottom: 1.5rem;
    }
    
    .service-card .price { font-size: 1.35rem; }
    .price-amount { font-size: 1.75rem; }
    
    .btn-primary {
        padding: 0.65rem 1.5rem;
        font-size: 0.95rem;
    }
    
    .contact-form .form-control, .contact-form .form-select {
        font-size: 0.95rem;
        padding: 0.65rem 0.9rem;
    }
    
    .accordion-button { font-size: 1rem; }
    
    footer { padding: 2.5rem 0 1.5rem; }
    footer h4, footer h5 { font-size: 1.25rem; }
    footer p, footer a { font-size: 0.9rem !important; }
    
    /* Disable autoplay and effects for Swiper on mobile */
    .swiper-container {
        --swiper-autoplay: 0;
    }
    
    .reviews-slider .swiper-slide {
        opacity: 1 !important;
        transform: none !important;
    }
    
    .metric-number { font-size: 2rem; }
    
    .step-number {
        width: 50px;
        height: 50px;
        font-size: 1.25rem;
    }
    
    .methodology-card .step-icon {
        width: 40px;
        height: 40px;
        font-size: 1.25rem;
    }
}

/* Extra Small Devices (portrait phones, less than 576px) */
@media (max-width: 575.98px) {
    .container {
        padding-left: 1rem;
        padding-right: 1rem;
    }
    
    h1 { font-size: 1.5rem; }
    h2 { font-size: 1.25rem; }
    h3 { font-size: 1.1rem; }
    
    .hero-section h1 { font-size: 1.75rem; }
    .hero-section h2 { font-size: 1.15rem; }
    
    .navbar-brand {
    font-size: 12px !important; font-size: 1.15rem; }
    
    .breadcrumb-section { padding: 80px 0 15px; }
    
    .team-member img {
        width: 120px;
        height: 120px;
    }
    
    .contact-info p { font-size: 1rem; }
    
    #gallery .col-md-4 { margin-bottom: 1rem; }
}

/* Extra Large Devices (large desktops, 1200px and up) */
@media (min-width: 1200px) {
    .container {
        max-width: 1140px;
    }
}

/* Ultra Wide Devices (1920px and up) */
@media (min-width: 1920px) {
    .container {
        max-width: 1320px;
    }
    
    body { font-size: 18px; }
    
    h1 { font-size: 3rem; }
    h2 { font-size: 2.5rem; }
    h3 { font-size: 2rem; }
    
    .hero-section h1 { font-size: 4rem; }
    .hero-section h2 { font-size: 2.5rem; }
    .hero-section p { font-size: 1.35rem; }
}

/* Print Styles */
@media print {
    header, footer, .btn, .navbar-toggler { display: none !important; }
    
    body {
        font-size: 12pt;
        line-height: 1.5;
        color: #000;
    }
    
    h1, h2, h3, h4, h5, h6 { 
        color: #000;
        page-break-after: avoid;
    }
    
    .hero-section {
        min-height: auto;
        background: none;
        color: #000;
    }
    
    .hero-section h1, .hero-section h2, .hero-section p {
        color: #000;
    }
    
    section {
        page-break-inside: avoid;
        padding: 1rem 0;
    }
    
    a { color: #000; text-decoration: underline; }
    
    .bg-light { background-color: #fff !important; }
    
    .feature-box, .service-card, .price-card, .case-card, .blog-card {
        box-shadow: none;
        border: 1px solid #ddd;
    }
}

/* Accessibility - High Contrast Mode */
@media (prefers-contrast: high) {
    body { background: #fff; color: #000; }
    
    a { color: #0000EE; text-decoration: underline; }
    a:hover { color: #551A8B; }
    
    .btn-primary {
        background: #000;
        color: #fff;
        border: 2px solid #000;
    }
    
    .btn-primary:hover {
        background: #fff;
        color: #000;
    }
    
    .navbar { background: #fff !important; border-bottom: 2px solid #000; }
    
    .feature-box, .service-card, .price-card, .case-card, .blog-card {
        border: 2px solid #000;
        box-shadow: none;
    }
}

/* Dark Mode Support */
@media (prefers-color-scheme: dark) {
    :root {
        --white: #1a1a1a;
        --off-white: #2a2a2a;
        --light-gray: #3a3a3a;
        --gray: #888;
        --dark-gray: #ccc;
        --black: #fff;
    }
    
    body {
        background-color: #1a1a1a;
        color: #ccc;
    }
    
    header {
        background: rgba(26, 26, 26, 0.95);
    }
    
    .bg-light {
        background-color: #2a2a2a !important;
    }
    
    .feature-box, .service-card, .price-card, .case-card, .blog-card,
    .methodology-card, .industry-box, .workshop-card, .implementation-card, 
    .digital-card, .metric-card, .partnership-card {
        background: #2a2a2a;
        box-shadow: 0 5px 20px rgba(0, 0, 0, 0.3);
    }
    
    .form-control, .form-select {
        background-color: #2a2a2a;
        color: #ccc;
        border-color: #3a3a3a;
    }
    
    .accordion-button {
        background-color: #2a2a2a;
        color: #ccc;
    }
    
    footer {
        background-color: #0a0a0a !important;
    }
} 