## 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/kinetics-colorion-co/61078688-965b-4221-9177-b73292c8438b-1789374950-1.webp
- Full page it was cut from: https://kage-design-assets.t3.tigrisfiles.io/screenshots/kinetics-colorion-co/61078688-965b-4221-9177-b73292c8438b-1789374925728-full.webp
- Component on Kage: https://kage.design/component/kinetics-colorion-hero

## Before you start
Ask what the user's product does, what its strongest promise is, and what brand colors and voice should shape the hero. Then create an original hero using the principles below.

Build a dark editorial hero directly beneath the navigation, contained within a centered max-width layout with approximately 34px side gutters. Use generous top and bottom padding and a two-column lower area: the left column carries a tiny uppercase eyebrow in a warm muted accent, a large bold condensed or grotesk headline in off-white (#f1f0ed), and one or two words highlighted in a vivid amber-orange (#ff9d00); the right side carries a compact search/control surface and a short technical note separated by a thin vertical accent rule. Keep the headline around 36–42px with tight line-height (0.9–1.0), supporting copy around 11–13px in gray (#8b8b8d), and actions as a bright pill button plus a quiet text/ghost action. Use near-black (#0e0e10), subtle charcoal surfaces (#171719), 1px borders (#2a2a2c), and small radii around 6–9px. The composition should feel like a design-tool catalog: confident, sparse, functional, and slightly technical. Search and buttons should have visible hover/focus states.

Never: copy the reference's headline, product name, copy, illustrations, or imagery.