docs: manual de identidad v1.0, deck de la dueña y directrices al día

Incorpora los mensajes verbatim del 28–30/jul (tipografía Open Sans, el ≡
que debe leerse como E, "claridad estratégica" como oferta, estructura de
en-ti.com) y el material del deck "Rumbo Estratégico": los 6 puntos de
inflexión y los 4 dolores en primera persona.

Corrige Azul Profundo a #0A1D3D según el manual, y añade CLAUDE.md.

Quedan abiertas dos preguntas para la dueña, anotadas en el doc: si el ≡
lleva espina vertical, y si la "Generación Fundadora" puede vivir fuera
del hero.

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>

AGENTS.md

@@ -14,7 +14,7 @@ One-page landing para **creeer**, marca personal de una estratega de crecimiento
 
 - **Tono maestro:** "seguridad + cercanía" + "simple, directo, limpio".
 - **Logotipo:** `cre≡er` — **SIEMPRE minúsculas**, la "e" central reemplazada por el **símbolo ≡** (tres líneas) en dorado. **Nunca** `CREEER`, `Creeer`, ni mayúsculas.
-- **Paleta:** Azul Profundo `#0A1D5D` + Dorado Estratégico `#C4942E` + Blanco `#FFFFFF` + neutros (Azul Claro `#C8EEF5`, Gris `#F2F2F2`, Gris Medio `#AAAAAA`). **Sin amarillo eléctrico** tipo Hormozi.
+- **Paleta:** Azul Profundo `#0A1D3D` + Dorado Estratégico `#C4942E` + Blanco `#FFFFFF` + neutros (Azul Claro `#C8EEF5`, Gris `#F2F2F2`, Gris Medio `#AAAAAA`). **Sin amarillo eléctrico** tipo Hormozi.
 - **Tipografía:** **Open Sans** (vía `next/font/google`). Es lo más cercano a Aptos en open-source (mismo diseñador: Steve Matteson). **Aptos descartada** en web: la EULA de Microsoft prohíbe servirla públicamente. Decisión de la dueña, 28/jul/2026.
 - **Tagline de marca:** "CLARIDAD · DIRECCIÓN · CRECIMIENTO". Eslogan: "Estrategia que transforma."
 - **Voz:** segunda persona ("tú"/"tu negocio"), sin jerga corporativa.

CLAUDE.md

@@ -0,0 +1,60 @@
+# CLAUDE.md
+
+This file provides guidance to Claude Code (claude.ai/code) when working with code in this repository.
+
+## Lee primero
+
+**`AGENTS.md`** (reglas operativas + decisiones bloqueadas) y **`docs/dueña-directrices.md`** (source of truth de marca, con los mensajes verbatim de la dueña). Toda decisión de copy, diseño o código pasa por ese filtro. Si una propuesta contradice algo de ahí, pregunta antes de avanzar.
+
+El proyecto es en **español** — copy, docs y commits. Los comentarios de código están en inglés.
+
+## Comandos
+
+Gestor de paquetes: **pnpm** (`pnpm@11.7.0` vía corepack). No usar npm.
+
+```bash
+pnpm install
+pnpm dev                                    # http://localhost:3000
+pnpm build                                  # export estático → out/
+pnpm lint                                   # eslint-config-next/core-web-vitals
+pnpm test                                   # vitest run (una pasada)
+pnpm test:watch
+pnpm test components/sections/__tests__/Hero.test.tsx   # un solo archivo
+pnpm test -t "renders the CTA"                          # un solo test por nombre
+npx tsc --noEmit                            # typecheck (no hay script propio)
+```
+
+## Arquitectura
+
+Landing one-page estática. Next.js 14 App Router con `output: 'export'` en `next.config.mjs` → **no hay backend, ni API routes, ni `next/image` optimizado, ni middleware**. El contacto son enlaces directos (WhatsApp / mailto / LinkedIn); no hay formulario.
+
+**Una sola ruta.** `app/page.tsx` compone las 8 secciones en orden fijo y monta el JSON-LD (`ProfessionalService`) inline. `app/layout.tsx` carga Open Sans vía `next/font/google` exponiéndola como `--font-open-sans`, y concentra toda la metadata/OG/canonical.
+
+**El copy vive en `lib/content.ts`, no en el JSX.** Es el source of truth: cada sección importa su objeto (`hero`, `fraseAncla`, `paraQuien`, `mecanismo`, …). Las frases que necesitan énfasis parcial están **partidas en segmentos** (`headline.line1` / `headline.effort` / `headline.clarity`) para que el componente pinte en dorado o subraye sin fragmentar strings dentro del JSX. Al cambiar copy, edita `lib/content.ts`; al cambiar énfasis visual, edita el componente. Los enlaces de contacto ahí llevan `TODO dueña` con placeholders — no inventes valores reales.
+
+**Animación centralizada en `lib/motion.ts`.** Las secciones son client components (`'use client'`) que usan `fadeInUp` + `staggerContainer` con `viewportOnce`, y **siempre** combinan `usePrefersReducedMotion()` con `motionProps(reduced)` — ese spread neutraliza `whileInView`/`initial` cuando el usuario pide menos movimiento. Es requisito de a11y del spec; replícalo en cualquier sección nueva.
+
+**Primitivas antes que utilidades sueltas.** `Container` (ancho `max-w-content`, 1152px), `CTA` (variantes `light`/`dark`, flecha con `motion-reduce:` guards) y `Wordmark` (renderiza `cre≡er` con el `≡` en `text-dorado` y tagline opcional). El wordmark nunca se escribe a mano en el JSX.
+
+**Tokens de color en `tailwind.config.ts`**, nombrados en español según el Manual de Identidad Visual: `azul-profundo`, `dorado`, `azul-claro`, `gris-claro`, `gris-medio`, más los alias `ink` y `bg-dark`. Usa los tokens, no hex sueltos (las pocas excepciones existentes son bordes inline en el hero). `app/globals.css` fija body, `::selection` y el `focus-visible` dorado global — no redefinas focus por componente.
+
+**Tests: co-locados en `__tests__/` junto a cada componente.** Vitest + jsdom + Testing Library, alias `@` → raíz. `vitest.setup.ts` inyecta stubs de `IntersectionObserver` y `matchMedia` porque jsdom no los trae y Framer Motion los necesita. Los tests verifican **copy y contrato de marca**, no estilos — incluido un test negativo en `Hero` que falla si aparece escasez (`cupos|cohorte|generación fundadora`), decisión explícita de la dueña.
+
+## Decisiones bloqueadas (no reabrir sin consultar a la dueña)
+
+- **Wordmark `cre≡er`, siempre en minúsculas**, con la "e" central como `≡` dorado que debe *leerse como E*. Nunca `CREEER` ni `Creeer`.
+- **Paleta:** Azul Profundo `#0A1D3D` + Dorado `#C4942E` + blanco + neutros. Sin amarillo eléctrico.
+- **Tipografía Open Sans.** Aptos descartada (EULA de Microsoft prohíbe servirla en web).
+- **Tono:** "seguridad + cercanía", "simple, directo, limpio". Segunda persona ("tú"), sin jerga corporativa.
+- **Sin escasez en el hero.**
+
+## Flujo de trabajo
+
+- **Rama nueva por cada cambio**, nombrada según el cambio. Nunca trabajar directo en `main`.
+- **No hacer commits sin aprobación explícita** del usuario.
+- Si la dueña manda un mensaje nuevo (WhatsApp, etc.), agrégalo a `docs/dueña-directrices.md` bajo "Mensajes verbatim" con fecha y contexto.
+- Specs y planes aprobados en `docs/superpowers/{specs,plans}/`.
+
+## Skills relevantes
+
+`transformation-positioning` es **obligatorio al escribir copy**. Además: `frontend-design`, `web-design-guidelines`, `vercel-react-best-practices`, `tailwind-design-system`, `nextjs-app-router-patterns`, `framer-motion-animator`, `seo`, `accessibility`, `performance`, `core-web-vitals`.

docs/dueña-directrices.md

@@ -47,6 +47,94 @@ La dueña mencionó a **Alex Hormozi** como referencia estética/comunicacional.
 
 > ⚠️ **Tensión a equilibrar:** Hormozi es agresivo/directo, pero la dueña también pidió **cercanía + minúsculas + blanco+azul + limpio**. La síntesis es **"Hormozi en voz, creeer en alma"**: el punch visual de Hormozi (bold sans, palabras en caja) con el dorado tostado, el wordmark serif en minúsculas y la paleta cálida de creeer.
 
+### Sobre la tipografía y el símbolo del wordmark (28/jul/2026)
+
+Contexto: se le pasaron 3 opciones Open Sans / Carlito / Fira Sans. Verbatim:
+
+> **Erik (11:28):** "Open Sans / Carlito / Fira Sans — Son muy similares, pero tal vez haya detallitos que creen mejores."
+> **Dueña (12:56):** "Toma la más común."
+> **Dueña (12:57):** "Sólo cuida que la E que está en 3 líneas se lea como E. Por favor."
+> **Dueña (12:57):** "Gracias."
+
+Dos directivas:
+1. **Tipografía → Open Sans** ("la más común" de las tres).
+2. **Símbolo del wordmark:** el `≡` (tres líneas) debe **leerse como E** — no como líneas abstractas ni ícono de menú. El wordmark tiene que leerse `creeer`. Implementación: glifo en SVG que forma una **E** con tres barras horizontales + espina vertical izquierda, en dorado.
+
+> ⚠️ **Contradicción pendiente con el manual.** El Manual de Identidad Visual v1.0 dibuja el `≡` como **tres barras sueltas, sin espina vertical**. El punto 2 de arriba (la espina) es una interpretación del mensaje de la dueña, no algo que el manual muestre. El logotipo trazado en `public/logo-creeer-principal.svg` sigue al manual. **Preguntar a la dueña cuál manda.**
+
+### Sobre la nueva imagen y el formato de la página (29/jul/2026)
+
+Contexto: mandó el Manual de Identidad Visual (`docs/branding.jpeg`) y una referencia de sitio. Verbatim:
+
+> **Dueña (10:13):** *[imagen del Manual de Identidad Visual v1.0]*
+> **Dueña (10:13):** "esta es la nueva imagen, lo que ofrecemos es claridad."
+> **Dueña (10:13):** "claridad estratégica"
+> **Dueña (10:14):** "me gusta el formato de esta página,"
+> **Dueña (10:14):** "ya que haremos preguntas y vamos ir dando solución a sus principales dolores"
+> **Dueña (10:14):** https://en-ti.com/
+> **Dueña (10:15):** "me falta definir la información, pero les voy a dejar un par de proyectos que hice, justamente dando esta claridad estratégica a 2 compañías."
+
+Tres directivas:
+1. **El manual v1.0 es la imagen definitiva** y la oferta se nombra **"claridad estratégica"** (no "estrategia", no "marketing").
+2. **Adoptar la estructura de `https://en-ti.com/`** — confirmado con la dueña (29/jul/2026): le gustó **la estructura** de esa página. Es referencia de *estructura*, no de estética: la paleta, el logotipo y el tono los sigue fijando el manual + las decisiones bloqueadas.
+3. **Pendiente de la dueña:** 2 casos de proyectos reales donde dio claridad estratégica. La información aún no está definida por ella; no inventar casos ni métricas.
+
+**Estructura de en-ti.com, verificada en el sitio (29/jul/2026):** hero declarativo con 2 CTAs → barra de métricas → soluciones en 6 tarjetas → fichas ampliadas → proceso de 5 pasos → "a quién servimos" (8 industrias) → logos de clientes → productos propios → muro de prensa → CTA repetido (*"Cotiza tu proyecto"*).
+
+> **Ojo al releer esto:** la página **no contiene ni una sola pregunta** — todos sus encabezados son enunciados. El patrón real de sus tarjetas es **nombrar el dolor y resolverlo en dos líneas**, p. ej. *"Recuperación de equipo crítico — Cuando un servidor o equipo especializado falla, diagnosticamos, restauramos y devolvemos la operación, sin reemplazar toda la inversión."* Lo de "haremos preguntas" es intención de la dueña para el copy, no algo que la referencia demuestre.
+
+### Sobre el avance con gráfico y movimiento (30/jul/2026)
+
+> **Dueña (Jazmín):** "súper, sólo le falta algo de gráfico y movimiento, denme chance de entregar algo y si pudieras en la tarde nos conectamos un rato para comentarles."
+
+Dos lecturas:
+1. **Aprueba el rumbo actual** ("súper") y pide más **gráfico y movimiento** — refuerza seguir sumando elementos visuales/animados (en la línea de lo ya trabajado: fondos de puntos, blur-in del headline, spotlight en tarjetas, carrusel), siempre dentro de la paleta y el tono ya fijados.
+2. **Pide tiempo** ("denme chance de entregar algo") antes de seguir — probablemente va a compartir algo (¿los 2 casos pendientes? ¿más contenido del deck?) — y propone **conectar en la tarde** para comentar con el equipo ("comentarles", plural). No agendar nada unilateralmente; esperar a que ella confirme la llamada.
+
+---
+
+## Deck "Rumbo Estratégico · Propuesta Socio" (29/jul/2026)
+
+> **Fuente:** `creeer_Rumbo_Estrategico_Propuesta_Socio.pptx`, 14 diapositivas, autoría de la dueña (Jazmín Rodríguez).
+> ⚠️ **Es un deck para un socio estratégico, no material público.** Las diapositivas 11–13 (roadmap con fechas internas, qué se le pide al socio, próximos pasos) **no van a la landing**. El propio deck menciona que habrá un "deck público" aparte.
+> ⚠️ **La voz del deck es "nosotros" ("no vendemos marketing", "trabajamos con…") porque le habla a un socio.** La landing va en segunda persona ("tú") y primera del singular, según las decisiones bloqueadas. **No copiar el copy verbatim sin cambiar la persona.**
+
+### Los 6 puntos de inflexión (diapositiva 2) — material para tarjetas
+
+| Punto | Descripción verbatim |
+|---|---|
+| Crecer | Dar el siguiente salto sin saber por dónde |
+| Consolidarse | Ordenar lo construido antes de escalar |
+| Recuperar rentabilidad | El esfuerzo ya no se traduce en resultado |
+| Simplificar | Demasiada complejidad operativa |
+| Expandirse | Nuevos mercados, mismo mapa de decisión |
+| Replantear el portafolio | Qué seguir, qué dejar ir |
+
+### Los dolores, en primera persona (diapositiva 3) — verbatim
+
+> "Trabajo más y gano casi lo mismo que hace dos años."
+> "Tengo varios proyectos y no sé en cuál enfocar mi tiempo y mi dinero."
+> "Mi empresa no puede crecer si yo no estoy en cada decisión."
+> "Lo que me trajo hasta aquí ya no me sirve para el siguiente nivel."
+
+Remate de la diapositiva: **"Esto no se resuelve con más esfuerzo. Se resuelve con una estrategia clara."**
+
+Estos son los "principales dolores" que la dueña anunció por WhatsApp. **Ya están escritos en su voz — usarlos, no reescribirlos.**
+
+### Confirmaciones que aporta el deck
+
+- **El insight (diap. 4) ratifica el lead de `Disciplinas`:** *"No vendemos marketing. Vendemos claridad estratégica… El marketing es una de las disciplinas que usamos para transformar empresas — no el producto que vendemos."* → `Disciplinas` se queda como está, separado de cualquier bloque de soluciones.
+- **`Mecanismo` coincide** con el proceso del deck (diap. 7): Inmersión → Desafío → Construcción.
+- **`ParaQuien` se queda corto:** el deck (diap. 9) tiene **4 "SÍ ES PARA" + 4 "NO ES PARA"**; la landing sólo tiene 3 criterios afirmativos.
+- **Encuadre clave (diap. 5):** *"El cliente no está en crisis: está en transición."*
+- **Frase-ancla alternativa (diap. 14):** *"Cuando una empresa pierde claridad, deja de crecer por estrategia y empieza a crecer por inercia."* Convive con la de `lib/content.ts`; **decidir cuál manda.**
+
+### Alertas
+
+- **Diapositiva 10 = escasez.** "Generación Fundadora", 10 empresas, "precio y condiciones de fundador, no repetibles". Está **explícitamente prohibida en el hero** por decisión de la dueña, y hay un test negativo en `Hero.test.tsx` que falla con `cupos|cohorte|generación fundadora`. **Preguntar si puede vivir más abajo en la página o si queda fuera del todo.**
+- **Los 2 casos siguen sin llegar.** El deck no los contiene.
+- **Calendario (diap. 11):** lanzamiento última semana de agosto 2026; hoy la fase es "Validación" (pilotos con 5–10 empresarios).
+
 ---
 
 ## Principios derivados (cómo aplicar los mensajes)
@@ -131,7 +219,7 @@ Proceso visual: **Complejidad** (múltiples variables) → **Enfoque** (prioriza
 **Colores principales:**
 | Nombre | Hex | Pantone | RGB | Uso |
 |--------|-----|---------|-----|-----|
-| **Azul Profundo** | `#0A1D5D` | 2965 C | 10, 29, 61 | Texto principal, fondos oscuros, CTAs |
+| **Azul Profundo** | `#0A1D3D` | 2965 C | 10, 29, 61 | Texto principal, fondos oscuros, CTAs |
 | **Dorado Estratégico** | `#C4942E` | 872 C | 196, 154, 46 | Acentos, títulos, símbolo ≡, énfasis |
 
 **Colores neutros:**

docs/superpowers/specs/2026-07-20-creeer-landing-design.md

@@ -44,8 +44,8 @@ Tokens de color (Tailwind):
 | Token | Hex | Uso |
 |---|---|---|
 | `bg-white` | `#FFFFFF` | Fondo base y hero |
-| `bg-azul-profundo` | `#0A1D5D` | Secciones oscuras (04 y 07) |
-| `text-azul-profundo` | `#0A1D5D` | Texto principal |
+| `bg-azul-profundo` | `#0A1D3D` | Secciones oscuras (04 y 07) |
+| `text-azul-profundo` | `#0A1D3D` | Texto principal |
 | `text-white` | `#FFFFFF` | Texto sobre fondo oscuro |
 | `text-dorado` / `bg-dorado` | `#C4942E` | Dorado Estratégico — acentos, títulos, símbolo ≡ |
 | `bg-azul-claro` | `#C8EEF5` | Fondos alternativos, secciones suaves |
@@ -77,7 +77,7 @@ Tokens de color (Tailwind):
 ### 3.4 Wordmark / Logotipo
 
 **`cre≡er`** — siempre en minúsculas, Open Sans:
-- `cre` en Azul Profundo `#0A1D5D` (sobre claro) o blanco `#FFFFFF` (sobre oscuro)
+- `cre` en Azul Profundo `#0A1D3D` (sobre claro) o blanco `#FFFFFF` (sobre oscuro)
 - **`≡`** (símbolo de tres líneas, reemplaza la "e" central) en **Dorado Estratégico `#C4942E`**
 - `er` en el color del "cre"
 
@@ -107,7 +107,7 @@ Tokens de color (Tailwind):
 ### 3.7 Layout de secciones
 
 - Secciones **claras**: fondo blanco `#FFFFFF`. Alternar con `#F2F2F2` (gris claro) o `#C8EEF5` (azul claro) para ritmo visual.
-- Secciones **oscuras** (04, 07): fondo Azul Profundo `#0A1D5D` con texto blanco y acentos Dorado `#C4942E`
+- Secciones **oscuras** (04, 07): fondo Azul Profundo `#0A1D3D` con texto blanco y acentos Dorado `#C4942E`
 - Esto da **ritmo visual** al scroll y enmarca las partes estratégicas (mecanismo + cierre)
 
 ---