Project 4 B block design & features
The block centers the header content with a small uppercase label, a large bold title, a subtitle paragraph, and a row of three metadata items. A full-width hero image follows. The lead paragraph is center-aligned with prose styling. Subsequent sections for challenge, process, and outcome alternate between prose text blocks and full-width images, with one image including an italic caption. Each section uses its own constrained container width for text and a slightly wider container for images.
Typography follows the prose defaults with clear heading hierarchy. The centered header creates a title-page feel, and the metadata row uses uppercase semibold labels in muted foreground. Images are rounded and span the full inner container width. The interleaving pattern of text and image creates a rhythm that breaks up long reading passages.
The aesthetic is clean, centered, and magazine-like. Compared to the sidebar variant, this version keeps all content in a single flow without persistent navigation. No animations or interactive elements are used. Built with shadcn/ui layout tokens.
The metadata row wraps on smaller screens and the image containers maintain their full width within the viewport.