Как лучше всего оптимизировать CSS с помощью Bootstrap 4?

Что лучше ?: написать свой собственный CSS, чтобы добавить отступы и поля для компонентов вашего веб-сайта, или использовать помощники по настройке интервалов из Bootstrap 4?

Например. Вариант А:

<div class = "header-item">
    <a href = "contact">
        <div class = "item-info">
            <img class = "img-icon" src = "help.svg" alt = "Contact">

        </div>
        <div class = "header-item-txt">
            <div><strong>Contact</strong></div>
            <div class = "sub-txt">+36 343 434 343</div>
        </div>
    </a>
</div>

Стили для класса .header-item в Вариант А:

.header-item {
    padding: 2rem 1rem;
    font-size: 18px;
    position: relative;
    cursor: pointer;
}

Или Вариант Б. Удалите стили заполнения из css и используйте помощники начальной загрузки:

<div class = "header-item px-1 pt-2 pb-2">
 ... content
</div>

И css из Вариант Б:

.header-item {
    font-size: 18px;
    position: relative;
    cursor: pointer;
}

Какой лучший способ?