/* Normal desktop :1200px. */
@media (min-width: 1200px) and (max-width: 1500px) {
    .container {
        max-width: 1140px;
    }
}


/* Normal desktop :992px. */
@media (min-width: 992px) and (max-width: 1200px) {
    .container {
        max-width: 960px;
    }
    
    .trend-top-img img {
        width: 100%;
        height: auto;
    }
    
    .trending-top {
        margin-bottom: 20px;
    }
}

 
/* Tablet desktop :768px. */
@media (min-width: 768px) and (max-width: 991px) {
    .container {
        max-width: 720px;
    }
    
    /* Images responsive */
    .trend-top-img img,
    .single-gallery-image,
    img {
        width: 100%;
        height: auto !important;
        max-width: 100%;
    }
    
    /* Sliders */
    .slider-active .single-slider {
        width: 100%;
    }
    
    /* Navigation */
    .main-menu ul li {
        display: block;
        margin: 10px 0;
    }
    
    /* Grid adjustments */
    .col-lg-4,
    .col-lg-8,
    .col-xl-8 {
        width: 100%;
        flex: 0 0 100%;
        max-width: 100%;
    }
    
    /* Text sizes */
    h1 {
        font-size: 2rem;
    }
    
    h2 {
        font-size: 1.75rem;
    }
    
    h3 {
        font-size: 1.5rem;
    }
}

 
/* small mobile :320px. */
@media (max-width: 767px) {
    .container {
        max-width: 100%;
        padding: 0 15px;
    }
    
    /* Toutes les images responsive */
    img {
        width: 100% !important;
        height: auto !important;
        max-width: 100%;
    }
    
    .trend-top-img img {
        height: auto !important;
    }
    
    /* Colonnes en pleine largeur sur mobile */
    .col-lg-4,
    .col-lg-8,
    .col-lg-12,
    .col-xl-8,
    .col-md-6,
    .col-sm-6 {
        width: 100%;
        flex: 0 0 100%;
        max-width: 100%;
        margin-bottom: 20px;
    }
    
    /* Sliders */
    .slider-active,
    .single-slider {
        width: 100%;
    }
    
    .trending-main {
        padding: 15px 0;
    }
    
    /* Navigation mobile */
    .main-menu {
        display: none;
    }
    
    .mobile-menu {
        display: block;
    }
    
    /* Marges et padding réduits */
    .mb-30 {
        margin-bottom: 15px;
    }
    
    .pt-15 {
        padding-top: 10px;
    }
    
    .pb-25 {
        padding-bottom: 15px;
    }
    
    /* Texte responsive */
    h1 {
        font-size: 1.75rem;
        line-height: 1.3;
    }
    
    h2 {
        font-size: 1.5rem;
        line-height: 1.3;
    }
    
    h3 {
        font-size: 1.25rem;
        line-height: 1.3;
    }
    
    h4 {
        font-size: 1.1rem;
    }
    
    p, body {
        font-size: 14px;
        line-height: 1.6;
    }
    
    /* Tables responsive */
    table {
        display: block;
        overflow-x: auto;
        width: 100%;
    }
    
    /* Formulaires */
    input[type="text"],
    input[type="email"],
    input[type="tel"],
    select,
    textarea {
        width: 100%;
        font-size: 16px;
    }
    
    /* Boutons */
    .btn,
    button {
        width: 100%;
        padding: 12px;
        font-size: 14px;
    }
    
    /* Logo header */
    .logo img {
        max-width: 150px;
        height: auto;
    }
    
    /* Footer */
    .footer-area {
        text-align: center;
    }
    
    .footer-area .col-xl-3,
    .footer-area .col-lg-3,
    .footer-area .col-md-6 {
        width: 100%;
        margin-bottom: 20px;
    }
}
 
/* Large Mobile :480px. */
@media only screen and (min-width: 480px) and (max-width: 767px) {
    .container {
        max-width: 450px;
    }
    
    img {
        width: 100% !important;
        height: auto !important;
    }
    
    h1 {
        font-size: 2rem;
    }
    
    h2 {
        font-size: 1.65rem;
    }
}