Phase 2: Marketing Site - Context

Gathered: 2026-03-19 Status: Ready for planning

## Phase Boundary

A single public homepage for Teressa Copeland Homes — professional real estate marketing presence for a solo Utah agent. Visitors land here to learn about Teressa, read client testimonials, see a listings placeholder, and submit a contact inquiry. The agent portal (/agent/*) is completely separate and not linked from the public site.

## Implementation Decisions

Hero section

Layout: Split panel — photo on the left, text content on the right (mirrors the login page feel)
Tone: Professional and polished — credentials, experience, trust-building (not casual)
CTA button: "Get in Touch" — smooth-scrolls to the contact form section
Copy: Claude writes the headline, subheading, and bio (professional Utah real estate agent framing). Wrap text in clearly commented placeholders so Teressa can swap in her own words before launch

Testimonials

Display: Auto-scrolling carousel — rotates every 5 seconds, pauses on hover
Navigation: Arrow controls and dot indicators so visitors can also advance manually
Content: Claude writes 4–5 sample testimonials with realistic Utah buyer/seller scenarios and placeholder full names (e.g., "Sarah Mitchell"). Clearly commented so real ones can be swapped in
Attribution: Quote + full name only (no city, no photo)

Contact form

Delivery: Email notification to Teressa via Nodemailer + SMTP (no database storage in this phase)
SMTP credentials: CONTACT_EMAIL_USER and CONTACT_EMAIL_PASS environment variables — never hardcoded
Success state: Inline — the form is replaced by a thank-you message ("Thanks! Teressa will be in touch soon.") when submission succeeds
Spam protection: Honeypot hidden field — bots fill it in, humans never see it; submissions with the honeypot filled are silently discarded
Validation: Required fields are name, email, phone, and message — validated server-side in the form action

Page structure

Section order (top to bottom): Sticky nav → Hero → Testimonials → Listings placeholder → Contact form → Footer
Sticky nav content: Teressa's name as wordmark logo (left), anchor links on the right — Home, About, Listings, Contact — smooth-scroll to each section
Listings placeholder: A tasteful "Listings Coming Soon" section with a brief description — no real data, just visual presence
Agent portal: No link anywhere on the public site — Teressa navigates to /agent/login directly via URL
Footer: Name + Utah real estate license number (14196185-SA00 — NOTE: verify the last two characters, may be letters O or zeros) + copyright year + repeated nav links

Placeholder assets

Hero photo: reuse public/red.jpg from Phase 1 (already in the project)
Listings placeholder: use a tasteful stock-style image or a solid brand-colored background with an icon — no real property photos needed
Background section breaks: subtle texture or light gradient using brand cream/navy — no photography required for non-hero sections
Icons: use Lucide React (already likely available) for any UI icons (phone, email, map pin for contact section)

Claude's Discretion

Exact hero photo crop/focal point and overlay gradient (if any)
Mobile nav pattern (hamburger menu vs collapsed links)
Exact card styling, shadow depth, border radius
Animation timing beyond the 5-second carousel interval
Exact color weights within the brand palette already established (navy #1B2B4B, gold #C9A84C, cream #FAF9F7)

## Specific Ideas

The split-panel hero should feel like a natural continuation of the login page design — same brand colors, same photo of Teressa
License number in footer: 14196185-SA00 — user was unsure if the last two chars are 00 (zeros) or OO (letters). Add a code comment flagging this for verification before launch
The testimonials carousel should feel smooth and unobtrusive — not flashy

## Deferred Ideas

None — discussion stayed within phase scope

Phase: 02-marketing-site Context gathered: 2026-03-19

4.1 KiB Raw Blame History Unescape Escape