{/* Todo pedaço de arte */}
Todo pedaço de arte nos conta uma história.
setRoute('design')}>Conheça o nosso trabalho
{/* Testimonials */}
A transformação que a Line gera no seu negócio
window.open('https://wa.me/5551989236353?text=Gostaria%20de%20mais%20informa%C3%A7%C3%B5es%20sobre%20os%20servi%C3%A7os%20da%20Line', '_blank')}>Quero solicitar um orçamento!
);
}
// ====== SOCIAL ======
function SocialPage({ setRoute }) {
return (
Presença que permanece, conteúdo que conecta
feed · identidade social
A sua história merece ser contada todos os dias
{`As redes sociais são onde a história da sua empresa acontece. Mas poucos sabem transformá-los em algo que fica. Na Line, cada publicação é pensada para ir além do feed, para criar um laço entre a sua marca e as pessoas que um dia vão escolhê-la.\nDesenvolvemos estratégia de conteúdo, identidade visual para redes sociais, calendário editorial, produção de copies e gestão completa dos perfis. Tudo para que a sua presença digital não seja apenas frequente, mas seja memorável.`}
);
}
// ====== DESIGN ======
function DesignPage({ setRoute }) {
const isMobile = useIsMobile();
const imgStyle = isMobile
? { width: '100%', height: 'auto', display: 'block', borderRadius: '24px' }
: { width: '100%', height: '676px', objectFit: 'cover', borderRadius: '39px' };
return (
Cada peça, uma história para contar.
Design não é só um post bonito.
{`O visual de uma marca é o seu primeiro idioma. Antes de qualquer palavra, é a estética que diz quem você é e se vale a pena ficar.\nCriamos cards estáticos para feed com identidade consistente, carrosséis pensados para engajar, salvar e compartilhar. E para composições que desafiam o ordinário, usamos Manipulação com IA para criar imagens, cenários e elementos únicos que só existem porque foram imaginados primeiro.`}
A sua marca tem o visual que merece?
Para marcas que estão nascendo ou se reinventando, desenvolvemos a Identidade Visual completa.
{[
'idv_angulo.png',
'idv_zuno.png',
'idv_padaria.png',
'idv_flare.png',
].map((file, i, arr) => (
))}
window.open('https://wa.me/5551989236353?text=Quero%20que%20minha%20empresa%20tenha%20um%20design%20que%20permanece', '_blank')}>Quero um design que permanece
setIsHovered(true)}
onMouseLeave={() => setIsHovered(false)}
onClick={() => setIsFullscreen(true)}
style={{
position: 'relative', width: '100%', height: '688px',
borderRadius: '28px', overflow: 'hidden', background: '#0e0e0e',
cursor: 'pointer',
boxShadow: isHovered ? '0 20px 40px rgba(0,0,0,0.2)' : '0 10px 30px rgba(0,0,0,0.1)',
transition: 'all 0.4s ease',
...containerStyle
}}
>
{/* Imagem de Fundo (com animação de zoom) */}
{/* Overlay Escuro ao passar o mouse */}
{/* Ícone de Tela Cheia */}
{/* Tela Cheia Interativa */}
{isFullscreen && (
)}
>
);
}
function SitesPage({ setRoute }) {
const isMobile = useIsMobile();
const siteCardStyle = isMobile ? { height: '220px' } : {};
return (
O seu site à altura do que você entrega.
Um site que conta quem você é antes de você falar
{`Criamos sites institucionais que posicionam e geram credibilidade, landing pages construídas para converter visitantes em clientes, e-commerces pensados para transformar navegação em venda, e portfólios que traduzem visualmente o valor do seu trabalho.\nCada projeto nasce de um briefing profundo e termina em uma entrega que une estética, performance e identidade, criando uma linha que conecta a sua marca a quem a acessa.`}
window.open('https://wa.me/5551989236353?text=Quero%20criar%20um%20site%20que%20me%20representa', '_blank')}>Quero um site que me representa
);
}
// ====== CHATBOT COMPONENT ======
// Substitua pelo valor da sua chave de API — console.anthropic.com
const ANTHROPIC_API_KEY = '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';
const CHAT_SYSTEM_PROMPT = `Você é a Lia, parte da equipe da Line, uma agência de marketing digital em Porto Alegre.
Sobre a Line:
- Serviços: Social Media, Design, Tráfego Pago (Meta Ads / Google Ads), Criação de Sites, Criação de Sistemas, Vídeos e Atendimento por IA
- Contato: WhatsApp 51 9 8923.6353 | comercialine@gmail.com | Instagram @line.produtora
- Em sistemas e IA, a Line trabalha em parceria com a Navena (tecnologia)
Como você escreve:
- Escreve como uma pessoa real digitando numa conversa, sem formalidade
- Português brasileiro natural, às vezes com gírias leves quando cabe
- Respostas curtas e diretas, sem enrolação
- NUNCA usa travessão (esse símbolo: —). Jamais. Use vírgula, ponto ou reescreva a frase
- Sem frases de efeito, sem filosofar, sem encerrar com reflexões bonitas
- Nunca diz "Como uma IA..." ou "Sou programada para..." ou "Como assistente virtual..."
- Não começa respostas com "Claro!", "Certamente!", "Ótima pergunta!", "Com certeza!" ou similares
- Você pode responder QUALQUER pergunta, não só sobre marketing
- Quando falar da Line, faz de forma natural, sem soar como propaganda
- Para orçamentos e valores, diz pra entrar em contato pelo WhatsApp`;
function IAChatBot() {
const [messages, setMessages] = React.useState([
{ role: 'assistant', text: 'Olá, como a Line pode te ajudar hoje?' }
]);
const [input, setInput] = React.useState('');
const [isStreaming, setIsStreaming] = React.useState(false);
const chatWindowRef = React.useRef(null);
const scrollToBottom = () => {
if (chatWindowRef.current) {
chatWindowRef.current.scrollTo({
top: chatWindowRef.current.scrollHeight,
behavior: "smooth"
});
}
};
React.useEffect(() => {
scrollToBottom();
}, [messages]);
const handleSend = async () => {
if (!input.trim() || isStreaming) return;
const userText = input.trim();
const history = [...messages, { role: 'user', text: userText }];
setMessages(history);
setInput('');
setIsStreaming(true);
// Adiciona mensagem vazia do assistente que vai receber o stream
setMessages(prev => [...prev, { role: 'assistant', text: '' }]);
try {
const response = await fetch('https://api.anthropic.com/v1/messages', {
method: 'POST',
headers: {
'Content-Type': 'application/json',
'x-api-key': ANTHROPIC_API_KEY,
'anthropic-version': '2023-06-01',
'anthropic-dangerous-direct-browser-access': 'true',
},
body: JSON.stringify({
model: 'claude-haiku-4-5-20251001',
max_tokens: 500,
system: CHAT_SYSTEM_PROMPT,
stream: true,
messages: history.map(m => ({ role: m.role, content: m.text }))
})
});
if (!response.ok) throw new Error(`${response.status}`);
const reader = response.body.getReader();
const decoder = new TextDecoder();
let accumulated = '';
while (true) {
const { done, value } = await reader.read();
if (done) break;
const lines = decoder.decode(value).split('\n');
for (const line of lines) {
if (!line.startsWith('data: ')) continue;
const data = line.slice(6).trim();
if (!data || data === '[DONE]') continue;
try {
const parsed = JSON.parse(data);
if (parsed.type === 'content_block_delta' && parsed.delta?.text) {
accumulated += parsed.delta.text;
setMessages(prev => {
const updated = [...prev];
updated[updated.length - 1] = { role: 'assistant', text: accumulated };
return updated;
});
scrollToBottom();
}
} catch (_) { /* ignora linhas malformadas */ }
}
}
} catch (err) {
const msg = ANTHROPIC_API_KEY === 'SUA_CHAVE_AQUI'
? 'Configure a chave de API para ativar o chat real.'
: 'Tive um probleminha aqui. Tenta de novo em instantes!';
setMessages(prev => {
const updated = [...prev];
updated[updated.length - 1] = { role: 'assistant', text: msg };
return updated;
});
}
setIsStreaming(false);
};
return (
);
}
// ====== SISTEMAS ======
function SistemasPage({ setRoute }) {
return (
Tecnologia construída do zero para o jeito único que o seu negócio funciona
Um sistema que nasce do seu negócio, não o contrário
{`A maioria das empresas tenta adaptar o seu negócio a um sistema pronto. Na Line em parceria com a Navena, fazemos o inverso e construímos do zero uma solução que se encaixa exatamente na forma como você opera, cresce e pensa.\nDesenvolvemos sistemas de gestão completos como ERPs e CRMs, plataformas web personalizadas para operações específicas, aplicativos mobile que colocam o seu negócio na palma da mão dos seus clientes, e automações e integrações que conectam ferramentas, eliminam processos manuais e fazem o seu time ganhar tempo para o que realmente importa. Cada sistema é único, porque cada negócio é único.`}
dashboard · ERP
Este serviço nasce da união entre duas especialidades. A Line traz o olhar estratégico, a identidade de marca e o posicionamento. A Navena traz a tecnologia, a robustez técnica e a inteligência por trás de cada automação. Juntas, entregamos uma solução que é ao mesmo tempo sofisticada e humana.
window.open('https://wa.me/5551989236353?text=Quero%20um%20sistema%20100%25%20personalizado%20para%20a%20minha%20empresa', '_blank')}>Quero um sistema feito para mim
);
}
// ====== IA ======
function IAPage({ setRoute }) {
const isMobile = useIsMobile();
return (
A sua marca presente em cada conversa, 24 horas por dia.
IA 100% personalizada.
{`Desenvolvemos uma inteligência artificial treinada com a identidade, o tom de voz e os valores da sua marca, para que cada conversa pareça humana, mesmo quando não é.\nA IA atua no WhatsApp, Instagram Direct, chat do site e e-mail. Ela atende e resolve dúvidas, qualifica leads antes de chegarem até você, agenda compromissos automaticamente e conduz vendas até o fechamento. Tudo isso sem perder a essência da sua marca em nenhuma linha.`}
Este serviço nasce da união entre duas especialidades. A Line traz o olhar estratégico, a identidade de marca e o posicionamento. A Navena traz a tecnologia, a robustez técnica e a inteligência por trás de cada automação. Juntas, entregamos uma solução que é ao mesmo tempo sofisticada e humana.
window.open('https://wa.me/5551989236353?text=Quero%20uma%20IA%20100%25%20personalizada%20para%20a%20minha%20empresa', '_blank')}>Quero uma IA personalizada
);
}
// ====== TRÁFEGO PAGO ======
function TrafegoPage({ setRoute }) {
return (
O seu negócio na frente da pessoa certa.
Outdoor Online
{`Começamos pela configuração e estrutura das campanhas, desenhando uma arquitetura sólida no Meta Ads e no Google Ads para que cada centavo trabalhe com precisão.\nA partir daí, cuidamos da gestão e otimização contínua, ajustando, testando e evoluindo em tempo real. Criamos os criativos completos, artes e copies alinhados com a identidade da sua marca e pensados para converter.\nE ao final de cada ciclo, entregamos relatórios detalhados com análise de resultados, para que você entenda exatamente onde a sua marca está crescendo.`}
Pare de aparecer para todo mundo e comece a aparecer para os certos.
window.open('https://wa.me/5551989236353?text=Quero%20criar%20campanhas%20que%20convertem', '_blank')}>Quero campanhas que convertem
);
}
// ====== VÍDEOS ======
function VideosPage({ setRoute }) {
return (
Vídeos que transformam momentos em memória
Instantes gravados para sempre
{`Um vídeo é o instante mais completo que existe, ele carrega imagem, movimento, som e emoção ao mesmo tempo. Na Line, cada produção nasce com um propósito: intenção.\nTudo começa na captação, com a gravação profissional de produtos, ambientes e detalhes que traduzem visualmente a essência da sua marca. Depois vem a edição: montagem, tratamento de cor, trilha sonora, motion e finalização que transformam cenas brutas num conteúdo que prende, emociona e converte.`}
window.open('https://wa.me/5551989236353?text=Quero%20que%20a%20minha%20empresa%20tenha%20v%C3%ADdeos%20com%20inten%C3%A7%C3%A3o', '_blank')}>Quero vídeos com intenção
);
}
// ====== CONTATO (form simples) ======
function ContatoPage({ setRoute }) {
return (
Será um prazer colaborar com você