docs: renew README content

Author: mu29

LICENSE

@@ -27,11 +27,3 @@ each case subject to the following conditions:
 
 This license is governed by the laws of the State of California and the
 United States of America.
-
----
-
-Third-Party Licenses
-
-This project includes icons from Font Awesome Free by Fonticons, Inc.  
-These icons are licensed under the Creative Commons Attribution 4.0 International license (CC BY 4.0).
-Full license: https://fontawesome.com/license/free

README.md

@@ -1,8 +1,8 @@
 <div align="center">
   <a href="https://composify.js.org">
     <picture>
-      <source media="(prefers-color-scheme: dark)" srcset="https://github.com/composify-js/composify/blob/main/packages/docs/public/brand/logo-dark.png?raw=true">
-      <img src="https://github.com/composify-js/composify/blob/main/packages/docs/public/brand/logo-light.png?raw=true" alt="Composify" width="290" />
+      <source media="(prefers-color-scheme: dark)" srcset="https://github.com/composify-js/composify/blob/main/packages/docs/app/public/brand/logo-dark.png?raw=true">
+      <img src="https://github.com/composify-js/composify/blob/main/packages/docs/app/public/brand/logo-light.png?raw=true" alt="Composify" width="290" />
     </picture>
   </a>
   <p>Server Driven UI made easy</p>
@@ -21,20 +21,20 @@
 
 ## Introduction
 
-Composify is a visual page builder for React that works with your own components.
+Composify is an open-source library that adds a visual editor to your React application. It lets non-developers build pages using your existing production components, so engineers can focus on actual feature work.
 
-Most WYSIWYG editors force you to use their generic component set. Composify takes a different approach—you register your production components once, and then anyone on your team can use them to build pages visually. Your design system stays intact, but now marketing and content teams can compose pages without filing tickets.
+Most visual builders force you into a binary choice: use a rigid page builder with generic components (Wix, Squarespace) or adopt a complex headless CMS that requires modifying your code to fit their platform (Builder.io, Puck, Storyblok).
 
-It's just a React component, so it works with Next.js, Remix, or any React environment. You own your data and there's no vendor lock-in.
+Composify sits in the middle. It is a visual interface for your actual component code. Register your components once, and anyone on your team can use them to build pages visually. Your design system stays intact. Marketing and content teams compose pages without filing tickets.
+
+It's just a React library. Works with Next.js, Remix, or any React environment. You own your data.
 
 Check out the [live demo](https://composify.js.org/demo) to see it in action.
 
 ## Getting Started
 
 ### Installation
 
-Install Composify with your preferred package manager:
-
 ```bash
 # npm
 $ npm install @composify/react --save
@@ -50,30 +50,13 @@ $ yarn add @composify/react
 
 Before you can use a component in the `Editor` or `Renderer`, you need to register it in the `Catalog`.
 
-Let's say you have a simple text component:
-
-```tsx
-// components/Text.tsx
-import { FC } from 'react';
- 
-type Props = {
-  textAlign: 'left' | 'center' | 'right';
-  children: string;
-};
- 
-const Text: FC<Props> = ({ textAlign, children }) => (
-  <p style={{ textAlign }}>{children}</p>
-);
-
-export default Text;
-```
-
-Now register it:
-
 ```tsx
 // catalog.tsx
 import { Catalog } from '@composify/react/renderer';
-import Text from '@/components/Text';
+
+const Text = ({ textAlign, children }) => (
+  <p style={{ textAlign }}>{children}</p>
+);
 
 Catalog.register('Text', {
   component: Text,
@@ -97,7 +80,7 @@ Catalog.register('Text', {
 });
 ```
 
-> **Important**: Make sure to import this catalog file at your app's entry point (like `index.tsx` or `_app.tsx`) so your components are registered before the app renders.
+**Important**: Import this catalog file at your app's entry point (like `index.tsx` or `_app.tsx`) so the registration happens before the app renders.
 
 ### Render Your Components
 
@@ -106,22 +89,22 @@ Once registered, you can render JSX from a string using the `Renderer` component
 ```tsx
 // page.tsx
 import { Renderer } from '@composify/react/renderer';
- 
+
 const source = `
   <div>
     <h1>Welcome to Composify!</h1>
     <Text textAlign="center">This is a simple example.</Text>
   </div>
 `;
- 
+
 export const Page = () => (
   <Renderer source={source} />
 );
 ```
 
 ### Edit Visually
 
-To enable visual editing, use the `Editor` component:
+To let users edit the content, use the `Editor` component:
 
 ```tsx
 // editor.tsx
@@ -140,42 +123,57 @@ export const Page = () => (
 );
 ```
 
-The `Editor` provides a visual interface where users can drag, drop, and configure components without touching code.
+Users can drag and drop components, modify props via the sidebar, and nest elements. Upon save, the editor serializes the tree back into a clean JSX string.
+
+## Why Composify?
+
+We built Composify to solve a common problem. Engineers build component libraries, but only engineers can use them effectively.
 
-## Why Use Composify?
+### Ship UI changes without deployments
 
-We built Composify to solve a common problem: engineers build component libraries, but only engineers can use them effectively. Here are some scenarios where Composify helps:
+Most apps ship with a hard-coded UI. Even small tweaks require a full redeploy. With Composify, your UI lives on the server. Change it there, and it's live everywhere, instantly. No CI/CD, no app store reviews, no waiting.
 
-- **Ship UI changes without deployments** — Need to update a landing page or promotional banner? Push changes instantly without waiting for CI/CD pipelines or redeployments.
+Big tech does this already. Airbnb has [Ghost Platform](https://medium.com/airbnb-engineering/a-deep-dive-into-airbnbs-server-driven-ui-system-842244c5f5). Yelp built [CHAOS](https://engineeringblog.yelp.com/2024/03/chaos-yelps-unified-framework-for-server-driven-ui.html). Lyft and Shopify have their own SDUI systems. Composify gives you that same power without the in-house infrastructure.
 
-- **Reduce engineering bottlenecks** — Marketing teams can update content and layouts themselves instead of creating tickets and waiting for developers. This frees up engineering time for actual feature work.
+### Unblock your team
 
-- **A/B testing made simple** — Test different UI variations without code changes or complex feature flag setups.
+In most companies, small UI tweaks end up in the engineering backlog. Marketing wants to launch a promo. Content editors want to tweak a landing page. The ops team is running a seasonal campaign.
 
-- **Rapid prototyping** — Build high-fidelity prototypes using your actual production components, not placeholder widgets. What you prototype is what you ship.
+With Composify, the roles become clear:
 
-- **Better than headless CMS** — Traditional CMSs give you generic WYSIWYG editors. Composify lets you work with your own design system, so everything stays consistent.
+- Engineers focus on what they do best: building robust, reusable components
+- Non-developers use the visual editor to bring those components to life
 
-- **No-code tools for your team** — Empower content and product teams to build their own pages using components that engineers have already built and tested.
+### A/B testing and rapid prototyping
 
-There's more detail on specific use cases in the [documentation](https://composify.js.org/docs/use-cases/instant-ui-updates).
+Want to test a different page layout for a user segment? Or prototype a feature directly in production? Swap out page structures, personalize onboarding flows, test new CTAs. It all happens server-side. No redeploys. No branching strategies.
+
+### Better than headless CMS
+
+Traditional CMSs lock you into themes and templates. You end up rebuilding your design system inside a clunky page builder, and the result never quite matches your actual app.
+
+With Composify, content teams use the same components that power your core product. What they edit is exactly what ships.
+
+More details on use cases in the [documentation](https://composify.js.org/docs/use-cases/instant-ui-updates).
 
 ## Composify Cloud
 
-If you want a hosted version with collaboration features, [Composify Cloud](https://composify.js.org/cloud) provides:
+The open-source library gives you the engine (Editor and Renderer). Building the car (database, API, version history, collaboration) takes time.
+
+[Composify Cloud](https://composify.js.org/cloud) is the infrastructure layer for teams that want the benefits without maintaining the backend:
 
-- **Managed hosting** — No infrastructure to manage, unlimited bandwidth
-- **Real-time collaboration** — Multiple team members can edit the same page simultaneously
-- **Version history** — Time-travel through changes and restore previous versions
+- **Managed hosting** - No infrastructure to manage, unlimited bandwidth
+- **Real-time collaboration** - Multiple team members can edit the same page simultaneously
+- **Version history** - Time-travel through changes and restore previous versions
 
 ## Documentation
 
 Full documentation is available at [composify.js.org/docs](https://composify.js.org/docs).
 
 ## Contributing
 
-We welcome contributions to Composify! Whether you're fixing bugs, adding features, or improving docs, pull requests and issues are always welcome.
+We welcome contributions. Whether you're fixing bugs, adding features, or improving docs, pull requests and issues are always welcome.
 
 ## License
 
-This project is licensed under the [Elastic License 2.0](LICENSE). It's free to use for most cases, with some restrictions on offering Composify as a hosted service. See the license file for details.
+This project is licensed under the [Elastic License 2.0](LICENSE). Free to use for most cases, with some restrictions on offering Composify as a hosted service. See the license file for details.