/* ========================================
   CSS RESPONSIVE - CLINIQUE
   ======================================== */

/* Mobile First */

/* Écrans très petits (< 576px) */
@media (max-width: 575.98px) {
    .section-title h2 {
        font-size: 1.8rem;
    }
    
    .section-title p {
        font-size: 0.95rem;
    }
    
    .specialite-card,
    .doctor-card,
    .blog-card {
        margin-bottom: 20px;
    }
    
    .navbar-brand img {
        height: 40px;
    }
    
    .nav-link.btn-primary {
        padding: 6px 15px;
        font-size: 0.9rem;
    }
    
    .language-selector .dropdown-toggle {
        font-size: 0.9rem;
        padding: 5px 10px;
    }
}

/* Tablettes (< 768px) */
@media (max-width: 767.98px) {
    .section-title h2 {
        font-size: 2rem;
    }
    
    .specialite-content .icon {
        font-size: 2rem;
    }
    
    .doctor-image img {
        height: 250px;
    }
    
    .footer .contact-info div {
        margin-bottom: 10px;
    }
}

/* Tablettes moyennes (< 992px) */
@media (max-width: 991.98px) {
    .section-title h2 {
        font-size: 2.2rem;
    }
    
    .navbar-nav {
        margin-top: 15px;
    }
    
    .language-selector {
        margin-top: 15px;
    }
    
    .footer .row {
        text-align: center;
    }
    
    .footer .text-md-start,
    .footer .text-md-end {
        text-align: center !important;
    }
    
    .footer .mb-md-0 {
        margin-bottom: 20px !important;
    }
}

/* Desktop (< 1200px) */
@media (max-width: 1199.98px) {
    .section-title h2 {
        font-size: 2.3rem;
    }
    
    .specialite-image {
        height: 200px;
    }
}

/* Desktop Large */
@media (min-width: 1200px) {
    .container {
        max-width: 1140px;
    }
}

/* Desktop Extra Large */
@media (min-width: 1400px) {
    .container {
        max-width: 1320px;
    }
    
    .section-title h2 {
        font-size: 2.8rem;
    }
    
    .section-title p {
        font-size: 1.2rem;
    }
}