@extends('public.layout')
@section('title','Our Team — Noesantara Law Firm')
@push('meta')
  @php
    $items = [];
    $i = 1;
    foreach ($members as $m) {
      $items[] = [
        '@type' => 'ListItem',
        'position' => $i++,
        'url' => url('/team/'.$m->slug),
        'item' => [
          '@type' => 'Person',
          'name' => $m->name,
          'jobTitle' => $m->title,
          'url' => url('/team/'.$m->slug),
          'image' => $m->photo_thumb_path ?: $m->photo_path ?: null,
        ],
      ];
    }
    $itemList = [
      '@context' => 'https://schema.org',
      '@type' => 'ItemList',
      'name' => 'Our Team',
      'itemListOrder' => 'https://schema.org/ItemListOrderAscending',
      'numberOfItems' => count($items),
      'itemListElement' => $items,
    ];
    $breadcrumbs = [
      '@context' => 'https://schema.org',
      '@type' => 'BreadcrumbList',
      'itemListElement' => [
        [ '@type' => 'ListItem', 'position' => 1, 'name' => 'Home', 'item' => url('/') ],
        [ '@type' => 'ListItem', 'position' => 2, 'name' => 'Team', 'item' => url('/team') ],
      ],
    ];
  @endphp
  <script type="application/ld+json">{!! json_encode($itemList, JSON_UNESCAPED_SLASHES|JSON_UNESCAPED_UNICODE) !!}</script>
  <script type="application/ld+json">{!! json_encode($breadcrumbs, JSON_UNESCAPED_SLASHES|JSON_UNESCAPED_UNICODE) !!}</script>
@endpush
@section('content')
<div class="container py-5">
  <h1 class="h3 mb-4">Our Team</h1>
  <div class="row g-3">
    @foreach($members as $m)
      <div class="col-md-6 col-lg-4">
        <a href="/team/{{ $m->slug }}" class="text-decoration-none">
          <div class="card h-100">
            @if($m->photo_thumb_path ?? $m->photo_path)
              <img src="{{ $m->photo_thumb_path ?: $m->photo_path }}" class="card-img-top" alt="{{ $m->name }}"/>
            @endif
            <div class="card-body">
              <h2 class="h5 mb-1">{{ $m->name }}</h2>
              <div class="text-muted small">{{ $m->title }}</div>
            </div>
          </div>
        </a>
      </div>
    @endforeach
  </div>
</div>
@endsection