## 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/cognitions-swe-2/e9966f12-655e-494e-9580-e5330b0ddc92-1789365705-1.webp
- Full page it was cut from: https://kage-design-assets.t3.tigrisfiles.io/screenshots/cognitions-swe-2/e9966f12-655e-494e-9580-e5330b0ddc92-1789365639098-full.webp
- Component on Kage: https://kage.design/component/cognitions-swe-2-hero

## Before you start
Ask what the user's product, audience, and brand are, then apply the principles below to create an original introduction and evidence visual.

Build an editorial introduction section for a technical report: a short thesis paragraph followed by a large, legible line chart. The chart should clarify the central claim rather than act as decoration.

### Design language
- Layout: constrain prose to 620–700px and place the chart directly below with a clear title, legend, plot area, and caption.
- Typography: 16–18px body text with 1.55–1.7 line-height; chart title 14–16px semibold; axes and caption 10–12px.
- Spacing: 48–72px between opening context and visual; 24px chart padding; 12–16px between chart and caption.
- Colour: paper background `#f8f8f6`, text `#202020`, gridlines `#eeeeea`, primary series `#3315e8`, supporting series in softened lavender/grey tones.
- Borders and radius: optional 1px `#e7e7e2` chart boundary, square or 4px radius, no heavy shadow.
- Interaction: provide a responsive legend and tooltip on data points; preserve readable labels on narrow screens.

### Never
- Never reuse logos, product names, copy, illustrations, or imagery from the reference.
- Never add misleading 3D effects or excessive gradients.
- Never sacrifice axis and caption legibility for visual spectacle.