@media (max-width: 768px) {
    .hero {
        height: 180px !important;
        max-height: 180px !important;
    }

    .join {
        position: relative !important;
        margin: 10px auto !important;
        width: 80% !important;
        padding: 8px !important;
    }

    .grid {
        grid-template-columns: 1fr !important;
    }

    .grid section {
        padding: 8px !important;
        margin: 5px 0 !important;
    }

    .grid-weather {
        grid-template-columns: 1fr !important;
        gap: 8px !important;
    }

    .grid-weather section {
        min-height: 120px !important;
        padding: 8px !important;
    }

    .spotlights {
        grid-template-columns: 1fr !important;
        gap: 10px !important;
    }

    .sportlight-card {
        min-height: 180px !important;
        padding: 10px !important;
    }

    footer {
        grid-template-columns: 1fr !important;
        text-align: center;
        padding: 10px !important;
    }

    .social {
        justify-content: center;
    }

    .positionHero {
        height: auto !important;
    }

    .hero {
        width: 100% !important;
        object-fit: cover !important;
    }

    .grid-weather {
        display: flex !important;
        flex-direction: column !important;
        gap: 10px !important;
    }

    .grid-weather section {
        width: 100% !important;
        padding: 10px !important;
    }

    .spotlights {
        display: flex !important;
        flex-direction: column !important;
        gap: 10px !important;
    }

    .sportlight-card {
        width: 100% !important;
        padding: 10px !important;
    }

    h1, h2, h3, h4 {
        font-size: 1.2rem !important;
        margin: 8px 0 !important;
    }

    p {
        font-size: 0.8rem !important;
    }
    
    /* Découvrir page */
    #discoverInfo {
        display: flex !important;
        flex-direction: column !important;
    }
    
    .discoverInfo section {
        margin-bottom: 15px !important;
    }
}