From cb813f7288ea863267405125b991d794c0d54b6e Mon Sep 17 00:00:00 2001
From: Felipe de Moraes Gomes <felipe.gomes@sothis.com.br>
Date: Fri, 17 Apr 2026 15:59:08 -0300
Subject: [PATCH] =?UTF-8?q?FEAT=20-=20atualiza=C3=A7=C3=A3o=20CSS=20e=20Ja?=
 =?UTF-8?q?vaScript?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 teste/BandaEmpresarial/planos.css             | 459 ++++++++++++++++++
 teste/BandaResidencial/planos.css             | 459 ++++++++++++++++++
 .../viabilidade.css}                          |   0
 .../viabilidade.js}                           | 136 ++++--
 4 files changed, 1025 insertions(+), 29 deletions(-)
 create mode 100644 teste/BandaEmpresarial/planos.css
 create mode 100644 teste/BandaResidencial/planos.css
 rename teste/{style.css => FormViabilidade/viabilidade.css} (100%)
 rename teste/{index.js => FormViabilidade/viabilidade.js} (81%)

diff --git a/teste/BandaEmpresarial/planos.css b/teste/BandaEmpresarial/planos.css
new file mode 100644
index 0000000..5ba0388
--- /dev/null
+++ b/teste/BandaEmpresarial/planos.css
@@ -0,0 +1,459 @@
+/* funcionou nos planos */
+.form-element-field01 {
+    margin-bottom: 50px;
+}
+
+.banda-larga__container {
+            display: flex;
+            flex-direction: row;
+            justify-content: center;
+            align-items: center;
+            gap: 45px;
+        }
+
+        .banda-residencia__container, .banda-empresa__container {
+            display: flex;
+            flex-direction: column;
+            align-items: center;
+            width: 50%;
+            border: 1px solid gray;
+            border-radius: 20px;
+            height: 270px;
+        }
+
+        .banda-card__content {
+            height: 100%;
+            display: flex;
+            flex-direction: column;
+            justify-content: space-between;
+            align-items: center;
+            padding: 40px;
+        }
+
+        .banda__title > h3 {
+            margin-top: 0px;
+            font-size: 18px !important;
+            color: #234164 !important;
+            text-align: center;
+        }
+
+        .banda__content > p {
+            text-align: center;
+            line-height: 1.5em;
+        }
+
+        .banda-residencia__container > div > div.banda__content > p {
+            margin-top: 0px;
+        }
+
+        .banda-button__container {
+            width: 100%;
+            display: flex;
+            justify-content: center;
+            align-items: center;
+        }
+
+        .banda-button__container > a {
+            padding: 10px !important;
+            background-color: #31a3b5 !important;
+            color: white !important;
+            text-decoration: none !important;
+            width: 100% !important;
+            text-align: center !important;
+            border-radius: 5px !important;
+        }
+
+        .banda-button__container > a:hover {
+            background-color: #1d6570 !important;
+}
+
+.planos__container {
+        width: 100%;
+        max-width: 1200px;
+        margin: auto;
+        display: flex !important;
+        flex-direction: column !important;
+        justify-content: center !important;
+        align-items: center !important;
+        padding: 40px 20px !important;
+      }
+
+      .planos-cards__container {
+        display: flex !important;
+        justify-content: center !important;
+        margin: auto !important;
+        align-items: center !important;
+        gap: 25px !important;
+      }
+
+      .instalacao__container {
+        margin-top: 30px !important;
+      }
+
+      .out-card__container {
+        display: flex !important;
+        flex-direction: column !important;
+        transition: transform 0.5s ease;
+      }
+
+      .most-sell-card__text {
+        align-self: flex-end !important;
+        background-color: #1d3350 !important;
+        border-radius: 20px 20px 0px 0px !important;
+      }
+
+      .most-sell-card__text > p {
+        font-size: 10px !important;
+        padding: 0px 30px 0px 30px !important;
+        margin: 0px !important;
+        color: white !important;
+      }
+
+      .most-sell-card__container {
+        background-color: #1d3350 !important;
+        min-width: 230px !important;
+        height: 450px !important;
+        border-radius: 20px 0px 20px 20px !important;
+        display: flex !important;
+        flex-direction: column !important;
+        justify-content: center !important;
+        align-items: center !important;
+      }
+
+      .seller-card__container {
+        background: radial-gradient(circle at 50% 50%,
+              #B00025 50%,    /* intermediário */
+              #A70022 100%) !important;  /* mais escuro nas bordas */
+        height: 450px !important;
+        min-width: 230px !important;
+        border-radius: 20px !important;
+        display: flex !important;
+        justify-content: center !important;
+        align-items: center !important;
+        flex-direction: column !important;
+        margin-top: 30px !important;
+        color: white !important;
+        transition: transform 0.5s ease;
+      }
+
+      .best-seller-card__container {
+        background: radial-gradient(circle at 50% 50%,
+              #B00025 50%,    /* intermediário */
+              #A70022 100%) !important;  /* mais escuro nas bordas */
+        width: 92% !important;
+        height: 95% !important;
+        border-radius: 15px !important;
+        color: white !important;
+        display: flex !important;
+        flex-direction: column !important;
+        align-items: center !important;
+      }
+
+      .card-title__container {
+        display: flex !important;
+        justify-content: center !important;
+        align-items: flex-end !important;
+        padding: 20px 0px 15px 0px !important;
+        font-family: "myriad-variable", sans-serif !important;
+        border-bottom: 1px solid white !important;
+        width: 90% !important;
+      }
+
+      .card-title__number > h1 {
+        padding: 0px !important;
+        margin: 0px !important;
+        font-size: 50px !important;
+      }
+
+      .card-title__text > h1 {
+        padding: 0px !important;
+        margin: 0px 0px 13px 3px !important;
+        font-size: 20px !important;
+      }
+
+      .card-description__container {
+        display: flex !important;
+        justify-content: center !important;
+        align-items: center !important;
+        border-bottom: 1px solid white !important;
+        width: 90% !important;
+        margin-top: 25px !important;
+        padding-bottom: 60px !important;
+      }
+
+      .card-description__content {
+        margin-left: 5px !important;
+        margin-bottom: 10px !important;
+        font-weight: 600 !important;
+      }
+
+      .card-price__container {
+        display: flex !important;
+        align-items: flex-end !important;
+        justify-content: flex-end !important;
+        margin-top: 20px !important;
+      }
+
+.card-price__money {
+        align-self: flex-end !important;
+        margin-bottom: -5px !important;
+      }
+
+      .card-price__money > p {
+        height: 100% !important;
+        color: white !important;
+        font-weight: bold !important;
+        font-size: 24px !important;
+      }
+
+      .card-price__value {
+        align-self: flex-end !important;
+      }
+
+      .card-price__value > p {
+        height: 100% !important;
+        font-weight: bold !important;
+        font-size: 50px !important;
+        color: white !important;
+      }
+
+      .card-price-small__container {
+        display: flex !important;
+        flex-direction: column !important;
+        justify-content: center !important;
+        align-self: flex-end !important;
+        margin-bottom: -10px !important;
+        margin-left: 2.5px !important;
+      }
+
+      .small-price p {
+        height: 100% !important;
+        color: white !important;
+        font-weight: bold !important;
+        font-size: 24px !important;
+      }
+
+      .small-gap-time p {
+        height: 100% !important;
+        color: white !important;
+        font-size: 14px !important;
+      }
+
+      .card-plan-button__container {
+        margin-top: 30px !important;
+        width: 100% !important;
+        display: flex !important;
+        justify-content: center !important;
+        align-items: center !important;
+      }
+
+      .card-plan-button__container > a {
+        color: #A70022 !important;
+        text-decoration: none !important;
+        font-weight: bold !important;
+        font-size: 12px !important;
+        background-color: white !important;
+        padding: 8px 40px !important;
+        border-radius: 10px !important;
+      }
+
+      .card-plan-button__container > a:hover {
+        box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px !important;
+      }
+
+.most-sell-card__container > div > div.card-title__container {
+        margin-top: 25px !important;
+      }
+
+.card-price__container div > p {
+        margin: 0px !important;
+      }
+
+html .formcraft-css .fc-form .form-element .field-cover.customText-cover .small-gap-time > p, html .formcraft-css .fc-form .form-element .field-cover.customText-cover .small-price > p {
+    margin-top: 0 !important;
+}
+
+.is-selected {
+        transform: translateY(-15px);
+      }
+
+
+.formcraft-icon {
+    margin-top: 2.5px !important;
+}
+
+.form-element-field38 p {
+  font-size: 12px !important;
+}
+
+#plano-selecionado-msg {
+    font-weight: bold !important;
+    text-align: center !important;
+    font-size: 20px !important
+}
+
+@media (max-width: 480px) {
+
+  /* --- Banda Larga --- */
+  .banda-larga__container {
+    flex-direction: column;
+    gap: 20px;
+    padding: 0 15px;
+  }
+
+  .banda-residencia__container,
+  .banda-empresa__container {
+    width: 100%;
+    height: fit-content;
+  }
+
+  .banda-card__content {
+    padding: 25px;
+  }
+
+  /* --- Planos --- */
+  .planos__container {
+    margin-left: 0 !important;
+    margin-right: 0 !important;
+    padding: 20px 15px !important;
+  }
+
+  .planos-cards__container {
+	flex-wrap: wrap !important;
+    flex-direction: column !important;
+    align-items: center !important;
+    gap: 15px !important;
+  }
+
+  /* --- Cards individuais --- */
+  .out-card__container {
+    width: 100%;
+    max-width: 320px;
+  }
+
+  .most-sell-card__container {
+    min-width: unset !important;
+    width: 100% !important;
+    height: auto !important;
+    min-height: 400px !important;
+    padding: 15px 0 !important;
+  }
+
+  .seller-card__container {
+    min-width: unset !important;
+    width: 100% !important;
+    height: auto !important;
+    min-height: 400px !important;
+    padding: 15px 0 !important;
+  }
+
+  .best-seller-card__container {
+    width: 92% !important;
+    height: auto !important;
+    padding-bottom: 20px !important;
+  }
+
+  /* --- Preço --- */
+  .card-title__number > h1 {
+    font-size: 40px !important;
+  }
+
+  .card-price__value > p {
+    font-size: 40px !important;
+  }
+
+  /* --- Instalação --- */
+  .instalacao__container > p {
+    text-align: center;
+  }
+
+  /* --- CORREÇÃO: remover margin-bottom absurdo --- */
+  .form-element-field1 {
+    margin-bottom: 20px; /* era 2600px — quase certamente um bug */
+  }
+
+  /* --- Mensagem de plano selecionado --- */
+  #plano-selecionado-msg {
+    font-size: 16px !important;
+  }
+}
+
+/* ================================
+   MOBILE GRANDE (481px até 768px)
+================================ */
+@media (min-width: 481px) and (max-width: 768px) {
+
+  .banda-larga__container {
+    flex-direction: column;
+    gap: 25px;
+    padding: 0 20px;
+  }
+
+  .banda-residencia__container,
+  .banda-empresa__container {
+    width: 85%;
+    height: fit-content;
+  }
+
+  .planos__container {
+    margin-left: 0 !important;
+    margin-right: 0 !important;
+    padding: 30px 20px !important;
+  }
+
+  .planos-cards__container {
+	flex-wrap: wrap !important;
+    flex-direction: column !important;
+    align-items: center !important;
+    gap: 20px !important;
+  }
+
+  .most-sell-card__container,
+  .seller-card__container {
+    min-width: unset !important;
+    width: 280px !important;
+    height: auto !important;
+    min-height: 420px !important;
+  }
+
+  .best-seller-card__container {
+    height: auto !important;
+    padding-bottom: 20px !important;
+  }
+}
+
+/* ================================
+   TABLET (769px até 1024px)
+================================ */
+@media (min-width: 769px) and (max-width: 1024px) {
+
+  .banda-larga__container {
+    gap: 25px;
+    padding: 0 20px;
+  }
+
+  .planos__container {
+    margin-left: 0 !important;
+    margin-right: 0 !important;
+    padding: 30px 25px !important;
+  }
+
+  .planos-cards__container {
+    gap: 15px !important;
+    flex-wrap: wrap !important; /* permite quebrar linha se não couber */
+  }
+
+  .most-sell-card__container {
+    min-width: 200px !important;
+    height: 420px !important;
+  }
+
+  .seller-card__container {
+    min-width: 200px !important;
+    height: 420px !important;
+  }
+
+  .best-seller-card__container {
+    height: 95% !important;
+  }
+}
\ No newline at end of file
diff --git a/teste/BandaResidencial/planos.css b/teste/BandaResidencial/planos.css
new file mode 100644
index 0000000..5ba0388
--- /dev/null
+++ b/teste/BandaResidencial/planos.css
@@ -0,0 +1,459 @@
+/* funcionou nos planos */
+.form-element-field01 {
+    margin-bottom: 50px;
+}
+
+.banda-larga__container {
+            display: flex;
+            flex-direction: row;
+            justify-content: center;
+            align-items: center;
+            gap: 45px;
+        }
+
+        .banda-residencia__container, .banda-empresa__container {
+            display: flex;
+            flex-direction: column;
+            align-items: center;
+            width: 50%;
+            border: 1px solid gray;
+            border-radius: 20px;
+            height: 270px;
+        }
+
+        .banda-card__content {
+            height: 100%;
+            display: flex;
+            flex-direction: column;
+            justify-content: space-between;
+            align-items: center;
+            padding: 40px;
+        }
+
+        .banda__title > h3 {
+            margin-top: 0px;
+            font-size: 18px !important;
+            color: #234164 !important;
+            text-align: center;
+        }
+
+        .banda__content > p {
+            text-align: center;
+            line-height: 1.5em;
+        }
+
+        .banda-residencia__container > div > div.banda__content > p {
+            margin-top: 0px;
+        }
+
+        .banda-button__container {
+            width: 100%;
+            display: flex;
+            justify-content: center;
+            align-items: center;
+        }
+
+        .banda-button__container > a {
+            padding: 10px !important;
+            background-color: #31a3b5 !important;
+            color: white !important;
+            text-decoration: none !important;
+            width: 100% !important;
+            text-align: center !important;
+            border-radius: 5px !important;
+        }
+
+        .banda-button__container > a:hover {
+            background-color: #1d6570 !important;
+}
+
+.planos__container {
+        width: 100%;
+        max-width: 1200px;
+        margin: auto;
+        display: flex !important;
+        flex-direction: column !important;
+        justify-content: center !important;
+        align-items: center !important;
+        padding: 40px 20px !important;
+      }
+
+      .planos-cards__container {
+        display: flex !important;
+        justify-content: center !important;
+        margin: auto !important;
+        align-items: center !important;
+        gap: 25px !important;
+      }
+
+      .instalacao__container {
+        margin-top: 30px !important;
+      }
+
+      .out-card__container {
+        display: flex !important;
+        flex-direction: column !important;
+        transition: transform 0.5s ease;
+      }
+
+      .most-sell-card__text {
+        align-self: flex-end !important;
+        background-color: #1d3350 !important;
+        border-radius: 20px 20px 0px 0px !important;
+      }
+
+      .most-sell-card__text > p {
+        font-size: 10px !important;
+        padding: 0px 30px 0px 30px !important;
+        margin: 0px !important;
+        color: white !important;
+      }
+
+      .most-sell-card__container {
+        background-color: #1d3350 !important;
+        min-width: 230px !important;
+        height: 450px !important;
+        border-radius: 20px 0px 20px 20px !important;
+        display: flex !important;
+        flex-direction: column !important;
+        justify-content: center !important;
+        align-items: center !important;
+      }
+
+      .seller-card__container {
+        background: radial-gradient(circle at 50% 50%,
+              #B00025 50%,    /* intermediário */
+              #A70022 100%) !important;  /* mais escuro nas bordas */
+        height: 450px !important;
+        min-width: 230px !important;
+        border-radius: 20px !important;
+        display: flex !important;
+        justify-content: center !important;
+        align-items: center !important;
+        flex-direction: column !important;
+        margin-top: 30px !important;
+        color: white !important;
+        transition: transform 0.5s ease;
+      }
+
+      .best-seller-card__container {
+        background: radial-gradient(circle at 50% 50%,
+              #B00025 50%,    /* intermediário */
+              #A70022 100%) !important;  /* mais escuro nas bordas */
+        width: 92% !important;
+        height: 95% !important;
+        border-radius: 15px !important;
+        color: white !important;
+        display: flex !important;
+        flex-direction: column !important;
+        align-items: center !important;
+      }
+
+      .card-title__container {
+        display: flex !important;
+        justify-content: center !important;
+        align-items: flex-end !important;
+        padding: 20px 0px 15px 0px !important;
+        font-family: "myriad-variable", sans-serif !important;
+        border-bottom: 1px solid white !important;
+        width: 90% !important;
+      }
+
+      .card-title__number > h1 {
+        padding: 0px !important;
+        margin: 0px !important;
+        font-size: 50px !important;
+      }
+
+      .card-title__text > h1 {
+        padding: 0px !important;
+        margin: 0px 0px 13px 3px !important;
+        font-size: 20px !important;
+      }
+
+      .card-description__container {
+        display: flex !important;
+        justify-content: center !important;
+        align-items: center !important;
+        border-bottom: 1px solid white !important;
+        width: 90% !important;
+        margin-top: 25px !important;
+        padding-bottom: 60px !important;
+      }
+
+      .card-description__content {
+        margin-left: 5px !important;
+        margin-bottom: 10px !important;
+        font-weight: 600 !important;
+      }
+
+      .card-price__container {
+        display: flex !important;
+        align-items: flex-end !important;
+        justify-content: flex-end !important;
+        margin-top: 20px !important;
+      }
+
+.card-price__money {
+        align-self: flex-end !important;
+        margin-bottom: -5px !important;
+      }
+
+      .card-price__money > p {
+        height: 100% !important;
+        color: white !important;
+        font-weight: bold !important;
+        font-size: 24px !important;
+      }
+
+      .card-price__value {
+        align-self: flex-end !important;
+      }
+
+      .card-price__value > p {
+        height: 100% !important;
+        font-weight: bold !important;
+        font-size: 50px !important;
+        color: white !important;
+      }
+
+      .card-price-small__container {
+        display: flex !important;
+        flex-direction: column !important;
+        justify-content: center !important;
+        align-self: flex-end !important;
+        margin-bottom: -10px !important;
+        margin-left: 2.5px !important;
+      }
+
+      .small-price p {
+        height: 100% !important;
+        color: white !important;
+        font-weight: bold !important;
+        font-size: 24px !important;
+      }
+
+      .small-gap-time p {
+        height: 100% !important;
+        color: white !important;
+        font-size: 14px !important;
+      }
+
+      .card-plan-button__container {
+        margin-top: 30px !important;
+        width: 100% !important;
+        display: flex !important;
+        justify-content: center !important;
+        align-items: center !important;
+      }
+
+      .card-plan-button__container > a {
+        color: #A70022 !important;
+        text-decoration: none !important;
+        font-weight: bold !important;
+        font-size: 12px !important;
+        background-color: white !important;
+        padding: 8px 40px !important;
+        border-radius: 10px !important;
+      }
+
+      .card-plan-button__container > a:hover {
+        box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px !important;
+      }
+
+.most-sell-card__container > div > div.card-title__container {
+        margin-top: 25px !important;
+      }
+
+.card-price__container div > p {
+        margin: 0px !important;
+      }
+
+html .formcraft-css .fc-form .form-element .field-cover.customText-cover .small-gap-time > p, html .formcraft-css .fc-form .form-element .field-cover.customText-cover .small-price > p {
+    margin-top: 0 !important;
+}
+
+.is-selected {
+        transform: translateY(-15px);
+      }
+
+
+.formcraft-icon {
+    margin-top: 2.5px !important;
+}
+
+.form-element-field38 p {
+  font-size: 12px !important;
+}
+
+#plano-selecionado-msg {
+    font-weight: bold !important;
+    text-align: center !important;
+    font-size: 20px !important
+}
+
+@media (max-width: 480px) {
+
+  /* --- Banda Larga --- */
+  .banda-larga__container {
+    flex-direction: column;
+    gap: 20px;
+    padding: 0 15px;
+  }
+
+  .banda-residencia__container,
+  .banda-empresa__container {
+    width: 100%;
+    height: fit-content;
+  }
+
+  .banda-card__content {
+    padding: 25px;
+  }
+
+  /* --- Planos --- */
+  .planos__container {
+    margin-left: 0 !important;
+    margin-right: 0 !important;
+    padding: 20px 15px !important;
+  }
+
+  .planos-cards__container {
+	flex-wrap: wrap !important;
+    flex-direction: column !important;
+    align-items: center !important;
+    gap: 15px !important;
+  }
+
+  /* --- Cards individuais --- */
+  .out-card__container {
+    width: 100%;
+    max-width: 320px;
+  }
+
+  .most-sell-card__container {
+    min-width: unset !important;
+    width: 100% !important;
+    height: auto !important;
+    min-height: 400px !important;
+    padding: 15px 0 !important;
+  }
+
+  .seller-card__container {
+    min-width: unset !important;
+    width: 100% !important;
+    height: auto !important;
+    min-height: 400px !important;
+    padding: 15px 0 !important;
+  }
+
+  .best-seller-card__container {
+    width: 92% !important;
+    height: auto !important;
+    padding-bottom: 20px !important;
+  }
+
+  /* --- Preço --- */
+  .card-title__number > h1 {
+    font-size: 40px !important;
+  }
+
+  .card-price__value > p {
+    font-size: 40px !important;
+  }
+
+  /* --- Instalação --- */
+  .instalacao__container > p {
+    text-align: center;
+  }
+
+  /* --- CORREÇÃO: remover margin-bottom absurdo --- */
+  .form-element-field1 {
+    margin-bottom: 20px; /* era 2600px — quase certamente um bug */
+  }
+
+  /* --- Mensagem de plano selecionado --- */
+  #plano-selecionado-msg {
+    font-size: 16px !important;
+  }
+}
+
+/* ================================
+   MOBILE GRANDE (481px até 768px)
+================================ */
+@media (min-width: 481px) and (max-width: 768px) {
+
+  .banda-larga__container {
+    flex-direction: column;
+    gap: 25px;
+    padding: 0 20px;
+  }
+
+  .banda-residencia__container,
+  .banda-empresa__container {
+    width: 85%;
+    height: fit-content;
+  }
+
+  .planos__container {
+    margin-left: 0 !important;
+    margin-right: 0 !important;
+    padding: 30px 20px !important;
+  }
+
+  .planos-cards__container {
+	flex-wrap: wrap !important;
+    flex-direction: column !important;
+    align-items: center !important;
+    gap: 20px !important;
+  }
+
+  .most-sell-card__container,
+  .seller-card__container {
+    min-width: unset !important;
+    width: 280px !important;
+    height: auto !important;
+    min-height: 420px !important;
+  }
+
+  .best-seller-card__container {
+    height: auto !important;
+    padding-bottom: 20px !important;
+  }
+}
+
+/* ================================
+   TABLET (769px até 1024px)
+================================ */
+@media (min-width: 769px) and (max-width: 1024px) {
+
+  .banda-larga__container {
+    gap: 25px;
+    padding: 0 20px;
+  }
+
+  .planos__container {
+    margin-left: 0 !important;
+    margin-right: 0 !important;
+    padding: 30px 25px !important;
+  }
+
+  .planos-cards__container {
+    gap: 15px !important;
+    flex-wrap: wrap !important; /* permite quebrar linha se não couber */
+  }
+
+  .most-sell-card__container {
+    min-width: 200px !important;
+    height: 420px !important;
+  }
+
+  .seller-card__container {
+    min-width: 200px !important;
+    height: 420px !important;
+  }
+
+  .best-seller-card__container {
+    height: 95% !important;
+  }
+}
\ No newline at end of file
diff --git a/teste/style.css b/teste/FormViabilidade/viabilidade.css
similarity index 100%
rename from teste/style.css
rename to teste/FormViabilidade/viabilidade.css
diff --git a/teste/index.js b/teste/FormViabilidade/viabilidade.js
similarity index 81%
rename from teste/index.js
rename to teste/FormViabilidade/viabilidade.js
index e9d8405..89f0239 100644
--- a/teste/index.js
+++ b/teste/FormViabilidade/viabilidade.js
@@ -52,7 +52,7 @@ function isVisible(el) {
   );
 }
 
-// form de viabilidade
+// puxa o plano selecionado na pag1 para pag2
 function aplicarPlanoSelecionado() {
   const planoData = JSON.parse(sessionStorage.getItem("planoSelecionado"));
   if (!planoData) return;
@@ -296,7 +296,6 @@ 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-field37");
   if (!btn) return;
   e.preventDefault();
   if (isProcessing) return;
@@ -306,58 +305,137 @@ document.addEventListener("click", function (e) {
   btn.disabled = true;
   consultarCep().finally(() => {
     showResultField();
-    smoothScrollToElement(boxResultado, 150, 500);
+    // scroll para o bloco de resultado visível - bloqueado
     setTimeout(() => {
+      const blocoVisivel = [
+        document.querySelector(".form-element-field23"),
+        document.querySelector(".form-element-field33"),
+        document.querySelector(".form-element-field32"),
+        document.querySelector(".form-element-field36"),
+      ].find(el => el && el.style.display !== "none");
       isProcessing = false;
       btn.textContent = originalBtnText;
       btn.disabled = false;
-    }, 2000);
+    }, 2200);
   });
 });
 
+let viabilidadeAprovada = false;
+
 // FUNÇÃO BOTÃO CONSULTAR VIABILIDADE
 function showResultField() {
-  console.log("Mostrando resultado de viabilidade.", {
-    temosBandaLarga,
-    error,
-  });
+  console.log("Mostrando resultado de viabilidade.", { temosBandaLarga, error });
 
-  const temosBandaLargaTitle = document.querySelector(".form-element-field23");
-  const temosBandaLargaBox = document.querySelector(".form-element-field24");
-  const naoTemosBandaLargaTitle = document.querySelector(".form-element-field33",);
-  const errorBox = document.querySelector(".form-element-field32");
-  const camposNaoPreenchidos = document.querySelector(".form-element-field36");
+  const temosBandaLargaTitle    = document.querySelector(".form-element-field23");
+  const temosBandaLargaBox      = document.querySelector(".form-element-field24");
+  const naoTemosBandaLargaTitle = document.querySelector(".form-element-field33");
+  const errorBox                = document.querySelector(".form-element-field32");
+  const camposNaoPreenchidos    = document.querySelector(".form-element-field36");
+  const btnAssinar              = document.querySelector(
+    '.form-element-field8 button, .form-element-field8 input[type="submit"]'
+  );
 
-  // 1) some com todos os blocos
-  if (temosBandaLargaTitle) temosBandaLargaTitle.style.display = "none";
-  if (temosBandaLargaBox) temosBandaLargaBox.style.display = "none";
+  // 1) esconde todos os blocos e bloqueia botão por padrão
+  if (temosBandaLargaTitle)    temosBandaLargaTitle.style.display    = "none";
+  if (temosBandaLargaBox)      temosBandaLargaBox.style.display      = "none";
   if (naoTemosBandaLargaTitle) naoTemosBandaLargaTitle.style.display = "none";
-  if (errorBox) errorBox.style.display = "none";
-  if (camposNaoPreenchidos) camposNaoPreenchidos.style.display = "none";
-  // 2) se campos não estiverem preenchidos, trata como erro
+  if (errorBox)                errorBox.style.display                = "none";
+  if (camposNaoPreenchidos)    camposNaoPreenchidos.style.display    = "none";
+
+  viabilidadeAprovada = false; // bloqueia por padrão
+  if (btnAssinar) {
+    btnAssinar.disabled = true;
+    btnAssinar.style.opacity = "0.5";
+    btnAssinar.style.cursor  = "not-allowed";
+    btnAssinar.title = "Consulte a viabilidade antes de continuar";
+  }
+
+  // 2) campos incompletos
   if (!pronto()) {
     if (camposNaoPreenchidos) camposNaoPreenchidos.style.display = "block";
     return;
   }
 
-  // 3) erro de API / outro erro
+  // 3) erro de API
   if (error) {
     if (errorBox) errorBox.style.display = "block";
     return;
   }
 
-  // 4) temos / não temos banda
-  if (temosBandaLarga) {
-    // TEMOS banda larga
-    if (temosBandaLargaTitle) temosBandaLargaTitle.style.display = "block";
-    if (temosBandaLargaBox) temosBandaLargaBox.style.display = "block";
+  // 4) SEM cobertura
+  if (!temosBandaLarga) {
+    if (naoTemosBandaLargaTitle) naoTemosBandaLargaTitle.style.display = "block";
+    return; // botão continua bloqueado
+  }
+
+  // 5) TEM cobertura — libera o botão
+  viabilidadeAprovada = true;
+  if (btnAssinar) {
+    btnAssinar.disabled = false;
+    btnAssinar.style.opacity = "";
+    btnAssinar.style.cursor  = "";
+    btnAssinar.title = "";
+  }
+
+  if (temosBandaLargaTitle) temosBandaLargaTitle.style.display = "block";
+
+  const planoJaEscolhido = sessionStorage.getItem("planoSelecionado");
+  if (planoJaEscolhido) {
+    if (temosBandaLargaBox) temosBandaLargaBox.style.display = "none";
+    setTimeout(() => scrollToAssinar({ offset: 250, duration: 500 }), 1500);
   } else {
-    // NÃO TEMOS banda larga
-    if (naoTemosBandaLargaTitle)
-      naoTemosBandaLargaTitle.style.display = "block";
+    if (temosBandaLargaBox) temosBandaLargaBox.style.display = "block";
   }
 }
 
+function bloquearSubmitSemViabilidade() {
+  const MAX_TRIES = 40;
+  const INTERVAL  = 300;
+  let tries = 0;
+
+  function init() {
+    const form = document.querySelector(".fc-form-33");
+    if (!form) {
+      if (++tries <= MAX_TRIES) setTimeout(init, INTERVAL);
+      return;
+    }
+
+    form.addEventListener("submit", function (e) {
+      if (!viabilidadeAprovada) {
+        e.preventDefault();
+        e.stopImmediatePropagation();
+
+        // mostra mensagem e rola até ela
+        const camposNaoPreenchidos = document.querySelector(".form-element-field36");
+        const errorBox             = document.querySelector(".form-element-field32");
+
+        // se nenhum bloco de erro está visível, mostra o de campos não preenchidos
+        const algumErroVisivel = [
+          document.querySelector(".form-element-field33"),
+          document.querySelector(".form-element-field32"),
+          document.querySelector(".form-element-field36"),
+        ].some(el => el && el.style.display !== "none");
+
+        if (!algumErroVisivel && camposNaoPreenchidos) {
+          camposNaoPreenchidos.style.display = "block";
+        }
+
+        // rola até o bloco de erro visível
+        const blocoErro = [
+          document.querySelector(".form-element-field33"),
+          document.querySelector(".form-element-field32"),
+          document.querySelector(".form-element-field36"),
+        ].find(el => el && el.style.display !== "none");
+
+        if (blocoErro) smoothScrollToElement(blocoErro, 150, 500);
+
+        console.warn("[viabilidade] Submit bloqueado: viabilidade não aprovada.");
+      }
+    }, true); // capture=true garante que roda antes do FormCraft
+  }
+  init();
+};
+
 function setPlanoSelecionadoTexto(planoLabel) {
   const el = document.getElementById('plano-selecionado-msg');
   if (!el) {
@@ -632,7 +710,7 @@ window.formCraftCEPInstance = new FormCraftCEP();
 // Garantir que tela scrolle em caso de campo obrigatório sem preenchimento
 
 (function scrollToFirstInvalidOnSubmit() {
-  const form = document.querySelector(".fc-form-23");
+  const form = document.querySelector(".fc-form-33");
   if (!form) return;
 
   const OFFSET = 180; // ajuste conforme seu header/spacing