Roots — Design System v1.0 | Internal · Confidential
ROOTS / DSGN-SYS-2026-01 / FOUNDATION

The visual language of knowing things
in places where knowing things is hard.

A design system for Roots — an in-country sourcing firm working across MEA. Built on the conviction that the firm's work is editorial, archival, and quietly authoritative; not corporate, not slick, and not derivative of the AI-tool aesthetic that dominates the category.

§ 01 · Foundation

Design intent

Anchored to brief —
Map direction · 6-section IA

Roots earns its place by knowing what cannot be known automatically. The design language has to carry that — through restraint, through editorial weight, through the visual vocabulary of field records rather than marketing collateral.

Three deliberate choices anchor the system. Typography pairs Fraunces (a contemporary serif with optical sizing and a softness that reads as thoughtful, not corporate) with Newsreader for body and JetBrains Mono for metadata — none of which appear on competitor sites in the DD space. Colour rejects the blue that every other intelligence and DD firm defaults to; in its place, an ember accent with a weathered parchment ground. Composition uses asymmetry, hairline rules instead of shadows, and field-record codes as a recurring motif.

The system is built to scale across editorial dispatches, country desks, product pages, source catalogues, and engagement intakes — without losing its centre. Every element on this page is a component the production site can use.

Where automated DD ends, we begin. Roots — Positioning · 2026
PRINCIPLE 01
Editorial, not promotional.

The site reads like work product. Dispatches, dossiers, country desks. Marketing is implicit in the rigour of the content.

PRINCIPLE 02
Geography is the moat.

Country desks are the architecture. Coverage is shown, not claimed. The map is the homepage hero, not an afterthought.

PRINCIPLE 03
Restraint over flourish.

Hairlines, not shadows. One accent, used sparingly. White space as a credibility signal. Nothing decorates.

PRINCIPLE 04
Free, then commercial.

Sources and dispatches are openly published. Engagement is gated behind a defined product, not a generic contact form.

§ 02 · Typography

The voice of the firm

Fraunces · Newsreader
JetBrains Mono
Display 1 Fraunces · 80px
Wt 350 · Soft 60
opsz 144 · -0.03em
A firm anchored where the registry ends.
Display 2 Fraunces · 48px
Wt 380
opsz 96 · -0.022em
Roots operates across forty-six jurisdictions in MEA.
Heading 1 Fraunces · 36px
Wt 420 · opsz 72
Dispatches from the field
Heading 2 Fraunces · 26px
Wt 480 · opsz 48
Egypt — Desk Overview
Body — large Newsreader · 19px
Wt 380 · 1.55 line

The Roots country desks are not abstractions; they are named operators with documented sourcing, documented method, and documented turnaround. Where automated DD ends, the desks begin.

Body Newsreader · 16px
Wt 400 · 1.6 line

Each dispatch is filed under a coverage code that locates it in the firm's archive of work — not a marketing artefact, but a reference that can be cited and revisited. The codes serve the same function as a journal volume number: provenance and continuity.

Caption Newsreader Italic · 15px
Wt 380

A note from the field, dated April 2026 — Cairo desk, retrieved from public archive.

Mono — meta JetBrains Mono · 13px
Wt 400 · .08em tracking
FILED — APR 30 / 2026 · CAIRO · COVERAGE T2-T3 · CASE OPEN
Stamp JetBrains Mono · 10px
Wt 500 · .18em tracking
Used for codes and labels
ROOTS-DSP-2026-014 · MEA-LEV-DESK · STATUS: ACTIVE
§ 03 · Colour

An archival palette

One accent · One state
No blue

Three families: ink (the body of the system), ground (parchment-warm surfaces), and a single ember accent that signals action and intent. A muted moss green carries the verified / active state. The deliberate absence of blue separates Roots from every other firm in the category at a glance.

Ink

Ink 900
#1a1612
Body type, primary surfaces in dark mode.
Ink 700
#3a322a
Secondary type, strong rules.
Ink 500
#6b5e50
Captions, tertiary text.
Ink 300
#a89e8e
Muted text, dividers.
Ink 100
#d6cfc1
Hairlines, faint borders.

Ground

Ground 50
#faf6ee
Primary page ground.
Ground 100
#f3ecdf
Card and panel surfaces.
Ground 200
#e8dfcd
Alternate sections, hover.

Ember (single accent)

Ember 700
#8a3a14
Primary accent — codes, links, emphasis.
Ember 500
#b85420
Hover and secondary accent.
Ember 300
#d27a45
Soft accent, illustration.
Ember 100
#f0d9c4
Tinted backgrounds for highlights.

Moss (state)

Moss 700
#3d5a3a
Verified, active, available.
Moss 100
#d3dcc6
Verified-state tint.
§ 04 · Components

The working parts

Composable primitives
In context, not abstract

Action — Buttons

Codes — Chips

ROOTS-DSP-2026-014 MEA-LEV-DESK SOURCE: VERIFIED COVERAGE T3

Editorial — Pull quote

A registry tells you what is filed. A desk tells you what is true. From the Method · Roots · 2026

Editorial — Dispatch card

The atomic unit of the Dispatches section. Each is a published piece of free intelligence the firm chooses to put into the world. Hover state extends the trailing rule.

Geography — Country desk card

The atomic unit of the Map and Coverage sections. Coordinates are not decorative — they anchor each desk to a real city and signal the firm's posture toward concrete, documented presence.

Commercial — Product card

The atomic unit of the Products section. Each commercial offer is defined: numbered, scoped, timed, and priced indicatively. No "contact us for a quote" until the visitor knows what they'd be quoted for.

PRD · 01
Verification

Identity, document, and corporate-existence verification for a named subject in a single jurisdiction. Suitable for KYC refresh, vendor onboarding, and pre-screening.

Scope1 subject · 1 jurisdiction
Timeline3–7 working days
FromUSD 850
TierT1–T2 sources
PRD · 02
Asset Tracing

Documented mapping of corporate, real-estate, and where lawful, financial assets across one or more jurisdictions, with chain-of-custody on every source.

Scope1 subject · 1–4 jurisdictions
Timeline10–21 working days
FromUSD 6,500
TierT2–T3 sources
PRD · 03
Complex Investigation

Investigative-grade DD on sensitive subjects in difficult jurisdictions. Compartmented HUMINT, source-protected reporting, evidentiary discipline.

ScopeBespoke
Timeline21–60 working days
FromUSD 18,000
TierT3–T4 sources

Free / Commercial — Source list

Items in the Sources section. The firm publishes part of its working knowledge openly; the rest is flagged as commercial. The visual rhythm makes the trade legible at a glance.

Engagement — Intake form

Engagement is gated behind a defined product. The intake captures only what's needed to scope and revert; everything else happens in the platform after the engagement letter.

§ 05 · Composition

The map, abstracted

Hero motif
Geography as the moat

The homepage hero is a stylised, interactive MEA map. This is the abstraction sketch — not the production map, but the visual vocabulary it uses. Country desks plot as ember marks; verified coverage plots as moss. Empty space is meaningful: it says where the firm does not (yet) operate.

Open desk
Referral only
Verified source
CAIRO MEA-EGY RIYADH MEA-KSA DUBAI MEA-UAE AMMAN MEA-JOR CASABLANCA MEA-MAR TRIPOLI MEA-LBY KHARTOUM MEA-SDN 35.0° N · 17.0° W 35.0° N · 60.0° E 5.0° S · 17.0° W 5.0° S · 60.0° E

Note: This is a deliberately abstracted illustration. The production map will use accurate geographic data (e.g., Natural Earth) rendered with the same visual treatment — hairline coast, dashed inland trace, ember desk marks with file codes, moss source dots.

§ 06 · Dark · Operations Room

The system, after dusk

Used for product surfaces
and the platform shell

The same primitives, in night mode. Used for the firm's authenticated platform surfaces — the case workbench, the QA workbench, the expert portal — where the visual posture shifts from editorial to operational. Public site stays light.