Page archetypes

Each frame below is a standalone HTML page that loads only tokens.css + css/base.css + components.css + utilities.css — no brand-site chrome. This is exactly what a consumer (the website, a prototype) gets. The first one, Standard starter, is the default starting point for any new page — it includes the page's own nav + footer chrome and is what the escape-velocity-brand skill hands you (web/starter.html). The three below it are chrome-less section demos to lift patterns from. Use the width toggle to check reflow, or open a page full-screen to resize freely. The sources live in site/archetypes/*.html and double as the canonical "how to build a responsive page" reference.

Standard page starter

The default — start here. Real nav + footer chrome, hero, cards, CTA. Composition-only, zero hand-rolled CSS. This is what you fork for a new page.

Landing page

Hero, funnel cards, quote, CTA band. (Chrome-less section demo.)

Offer / Angebot

Narrow document layout: leistungen, fit/risk, investition. (Chrome-less section demo.)

Report / Bericht

Reifegrad bars, priorized levers table, recommendation. (Chrome-less section demo.)