FEAT

Adicionei o JS individual de cada banda larga e atualizei o JS principal com uma função para salvar o plano escolhido

teste/BandaEmpresarial/empresarial.js

@@ -0,0 +1,23 @@
+// form com os banner empresarial
+document.addEventListener("click", function (e) {
+  const btn = e.target.closest("a[id^='btn-plano-']");
+  if (!btn) return;
+
+  e.preventDefault();
+
+  // descobre se é residencial ou empresarial
+  const isEmpresa = btn.closest("#planos-empresa");
+  const tipo = isEmpresa ? "empresarial" : "residencial";
+
+  const plano = btn.id.replace("btn-plano-", "");
+
+  sessionStorage.setItem(
+    "planoSelecionado",
+    JSON.stringify({
+      tipo,
+      plano,
+    })
+  );
+
+  window.location.href = "https://bandalarga.srv.br/form-viabilidade/" + Date.now();
+});

teste/BandaResidencial/residencial.js

@@ -0,0 +1,29 @@
+// form com os banner residencial
+document.addEventListener("click", function (e) {
+  const planoMap = {
+    "btn-plano-100-mega": "100-mega",
+    "btn-plano-200-mega": "200-mega",
+    "btn-plano-500-mega": "500-mega",
+    "btn-plano-700-mega": "700-mega",
+    "btn-plano-1-gb": "1-gb",
+  };
+
+  const btn = e.target.closest("a[id^='btn-plano-']");
+  if (!btn) return;
+
+  e.preventDefault();
+
+  const plano = planoMap[btn.id];
+
+  // salva no sessionStorage
+  sessionStorage.setItem(
+    "planoSelecionado",
+    JSON.stringify({
+      tipo: "residencial", // aqui você pode adaptar depois pro empresarial
+      plano: plano,
+    })
+  );
+
+  //redireciona
+  window.location.href = "https://bandalarga.srv.br/form-viabilidade/"; 
+});

teste/index.js

@@ -52,11 +52,38 @@ function isVisible(el) {
   );
 }
 
+// form de viabilidade
+function aplicarPlanoSelecionado() {
+  const planoData = JSON.parse(sessionStorage.getItem("planoSelecionado"));
+  if (!planoData) return;
+
+  console.log("[LP] Plano recebido:", planoData);
+
+  // 1. Seleciona tipo (residencial / empresarial)
+  if (planoData.tipo === "residencial") {
+    selecionarTipoPlano("plano-residencia");
+  } else {
+    selecionarTipoPlano("plano-empresa");
+  }
+
+  // 2. Seleciona plano
+  selecionarPlano(planoData.plano);
+
+  // 3. (opcional) mostrar mensagem
+  setPlanoSelecionadoTexto(planoValueToLabel(planoData.plano));
+}
+
+window.addEventListener("load", () => {
+  setTimeout(() => {
+    aplicarPlanoSelecionado();
+  }, 500);
+});
+
 function scrollToAssinar({ offset = 250, duration = 500, tries = 40 } = {}) {
   // ✅ seu wrapper real é .form-element-field8
   // Tentamos pegar o botão dentro dele; se não achar, rola até o wrapper mesmo
   const selector =
-    '.form-element-field8 button, .form-element-field8 input[type="button"], .form-element-field8 input[type="submit"], .form-element-field8';
+    '.form-element-field8 button, .form-element-field8 input[type="button"], .form-element-field8 input[type="submit"], .form-element-field';
 
   let attempt = 0;
 
@@ -96,7 +123,6 @@ function scrollToPlanosById(id, offset = 220, duration = 500) {
   });
 }
 
-
 const cepInput = document.querySelector('[name="field6[]"]');
 const numeroInput = document.querySelector('[name="field7[]"]');
 const nomeInput = document.querySelector('[name="field3[]"]');
@@ -224,7 +250,7 @@ async function consultarCep() {
 
 (function () {
   function initFormCache() {
-    const form = document.querySelector(".fc-form-23"); // ajuste se tiver mais de um formulário
+    const form = document.querySelector(".fc-form-33"); // ajuste se tiver mais de um formulário
 
     console.log("FormCraft cache: init chamado. Form encontrado?", !!form);
     if (!form) return;
@@ -270,7 +296,7 @@ async function consultarCep() {
 // Função para consultar viabilidade ao clicar no botão
 document.addEventListener("click", function (e) {
   const btn = e.target.closest("#consulta-viabilidade");
-  const boxResultado = document.querySelector(".form-element-field23");
+  const boxResultado = document.querySelector(".form-element-field37");
   if (!btn) return;
   e.preventDefault();
   if (isProcessing) return;
@@ -298,9 +324,7 @@ function showResultField() {
 
   const temosBandaLargaTitle = document.querySelector(".form-element-field23");
   const temosBandaLargaBox = document.querySelector(".form-element-field24");
-  const naoTemosBandaLargaTitle = document.querySelector(
+  const naoTemosBandaLargaTitle = document.querySelector(".form-element-field33",);
-    ".form-element-field33",
-  );
   const errorBox = document.querySelector(".form-element-field32");
   const camposNaoPreenchidos = document.querySelector(".form-element-field36");
 

teste/style.css

@@ -14,15 +14,20 @@
             background-color: #1d6570 !important;
 }
 
-.form-element-field10 {
+.form-element-field24 {
     margin-bottom: 500px;
 }
 
-.form-element-field45 {
+.form-element-field25,
+.form-element-field34 {
+    margin-bottom: 500px;
+}
+
+.form-element-field8 {
     margin-bottom: 50px;
 }
 
-.form-element-field45 button {
+.form-element-field8 button {
             padding: 9px 20px !important;
             background-color: #31a3b5 !important;
             color: white !important;
@@ -33,7 +38,7 @@
     
 }
 
-.form-element-field34 span, .form-element-field36 span {
+.form-element-field32 span, .form-element-field33 span {
      color:#dd3333 !important;
 }
 
@@ -52,7 +57,7 @@
             width: 50%;
             border: 1px solid gray;
             border-radius: 20px;
-            height: 270px;
+            height: 200px;
         }
 
         .banda-card__content {
@@ -103,14 +108,13 @@
 
 .planos__container {
         background-color: #dedede !important;
-        width: 100vw; /* largura da tela, não do form */
+        width: 100%; /* largura da tela, não do form */
-        margin-left: calc(50% - 50vw);  /* puxa pra esquerda até encostar na borda */
+        margin-left: 0;  /* puxa pra esquerda até encostar na borda */
-        margin-right: calc(50% - 50vw); /* opcional, pra compensar do outro lado */
         display: flex !important;
         flex-direction: column !important;
         justify-content: center !important;
         align-items: center !important;
-        padding: 40px 40px 200px 40px!important;
+        padding: 40px 40px 40px 40px!important;
       }
 
       .planos-cards__container {
@@ -328,16 +332,17 @@ html .formcraft-css .fc-form .form-element .field-cover.customText-cover .small-
 
 @media (max-width: 480px) {
 
-.form-element-field10 {
+.form-element-field22 {
-    margin-bottom: 40px;
+     margin-bottom: 25px;
+
 }
 
-.form-element-field34 {
+.form-element-field33 {
      margin-top: 40px;
 }
 
-.form-element-field45 {
+.form-element-field24 {
-    margin-bottom: 80px;
+     margin-bottom: 630px;
 }
 
 .banda-larga__container {