Style Guide · Design Reference

Classic Luxury Dark

The gallery-at-night member of the Lux family — the most dramatic of the set. Moody, old-world couture, editorial. Fictional brand: Century 21 Masters — Kenn Jan Ali (California).

Design style · Luxury / Classic Theme · Dark (warm espresso) Sharp / architectural radius

Folder: c:\Users\kennk.LAPTOP-A8011HPU\Desktop\Templates\Luxury Templates\Classic Luxury Dark

Color Palette

Proportion: warm espresso-black dominates; ivory only as light interlude bands; champagne / brass as hairline accents. Each swatch shows token, HEX, and rgb() equivalent.

Primary — Accent Golds

Champagne
--champagne
#C7A763
rgb(199, 167, 99)
Champagne Soft
--champagne-soft
#DCC495
rgb(220, 196, 149)
Brass (gold on ivory)
--brass
#997A3D
rgb(153, 122, 61)

Secondary — Surfaces (dark ground)

Obsidian (deepest)
--obsidian
#0B0A08
rgb(11, 10, 8)
Ink (primary ground)
--ink
#14120E
rgb(20, 18, 14)
Ink 2 (raised)
--ink-2
#1B1813
rgb(27, 24, 19)
Ink 3
--ink-3
#221E18
rgb(34, 30, 24)

Background — Ivory Interludes (light bands)

Ivory (warm paper)
--ivory
#F4F0E7
rgb(244, 240, 231)
Ivory 2
--ivory-2
#EBE5D8
rgb(235, 229, 216)

Text — Stone tones

Stone (muted on dark)
--stone
#A39B8C
rgb(163, 155, 140)
Stone Dim (faint on dark)
--stone-dim
#756D60
rgb(117, 109, 96)
Stone Dark (muted on ivory)
--stone-dark
#6A6256
rgb(106, 98, 86)

Hairlines

Line Gold
--line-gold
rgba(199,167,99,0.30)
Line Light
--line-light
rgba(244,240,231,0.12)
Line Dark (on ivory)
--line-dark
rgba(20,18,14,0.16)

Typography

Display: Cormorant Garamond (high-contrast serif; italics for emphasis). Body/utility: Jost (light geometric sans). Script accent: Allura (logo flourish only).

Aa
Cormorant Garamond · Display · --display
300400500italic
Aa
Jost · Body / UI · --sans
300400500600
luxury
Allura · Script accent (logo flourish)

Heading hierarchy (real fonts & sizes)

H1 · --fs-hero · clamp(3.2rem → 9.5rem)
Some homes are kept
H2 · --fs-display · clamp(2.6rem → 6rem)
A considered portfolio
H3 · --fs-h2 · clamp(2rem → 3.6rem)
Representation, not transaction
H4 · --fs-h3 · clamp(1.5rem → 2.2rem)
The private collection
H5 · 1.45rem · weight 400
Bespoke advisory
H6 · 1.15rem · weight 400
Coastal estates

Body, lede, small & labels

.lead · --fs-lead · stone

A small, deliberate portfolio of the world's most considered residences — represented quietly, for the few people they were always meant for.

body · --fs-body · weight 300 · line-height 1.7

Kenn Jan Ali built this practice on a single conviction: that the finest residences deserve a slower, more discreet kind of advocacy. Much of what is represented here never reaches a portal.

small · 0.78rem

DRE #02145789 · Century 21 Masters · California

.eyebrow · 0.72rem · tracking 0.36em uppercase
The Practice
.nav__link · 0.74rem · tracking 0.22em uppercase
About   Services   Contact

Spacing System

Layout tokens

--maxwContainer max-width · 1320px
--pad-xclamp(1.4rem, 5vw, 7rem)
--railArchitectural margin rail · 56px (0 ≤1024px)
--nav-hNav height · 88px (68px stuck)
.blockSection padding · clamp(5rem, 10vw, 9.5rem)
.block--tightclamp(3.5rem, 7vw, 6rem)

Easing curves

--easecubic-bezier(0.22, 1, 0.36, 1)
--ease-slowcubic-bezier(0.16, 1, 0.3, 1)

Border-radius scale — sharp / architectural (lines do the work)

Buttons · 0px
Images / media · 0px
DRE chip · 2px
Guide cards · 3px
Icon buttons · 50%

Per DESIGN.md: corners stay sharp. Radius appears only as small (2–3px) softening on chips/cards and as circles on icon buttons/social dots. Do not round corners or switch to a card grid.

Buttons

Sharp (0px) rectangles with a thin gold hairline border. Hover the samples — the champagne fill slides up from below (translateY(101%) → 0), text flips to ink, arrow nudges up-right. Active/focus: 1px champagne focus ring, 4px offset.

On dark ground

.btn primary (outline → champagne fill) · .btn--solid (champagne fill → recedes on hover) · .tlink text link with sliding underline.

On ivory interlude (ghost variant)

Form Elements

Minimal underline fields on transparent ground. Labels float up on focus / when filled (the two shown are pre-floated). Bottom border turns champagne on focus.

Send Enquiry

Note: the template does not use checkboxes/radios in its forms — fields are text, email, textarea, and a styled select.

UI Components

Brand logo lockup

Navigation bar (scrolled / semi-opaque blur state)

Fixed nav: transparent at top → rgba(11,10,8,0.72) with blur(14px) saturate(140%) on scroll. Links: uppercase stone, champagne underline wipes in on hover / current page.

Badges · eyebrow · location tag · map tag · DRE chip

Featured Collection Malibu, California Los Angeles · CA DRE #02145789

Cards — guide column, testimonial quote, and ivory feature card

01 · For Buyers

The Acquisition

A discreet, curated search — much of it never reaches a portal.

Kenn found the house before it was ever listed. That is the whole point.

— A private client, Montecito

Private Placements

Off-market representation for residences meant for the few.

Signature components (per DESIGN.md): fixed vertical architectural margin rail (C21 + rotated GPS, mix-blend-mode: difference); full-bleed hero with Cormorant headline up to ~9.5rem; listings as asymmetric alternating editorial rows (not cards) with Roman numerals; hairline dividers. Icons: Lucide (thin 1.4 stroke line icons).

Footer

Century 21 Masters

A considered portfolio of California's finest residences — and the people for whom they were always meant.

© 2026 Century 21 Masters — Kenn Jan AliDRE #02145789 · California

Visual Examples — Combined Showcase

Century 21 Masters — Kenn Jan Ali

Some homes are kept, not sold.

A small, deliberate portfolio of the world's most considered residences — represented quietly, for the few they were meant for.

Private Advisory

Begin a conversation

Send

Panel shown on the obsidian ground (#0B0A08) — the darkest surface, as used by the footer and mobile menu overlay.