Hero 331 block design & features
Hero331 is a two-column split hero built with shadcn/ui. The left column stacks a large headline, supporting copy, and paired buttons. The right column is almost filled by a looping muted video inside a phone bezel with a notch, cropped to a tall nine-by-sixteen frame.
The page stays light with dark type. The handset uses a dark bezel, large corner radius, and a soft circular wash that sits behind and to the right of the device. Headline lines sit tight. Type stays start-aligned. The clip loops without controls.
It keeps the portrait-phone idea of the smaller split but lets the device take the column. The scale is the difference: the handset reads as the primary visual, not a side accessory. Complexity stays low: you need a headline, two CTA labels, and one clip that can be cropped tall.
On small screens the columns stack and the phone stays centered under the copy at a capped width.
