.wp-site-blocks:has(.wp-block-hoyry-bokun-rating) .wp-block-hoyry-bokun-photos {
    @media (min-width: 1024px) {
        margin-top: -2.5rem;
    }
}

.wp-block-hoyry-bokun-photos {
    .blaze-slider {
        --slides-to-show: 1;
        --slide-gap: 1.25rem;
        direction: ltr;
        @media (min-width: 380px) {
            --slides-to-show: 2;
        }
        @media (min-width: 1024px) {
            --slides-to-show: 3;
        }
        @media (min-width: 1400px) {
            --slides-to-show: 4;
        }
        & .blaze-container {
            position: relative;
            & .blaze-track-container {
                overflow: hidden;
                & .blaze-track {
                    will-change: transform;
                    touch-action: pan-y;
                    display: flex;
                    gap: var(--slide-gap);
                    --slide-width: calc((100% - (var(--slides-to-show) - 1) * var(--slide-gap)) / var(--slides-to-show));
                    box-sizing: border-box;
                    & > a {
                        box-sizing: border-box;
                        width: var(--slide-width);
                        flex-shrink: 0;
                        border-radius: 0.625rem;
                        aspect-ratio: 4/3;
                        overflow: hidden;
                        & img {
                            transition: all .2s;
                            width: 100%;
                            height: 100%;
                            object-fit: cover;
                        }
                        &:hover img {
                            scale: 1.05;
                        }
                    }
                }
            }
            & .controls {
                display: none;
                @media (min-width: 1024px) {
                    display: flex;
                }
                justify-content: flex-end;
                margin-bottom: 1.5rem;
                gap: 1.25rem;
                cursor: pointer;
                & button {
                    all: unset;
                    display: flex;
                    color: var(--wp--preset--color--custom-keltainen, gold);
                    transition: all .1s;
                    &:hover {
                        color: white;
                    }
                    border: 1px solid currentColor;
                    border-radius: 0.375rem;
                    &::before {
                        content: "";
                        display: block;
                        -webkit-mask: var(--hoyry-icon-chevron-sharp-right) center no-repeat;
                        mask: var(--hoyry-icon-chevron-sharp-right) center no-repeat;
                        background-color: currentColor;
                        width: 47px;
                        height: 47px;
                    }
                    &.blaze-prev::before {
                        transform: rotate(180deg);
                    }
                }
            }
            & .pagination {
                display: flex;
                justify-content: center;
                margin-top: 1rem;
                @media (min-width: 1024px) {
                    display: none;
                }
                & .blaze-pagination {
                    display: flex;
                    gap: .375rem;
                    flex-wrap: wrap;
                    justify-content: center;
                    & button {
                        all: unset;
                        font-size: 0;
                        width: .75rem;
                        height: .75rem;
                        background-color: white;
                        border-radius: 50%;
                        &.active {
                            background-color: var(--wp--preset--color--custom-kulta, gold);
                        }
                    }
                }
            }
        }
    }
}