.grid-fill {
    --grid-columns: 4;
    --grid-layout-gap: 1em;
    --grid-item--min-width: 300px;

    --grid-gap-count: calc(var(--grid-columns) - 1);
    --grid-total-gap: calc(var(--grid-gap-count) * var(--grid-layout-gap));
    --grid-item--max-width: calc((100% - var(--grid-total-gap)) / var(--grid-columns));

    grid-template-columns: repeat(auto-fill,
        minmax(
                max(var(--grid-item--min-width), var(--grid-item--max-width)),
                1fr
        )
    );

    gap: 1rem;
}