Il sito corporate comunica identità e valori Italgel attraverso storytelling "Fluid Solutions. Solid Relations": homepage con hero animato, sezione about con 50+ anni storia aziendale (Santa Vittoria d'Alba, Piemonte), showcase prodotti con 4 linee principali (Gelatina, Collagen Peptides, Specialità, Proteine/Grassi Funzionali), pagine prodotto dettagliate con composizione/proprietà/applicazioni/benefici, sezioni applicazioni per settori (Food, Pharma, Health & Wellness, Beauty), qualità e certificazioni (ISO 9001, ISO 22005, HACCP, FSSC 22000, Halal, Kosher, CEP Farmacopea Europea), sostenibilità con KPI (impianto fotovoltaico 2 MW, cogenerazione 2.7 MW, -30% consumo energetico/tonnellata in 10 anni), presenza globale con uffici Italia/Polonia/Giappone e distribuzione 40+ paesi, sezione carriera con offerte lavoro gestite via Payload CMS, whistleblowing, form contatti, e footer con link social/B2B shop. Design responsive, animazioni GSAP scroll-triggered, tipografia Asap + Cocogoose Pro, palette brand Italgel (rosso #c41e3a).

Funzionalità principali

• Homepage hero: claim "Fluid Solutions. Solid Relations.", GSAP animations, scroll-triggered logo transition, menu animato con glass morphism.
• Sezione About: storia aziendale 50+ anni, sede Santa Vittoria d'Alba (Piemonte), evoluzione da vitello/maiale a portafoglio 4 linee prodotto, clienti 40+ paesi.
• Prodotti showcase: 4 categorie (Gelatina, Collagen Peptides, Specialità, Proteine/Grassi Funzionali) con card visive, background color dedicated, link pagine dettaglio.
• Pagine prodotto dettagliate: composizione (origine bovina/suina/ittica, Bloom, viscosità), proprietà fisico-chimiche, applicazioni per settore, benefici tecnici, rich-text descriptions localizzate.
• Applicazioni per settore: Food (Tradition, Bakery, Meat, Dairy, Desserts, Protein Bars), Pharma (Oral Dosage, Soft Capsules), Health & Wellness (Hydrolyzed Collagen, Joint Health, Sports Nutrition), Beauty (avvera™ brand).
• Qualità e certificazioni: sezione dedicata con ISO 9001, ISO 22005, HACCP, FSSC 22000, Halal, Kosher, CEP (Farmacopea Europea EDQM), tracciabilità filiera completa, laboratorio interno.
• Sostenibilità: highlights con KPI (impianto fotovoltaico 2 MW > 2000 MWh/anno, cogenerazione 2.7 MW con recupero termico, -30% consumo energetico/tonnellata ultimi 10 anni), ESG strategy, governance, social responsibility.
• Presenza globale: mappa interattiva con headquarter Santa Vittoria d'Alba (sede + stabilimento), uffici Polonia/Giappone, distribuzione 40+ paesi.
• Carriera: sezione con offerte lavoro gestite via Payload CMS (titolo, descrizione breve, rich-text content, slug), candidatura spontanea protetta (non eliminabile), form applicazione.
• Whistleblowing: pagina dedicata per segnalazioni conformità/compliance.
• Form contatti: form standard con nome, email, messaggio, toast conferme.
• i18n: supporto completo IT/EN con next-intl, traduzioni dinamiche per prodotti/applicazioni/certificazioni, locale switcher navbar.

Data layer e integrazioni

• Payload CMS 3.80 con MongoDB per collezioni (workOffers, media, users).
• tRPC 11 per API type-safe (workOffers).
• Zod 4 per validazioni schema.
• GraphQL per queries Payload.
• Static content hardcoded in traduzioni (
  messages/it.json, messages/en.json) per pagine prodotto/applicazioni/certificazioni.
• RBAC: ruoli admin/editor su Payload collections.

Sicurezza e accessi

• Payload admin protetto (solo users collection).
• RBAC granulare su work offers.
• Hook beforeDelete su workOffers per proteggere candidatura spontanea (non eliminabile se isSpontaneous: true).
• Input validation Zod su form.
• SEO metadata ottimizzati con dynamic generation.

UI/UX e performance

• Tailwind CSS 4 per utility-first styling.
• GSAP per animazioni fluide e scroll-triggered effects (logo navbar transition, parallax, fade-in sections).
• Embla Carousel per gallery prodotti e certificazioni.
• Radix UI per componenti accessibili (Dialog, Navigation Menu, Select).
• Lucide React e React Icons per icone.
• Font stack: Asap (sans-serif body) + Cocogoose Pro (serif headlines).
• Palette brand: primary rosso Italgel (#c41e3a), secondary sandy brown (#f4a460), saddle brown (#8b7355), dark brown (#6b4423).
• Navbar animato con glass morphism, scroll-triggered logo transition, mobile menu slide-in.
• Responsive design mobile-first, lazy loading immagini, ottimizzazione LCP/CLS.

Highlight tecnico

• Next.js 16 + React 19 + TypeScript 5.
• Tailwind CSS 4, Turbopack per dev build veloce.
• Payload CMS 3.80 (MongoDB) per work offers management.
• next-intl 4.5 per i18n completo (IT/EN) con locale-aware routing.
• GSAP per animazioni professionali (scroll-triggered, timeline complex).
• tRPC 11 + React Query 5 per API type-safe.
• Showcase prodotti con 4 linee (Gelatina, Collagen Peptides, Specialità, Proteine/Grassi Funzionali).
• Pagine prodotto dettagliate con composizione/proprietà/applicazioni/benefici.
• Sezioni applicazioni per settori (Food, Pharma, Health, Beauty).
• Qualità e certificazioni (ISO 9001, FSSC 22000, Halal, Kosher, CEP).
• Sostenibilità KPI (fotovoltaico 2 MW, cogenerazione 2.7 MW, -30% consumo).
• Presenza globale 40+ paesi con uffici Polonia/Giappone.
• Carriera con Payload CMS work offers + candidatura spontanea protetta.
• Embla Carousel, Radix UI, Biome + Prettier.
• Pino logging, Sonner toast, Zod validation.