{% extends "base.html" %}

{% block title %}Page Not Found - {{ site.config.title }}{% endblock %}

{% block meta %}
<meta name="robots" content="noindex, nofollow">
{% endblock %}

{% block content %}
<div class="container">
  <div class="empty-state">
    <div class="empty-state__code">404</div>
    <h1 class="empty-state__title">Page Not Found</h1>
    <p class="empty-state__message">
      Sorry, the page you're looking for doesn't exist or has been moved.
    </p>

    <div class="empty-state__actions">
      <a href="{{ '/' | absolute_url }}" class="button button-primary">Go Home</a>
      <a href="{{ '/blog/' | absolute_url }}" class="button button-secondary">View Posts</a>
    </div>

    <div class="empty-state__suggestions">
      <h2>You might want to:</h2>
      <ul>
        <li><a href="{{ '/' | absolute_url }}">Visit the homepage</a></li>
        <li><a href="{{ '/blog/' | absolute_url }}">Browse all posts</a></li>
        <li><a href="{{ '/tags/' | absolute_url }}">Explore by tags</a></li>
        <li>Use the navigation menu above</li>
      </ul>
    </div>
  </div>
</div>
{% endblock %}