<div class="o-team">
    @if(isset($teamHeading))
        <h2 class="o-team__heading" data-kal="fade">{{$teamHeading}}</h2>
    @endif

    <div class="o-team__matrix">
        @foreach($teamMembers as $teamMember)
            <div class="o-team__item" data-kal="fade" style="--kal-delay: {{($loop->index % 5)*0.1}}s">
                @include('components.profile', [
                    'profileImage' => $teamMember->documents->first()->medium_image_url ?? null,
                    'profileTitle' => $teamMember->name ?? null,
                    'profileLabel' => $teamMember->translation->function ?? null,
                ])
            </div>
        @endforeach
    </div>

    @if(isset($teamActionButton))
        <div class="o-team__action" data-kal="fade">
            @include('components.button', [
               'buttonText' => $teamActionButton ?? null,
               'buttonLink' => $links->coaches->route ?? '/',
           ])
        </div>
    @endif
</div>