## 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/opentable-com/dad68d84-d5d0-4fa5-a1c8-84465fc5fc04-1789146317-11.webp
- Full page it was cut from: https://kage-design-assets.t3.tigrisfiles.io/screenshots/opentable-com/dad68d84-d5d0-4fa5-a1c8-84465fc5fc04-1789146276379-full.webp
- Component on Kage: https://kage.design/component/opentable-footer

## Before you start
Ask what the user's product, audience, and brand are, then apply the principles below to that context rather than reproducing a restaurant-booking site.

Build a comprehensive site footer. Use these rules:
- Use a dark slate background around #2d3340 with white headings, #c6cbd2 body links, and muted #929aa5 legal text.
- Create five link columns on desktop with short uppercase or small semibold headings. Keep lists vertically aligned and use 13px links with 8–10px row spacing.
- Add a social row in one column or below the link grid using circular monochrome icon buttons with accessible labels.
- Separate legal links and copyright with a subtle #59606c rule, then include a final small partner/company statement row.
- On mobile, collapse columns into accordions or stack them with clear headings; preserve generous 40–56px top padding and 24px bottom padding.
- Provide visible hover/focus states, adequate contrast, and no dependence on tiny text for essential navigation.

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