Footer Reveal

Build a landing-page footer section. Structure: a dark ink footer with 3 link columns (Product / Company / Legal), each with a tiny uppercase muted heading and 2-3 links below. At the bottom, a giant version of your wordmark rendered at ~14% paper opacity - a ghost watermark that anchors the whole footer. Entrance: when the footer scrolls into view, the columns rise in one after another (opacity 0 to 1, y from 14px, 0.45s, decisive ease, 100ms stagger), and the giant wordmark comes up last with a slightly longer, deeper rise (y from 20px, delay ~0.3s). Run once. Link hover: the link slides 3px toward the reading direction on a stiff spring (stiffness ~460) and turns the accent color (0.2s). Keep the underline off - the slide plus color is the affordance. The wordmark is decoration: aria-hidden, user-select none, and its trailing character (or one letter) tinted with the accent at ~50% opacity for a signature touch. Accessibility: real links with real hrefs; under prefers-reduced-motion everything appears in place and links change color only. Colors as tokens: ink background, paper text at graded opacities (40% headings, 60% links, 14% watermark), one accent. Build the component, not this demo of it. - Ambient motion that IS the component may loop: a drifting background, a marquee, a spinner while something is genuinely loading. - Do not add any timer, interval, loop or script that performs a person's action by itself. No auto-hover, no auto-click, no cycling through states, no pretend submitting, no replaying the interaction on a schedule. - Every state that answers a person waits for a real event from that person. - Placeholder copy and sample content are welcome. Simulated behaviour is not.