# PeakLine Roofing — reference demo

Canonical example for the demos playbook (`../RULE.md`).

## Taste Design Reads

| Ver | Read | Dials |
|-----|------|-------|
| **v1** | Trust-first contractor landing for homeowners under storm pressure | `5 / 4 / 5` |
| **v2** | Premium home-service brand for design-conscious homeowners | `7 / 6 / 3` |
| **v3** | Editorial brochure for property managers / stakeholders | `8 / 5 / 4` |

## Page patterns (copy structure, not copy)

| Page | V1 | V2 | V3 |
|------|----|----|-----|
| Home | Split hero + band + cards | Full-bleed image hero | Asymmetric editorial hero |
| About | Split + checklist + band | Showcase image + team | Stack-list + pull quote |
| Services | `grid-3` cards | Feature rail + showcase | `ed-grid` + stack-list |
| Projects | Before/after + band | Showcase + proof strip | Case stack + ba-grid |
| Contact | Form + urgency aside | Split consult (media + form) | Scope intake grid |

## Assets notes

- Hero images: `assets/images/hero-v{N}.jpg`
- In CSS, use `url("../images/…")` (relative to `assets/css/`)
- V2 overlay header: `top: var(--demo-bar-h)`; contact page forces sticky solid header via `body:has(.consult)`

## Palettes

01 Storm Copper · 02 Night Slate · 03 Forest · 04 Brick · 05 Coastal
