Freight Scroll Hero — Référence de design web et prompt

# Prompt: freight scroll hero ("Logistics that works as hard as you do.")

Build a single-file **scroll-driven logistics hero** in plain HTML, CSS and vanilla JS, with no framework and no build step. A sticky, full-viewport top-down aerial video sits behind the content. Scrolling scrubs a continuous camera climb: it starts close over a red-and-white container freight train crossing black coal terrain, rises higher and higher as mist drifts across, and ends inside soft white cloud. Over it the content scrolls up normally: first only the scene, then a big 4-line headline rising up the train's axis, then a mirrored features block, and then the clouds take over and fade into a plain text testimonial section.

## Media

- **Pull-up clip:** one clip, 1920×1080, 24 fps, 5.04 s, no audio. Encoded with a keyframe every 4 frames so it seeks instantly.
  - **1080p:** https://d2ol7oe51mr4n9.cloudfront.net/user_38xzZboKViGWJOttwIXH07lWA1P/e02bb27f-80d8-445f-a03e-1b609dac4261.mp4
  - **720p** (for screens ≤ 900px or Save-Data): https://d2ol7oe51mr4n9.cloudfront.net/user_38xzZboKViGWJOttwIXH07lWA1P/e8eb434f-d097-4b1b-b9e6-c8b46fa43040.mp4
- **Poster:** the clip's first frame, https://d2ol7oe51mr4n9.cloudfront.net/user_38xzZboKViGWJOttwIXH07lWA1P/5e018553-cb8a-420a-819f-fcdfa08e5df0.jpg
- **Clip content:**
  - 0–2.3 s: the camera climbs over the train, which stays on the vertical centre line, with wisps of mist.