{% extends "base.html" %}
{% block title %}Server Error — Canon{% endblock %}
{% block content %}
<div class="flex flex-col items-center justify-center py-24 text-center">
  <h1 class="text-6xl font-display font-bold bg-gradient-to-r from-red-400 to-orange-400 bg-clip-text text-transparent mb-4">500</h1>
  <p class="text-xl text-slate-600 dark:text-slate-400 mb-2">Something went wrong.</p>
  <p class="text-sm text-slate-500 dark:text-slate-500 mb-8">Our team has been notified. Please try again shortly.</p>
  <a href="/" class="inline-flex items-center gap-2 px-4 py-2 rounded-lg bg-accent-600 hover:bg-accent-500 text-white text-sm font-medium transition-colors">
    <svg class="w-4 h-4" fill="none" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" d="M10.5 19.5 3 12m0 0 7.5-7.5M3 12h18"/></svg>
    Back to home
  </a>
</div>
{% endblock %}