{% extends "sites_conformes/base.html" %}
{% load static i18n wagtail_dsfr_tags %}

{% block title %}
  <title>{% translate "Error 404 — Page not found" %} — {{ settings.sites_conformes_content_manager.CmsDsfrConfig.site_title }}</title>
{% endblock title %}

{% block content %}
  <div class="fr-container">
    <div class="fr-my-7w fr-mt-md-12w fr-mb-md-10w fr-grid-row fr-grid-row--gutters fr-grid-row--middle fr-grid-row--center">
      <div class="fr-py-0 fr-col-12 fr-col-md-6">
        <h1>{% translate "Page not found" %}</h1>
        <p class="fr-text--sm fr-mb-3w">Erreur 404</p>
        <p class="fr-text--lead fr-mb-3w">
          {% translate "The page you are looking for could not be found. We apologize for any inconvenience." %}
        </p>
        <p class="fr-text--sm fr-mb-5w">
          {% translate "If you typed the web address into your browser, check that it is correct. The page may no longer be available." %}
          <br />
          {% translate "In this case, to continue your visit, you can consult our home page." %}
        </p>
        <div class="fr-btns-group fr-btns-group--inline-md">
          <a class="fr-btn" href="{% root_url %}">{% translate "Back to home page" %}</a>
        </div>
      </div>
      <div class="fr-col-12 fr-col-md-3 fr-col-offset-md-1 fr-px-6w fr-px-md-0 fr-py-0">
        <img src="{% static 'sites_conformes/artwork/technical-error.svg' %}"
             class="fr-responsive-img"
             alt=""
             width="300"
             height="300" />
      </div>
    </div>
  </div>
{% endblock content %}