404

public/_errors/404.php

@@ -7,34 +7,38 @@ require __DIR__ . '/../../config/fileload.php';
 $lang = $_GET['lang'] ?? 'de';
 $lang = in_array($lang, ['de','en','it','fr']) ? $lang : 'de';
 
-// Titel und Navigation für das Layout
+// Titel & Description
 $pageTitle       = 'Seite nicht gefunden – usbcheck.it';
 $pageDescription = 'Die angeforderte Seite wurde nicht gefunden.';
-$navAnchors      = []; // keine Anker auf der 404
+$navAnchors      = []; // Navigation auf der 404 deaktiviert
 
 tpl('layout_start', 'structure');
 ?>
-<section class="mx-auto max-w-3xl text-center py-20 px-6">
-    <div class="flex flex-col items-center gap-6">
-        <!-- 404 Bild -->
-        <img
-            src="/_errors/img/404.png"
-            alt="Seite nicht gefunden"
-            class="w-40 h-40 sm:w-56 sm:h-56 object-contain opacity-90"
-            loading="lazy"
-        >
 
-        <h1 class="text-5xl font-heading font-bold text-brand-primary mb-2">
+<!-- Vollflächiges Hintergrundbild -->
+<div class="relative w-full min-h-[70vh] flex items-center justify-center text-center">
+
+    <!-- Hintergrund -->
+    <div class="absolute inset-0 bg-cover bg-center"
+         style="background-image: url('/_errors/img/404.png'); filter: brightness(0.45);">
+    </div>
+
+    <!-- Inhalt -->
+    <div class="relative z-10 px-6 py-20 max-w-2xl mx-auto">
+        <h1 class="text-5xl sm:text-6xl font-heading font-bold text-white drop-shadow-lg mb-4">
             404
         </h1>
-        <p class="text-brand-muted text-lg mb-6">
+
+        <p class="text-brand-muted text-lg sm:text-xl mb-8 text-white/90 drop-shadow">
             Die angeforderte Seite wurde nicht gefunden.
         </p>
+
         <a href="/?lang=<?= htmlspecialchars($lang) ?>"
-           class="inline-block rounded-full bg-brand-primary text-brand-bg px-6 py-3 text-sm font-semibold hover:bg-blue-400 transition-colors">
+           class="inline-block rounded-full bg-brand-primary text-brand-bg px-8 py-3 text-sm sm:text-base font-semibold hover:bg-blue-400 transition-colors shadow-lg">
             Zurück zur Startseite
         </a>
     </div>
-</section>
+</div>
+
 <?php
 tpl('layout_end', 'structure');