@extends('layouts.inner')

@section('title', 'Page Not Found')
@section('description', 'The page you are looking for could not be found. Return home or get in touch with A1 Movex Global.')
@section('hideCta', true)

@section('content')
  <section class="page-hero page-hero--service">
    <div class="page-hero__orb"></div>
    <div class="container-wide page-hero__inner">
      <div class="page-hero__meta" data-page-reveal><span>Error</span><span>404</span></div>
      <h1 class="page-hero__title" data-page-title>Lost in<br><em>transit.</em></h1>
      <div class="page-hero__bottom" data-page-reveal>
        <p>The page you're looking for has been moved, renamed, or never existed. Let's get your shipment back on route.</p>
        <span class="page-hero__eyebrow">Not found</span>
      </div>
    </div>
  </section>

  <section class="capabilities">
    <div class="container">
      <div class="section-heading-row" data-page-reveal><span class="page-kicker">Where to next</span><h2>Get back<br><em>on course.</em></h2></div>
      <div class="capabilities__grid">
        <a href="{{ route('home') }}" class="capability-card" data-page-card><span>01</span><h3>Home</h3><i>↗</i></a>
        <a href="{{ route('services.index') }}" class="capability-card" data-page-card><span>02</span><h3>Our Services</h3><i>↗</i></a>
        <a href="{{ route('contact') }}" class="capability-card" data-page-card><span>03</span><h3>Contact Us</h3><i>↗</i></a>
      </div>
    </div>
  </section>
@endsection