.main-gallery {
    background: var(--color-gold);
}

.main-gallery__gallery {
    margin-bottom: 65px;
}

.main-gallery__group {
    display: none;
    grid-template-columns: repeat(3, 1fr);
    grid-auto-rows: 400px 154px 400px 124px 400px;
    gap: 24px;
    margin-bottom: 24px;
}

.main-gallery__group.is-active {
    display: grid;
}

.main-gallery__item:nth-child(9n+1) {
    grid-area: 1 / 1 / 2;
}

.main-gallery__item:nth-child(9n+2) {
    grid-area: 1 / 2 / 3;
}

.main-gallery__item:nth-child(9n+3) {
    grid-area: 1 / 3 / 2;
}

.main-gallery__item:nth-child(9n+4) {
    grid-area: 2 / 1 / 5;
}

.main-gallery__item:nth-child(9n+5) {
    grid-area: 3 / 2 / 4;
}

.main-gallery__item:nth-child(9n+6) {
    grid-area: 2 / 3 / 5;
}

.main-gallery__item:nth-child(9n+7) {
    grid-area: 5 / 1 / 6;
}

.main-gallery__item:nth-child(9n+8) {
    grid-area: 4 / 2 / 6;
}

.main-gallery__item:nth-child(9n+9) {
    grid-area: 5 / 3 / 6;
}

.main-gallery__group--partial {
    grid-template-columns: repeat(3, 1fr);
}

.main-gallery__group--partial .main-gallery__item {
    grid-area: auto;
}

.main-gallery__item img,
.main-gallery__item video {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.main-gallery__item img[src$="/gallery-barman-green-drink.jpg"] {
    object-position: 70% center;
}

.main-gallery__button {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 12px;
    margin: 0 auto;
    font-family: var(--font-text);
    font-weight: 500;
    font-size: 24px;
    line-height: 100%;
    color: #0A1B12;
    border-bottom: 1px solid #EBB667;
    transition:
            color .3s ease,
            border-color .3s ease,
            gap .3s ease,
            transform .2s ease;
}

.main-gallery__button svg {
    display: flex;
    width: 24px;
    transition: transform .3s ease;
}

.main-gallery__button:hover {
    color: #EBB667;
    border-bottom-color: #0A1B12;
    gap: 16px;
}

.main-gallery__button:hover svg {
    transform: translateX(6px);
}

.main-gallery__button:active {
    transform: translateY(2px);
}

.main-gallery__button:active svg {
    transform: translateX(8px) scale(0.95);
}

@media (max-width: 1727px) {
    .main-gallery__group {
        grid-auto-rows: 375px 110px 375px 95px 375px;
    }
}

@media (max-width: 1439px) {
    .main-gallery__group {
        grid-auto-rows: 310px 80px 310px 65px 310px;
        gap: 18px;
        margin-bottom: 18px;
    }

    .main-gallery__button {
        padding: 8px;
        font-size: 20px;
    }

    .main-gallery__button svg {
        width: 20px;
    }
}

@media (max-width: 1024px) {
    .main-gallery__gallery {
        margin-bottom: 35px;
    }

    .main-gallery__group {
        grid-auto-rows: 220px 45px 220px 35px 220px;
        gap: 12px;
        margin-bottom: 12px;
    }

    .main-gallery__button {
        gap: 6px;
        padding: 6px;
        font-size: 16px;
    }

    .main-gallery__button svg {
        width: 16px;
    }
}

@media (max-width: 767px) {
    .main-gallery__gallery {
        margin-bottom: 20px;
    }

    .main-gallery__group {
        grid-auto-rows: 175px 25px 175px 20px 175px;
        gap: 6px;
        margin-bottom: 6px;
    }

    .main-gallery__button {
        gap: 4px;
        padding: 4px;
        font-size: 14px;
    }

    .main-gallery__button svg {
        width: 14px;
    }
}

@media (max-width: 459px) {
    .main-gallery__group {
        grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
        grid-auto-rows: auto;
    }

    .main-gallery__item:nth-child(9n+1),
    .main-gallery__item:nth-child(9n+2),
    .main-gallery__item:nth-child(9n+3),
    .main-gallery__item:nth-child(9n+4),
    .main-gallery__item:nth-child(9n+5),
    .main-gallery__item:nth-child(9n+6),
    .main-gallery__item:nth-child(9n+7),
    .main-gallery__item:nth-child(9n+8) {
        grid-area: auto;
        height: 100%;
        max-height: 335px;
    }

    .main-gallery__item:nth-child(9n+9) {
        grid-area: 5 / span 2;
        max-height: 240px;
    }
}