Monolith

Build a creative agency website using the "Monolith" theme — Neo-brutalist agency site — huge type, hard edges, one acid accent.

## Art direction
Anti-decorative and structural. Everything sits on a visible 12-column grid with hard 2px black rules between sections — no shadows, no gradients, no rounded corners anywhere. Headlines are set at absurd sizes and are permitted to bleed past the right edge. The orange accent is rationed: links, the active nav item, and one word per headline. Emptiness is the composition, not a gap to fill.

## Colour palette (use these exact values)
- Background: #F4F1EA
- Surface / cards: #FFFFFF
- Primary text: #0B0B0B
- Secondary text: #5C5A54
- Accent (buttons, links, active state): #FF4D00
- Text on accent: #FFFFFF
- Borders / dividers: #0B0B0B
Use exactly one accent. Everything that needs emphasis earns it through weight, scale or space instead of a second colour.

## Typography
- Headings: "Archivo Black", "Helvetica Neue", Arial, sans-serif
- Body: "Inter", "Helvetica Neue", Arial, sans-serif
- The headline is the layout: 120px+ on desktop, uppercase, -0.04em tracking, wrapping to three or four lines and allowed to run to the page edge. Body stays a modest 16/1.6 so the contrast in scale is violent.

## Page structure
1. Header rule: wordmark left, four uppercase nav links right, all on one 2px-ruled line.
2. Hero: a four-line uppercase statement of what the studio does, one orange word inside it, and a small paragraph anchored bottom-left under a rule.
3. Marquee strip of services scrolling horizontally between two rules.
4. Selected work: a two-column list, not cards — each row is client name, discipline, year, and a hairline rule, with the row inverting to black-on-white on hover.
5. One full-bleed case study block: an oversized number, a project title, and three stat pairs across the bottom.
6. Capabilities: a four-column list of services in small uppercase type, dense and unglamorous.
7. Manifesto block: a single centred paragraph at 32px, wide margins on both sides.
8. Contact: an enormous mailto link set at headline scale, and a plain footer of address, socials and the year.

## Components and detailing
No radii. Buttons are black boxes with white uppercase labels that invert on hover; secondary actions are underlined text with a 2px underline offset 6px. Cards are white boxes with a 2px black border and no shadow. Images sit in hard-edged frames, cropped square or 4:5 only, with a 100% grayscale filter that clears on hover.

## Motion
Nothing eases — transitions are 0ms or a hard 80ms step. The marquee scrolls linearly and never pauses. Hover states swap colour instantly. The only exception is the work list, where the row's black fill wipes in from the left over 120ms.

## Copy and imagery
Blunt, first-person plural, and short. Say what you make and who for; skip the adjectives. Every project needs a real client name, a discipline and a year — the specificity is the credibility. Imagery is sparse and always cropped hard.

## Non-negotiables
- Responsive from 360px through desktop — no horizontal scrolling at any width.
- Every text/background pair clears WCAG AA (4.5:1 for body, 3:1 for large text); adjust a tint rather than shipping a failing pair.
- Fully keyboard operable, with a visible focus ring drawn in the accent colour.
- Honour `prefers-reduced-motion` — swap every transition for an instant state change.
- Write real copy in the voice described above; no lorem ipsum and no TODO placeholders.
- Use system or self-hosted fonts and CSS/SVG-drawn graphics — do not depend on a remote image or icon service.

Build the whole page end to end and show me the result running — not a description of it.