/*scroolup ajuste*/
.sp-scroll-up{
  bottom: 90px!important;
  }


#sp-page-builder{

  background-image:none!important;
  background-color:#1f1f1f!important;
}







a {
  cursor: pointer;
}


.whatsapp-button {
  position: fixed;
  bottom: 20px;
  right: 20px;
  z-index: 9999999999!important;
}




/*animação flutuante whatsapp*/
.whatsapp-button {
            position: fixed;
            bottom: 20px;
            right: 20px;
            width: 56px;
            height: 56px;
            background-color: #25D366;
            color: #fff;
            border: 2px solid #25D366;
            border-radius: 50%;
            padding: 4px;
            cursor: pointer;
            box-shadow: 0px 2px 8px rgba(0, 0, 0, 0.2);
            transition: background-color 0.3s ease-in-out, transform 0.3s ease-in-out, border 0.3s ease-in-out, box-shadow 0.3s ease-in-out;
        }

        .whatsapp-button:hover {
            background-color: #075E54;
            transform: scale(1.1) rotate(10deg) translate(-5px, -5px); /* Ajuste da rotação e da posição no hover */
            box-shadow: 0px 2px 12px rgba(0, 0, 0, 0.3);
            transition-duration: 0.5s; /* Duração da transição de 0.5 segundo */
        }

        .whatsapp-button img {
            width: 80%;
            height: 80%;
            display: block;
            margin: 10%;
            transition: background-color 0.3s ease-in-out, transform 0.3s ease-in-out;
        }

        @keyframes attentionAnimation {
            0%, 100% {
                transform: scale(1) rotate(0deg);
            }
            25% {
                transform: scale(1.1) rotate(5deg);
            }
            50% {
                transform: scale(1.1) rotate(-5deg);
            }
            75% {
                transform: scale(1.1) rotate(3deg);
            }
            100% {
                transform: scale(1) rotate(0deg);
            }
        }

        .whatsapp-button.attention {
            animation: attentionAnimation 2s ease-in-out infinite; /* Animação de atenção por 2 segundos */
        }

        .conversaowhatsapp {
            /* Defina estilos para a classe conversaowhatsapp aqui */
        }


/* ajuste de fonte só para visual (opcional) */
.hero { 
  font-weight: 300; 
  line-height: 1.05; 
  color: #f2f2f2;
}

/* destaque com “pílula” inclinada e gradiente atrás do texto */
.hl{
  position: relative;
  font-style: italic;                  /* combina com o look da arte */
  box-decoration-break: clone;         /* mantém o fundo se quebrar de linha */
  -webkit-box-decoration-break: clone; 
  padding: 0 .06em;                    /* micro respiro lateral no texto */
}

/* 1ª faixa (magenta) */
.hl::before{
  content:"";
  position:absolute;
  z-index:-1;                          /* fica atrás do texto */
  left: -.15em;
  right: -.15em;
  top: 58%;                            /* coloca a faixa “passando” pelo meio das letras */
  height: .62em;                       /* espessura da faixa */
  background: linear-gradient(90deg,#FF3D9A 0%, #FF6AA8 60%, #FF8FB0 100%);
  transform: skewX(-12deg);            /* bordas diagonais */
  border-radius: .4em;                 /* pílula */
  filter: drop-shadow(0 1px 0 rgba(0,0,0,.15));
}

/* 2ª faixa (laranja) deslocada — dá a sensação de duas etiquetas sobrepostas */
.hl::after{
  content:"";
  position:absolute;
  z-index:-2;
  left: -.05em;
  right: -.05em;
  top: 62%;
  height: .58em;
  background: linear-gradient(90deg,#FF8A00 0%, #FFB347 100%);
  transform: skewX(-12deg);
  border-radius: .4em;
  opacity: .95;
}

/* ajustes rápidos caso o título seja muito grande em telas pequenas */
@media (max-width: 560px){
  .hl::before{ top: 60%; height: .56em; }
  .hl::after{  top: 64%; height: .52em; }
}


.builder-row-settings{
  font-size: 15px !important;
}


.whatsapp-button {
    z-index: 999999 !important;
    position: fixed !important;
    bottom: 20px !important;
    right: 20px !important;
    pointer-events: auto !important;
    width: 60px !important;
    height: 60px !important;
}

#sp-footer {
    position: relative !important;
}

#sp-footer::after {
    content: '';
    position: fixed;
    bottom: 10px;
    right: 10px;
    width: 80px;
    height: 80px;
    pointer-events: none;
    z-index: 998;
    background: transparent;
}

/* Correção principal para o botão WhatsApp */
.whatsapp-button {
    z-index: 999999 !important;
    position: fixed !important;
    bottom: 20px !important;
    right: 20px !important;
    pointer-events: auto !important;
    width: 60px !important;
    height: 60px !important;
}

/* Configurar o footer para não interferir */
#sp-footer {
    position: relative !important;
}

/* Criar uma zona de exclusão para o botão usando pseudo-elemento */
#sp-footer::after {
    content: '';
    position: fixed;
    bottom: 10px;
    right: 10px;
    width: 80px;
    height: 80px;
    pointer-events: none;
    z-index: 999998;
    background: transparent;
}

/* Solução alternativa usando clip-path (para navegadores compatíveis) */
@supports (clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%)) {
    #sp-footer {
        clip-path: polygon(
            0 0, 
            100% 0, 
            100% calc(100% - 100px), 
            calc(100% - 100px) calc(100% - 100px),
            calc(100% - 100px) 100%,
            0 100%
        ) !important;
    }
}