Как плавно скрывать и раскрывать ряды в display grid?

Нужно сделать раскрывающийся блок с display grid и карточками

Пробовал сделать

grid-template: repeat(2, 1fr) / repeat(auto-fit, minmax(370px , 1fr));
grid-auto-rows: 0;

но карточки которые не помещаются в сам грид всё так же видны + при нажатии на кнопку, карточки должны появиться плавно с расширением грида. Как это правильно сделать и чтобы это было адаптивно c учётом, что карточки могут быть больше по высоте, тк контент динамический?