## 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/articos-mcp/b74b5a52-121a-40b3-9410-436e13736de5-1791957710-1.webp
- Full page it was cut from: https://kage-design-assets.t3.tigrisfiles.io/screenshots/articos-mcp/b74b5a52-121a-40b3-9410-436e13736de5-1791957659853-full.webp
- Component on Kage: https://kage.design/component/articos-mcp-hero

## Before you start
Ask what the user's product does, who the audience is, and what action the hero should drive. Apply these principles to that product and brand.

Create a centered, high-impact hero for a research or intelligence product without copying the reference. Use a dark background around `#0d0d0b`, ivory headline text around `#f1eee5`, muted supporting text around `#aaa59a`, and a warm gold CTA around `#c8ad45`.

- Start directly beneath the navigation and reserve enough vertical space for a confident, editorial composition.
- Use a max-width of roughly 600–760px and center-align all hero content.
- Make the headline 48–64px on desktop with tight line-height around 0.98–1.05; use a contrasting italic or lighter treatment for a key phrase, but keep it accessible and restrained.
- Add a compact eyebrow above the headline, a two- or three-line supporting paragraph below, and one primary CTA with a soft gold glow.
- Add only subtle ambient texture such as faint dots or gradients generated in CSS; it should never compete with the message.
- On mobile, reduce the headline to 36–44px and preserve generous top and bottom padding.
- Buttons should have a 999px radius, 14–16px horizontal padding, visible hover lift, and clear focus rings.

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