.iw-raster-block {
    --iw-raster-margin-left-px: var(--iw-raster-portrait-margin-left-px, 0px);
    --iw-raster-margin-right-px: var(--iw-raster-portrait-margin-right-px, 0px);
    --iw-raster-gutter-px: var(--iw-raster-portrait-gutter-px, 0px);
    --iw-raster-columns: var(--iw-raster-portrait-columns, 4);
    --iw-raster-ratio-width: var(--iw-raster-portrait-ratio-width, 1);
    --iw-raster-ratio-height: var(--iw-raster-portrait-ratio-height, 1);
    --iw-raster-margin-left: calc((var(--iw-raster-margin-left-px) / var(--iw-vw, 1vw)) * 1vw);
    --iw-raster-margin-right: calc((var(--iw-raster-margin-right-px) / var(--iw-vw, 1vw)) * 1vw);
    --iw-raster-gutter: calc((var(--iw-raster-gutter-px) / var(--iw-vw, 1vw)) * 1vw);
    --iw-raster-content-width: calc(100vw - var(--iw-raster-margin-left) - var(--iw-raster-margin-right));
    --iw-raster-column-width: calc((var(--iw-raster-content-width) - ((var(--iw-raster-columns) - 1) * var(--iw-raster-gutter))) / var(--iw-raster-columns));
    --iw-raster-row-height: calc(var(--iw-raster-column-width) * (var(--iw-raster-ratio-height) / var(--iw-raster-ratio-width)));
    margin: 0;
}

@media (orientation: landscape) {
    .iw-raster-block {
        --iw-raster-margin-left-px: var(--iw-raster-landscape-margin-left-px, 0px);
        --iw-raster-margin-right-px: var(--iw-raster-landscape-margin-right-px, 0px);
        --iw-raster-gutter-px: var(--iw-raster-landscape-gutter-px, 0px);
        --iw-raster-columns: var(--iw-raster-landscape-columns, 4);
        --iw-raster-ratio-width: var(--iw-raster-landscape-ratio-width, 1);
        --iw-raster-ratio-height: var(--iw-raster-landscape-ratio-height, 1);
    }
}

.iw-raster-block__grid {
    display: grid;
    grid-template-columns: repeat(var(--iw-raster-columns), minmax(0, 1fr));
    grid-auto-rows: minmax(var(--iw-raster-row-height), auto);
    gap: var(--iw-raster-gutter);
    padding-left: var(--iw-raster-margin-left);
    padding-right: var(--iw-raster-margin-right);
    box-sizing: border-box;
    width: 100%;
    align-items: stretch;
}

.iw-raster-node,
.iw-raster-group {
    --iw-item-column: var(--iw-item-portrait-column, 1);
    --iw-item-row: var(--iw-item-portrait-row, 1);
    --iw-item-col-span: var(--iw-item-portrait-col-span, 1);
    --iw-item-row-span: var(--iw-item-portrait-row-span, 1);
    --iw-group-columns: var(--iw-group-portrait-columns, 2);
    --iw-group-rows: var(--iw-group-portrait-rows, 2);
    grid-column: var(--iw-item-column) / span var(--iw-item-col-span);
    grid-row: var(--iw-item-row) / span var(--iw-item-row-span);
    min-width: 0;
    position: relative;
    z-index: var(--iw-item-z-index, 1);
}

@media (orientation: landscape) {
    .iw-raster-node,
    .iw-raster-group {
        --iw-item-column: var(--iw-item-landscape-column, 1);
        --iw-item-row: var(--iw-item-landscape-row, 1);
        --iw-item-col-span: var(--iw-item-landscape-col-span, 1);
        --iw-item-row-span: var(--iw-item-landscape-row-span, 1);
        --iw-group-columns: var(--iw-group-landscape-columns, 2);
        --iw-group-rows: var(--iw-group-landscape-rows, 2);
    }
}

.iw-raster-node__inner,
.iw-raster-group__inner {
    min-height: 100%;
    width: 100%;
    box-sizing: border-box;
}

.iw-raster-node__inner > :first-child,
.iw-raster-group__inner > :first-child {
    margin-top: 0;
}

.iw-raster-node__inner > :last-child,
.iw-raster-group__inner > :last-child {
    margin-bottom: 0;
}

.iw-raster-group__inner {
    display: grid;
    grid-template-columns: repeat(var(--iw-group-columns), minmax(0, 1fr));
    grid-template-rows: repeat(var(--iw-group-rows), minmax(0, 1fr));
    gap: var(--iw-raster-gutter);
    min-height: 100%;
}
