This is how CSS should be written. I will never understand why class names need to repeat the semantic purpose for a given element.
In my 25 years of experience writing HTML and CSS most engineers don’t understand semantic HTML, nor do they take the time to learn it; largely because companies don’t value it, unless they’re heavily SEO-focused companies.
I once worked at a company that would run an HTML5 validation test in our CI/CD pipeline. That was very helpful as it identified invalidly nested elements and taught proper semantic HTML.
Unless one likes using tables instead or spacer gifs.
It’s nice html has options beyond. divs now too