kudder1

Оригинал вашего градиента выглядит так:

background: linear-gradient(to top, #ffea00,#ffd000 85%, #ffd900);

Дальше берете автопрефиксер, вставляете туда оригинал, устанавливаете какие браузеры собираетесь поддерживать и получаете результат.

У нас бы в компании сделали так https://codepen.io/anon/pen/eQeqpJ (спойлер - миксины)

Делить на 4 колонки надо только там, где это действительно надо (как в нижней части картинки с 4 иконками). Верхняя часть будет 1 колонкой.

Грубый пример:

<div class="container">
  <div class="row">
    <div class="col">WE DESIGN THINGS</div>
  </div>
</div>

<div class="container">
  <div class="row">
    <div class="col">ICON</div>
    <div class="col">ICON</div>
    <div class="col">ICON</div>
    <div class="col">ICON</div>
  </div>
</div>