# Sapori di Calabria — E-commerce Demo · PixelArtsLab

Demo di un **e-commerce di prodotti tipici calabresi** ('nduja di Spilinga, cipolla rossa di Tropea IGP, confettura di bergamotto, pecorino del Monte Poro DOP, caciocavallo Silano, vino Cirò DOC, cofanetti regalo) da 36 aziende familiari delle cinque province della Calabria.

Sito **dimostrativo** realizzato da **PixelArtsLab** per il portfolio: non è un'attività reale. Bottega, produttori, indirizzi e prezzi sono di fantasia.

🔗 **Anteprima**: apri `index.html` nel browser, oppure lancia un server locale:

```bash
cd sapori-calabria
python -m http.server 8000     # oppure: npx serve .
```

## Struttura (single-page)

| Sezione | Ancora | Contenuto |
|---|---|---|
| Marquee + Header | — | Barra scorrevole, nav sticky, toggle lingua IT/EN, carrello |
| Hero | `#top` | Titolo, stats, collage di immagini, chip prodotto, timbro |
| Categorie | `#categorie` | 6 categorie in scroller orizzontale con conteggio prodotti |
| Shop | `#prodotti` | **14 prodotti**, filtro per categoria, card con badge (DOP/IGP/DOC/Novità/Bestseller) |
| Scheda prodotto | modale | Provenienza, produttore, abbinamenti, conservazione, quantità |
| Territorio | `#territorio` | La Calabria in 5 province |
| Produttori | `#produttori` | 4 schede con foto e citazioni |
| Ricette | `#ricette` | 3 ricette della tradizione con link ai prodotti |
| FAQ | `#faq` | Accordion (spedizioni, produttori, 'nduja, regali, resi) |
| Newsletter | — | Form iscrizione simulato |
| Contatti | `#contatti` | Form con validazione + info bottega |
| Carrello | drawer | Quantità, subtotale, barra spedizione gratuita, checkout simulato |

## Caratteristiche

- 🌐 **Multilingua IT/EN** — tutti i testi statici via `data-i18n`, i dati di catalogo bilingui (`{ it, en }`). La scelta si salva in `localStorage` (`sapori-lang`) e tutto il sito si ri-renderizza al cambio lingua.
- 🛒 **Carrello a drawer front-end** — aggiungi/rimuovi prodotti, modifica quantità, subtotale e spedizione in tempo reale, salvataggio in `localStorage` (`sapori-calabria-cart`). Spedizione **gratuita sopra i 79 €** con barra di avanzamento. Nessun pagamento reale: il checkout è una simulazione dimostrativa.
- 🗂 **14 prodotti reali** (nomi, provenienze e formati specifici), 6 categorie, badge DOP/IGP/DOC.
- 🎨 **Identità visiva «Calabria»** — palette peperoncino `#9e1b24` / oliva scura `#1d241f` / bergamotto `#e8a33d`, font Prata + Jost, marquee animato, timbro circolare, chip galleggianti.
- 📱 **Completamente responsive** — menu hamburger mobile, griglie adattive, scroller orizzontali.
- ♿ Accessibilità: skip-link, focus visibile, `aria-label`, `aria-live`, `prefers-reduced-motion`.
- 📄 Convenzioni portfolio: badge **«Sito demo — PixelArtsLab»** fisso, `<meta name="robots" content="noindex, nofollow">`, disclaimer nei form.

## Struttura file

```
sapori-calabria/
├── index.html          # Single-page: tutte le sezioni
├── css/
│   └── style.css       # Design system (variabili, componenti, responsive)
├── js/
│   ├── i18n.js          # Dizionari IT/EN + API lingua
│   ├── data.js          # Shop, 6 categorie, 14 prodotti, produttori, ricette, FAQ
│   ├── cart.js          # Carrello: localStorage, badge, toast, drawer, checkout
│   └── main.js          # Render dinamici, filtri, modale, form, accordion
└── README.md
```

## Tecnologie

HTML5, CSS3 (custom properties, grid, flexbox, animazioni), JavaScript vanilla. Nessun framework, nessuna dipendenza.

## Personalizzazione rapida

- **Prodotti e prezzi**: `js/data.js` (tutti i campi testuali sono bilingui)
- **Colori e font**: variabili CSS in cima a `css/style.css`
- **Soglia spedizione gratuita**: `freeShippingThreshold` in `js/data.js`
- **Testi dell'interfaccia**: dizionari `it` / `en` in `js/i18n.js`