.gallery {
    grid-gap: .75rem;
    display: grid;
    gap: .75rem
}

@media(min-width: 768px) {
    .gallery {
        gap:1.5rem
    }
}

.gallery--grid1,.gallery--grid2 {
    grid-template-areas: "image-1 image-1" "image-1 image-1" "image-2 image-3" "image-2 image-4";
    grid-template-columns: repeat(2,1fr);
    grid-template-rows: repeat(4,1fr);
    height: 400px
}

@supports(aspect-ratio: 1) {
    .gallery--grid1,.gallery--grid2 {
        aspect-ratio:1;
        height: auto
    }
}

@media(min-width: 768px) {
    .gallery--grid1,.gallery--grid2 {
        grid-template-areas:"image-1 image-1 image-2 image-3" "image-1 image-1 image-2 image-4";
        grid-template-columns: repeat(4,1fr);
        grid-template-rows: repeat(2,1fr);
        height: 620px
    }

    @supports(aspect-ratio: 3/1) {
        .gallery--grid1,.gallery--grid2 {
            aspect-ratio:3/1;
            height: auto
        }
    }
}

.gallery--grid2 {
    grid-template-areas: "image-2 image-3" "image-2 image-4" "image-1 image-1" "image-1 image-1"
}

@media(min-width: 768px) {
    .gallery--grid2 {
        grid-template-areas:"image-3 image-2 image-1 image-1" "image-4 image-2 image-1 image-1"
    }
}

.gallery--grid3 {
    gap: 1.5rem;
    grid-template-columns: repeat(1,1fr)
}

.gallery--grid6 {
    gap: 1.5rem;
    grid-template-columns: repeat(2,1fr)
}

@media(min-width: 576px) {
    .gallery--grid6 {
        grid-template-columns:repeat(2,1fr)
    }
}

@media(min-width: 992px) {
    .gallery--grid6 {
        grid-template-columns:repeat(3,1fr)
    }
}

@media(min-width: 1400px) {
    .gallery--grid6 {
        grid-template-columns:repeat(4,1fr)
    }
}

@media(min-width: 1780px) {
    .gallery--grid6 {
        grid-template-columns:repeat(6,1fr)
    }
}

@media(min-width: 576px) {
    .gallery--items2,.gallery--items3 {
        grid-template-columns:repeat(2,1fr)
    }
}

@media(min-width: 768px) {
    .gallery--items3 {
        grid-template-columns:repeat(3,1fr)
    }
}

@media(min-width: 576px) {
    .gallery--items4 {
        grid-template-columns:repeat(2,1fr)
    }
}

@media(min-width: 992px) {
    .gallery--items4 {
        grid-template-columns:repeat(4,1fr)
    }
}

@media(min-width: 576px) {
    .gallery--items5 {
        grid-template-columns:repeat(2,1fr)
    }
}

@media(min-width: 768px) {
    .gallery--items5 {
        grid-template-columns:repeat(3,1fr)
    }
}

@media(min-width: 1400px) {
    .gallery--items5 {
        grid-template-columns:repeat(5,1fr)
    }
}

.gallery__item {
    height: 100%;
    margin-bottom: 0;
    overflow: hidden;
    position: relative;
    width: 100%
}

.gallery__item img {
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    width: 100%
}

.gallery__item--1 {
    grid-area: image-1
}

.gallery__item--2 {
    grid-area: image-2
}

.gallery__item--3 {
    grid-area: image-3
}

.gallery__item--4 {
    grid-area: image-4
}

.gallery__item3 {
    display: flex;
    flex-direction: column;
    margin-bottom: 0
}

.gallery__item3 img {
    height: auto;
    width: 100%
}

@media(min-width: 768px) {
    .gallery__item3--half-image img {
        width:50%
    }
}

.gallery__image__title {
    font-size: 1.125rem;
    margin-bottom: .25rem
}

.gallery__image__description {
    margin-top: .25rem
}

.logogallery {
    --spacing: 3rem;
    margin-left: -3rem;
    margin-left: calc(var(--spacing)*-1)
}

@media(max-width: 575.98px) {
    .logogallery {
        margin-right:-.75rem
    }
}

@media(min-width: 576px) {
    .logogallery {
        --spacing:3rem
    }
}

@media(min-width: 768px) {
    .logogallery {
        --spacing:4rem
    }
}

@media(min-width: 1400px) {
    .logogallery {
        --spacing:5rem
    }
}

.logogallery .swiper-wrapper {
    margin-bottom: 3rem
}

.logogallery .swiper-navigation-full {
    margin-left: .75rem;
    width: calc(100% - 1.5rem)
}

@media(min-width: 576px) {
    .logogallery .swiper-navigation-full {
        width:calc(100% - .75rem)
    }
}

.logogallery .swiper-navigation-full .swiper-button-prev,.logogallery .swiper-navigation-full .swiper-rtl .swiper-button-next {
    left: calc(var(--spacing) - .75rem)
}

.logogallery__item {
    align-items: center;
    display: flex;
    height: auto;
    justify-content: flex-start;
    padding-left: var(--spacing)
}

.logogallery__image,.logogallery__svg {
    height: auto;
    max-height: 110px;
    -o-object-fit: contain;
    object-fit: contain;
    -o-object-position: center;
    object-position: center;
    width: 100%
}