@extends('frontend.layouts.partials.app')
@section('title', 'Page Not Found')

@section('content')
    <section class="min-vh-screen flex items-center justify-center bg-gray-50 px-4 py-10">

        <div class="text-center">

            <!-- 404 -->
            <h1 class="text-6xl md:text-7xl font-extrabold text-[#005aab] mb-4">
                404
            </h1>

            <!-- Message -->
            <h2 class="text-2xl md:text-3xl font-semibold text-gray-800 mb-3">
                Page Not Found
            </h2>

            <p class="text-gray-500 max-w-md mx-auto mb-8">
                The page you're looking for doesn’t exist or may have been moved.
                Please check the URL or return to the homepage.
            </p>

            <!-- Button -->
            <a href="{{ url('/') }}"
                class="inline-block px-6 py-3 bg-[#005aab] text-white rounded-xl shadow-md hover:bg-blue-700 transition">
                Go Home
            </a>

            <!-- Decorative Line -->
            <div class="mt-10">
                <div class="w-24 h-1 bg-[#005aab] mx-auto rounded-full opacity-40"></div>
            </div>

        </div>

    </section>
@endsection