Card Feature Section using Everyday Layout and CSS Grid

i highly advice you to use flexbox insted of the display:grid, its more powerfull when it comes down to responsive design, it may be challanging to learn but once you master it it will change all of your responsive problems, for example if you look into my solution : https://66be42b9c24898168a9470d6--tourmaline-haupia-264682.netlify.app/ you can see how much smoother the responsive design looks with the flexbox

the mobile looks fine, but on desktop, it doesn't meet the design requirements or look like the desktop design at all. Also, why did you use JavaScript in this project? If CSS can do it, it is best not to use JavaScript to do things that are easily handled by CSS. The assignment did not require the use of JavaScript as well, perhaps you may have done it for your own experimentation?

Sorry, I can't provide an critics about your use of grid, because I haven't learned it yet. I used flexbox for mine. also, I notice you are using flex and grid. Does it make more since to just use one?