@extends('layouts.app')

@section('title', $page->title . ' — HAndipartner')
@section('description', $page->excerpt ?: \Illuminate\Support\Str::limit(strip_tags($page->content), 160))

@section('content')

<section style="background:linear-gradient(135deg,#071530,#0D2B5E);padding:3rem 0 3.5rem">
    <div class="max-w-4xl mx-auto px-4 sm:px-6 lg:px-8">
        <nav style="display:flex;align-items:center;gap:.5rem;font-size:.78rem;color:rgba(255,255,255,.45);margin-bottom:1.25rem">
            <a href="{{ route('home') }}" style="color:rgba(255,255,255,.45);text-decoration:none" onmouseenter="this.style.color='rgba(255,255,255,.8)'" onmouseleave="this.style.color='rgba(255,255,255,.45)'">Accueil</a>
            <svg width="12" height="12" fill="none" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24" style="opacity:.4"><path d="M9 18l6-6-6-6"/></svg>
            <span style="color:rgba(255,255,255,.65)">{{ $page->title }}</span>
        </nav>
        <h1 style="font-size:clamp(1.8rem,4vw,2.8rem);font-weight:900;color:white;margin:0">{{ $page->title }}</h1>
        @if($page->excerpt)
        <p style="font-size:.95rem;color:#8CAED8;margin:.75rem 0 0;max-width:600px">{{ strip_tags($page->excerpt) }}</p>
        @endif
    </div>
    <div class="wave-divider" style="margin-top:2.5rem">
        <svg viewBox="0 0 1440 40" fill="white" xmlns="http://www.w3.org/2000/svg" preserveAspectRatio="none" style="width:100%;height:40px">
            <path d="M0,20 C360,40 1080,0 1440,20 L1440,40 L0,40 Z"/>
        </svg>
    </div>
</section>

<section style="padding:4rem 0;background:white">
    <div class="max-w-4xl mx-auto px-4 sm:px-6 lg:px-8">
        <div class="prose prose-lg max-w-none" style="font-size:.92rem;line-height:1.8;color:#374151">
            {!! $page->content !!}
        </div>
    </div>
</section>

@endsection