Lumen

Why it looks this way.

Typography

Fraunces at semibold sets the headlines. It is a soft, slightly wonky serif that looks editorial rather than churchy, and it holds up at the very large size used in the hero. Inter handles body copy, labels and the nav, which keeps small text sharp on dark photography.

• Fraunces headlines
• Inter body text

Color

The brand is a burnt amber (#A65709) on a warm off-white (#F6F2EA) page, with sage green (#3F6B58) as a quiet second colour. The site is set to open in its dark theme, near black (#0E0E0C) with a brighter amber (#E8A33D). Amber reads like stage light, which suits a church that centres its identity on live music.

• Page #F6F2EA
• Cards #FFFFFF
• Text #14130F
• Brand #A65709
• Accent #3F6B58

Layout

The navigation is a white pill floating above the hero, with the Give button inside it as an amber pill. Content below is organised in tinted cards and a four-part strip for time, place, messages and first-time visitors. Everything stays in a single column of sections, so the page is quick to scan on a phone.

Pages: Home, About, Visit, Services, Messages, Events, Give, Contact

Hero

A full-bleed photo of worshippers with raised hands fills the first screen under a dark gradient. The headline 'Bring your whole self to worship.' runs across two lines at roughly 90 pixels. The eyebrow above it gives the neighbourhood and the Sunday time, which answers the first two questions a visitor has.

Calls to action

'Join us Sunday' is a solid amber pill and 'Live stream' is an outlined pill beside it, so the in-person visit is the clear first choice. The event chip under the buttons counts down to the next Night of Worship. Give stays visible in the top bar throughout.

Photography

The pictures are dark, grainy concert-style shots of hands and stage light. They tell a visitor what the room feels like. Faces are rarely shown, which protects privacy but means a real build should add a few clear portraits of staff so visitors know who will greet them.

Accessibility

Text is white or warm cream on a heavily darkened photo, and the dark theme's body pair measures about 17 to 1. White text on the amber button is about 5.3 to 1, which passes for normal-size text. The theme toggle in the pill nav lets visitors switch to a light page.