## Overview
Mach1 Capital v1 is the editorial institutional direction — the closest read on Walker & Dunlop / Eastdil Secured / JLL Capital Markets. Cream paper, deep navy ink, warm gold accent. Fraunces light serif display over Calibre 2 body. The page behaves like a capital markets brochure: sticky white nav over a cream hero, oversized serif headline paired with a capital-range card, a dark stats band, four capital products, six asset classes, recent transaction tombstones, a four-step process, a lender network breakdown, a deal-intake form, and a three-office footer.
## Colors
- `--background` — `#F4EEE2` cream paper (the entire surface is this color unless explicitly inverted)
- `--foreground` — `#0A1424` deep ink (type, rules, every default border)
- `--primary` — `#0A1424` (reused as foreground — CTAs and stat-band ground are primary-on-cream)
- `--secondary` — `#0A1424` (same ink — the semantic distinction is intentional for template consistency, not a second hue)
- `--accent` — `#B08A3E` warm gold (sparingly — eyebrow rules, accent marks, a single CTA underline, stats band trim)
- `--muted` — `#E8E0CD` stone (alt backgrounds for cards, hover states)
- `--muted-foreground` — `#5C6273` slate (secondary copy, captions, transaction metadata)
- `--card` — `#FFFFFF` (capital-range card, transaction tombstones, form card — the only pure-white surfaces)
- `--border` — `#D4CBB6` (hairline rules between sections and around cards)
## Typography
- **Heading** — `fraunces` at weight 300 ("Light"). Display is `clamp(48px, 7vw, 112px)` with `-0.02em` tracking, 1.02 line height. Fraunces Light is load-bearing — it's what makes the template feel institutional rather than editorial.
- **Body** — `calibre2`. 16px / 1.55 for paragraph copy, 14px / 1.5 for transaction captions, 12-13px uppercase tracked at ~0.14em for eyebrow labels.
- Eyebrow labels and CTAs are `calibre2` in uppercase with ~0.14em letter-spacing — never use Fraunces for those.
## Sections
1. **Navbar** — cream ground, hairline bottom border, logo left, centered nav links, a single ink-on-cream CTA pill right.
2. **Hero** — oversized Fraunces display headline left, white capital-range card right showing the "$1M – $100M" placement range as a pair of stacked serif numerals with thin rules between them.
3. **CapitalStats** — full-bleed dark band (ink ground, cream type) with four stat tiles and gold trim rules. The only inverted section above the fold.
4. **Services** — four capital products (acquisition, bridge/rehab, refi/cash-out refi, construction) as stacked rows with a hairline rule between them, each row with a serif title + two-line description + a right-aligned arrow.
5. **AssetClasses** — six asset classes in a 3×2 grid of card tiles with eyebrow labels and cream-stone backgrounds.
6. **RecentDeals** — transaction tombstones as a 3-up grid. Each tombstone is a white card with a serif deal amount, a body description, and a trio of meta rows (type, location, date) separated by hairlines.
7. **Process** — four-step approach laid out as numbered rows (01 — 04) with eyebrow + serif step title + body paragraph.
8. **LenderNetwork** — two-column breakdown of lender types (institutional, private capital, debt funds, banks) as stacked bullet lists with a supporting paragraph.
9. **ContactCta** — deal intake form inside a white card, two-column fields, a primary CTA pill with gold accent underline on hover.
10. **Footer** — three-office directory (city + street + phone), a small newsletter signup, a thin legal line at the bottom.
## Components
All eleven sections are hand-rolled in `_components/`. Nothing pulls from the block library — v1 is intentionally hand-composed so the editorial rhythm (hairline rules, numeric tombstones, oversized Fraunces headlines) can be hit pixel-accurate.
## Do's and don'ts
- **Do** keep Fraunces at weight 300. Bumping to 400 makes the template read as modern-serif instead of editorial institutional.
- **Do** reserve the gold accent for accent rules, single underlines, and the stats band trim. It's a seasoning, not a surface color.
- **Do** keep the transaction tombstones as pure-white cards. They're the only pure-white surface on the page and that's how the institutional credibility read works.
- **Do** use hairline rules (`--border` at 1px) between every stacked row. Heavy borders break the editorial feel.
- **Don't** introduce a second heading weight. Fraunces Light is the entire display system.
- **Don't** swap the cream ground for white. White is reserved for cards only.
- **Don't** add rounded card corners above 8px. Subtle rounding only — this template should feel like a printed report, not a modern SaaS dashboard.
- **Don't** use any color outside the nine tokens. No branded blue, no CTA gradients, no highlight yellows.