#realisation .gallery {
    display: grid;
    grid-template-columns: repeat(8, 1fr);
    grid-template-rows: repeat(10, 5vw);
    grid-gap: 2rem;
}

#realisation .gallery-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    border-radius: var(--radius);
    box-shadow: var(--shadow-sm);
    transition: transform .4s var(--ease), box-shadow .4s var(--ease);
}

#realisation .gallery-img:hover {
    transform: translateY(-4px);
    box-shadow: var(--shadow-lg);
    cursor: pointer;
}

#realisation .gallery-item-1 {
    grid-column-start: 1;
    grid-column-end: 3;
    grid-row-start: 1;
    grid-row-end: 4;
}

#realisation .gallery-item-2 {
    grid-column-start: 3;
    grid-column-end: 5;
    grid-row-start: 1;
    grid-row-end: 4;
}

#realisation .gallery-item-3 {
    grid-column-start: 5;
    grid-column-end: 7;
    grid-row-start: 1;
    grid-row-end: 8;
}

#realisation .gallery-item-4 {
    grid-column-start: 7;
    grid-column-end: 9;
    grid-row-start: 1;
    grid-row-end: 4;
}

#realisation .gallery-item-5 {
    grid-column-start: 1;
    grid-column-end: 5;
    grid-row-start: 4;
    grid-row-end: 8;
}

#realisation .gallery-item-6 {
    grid-column-start: 1;
    grid-column-end: 3;
    grid-row-start: 8;
    grid-row-end: 11;
}

#realisation .gallery-item-7 {
    grid-column-start: 3;
    grid-column-end: 7;
    grid-row-start: 8;
    grid-row-end: 11;
}

#realisation .gallery-item-8 {
    grid-column-start: 7;
    grid-column-end: 9;
    grid-row-start: 4;
    grid-row-end: 11;
}

@media screen and (max-width: 990px) {

    #realisation .gallery {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        grid-template-rows: none;
        gap: 1rem;
    }

    #realisation .gallery-item-1,
    #realisation .gallery-item-2,
    #realisation .gallery-item-3,
    #realisation .gallery-item-4,
    #realisation .gallery-item-5,
    #realisation .gallery-item-6,
    #realisation .gallery-item-7,
    #realisation .gallery-item-8 {
        grid-column: auto;
        grid-row: auto;
    }

    #realisation .gallery-img {
        height: auto;
        aspect-ratio: 4 / 3;
    }

}

@media screen and (max-width: 560px) {

    #realisation .gallery {
        gap: .6rem;
    }

}