Mobile-first Card Preview Component Using Bootstrap

This was my first time using bootstrap. I mostly referred to the docs, but I also used a couple Youtube videos when I'd get stuck. The most difficult thing I struggled with was figuring out how to make get the desktop version to be 2 columns and the mobile version to be a single column. I think I've gotten that part down.

A couple questions I have regarding bootstrap:

Typically using !important is frowned upon, but is it considered bad practice when dealing with changing colors and other stylization that is handled by bootstrap?

I ended up putting a lot of h-100 classes (nearly all of my divs containing the information column) to get everything to take up the entire height of the card. Is there a better way to do this?

What are some best practices when it comes to nesting with bootstrap?

I appreciate any and all feedback! Thank you!