{{ attach_library('gesso/hero_inline_image') }}

{% set classes = [
  'c-hero-inline-image',
  has_overlay ? 'has-overlay' : '',
  modifier_classes ? modifier_classes : ''
]|join(' ')|trim %}

<div {{ add_attributes({ 'class': classes }) }}>
  <div class="c-hero-inline-image__media">
    {{ hero_image }}
  </div>
  <div class="c-hero-inline-image__content">
    {% if hero_title %}
      <h1 class="c-hero-inline-image__title">{{ hero_title }}</h1>
    {% endif %}
    {% if hero_summary %}
      <div class="c-hero-inline-image__summary">{{ hero_summary }}</div>
    {% endif %}
    {% if hero_button_text and hero_button_url %}
      <div class="c-hero-bg-image__button">
        {% include '@components/button/button.twig' with {
          'attributes': hero_button_attributes,
          'modifier_classes': 'c-button--large',
          'url': hero_button_url,
          'text': hero_button_text,
        } %}
      </div>
    {% endif %}
  </div>
</div>
