{# team override — leadership grid, square-framed portraits, restrained social row. #}
<section class="sc-section {{ class }}"><div class="sc-content-well">
{% if heading %}<h2 class="sc-heading" style="font-size: clamp(1.75rem, 3vw, 2.25rem); margin: 0 0 0.75rem 0;"><span class="sc-heading-h2-accent">{{ heading }}</span></h2>{% endif %}
{% if intro %}<p class="sc-lede" style="max-width: 60ch; margin: 0 0 2.5rem 0; color: hsl(var(--muted-foreground));">{{ intro }}</p>{% endif %}
{% if members %}<div class="{% if layout == "list" %}sc-stack{% elif layout == "single" %}sc-measure{% else %}grid grid-cols-1 gap-6 sm:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4{% endif %}">{% for member in members %}<div class="sc-feature">
{% if member.photo %}<div class="sc-media-frame" style="aspect-ratio: 1 / 1; background: hsl(var(--muted)); border: 1px solid hsl(var(--border)); overflow: hidden; margin-bottom: 1rem;">{% img member.photo alt=member.name class="sc-team-photo" %}</div>{% endif %}
{% if member.name %}<h3 class="sc-feature-title" style="margin: 0;">{{ member.name }}</h3>{% endif %}
{% if member.role %}<div class="sc-stat-label" style="margin-top: 0.25rem;">{{ member.role }}</div>{% endif %}
{% if member.bio %}<p class="sc-text" style="font-size: 0.9375rem; line-height: 1.6; color: hsl(var(--muted-foreground)); margin-top: 0.75rem;">{{ member.bio }}</p>{% endif %}
{% if member.socials %}<div class="sc-btn-row" style="display: flex; gap: 0.75rem; margin-top: 1rem;">{% for social in member.socials %}{% if social.url %}<a href="{{ social.url }}" aria-label="Profile link" style="color: hsl(var(--muted-foreground));">::{{ social.icon }}:sm::</a>{% endif %}{% endfor %}</div>{% endif %}
</div>{% endfor %}</div>{% endif %}
</div></section>
