content.organic-story-arch · Story beside an arch

A content pattern from Organic Earth, drawn alone below with this design's tokens and sample copy. Used in this design on: home page, section 3; about page, section 1. Give the section root data-pattern="content.organic-story-arch". A guide only: DESIGN.md and tokens.json are the source of truth.

Rule
The story (label, h2, lead, body, link) on 1–6; a tall arch photo on 8–12; a small clay circle sits in the gap at 7.
Slots
sectionLabel, title, body, body2, cta, image
Grid areas
story 1-6 · seed 7-7 · arch 8-12 (12-column grid, 1-based inclusive spans)
Tokens
bg #F3EBDD · text #2E2A22 · heading #2A1F14 · accent #BC572B · accent2 #A56B00 · Fraunces / Karla · radius 28px · space unit 8px (full list in design/tokens.json)

Pattern notes

  • Columns 1–6, vertically centred: italic eyebrow, h2 (step 4), lead, body (max 58 ch) and an underline link. A small clay circle sits alone in column 7, bottom-aligned (hidden on phone). Columns 8–12: a tall 3:4 arch photo.

About

How we think

Each engagement starts with a two-week audit: interviews with customers, sales and the people who build the product. The brief writes itself after that.

We hand over everything — source files, a living brand system and a website your team can edit without calling us.

Start a project