@extends('site.basic')

@section('title', 'Under construction | Stafa')
@section('meta_description', 'Under construction | Stafa')

@section('content')

    <div class="o-hero">
        <div class="u-bg-triangle-primary"></div>
        <div class="o-hero__main">
            <div class="o-hero__figure">
                <img src="/img/home/home-hero-360.jpg"
                     srcset="/img/home/home-hero-672.png 672w,
                                 /img/home/home-hero-600.png 600w,
                                 /img/home/home-hero-487.png 487w,
                                 /img/home/home-hero-360.png 360w"
                     sizes="(min-width: 1344px) 672px, (min-width: 1152px) 50vw, (min-width: 840px) 40vw, 100vw"/>
            </div>
            <div class="o-hero__content">
                <p class="o-hero__title">Error 404</p>
                <h1 class="o-hero__header">{{__('errors.404.title')}}</h1>
                <p class="o-hero__text">
                   {!! __('errors.404.description', [
                        'sitemap' => localized_route('sitemap'),
                        'homepage' => url(app()->getLocale()),
                   ])!!}
                </p>

            </div>
        </div>
    </div>
    <div class="o-body">

        <div class="u-bg-wrapper">
            <div class="u-ornament-triangle"></div>

            <div class="u-bg-wrapper  u-bg-neutral--100">
                <div class="l-contain">
                    <div class="o-ci  o-ci--is-indented  o-ci--is-reversed">
                        <div class="o-ci__content">
                            <h2>{{ config('site.company.name') }}</h2>
                            <p>
                                {{ config('site.company.address') }}<br>
                                {{ config('site.company.postal_code') }} {{ config('site.company.city') }}<br>
                                @lang('site/global.netherlands')<br>
                            </p>
                            <div class="c-data">
                                <a class="c-data__link" data-icon="phone"
                                   title="@lang('site/global.phoneNumber')"
                                   href="tel:{{ config('site.company.phone.call') }}">{{ config('site.company.phone.display') }}</a>
                                <a class="c-data__link" data-icon="mail"
                                   title="@lang('site/global.emailAddress')"
                                   href="mailto:{{ config('site.company.email') }}">{{ config('site.company.email') }}</a>
                            </div>
                            <p>
                                {{ config('site.company.mailbox.address') }} <br>
                                {{ config('site.company.mailbox.postal_code') }} {{ config('site.company.mailbox.city') }}
                            </p>
                            <p>
                                CoC. {{ config('site.company.chamber_of_commerce') }}
                            </p>

                        </div>
                        <div class="o-ci__image">
                            <div class="c-hex-shape  c-hex-shape--ornament" data-pos="left">
                                <img class="c-hex-shape__image" src="/img/stafa_luchtfoto.png" alt="">
                            </div>
                        </div>
                    </div>
                </div>
            </div>

        </div>

    </div>

@endsection