.c--grid {
  --_grid_gap: var(--grid_gap, 30px);
  --_grid_col-count: var(--grid_col-count, 2);
  --_grid_cell-min-width: var(--grid_cell-min-width, 220px);

  /* Calculated values. */
  --_grid_gap-count: calc(var(--_grid_col-count) - 1);
  --_grid_total-gap-width: calc(var(--_grid_gap-count) * var(--_grid_gap));
  --_grid-item_max-width: calc((100% - var(--_grid_total-gap-width)) / var(--_grid_col-count));
  --_grid_max-width_calc: max(var(--_grid_cell-min-width), var(--_grid-item_max-width));

  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(min(100%, var(--_grid_max-width_calc)), 1fr));
  grid-gap: var(--_grid_gap);
}

  .c--grid.grid-gap-20px {
    --_grid_gap: 1.25rem;
  }

.grid-gap-20px {
  --grid_gap: 1.25rem;
}

.grid-gap-45px {
  --grid_gap: 2.8125rem;
}

.grid-col-2 {
  --grid_col-count: 2;
}

.grid-col-3 {
  --grid_col-count: 3;
}

.grid-col-4 {
  --grid_col-count: 4;
}

.grid-col-5 {
  --grid_col-count: 5;
}

.grid-min-width-120px {
  --grid_cell-min-width: 7.5rem;
}

.grid-min-width-300px {
  --grid_cell-min-width: 18.75rem;
}

.grid-min-width-500px {
  --grid_cell-min-width: 31.25rem;
}