Generate content wrappers and additional div for custom field data?

You're welcome.

Just a hint:
grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));

Auto fits / min-maxes can be a problem for alignment as all the space in the grid effectively gets 'filled' - regardless of the fact theres a massive space to be seen :)

For the sake of a couple of responsive media queries i would drop the auto-fit method.