# LovePostal — Brand Context para Agentes

> Pega este archivo (o link a su raw URL) en Lovable, v0, Cursor, Bolt o cualquier agente para darle contexto inmediato de marca y assets disponibles.

## Resumen ejecutivo

**LovePostal** es una marca de papelería / postales con estética cálida y artesanal. Su identidad gira en torno a una paleta terracota (oscura + clara) sobre neutros (crema, blanco, negro). El sistema visual incluye un símbolo (isotipo) y un wordmark, ambos disponibles en múltiples variantes de color y combinaciones para profile pictures.

## Paleta de colores

| Token              | Hex        | Uso recomendado                                                  |
| ------------------ | ---------- | ---------------------------------------------------------------- |
| terracota oscuro   | `#8d4925`  | Color primario · CTAs · texto sobre fondos claros                |
| terracota claro    | `#d97757`  | Color secundario · acentos · hover · gradientes                  |
| crema              | `#f5efe6`  | Fondo principal · superficies                                    |
| crema profundo     | `#ede3d2`  | Fondo de tarjetas · separadores suaves                           |
| negro              | `#1a1a1a`  | Texto · contraste alto                                           |
| blanco             | `#ffffff`  | Sobre terracotas · superficies de cards                          |

> Hex estimados a partir de inspección visual de los assets. Si tienes la guía oficial de marca, sustitúyelos.

## Tipografía sugerida

Si no se especifica desde Brand Manual:

- **Display / títulos:** Georgia · Playfair Display · Cormorant Garamond — algo serif clásico que evoque correspondencia y papelería.
- **Texto:** Inter · SF Pro Text · system-ui — sans neutra para legibilidad.

## Base URL del CDN

```
https://cdn.lovepostal.studio/
```

> Sustituye por tu dominio real al desplegar (Cloudflare R2 / Netlify / S3+CloudFront).

## URLs completas de assets

> Espacios codificados como `%20`. Listo para copiar-pegar.

### PNG — Brand assets

```
https://cdn.lovepostal.studio/PNG/imagotipo_lovepostal_bicolor_1.png
https://cdn.lovepostal.studio/PNG/imagotipo_lovepostal_terracotaoscuro_1.png
https://cdn.lovepostal.studio/PNG/imagotipo_lovepostal_terracotaoscuro_2.png
https://cdn.lovepostal.studio/PNG/imagotipo_lovepostal_terracotaclaro_1.png
https://cdn.lovepostal.studio/PNG/imagotipo_lovepostal_blanco_1.png
https://cdn.lovepostal.studio/PNG/imagotipo_lovepostal_negro_1.png
https://cdn.lovepostal.studio/PNG/isotipo_lovepostal_terracotaoscuro_1.png
https://cdn.lovepostal.studio/PNG/isotipo_lovepostal_terracotaclaro_1.png
https://cdn.lovepostal.studio/PNG/isotipo_lovepostal_blanco_1.png
https://cdn.lovepostal.studio/PNG/isotipo_lovepostal_negro_1.png
https://cdn.lovepostal.studio/PNG/logotipo_lovepostal_terracotaclaro_1.png
```

### Profile pictures (1080×1080, jpg)

```
https://cdn.lovepostal.studio/SOCIAL%20MEDIA%20KIT/PROFILE%20PICTURES/profile_lovepostal_blanco_terracotaoscuro_1.jpg
https://cdn.lovepostal.studio/SOCIAL%20MEDIA%20KIT/PROFILE%20PICTURES/profile_lovepostal_terracotaclaro_terracotaoscuro_1.jpg
https://cdn.lovepostal.studio/SOCIAL%20MEDIA%20KIT/PROFILE%20PICTURES/profile_lovepostal_negro_terracotaoscuro_1.jpg
https://cdn.lovepostal.studio/SOCIAL%20MEDIA%20KIT/PROFILE%20PICTURES/profile_lovepostal_blanco_terracotaclaro_1.jpg
https://cdn.lovepostal.studio/SOCIAL%20MEDIA%20KIT/PROFILE%20PICTURES/profile_lovepostal_terracotaoscuro_terracotaclaro_1.jpg
https://cdn.lovepostal.studio/SOCIAL%20MEDIA%20KIT/PROFILE%20PICTURES/profile_lovepostal_negro_terracotaclaro_1.jpg
https://cdn.lovepostal.studio/SOCIAL%20MEDIA%20KIT/PROFILE%20PICTURES/profile_lovepostal_terracotaclaro_blanco_1.jpg
https://cdn.lovepostal.studio/SOCIAL%20MEDIA%20KIT/PROFILE%20PICTURES/profile_lovepostal_terracotaoscuro_blanco_1.jpg
https://cdn.lovepostal.studio/SOCIAL%20MEDIA%20KIT/PROFILE%20PICTURES/profile_lovepostal_negro_blanco_1.jpg
https://cdn.lovepostal.studio/SOCIAL%20MEDIA%20KIT/PROFILE%20PICTURES/profile_lovepostal_blanco_negro_1.jpg
https://cdn.lovepostal.studio/SOCIAL%20MEDIA%20KIT/PROFILE%20PICTURES/profile_lovepostal_terracotaclaro_negro_1.jpg
https://cdn.lovepostal.studio/SOCIAL%20MEDIA%20KIT/PROFILE%20PICTURES/profile_lovepostal_terracotaoscuro_negro_1.jpg
```

### Open Graph (1200×630, jpg)

```
https://cdn.lovepostal.studio/og-image.jpg
```

Preview:

![og-image](og-image.jpg)

Snippet meta tags listo para `<head>`:

```html
<meta property="og:image" content="https://cdn.lovepostal.studio/og-image.jpg" />
<meta name="twitter:card" content="summary_large_image" />
<meta name="twitter:image" content="https://cdn.lovepostal.studio/og-image.jpg" />
```

## Guía de decisión: qué asset usar dónde

| Contexto                                  | Asset recomendado                                                       | Por qué                                                       |
| ----------------------------------------- | ----------------------------------------------------------------------- | ------------------------------------------------------------- |
| Header sitio (fondo crema/blanco)         | `imagotipo_lovepostal_terracotaoscuro_1.png`                            | Máximo contraste sobre fondos claros                          |
| Header sitio (fondo oscuro / hero gradient) | `imagotipo_lovepostal_blanco_1.png`                                   | Sin halo / contraste limpio                                   |
| Footer mínimo                             | `isotipo_lovepostal_terracotaoscuro_1.png`                              | Solo símbolo, suficiente para refuerzo de marca               |
| Favicon                                   | `isotipo_lovepostal_terracotaoscuro_1.png`                              | Símbolo cuadrado, lectura clara en 16/32px                    |
| Open Graph / Twitter card                 | `og-image.jpg`                                                          | Formato 1200×630 listo                                        |
| Dark mode UI (sidebar, navbar oscuro)     | `imagotipo_lovepostal_blanco_1.png` o `_terracotaclaro_1.png`           | Terracota claro funciona mejor que oscuro en dark mode        |
| Watermark / marca de agua                 | `isotipo_lovepostal_terracotaclaro_1.png` con baja opacidad             | Suave, no distrae                                             |
| WhatsApp Business profile                 | `profile_lovepostal_blanco_terracotaoscuro_1.jpg`                       | Fondo blanco se integra con UI WhatsApp                       |
| Instagram profile                         | `profile_lovepostal_terracotaclaro_blanco_1.jpg` o `_terracotaoscuro_blanco_1.jpg` | Color de marca visible en feed                      |
| Facebook profile                          | `profile_lovepostal_blanco_terracotaoscuro_1.jpg`                       | Lectura clara en thumbnails pequeñas                          |
| TikTok profile                            | `profile_lovepostal_negro_terracotaclaro_1.jpg`                         | TikTok favorece contrastes intensos                           |
| LinkedIn page                             | `profile_lovepostal_blanco_terracotaoscuro_1.jpg`                       | Profesional, neutro                                           |
| YouTube channel icon                      | `profile_lovepostal_terracotaoscuro_blanco_1.jpg`                       | Marca dominante, redonda                                      |
| Email signature                           | `imagotipo_lovepostal_terracotaoscuro_1.png` (max 200px wide)           | Wordmark legible en clientes de correo                        |
| Banner email header                       | `imagotipo_lovepostal_bicolor_1.png`                                    | Variante más rica para marketing                              |
| Print / merch sobre fondo claro           | `imagotipo_lovepostal_negro_1.png`                                      | Negro plano = impresión barata y consistente                  |
| Print / merch sobre fondo oscuro          | `imagotipo_lovepostal_blanco_1.png`                                     | Blanco invertido                                              |

## Snippets listos para usar

### HTML

```html
<!-- Logo header -->
<img src="https://cdn.lovepostal.studio/PNG/imagotipo_lovepostal_terracotaoscuro_1.png"
     alt="LovePostal" width="200" />

<!-- Favicon + Open Graph -->
<link rel="icon" type="image/png"
      href="https://cdn.lovepostal.studio/PNG/isotipo_lovepostal_terracotaoscuro_1.png" />
<meta property="og:image" content="https://cdn.lovepostal.studio/og-image.jpg" />
```

### React / Next.js

```jsx
import Image from "next/image";

<Image
  src="https://cdn.lovepostal.studio/PNG/imagotipo_lovepostal_terracotaoscuro_1.png"
  alt="LovePostal"
  width={200}
  height={52}
  priority
/>
```

### Tailwind tokens (extiende theme)

```js
// tailwind.config.js
module.exports = {
  theme: {
    extend: {
      colors: {
        terracota: {
          DEFAULT: "#8d4925",
          light:   "#d97757",
        },
        crema: {
          DEFAULT: "#f5efe6",
          deep:    "#ede3d2",
        },
      },
    },
  },
};
```

### CSS variables

```css
:root {
  --terracota-oscuro: #8d4925;
  --terracota-claro:  #d97757;
  --crema:            #f5efe6;
  --crema-deep:       #ede3d2;
  --negro:            #1a1a1a;
}
```

## Cómo usar este CDN en Lovable / v0 / Bolt

1. **No subas los assets** al proyecto. Importalos directo desde URL CDN.
2. Pega esta sección entera (paleta + URLs + decision guide) en el system prompt o instrucción inicial del agente.
3. Cuando pidas "agrega el logo", el agente sabrá usar `imagotipo_lovepostal_terracotaoscuro_1.png` del CDN sin tener que cargarlo.
4. Para Lovable específicamente: en el chat dile "usa el CDN definido en agents.md, NO subas imágenes locales".
5. Para v0: incluye las URLs en el prompt del componente; v0 las renderiza directo con `<Image src={url}/>`.