Design system
Soft, warm neutrals and a dusty blue keep the reading experience quiet. Whitespace does most of the layout work. A single saturated orange is reserved for subscribing. Every value below is read live from the stylesheet.
A logotype: the abbreviation wgow followed by an ellipsis that is always the accent orange, the same dots as the favicon. It is set in Outfit SemiBold, the one place that typeface is used, because its round letters and round dots belong to the same family of shapes.
cta, whatever the background.Warm neutrals. The page is never pure white, so cards read as lifted.
paper
…
Page background
surface
…
Cards, inputs
sunken
…
Wells, footers, table headers
line
…
Hairline borders and dividers
line-strong
…
Input and button borders
Three steps, all AA on paper and surface.
ink
…
Headings, key text
ink-soft
…
Body copy
ink-muted
…
Meta, captions, placeholders
A dusty blue for links, active states and quiet emphasis.
brand-50
…
Hero wash, hover tint
brand-100
…
Selection
brand-300
…
Link underline
brand-600
…
Links, ghost buttons
brand-700
…
Link hover
The only saturated colour in the system. Reserved for subscribe actions so it is always the loudest thing on the page.
cta
…
Primary button (white text, 5.2:1)
cta-hover
…
Primary button hover
cta-soft
…
Highlights, search matches
Form feedback only.
success
…
Confirmation
success-soft
…
Confirmation background
danger
…
Errors
danger-soft
…
Error background
Each topic owns one soft tone (background + readable foreground). It tints tags, filters and the topic page header so topics are recognisable without competing with the CTA.
Inter · interface and headings
Display · fluid 36–60px, -3.5%
Quietly confident
Headline · fluid 28–40px
What changed
Title · 20px
Armenia-Azerbaijan Relations
Body large · 18px
Short, plain-language summaries for busy readers.
Body · 16px
Explicit deadline for treaty signing and ratification, paired with a bold proposal.
Small · 14px
Updated October 18, 2026 · 4 updates
Eyebrow · 12px, caps
Update
Source Serif 4 · long-form reading
Peace without a signature
A year on from the Washington framework, one side calls peace established and the other calls it one step from done.
Articles use a serif at 19px with a 1.75 line height and a measure of about 66 characters, which keeps a 1,500-word piece comfortable on a phone.
Inputs are 16px on phones to stop iOS zooming on focus, 14px from the sm breakpoint. Tap targets are at least 44px high.
Peace talks, corridor politics and the contest for influence in the South Caucasus.
Updated Nov 7, 2026 · 19 updates · 1 article
Parliament ratified the Armenia-US framework agreement 63–32 on 28 October, creating a development company that is 74% US-owned for an initial 49 years. Only the ruling Civil Contract faction voted in favour.
Armenia and Azerbaijan spent the third quarter building the trade, transport and institutional scaffolding of a settlement neither has signed, while Russia shifted from coercion to bargaining over the railway.
6 min read
Cards are white on warm paper with a hairline border and a soft shadow that lifts on hover. A stretched link on the title makes the whole card clickable.
The call to action appears on every page: topic-specific where the page belongs to a topic, with a topic picker elsewhere. These are live; submit one to see the loading and success states. Use an address ending in@error.test to see the failure state.
Wide, with topic picker (home page and footer)
Topic-specific
Topic picker
Success (static)
Check your email
We sent a confirmation link to you. Click it to start getting updates on Armenia-Azerbaijan Relations.
You're only subscribed once you click it. If it doesn't arrive, check your spam folder.
Error (static)
radius-card · 16px
radius-control · 10px
shadow-card → shadow-lift
Spacing follows Tailwind's 4px scale. Sections use 40px (phone) to 56px (desktop) vertical padding; page gutters are 16px, 24px and 32px.