faq.midcentury-two-up · Two-up FAQ

A faq pattern from Mid-Century Modern, drawn alone below with this design's tokens and sample copy. Used in this design on: contact page, section 2. Give the section root data-pattern="faq.midcentury-two-up". A guide only: DESIGN.md and tokens.json are the source of truth.

Rule
Title across 1–7, then questions in rounded surface panels, two per row across the full grid: bold question, answer under it.
Slots
sectionLabel, title, faqs[2..4]
Grid areas
header 1-7 · list 1-12 (12-column grid, 1-based inclusive spans)
Tokens
bg #F3E9D6 · text #2B231B · heading #2B231B · accent #C9552A · accent2 #0099BE · League Spartan / Jost · radius 20px · space unit 8px (full list in design/tokens.json)

Pattern notes

  • The label and title (step 5) on 1–7, then two or four questions (an even number, so no panel sits alone) in rounded `surface` panels, two per row across the full grid: question as h3, answer in body type under it. All answers visible.

FAQ

Working together

How big are your projects?

Most run 8–16 weeks with a team of three to five people.

Do you work with startups?

Yes, from Series A onwards, when there's a product and paying customers.

Do you build the website too?

We design and build, then train your team to run it.

Where are you based?

Lisbon and London, working with clients across Europe and North America.