Project 5 F block design & features
The header is wrapped in a rounded muted-background card. Inside, a two-column grid pairs the title, description, and a pill-shaped studio badge on the left with a centered two-by-two metadata grid (museum, year, medium, status) on a lighter nested card on the right. Three full-width images are stacked below, each in a rounded container with faint overlays, using different aspect ratios (21:9, 16:9, 16:9). A footer card in the same muted style displays a heading and description on the left and a shadcn/ui Button on the right.
The nested card-within-card approach creates a layered surface hierarchy. The pill badge uses a half-opacity muted background with a small dot indicator. Images use extra-large rounded corners. The footer card serves as a clear call to action for booking.
The block has a contained, app-like feel due to its card-based surface treatment. The three stacked images provide a vertical gallery scroll. Entry animations use staggered fade-in-up variants. Built with Shadcn UI tokens.
On smaller screens the two-column header card stacks vertically and the footer card rearranges its content into a single column.