/* Estilos para o botão com a classe .button-04 */



  .button-04 {
    background: linear-gradient(-30deg, #00ffe1, #0051ff);
    border: none;
    border-radius: 30px;
    padding: 25px 40px;
    color: #ffffff;
    font-weight: bold;
    font-size: 20px;
    transition: all 0.3s ease;
    display: inline-block;
    margin-top: 20px;
  }
  .button-04:hover{
    color: #000000 !important;
    font-weight: bold;
    box-shadow: 0 0 20px rgba(0, 255, 255, 0.3);
  }
  
  /* Media query para telas com largura mínima de 1200px */
  @media (min-width: 1300px) {
    .button-04 {
      padding: 0.5rem 1.7rem; /* Ajuste de padding para telas grandes */
    }
  }
  @media (max-width: 767px) {
  .button-04 {
    padding: 0.5rem 1.7rem;
  }
}

@media (min-width: 768px) {
 .button-04{
    padding: 0.5rem 1.7rem;
   
  }
}

        /* Botao de cadastrar */
  
/* Estilo inicial antes do scroll */
.register-button.scroll-change {
  background: linear-gradient(-30deg, #00ffe1, #0051ff);
  border: none;
  border-radius: 30px;
  padding: 0px 15px !important;
  color: #ffffff;
  font-weight: bold;
  transition: all 0.3s ease;
  display: inline-block;
  margin-top: 10px !important;
}

.register-button.scroll-change:hover {
  color: #000000 !important;
  font-weight: bold;
  box-shadow: 0 0 20px rgba(0, 255, 255, 0.3);
}

/* Estilo após scroll com mais especificidade */
.register-button.scroll-change.scrolled {
  background: #00afef !important;
  color: white !important;
}

.register-button.scroll-change.scrolled:hover {
  background-color: #0053be !important;
  color: #fffefe !important;
  box-shadow: 0 0 20px rgba(0, 255, 255, 0.3);
}

  
  
  /* Media query para telas com largura mínima de 1200px */
  @media (min-width: 1300px) {
    .register-button {
      padding: 0.5rem 1.2rem; /* Ajuste de padding para telas grandes */
    }
  }

  

      
.buttonint {
    background-color: #0053be; /* Cor de fundo */
    color: rgb(255, 255, 255) !important; /* Cor do texto */
    padding: 0.8rem 1.7rem; /* Ajuste de padding para tamanhos maiores */
    border-radius: 40px; /* Bordas arredondadas */
    border: none; /* Sem borda */
    cursor: pointer; /* Cursor de ponteiro */
  }
  
  /* Estilos para o botão com a classe .button-theme */
  .buttoin-theme {
    font-size: 18px; /* Tamanho da fonte */
    font-weight: bold; /* Peso da fonte */
  }
  
  /* Efeito de hover para a classe .button-04 */
  .buttonint:hover {
    background-color: #0063e6; /* Cor de fundo ao passar o mouse */
    color: #ffffff !important; /* Cor do texto ao passar o mouse */
    transition: all 0.3s ease; /* Efeito de transição suave */
    box-shadow: 0 8px 16px 0 rgba(0,0,0,0.2), 0 6px 20px 0 rgba(0,0,0,0.19); 
  }
  
  /* Media query para telas com largura mínima de 1200px */
  @media (min-width: 1300px) {
    .button-04 {
      padding: 0.5rem 1.7rem; /* Ajuste de padding para telas grandes */
    }
  }

      
  .fbox-ico {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 120px;
    height: 120px;
    margin-bottom: 25px; /* Maior separação do texto */
}

/* Ajuste do fundo para que fique atrás do ícone */
.shape-ico {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
}

/* Ícone de SMS rápido */
.icon-sms {
    position: absolute;
    z-index: 2;
    transition: fill 0.3s ease-in-out;
}

/* Fundo */
.background-shape {
    position: absolute;
    z-index: 1;
    width: 120px;
    height: 120px;
}

/* Espaço extra abaixo do ícone para separar do texto */
.fbox-txt {
    text-align: center;
    margin-top: 10px;
}

/* Efeito de mudança de cor ao passar o mouse */
.icon-sms:hover {
    fill: #6c9936; /* Cor mais escura ao passar o mouse */
}


.fbox-ico {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 120px;
  height: 120px;
  margin-bottom: 25px; 
}

.shape-ico {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
}

.icon-report {
  position: absolute;
  z-index: 2;
  transition: fill 0.3s ease-in-out;
}

.background-shape {
  position: absolute;
  z-index: 1;
  width: 120px;
  height: 120px;
}

.fbox-txt {
  text-align: center;
  margin-top: 10px;
}

.icon-report:hover {
  fill: #6c9936; 
}

.fbox-ico {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 120px;
  height: 120px;
  margin-bottom: 25px; 
}

.shape-ico {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
}

.icon-computer {
  position: absolute;
  z-index: 2;
  transition: fill 0.3s ease-in-out;
}

.background-shape {
  position: absolute;
  z-index: 1;
  width: 120px;
  height: 120px;
}

.fbox-txt {
  text-align: center;
  margin-top: 10px;
}

.icon-computer:hover {
  fill: #6c9936; 
}

.statistic-block {
  padding: 15px;
}

.statistic-number,.statistic-suffix {
  font-size: 2.5rem;
  font-weight: bold;
  color: #ffffff;
  filter:  drop-shadow(2px 2px 10px rgba(255, 255, 255, 0.4)) ;
}

.statistic-description {
  font-size: 1.0rem;
  color: #ffffff;
}
.button-fale-time{
  color: #00afef !important;
  
}

.revenda-button {
  background-color: #00ccff;
  color: #fff;
  border-radius: 30px;
  padding: 12px 32px;
  text-decoration: none;
  font-weight: 600;
  transition: all 0.3s ease;
  border: none;
 
}

.revenda-button:hover {
  background-color: #0053be;
  color: #ffffff !important;
  border: none;
  box-shadow: 0 8px 16px 0 rgba(0,0,0,0.2), 0 6px 20px 0 rgba(0,0,0,0.19);
  transform: translateY(-2px);

}
.revenda-animado {
  background: linear-gradient(
    90deg,
    #00ccff,
    #00ff62,
    #00ccff,
    #0066ff,
    #00ccff
  );
  background-size: 300% 300%;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  animation: moverGradiente 6s linear infinite;
  text-shadow: 0 1px 3px rgba(0, 204, 255, 0.2);
  font-weight: 700;
  transform: translateZ(0);
}

@keyframes moverGradiente {
  0% {
    background-position: 0% 50%;
  }
  50% {
    background-position: 100% 50%;
  }
  100% {
    background-position: 0% 50%;
  }
}


          /* botao preço */


          
          .button-preco {
    
            background-color: #0053be; /* Cor de fundo */
            color: rgb(255, 255, 255);  /* Cor do texto */
            border-radius: 30px; /* Bordas arredondadas */
            border: none; /* Sem borda */
            cursor: pointer; /* Cursor de ponteiro */
            text-decoration: none; /* Remover o sublinhado, caso seja um link */
            font-size:1rem !important; /* Tamanho da fonte */
            padding: 0px 17px !important;
            top: 10px; /* Peso da fonte */
          }
          
          .button-preco:hover {
            background-color: #0053be; /* Cor de fundo ao passar o mouse */
            color: #000000 !important; /* Cor do texto ao passar o mouse */
            transition: all 0.3s ease; /* Efeito de transição suave */
            box-shadow: 0 8px 16px 0 rgba(0,0,0,0.2), 0 6px 20px 0 rgba(0,0,0,0.19);
            
          }
          
          .button-preco {
            
            letter-spacing: 1px; /* Aumentar o espaçamento entre as letras */
          }
          
          /* Media query para telas com largura mínima de 1200px */
          @media (min-width: 1300px) {
            .button-preco {
              padding: 0.5rem 1.2rem; /* Ajuste de padding para telas grandes */
            }
          }



          /* Botão valor preco*/
.botao-valor-preco {
  background-color: #00afef;
  color: #fff;
  border: none;
  padding: 0.6rem 1rem;
  border-radius: 0.375rem;
  font-size: 1rem;
  font-weight: 500;
  transition: background-color 0.3s ease, box-shadow 0.3s ease;
  display: inline-block;
  text-align: center;
  text-decoration: none;
}

/* Hover: escurece e dá destaque */
.botao-valor-preco:hover {
  background-color: #0053be;
  box-shadow: 0 0 10px rgba(0, 175, 239, 0.4);
  color: #fff !important;
}

/* Quando desabilitado */
.botao-valor-preco:disabled,
.botao-valor-preco.disabled {
  background-color: #a4dff1;
  cursor: not-allowed;
  opacity: 0.7;
}
/* Animações e responsividade para os cards */
.p-table {
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.p-table:hover {
  transform: scale(1.03);
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.1);
}

/* Organização em grid com quebra inteligente */
@media (max-width: 767px) {
  .pricing-3-wrapper .col-12 {
    width: 100% !important;
  }
}

@media (min-width: 768px) {
  .pricing-3-wrapper .row {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
  }

  .pricing-3-wrapper .col-md-4 {
    flex: 0 0 30%;
    max-width: 30%;
    margin: 1%;
  }
}

        

        /* botao revenda home  */
.botao-revender {
  background-color: #00c7ff;
  color: white;
  border: none;
  padding: 12px 28px;
  font-size: 18px;
  font-weight: bold;
  border-radius: 30px;
  text-align: center;
  display: inline-block;
  transition: all 0.3s ease-in-out;
}

.botao-revender:hover {
  background-color: #0053be;
  color: white !important;
}

@media (max-width: 768px) {
  .botao-revender {
    width: 100%;
    text-align: center;
    font-size: 16px;
    padding: 14px;
    margin-top: 20px;
  }
}

        
        /* Botão secundário - contorno */
        .botao-saiba-mais {
          background-color: transparent;
          color: #00c7ff;
          border: 2px solid #00c7ff;
        }
        
        .botao-saiba-mais:hover {
          background-color: #e7f8fc;
          color: #00a5d6;
          border-color: #00a5d6;
        }
        

        .button-politica {
    
          background-color: #00c7ff; /* Cor de fundo */
          color: rgb(255, 255, 255);  /* Cor do texto */
          border-radius: 30px; /* Bordas arredondadas */
          border: none; /* Sem borda */
          cursor: pointer; /* Cursor de ponteiro */
          text-decoration: none; /* Remover o sublinhado, caso seja um link */
          font-size:1rem !important; /* Tamanho da fonte */
          padding: 0px 17px !important;
          top: 10px; /* Peso da fonte */
        }
        
        .button-politica:hover {
          background-color: #0053be; /* Cor de fundo ao passar o mouse */
          color: #ffffff !important; /* Cor do texto ao passar o mouse */
          transition: all 0.3s ease; /* Efeito de transição suave */
          box-shadow: 0 8px 16px 0 rgba(0,0,0,0.2), 0 6px 20px 0 rgba(0,0,0,0.19);
          
        }
        
        .button-politica {
          
          letter-spacing: 1px; /* Aumentar o espaçamento entre as letras */
        }
        
        /* Media query para telas com largura mínima de 1200px */
        @media (min-width: 1300px) {
          .button-preco {
            padding: 0.5rem 1.2rem; /* Ajuste de padding para telas grandes */
          }
        }