Showcase
Loading component registry groups and selected install bundle...
Full-bleed hero band — media background (image / video / solid color), positioned overlay panel (card, full-height, or lower-third — a full-width flush text band at the bottom of the image), eyebrow + display title + body + CTA pair. Title size and title weight params; weight defaults to the theme's --heading-weight token so brands can re-weight headings globally. Variants: FullBleed, Placeholders (heading fields render above a `hero-overlay-content-{*}` slot for composed blocks). Pick Placeholders when the source shows a photo band with a heading and a floating row of small icon/utility cards ('How can we help you?'): Image + OverlayShape full-height + OverlayWidth full + OverlayStyle solid + OverlayColorScheme black + OverlayOpacity 45 (the dark scrim) + Layout centered Title, with quick-links-tiles (Default, Columns 4, TileSize sm, MaxWidth standard, PaddingY none, icon-name@1 icons) composed in the slot. Inset axes: MediaInset (fullBleed/contained/card) frames the photo inside the page surface, OverlayBreach shifts the overlay card outward to straddle the media edge (Greene-King inset-photo look), BottomBandColorScheme attaches a solid color strip to the hero's bottom edge (Allstate tabs-on-band base).
src/components/registry/components/heros-and-promos/hero.tsx→components/registry/components/heros-and-promos/hero.tsxsrc/components/registry/components/heros-and-promos/hero.recipe.ts→src/recipes/hero.recipe.ts