{% extends "public_base.html" %}

{% block title %}Team — {{ SPLENT_APP }}{% endblock %}

{% block hero %}
    {{ render_block('hero', eyebrow=_('People'), title=_('Team'),
                    subtitle=_('The people behind the project.')) }}
{% endblock %}

{% block content %}
<div class="container section">
    {% for role, members in groups.items() %}
    <h2 class="section-title">{{ role.name }}</h2>
    <div class="member-grid">
        {% for m in members %}
        <a class="member-card" href="{{ url_for('team.detail', slug=m.slug) }}">
            {% if m.photo %}
            <img class="member-card__photo" src="{{ m.photo }}" alt="{{ m.name }}" loading="lazy">
            {% else %}
            <span class="member-card__placeholder" aria-hidden="true">{{ m.name[:1] | upper }}</span>
            {% endif %}
            <div class="member-card__overlay">
                <h3 class="member-card__name">{{ m.name }}</h3>
                {% if m.position %}<p class="member-card__role">{{ m.position }}{% if m.affiliation %} · {{ m.affiliation }}{% endif %}</p>{% endif %}
            </div>
        </a>
        {% endfor %}
    </div>
    {% else %}
    <p class="card__text">{{ _('No team members yet.') }}</p>
    {% endfor %}
</div>
{% endblock %}