Como Criar Landing Page /
Página de Vendas com o Claude

Atue como um desenvolvedor web front-end sênior e especialista em conversão.

Quero que você escreva o código completo em um único arquivo, utilizando HTML5 moderno, CSS3 com Flexbox/Grid e JavaScript apenas se necessário para interações simples. O design deve ser moderno, limpo, responsivo e focado em conversão.

1. Informações do produto ou serviço:
[Descreva o objetivo da página]

2. Público-alvo:
[Descreva para quem é a página]

3. Produto ou serviço:
[Explique o que está sendo vendido]

4. Tom da comunicação:
[Ex: moderno, direto, sofisticado, profissional]

5. Cores:
Cor principal: [colocar]
Cor secundária: [colocar]
Cor de fundo: [colocar]

6. Estrutura obrigatória:
Hero Section com headline forte, subtítulo e botão
Benefícios
Seção sobre
Prova social
Oferta ou preço
FAQ
Rodapé

Importante:
O layout deve ser moderno, bonito, responsivo e focado em conversão.

Agora mantenha exatamente o layout que já construímos e faça uma revisão técnica completa no código para deixar essa landing page mais otimizada em SEO, performance, acessibilidade e segurança para publicação.

Importante:
- não altere visualmente a estrutura da página nem descaracterize o design
- preserve a responsividade
- mantenha a LP em HTML e CSS, usando JavaScript apenas se for realmente necessário
- todos os botões da página devem apontar para este link:
https://kit.cursodescomplicandosites.com.br/

Quero que você aplique no código:

SEO
- HTML semântico
- apenas um H1 principal
- hierarquia correta de headings
- title e meta description bem otimizados
- meta robots
- canonical
- Open Graph
- Twitter Card
- alt text estratégico nas imagens
- schema markup em JSON-LD apropriado para página de oferta / produto digital / curso
- estrutura pensada para boa leitura por Google e IAs

Performance
- código mais limpo e enxuto
- otimização do CSS
- remoção do que for desnecessário
- imagens preparadas para boa performance
- lazy loading quando fizer sentido
- boas práticas de Core Web Vitals
- carregamento rápido principalmente no mobile

Acessibilidade
- estrutura clara para leitores de tela
- contraste adequado
- botões e links acessíveis
- atributos ARIA quando necessário

Segurança
Mesmo sendo uma LP estática, aplique as boas práticas possíveis no front-end e me entregue também as recomendações do que precisa ser configurado no servidor/hospedagem, incluindo:
- Content-Security-Policy
- Referrer-Policy
- X-Content-Type-Options
- Permissions-Policy
- uso de rel="noopener noreferrer" onde for necessário

Além disso:
- gere um arquivo llms.txt para acompanhar a LP, com uma versão estruturada da oferta para leitura por IAs
- esse llms.txt deve incluir: nome da oferta, proposta principal, público-alvo, benefícios, o que está incluso, FAQ resumido e CTA com o link principal

Na entrega final, me mostre:
1. o código final atualizado
2. o conteúdo do llms.txt
3. uma lista resumida das melhorias implementadas
4. um bloco separado com as configurações recomendadas no servidor

Crie uma página de obrigado simples e moderna em HTML e CSS.

Objetivo:
Confirmar que a ação foi concluída e orientar o próximo passo.

Elementos:
Mensagem de confirmação
Próximo passo
Botão de ação

Cores:
[mesmas da landing page]

Design consistente com a landing page.

Com base neste arquivo que estou te enviando agora, quero que você faça apenas a preparação dos arquivos para publicação na Hostinger.

Importante:
- não refaça o layout
- não mude a copy
- não altere o design
- não repita a etapa de SEO, performance, acessibilidade e segurança, porque isso já foi feito antes
- use como base exatamente o arquivo que estou enviando agora
- não substitua os links atuais dos botões pelo domínio que vou informar
- o domínio informado serve apenas para configurar publicação, canonical, sitemap, caminhos finais e contexto da hospedagem
- os botões devem continuar com os links que já estão definidos no arquivo, a menos que eu peça alteração específica

O domínio onde a página será publicada é:
[COLE AQUI O DOMÍNIO]

Agora eu quero apenas que você organize e gere os arquivos necessários para subir essa landing page em uma hospedagem da Hostinger.

Sua tarefa é:
1. Preparar a estrutura final dos arquivos para publicação
2. Separar corretamente os arquivos do projeto, deixando tudo pronto para upload na hospedagem
3. Gerar os arquivos finais necessários para colocar a LP no ar, como por exemplo:
- index.html
- style.css, caso o CSS esteja separado
- script.js, apenas se realmente existir necessidade
- llms.txt, caso já faça parte da versão atual
- robots.txt
- sitemap.xml
- .htaccess, se fizer sentido para hospedagem Apache na Hostinger
4. Ajustar os caminhos internos dos arquivos para funcionarem corretamente no domínio informado
5. Garantir que a página abra corretamente quando eu subir os arquivos na Hostinger
6. Manter intactos os links dos botões já existentes no arquivo
7. Me entregar os arquivos completos, cada um separado pelo nome do arquivo antes do código
8. No final, mostrar também a estrutura de pastas final, exatamente como devo organizar os arquivos dentro do gerenciador de arquivos da Hostinger

Também quero que você considere o seguinte:
- se essa LP puder funcionar apenas com index.html e poucos arquivos auxiliares, prefira a estrutura mais simples possível
- se houver imagens ou arquivos externos necessários, identifique claramente onde cada um deve ficar
- se existir alguma configuração importante para o domínio funcionar corretamente com essa LP estática, informe de forma objetiva no final
- mantenha tudo pronto para upload manual na Hostinger, sem depender de frameworks, build ou terminal

No final da resposta, além dos arquivos, me entregue também:
1. a estrutura de pastas final
2. o passo a passo curto de upload na Hostinger
3. qualquer observação importante para eu não errar na publicação