# Buda Digital - Marketing Digital Agency

> Agencia de marketing digital especializada en Google Ads, Meta Ads y crecimiento digital en Chile.

## Overview

Buda Digital is a Chilean digital marketing agency website built with Nuxt 3 SSR. The site features public marketing pages (Home, Nosotros, Planes, Contacto, Términos) and an authenticated dashboard for clients to view campaign reports.

## Tech Stack

- **Framework**: Nuxt 3.15.2 (Vue 3, SSR enabled)
- **Styling**: Tailwind CSS + DaisyUI
- **State Management**: Pinia
- **Backend**: PocketBase (https://budadigital.datadiego.dev)
- **Authentication**: PocketBase auth with cookie storage
- **Images**: @nuxt/image for optimization and responsive images
- **Icons**: Nuxt Icon
- **Notifications**: Notiwind
- **SEO**: nuxt-simple-sitemap, nuxt-simple-robots
- **Analytics**: @nuxtjs/web-vitals for Core Web Vitals tracking
- **UI Components**: PrimeVue (Carousel), DaisyUI, vue-recaptcha

## Website Structure

### Public Pages
- **/** - Homepage with hero, services, stats, reviews, and CTAs
- **/nosotros** - About page with team and company information
- **/planes** - Pricing plans (Starter: $500K CLP one-time, PYME: from $300K/mo, Enterprise: custom)
- **/contacto** - Contact form with reCAPTCHA validation
- **/terminos-y-condiciones** - Terms and conditions

### Protected Pages (Auth Required)
- **/dashboard** - Client dashboard to view campaign reports
- **/login** - Authentication page
- **/recuperar-contrasena** - Password recovery

## Key Features

### Performance & SEO
- All images optimized to WebP format (95.9% reduction: 69.4MB → 2.87MB)
- Responsive images via @nuxt/image with automatic srcset
- Lazy loading on below-fold images
- Preconnect hints for external domains (PocketBase, Google Fonts, GTM)
- Core Web Vitals tracking with @nuxtjs/web-vitals
- Mobile-first responsive design
- Structured data with JSON-LD (Organization, WebSite, BreadcrumbList, Offers)
- Comprehensive meta tags and Open Graph properties
- XML sitemap with auth pages excluded
- robots.txt with proper disallow rules

### Mobile Optimization
- All tap targets meet 48x48px minimum (Google Mobile-Friendly compliant)
- Form inputs use 16px font to prevent iOS auto-zoom
- Horizontal scroll prevention with overflow-x: hidden
- Hero image serves smaller versions on mobile
- Responsive stats bar and navigation

### Conversion Optimization (CRO)
- Social proof stats bar (+50 Campañas, +10 Clientes Activos, +$50M en Ads)
- Fixed WhatsApp floating button on all pages
- Improved CTA button copy ("Comenzar Ahora", "Solicitar Plan PYME")
- Trust signals and testimonials
- Clear value propositions

### Brand Identity
- **Colors**: brand-orange (#f97316), brand-yellow, brand-blue, brand-darkblue, brand-lightblue, brand-gray
- **Fonts**: Roboto, Rubik, Outfit (Google Fonts with display: swap)
- **Logo**: /circleless.png (white version: /circleless_white.png)

## Contact Information

- **Website**: https://www.budadigital.cl
- **Email**: contacto@budadigital.cl
- **Phone**: +56 9 9289 8420
- **WhatsApp**: +56 9 9289 8420
- **Address**: Dr Manuel Borgoño 110, Providencia, Región Metropolitana, Chile
- **Facebook**: https://facebook.com/budadigital.cl
- **Instagram**: https://instagram.com/budadigital.cl

## Development

```bash
pnpm dev        # Development server (localhost + network access)
pnpm build      # Production build
pnpm generate   # Static site generation
pnpm preview    # Preview production build
```

## Recent Optimizations (2026-02-20)

- **Phase 1**: Image compression (95.9% reduction)
- **Phase 2**: SEO on-page optimization (meta tags, OG, hreflang)
- **Phase 3**: Schema markup enhancements (JSON-LD structured data)
- **Phase 4**: CRO improvements (stats, WhatsApp, CTAs, trust signals)
- **Phase 5**: Mobile optimization (tap targets, responsive images, overflow fixes)
- **Phase 6**: Technical SEO (web-vitals, preconnect hints, schema validation)

## API & Backend

PocketBase instance at https://budadigital.datadiego.dev manages:
- User authentication and sessions
- Client reports storage
- Contact form submissions
- Terms and conditions content

## For More Details

See llms-full.txt for complete technical documentation, API references, component details, and implementation guides.