Footer 4 block design & features
The top half uses a six-column grid where the left three columns hold a responsive logo (wordmark on desktop, icon on mobile) and social media icons, while the right three columns contain titled link sections separated by a Shadcn UI separator on small screens. Below this, a full-width separator introduces a prominent newsletter area with a large heading, descriptive text, and an inline email input with a subscribe button. A second separator leads to the bottom row of legal links and copyright.
The newsletter heading is set at a large display size with semibold weight, contrasting with the smaller muted paragraph beneath it. Separators use generous vertical margins to create clear horizontal divisions. Social icons render at a comfortable size with primary-color hover transitions, and the link columns follow the same bold-title, muted-link pattern found across the footer family.
The three-tier vertical structure gives the component a magazine-like sectioned quality. Each band serves a distinct purpose, and the generous spacing between them keeps the footer from feeling cluttered despite its depth.
On smaller viewports the logo and social icons stack above the link columns, which shift from a three-column to a single-column layout. The newsletter section stacks its heading and form vertically.