# Talk Pro

Marketing landing page for Talk Pro — a modern messaging app designed for clear, simple, and reliable communication.

## Stack

- [Astro 6](https://astro.build) — static site generator, zero client-side JS
- [UnoCSS](https://unocss.dev) — atomic CSS engine (Tailwind-compatible, faster HMR)
- TypeScript (strict)
- Inter — Google Fonts

## Getting Started

```bash
npm install
npm run dev
```

Open [http://localhost:4321](http://localhost:4321)

## Commands

| Command | Description |
|---------|-------------|
| `npm run dev` | Start dev server at `localhost:4321` |
| `npm run build` | Build for production into `dist/` |
| `npm run preview` | Preview production build locally |

## Project Structure

```
talk-pro/
├── public/
│   └── assets/          # Images downloaded from Figma
├── src/
│   ├── layouts/
│   │   └── Base.astro   # HTML shell, Inter font, meta
│   ├── components/
│   │   ├── Header.astro      # Sticky frosted-glass nav
│   │   ├── Hero.astro        # Hero with phone mockup
│   │   ├── CoreSystem.astro  # 6-feature card grid
│   │   ├── UseCases.astro    # 3 identity cards
│   │   ├── DownloadCTA.astro # Store badges
│   │   └── Footer.astro      # Links + copyright
│   ├── pages/
│   │   └── index.astro  # Composes all sections
│   └── styles/
│       └── global.css
├── uno.config.ts        # Design tokens + UnoCSS config
└── astro.config.mjs
```

## Design Tokens

Defined in `uno.config.ts`:

| Token | Value |
|-------|-------|
| `brand` | `#f28a4b` |
| `text-primary` | `#2e2a28` |
| `text-secondary` | `#7a726d` |
| `surface` | `#f8f3ee` |
| `surface-alt` | `#f2eae3` |
| `surface-footer` | `#efe6de` |
| `border-light` | `#e3d9d1` |

## Assets

Figma assets are stored in `public/assets/`. To re-download them (valid for 7 days from Figma export):

```bash
bash scripts/download-assets.sh
```

## Design Source

Figma: [Talk Pro — Home Page Desktop](https://www.figma.com/design/Gb8WMJ2RLlcZ0bigoiOQx9/Talk-Pro?node-id=9505-537&m=dev)
