lp-visual-theming

name	lp-visual-theming
description	Map the approved wireframe to existing components, design tokens, and responsive behavior rules so the landing page feels native to the project. Use when the page structure is approved but the visual implementation — component selection, tokens, breakpoints — hasn't been decided.
metadata	{"author":"github.com/niksmac"}
compatibility	Designed for OpenCode

lp-visual-theming

Use the Project Audit and Wireframe to decide how to implement each section visually.

For each section

Provide:

• Components

  • Existing components to use (with paths)
  • New components needed (name + suggested path)
  • Important props or data they require

• Theme tokens

  • Background surface tokens
  • Text color tokens
  • Button / CTA variants
  • Spacing and radius tokens
  • Shadow/elevation level

• Responsive behavior

  • How the layout changes at key breakpoints
  • Any mobile‑specific adjustments

• Hierarchy notes

  • What should visually dominate (e.g., primary CTA, headline)
  • How social proof and objections are surfaced

Output

## Component & Theme Plan

### [Section name]

- components:
  - …
- theme:
  - …
- responsive:
  - …
- hierarchy:
  - …