I've been programming for 40 years, half that working with web technologies -- and let me just say this. BEM is a classic example of a really well intentioned reasonably thought out idea being applied to completely the wrong part of development.
Pissing all over the markup with classes, regardless of why, is garbage. Be it the broken mentally enfeebled train wreck laundry lists of how NOT to write HTML that are "front end frameworks" with their garbage presentational classes replicating the worst of HTML 3.2, or BEM's notion that every joe blasted element deserves a class for "clarity".
Particularly when that alleged clarity just results in two to ten times the code needed destroying "clarity", speed of development, and speed of the resultant site.
Take your card example with the endless pointless garbage classes for NOTHING!
If you're going to have an image for the tag, use a IMG. Each card is kind of a section, so make them SECTION. If it has a heading use the appropriate depth heading. If it's a list you're already saying it's a list with list items thanks to the UL/LI. The paragraphs end up the same way where of course they're text describing it, that's what a paragraph is for. You double or more the markup size for nothing more than "wah wah, eye dunz wunna use teh combinators"
... and with the claim that "putting classes on everything renders faster than combinators" turning out to be just another of the many BALD FACED LIES being propagated by the fans of this type of trash? Well...
It reeks of the same type of broken trash that makes so many "modern practices" little more than dragging development practices back to the worst of 1990's style browser-wars era thinking.