nav,
.informations,
.swiper-pagination>span {
    mix-blend-mode: difference;
    color: rgb(121, 121, 121);


}

.swiper-pagination {
    mix-blend-mode: difference;
}



main {
    position: absolute;
    top: 0;
    left: 0;



    .homepage-gallery {

        .informations {
            display: grid;
            grid-template-columns: repeat(16, 1fr);
            gap: 1em;
            width: 100%;
            position: fixed;
            bottom: 1em;
            z-index: 2;

            .context {
                display: flex;
                grid-column: 5/10;
                gap: 1em;
                align-items: flex-end;



                .description {
                    transition: opacity 0.3s ease-in-out;
                }
            }

            .year {
                grid-column: 12/-1;
            }
        }


        .home-swiper {

            width: 100vw;
            height: 100vh;

            .swiper-pagination {
                text-align: left;
                bottom: 0;
                margin: 1em;
            }


            .swiper-slide {

                display: flex;
                align-items: center;
                justify-content: center;

                img {
                    max-width: 90vw;
                    width: 70vw;
                    height: auto;
                    max-height: 80vh;
                    object-fit: contain;

                    filter: grayscale(1);
                    transition: all var(--animation-duration) var(--animation-easing);

                    &:hover {
                        filter: grayscale(0);
                    }
                }
            }
        }
    }
}