MOBILE LAYOUTS
Redesigned for the phone, not stacked.
A design-review page for the team: the mobile decisions behind this site, shown at device scale. Resize the browser to see the same layouts run live.
01 · HOMEHeadline at 25px so it still reads as a statement. Both CTAs full width, 52px tall, above the fold. The sticky bar keeps the primary action in reach at any scroll depth.
02 · NAVIGATIONFull-screen sheet rather than a dropdown. Four primary destinations at 21px, secondary links in a two-column grid, contact actions pinned at the bottom where the thumb is.
03 · PATH SELECTOROn mobile the three cards lose their body copy and become tappable statements; the re-framed panel opens directly beneath the selection instead of in a second column.
04 · FORM & ERROR STATEOne field per row, 48px minimum height, labels above inputs. Errors are text plus icon plus border — never color alone — and the submit stays docked at the bottom of the sheet.
BREAKPOINTS
375 · 768 · 1024 · 1440+. Multi-column sections collapse to one column below 768; the desktop nav appears at 1000.
TOUCH TARGETS
Nothing interactive under 44px. Primary actions are 52px and full width.
TYPE FLOOR
Body never below 15px. Mono labels are tracked, never shrunk below 10px.
MOTION
Reveals are 620ms, staggered 60ms, and disabled entirely under prefers-reduced-motion.