feat(images): JPEG XL optimizer with webp/jpg fallback and <picture> serving

img_optimize() decodes .jxl with djxl or Imagick, resizes with GD, re-encodes
with cjxl and writes foto.jxl.webp beside it; skips cleanly without a decoder.
Gallery, hero, navbar logos and JSON-LD serve the JXL with the fallback, and
trash/removal move the fallback with its .jxl.

site/includes/include.php

@@ -50,7 +50,9 @@ $canonical = $GLOBALS['_canonical_override'] ?? match ($page) {
 <link rel="dns-prefetch" href="https://forms.zohopublic.eu">
 <?php if (($current_uri_2 ?? '') === ''): ?>
 <!-- Homepage hero is the LCP image — start fetching it before the CSS/JS -->
-<link rel="preload" as="image" fetchpriority="high" href="<?= htmlspecialchars(base_url(($gym_meta['hero_image'] ?? '') !== '' ? $gym_meta['hero_image'] : 'site/assets/img/home.jpg')) ?>">
+<?php $pre_hero = ($gym_meta['hero_image'] ?? '') !== '' ? $gym_meta['hero_image'] : 'site/assets/img/home.jpg';
+      // A .jxl hero (img_css_bg) is preloaded only where JXL is supported (type=); the rest fetch the fallback from the CSS. ?>
+<link rel="preload" as="image" fetchpriority="high" href="<?= htmlspecialchars(base_url($pre_hero)) ?>"<?= img_fallback_rel($pre_hero) !== '' ? ' type="image/jxl"' : '' ?>>
 <?php endif; ?>
 
 <!-- Fonts (Roboto self-hosted — see @font-face in style.css) -->