{#
  Bloc Hero — image(s) + titre superposé
  block.content.title  string|null
  block.images         [{filename, alt, credits}, …]
#}
{% set images     = block.images ?? [] %}
{% set firstImage = images[0] ?? null %}
{% set title      = block.content.title ?? '' %}

<div id="visual-hero" class="visual-hero">
    {% if title %}
    <div class="visual-title">
        <h1>{{ title }}</h1>
    </div>
    {% endif %}

    {% if images|length > 1 %}
        {% set slides = [] %}
        {% for img in images %}
            {% set slides = slides|merge([{
                src:      '/' ~ img.filename,
                alt:      img.alt ?? '',
                is_first: loop.first
            }]) %}
        {% endfor %}
        {% set swiper = { id: block.anchor_key ~ '-hero', pagination: false, navigation: true, slides: slides } %}
        {% include "/swiper.html.twig" with { swiper: swiper } %}
    {% elseif firstImage %}
        <img class="visual-image" src="/{{ firstImage.filename }}" alt="{{ firstImage.alt ?? '' }}" loading="eager">
    {% endif %}
</div>