@extends('layout.front.master')

@section('title', '404 — Página no encontrada | ' . config('site.name'))

@section('content')

@php
    $pageTitle = 'Página no encontrada';
    $pageSubtitle = 'La página que buscás no existe o fue movida';
    $breadcrumbItems = [
        ['label' => __('Inicio'), 'url' => url('/')],
        ['label' => '404', 'url' => null],
    ];
@endphp

@include('modules.cd-base.frontend.partials.dynamic-header', [
    'pageTitle' => $pageTitle,
    'pageSubtitle' => $pageSubtitle,
    'breadcrumbItems' => $breadcrumbItems,
])

<div class="container" style="background-color: var(--secondary, #fff);">
    <section class="http-error">
        <div class="row justify-content-center py-5">
            <div class="col-md-7 text-center">
                <div class="http-error-main">
                    <h2 class="font-weight-extra-bold" style="font-size: 8rem; color: var(--primary, #0088cc); line-height: 1; margin-bottom: 0.5rem;">404</h2>
                    <p class="text-4" style="color: var(--quaternary, #777);">Lo sentimos, pero la página que estás buscando no existe o fue movida.</p>
                    <div class="d-flex flex-column flex-sm-row gap-3 justify-content-center mt-4">
                        <a href="{{ url('/') }}" class="btn btn-primary btn-rounded font-weight-bold">Volver al inicio</a>
                        <a href="{{ url('/contact') }}" class="btn btn-outline btn-rounded font-weight-bold" style="color: var(--primary, #0088cc); border-color: var(--primary, #0088cc);">Contactanos</a>
                    </div>
                </div>
            </div>
        </div>
    </section>
</div>

@endsection