Align docs with the Reflex marketing design

[Alek99]

The documentation site still used the older visual system across its navigation, landing pages, article controls, and component catalogs. This brings those surfaces into the current Reflex marketing style with Inter/Geist typography, warm neutral colors, the opal announcement banner, and compact, consistent controls.

Changes

• Restyle the docs overview, AI workflow cards, component and integration catalogs, recipes, and 404 page.
• Align desktop and mobile navigation, search, feedback, code examples, tables, callouts, and Back/Next links; add an accessible title and close control to the mobile documentation drawer.
• Keep the documentation content, routes, code syntax colors, and live example behavior intact. Add scoped hooks in reflex-site-shared, local font assets with licenses, and support for dark mode and reduced motion.

Validation

• Docs application suite: 668 passed, 65 skipped (test_published_seo.py excluded because this is a local change).
• Relevant shared docs component tests: 71 passed. Frontend quality checks: 5 passed.
• Production compilation and bundle completed for all 1,073 registered docs routes.
• Manually checked representative desktop/mobile pages, light/dark themes, navigation and search, live examples, API controls, integration filtering, and the compact Back/Next links.
• Ruff checks and formatting, Pyright, codespell, and git diff --check passed for the changed files.

Browser coverage is representative rather than an automated run of every documentation route. This PR is a draft for visual review.

[codspeed]

Merging this PR will not alter performance

⚠️ 18 benchmarks spent significant time in system calls

System calls cannot be consistently instrumented, so they are not included in the measure, which understates the real cost. Please switch to the Walltime instrument to accurately measure system calls.

Measurement and system calls

• test_cli_startup[deploy_help]
• test_get_state[memory]
• test_cli_startup[cloud_help]
• test_cli_startup[run_help]
• test_import_cli
• test_event_queue_dispatch
• test_state_manager_memory_read_only_modify
• test_cli_startup[version]
• test_cli_startup[help]
• test_event_shutdown_cancel
• …and 8 more

✅ 148 untouched benchmarks

---

_{Comparing codex/docs-marketing-style (7494632) with main (2fc4a9c)}

[greptile-apps]

Confidence Score: 5/5

[Medium impact] The PR appears safe to merge; no actionable new issues were found.

Summary

Updates the docs site to the marketing design with Inter/Geist typography, warm colors, and an opal announcement banner.

• Docs pages use Inter, Geist, and warm colors in both themes.
• The docs landing pages present guides and AI workflows as compact cards.
• Docs navigation and article pages use compact, accessible controls.
• Component reference pages give live examples and options a compact style.
• Catalogs, recipes, and component previews use matching cards and controls.

_{Reviews (6) · Last reviewed commit: "Merge branch 'main' into codex/docs-mark..." · Reviewed by Greptile}

[cubic-dev-ai]

All reported issues were addressed across 53 files

<sub>Reply with feedback, questions, or to request a fix.

View guided diff | Turn on auto-fix | Re-trigger cubic</sub>