:root {
    --grid-gap-desktop: 30px;
    --grid-gap-tablet: 20px;
    --grid-gap-mobile: 15px;
    --grid-padding-side: 15px;
    --col-min-width: 280px;
}

.wp-block-columns {
    display: flex;
    flex-wrap: wrap;
    margin-left: calc(-1 * var(--grid-padding-side));
    margin-right: calc(-1 * var(--grid-padding-side));
    gap: var(--grid-gap-desktop);
}

.wp-block-columns.alignfull {
    width: auto !important;
    max-width: none !important;
}

.wp-block-column {
    box-sizing: border-box;
    padding-left: var(--grid-padding-side);
    padding-right: var(--grid-padding-side);
    flex-basis: 100%;
    max-width: 100%;
    min-width: 0;
}

.wp-block-columns.has-2-columns > .wp-block-column,
.wp-block-columns.has-4-columns > .wp-block-column,
.wp-block-columns.has-6-columns > .wp-block-column,
.wp-block-columns.has-8-columns > .wp-block-column {
    flex-basis: calc((100% - var(--grid-gap-desktop)) / 2);
    max-width: calc((100% - var(--grid-gap-desktop)) / 2);
}

.wp-block-columns.has-3-columns > .wp-block-column {
    flex-basis: calc((100% - (var(--grid-gap-desktop) * 2)) / 3);
    max-width: calc((100% - (var(--grid-gap-desktop) * 2)) / 3);
}
.wp-block-columns.has-5-columns > .wp-block-column {
    flex-basis: calc((100% - (var(--grid-gap-desktop) * 4)) / 5);
    max-width: calc((100% - (var(--grid-gap-desktop) * 4)) / 5);
}
.wp-block-columns.has-7-columns > .wp-block-column {
    flex-basis: calc((100% - (var(--grid-gap-desktop) * 6)) / 7);
    max-width: calc((100% - (var(--grid-gap-desktop) * 6)) / 7);
}
.wp-block-columns.has-9-columns > .wp-block-column {
    flex-basis: calc((100% - (var(--grid-gap-desktop) * 8)) / 9);
    max-width: calc((100% - (var(--grid-gap-desktop) * 8)) / 9);
}

@media (min-width: 768px) and (max-width: 1023px) {
    .wp-block-columns {
        gap: var(--grid-gap-tablet);
        margin-left: calc(-1 * var(--grid-padding-side) / 1.5);
        margin-right: calc(-1 * var(--grid-padding-side) / 1.5);
    }
    .wp-block-column {
        padding-left: calc(var(--grid-padding-side) / 1.5);
        padding-right: calc(var(--grid-padding-side) / 1.5);
    }
    .wp-block-columns.has-3-columns,
    .wp-block-columns.has-5-columns,
    .wp-block-columns.has-7-columns,
    .wp-block-columns.has-9-columns {
        justify-content: center;
    }
    .wp-block-columns.has-3-columns > .wp-block-column,
    .wp-block-columns.has-5-columns > .wp-block-column,
    .wp-block-columns.has-7-columns > .wp-block-column,
    .wp-block-columns.has-9-columns > .wp-block-column {
        flex-basis: calc(50% - var(--grid-gap-tablet));
        max-width: calc(50% - var(--grid-gap-tablet));
    }
    .wp-block-columns.has-2-columns > .wp-block-column,
    .wp-block-columns.has-4-columns > .wp-block-column,
    .wp-block-columns.has-6-columns > .wp-block-column,
    .wp-block-columns.has-8-columns > .wp-block-column {
        flex-basis: calc(50% - var(--grid-gap-tablet));
        max-width: calc(50% - var(--grid-gap-tablet));
    }
}

@media (max-width: 767.98px) {
    .wp-block-columns {
        margin-left: 0 !important;
        margin-right: 0 !important;
        gap: var(--grid-gap-mobile) !important;
        justify-content: flex-start;
    }
    .wp-block-column {
        padding-left: 0 !important;
        padding-right: 0 !important;
        flex-basis: 100% !important;
        max-width: 100% !important;
        min-width: initial !important;
    }
}