Reordenando ficheros y subida de documentacion

mvp/b2c/README.md

@@ -0,0 +1,100 @@
+# Reformix — Landing Page
+
+> Landing page pública de **Reformix**, la plataforma que conecta a propietarios con reformistas de confianza. Presupuesto en 5 minutos, render por WhatsApp. Construida con **Next.js + TypeScript + Tailwind CSS v4**.
+
+## 🚀 Inicio rápido
+
+```bash
+# Instalar dependencias
+npm install
+
+# Iniciar servidor de desarrollo
+npm run dev
+```
+
+Abre [http://localhost:3000](http://localhost:3000) en tu navegador para ver el resultado.
+
+---
+
+## 🛠 Stack tecnológico
+
+| Capa | Tecnología |
+|---|---|
+| Framework | Next.js (App Router) |
+| Lenguaje | TypeScript 5 |
+| Estilos | Tailwind CSS v4 (`@import "tailwindcss"` + `@theme`) |
+| Componentes | React 19 (Server + Client Components) |
+| Fuente | Inter (Google Fonts, variable) |
+
+---
+
+## 📁 Arquitectura del proyecto
+
+```text
+landing-page/
+├── src/
+│   ├── app/
+│   │   ├── globals.css          # Design system: @theme tokens + @layer utilities
+│   │   ├── layout.tsx           # Root layout con fuente Inter y meta tags
+│   │   └── page.tsx             # Composición de página — solo imports de componentes
+│   │
+│   └── components/
+│       ├── Navbar/              # Barra de navegación (actualmente comentada)
+│       ├── Hero/                # Sección principal: headline + LeadForm interno
+│       ├── ReformaSlider/       # Comparador antes/después interactivo (drag)
+│       ├── Features/            # Sección "Cómo funciona" — 3 pasos numerados
+│       ├── Pricing/             # Tabla de servicios: Presupuesto · Reforma · Integral
+│       ├── ContactForm/         # Formulario de contacto con validación y testimonial
+│       └── Footer/              # Links, redes sociales y copyright
+```
+
+### Convención de componentes
+
+- Cada componente vive en su propia carpeta `ComponentName/ComponentName.tsx`.
+- Los sub-componentes de uso exclusivo (ej. `LeadForm`) se definen en el mismo archivo del padre, **no** como archivos separados.
+- `page.tsx` solo importa componentes de primer nivel — sin JSX estructural inline.
+
+---
+
+## 🎨 Design System
+
+Definido en `globals.css` mediante el bloque `@theme` de Tailwind v4:
+
+- **Colores:** Escala negro/blanco de alto contraste. Sin acentos de color innecesarios.
+- **Tipografía:** Inter variable — pesos 400 a 900, tracking ajustado para headlines impactantes.
+- **Animaciones:** Entrada por scroll con `IntersectionObserver` + clase `reveal`. Micro-interacciones en hovers de cards y botones.
+- **Responsive:** Mobile-first. Grid de 1 columna en móvil, 2–3 en desktop.
+
+---
+
+## 🧩 Secciones de la landing
+
+| Sección | Descripción |
+|---|---|
+| **Hero** | Headline + formulario de captación de lead (nombre, email, empresa, teléfono) |
+| **ReformaSlider** | Comparador antes/después con drag handle — 3 espacios: Cocina, Baño, Salón |
+| **Features** | Explicación del proceso en 3 pasos: llama → foto → presupuesto |
+| **Pricing** | 3 niveles de servicio con toggle mensual/anual y features detalladas |
+| **ContactForm** | Formulario completo con datos de contacto y testimonial de cliente real |
+| **Footer** | Links de navegación, redes sociales, estado operativo y copyright |
+
+---
+
+## 📝 Scripts disponibles
+
+```bash
+npm run dev      # Desarrollo con Turbopack (hot reload)
+npm run build    # Build de producción optimizado
+npm run start    # Servidor de producción con la build generada
+npm run lint     # ESLint — análisis estático del código
+```
+
+---
+
+## 🔗 Repositorio
+
+GitHub: [McGregory99/reformix-hackaton](https://github.com/McGregory99/reformix-hackaton)
+
+---
+
+*Desarrollado para el hackathon interno de Reformix.*