Description of the Feature 116 block design & features
Feature116 is an image-led bento section built with shadcn/ui patterns and plain anchors. A top heading and muted subtitle set context, then a breakpoint-aware grid places one tall, wide image tile beside a column of two shorter tiles on extra-large screens. Every tile is a full-bleed photo with rounded corners. Hover slides a bottom-to-top gradient scrim into place while labels, short headings, and chevron-led prompts stay pinned over the imagery using light-on-brand contrast.
Color comes primarily from photography, with translucent primary-tinted gradients that intensify on hover. Small Lucide chips sit in the upper area of each panel for quick categorization; typography shifts from compact eyebrow text to larger titles anchored toward the lower third. Motion is limited to the scrim translation, keeping interactions calm.
The aesthetic is polished retail or editorial: bold photography, restrained copy, and clear click targets without extra buttons. Elaboration is moderate and image-heavy; plan on three strong photos and concise overlay copy. The layout emphasizes one flagship tile with supporting satellite stories rather than evenly weighted icon rows.
Below extra-large widths the grid stacks vertically so the tall hero image still leads, while tiles retain the same hover scrim behavior for consistency on touch and pointer devices.