Hero 315 block design & features
Hero315 is a straightforward two-column hero built with Shadcn UI buttons where copy sits on the left and a four-to-three main image occupies the right column inside the container. The main image uses a muted background fill, a border, and top-weighted cropping. A square inset image overlaps the bottom-left edge of the main photo, positioned outside the frame toward the text column.
The layout stays simple with a display heading, muted paragraph, and paired primary and outline buttons in a horizontal row on wider breakpoints. Spacing is even and restrained, with no decorative backgrounds or viewport bleed. This is the baseline inset-image pattern for teams that want a clean split without extra framing layers.
Visually it reads as a calm, product-marketing hero with familiar column balance and a single accent detail in the inset thumbnail. Complexity is low and content-driven: one hero screenshot plus one detail image are enough to populate the block.
On mobile the columns stack with copy above the media stack, preserving the outside inset offset with padding on the media column so the thumbnail is not clipped.