Numbered Card

A numbered point on a case-study page — a problem to solve, an assumption that didn’t hold, a change for next time. Authored in Sanity as a “Numbered cards” block; the number comes from position. Surface and colour wash live in the .card-numbered class in globals.css.

Default — problems and principles

01

One product, not four

Add each partner without the portal splitting into separate mini-products.

02

Keep paying simple

More choice at the payment step can't turn into a slower or harder payment.

03

Ready for the next one

Build it so the fifth partner costs a fraction of what the first one did.

tsx
<NumberedCard index={1} title="One product, not four" body="…" />

Assumption — amber

01

I assumed what we designed could be built.

Feasibility came back from engineering, not from us. Knowing early beat defending a design that couldn't ship.

02

I assumed decisions would move at our pace.

Decisions moved at the speed of two organisations agreeing, not at the speed of the design.

tsx
<NumberedCard variant="assumption" index={1} title="…" body="…" />

Change — red

01

Engineering in the room from the first exploration

I'd have the platform's constraints on the table before the first concept, not after it.

02

One decision forum across both companies

I'd agree a single joint forum, and who can say yes in it, at kickoff.

tsx
<NumberedCard variant="change" index={1} title="…" body="…" />

Props

PropTypeDefaultDescription
index*number-1-based position, rendered zero-padded ("01").
title*string-The point itself, one line.
bodystring-A short paragraph expanding the point.
variant"default" | "assumption" | "change""default"Wash and index colour only: accent blue for problems and principles, orange for “what I assumed”, red for “what I’d change now”.