Hero 164 block design & features
Hero164 is a client-side two-column hero built with shadcn/ui. The left stack moves from an extra-large primary-tinted headline into medium body copy, a full primary button, then a secondary block with instructional line and a ghost-styled play surface over a photo background; clicking opens a dialog with a titled 16:9 iframe. The right column is a simple tall rounded image with a portrait crop.
Muted accent fills the video teaser; hover scales the background image slightly and deepens scrim. Typography uses the Onest font stack for a contemporary SaaS rhythm.
Suited to mentorship or education landing pages where a recording replaces static art. Complexity sits in wiring a real embed URL and choosing photography that pairs with the preview frame.
The split collapses to a single column on narrow viewports with imagery following the text stack.