.mosaic-container {
    display: grid;
    gap: 0; /* Giusto! Rimuove lo spazio tra le celle */
    width: 100vw;
    /* Rimuovi l'altezza 100vh se la imposti nel JS a 600px! */
    /* Se usi il JS per l'altezza, rimuovila qui o usala per l'intera pagina */
}

.mosaic-item {
    position: relative;
    overflow: hidden;
    margin: 0;
    padding: 0;
    
    /* MODIFICA FONDAMENTALE 1: Rende il contenitore un cerchio */
    border-radius: 50%; 
    
    /* MODIFICA FONDAMENTALE 2: Assicura che l'elemento sia quadrato */
    /* La griglia CSS già fa in modo che la cella sia quadrata (es. 200x200) */
    /* Ma 'aspect-ratio' è un'ottima garanzia moderna */
    aspect-ratio: 1 / 1; 
}

.mosaic-item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    
    /* MODIFICA FONDAMENTALE 3: Assicura che l'immagine segua il bordo arrotondato */
    /* Questo è ridondante se overflow: hidden è su .mosaic-item, ma è una best practice */
    border-radius: 50%; 
    
    transform: scale(1);
    transition: transform 0.5s ease;
}
.mosaic-item:hover img {
    transform: scale(1.1); 
}