Solar Fog — Référence de design web et prompt

# Lumen Roof — Morning / Night Fog Hero (exact recreation prompt)

Give me a single-file, full-viewport solar company hero called **Lumen Roof**. A charcoal farmhouse with solar panels fills the screen under a big centred headline. A glass Morning / Night toggle sits at the bottom. Clicking it sinks the whole house about a quarter of the screen into rising fog, swaps the time of day while it is hidden, and floats the house back up in the new light, while the sky, fog colour, nav, headline and button change with it.

Plain HTML, CSS and one vanilla script with raw WebGL2 in one file, with no libraries. The only external resources are the Google Font and the six image URLs below. Reproduce every value, string and timing exactly, and use the complete code at the end as the source of truth.

Six rules define it:
1. **Three layers, one moving.** A blurred sky stays still. The house and its garden sit in one layer that moves on the Y axis only. Fog is a live shader canvas above both, and all text sits above the fog.
2. **Two images make the moving layer.** The full photo is masked so only its lower part shows (the ground and shrubs). The transparent house cutout sits on top of it, so the house's outline stays clean against the blurred sky.
3. **The swap happens at the deepest point.** Fog fully covers the roof at that moment, so the change of house is never seen.
4. **Everything is driven by one clock.** There are no CSS transitions on the scene. One `requestAnimationFrame` function computes sink, fog surge and colours from the time since the click and writes them to CSS variables and shader uniforms.
5. **Colours are mixed, not swapped.** Every text colour is a `color-mix()` on `--k`, where 0 is morning and 1 is night.