Foundry: Your SaaS Site, Designed Before You Write a Line
A warm editorial SaaS landing page on cream paper: big Fraunces serif headline with a terracotta italic highlight, a split hero with a dark infinite-canvas product mock, staggered feature cards, a real-reference library showcase, a pull quote, a dark palette/craft story, three-tier pricing, and an olive CTA banner.
Summary
Build a warm editorial SaaS marketing landing page on a cream canvas with a large Fraunces serif display headline, a split hero with a dark right-hand product-canvas panel, an asymmetric features grid of staggered cards, a real-reference library showcase, a centered pull-quote testimonial, a dark craft/palette story section, a three-tier pricing block with one highlighted plan, a rounded olive CTA banner, and a four-column footer. Sticky blurred nav with an announcement bar on top; fully responsive reflow at 1280 / 768 / 390.
Style
Warm editorial magazine aesthetic: cream paper base, ink near-black text, a terracotta accent and an olive secondary, set in Fraunces serif display over Inter body. Premium, crafted, not-generated; soft shadows, hairline borders, and pill chips, never beige AI sludge.
Layout & Structure
Centered max-width 1200px container with px-6 / md:px-10 gutters, generous vertical rhythm (py-20 / lg:py-28). The page alternates cream and dark (ink) sections for editorial contrast, leans on asymmetric grids and staggered card translate-y offsets, and reflows every section from 3-up to 1-up on mobile.
announcement bar + sticky nav
split hero
logo trust strip
asymmetric why/how features
library showcase
pull-quote testimonial
dark craft / palette story
pricing
CTA banner + footer
Special Notes
Warm editorial, not generic SaaS: keep the Fraunces serif display + Inter body pairing, the cream/ink/terracotta/olive palette, and the one-italic-terracotta-highlight-word pattern in every major headline. Use soft layered shadows and inset-hairline pills, never heavy borders. Alternate cream and dark ink sections for rhythm and lean on asymmetric grids with staggered card offsets. Phosphor-style line icons only. Responsive: hero right panel + mockup stack on mobile, multi-column grids collapse 3->1, sticky intro becomes static. No em-dashes in any copy; keep the 'Crafted, not generated' editorial voice. Accents stay terracotta + olive on cream; no blue, purple, or default gradients.