@extends('layouts.app')

@section('content')

    <section class="cases-page-header">
        <div class="container">
            <h1>Notable Cases</h1>
        </div>
    </section>

    <section class="cases-list-section">
        <div class="container">
            <div class="case-grid">
                @forelse($cases as $case)
                    <a href="{{ $case->body }}" target="_blank" rel="noopener noreferrer" style="display:block;">
                        <div class="case-card">
                            @if($case->image)
                                <img src="{{ media_url($case->image) }}" alt="{{ $case->title }}" class="case-card-image">
                            @endif
                            <h4>{{ $case->title }}</h4>
                            <p>{{ $case->excerpt }}</p>
                        </div>
                    </a>
                @empty
                    <p class="bio-text">No cases published yet.</p>
                @endforelse
            </div>

            <div class="pagination-wrapper">
                {{ $cases->links() }}
            </div>
        </div>
    </section>

@endsection