/* CSS Instagram - Grille 3x3 adaptative avec titre */

/* Desktop - Grille 3x3 centrée */
@media screen and (min-width: 1000px) {
    /* FORCER l'affichage de l'intro en desktop */
    .nq-c-InstagramMosaic .nq-c-InstagramMosaic-intro {
        display: block !important;
        text-align: center !important;
        margin-bottom: 40px !important;
    }
    
    .nq-c-InstagramMosaic-intro-pretitle {
        font-size: 18px !important;
        line-height: 22px !important;
        text-transform: uppercase !important;
        font-weight: bold !important;
        color: #9B9B9B !important;
    }
    
    .nq-c-InstagramMosaic-intro-title {
        font-size: 32px !important;
        line-height: 32px !important;
        margin: 8px 0 16px !important;
    }
    
    .nq-c-InstagramMosaic-intro .nq-c-SocialLinks {
        margin-bottom: 25px !important;
    }
    
    .nq-c-InstagramMosaic-images {
        width: 100% !important;
        max-width: 1020px !important;
        margin: 0 auto !important;
        position: relative !important;
        height: auto !important;
        overflow: visible !important;
    }
    
    .nq-c-InstagramMosaic-images #sb_instagram {
        width: 100% !important;
        height: auto !important;
    }
    
    /* Cacher éléments Smash Balloon */
    .nq-c-InstagramMosaic-images .sb_instagram_header,
    .nq-c-InstagramMosaic-images #sbi_load,
    .nq-c-InstagramMosaic-images .sbi_follow_btn {
        display: none !important;
    }
    
    /* Conteneur */
    .nq-c-InstagramMosaic-images #sbi_images {
        display: grid !important;
        grid-template-columns: repeat(3, 1fr) !important;
        gap: 20px !important;
        width: 100% !important;
        padding: 0 !important;
        height: auto !important;
    }
    
    /* Items */
    .nq-c-InstagramMosaic-images .sbi_item {
        position: relative !important;
        width: 100% !important;
        height: auto !important;
        aspect-ratio: 1 !important;
        margin: 0 !important;
        padding: 0 !important;
        background: black !important;
        overflow: hidden !important;
    }
    
    /* Wrapper et lien */
    .nq-c-InstagramMosaic-images .sbi_photo_wrap,
    .nq-c-InstagramMosaic-images .sbi_photo {
        width: 100% !important;
        height: 100% !important;
        display: block !important;
    }
    
    /* Images */
    .nq-c-InstagramMosaic-images .sbi_photo img {
        width: 100% !important;
        height: 100% !important;
        object-fit: contain !important;
        transition: transform 1s !important;
        transform: scale(1) !important;
    }
    
    /* Hover */
    .nq-c-InstagramMosaic-images .sbi_item:hover .sbi_photo img {
        transform: scale(1.15) !important;
    }
}

/* Tablette et mobile */
@media screen and (max-width: 999px) {
    /* Le titre est déjà visible en mobile avec le CSS d'origine */
    
    .nq-c-InstagramMosaic-images #sb_instagram {
        width: 100% !important;
    }
    
    .nq-c-InstagramMosaic-images #sbi_images {
        display: flex !important;
        flex-wrap: wrap !important;
        justify-content: space-between !important;
        padding: 0 !important;
        gap: 0 !important;
    }
    
    .nq-c-InstagramMosaic-images .sbi_item {
        width: calc(50% - 5px) !important;
        height: auto !important;
        margin-bottom: 10px !important;
        padding: 0 !important;
        position: relative !important;
    }
    
    /* Cacher images 5-9 en mobile */
    .nq-c-InstagramMosaic-images .sbi_item:nth-child(n+5) {
        display: none !important;
    }
    
    .nq-c-InstagramMosaic-images .sbi_photo {
        height: auto !important;
    }
    
    .nq-c-InstagramMosaic-images .sbi_photo img {
        width: 100% !important;
        height: auto !important;
    }
}
