@component('open._layouts.app', [
    'title' => $pageExperts->name,
    'meta' => $pageExperts->meta(),
])
<section class="expert-list">
    {{ Breadcrumbs::render('experts') }}

    @include('open.experts._partials.listHeader')

    <section class="container expert-list-container">
        @foreach($experts->chunk(3) as $row)
        <div class="row">
            <ul class="clear-both">
                @foreach($row as $expert)
                <li class="col col-4 col-xs-12">
                    <div class="round-thumbnail">
                        <figure>
                            <span></span>
                            @if($image = $expert->getFirstMedia('featured'))
                                <img src="{{ $image->getUrl('small') }}" alt="{{ $image->name }}">
                            @else
                                <img src="https://via.placeholder.com/400x400">
                            @endif
                        </figure>
                        <div>
                            <h4>{{ $expert->name }}</h4>
                            <p>{{ $expert->title }}</p>
                        </div>
                        <a href="{{ $expert->path() }}" class="chevron">@lang('experts.profilelink')</a>
                    </div>
                </li>
                @endforeach
            </ul>
        </div>
        @endforeach
  </section>

    @if(!$relatedArticles->isEmpty())
        @include('open._layouts._partials.sliderWidget', ['articles'=>$relatedArticles])
    @endif
</section>
@endcomponent