Enhance landing page visuals and add expandable screenshot viewer

[dovvnloading]

Motivation

• Improve the example screenshots so visitors can inspect UI details by expanding images without leaving the page.
• Elevate the page polish toward a modern, SOTA feel while preserving the existing dark/purple/orange aesthetic.
• Improve perceived performance and accessibility for media content.

Description

• Added ambient visuals (body background-image and .hero::before) to introduce subtle gradients and a hero glow for a premium look.
• Upgraded media surface interactions with richer hover elevation and a zoom affordance by introducing .media-item and .zoomable styles.
• Implemented a full-screen, accessible image viewer with markup (.img-modal, #imgModal, #imgModalPreview, #imgModalClose) and JS to open/close the modal and handle keyboard controls (Enter/Space to open, Escape to close) plus click-outside and close-button support.
• Added loading="lazy" to showcase images and responsive tweaks for the modal on small viewports.

Testing

• Ran git diff --check to validate whitespace and basic issues and it succeeded.
• Served the site with python3 -m http.server 4173 and validated the page manually.
• Automated verification with Playwright: opened http://127.0.0.1:4173/index.html, clicked the first .zoomable image, and captured a screenshot artifact showing the modal open (succeeded).

---

Codex Task