feat(website): use full app screenshot for hero, drop mock window chrome

Swap the hero image to screenshots/screenshot-player.webp (channel list,
live player, EPG). The screenshot already includes the app's own window
controls, so remove the decorative title bar (traffic lights + label);
keep the rounded frame, glow, and scanline. Delete the now-unused
hero-dark.png.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>

apps/website/src/components/Hero.astro

@@ -1,6 +1,5 @@
 ---
 import { Image } from 'astro:assets';
-import heroImg from '../assets/screenshots/hero-dark.png';
 import mascotImg from '../assets/illustrations/iptvnator-1-mascot.png';
 
 const heroSocialLinks = [
@@ -154,35 +153,25 @@ const heroSocialLinks = [
       </div>
     </div>
 
-    <!-- Hero screenshot with window chrome frame -->
+    <!-- Hero screenshot (the app window chrome is part of the screenshot) -->
     <div class="relative mx-auto mt-20 max-w-5xl">
       <!-- Ambient glow behind image -->
       <div class="absolute -inset-8 rounded-2xl bg-accent-500/[0.04] blur-3xl"></div>
 
-      <!-- Window chrome -->
+      <!-- Framed screenshot -->
       <div class="relative overflow-hidden rounded-xl border border-surface-700/60 bg-surface-900 shadow-2xl shadow-black/40">
-        <!-- Title bar -->
-        <div class="flex items-center gap-2 border-b border-dashed border-surface-700/60 px-4 py-2.5">
-          <div class="flex gap-1.5">
-            <span class="h-2.5 w-2.5 rounded-full bg-red-500/70"></span>
-            <span class="h-2.5 w-2.5 rounded-full bg-yellow-500/70"></span>
-            <span class="h-2.5 w-2.5 rounded-full bg-green-500/70"></span>
-          </div>
-          <span class="ml-2 font-mono text-[11px] text-surface-500">IPTVnator</span>
-        </div>
-
         <!-- Scanline overlay -->
-        <div class="relative">
-          <div class="pointer-events-none absolute inset-0 z-10 overflow-hidden opacity-[0.03]">
-            <div class="h-full w-full animate-scan" style="background: repeating-linear-gradient(0deg, transparent, transparent 2px, rgba(255,255,255,0.5) 2px, rgba(255,255,255,0.5) 4px);"></div>
-          </div>
-          <Image
-            src={heroImg}
-            alt="IPTVnator application interface showing dark theme with channel list and video player"
-            width={1200}
-            class="w-full"
-          />
+        <div class="pointer-events-none absolute inset-0 z-10 overflow-hidden opacity-[0.03]">
+          <div class="h-full w-full animate-scan" style="background: repeating-linear-gradient(0deg, transparent, transparent 2px, rgba(255,255,255,0.5) 2px, rgba(255,255,255,0.5) 4px);"></div>
         </div>
+        <img
+          src="/iptvnator/screenshots/screenshot-player.webp"
+          alt="IPTVnator desktop app: channel list, live player, and EPG guide in the dark theme"
+          width="2442"
+          height="1806"
+          class="h-auto w-full"
+          loading="eager"
+        />
       </div>
     </div>
   </div>