{% for mecene in mecenes %}

    <div class="col-md-6 col-lg-2 d-flex mt-2">
  <div class="card overflow-hidden w-100 h-100">
    <div class="el-card-item h-100 d-flex flex-column justify-content-between">
      <div class="el-card-avatar p-4 el-overlay-1 w-100 overflow-hidden position-relative text-center d-flex align-items-center justify-content-center" style="height: 90px;">
        <a class="fiche image-popup-vertical-fit text-center" href="javascript:void(0)" data-id="{{ mecene.idtoken }}">
          {% if mecene.logo %}
            <img src="{{ asset('uploads/mecenes/logos/' ~ mecene.logo) }}" class="d-block position-relative mx-auto" style="max-width:100%; max-height:75px;" alt="{{ mecene.nom ?? 'mécène' }}" />
          {% else %}
            {% set initials = mecene.nom|slice(0, 1)|upper %}
            <span class="text-bg-secondary text-white fs-6 round-40 rounded-circle border border-2 border-white d-flex align-items-center justify-content-center" style="width: 60px !important; height: 60px;">
              {{ initials }}
            </span>
          {% endif %}
        </a>
      </div>

      <div class="text-center pb-3">
        <h6 class="mt-2 mb-0">{{ mecene.nom }}</h6>
        <small class="text-muted">{{ mecene.secteur.nom }}</small>
      </div>
    </div>
  </div>
</div>


  {% else %}
    <div class="col-12"><em>Aucun mécène / partenaire trouvé.</em></div>
  {% endfor %}