@extends('layouts.app')

@section('title', __('app.cases.title'))
@section('meta_description', __('app.cases.meta_description'))

@section('content')
    @include('partials.page-hero', [
        'crumbs' => [
            ['name' => __('app.nav.home'), 'url' => lroute('home')],
            ['name' => __('app.nav.case_studies')],
        ],
        'title' => __('app.cases.h1'),
        'lead' => __('app.cases.lead'),
    ])

    <section class="mx-auto max-w-7xl px-4 py-16 sm:px-6 sm:py-20 lg:px-8">
        @if ($studies->isEmpty())
            <p class="rounded-2xl bg-white p-8 text-center text-ink-soft ring-1 ring-black/5">{{ __('app.cases.empty') }}</p>
        @else
            <div class="grid gap-6 md:grid-cols-2 lg:grid-cols-3">
                @foreach ($studies as $study)
                    <a href="{{ lroute('case-studies.show', ['slug' => $study->slug]) }}" class="group flex flex-col rounded-2xl bg-white p-6 shadow-sm ring-1 ring-black/5 transition hover:ring-brand/40">
                        <p class="text-sm font-semibold text-brand">{{ $study->client_name }}</p>
                        <h2 class="mt-2 text-base font-bold text-brand-deep group-hover:text-brand">{{ $study->title }}</h2>
                        @if ($study->quote)
                            <blockquote class="mt-3 flex-1 text-sm leading-relaxed text-ink-soft">“{{ $study->quote }}”</blockquote>
                            <p class="mt-3 text-xs font-medium text-ink-soft/70">{{ $study->quote_author }}</p>
                        @endif
                    </a>
                @endforeach
            </div>
        @endif
    </section>

    @include('partials.cta')
@endsection