Макар Герасимов

https://api.jquerymobile.com/scrollstart/

"Note that iOS devices freeze DOM manipulation during scroll, queuing them to apply when the scroll finishes. We're currently investigating ways to allow DOM manipulations to apply before a scroll starts"

Создаете модификатор блока .header, например .header--fixed.

.header
  height 60px
  background #000
  &--fixed
     position fixed
     left 0
     top 0

Со стороны JS делаете проверку:

$(window).scroll(function() {
  var container = $('.header');
  var status = $(this).offsetTop >= container.height() ? true : false;

  container.toggleClass('.header--fixed', status);
});

Либо делаете сразу фиксированным .header и создаете отступ у контейнера который оказывается под .header

-- Проблема в шрифте и его корявого восприятия кирилицы с разных осей. --
Нашел альтернативу шрифту Pragmatica : Helvetice (подключается по умолчанию в bootstrap)
Но в комплекте не поставляется :( а он есть по дефолту только на mac устройствах но не windows. Решение: нашел и подключил (правда он платный, но сумел найти слив)

Так подойдет?

<section id="content">
     <h2 class="section-title">Заголовок</h2>
</section>

@import url(http://allfont.ru/allfont.css?fonts=pragmatica-cyrillic);
section {
    .section-title {
        font-family: 'Pragmatica Cyrillic', Tahoma;
        height 55px;
        background #fff;
        text-align center;
        text-transform uppercase;
        line-height 60px;
        margin 26px 0;
    }
}