Bakstad Construction

The reference for a spare, gallery-grade builder portfolio: a single vertical rule splits a fixed sidebar from a #F3F3F3 canvas where one 30px Suisse BP Intl statement and a bottom-anchored project photo carry the whole hero.

Architecture flagship

Design tokens

background

surface

text

textMuted

accent

border

tone1

display: Suisse BP Intl
body: Suisse BP Intl
mono

Do / Don't

Reference it for

Fixed-sidebar-plus-rule layout: a thin 1px hairline at ~90px from the left divides a persistent nav column (b mark top, 'Menu' bottom) from the content field
Muted-label + solid-statement heading pair: business name in sage #B6BAAF above the real message in ink #2A312E, both at 30px, no size jump
The whole system runs one face at one weight: Suisse BP Intl 400, sizes locked to 15px body and 30px headings, nothing else
Near-white paper ground rgb(243,243,243) / #F3F3F3 instead of pure white, so photography reads warmer
Ink is a desaturated green-graphite rgb(42,49,46) / #2A312E, never true black for text even though #000 exists in the palette
Text-link CTAs with trailing glyphs ('Explore down-arrow', 'About right-arrow') rather than buttons; direction of the arrow signals scroll vs navigate
Bottom-bleed hero image: a single project photo anchored to the lower-right, cropping off the bottom edge, leaving generous empty upper space
30px line-height matched to 30px type for tight, architectural heading blocks

Do not copy

The lowercase serif 'b' monogram mark
The Bakstad Construction name, Dalen Bakstad principal credit and Seattle contact details
Suisse BP Intl itself (a licensed foundry face; sub a comparable neutral grotesque)
The specific project names (Arroyo Beach, Beach Drive, Casa Bonita, Harvard) and their photography
The exact sage-plus-graphite pairing as a lift; re-derive the muted/ink relationship for the new brand
The 'Conscientious Construction' / 'Selected Press' section copy