<div class="container container--lg site-intro">
    <div class="site-intro__content">

        <p class="site-intro__lead"><span>At quo ex, accusantium eum non eaque nisi doloremque dignissimos quasi deleniti quidem reiciendis placeat cum facilis rerum modi maiores earum pariatur?</span></p>
    </div>
</div>
<div class="container container--lg site-intro{{ modifier is defined ? ' site-intro--' ~ modifier }}">
  {% if background is defined %}
    <picture class="site-intro__background">
      <img src="{{ background.src }}" alt="{{ background.alt }}">
    </picture>
  {% endif %}
  {% if image is defined %}
    <picture class="site-intro__image">
      <img src="{{ image.src }}" alt="{{ image.alt }}" with="300" height="200">
    </picture>
  {% endif %}
  <div class="site-intro__content">
    {% if portal is defined %}
    {% include  '@portal' with { 'portal': portal } %}
    {% endif %}

    {% if lead %}
    <p class="site-intro__lead"><span>{{ lead }}</span></p>
    {% endif %}
  </div>
</div>
{
  "lead": "At quo ex, accusantium eum non eaque nisi doloremque dignissimos quasi deleniti quidem reiciendis placeat cum facilis rerum modi maiores earum pariatur?"
}