M-09 W9a · Fundación landing Next.js + re-paleta naranja Momentum
Ola de fundación de la landing investor-grade. NO se construyen animaciones (eso es W9b). W9a entrega: scaffold Next.js App Router, sistema de tokens y la re-paleta que sustituye TODO el azul del design-system M-08 por el naranja Momentum #FF6B35 (directiva CEO · color del LMS real). Modo claro inviolable.
W9a · A-retro + verdict (APPROVE)
Semáforo: 🟢 VERDE
La ola cierra en verde. Fundación sólida, verificable y conservadora en accesibilidad.
Qué se ha shippeado (verificado, no reportado)
- Scaffold Next.js 16.2.9 App Router (
landing/web) · Turbopack ·npm run buildre-ejecutado EXIT 0 · TypeScript limpio · 4/4 páginas estáticas. Cumple OD-004. - Re-paleta naranja Momentum · CERO azul.
grepde#1B4DCC/blue/hex azules enapp/= 0 matches. El naranja es ahora el acento único y sustituye todo el azul M-08. - Tokens (Foundation Chain).
globals.css :root→ color / tipografía / espacio / radio / sombra / motion +@theme inline(Tailwind v4). Eje de peso display capado a 700 (Space Grotesk máx) frente a 760 de M-08. - Tipografía. Space Grotesk (display · H1) + Inter (body) vía
next/font/google,display:swap. JetBrains Mono reservado para IDs del corpus. - Modo CLARO. Fondo hueso
#F7F5F0, sin dark mode. Sin glow/neón — profundidad por sombra editorial HSL low-alpha. Las únicas menciones a “glow” son comentarios que lo prohíben.
Decisión de accesibilidad (el punto fino de la ola)
El mandato pedía #E85A2A para TEXTO con AA ≥4.5. Empíricamente #E85A2A mide 3.25:1
sobre hueso → no pasa AA en texto pequeño. La implementación lo corrigió usando un
escalado de naranja por uso:
| Token | Hex | Uso | Ratio sobre hueso |
|---|---|---|---|
--color-accent | #FF6B35 | fills / acentos gráficos grandes | 2.6:1 (NO texto) |
--color-accent-hover | #E85A2A | hover CTA fill + UI/large | 3.25:1 (NO texto pequeño) |
--color-accent-strong | #C2410C | texto de acento, enlaces, etiquetas | 4.75:1 (AA PASS) |
--color-accent-light | #FFF7ED | tinte de fondo chip/badge | no-texto |
tinta #16191F sobre fill #FF6B35 | — | texto sobre relleno naranja | 6.21:1 |
No es un fallo: es la corrección correcta y más conservadora, satisface la intención del mandato (“#E85A2A o más oscuro · ≥4.5”) y el requisito real WCAG AA.
Gaps registrados (honestos · no bloqueantes)
- Hero centrado verticalmente porque cada escena reserva
section-min-h:100vh(intencional para CLS-0 antes del lazy-mount de W9b). En la fundación estática deja mucho espacio en blanco superior — esperado en W9a, se resuelve al montar las escenas. - Mandato a actualizar. El mandato especificaba
#E85A2Apara texto; ese color (3.25:1) no pasa AA en texto pequeño y la implementación usó correctamente#C2410C(4.75:1). Conviene actualizar el texto del mandato para futuras olas, de modo que el token de TEXTO de acento sea#C2410Cy#E85A2Aquede explícitamente como hover/UI.
Verdict
- V-review (adversarial · default-REJECT) → APPROVE
- Verdict ID:
20553245-c066-4604-b29e-e080994be6c3 - 7/7 checks PASS (build · cero azul · fuentes · modo claro · WCAG AA texto · tokens Foundation Chain · sin glow). Verificación con build re-ejecutado + ratios calculados en Python + screenshot headless inspeccionado con Vision.
Deuda / siguiente ola
- W9b: construir las animaciones de escena (lazy-mount, scroll-driven) sobre esta
fundación. El reservado
100vhpor escena y los tokens demotionya están listos. - Actualizar el mandato de paleta (gap 2) antes de arrancar W9b.