marina-wolf

<div class="col border-grid">
      <a href="#" target="_blank" class="link">Ссылка 1</a> - Здесь описание карточки <br> и много разной информации
</div>

нужно добавить col-md-?, col-xl-? и прочие подписи к вашему классу col в зависимости от ширины экрана. Но стоит учесть момент, что бутстрап берет за основу для col сетку на 12 колонок, и значения цифр вместо "?" нужно подбирать исходя из этого понимания. Если вам нужна другая ширина и количество блоков в строке, то добавьте свой уникальный класс и посчитайте нужное количество % для его ширины, за основу написания параметров своего класса можно взять значения классов col из бустрапа, только прописать нужный % для ширины блока.

Пример тут:

<div class="col col-md-2 col-xl-1 col-md-my-8 border-grid">
            <a href="#" target="_blank" class="link">Ссылка 1</a> - Здесь описание карточки <br> и много разной информации
</div>

.col-md-my-8 {
    -ms-flex: 0 0 12,5%;
    flex: 0 0 12,5%;
    max-width: 12,5%;
}

А также добавить свои медиазапросы на ширину экрана и поведение своих уникальных классов