Gallery 14 block design & features
The section splits into a two-column grid. The left column presents a large heading with a faded span for secondary text, a supporting paragraph, and Shadcn UI CarouselPrevious and CarouselNext buttons at larger sizes. The right column holds a Carousel whose visible overflow is clipped only on the left edge, letting upcoming slides peek in from the right. Each slide is a 4:5 rounded-2xl image card with a top-to-bottom gradient overlay and text positioned in the upper-left corner.
Below the grid, a row of navigation indicators maps to each slide. The active dot expands into a rounded pill showing the slide title with a translate-and-fade entrance, while inactive dots contract to small circles. All transitions run at 300ms for a smooth, coordinated feel.
The block reads as bold and typographic, anchored by the oversized split-line headline and the muted-color secondary span. The gradient overlay on each card ensures text legibility without obscuring the imagery.
The navigation row shifts to align beneath the carousel on large screens, and the prev/next buttons hide on mobile to favor swipe-based browsing.
