Hero 186 block design & features
Hero186 is a two-column hero wrapped in a soft rounded shell with shadcn/ui Button components. The leading column uses an h1, optional large description in muted color, then primary and outline CTAs: primary carries a trailing arrow icon; secondary stays text-only. The second column lists up to four feature rows with Lucide icons, short titles, and supporting copy, spaced only by the grid gap so the two columns stay clean without a drawn separator.
Icon color follows the primary token for subtle emphasis; feature titles use h3 under the page-level h1 for a sane outline. The lower band is a full-width aspect-video frame with rounded corners, theme border, centered crop, and a bottom gradient mask so the photo dissolves into the shell instead of ending in a hard edge.
A small inset horizontal margin keeps the shell slightly inset from the viewport edge so the block reads as a card-like panel on marketing pages.