# Landing Page Spec: ClockOut Sleep Supplement
**For:** Gerald (Development)  
**Date:** 2026-04-06  
**Status:** APPROVED - Ready to build

---

## Brand Identity (LOCKED)

**Brand Name:** ClockOut  
**Tagline:** "Fall Asleep Fast After Night Shifts (Even at 7am)"  
**Target Audience:** Shift workers (nurses, security, FIFO, hospitality)

---

## Design System

### Typography
- **Headings:** Manrope (Bold, 600-700 weight)
- **Body:** Inter (Regular, 400-500 weight)
- Both via Google Fonts (free CDN)

### Color Palette: Clinical Trust
- **Primary:** Steel Grey `#4A5568` (medical, reliable, no-nonsense)
- **Secondary:** Clinical Teal `#14B8A6` (medical trust, slightly modern)
- **Accent:** Bright Orange `#F97316` (urgency, action, wake-up call)
- **Background:** Pure White `#FFFFFF` (clean, pharmacy-grade)
- **Text Dark:** `#1F2937`
- **Text Light:** `#FFFFFF`

### Psychology
- Grey = clinical credibility without coldness
- Teal = medical trust (hospital/healthcare feel)
- Orange = importance/urgency (this matters for your health)
- Overall: "This is serious. This works. Trust the science."

---

## Landing Page Structure

### Hero Section
- **Background:** Steel Grey (`#4A5568`)
- **Headline:** "Fall Asleep Fast After Night Shifts (Even at 7am)" (white text, Manrope Bold)
- **Subheadline:** Pain statement [Louise to provide]
- **CTA Button:** "Get Your Sleep Back" (Bright Orange background, white text)

### Body Sections
- **Background:** Pure White
- **Headings:** Manrope Bold, Steel Grey
- **Accents:** Clinical Teal for subheadings/highlights
- **Text:** Dark grey (`#1F2937`)

### Key Sections to Include
1. **Hero** — Pain + promise
2. **Problem** — What keeps shift workers awake (research-backed)
3. **Solution** — What ClockOut does (product overview)
4. **Benefits** — 3-4 key outcomes
5. **Social Proof** — Testimonials (if available)
6. **CTA** — Email capture for validation test

### Platform
- **Tool:** Carrd.co (simple, fast, email-capture ready)
- **Alternative:** Custom build if needed

---

## Next Steps

1. **Louise:** Draft landing page copy (hero, pain, CTA) — separate deliverable
2. **Gerald:** Build landing page with approved brand identity
3. **Louise:** Run $50 Meta ad test to validate demand
4. **Success threshold:** CTR >3% AND cost per email <$10 → GREEN LIGHT (build store)

---

## Contact
- **Approved by:** Shay
- **Built by:** Gerald
- **Copy by:** Louise
- **Delivery deadline:** Tuesday morning (2026-04-07)

---

END OF SPEC
