{# Section "Marques distribuées et réparées" — réutilisable sur :
   - homepage (entre 3 métiers et tous les équipements)
   - page À propos
   - wrapper pages/service.html.twig (donc 10 pages services)

   Affiche une marquee défilante automatique des logos partenaires.
   Source : entité Marque gérée via le BO (/security/dashboard/marques).
   Fallback : si la table n'existe pas ou est vide, on affiche le symbole
   TCA × 12 en placeholder pour conserver le visuel jusqu'à upload des
   vrais logos par TCA.
#}
{% set marquesList = marques()|default([]) %}
{% set placeholderLogo = 'logos/SYMBOLE/LOGO-TCA-RVB_SYMBOLE-COULEUR.svg' %}

<section class="tca-section tca-reveal">
    <div class="tca-container">
        <div class="tca-section-head tca-section-head--left tca-section-head--dark tca-section-head--bar">
            <h2>Marques distribuées et réparées</h2>
        </div>
    </div>

    {# Marquee plein écran — logos en grand, sans cards. #}
    <div class="tca-brands-marquee" role="list" aria-label="Marques partenaires (défilement)">
        <div class="tca-brands-marquee__track">
            {% if marquesList|length > 0 %}
                {% for m in marquesList %}
                    <div class="tca-brand-placeholder" role="listitem">
                        <img src="{{ asset(m.logoPath ?: placeholderLogo) }}"
                             alt="{{ m.name }}"
                             width="400" height="200"
                             loading="lazy" decoding="async">
                    </div>
                {% endfor %}
                {# Duplicate pour seamless loop. #}
                {% for m in marquesList %}
                    <div class="tca-brand-placeholder" aria-hidden="true">
                        <img src="{{ asset(m.logoPath ?: placeholderLogo) }}" alt="" width="400" height="200" loading="lazy" decoding="async">
                    </div>
                {% endfor %}
            {% else %}
                {# Fallback : 12 placeholders symbole TCA tant que pas de marques en BO. #}
                {% for i in 1..12 %}
                    <div class="tca-brand-placeholder" role="listitem">
                        <img src="{{ asset(placeholderLogo) }}"
                             alt="Marque partenaire (logo à venir)"
                             loading="lazy" decoding="async">
                    </div>
                {% endfor %}
                {% for i in 1..12 %}
                    <div class="tca-brand-placeholder" aria-hidden="true">
                        <img src="{{ asset(placeholderLogo) }}" alt="" loading="lazy" decoding="async">
                    </div>
                {% endfor %}
            {% endif %}
        </div>
    </div>

    <div class="tca-container">
        {# Marques citées en texte uniquement, jamais en logo (consigne client, mail Vincent juin 2026). #}
        <p class="tca-marques-footer">Nous travaillons également avec les marques SEW&nbsp;Usocome, Leroy-Somer, KSB, Flygt, Grindex et Facom. Pas d'exclusivité commerciale&nbsp;: nous choisissons la référence la mieux adaptée à votre besoin et à votre budget.</p>
    </div>
</section>