# BRIEF: Brandwatch Deliverable Card Mockups

## Goal
5 consistent "What the system produces" card images for the Brandwatch landing page.

## Visual Style (Laptop Mockup)
- Low-light laptop mockup (Mockup.Maison "Low Light Collection" reference)
- Tight crop — laptop fills 70-80% of frame
- Colorful subtle gradient on wall behind (not pure black)
- Screen as primary light source, glow on keyboard/desk
- 16:9 aspect ratio, 1920x1080
- Photorealistic product photography feel

## Screen Content Style (CE Styleguide)
- White background, Larken headings, Inter body, JetBrains Mono labels
- `#cc0000` accent, `#1a1a1a` text, `#eee` borders
- No gradients on UI, no bold (700), no shadows, no rounded corners >4px
- Max 1100px container

## Localization Screen Layout (approved v5)
- 2x2 grid with compact header
- Each quadrant: tall image (~60% height) with dark gradient overlay
- Flag emoji top-left of each image
- Large white Larken headline (36px) over the image — the localized campaign text is the hero
- Below image: caption, hashtags (red JetBrains Mono), channel tags, status + asset count
- Markets: 🇩🇪 DACH (Live), 🇬🇧 UK (Review), 🇫🇷 France (Draft), 🇧🇷 Brazil (Draft)
- Same Dove mother-daughter creative across all, localized headlines/copy/hashtags

## Card Status
1. **Strategy Brief** — ✅ iPad mockup (Assaf's image) — on staging
2. **Campaign Architecture** — ❌ Needs regen in consistent style
3. **Production-Ready Assets** — ✅ Low-light laptop v4 — on main + staging
4. **Multi-Market Localization** — ✅ Desktop monitor mockup — on staging
5. **Execution Playbook** — ✅ iMac mockup placed — screen content needs design (card 6)

## Pipeline
1. Build screen content as HTML (CE styleguide)
2. Screenshot at 1440x900 with Playwright
3. Feed screen + style reference into Gemini (gemini-2.5-flash-image) to generate low-light laptop mockup
4. Resize to 1920x1080 (16:9)
5. Push to staging branch → staging.curiousendeavor.com
6. Assaf approves → merge to main

## Working Files
- `work/pitches/brandwatch/visuals/` — all source files
- `localization-screen-v5.html` — approved localization screen
- `production-lowlight-v4.png` — approved production assets laptop (style reference)
- `dove-hero.png` — Dove mother-daughter source image

## Deployment
- **Staging:** `staging` branch → staging.curiousendeavor.com/brandwatch-v2/
- **Production:** merge staging → main → auto-deploy via Vercel to curiousendeavor.com