@php
    /** @var \App\Models\ContentPage $page */
@endphp

<x-app-shell :title="$page->meta_title ?: $page->title" max="max-w-5xl">
    @push('head')
        @if ($page->meta_description)
            <meta name="description" content="{{ $page->meta_description }}">
        @endif
    @endpush

    <article class="surface overflow-hidden">
        <div class="border-b border-slate-200 bg-[linear-gradient(135deg,#ECFDF5_0%,#EFF6FF_100%)] p-6 sm:p-10">
            <p class="eyebrow">{{ setting('general.application_name', 'RemoteMatch') }}</p>
            <h1 class="page-title mt-3">{{ $page->title }}</h1>
            @if ($page->excerpt)
                <p class="body-copy mt-4 max-w-3xl">{{ $page->excerpt }}</p>
            @endif
            <p class="mt-5 text-sm font-bold text-slate-500">
                Last updated {{ $page->updated_at->format('M j, Y') }}
            </p>
        </div>

        <div class="content-page-body p-6 sm:p-10">
            {!! $page->renderedContent() !!}
        </div>
    </article>

    <x-site-footer compact />
</x-app-shell>