# EGGS Design System

> Sistema de diseño de EGGS — consultora de innovación, parte de Sopra Steria.
> Claim: **Experiencias Inteligentes iX. Impulsadas por tecnología, creadas por (y para) humanos.**
> Esta URL está pensada para ser leída por agentes de IA. Si te han pedido
> "pinta esta app / portal / presentación con los estilos de EGGS", lee
> `/AGENTS.md` — contiene la especificación completa y autosuficiente
> (tokens, tipografía, reglas y CSS listo para copiar).

## Empieza aquí

- [AGENTS.md](https://ds.eggsdesign.es/AGENTS.md): Especificación completa y autosuficiente. **Lee este archivo primero.** Incluye paleta con hex, escala tipográfica, espaciado, radios, motion y bloques de CSS listos para pegar.
- [colors_and_type.css](https://ds.eggsdesign.es/colors_and_type.css): Hoja de estilos canónica. Enlázala directamente con `<link rel="stylesheet" href="https://ds.eggsdesign.es/colors_and_type.css">` y tendrás todos los tokens y las fuentes Haffer reales.
- [README.md](https://ds.eggsdesign.es/README.md): Contexto de marca para humanos — voz, tono, fundamentos de contenido.

## Reglas que no se negocian

- Fondo por defecto **Arena `#F5F0E6`**, nunca blanco puro en páginas largas.
- Tres colores principales: **Blanco**, **Negro `#171717`**, **Arena `#F5F0E6`**.
- Tipografía **Haffer Prototypo**: `Concrete` para títulos y botones, `Concrete Light` para cuerpo, `Display` para UNA palabra destacada. **Nunca cursiva.**
- Cero degradados, cero sombras decorativas, cero emoji.
- Radios permitidos: `9999px` (pill), `16px`, `24px`, `48px`. Nada más.
- Botones: pill + disco separados que se unen en hover. El recipe está en `AGENTS.md`.

## Assets

- [Logo negro SVG](https://ds.eggsdesign.es/assets/logo-eggs-black.svg): Marca 2×2 para superficies claras.
- [Logo blanco SVG](https://ds.eggsdesign.es/assets/logo-eggs-white.svg): Marca 2×2 para superficies oscuras.
- [Fuentes Haffer](https://ds.eggsdesign.es/fonts/): `HafferPrototypo-{Display,Concrete,ConcreteLight,Abstract}.{woff2,woff,ttf,otf}`.
- [Descargas](https://ds.eggsdesign.es/downloads/index.html): Pack de logos ZIP, paleta ASE/GPL, tokens JSON.
- [Design tokens JSON](https://ds.eggsdesign.es/downloads/eggs-tokens.json): Color, tipografía, espaciado, radios y motion en JSON — útil si prefieres datos a CSS.

## Optional

- [Índice visual](https://ds.eggsdesign.es/index.html): Navegación humana por todas las tarjetas del sistema.
- [Slides de propuesta](https://ds.eggsdesign.es/slides/index.html): Plantillas 16:9 para presentaciones.
- [UI Kit web](https://ds.eggsdesign.es/ui_kits/website/index.html): Recreación del sitio de marca.
- [Patrones de app](https://ds.eggsdesign.es/ui_kits/apps/index.html): Formularios, wizards, fichas, móvil y desktop.

## Plantillas listas para copiar

- [Deck de propuesta](https://ds.eggsdesign.es/templates/propuesta/Propuesta.dc.html): 9 slides 16:9 — portada, agenda, enfoque, equipo, caso, plan, cierre.
- [One-pager](https://ds.eggsdesign.es/templates/one-pager/OnePager.dc.html): Resumen ejecutivo A4, imprimible tal cual.
- [Documento](https://ds.eggsdesign.es/templates/documento/Documento.dc.html): Informe largo con cabecera y pie repetidos.