[V0_FILE]typescriptreact:file="components/pitch-slide.tsx" isMerged="true" "use client" import { motion } from "framer-motion" import type { ReactNode } from "react" interface PitchSlideProps { children: ReactNode direction?: number } export function PitchSlide({ children, direction = 0 }: PitchSlideProps) { return ( 0 ? 50 : -50, }} animate={{ opacity: 1, x: 0, }} exit={{ opacity: 0, x: direction > 0 ? -50 : 50, }} transition={{ duration: 0.4, ease: [0.22, 1, 0.36, 1], }} > {children} ) } [V0_FILE]typescriptreact:file="components/animated-button.tsx" isMerged="true" "use client" import { motion } from "framer-motion" import { Button } from "@/components/ui/button" import type { ButtonProps } from "@/components/ui/button" import type { ReactNode } from "react" interface AnimatedButtonProps extends ButtonProps { children: ReactNode } export function AnimatedButton({ children, ...props }: AnimatedButtonProps) { return ( ) } [V0_FILE]typescriptreact:file="components/flow-diagram.tsx" isMerged="true" "use client" import { motion } from "framer-motion" import { User, ArrowRight, Heart, TrendingUp } from "lucide-react" export function FlowDiagram() { const steps = [ { icon: User, title: "Perfil Individual", description: "Dados pessoais e objetivos", }, { icon: Heart, title: "Nutricionista", description: "Análise profissional", }, { icon: Heart, title: "Plano Personalizado", description: "Dieta customizada", }, { icon: TrendingUp, title: "Resultados", description: "Acompanhamento contínuo", }, ] return (

{steps.map((step, i) => (

{step.title}

{step.description}

{i < steps.length - 1 && (

)}

))}

) } [V0_FILE]typescriptreact:file="components/stats-card.tsx" isMerged="true" "use client" import { motion } from "framer-motion" import type { LucideIcon } from "lucide-react" interface StatsCardProps { value: string label: string icon: LucideIcon } export function StatsCard({ value, label, icon: Icon }: StatsCardProps) { return (

{value}

{label}

) } [V0_FILE]typescriptreact:file="components/pricing-card.tsx" isMerged="true" "use client" import { motion } from "framer-motion" import { Button } from "@/components/ui/button" import { Check } from "lucide-react" import { AnimatedButton } from "./animated-button" interface PricingCardProps { name: string price: string period: string description: string features: string[] highlighted?: boolean } export function PricingCard({ name, price, period, description, features, highlighted = false }: PricingCardProps) { return ( {highlighted && (

MAIS POPULAR

)}

{name}

{description}

{price}

{period}

{feature}

{highlighted ? ( Começar Agora ) : ( )} ) } [V0_FILE]json:file="package.json" isMerged="true" { "name": "my-v0-project", "version": "0.1.0", "private": true, "scripts": { "dev": "next dev", "build": "next build", "start": "next start", "lint": "eslint ." }, "dependencies": { "@hookform/resolvers": "^3.10.0", "@radix-ui/react-accordion": "1.2.2", "@radix-ui/react-alert-dialog": "1.1.4", "@radix-ui/react-aspect-ratio": "1.1.1", "@radix-ui/react-avatar": "1.1.2", "@radix-ui/react-checkbox": "1.1.3", "@radix-ui/react-collapsible": "1.1.2", "@radix-ui/react-context-menu": "2.2.4", "@radix-ui/react-dialog": "1.1.4", "@radix-ui/react-dropdown-menu": "2.1.4", "@radix-ui/react-hover-card": "1.1.4", "@radix-ui/react-label": "2.1.1", "@radix-ui/react-menubar": "1.1.4", "@radix-ui/react-navigation-menu": "1.2.3", "@radix-ui/react-popover": "1.1.4", "@radix-ui/react-progress": "1.1.1", "@radix-ui/react-radio-group": "1.2.2", "@radix-ui/react-scroll-area": "1.2.2", "@radix-ui/react-select": "2.1.4", "@radix-ui/react-separator": "1.1.1", "@radix-ui/react-slider": "1.2.2", "@radix-ui/react-slot": "1.1.1", "@radix-ui/react-switch": "1.1.2", "@radix-ui/react-tabs": "1.1.2", "@radix-ui/react-toast": "1.2.4", "@radix-ui/react-toggle": "1.1.1", "@radix-ui/react-toggle-group": "1.1.1", "@radix-ui/react-tooltip": "1.1.6", "@vercel/analytics": "1.3.1", "autoprefixer": "^10.4.20", "class-variance-authority": "^0.7.1", "clsx": "^2.1.1", "cmdk": "1.0.4", "date-fns": "4.1.0", "embla-carousel-react": "8.5.1", "input-otp": "1.4.1", "lucide-react": "^0.454.0", "next": "16.0.10", "next-themes": "^0.4.6", "react": "19.2.0", "react-day-picker": "9.8.0", "react-dom": "19.2.0", "react-hook-form": "^7.60.0", "react-resizable-panels": "^2.1.7", "recharts": "2.15.4", "sonner": "^1.7.4", "tailwind-merge": "^3.3.1", "tailwindcss-animate": "^1.0.7", "vaul": "^0.9.9", "zod": "3.25.76", "framer-motion": "12.23.24" }, "devDependencies": { "@tailwindcss/postcss": "^4.1.9", "@types/node": "^22", "@types/react": "^19", "@types/react-dom": "^19", "postcss": "^8.5", "tailwindcss": "^4.1.9", "tw-animate-css": "1.3.3", "typescript": "^5" } } [V0_FILE]typescriptreact:file="components/salary-tier-card.tsx" isMerged="true" "use client" import { motion } from "framer-motion" import { DollarSign, Check } from "lucide-react" interface SalaryTierCardProps { range: string title: string description: string examples: string[] delay?: number } export function SalaryTierCard({ range, title, description, examples, delay = 0 }: SalaryTierCardProps) { return (

{range}

{title}

{description}

Exemplos:

{example}

) } [V0_FILE]typescriptreact:file="app/layout.tsx" isEdit="true" isMerged="true" import type React from "react" import type { Metadata } from "next" import { Figtree, Inter, Geist_Mono } from "next/font/google" import { Analytics } from "@vercel/analytics/next" import "./globals.css" const figtree = Figtree({ subsets: ["latin"], variable: "--font-figtree", weight: ["400", "500", "600", "700"], }) const inter = Inter({ subsets: ["latin"], variable: "--font-inter", }) const geistMono = Geist_Mono({ subsets: ["latin"], variable: "--font-geist-mono", weight: ["400", "500", "600"], }) export const metadata: Metadata = { title: "Janutri - Nutrição Corporativa por Especialistas", description: "Dietas personalizadas por nutricionistas que reduzem faltas e aumentam produtividade. Onboarding em 72h com ROI garantido.", generator: "v0.app", keywords: ["nutrição corporativa", "saúde corporativa", "bem-estar empresarial", "ROI", "produtividade"], icons: { icon: [ { url: "/icon-light-32x32.png", media: "(prefers-color-scheme: light)", }, { url: "/icon-dark-32x32.png", media: "(prefers-color-scheme: dark)", }, { url: "/icon.svg", type: "image/svg+xml", }, ], apple: "/apple-icon.png", }, } export default function RootLayout({ children, }: Readonly<{ children: React.ReactNode }>) { return ( {children} ) } [V0_FILE]css:file="app/globals.css" isEdit="true" isMerged="true" @import "tailwindcss"; @import "tw-animate-css"; @custom-variant dark (&:is(.dark *)); :root { --background: hsl(0 0% 100%); --foreground: hsl(222.2 84% 4.9%); --card: hsl(0 0% 100%); --card-foreground: hsl(222 47% 11%); --popover: hsl(0 0% 100%); --popover-foreground: hsl(222 47% 11%); --primary: hsl(221.2 83.2% 53.3%); --primary-foreground: hsl(0 0% 100%); --secondary: hsl(210 40% 96%); --secondary-foreground: hsl(222 47% 11%); --muted: hsl(210 40% 96%); --muted-foreground: hsl(215 16% 47%); --accent: hsl(210 40% 96%); --accent-foreground: hsl(222 47% 11%); --destructive: hsl(0 84.2% 60.2%); --destructive-foreground: hsl(0 0% 100%); --border: hsl(214.3 31.8% 91.4%); --input: hsl(214.3 31.8% 91.4%); --ring: hsl(221.2 83.2% 53.3%); --radius: 0.75rem; --sidebar: hsl(0 0% 98%); --sidebar-foreground: oklch(0.145 0 0); --sidebar-primary: oklch(0.205 0 0); --sidebar-primary-foreground: oklch(0.985 0 0); --sidebar-accent: oklch(0.97 0 0); --sidebar-accent-foreground: oklch(0.205 0 0); --sidebar-border: oklch(0.922 0 0); --sidebar-ring: oklch(0.708 0 0); } .dark { --background: hsl(222 47% 11%); --foreground: hsl(0 0% 98%); --card: hsl(222 47% 15%); --card-foreground: hsl(0 0% 98%); --popover: hsl(222 47% 15%); --popover-foreground: hsl(0 0% 98%); --primary: hsl(172 66% 50%); --primary-foreground: hsl(222 47% 11%); --secondary: hsl(217 33% 17%); --secondary-foreground: hsl(0 0% 98%); --muted: hsl(217 33% 17%); --muted-foreground: hsl(215 20% 65%); --accent: hsl(217 33% 17%); --accent-foreground: hsl(0 0% 98%); --destructive: hsl(0 84% 60%); --destructive-foreground: hsl(0 0% 98%); --border: hsl(217 33% 25%); --input: hsl(217 33% 25%); --ring: hsl(172 66% 50%); --chart-1: oklch(0.488 0.243 264.376); --chart-2: oklch(0.696 0.17 162.48); --chart-3: oklch(0.769 0.188 70.08); --chart-4: oklch(0.627 0.265 303.9); --chart-5: oklch(0.645 0.246 16.439); --sidebar: oklch(0.205 0 0); --sidebar-foreground: oklch(0.985 0 0); --sidebar-primary: oklch(0.488 0.243 264.376); --sidebar-primary-foreground: oklch(0.985 0 0); --sidebar-accent: oklch(0.269 0 0); --sidebar-accent-foreground: oklch(0.985 0 0); --sidebar-border: oklch(0.269 0 0); --sidebar-ring: oklch(0.439 0 0); } @theme inline { --font-sans: "Figtree", "Figtree Fallback", system-ui, sans-serif; --font-mono: "Geist Mono", "Geist Mono Fallback", monospace; --color-background: var(--background); --color-foreground: var(--foreground); --color-card: var(--card); --color-card-foreground: var(--card-foreground); --color-popover: var(--popover); --color-popover-foreground: var(--popover-foreground); --color-primary: var(--primary); --color-primary-foreground: var(--primary-foreground); --color-secondary: var(--secondary); --color-secondary-foreground: var(--secondary-foreground); --color-muted: var(--muted); --color-muted-foreground: var(--muted-foreground); --color-accent: var(--accent); --color-accent-foreground: var(--accent-foreground); --color-destructive: var(--destructive); --color-destructive-foreground: var(--destructive-foreground); --color-border: var(--border); --color-input: var(--input); --color-ring: var(--ring); --color-chart-1: var(--chart-1); --color-chart-2: var(--chart-2); --color-chart-3: var(--chart-3); --color-chart-4: var(--chart-4); --color-chart-5: var(--chart-5); --radius-sm: calc(var(--radius) - 4px); --radius-md: calc(var(--radius) - 2px); --radius-lg: var(--radius); --radius-xl: calc(var(--radius) + 4px); --color-sidebar: var(--sidebar); --color-sidebar-foreground: var(--sidebar-foreground); --color-sidebar-primary: var(--sidebar-primary); --color-sidebar-primary-foreground: var(--sidebar-primary-foreground); --color-sidebar-accent: var(--sidebar-accent); --color-sidebar-accent-foreground: var(--sidebar-accent-foreground); --color-sidebar-border: var(--sidebar-border); --color-sidebar-ring: var(--sidebar-ring); } @layer base { * { @apply border-border outline-ring/50; } body { @apply bg-background text-foreground; } } @keyframes fade-in-up { from { opacity: 0; transform: translateY(20px); } to { opacity: 1; transform: translateY(0); } } .animate-fade-in-up { animation: fade-in-up 0.8s ease-out forwards; } [V0_FILE]typescriptreact:file="components/navbar.tsx" isMerged="true" "use client" import { Button } from "@/components/ui/button" import { Activity } from "lucide-react" export function Navbar() { const scrollToSection = (id: string) => { document.getElementById(id)?.scrollIntoView({ behavior: "smooth" }) } return (

Janutri

) } [V0_FILE]typescriptreact:file="components/stats-section.tsx" isMerged="true" "use client" import { TrendingUp, Clock, DollarSign, Users } from "lucide-react" import { motion } from "framer-motion" export function StatsSection() { const stats = [ { value: "27%", label: "Redução de Absenteísmo", icon: TrendingUp, }, { value: "72h", label: "Implantação Rápida", icon: Clock, }, { value: "R$ 9,99", label: "A partir de", icon: DollarSign, }, { value: "2.500+", label: "Colaboradores Atendidos", icon: Users, }, ] return (

{stats.map((stat, i) => (

{stat.value}

{stat.label}

))}

) } [V0_FILE]typescriptreact:file="components/problem-section.tsx" isMerged="true" "use client" import { TrendingUp, DollarSign, Users, Heart } from "lucide-react" import { motion } from "framer-motion" export function ProblemSection() { const problems = [ { icon: TrendingUp, title: "Alto Absenteísmo", description: "Má alimentação resulta em mais faltas, consultas médicas e afastamentos, impactando diretamente a produtividade", }, { icon: DollarSign, title: "Custos com Saúde", description: "Planos de saúde corporativos sobem de preço devido a doenças relacionadas à alimentação inadequada", }, { icon: Users, title: "Baixa Performance", description: "Colaboradores sem energia adequada têm menor foco, criatividade e capacidade de resolver problemas", }, { icon: Heart, title: "Retenção de Talentos", description: "Empresas que investem no bem-estar têm 40% menos turnover e colaboradores mais engajados", }, ] return (

O Custo da Má Alimentação

Empresas Perdem Milhões por Ano

{problems.map((problem, i) => (

{problem.title}

{problem.description}

))}

) } [V0_FILE]typescriptreact:file="components/implementation-section.tsx" isMerged="true" "use client" import { Shield, Users, Heart, Zap, Check } from "lucide-react" import { motion } from "framer-motion" export function ImplementationSection() { const steps = [ { day: "Dia 1", title: "Kickoff", description: "Reunião inicial, configuração da plataforma e integração com sistemas existentes", icon: Shield, }, { day: "Dia 2", title: "Cadastro", description: "Colaboradores preenchem perfil nutricional e preferências alimentares", icon: Users, }, { day: "Dia 3", title: "Análise", description: "Nutricionistas avaliam perfis e criam planos personalizados", icon: Heart, }, { day: "Dia 4", title: "Lançamento", description: "Dietas disponibilizadas e acompanhamento contínuo iniciado", icon: Zap, }, ] const integration = [ "Sincronização com sistemas de RH existentes", "Acesso via aplicativo e web para colaboradores", "Painel executivo com métricas em tempo real", "Relatórios mensais de impacto e ROI", ] const support = [ "Gerente de conta exclusivo", "Suporte técnico via chat e e-mail", "Treinamento para equipe de RH", "Materiais de comunicação interna prontos", ] return (

Implementação Simples

Implantação em Apenas 72 Horas

Nossa equipe cuida de tudo. Seu time só precisa se cadastrar e começar

{steps.map((step, i) => (

{step.day}

{step.title}

{step.description}

{i < 3 &&

} ))}

Integração Completa

{item}

Suporte Dedicado

{item}

) } [V0_FILE]typescriptreact:file="components/testimonials-section.tsx" isMerged="true" "use client" import { Users } from "lucide-react" import { motion } from "framer-motion" export function TestimonialsSection() { const testimonials = [ { company: "Tech Solutions S.A.", size: "250 colaboradores", result: "32% redução em faltas", quote: "Em 4 meses, vimos uma transformação impressionante no engajamento e energia da equipe.", author: "Maria Silva, Diretora de RH", }, { company: "Indústria Forte Ltda.", size: "500 colaboradores", result: "R$ 180k economia/ano", quote: "O ROI superou nossas expectativas. Janutri se pagou em menos de 2 meses.", author: "João Santos, CFO", }, { company: "Consultoria Prime", size: "120 colaboradores", result: "41% mais produtividade", quote: "Nosso NPS interno subiu 28 pontos após implementar nutrição com a Janutri.", author: "Ana Costa, CEO", }, ] const stats = [ { value: "2.500+", label: "Colaboradores Atendidos" }, { value: "95%", label: "Taxa de Satisfação" }, { value: "50+", label: "Empresas Parceiras" }, { value: "12x", label: "ROI Médio em 1 Ano" }, ] return (

Casos de Sucesso

Empresas que Já Transformaram Resultados

{testimonials.map((client, i) => (

{client.company}

{client.size}

{client.result}

"{client.quote}"

— {client.author}

))}

{stats.map((stat, i) => (

{stat.value}

{stat.label}

))}

) } [V0_FILE]typescriptreact:file="components/cta-section.tsx" isMerged="true" "use client" import { Button } from "@/components/ui/button" import { ArrowRight } from "lucide-react" import { motion } from "framer-motion" export function CTASection() { return (

Pronto para Transformar Sua Empresa?

Solicite uma demonstração personalizada e descubra como a Janutri pode reduzir custos e aumentar a produtividade da sua equipe

) } [V0_FILE]typescriptreact:file="components/animated-bars.tsx" isMerged="true" "use client" import { motion } from "framer-motion" import { useEffect, useState } from "react" export function AnimatedBars() { const [isClient, setIsClient] = useState(false) useEffect(() => { setIsClient(true) }, []) // Create 20 bars with random heights and positions const bars = Array.from({ length: 20 }, (_, i) => ({ id: i, height: Math.random() * 200 + 100, delay: Math.random() * 2, duration: Math.random() * 3 + 2, x: (i / 20) * 100, })) if (!isClient) { return

} return (

{bars.map((bar) => (

{/* Dot on top */} {/* Bar */}

))}

) } [V0_FILE]typescriptreact:file="app/page.tsx" isEdit="true" isMerged="true" import { HeroSection } from "@/components/hero-section" import { StatsSection } from "@/components/stats-section" import { ProblemSection } from "@/components/problem-section" import { SolutionSection } from "@/components/solution-section" import { ROISection } from "@/components/roi-section" import { ImplementationSection } from "@/components/implementation-section" import { TestimonialsSection } from "@/components/testimonials-section" import { PricingSection } from "@/components/pricing-section" import { SalaryTiersSection } from "@/components/salary-tiers-section" import { CTASection } from "@/components/cta-section" import { Navbar } from "@/components/navbar" export default function PitchDeck() { return (

) } [V0_FILE]typescriptreact:file="components/hero-section.tsx" isEdit="true" isQuickEdit="true" isMerged="true" "use client" import { Button } from "@/components/ui/button" import { ArrowRight, Activity } from "lucide-react" import { motion } from "framer-motion" import Image from "next/image" export function HeroSection() { const scrollToSection = (id: string) => { document.getElementById(id)?.scrollIntoView({ behavior: "smooth" }) } return (

{/* Left Content Container */}

Menos que um estacionamento por mês

Dietas por Nutricionistas que Transformam Empresas

Reduzimos faltas e aumentamos produtividade através de planos nutricionais personalizados desenvolvidos por especialistas.

{/* Right Image Container */} Profissional usando aplicativo Janutri em ambiente corporativo moderno

) } [V0_FILE]typescriptreact:file="components/solution-section.tsx" isEdit="true" isQuickEdit="true" isMerged="true" "use client" import { motion } from "framer-motion" import { ArrowRight } from 'lucide-react' import { AnimatedBars } from "./animated-bars" export function SolutionSection() { const stats = [ { value: "500+", label: "Dietas personalizadas criadas mensalmente", }, { value: "98%", label: "Taxa de satisfação dos colaboradores", }, { value: "100%", label: "Nutricionistas certificados pelo CRN", }, { value: "30+", label: "Empresas transformadas", }, ] return (

Nossa Solução

{/* Left side - Content */}

Nutricionistas Especialistas + Tecnologia Inteligente

Combinamos a expertise de nutricionistas certificados pelo CRN com algoritmos personalizados para criar dietas que realmente funcionam para cada colaborador.

{/* Right side - Animated Visualization */}

{/* Stats Grid */} {stats.map((stat, i) => (

{stat.value}

{stat.label}

))}

) } [V0_FILE]typescriptreact:file="components/roi-section.tsx" isEdit="true" isMerged="true" "use client" import { Check, DollarSign } from 'lucide-react' import { motion } from "framer-motion" export function ROISection() { const benefits = [ { text: "Até 27% de redução no absenteísmo", source: "Fonte: Estudo ABRH 2023" }, { text: "Redução de 18% nos custos com plano de saúde", source: "Fonte: Análise ANS 2024", }, { text: "Aumento de 23% na produtividade relatada", source: "Fonte: Survey interno colaboradores", }, { text: "Melhoria de 31% no bem-estar geral", source: "Fonte: Indicadores de saúde OMS" }, ] return (

Retorno sobre Investimento

Resultados Comprovados em 3 Meses

Dados baseados em estudos da OMS, pesquisas de saúde corporativa e resultados de clientes

Benefícios Mensuráveis

{benefit.text}
{benefit.source}

Investimento

A partir de R$ 9,99

por colaborador/mês

Menos que um estacionamento por mês

) } [V0_FILE]typescriptreact:file="components/salary-tiers-section.tsx" isEdit="true" isQuickEdit="true" isMerged="true" "use client" import { DollarSign, Check, Heart, Target, Users, Shield, Sparkles } from 'lucide-react' import { motion } from "framer-motion" export function SalaryTiersSection() { const features = [ { icon: Target, title: "Análise Personalizada", description: "Cada colaborador recebe um plano nutricional adaptado à sua realidade", }, { icon: Users, title: "100% Inclusivo", description: "Todos os níveis salariais têm acesso a orientação nutricional de qualidade", }, { icon: Sparkles, title: "Variedade e Sabor", description: "Cardápios diversificados e saborosos, independente do orçamento", }, { icon: Shield, title: "Adesão Garantida", description: "Planos viáveis financeiramente resultam em maior engajamento", }, ] return (

Inclusão e Acessibilidade

Cardápios Adequados a Cada Realidade

Nossos nutricionistas criam planos personalizados considerando a faixa salarial de cada colaborador

{/* Decorative background */}

Nutrição Saudável para Todos

Acreditamos que alimentação saudável não é privilégio. Nossos nutricionistas garantem que cada colaborador, independente da faixa salarial, tenha acesso a um plano nutricional equilibrado, saboroso e adequado à sua realidade financeira.

{features.map((feature, i) => (

{feature.title}

{feature.description}

))}

) } [V0_FILE]typescriptreact:file="components/pricing-section.tsx" isEdit="true" isQuickEdit="true" "use client" import { Check } from 'lucide-react' import { Button } from "@/components/ui/button" import { motion } from "framer-motion" export function PricingSection() { const essentialFeatures = [ "Dietas personalizadas por nutricionistas", "Um ajuste mensal no plano alimentar", "Painel de acompanhamento", "Suporte por e-mail", "Implantação em 72h", ] const premiumFeatures = [ "Dietas personalizadas avançadas", "Uma consulta mensal com nutricionistas", "Ajuste mensal detalhado da dieta", "Painel executivo completo", "Suporte prioritário por chat", "Relatórios personalizados", ] const plans = [ { name: "Essencial", price: "R$ 9,99", period: "por colaborador/mês", description: "Ideal para empresas iniciando na nutrição corporativa", features: essentialFeatures, highlighted: false, }, { name: "Premium", price: "R$ 19,99", period: "por colaborador/mês", description: "Para empresas que buscam máxima performance", features: premiumFeatures, essentialFeatures: essentialFeatures, highlighted: true, }, ] return (

Comece Agora

Escolha o Plano Ideal para Sua Empresa

Condições especiais de lançamento válidas por tempo limitado

{plans.map((plan, i) => ( {plan.highlighted && (

Mais Popular

)}

{plan.name}

{plan.description}

{plan.price}

{plan.period}

Inclui recursos do Essencial
{feature}
+ Recursos Premium
{feature}

))}

Oferta de Lançamento: 20% OFF nos primeiros 3 meses

Válido para novos contratos fechados até o final do mês

) }

About

Tags

Share

More Templates Like This

About

Tags

Share

About

Tags

Share

More Templates Like This