Mobile first, compatible tablet & Desktop

Hi all, I'm happy with the overall result, especially having been able to change le layout for mobile/tablet and desktop. But I encountered a few issues:

1)How do I make my content centered in the page ? I used a .main to put all my content into on which I set display: grid and place-items: center hoping it would help but it didn't. And margin:auto doesn;t seem to do it.

2. How do I force my cards to be wider rather than higher while using grid-template-areas ?

3. Can I make the content adapt to the container rather than the container adapt to the biggest content box ?

Thanks a lot for any answer regarding those but also any suggestions to make my coding better overall !