Arcora
Design System

Tokens and components extracted from the Arcline Estate reference and used by the Casa Lumen landing page. Light uppercase Montserrat for display, Inter for reading, a cool paper ground, near-black ink and one steel-blue accent. Media is rounded; controls are pills; data sits on hairlines.

Colour

Ground--c-ground #f7f7f9
Ground 2--c-ground-2 #eeeef2
Ground 3--c-ground-3 #e3e4ea
Ink--c-ink #0d0d0f
Ink 2--c-ink-2 #4a4b52
Ink 3--c-ink-3 #8a8b93
Accent--c-accent #6f8fb4
Accent ink--c-accent-ink #4d6c91
Night--c-night #0f1216

Proportions: ground ~80%, ink ~15%, accent only on statement highlight words and focus. Night is used for the closing field (viewing + footer).

Type

Mega · Montserrat 400
--t-mega
Casa Lumen
Statement · Montserrat 400
--t-statement

One long room that opens to the garden.

Stat · Montserrat 400
--t-stat
1,240
Label · Montserrat 400
--t-label
About us
Body · Inter 400
16 / 1.55

Designed by a Nosara studio and finished in spring 2026, the house is a single storey of lime plaster, teak and travertine.

Small · Inter 400
--t-small

Images are architectural visualisations of the finished house.

Display is always uppercase, tracking −0.01 to −0.045em, leading 0.8–1.04. Statements open with a 26% first-line indent, as in the reference.

Space & shape

--s-1 · 4
--s-2 · 8
--s-4 · 16
--s-5 · 24
--s-6 · 32
--s-8 · 64
--s-9 · 96
--section-gap · 96–200
--r-media 18
--r-media-sm 12
--r-pill

12-column grid, outer margin = 2 × --gutter (16–24px). Labels take columns 1–4, statements columns 6–12.

Controls

Explore the house Book a viewing
Residence Spaces Location
Residence Spaces
312 m²under one roof, four en-suite bedrooms
Book a private viewing

Glass cards and outlined pills live only on top of photography. On paper, pills are outlined in --c-line-strong and fill with ink when active.

Data

312m² interior
14metre pool
6min to the beach
Area
312 m²
Bedrooms
4
Price
$1,850,000 USD
1/6

Hairlines (--c-line / --c-line-strong) are reserved for data: stat dividers, spec rows, counters and form fields.

Layout

We don't just list houses. We show how they feel to live in — slowly, room by room.

Section pattern from the reference: uppercase label left, indented uppercase statement right, accent words in steel blue, body copy under a hairline.

Motion

Ease outcubic-bezier(0.16, 1, 0.3, 1)
Durations180 · 420 · 900 ms, stagger 55–80 ms
Text

Word mask-rise for headings, per-letter rise for the wordmark, scroll-scrubbed word brightening for statements.

Media

Canvas frame-scroll (386 frames), clip-path reveal, slow parallax, scroll zoom-out. All travel drops under prefers-reduced-motion.