# References

<!-- Este archivo captura inspiración visual y funcional de otros sitios.
     La clave no es listar URLs — es anotar QUÉ específicamente te gusta y por qué.
     "Me gusta el spacing" es más útil que solo el link. -->

---

## Sites I Admire

<!-- Por cada referencia: URL + lo que te gusta de forma específica.
     Incluye también qué NO tomarías de ese sitio. -->

### Reference 1
- **URL**: [https://ejemplo.com]
- **What I like**: [Descripción específica — ej. "El hero es una foto real integrada sin corte, con headline a la derecha y mucho espacio"]
- **What to take from it**: [Lo que quieres replicar en tu sitio]
- **What to avoid from it**: [Lo que no funciona para tu caso]

### Reference 2
- **URL**: [https://ejemplo.com]
- **What I like**: [Descripción]
- **What to take from it**: [Qué tomar]
- **What to avoid from it**: [Qué evitar]

### Reference 3
- **URL**: [https://ejemplo.com]
- **What I like**: [Descripción]
- **What to take from it**: [Qué tomar]
- **What to avoid from it**: [Qué evitar]

### Reference 4
- **URL**: [https://ejemplo.com]
- **What I like**: [Descripción]
- **What to take from it**: [Qué tomar]
- **What to avoid from it**: [Qué evitar]

<!-- Agrega más con el mismo formato -->

---

## Competitor / Peer Portfolios

<!-- Otros en tu espacio — no para copiar, sino para diferenciarte conscientemente.
     Anota qué hacen bien y dónde dejas espacio para ser diferente. -->

### [Nombre / Site]
- **URL**: [https://ejemplo.com]
- **What works**: [Lo que hacen bien]
- **What doesn't**: [Lo que podrías hacer mejor]
- **How to differentiate**: [Qué harías tú distinto]

### [Nombre / Site]
- **URL**: [https://ejemplo.com]
- **What works**: [Descripción]
- **What doesn't**: [Descripción]
- **How to differentiate**: [Descripción]

---

## Brands I Want to Feel Adjacent To

<!-- No son referencias directas de sitios web — son marcas cuya estética o posicionamiento
     resuena con lo que quieres proyectar. Pueden ser cualquier tipo de marca. -->

- [Marca 1] — [por qué: ej. "La confianza que transmite sin ser formal"]
- [Marca 2] — [por qué: ej. "El balance entre técnico y humano"]
- [Marca 3] — [por qué: ej. "La austeridad visual — nada que sobre"]

---

## Specific UI Moments

<!-- Interacciones, animaciones, o componentes específicos que te gustaron en algún sitio.
     No el sitio completo — el momento exacto. -->

### [Nombre del momento — ej. "Scroll horizontal forzado"]
- **Seen on**: [URL]
- **What it does**: [Descripción funcional — qué pasa técnicamente]
- **Why I want it**: [Para qué sirve en mi sitio]
- **Screenshot**: `assets/ref-[nombre].png`

### [Nombre del momento — ej. "Footer full viewport"]
- **Seen on**: [URL]
- **What it does**: [Descripción]
- **Why I want it**: [Razón]
- **Screenshot**: `assets/ref-[nombre].png`

---

## Screenshots

<!-- Archivos guardados en assets/ con notas de qué te gustó específicamente.
     Formato: assets/ref-[nombre-descriptivo].png -->

- `assets/ref-[nombre].png` — [Qué momento específico muestra y qué te gustó]
- `assets/ref-[nombre].png` — [Descripción]
- `assets/ref-[nombre].png` — [Descripción]

---

## Anti-References

<!-- Sitios o patrones que NO quieres — igual de útiles como referencia negativa.
     Ayudan a no derivar hacia esos territorios sin darse cuenta. -->

- [ej. Sitios con fondo negro puro que se siente pesado]
- [ej. Portfolios con animaciones de entrada en cada elemento]
- [ej. Hero con blob o gradiente detrás del texto]
- [ej. Stacks de mockups de dispositivos que no dicen nada del trabajo]