Adicionar Funcionalidade

Funcionalidade.md

@@ -0,0 +1,117 @@
+# README — Landing Page Banda Larga
+
+## 1. Visão Geral
+
+Este projeto consiste em uma landing page para venda de planos de banda larga residencial e empresarial.
+
+A implementação contempla:
+
+- Segmentação entre planos residenciais e empresariais
+- Integração com formulários FormCraft
+- Persistência de dados entre páginas
+- Responsividade para diferentes dispositivos
+- Navegação com smooth scroll
+- Ajustes personalizados em JavaScript e CSS
+
+---
+
+# 2. Estrutura Geral da Página
+
+A landing page é composta pelas seguintes seções:
+
+- Sliders com imagens de Banda Larga Residencial e Empresarial
+- Seção de planos residenciais
+- Seção de planos empresariais
+- Página de formulário de viabilidade
+- Página de formulário de contratação
+
+Os planos são organizados em duas categorias principais:
+
+- Residencial
+- Empresarial
+
+---
+
+# 3. Segmentação de Planos
+
+Foi implementado um sistema de identificação automática do tipo de plano selecionado pelo usuário.
+
+## Funcionalidades
+
+- Banner individual para cada plano utilizando HTML e CSS
+- Captura de clique nos botões de planos
+- Salvamento das informações para a página de viabilidade
+- Identificação automática do tipo de plano escolhido
+
+---
+
+# 4. Seleção Automática de Plano no Formulário
+
+O sistema realiza a pré-seleção automática do plano escolhido anteriormente pelo usuário.
+
+## Funcionalidades
+
+- Localização dinâmica do input correspondente ao plano
+- Marcação automática do plano selecionado
+- Disparo de eventos para integração com o FormCraft
+
+---
+
+# 5. Integração com FormCraft
+
+A landing page utiliza formulários desenvolvidos com o plugin FormCraft.
+
+## Ajustes realizados
+
+- Atualização das configurações do FormCraft
+- JavaScript adicional para alterar posicionamento e fluxo do formulário de viabilidade
+- Persistência do plano escolhido entre as páginas 1, 2 e 3 utilizando cache/local storage
+
+---
+
+# 6. Responsividade
+
+A aplicação foi otimizada para diferentes resoluções de tela.
+
+## Breakpoints principais
+
+| Dispositivo | Resolução |
+|---|---|
+| Desktop | > 1024px |
+| Tablet | 768px – 1024px |
+| Mobile | < 480px |
+
+## Problemas tratados
+
+- Controle de altura de campos customizados
+- Correções de comportamento em dispositivos móveis
+- Conflitos entre `flex-wrap` e altura fixa
+- Sobreposição de elementos em mobile
+- Ajustes de headings em telas pequenas
+
+---
+
+# 7. Smooth Scroll
+
+Foi implementado um sistema de rolagem suave para melhorar a navegação entre seções da página.
+
+## Características
+
+- Offset dinâmico para compensar header fixo
+- Controle de duração da animação
+- Ajuste automático de posicionamento
+
+---
+
+# 8. Tecnologias Utilizadas
+
+- HTML5
+- CSS3
+- JavaScript 
+- WordPress
+
+---
+
+# 9. Conclusão
+
+A landing page de banda larga foi estruturada para suportar múltiplos tipos de planos, integração com formulários dinâmicos e responsividade.