Как добавить элемент DIV после каждого второго и третьего элемента при разном разрешении?
Не страдайте ерундой..home-menu > :nth-child(2n+1) { clear: left; }

@media (min-width: 992px) {
  .home-menu > :nth-child(2n+1) { clear: none; }
  .home-menu > :nth-child(3n+1) { clear: left; }
}
Стоп. Бутстрап. Зачем clearfix ? Может я чего не догоняю, но у тебя и так на разрешении sm - 2 элемента в ряд, на md - 3 элемента.home-menu {
display: flex;
flex-direction: row;
justify-content: space-between;
align-items: space-between;
flex-wrap: wrap;
}