/* отступ первой секции страницы из под меню */
main > section:first-child {
    padding-top: calc(80px + 4rem);
}

.wp-block-gallery .wp-block-image {
    transform: scale(1);
    transition: all 0.3s ease;
    box-shadow: none;
}

.wp-block-gallery .wp-block-image:hover {
    transform: scale(1.02);
    box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.1);
}

/* т.к. с отступом в админке изображения слипались, он был перенесен из theme.json сюда */
.wp-block-gallery.columns-5 .wp-block-image a { 
    padding: 1.5rem;
}

/* почему-то на фронте не создается грид, поэтому пришлось добавить вручную */
.grid-columns-4 {
    grid-template-columns: repeat(4, 1fr);
}

/* фон крестиком */
.has-hero-gradient-background::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: linear-gradient(35deg, transparent 49.5%, rgba(0, 86, 179, 0.04) 49.5%, rgba(0, 86, 179, 0.04) 50.5%, transparent 50.5%), linear-gradient(125deg, transparent 49.5%, rgba(0, 86, 179, 0.04) 49.5%, rgba(0, 86, 179, 0.04) 50.5%, transparent 50.5%);
    background-size: 100px 100px;
    -webkit-mask-image: radial-gradient(ellipse at 45% 50%, black 20%, transparent 70%);
    mask-image: radial-gradient(ellipse at 45% 50%, black 20%, transparent 70%);
    pointer-events: none;
}

/* срез фона под контакты - херо */
.has-hero-gradient-background {
    overflow: hidden;
    -webkit-clip-path: polygon(0 0, 100% 0, 100% 82%, 0 100%);
    clip-path: polygon(0 0, 100% 0, 100% 82%, 0 100%);
} 

/* Заливка фона страницы контакты серым, чтобы при создании срезов он не выступал */
main.contacts {
    background-color: var(--wp--preset--color--gray-200);
}

/* срез фона под контакты - москва */
.cut-af::after {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 130px;
    background-color: var(--color-white);
    -webkit-clip-path: polygon(0 0, 100% 72%, 100% 100%, 0 100%);
    clip-path: polygon(0 0, 100% 72%, 100% 100%, 0 100%);
    pointer-events: none;
    z-index: 3;
}

/* срез фона над контакты - кольчугино */
.cut-bf::before {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    height: 130px;
    background-color: var(--color-white);
    -webkit-clip-path: polygon(0 0, 100% 0, 100% 28%, 0 100%);
    clip-path: polygon(0 0, 100% 0, 100% 28%, 0 100%);
    pointer-events: none;
    z-index: 3;
}



/* Медиазапросы для галереи */
@media (max-width: 992px) {
    .wp-block-gallery.columns-4 .wp-block-image {
        flex-basis: calc(50% - var(--wp--style--unstable-gallery-gap, 1.5rem) * 0.5) !important;
    }
    .wp-block-gallery.columns-5 .wp-block-image {
        flex-basis: calc(33.333% - var(--wp--style--unstable-gallery-gap, 1.5rem) * 0.667) !important;
    }
    .grid-columns-4 {
        grid-template-columns: repeat(2, 1fr);
    }

}

@media (max-width: 576px) {
    .wp-block-gallery.columns-3 .wp-block-image,
    .wp-block-gallery.columns-4 .wp-block-image,
    .wp-block-gallery.columns-5 .wp-block-image {
        flex-basis: calc(100% - var(--wp--style--unstable-gallery-gap, 1.5rem)) !important;
    }
    .grid-columns-4, .grid-columns-3 {
        grid-template-columns: repeat(1, 1fr);
    }

}