Main-to-dev marketing redesign implementation plan

For agentic workers: use the workspace execution/parallel-agent skills when implementing this plan. This audit does not authorize this agent to implement it. Work through the manifest task-by-task; preserve Treehouse isolation and current dev architecture.

Goal: Reproduce the owners' final main public design and required behavior on current dev while preserving the MVP.

Architecture: Existing app/(marketing) routes remain routing/metadata entry points. Presentation lives in surfaces/marketing; guide records remain feature-owned; new acquisition content/progress/action belongs in features/creator-acquisition. Root/product/invoice/report architecture remains dev-owned.

Tech stack: Current dev Next 16.3.3, React 19, Tailwind 4, existing Framer Motion/Lucide/React Query; add Lenis selectively. Do not downgrade to main's lockfile.

Spec: 03, 04, 06, manifest.

Binding final review: 11, especially sections1–5 (visual/routing boundaries),6 (copy),8 (intake defaults),13 (SEO),15 (compile/link checkpoints). Read it before execution. Two visual systems are intentional; no product variant="marketing" expansion. The only root edit contemplated is stable JSON-LD entity IDs; no global font/theme/provider replacement. Every phase must compile independently; phase commits are not authorization to deploy partial work.

Global constraints

• No whole-branch merge/cherry-pick, no parallel (site) group, no primary checkout edits.
• Backend/frontend base and PR target remain dev. No merge/deploy/main push without separate authorization.
• Whop-only funding/payouts; invoice→receipt→allocation→exactly-once finance bridge; versioned CPM/RPM; no payment for pending-at-exhaustion or paused views. Public copy cannot redefine those rules.
• Preserve current auth/returnTo, RBAC, Whop chat, sandbox/live settings, private campaign/group access, submission review, reports, invoices, analytics and shared overlays.
• Provider writes mocked in tests. No real email, Discord application, booking, payout or production data change.
• Every PORT/ADAPT item has source evidence, exact target paths, dependencies, phase and acceptance in the manifest. Consult that record for each listed ID; the phase table below is the execution order, not a substitute for it.

Preflight and baseline

1. Read this package and current root/repository policy. Inspect active leases, PRs/issues and dirty files; claim only a bounded implementation task.
2. From workspace root, acquire a new task-specific frontend lease. From its returned directory verify top-level/clean status, fetch origin, and compare the new origin/dev to audit pin 7c3f0079.... Review overlapping new dev changes before editing; do not reset the primary or another lease.
3. Verify pinned main object ad33ecb... exists. Read source with git show <sha>:<path> or a separate investigation lease; never switch the implementation branch to main to copy a whole tree.
4. Run the existing baseline below. Record failures already present; do not use redesign work to fix unrelated product issues.

git rev-parse --show-toplevel
git status --short
git fetch origin
git diff --name-status 7c3f0079f7a4847ff698c508470757ca81e64b36 origin/dev
npm ci
npm test
npx tsc --noEmit --incremental false
npm run lint
npm run build

Phase A — data, assets, scoped primitives and metadata foundations

Items M01, M02, M15, M17 (primitive exports), M30 (helper only), M36–M40, M46–M48. Sources: e192ec0/ad33ecb assets/content/SEO and retained September6 case changes. Exact paths are in asset ledger/manifest. M17 must precede C's CampaignArt; it is not first introduced in D.

• [ ] Create surfaces/marketing/content.ts and case-study cases.ts; reconcile retained fields with existing campaignData.ts. Keep seven case slugs and the final listing order; normalize duplicated summary/full-case metrics intentionally. Create features/creator-acquisition/content.ts now so later curtain/header imports have a stable source. This is the data portion of M25/M26, not the acquisition behavior yet.
• [ ] Use existing features/creator-guides/guideData.ts and verified Next contact/Roblox handlers. Record unchanged blob/superset contract checks; do not add duplicate stores/routes.
• [ ] Preserve RobloxLiveStat.tsx default export and add marketing LiveStickers, LiveMetricTiles, RobloxThumb exports there for later CampaignArt/case imports. Current Roblox reads use effect-based fetch, not TanStack Query; preserve API cache/error behavior without a query refactor. Update all new imports to this dev-owned module.
• [ ] Bring required public assets at their existing URL paths, checking the asset hashes first. Reuse inherited files; do not copy duplicate MP4 names. Copy updated logo variants only after comparing current dev versions. Keep provenance record with personal proof/image rights uncertainties.
• [ ] Add Lenis using the dev package graph and regenerate only required lock entries. Preserve Next/query/Whop/test packages and postcss override.
• [ ] Create local Toybox ui/util/media primitives and stylesheet files. Rename marketing cr-* classes/keyframes to cc-cr-*, scope every selector under .cc-root, retain layers/final overrides. Keep util.ts server-safe. Rubik/Mono only in marketing; defer global Geist fix out of scope. Initial Button uses native Next Link, not an unresolved B-phase StartLink import.
• [ ] Add surfaces/marketing/seo.ts/JsonLd with server MARKETING_INDEXABLE default false. Preserve root defaults/services/force-dynamic. Do not add a broad catch-all in any phase; F adds only group not-found.

Acceptance: assets resolve; module imports/typecheck pass; marketing wrapper receives exact palette/font metrics; a product .cr-card computed-style fixture does not change. Main share-image dimensions match metadata. Existing contact and Roblox contracts remain supported. Proposed tests: tests/marketing-scope.test.tsx, tests/marketing-content.test.tsx with exact seven/five slug sets and published metric comparisons. Prefer focused tests of these cross-boundary risks over snapshotting every CSS declaration.

Phase B — public shell, state and motion

Items M03–M06, M29, M32. Targets: existing (marketing)/layout, Navbar/Footer/AudienceTheme; new marketing providers/effects; existing shared CookieConsent.

• [ ] Extend marketing layout with .cc-root, font classes, MarketingOverlayHost, StartTransitionProvider and scoped effects while preserving MarketingQueryProvider. Layout owns one Navbar/Footer: remove page-level Navbar from all current marketing pages atomically, not only pages migrated later. Page state stays below shell. Creator constants already exist from A; wire ui Button to StartLink now.
• [ ] Implement header links/current state/mobile menu; hidden contents must not remain tabbable. Preserve close-on-navigation behavior from dev and main Escape behavior. Footer uses final links and retains a way to reopen cookie preferences.
• [ ] Adapt AudienceTheme to Brands default, Creators state, query/storage priority and clippers compatibility. Remove old page-level query effect when moving homepage to server wrapper; preserve unrelated query/hash.
• [ ] Atomic audience consumers at pinned dev are marketing page.tsx, Hero.tsx, Navbar.tsx, Footer.tsx (plus provider). Update old Hero temporarily even if C replaces its presentation; do not leave a broken Audience union between phases.
• [ ] Install Reveal/Lenis within marketing only; rename to data-cc-reveal attributes, wrapper-scope observers and restore owned document scroll marker on cleanup. No global color-scheme/html theme effects; no-JS/reduced-motion content remains visible.
• [ ] Implement curtain constants/fallback, keeping state on .cc-root[data-cc-curtain], not html. Activate /contact now; /creators/apply only when E exists. Preserve native modified clicks and timeout/unmount cleanup.
• [ ] Keep one shared consent state owner; marketing-specific presentation wrapper/CSS module, current font retained. Keep visible compact /contact controls and preference reopening; product presentation and Telemetry unchanged. Do not infer consent enforcement from report filtering.
• [ ] Defer new careers/clipping/funnel links until destination phases. Do not make hidden or dead anchors an interim checkpoint. Product/root/provider and same-session bidirectional style tests run now.

Acceptance: one nav/footer, responsive menu at 768px, keyboard/focus/reduced-motion/stall cases pass. Public→login/dashboard/report/invoice transitions do not retain scroll interception or theme. Proposed tests/marketing-audience.test.tsx checks query/storage/error scenarios; browser tests check actual focus and route lifecycle.

Phase C — complete brand and creator home compositions

Items M07–M14, M25. Source final Home.tsx is composition authority.

• [ ] Build shared CreatorStats/Proof/CreatorSteps and dedicated /creators landing first, using prepared feature content. Do not implement real membership/verification from local track labels. Step CTA can target the route added in E; final end-to-end link acceptance occurs after E.
• [ ] Build brand sections in exact order: Hero, LogoWall, Stats, CaseCards, Process, Problem, Scorecard, Guarantee, Faq, FinalCta. Attach creator branch with its own stat/proof/steps/FAQ middle. Put metadata/JSON-LD in server app/(marketing)/page.tsx and all interactive state in client Home.
• [ ] Final hero creator CTA is /creators/apply; until E installs that route retain existing Whop as a temporary working checkpoint, then switch atomically in E. Give CreatorSteps id="how-it-works". Keep phone absent/no eager video load below1024; supplied reduced-motion still.
• [ ] Preserve the ten optically sized marks present in pinned final source (eight image marks plus two text marks), curated network stats, four featured case cards and view-driven media. Keep inactive/hidden media paused and duplicate rail entries inaccessible. Do not revive the separately excluded Content Rewards mark to satisfy the superseded count.
• [ ] Adapt misleading earnings FAQ wording to approved eligible views and update its JSON-LD in the same change. Flag unresolved owner claims; do not weaken finance rules. Do not add unused Why/Objection/creator closing CTA sections.

Acceptance: desktop/mobile visual comparison against the supplied images and normal-motion capture; exact sections/colors/order; working audience/anchors; no horizontal overflow at 390/640/768/820/900/1024/1100/1440; one real heading hierarchy. Unit tests cover the audience composition difference; browser screenshot checks cover the visual result, not implementation-shaped class tests.

Phase D — secondary marketing and established contracts

Items M16–M24, M35; pre-existing support M46–M48 already established.

• [ ] Implement campaign list/detail wrappers inside existing paths. Use dev case data + final overrides, retain all seven slugs/unknown-slug 404. Place published results before Roblox live context. Keep founder proof as local card/media, not an external Tweet script.
• [ ] Skin existing Roblox stat/thumbnail behavior; preserve richer dev game handler. Retain live-count endpoint/query provider even if new homepage no longer consumes it.
• [ ] Implement services hierarchy/six media pairs with the640/1000/1024 responsive distinctions in11§12. Add only missing X icon export at shared/components/ui/PlatformIcons.tsx (not common).
• [ ] Adapt InquiryForm with current shared InvisibleTurnstile and existing Next handler. Tests must cover serialized body, validation, abort, provider error and retry via mocks.
• [ ] Build /contact after inquiry, with Calendly lifecycle/fallback and exact origin check. Then /book-call server307 to fixed/contact preserving query pairs; remove old booking-layout metadata simultaneously. Do not forward query to Calendly or delete backend/admin booking capabilities.
• [ ] Skin five guides from feature data; add clipping and careers, then activate nav/footer links. Marketing-specific dialog uses MarketingOverlayHost, not product ConfirmModal/OverlayPortal; trap/restore focus, inert background and clean scroll lock, encoded mail subject, no recruitment API.
• [ ] Apply Legal shell/TOC to dev privacy/terms bodies. Compare extracted text before/after; permitted changes are structure/anchors/presentation only until owner resolves policy differences.

Acceptance: all public routes/links from the route ledger succeed or intentionally redirect; dynamic slugs match; third-party blocked states remain usable; no finance/provider/legal regression. Existing tests/marketing-query-dedup.test.tsx remains meaningful and passing; revise only its visual consumer arrangement if the approved design removes a component, retaining the dedup contract.

Phase E — acquisition questionnaire, lessons and optional intake

Items M26–M28. Prerequisites: creator presentation/content, shared guide records and public shell.

• [ ] Define a runtime schema for track (fast|creator|starter), bounded account links and the nine known question keys; allow only expected scalar/multi answers. Validate stored application and clamp lesson count to integer 0..5; safely recover malformed/blocked localStorage. Do not parse local state into authenticated account fields.
• [ ] Add server-only action with optional configuration. In delivery mode, reuse the existing InvisibleTurnstile client interaction and server verification pattern, with bounded request size and a provider timeout. Reject unverified/unbounded inputs before outbound request. Keep webhook secret on server. Mock the provider; don't send an application to verify setup.
• [ ] Implement the fixed11§8 mode matrix: questionnaire/education always in scope; delivery optional. Without configured protected delivery keep answers local and make no send. With valid config await truthful delivered/error result; local education may continue on failure. Disclose absent final invite before collection. Runtime/server bounds and fail-closed Turnstile configuration are specified in11, not left to guess.
• [ ] Build all nine questions, single advance/multi continue/required links/Other/back/reset, exact scoring priority and returning-applicant display. A completed local questionnaire is never “account verified.”
• [ ] Build sequential five-guide lessons with end-marker/answer gate/revisit. Starter goes to Whop; fast/creator final step uses validated public invite only, otherwise explicit unavailable state and separately labeled public Whop alternative. No secret-invite/admission claims, backend membership, DB or campaign integration. Atomically activate all creator CTA/curtain destinations after Apply and Start resolve.

Acceptance: test all scoring branches, conflicting flags, storage corruption, start-without-application, reset, lesson progression/reload, provider unset/reject/timeout/success mocks. Suggested tests/creator-acquisition.test.tsx and tests/creator-acquisition-action.test.tsx. No real external calls. Full CTA chain home→apply→start now resolves.

Phase F — search, fallback routing and release-facing behavior

Items M30 final integration, M31, M51 exclusion.

• [ ] Consolidate public metadata in marketing helpers/layout/page wrappers. Root defaults/fonts/providers stay dev; only stable Organization/WebSite IDs and publisher reference are narrow root edits. No duplicate organization node. Preserve token metadata and document attributes.
• [ ] Generate22 URLs only with server MARKETING_INDEXABLE=true (10static,7case,5guide). False/default means empty sitemap and disallow-all robots plus marketing noindex. Exclude book-call/apply/start/product/API/report/invoice/simulator always. Preserve actual guide/legal dates.
• [ ] Add group not-found for bad case/guide slugs only. No broad catch-all or /r proxy/config change. Test controlled affiliate redirect/Set-Cookie and protected/API paths; globally unknown routes intentionally retain dev404.
• [ ] Verify noindex for apply/start/404, old concept URLs remain 404, social image serves, and llms/robots describe actual live public destinations. Do not run external indexing submissions or change CDN/provider bot policy.

Acceptance: route priority, affiliate cookies, canonical/schema validity, no duplicate organization entities, private token exclusion and staging noindex checked in built app. External production publishing checklist remains for separately authorized release operator.

Phase G — narrow product copy and regression handoff

Items M33/M34, and exclusions M41–M45/M49/M50. M33 is already present; do not rewrite auth for an equivalent logo.

• [ ] Update professional labels in features/auth/data/onboardingOptions.ts and features/profile/data/profileOptions.ts; simplify only onboarding's beginner description. AccountPanel consumes the latter options, so no ProfileScreen refactor is needed. Keep enum values and clippingExperience property unchanged. Do not mass-rename Clipper Groups or API identifiers.
• [ ] Review final diff for forbidden root/global/dependency/config/finance overwrites. Remove newly orphaned marketing modules only after consumer search; keep current provider APIs/hooks and tests.
• [ ] Run 10 acceptance matrix, repository gate, and independent review. Capture final screenshots at the same viewports/states; explicitly list adaptations from main.
• [ ] Commit small Conventional Commit changes with motivation/body where useful. Keep phases reviewable (foundations/shell, brand+creator presentation, secondary pages, acquisition, SEO/regression), and separate backend commits only if a newly proven requirement is separately authorized.
• [ ] Record exact branch/commit, changed files, checks, remaining owner decisions and issue/PR linkage. Open a dev-targeted PR only if that implementation task authorizes it; this audit opens none. Return the implementation lease when work is safely committed/handed off.

Completion rule

No PORT/ADAPT item can be marked done without its manifest acceptance checks and shared regression checks. No item is implemented by taking an entire main file that contains an excluded behavior. Backend migration phase is intentionally absent because no backend change is evidenced; adding one requires a concrete new contract, not speculation.