Você pode adicionar outros estilos dentro do mesmo elemento para diferentes resoluções de tela. Você pode encontrar na seção Grid Options na documentação do Bootstrap. Vou colocar um exemplo para você ter uma ideia.
<div class="row">
<div class="col-xl-3 col-lg-3 col-md-6 col-sm-6 col-12">Item1</div>
<div class="col-xl-3 col-lg-3 col-md-6 col-sm-6 col-12">Item2</div>
<div class="col-xl-3 col-lg-3 col-md-6 col-sm-6 col-12">Item3</div>
<div class="col-xl-3 col-lg-3 col-md-6 col-sm-6 col-12">Item4</div>
</div>
Dessa forma eu defini para :
(col-12) Extra small <576px
(col-sm-6) Small ≥576px
(col-md-6) Medium ≥768px
(col-lg-3) Large ≥992px
(col-xl-3) Extra large ≥1200px
Dessa forma ele vai quebrar a visualização das divs de acordo com a largura da página.