<div class="item red"></div>
<div class="item green"></div>
<div class="item red"></div>
<div class="item blue"></div>
<div class="item red"></div>const elements = document.querySelectorAll('.item');
const onlyRed = Array.from(elements).filter(el => el.clasList.contains('red'));
Проще сделать отдельными блоками, чем городить переопределения модификаторами.
Кроме того, внутри карточки вполне можно делать отдельные блоки (те, которые почти повторяются).