Typography

<div
  style={{
    display: 'grid',
    gridTemplateRows: 'repeat(3, fit-content(100%))',
    gridRowGap: '48px',
  }}
>
  <div
    style={{
      display: 'grid',
      gridTemplateRows: 'repeat(3, fit-content(100%))',
      gridRowGap: '16px',
    }}
  >
    <Header as="h1" className="text-serif">
      H1 Заголовок
    </Header>
    <Header as="h2" className="text-serif">
      H2 Подзаголовок
    </Header>
    <Header as="h3" className="text-serif">
      H3 Подзаголовок
    </Header>
  </div>
  <div
    style={{
      display: 'grid',
      gridTemplateRows: 'repeat(5, fit-content(100%))',
      gridRowGap: '16px',
    }}
  >
    <Header as="h1" className="text-sans">
      H1 Заголовок
    </Header>
    <Header as="h2" className="text-sans">
      H2 Подзаголовок
    </Header>
    <Header as="h3" className="text-sans">
      H3 Подзаголовок
    </Header>
    <p className="f5-color-black text-sans">
      OFL обеспечивает правовую основу и инфра- структуру для совместной
      разработки, совме- стного использования и улучшения шрифтов и связанного
      программного обеспечения во всем мире. Это позволяет авторам шрифтов
      выпускать свою работу под общей лицензией, которая разрешает
      использование, объеди- нение, модификацию и распространение.
    </p>
    <p className="f5-color-black text-sans" style={{ fontWeight: '600' }}>
      Он поощряет общие ценности, не ограни- чивается какой-либо конкретной
      вычис- лительной платформой или средой и может использоваться другими
      органи- зациями или отдельными лицами.
    </p>
  </div>
</div>