THE APPROACH — template brief

lightbrutalist

Live preview · scroll inside

Loading THE APPROACH — template brief

The complete build · watermarked until purchase

The concept

*The approach* is the actual industry term for contacting a candidate who is not looking — and it is also what you call the walk up to a building. The clip is both: a figure ascending board-formed concrete into hard light, face never shown. That anonymity is the brand. This is a firm whose entire product is discretion: nobody learns they were considered, no role is ever posted, three searches at a time and occasionally a fourth. Because the subject is confidentiality, the site's signature move is redaction — black bars sitting over the copy that slide away as each paragraph arrives, like a file being cleared for reading. And because a search is lateral movement rather than a ladder, the body is a horizontal gallery that travels sideways as you scroll down.

Palette: paper
#DDD8CE
slab
#C7C0B3
tint
#EAE6DE
ink
#14161B
ash
#7C756C
navy
#1B3A5C
Typeface: Libre Caslon Display 400 — an old-world transitional with real establishment authority. At 218px it looks like a masthead on something you would not be sent unless you were meant to have it. Hanken Grotesk 300/400/500 for body: quiet, neutral, slightly narrow, and it disappears behind the Caslon rather than competing with it.
Cursor — Redaction: - Redaction. background-image is a solid --ink gradient at 100% 100%; on entry it animates to 0% 100% while color transitions from transparent to inherit on a delay. One element, no extra markup, and it wipes rather than fades. - Bracket cursor. Four corner key-lines that close inward on hover — framing a candidate. - Light-shaft canvas. Nine skewed parallelograms with a soft gradient across their width, drifting sideways in three depth bands, each breathing on its own sine. It reproduces the raking sun in the clip and continues behind the entire document. Not petals, embers, dust or caustics — and the only atmosphere in the library built from *light* rather than particles. - Per-character heading — staggered outward-in entrance, idle sine, scroll offset from centre.
Layout

516 words · locked

█████ █ ███████████ ████ ███ **███ ████████**, █ ████████ █████████ ██████ ████ ████ ███ █████ ██████████ █ ████. ████: ████, █████, ████ — ████████ ██ ████████, ███ █████. ███████: `███████` ████████ ██████, `███████` █████, `███████` ████████ ████, `███████` ██████████ ████, `███████` ███, ███ ███████ ███ ██████ `███████` ████. ██ ██████ ██████. ████: █████ ██████ ███████ ███ ███ ███████, ██████ ███████ ███/███/███ ███ ████.
 **████** — █ ██████ ██████ █████. ██████████ ███████ ████████ "███ ████████" █████ ████ █████ ███ ████ ██████, █████ ███████ ████ `█████████: █████(█ ██% █ █)` ██ █ ███████ █████ ██ █ ██████ █████████ █ ████████ █████████ ████ ███████ ███ ████ ██████ ███ ████████ ███ ██████ ██████████. ███████ ███ ██████ ██ █████, ███ ███ ████ ██ ███ ████ █████ ███ ███ ███ ██ ███ █████. ███ ███████ ██ ██████, ██ ████ ██ ████ █ ██████ `██████████` ██████ ████ █ ██████ █████, ███ ████ ███ ████ ████████ ████ ██ ███ ██████ ███ █████ ████ — █████ ██ █████. ███ █████ █████ ████████████ ██ ███ ███ █████; ██████ █████ ███████ ███ ████████ ███ ███████ ██████ █ █████████ ████████ █████. █████ ███ ████████ ████ ████████████ █████, ██████████ ███ ████ █████ ██ ███ ███ ███████████ ████; ████ █████ ██ ████ `███████████(█,██%,-█████) ███████(-█████)` ████ ████, █████████ ███████ ████ ██████, ████ ███████ ██ ████ ████ ██ █ ███ █ ████ █ ████████████ ███████ ████. █████ █████ ██ ██████████ ██ ████ ██████ ██████, ██████████ ██████████. **██ ███████ ██ ███ ████.**
 **█████████ — ███ █████████ ████ ██████.** ███████ ███████ ██ ███ ████ ████ ███ ███████ ██ █ ████ █████ `████████████` ██ █ █████ ███ ████████ █████ `███% ███%` ████ ███ ████ ██████ ███ ██ `███████████`. ████ ███ ███████ ███████ ████ ████, ███████ `████████████` ██ `█% ███%` ████ █.██ ███ ██████████ `█████` ████ ██ ███████ ██ █ ███████████ █████, ██ ███ ███ █████ ███ ███ █████ ████████████ ███ ███ ████ ███████ ██████ ██. ███████ ███ ██ █████ ██ ████ ███ ███████.
 **████ — █ ██████████ ███████.** █ ██████ ███████ ████ █ `████████:██████` ██████ ███ ██████████ █ ████ ████ ██ ███ █████. █████████ ███ ████ ██ █ ██ `-████████ × (████.███████████ - ██████████)` ██ ████████ ██████ ██████ ████████ ██████, ████ ███ ████████ ██████ ███ ██████████. ████ ████: █ ████ ███ ██████ ██ █████ ████, █ ████ █████ ██ ███████ ████, ███ ████ ██ ████ ███ ███████ █████ ███ ██████, ███ █ █████ ██████ █████ ████████ ██ ███ █ ████████ ██████████. ███ █ █████ █████ ██ ███ ███ ████ ███████ "████████ ████████ · ███████████ ██████ ███████" ███ █ ████████ ████████ ███ █████ ███ ██████. ████ █ ███████ █████████ ███████ ██ ███ ████████ ████ ████ ████ █████████ ███ █ █████████ █████, ███ █ ██████ ████ █ ████████ ███████ ████████. ██ █████ █████████, ██ ████ █████, ██ ██████.
 ██████ ███ ██████ ████, █ ██████ ██ ████ ██████ █████ ██████ — ████████████ ████ █ ████ █████ ████████ ██████ █████ █████, ████████ ████████ ██ █████ █████ █████ ██ █████████ ████████ █████, ████ █████████ ██ ███ ███ ████. ██████ ██████: ████ ██████ ████████ ████ █████ ██████ ██ █████. ██████████ `█*█*(███*█)` ██ █████ ████. ████ `████████████` ████████ ████ ███████ ███ ██████████ ████ ████ █ ██████ ███████ ████, ███ █ `███████:██████` ████████.

Undeveloped