<section class="hero">
    <div class="container">
        <div class="hero__content">
            <div class="hero__left">
                <h1 class="hero__title">
                    {{ entry.title }}
                </h1>
                <div class="hero__description">
                    {{ entry.description }}
                </div>
                <div class="hero__actions">
                    {% for buttonEntry in entry.buttons %}
                        {% set class = buttonEntry.buttonStyle == 'white' ? 'secondary' : 'primary' %}
                        {% include '_partials/link.twig' with {class: 'btn btn--' ~ class ~ ' hero__btn--' ~ class, link: buttonEntry.button} %}
                    {% endfor %}
                </div>
            </div>
            <div class="hero__right">
                {% set images = entry.heroImages.all() %}
                <div class="hero__gallery">
                    <div class="hero__gallery-column">
                        {% set count = 0 %}
                        {% for image in images %}
                            {% set count = count + 1 %}
                            <div class="hero__gallery-item">
                                {% include '_partials/image.twig' with {class: 'hero__gallery-img', transform: 'maxWidth500'} %}
                            </div>
                            {% if count == 3 %}
                            </div>
                            <div class="hero__gallery-column">
                            {% endif %}
                        {% endfor %}
                    </div>
                </div>
            </div>
        </div>
    </div>
</section>