The Court · Template Library

A template for
every page

The design is final. This library turns it into a system: one shared stylesheet, one behavior script, and ten layouts — the homepage plus nine page templates — covering the site and the tools to come. Each template demonstrates one or two signature interactions.

The system itself

Two files power every template. Import them, use the classes, and any future page or tool matches the brand from its first line. Tokens also published at heavenlydemon.consulting/theme/hdc.css for third-party apps (search already uses them).

court.css — tokens · type · components
court.js — reveal · scribe · tabs · progress
01 · flagship

The Homepage

The finalized homepage, live at the apex — hero, about, services, selected work, process.

signature: typed subline + rotating rings
02 · engagement

Case Study

One engagement told properly: problem, work, result, artifact — with metrics living inside the prose.

signature: reading-progress hairline + sticky contents
03 · letters

Essay / Letter

Long-form writing — opinions, announcements, technical notes worth reading twice.

signature: drop cap, marginalia, footnotes + typed signature
04 · the rites

Service Detail

One rite expanded: deliverables as a ledger table, spans and prices stated plainly, questions answered.

signature: giant rite numeral + gold-star FAQ folds
05 · about

The Council

Who does the work. The two instincts as a split panel, members with monogram sigils instead of stock portraits.

signature: heaven/demon split panel + the wax seal
06 · contact

Contact

What happens after you write, and a form that respects your time.

signature: typed reply promise + gold focus states
07 · records

Documentation

Sticky sidebar, anchor pins, callouts, code blocks. For product and internal manuals.

signature: § anchor pins + standing-rule callouts
08 · app shell

The Console

Dashboard chrome for future tools — dark rail, stat cards, ledger tables, review queues.

signature: midnight rail on daylight deck
09 · error

404

The 404, wired into nginx for the apex and this library both. Dead ends stay on-brand without being theatrical.

signature: typed subline + italic numerals
10 · legal

Legal

Terms and policies as numbered clauses — plain words, with the brand confined to the frame.

signature: § clause numerals + voice rules built in