Creeer-Web/docs/dueña-directrices.md

# Directrices de la dueña · creeer

> **Source of truth para decisiones de marca, copy y diseño.**
> Esta es la voz y el criterio de la dueña de creeer. Toda decisión del proyecto debe pasar por este filtro. Si una propuesta contradice algo de aquí, **preguntar antes de avanzar**.

---

## Quién es la dueña

La dueña es **la mente detrás de creeer** — estratega de crecimiento con +30 años construyendo marcas. Su negocio real es **claridad estratégica para empresarios con tracción que llegaron a un punto de inflexión** (no vende marketing, vende la transformación).

El nombre **creeer** es un juego con "creer" (en ti, en mí, en el proyecto) + "career".

---

## Mensajes verbatim de la dueña (contexto y voz)

Estos son los mensajes que la dueña envió por WhatsApp durante el brainstorming, transcritos literalmente. **Preservar su voz y sus palabras.**

### Sobre la sensación que quiere proyectar
> **"Sabes lo que quiero que proyectemos es seguridad pero cercanía."**

*(3:03 p.m., 20/7/2026)* — Esta es la directriz maestra de tono. **No frío/distante, no agresivo puro. Autoridad accesible.**

### Sobre el wordmark en minúsculas
> **"Por eso está en minúsculas."**

*(3:04 p.m., 20/7/2026)* — La decisión de escribir `creeer` en minúsculas es **consciente y estratégica**: transmite cercanía, humildad, accesibilidad (frente al frío de los mayúsculas institucionales). **NUNCA usar `CREEER` ni `Creeer` en el wordmark** — siempre `creeer`.

### Sobre la paleta y el estilo
> **"Creo que el blanco con azul."**
> **"Simple directo."**
> **"Limpio."**

*(3:12 p.m., 20/7/2026)* — Tres directrices visuales:
1. **Blanco con azul** → fondo claro + navy (no dark mode como dirección principal)
2. **Simple directo** → sin decoración, sin elementos accesorios, copy directo
3. **Limpio** → mucho aire, blanco, tipografía hace el trabajo

### Referencia a Alex Hormozi
La dueña mencionó a **Alex Hormozi** como referencia estética/comunicacional. Su ADN:
- Bold sans-serif gigante, a menudo uppercase
- Alto contraste (negro/blanco/un acento eléctrico — en creeer, dorado)
- Copy directo, corto, cuantificado (números, métricas, claims)
- Palabras clave en caja (background detrás de la palabra)
- Voz agresiva, results-driven, "sin paja"

> ⚠️ **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)

| Directriz de la dueña | Implicación práctica |
|---|---|
| "Seguridad + cercanía" | Serif para autoridad + voz en "tú" + fondos cálidos para cercanía |
| "minúsculas" | Wordmark SIEMPRE `creeer`. Eyebrows y CTAs pueden ser uppercase (system-ui) pero el wordmark jamás |
| "blanco con azul" | Fondo principal blanco/blanco cálido, navy como tinta y CTA |
| "Simple directo" | Sin elementos decorativos accesorios. Copy corto, una idea por línea |
| "Limpio" | Mucho aire (whitespace), máximo 2 familias tipográficas, paleta reducida |
| Referencia Hormozi | Permitido bold sans uppercase + palabras en caja + métricas, **siempre que** no rompan cercanía |

---

## Posicionamiento estratégico (de su documento de nicho)

Esto NO es copy de landing — es la brújula estratégica que la dueña ya validó. Toda la messaging debe ser coherente con esto.

### Lo que creeer NO es
- ❌ Un diplomado de marketing
- ❌ Una consultoría genérica
- ❌ Clases/asesoría por hora
- ❌ Venta de disciplinas (Comunicación/Digital/Experiencias) como promesa

### Lo que creeer SÍ es
- ✅ **Claridad estratégica** para empresarios con tracción en punto de inflexión
- ✅ Transformación, no horas
- ✅ Inmersión profunda → desafiar supuestos → estrategia ejecutable

### Cliente ideal
Empresarios que **ya lograron tracción**, pero llegaron al punto donde **trabajar más ya no basta** — necesitan mejores decisiones estratégicas. NO cualquier PYME. NO empresas en crisis. **Empresas en transición.**

### Frases-ancla aprobadas (de su documento)
- *"Las empresas no dejan de crecer por falta de talento; dejan de crecer por falta de claridad."*
- *"Cuando el esfuerzo ya no alcanza, la estrategia se vuelve indispensable."*
- *"El tiempo no se compra, se invierte."* (institucional)
- *"Devuélvele claridad al rumbo de tu empresa."* (promesa)

### Tagline de marca
*"creeer en ti, creeer en mí, creeer en el proyecto."*

### Pilares (disciplinas, NO la promesa)
**Comunicación · Digital · Experiencias** (+ Integración y acción). Son las herramientas, no el producto. **Viven en sección "cómo", no en el hero.**

---

## Sistema de diseño oficial — Manual de Identidad Visual v1.0 (mayo 2026)

> **Fuente:** `docs/branding.jpeg` — Manual de Identidad Visual aprobado por la dueña (28/jul/2026). **Reemplaza** todas las decisiones previas de paleta, tipografía y logotipo del brainstorming y del pptx.

### Filosofía de marca
> *"Transformamos la complejidad en claridad estratégica para construir ecosistemas empresariales que crecen con dirección y propósito."*

Proceso visual: **Complejidad** (múltiples variables) → **Enfoque** (priorizamos y alineamos lo esencial) → **Claridad** (una estrategia, una dirección, resultados extraordinarios).

### Símbolo principal
- **Tres líneas horizontales** (≡) que representan el proceso de transformar lo complejo en lo esencial
- Las líneas van de muchas/desordenadas (complejidad) a pocas/alineadas (claridad)
- Significado: "una estrategia clara, con dirección y propósito"

### Logotipo
- Wordmark: **`cre≡er`** — la "e" central se reemplaza por el **símbolo de tres líneas** (≡) en dorado
- SIEMPRE en minúsculas
- Tagline debajo: `CLARIDAD · DIRECCIÓN · CRECIMIENTO`
- Eslogan: *"Estrategia que transforma."*

**Versiones del logotipo:**
| Versión | Descripción |
|---------|-------------|
| Principal | `cre≡er` + tagline "CLARIDAD · DIRECCIÓN · CRECIMIENTO" |
| Secundaria | `cre≡er` sin tagline |
| Ícono | Solo el símbolo ≡ (tres líneas) |
| Negativa | Fondo navy, logotipo en blanco + dorado |
| Negativo (ícono) | Símbolo ≡ en dorado sobre navy |
| Escala de grises | Todo en grises |

**Tamaño mínimo:** impreso 20 mm, digital 120 px.

### Paleta de colores

**Colores principales:**
| Nombre | Hex | Pantone | RGB | Uso |
|--------|-----|---------|-----|-----|
| **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:**
| Nombre | Hex | RGB | Uso |
|--------|-----|-----|-----|
| Azul Claro | `#C8EEF5` | 222, 226, 245 | Fondos alternativos, secciones suaves |
| Gris Claro | `#F2F2F2` | 242, 242, 242 | Fondos neutros, separadores |
| Gris Medio | `#AAAAAA` | 166, 166, 166 | Texto secundario, placeholders |
| Blanco | `#FFFFFF` | 255, 255, 255 | Fondo principal |

**Regla:** NO amarillo eléctrico tipo Hormozi (rompe cercanía).

### Tipografía

**Manual de marca (impreso/presentación):** Aptos (principal) + Aptos Narrow (secundaria).
**Implementación web (landing):** **Open Sans** — vía `next/font/google`, pesos 400/600/700/800 + itálicas.

> ⚠️ **Por qué no Aptos en web:** Aptos es proprietaria de Microsoft; su EULA prohíbe distribuirla o servirla en un sitio público ("No Distribution Rights" + "publish for others to copy"). La dueña, informada del riesgo, inicialmente autorizó usarla; pero al faltar los pesos regular/semibold en la conversión a `.woff2`, decidió pasar a la alternativa open-source más cercana. **Open Sans** comparte diseñador con Aptos (Steve Matteson) y es OFL (libre para web). Decisión: 28/jul/2026.

### Iconografía
- Estilo: **líneas simples, geométricas, consistentes en grosor**
- Iconos definidos: Análisis, Enfoque, Estrategia, Crecimiento, Alineación, Resultados
- Colores: Azul Profundo + Dorado Estratégico

### Recursos visuales
- **Patrón de puntos** (grid de puntos dorados)
- **Líneas y divisores** (horizontales, en dorado o navy)
- **Recurso gráfico** (las tres líneas del símbolo en diversas orientaciones y escalas)

### Patrones de alineación
- `center` → hero / títulos de impacto
- `right` → momentos asimétricos
- `left` → contenido, citas, cierre
- Mucho aire/whitespace alrededor de los textos

---

## Restricciones fijadas (decisiones bloqueadas)

Estas decisiones **no se reabren sin consultar a la dueña.**

### Copy
- Voz en **segunda persona ("tú")** — nunca "el empresario", siempre "tu negocio"
- Sin jerga corporativa
- "Simple, directo, limpio" aplica al copy también

### Frases-ancla aprobadas
- *"Las empresas no dejan de crecer por falta de talento; dejan de crecer por falta de claridad."*
- *"Cuando el esfuerzo ya no alcanza, la estrategia se vuelve indispensable."*
- *"El tiempo no se compra, se invierte."* (institucional)
- *"Devuélvele claridad al rumbo de tu empresa."* (promesa)
- *"Estrategia que transforma."* (eslogan oficial)

### Taglines
- **Eslogan oficial:** *"Estrategia que transforma."*
- **Tagline de marca:** *"CLARIDAD · DIRECCIÓN · CRECIMIENTO"*
- **Tagline emocional:** *"creeer en ti, creeer en mí, creeer en el proyecto."*

### Estructura
- One-page (single page)
- Sin backend, contacto por enlaces directos (WhatsApp, email, LinkedIn)
- Sin escasez en el hero (la dueña pidió quitar cupos/cohorte del hero)

### Pendiente de decisión de la dueña
- **Hero final:** HV-1 (bold sans sin cajas) vs HV-2 (palabras en caja) — ver `docs/hero-finalists.md`
- ~~**Tipografía web:** Aptos vs Inter~~ → **RESUELTO (28/jul/2026): Open Sans**. Ver sección "Tipografía" arriba.

---

## Cómo usar este archivo

Cuando trabajes en creeer (copy, diseño, código, decisiones de producto):

1. **Lee esto primero** — es la voz de la dueña.
2. **Pasa cada decisión por el filtro** de "seguridad + cercanía" + "simple, directo, limpio".
3. **Si una propuesta contradice algo de aquí**, detente y pregunta antes de avanzar.
4. **Si la dueña envía un mensaje nuevo**, agrégalo a la sección "Mensajes verbatim" con fecha y contexto.
5. **Las decisiones bloqueadas** (paleta, wordmark, voz) no se reabren sin su aprobación explícita.