## Reference images

Study these alongside the description below: hierarchy, rhythm, spacing, colour. Build for the product you are asked about, using this design language.

- Component: https://kage-design-assets.t3.tigrisfiles.io/components/raycast-2-0/585c4674-841f-40bf-a211-e6fd2d8f71e9-1789192912-8.webp
- Full page it was cut from: https://kage-design-assets.t3.tigrisfiles.io/screenshots/raycast-2-0/585c4674-841f-40bf-a211-e6fd2d8f71e9-1789192849096-full.webp
- Component on Kage: https://kage.design/component/raycast-2-0-footer

## Before you start
Ask what link categories, legal pages, social destinations, newsletter offer, and brand voice the user's product needs. Apply these principles to that product rather than reproducing the reference.

Build a large dark footer with a slightly lighter surface (#0d0e10) and generous top padding. Use a centered max-width grid of five or six link columns. Column headings should be 12–13px semibold in #eeeeef; links should be 12–13px in #8f9094 with 12–16px vertical rhythm and brighter hover states. Maintain consistent column widths and let long lists flow naturally. Add a full-width 1px divider in #252629 before a newsletter row. In that row, put a short heading and muted explanatory text on the left, and a horizontal email input plus light subscribe button on the right. Inputs should use #161719, a subtle border, 8px radius, and accessible focus styling; the button should be #ededed with black text. Stack the newsletter layout and link columns cleanly on mobile.

Never: use logos, product names, copy, illustrations, or imagery from the reference.