.elementor-kit-27{--e-global-color-primary:#F19639;--e-global-color-secondary:#467FBD;--e-global-color-text:#121212;--e-global-color-accent:#F19639;--e-global-color-9846edf:#F8FAFA;--e-global-color-29f8638:#FFFFFF;--e-global-typography-primary-font-family:"Montserrat";--e-global-typography-primary-font-weight:600;--e-global-typography-secondary-font-family:"Inter";--e-global-typography-secondary-font-weight:500;--e-global-typography-text-font-family:"Inter";--e-global-typography-text-font-weight:500;--e-global-typography-accent-font-family:"Inter";--e-global-typography-accent-font-weight:700;--e-global-typography-7d526a0-font-family:"Montserrat";--e-global-typography-7d526a0-font-size:clamp(2.027rem, 1.3974rem + 2.0146vw, 3.815rem);--e-global-typography-7d526a0-font-weight:900;--e-global-typography-f3fb992-font-family:"Montserrat";--e-global-typography-f3fb992-font-size:clamp(1.802rem, 1.3619rem + 1.4085vw, 3.052rem);--e-global-typography-f3fb992-font-weight:800;--e-global-typography-a8db8c2-font-family:"Montserrat";--e-global-typography-a8db8c2-font-size:clamp(1.602rem, 1.3066rem + 0.9454vw, 2.441rem);--e-global-typography-a8db8c2-font-weight:800;--e-global-typography-d2f6746-font-family:"Montserrat";--e-global-typography-d2f6746-font-size:clamp(1.424rem, 1.2377rem + 0.5961vw, 1.953rem);--e-global-typography-d2f6746-font-weight:600;--e-global-typography-ffb1ee4-font-family:"Montserrat";--e-global-typography-ffb1ee4-font-size:clamp(1.266rem, 1.1614rem + 0.3346vw, 1.563rem);--e-global-typography-ffb1ee4-font-weight:600;--e-global-typography-4308b21-font-family:"Montserrat";--e-global-typography-4308b21-font-size:clamp(1.266rem, 1.2716rem + -0.018vw, 1.25rem);--e-global-typography-a7a33ef-font-family:"Inter";--e-global-typography-a7a33ef-font-size:clamp(1.1rem, 1.1rem + 0vw, 1.1rem);--e-global-typography-a7a33ef-font-weight:500;background-color:var( --e-global-color-9846edf );font-family:var( --e-global-typography-a7a33ef-font-family ), Sans-serif;font-size:var( --e-global-typography-a7a33ef-font-size );font-weight:var( --e-global-typography-a7a33ef-font-weight );}.elementor-kit-27 button,.elementor-kit-27 input[type="button"],.elementor-kit-27 input[type="submit"],.elementor-kit-27 .elementor-button{background-color:var( --e-global-color-primary );font-family:"Montserrat", Sans-serif;font-weight:600;}.elementor-kit-27 e-page-transition{background-color:#FFBC7D;}.elementor-kit-27 h1{font-family:var( --e-global-typography-7d526a0-font-family ), Sans-serif;font-size:var( --e-global-typography-7d526a0-font-size );font-weight:var( --e-global-typography-7d526a0-font-weight );}.elementor-kit-27 h2{font-family:var( --e-global-typography-f3fb992-font-family ), Sans-serif;font-size:var( --e-global-typography-f3fb992-font-size );font-weight:var( --e-global-typography-f3fb992-font-weight );}.elementor-kit-27 h3{font-family:var( --e-global-typography-a8db8c2-font-family ), Sans-serif;font-size:var( --e-global-typography-a8db8c2-font-size );font-weight:var( --e-global-typography-a8db8c2-font-weight );}.elementor-kit-27 h4{font-family:var( --e-global-typography-d2f6746-font-family ), Sans-serif;font-size:var( --e-global-typography-d2f6746-font-size );font-weight:var( --e-global-typography-d2f6746-font-weight );}.elementor-kit-27 h5{font-family:var( --e-global-typography-ffb1ee4-font-family ), Sans-serif;font-size:var( --e-global-typography-ffb1ee4-font-size );font-weight:var( --e-global-typography-ffb1ee4-font-weight );}.elementor-kit-27 h6{font-family:var( --e-global-typography-4308b21-font-family ), Sans-serif;font-size:var( --e-global-typography-4308b21-font-size );}.elementor-kit-27 input:not([type="button"]):not([type="submit"]),.elementor-kit-27 textarea,.elementor-kit-27 .elementor-field-textual{font-family:"Inter", Sans-serif;accent-color:#020101;border-style:solid;border-color:#467FBD7A;border-radius:20px 20px 20px 20px;transition:500ms;}.elementor-kit-27 input:focus:not([type="button"]):not([type="submit"]),.elementor-kit-27 textarea:focus,.elementor-kit-27 .elementor-field-textual:focus{accent-color:var( --e-global-color-primary );box-shadow:0px 5px 10px 0px rgba(0, 0, 0, 0.1);border-style:solid;border-color:var( --e-global-color-accent );}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1300px;}.e-con{--container-max-width:1300px;}.elementor-widget:not(:last-child){--kit-widget-spacing:20px;}.elementor-element{--widgets-spacing:20px 20px;--widgets-spacing-row:20px;--widgets-spacing-column:20px;}{}h1.entry-title{display:var(--page-title-display);}@media(max-width:1024px){.elementor-kit-27{font-size:var( --e-global-typography-a7a33ef-font-size );}.elementor-kit-27 h1{font-size:var( --e-global-typography-7d526a0-font-size );}.elementor-kit-27 h2{font-size:var( --e-global-typography-f3fb992-font-size );}.elementor-kit-27 h3{font-size:var( --e-global-typography-a8db8c2-font-size );}.elementor-kit-27 h4{font-size:var( --e-global-typography-d2f6746-font-size );}.elementor-kit-27 h5{font-size:var( --e-global-typography-ffb1ee4-font-size );}.elementor-kit-27 h6{font-size:var( --e-global-typography-4308b21-font-size );}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1024px;}.e-con{--container-max-width:1024px;}}@media(max-width:767px){.elementor-kit-27{font-size:var( --e-global-typography-a7a33ef-font-size );}.elementor-kit-27 h1{font-size:var( --e-global-typography-7d526a0-font-size );}.elementor-kit-27 h2{font-size:var( --e-global-typography-f3fb992-font-size );}.elementor-kit-27 h3{font-size:var( --e-global-typography-a8db8c2-font-size );}.elementor-kit-27 h4{font-size:var( --e-global-typography-d2f6746-font-size );}.elementor-kit-27 h5{font-size:var( --e-global-typography-ffb1ee4-font-size );}.elementor-kit-27 h6{font-size:var( --e-global-typography-4308b21-font-size );}.elementor-kit-27 input:not([type="button"]):not([type="submit"]),.elementor-kit-27 textarea,.elementor-kit-27 .elementor-field-textual{font-size:16px;border-width:1px 1px 1px 1px;}.elementor-kit-27 input:focus:not([type="button"]):not([type="submit"]),.elementor-kit-27 textarea:focus,.elementor-kit-27 .elementor-field-textual:focus{border-width:1px 1px 1px 1px;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:767px;}.e-con{--container-max-width:767px;}}/* Start custom CSS */body {
  position: relative;
  min-height: 100vh;
  background-color: #ffffff;
}

body::before {
  content: '';
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 0;
  pointer-events: none;
  background-image: 
    linear-gradient(to right, rgba(229,231,235,0.8) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(229,231,235,0.8) 1px, transparent 1px),
    radial-gradient(circle 500px at 0% 20%, rgba(70,127,189,0.3), transparent),
    radial-gradient(circle 500px at 100% 0%, rgba(241,150,57,0.3), transparent);
  background-size: 48px 48px, 48px 48px, 100% 100%, 100% 100%;
}

/* Asegura que el contenido esté por encima */
.elementor-section {
  position: relative;
  z-index: 1;
}



/* ====================================
   VARIABLES PERSONALIZABLES
   ==================================== */
:root {
  --lasso-border-color: #467FBD;
  --lasso-animation-speed: 0.5s;
   --icon-size: 18px;
}

/* ====================================
   ESTILOS DEL BOTÓN LASSO
   ==================================== */

/* Línea inferior animada */
.button-detail .elementor-button::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  width: 80%;
  height: 1px;
  background: var(--lasso-border-color);
  transition: width var(--lasso-animation-speed), 
              left var(--lasso-animation-speed);
}

/* El ícono ya existe, solo lo usamos como referencia */
.button-detail .elementor-button-icon {
  position: relative !important;
  display: inline-flex !important;
}

/* Círculo SVG animado alrededor del ícono */
.button-detail .elementor-button-icon::before {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 40px;
  height: 40px;
  border: 1px solid var(--lasso-border-color);
  border-radius: 50%;
  opacity: 0;
  transform: translate(-50%, -50%) scale(0.5);
  transition: opacity var(--lasso-animation-speed), 
              transform var(--lasso-animation-speed);
  pointer-events: none;
}

/* ====================================
   ANIMACIONES HOVER
   ==================================== */
.button-detail .elementor-button:hover::after {
  width: 0;
  left: 100%;
}

.button-detail .elementor-button:hover .elementor-button-icon::before {
  opacity: 1;
  transform: translate(-50%, -50%) scale(1);
}



/* ====================================
   TAMAÑO DEL ÍCONO
   ==================================== */
.button-detail .elementor-button-icon svg {
  width: var(--icon-size) !important;
  height: var(--icon-size) !important;
}


/* ====================================
contenedor glass   ==================================== */

.contenedor-glass{
    backdrop-filter: blur(6px);
      -webkit-backdrop-filter: blur(6px);
}


/* ANIMACIONES LISTING DE SERVICIOS */

/* Ocultar imagen por defecto */
.container-image-fade-in .imagen-fade-in-hover {
  opacity: 0;
  transform: translateY(20px) scale(0.95) rotate(0deg);
  transition: all 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  pointer-events: none;
}

/* Mostrar imagen al hacer hover en el contenedor con rotación */
.container-image-fade-in:hover .imagen-fade-in-hover {
  opacity: 1;
  transform: translateY(0) scale(1) rotate(-8deg);
  pointer-events: auto;
}

/* Animación del contenedor con padding suave + border */
.container-image-fade-in {
  position: relative;
  padding-left: 0;
  padding-right: 0;
  border-top: 1px solid rgba(20, 20, 20, 0.20);
  transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.container-image-fade-in:hover {
  padding-left: 20px;
  padding-right: 20px;
}

/* Texto bold en hover */
.container-image-fade-in .texto-hover-bold {
  font-weight: normal;
  transition: font-weight 0.3s ease-out;
}

.container-image-fade-in:hover .texto-hover-bold {
  font-weight: bold;
}

/* Animación del color de fondo - AJUSTADO para no interferir con el border */
.container-image-fade-in::before {
  content: '';
  position: absolute;
  top: 1px; /* Empezar después del border */
  left: 0;
  right: 0;
  height: 0;
  background: var(--elementor-hover-color, #f0f0f0);
  transform-origin: center top; /* Cambiar el origen de transformación */
  transition: height 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  z-index: -1;
  border-radius: 20px;
}

.container-image-fade-in:hover::before {
  height: calc(100% - 1px); /* Restar el grosor del border */
}

/* Animación más suave para el image-box con rotación adicional */
.container-image-fade-in .imagen-fade-in-hover .elementor-image-box-wrapper {
  transition: transform 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.1s;
  transform-origin: center center;
}

.container-image-fade-in:hover .imagen-fade-in-hover .elementor-image-box-wrapper {
  transform: translateY(-5px);
}

/* ========================================
   ICONO - ROTACIÓN + COLOR HOVER
======================================== */

/* Icono base - transición suave */
.container-image-fade-in .elementor-icon-wrapper,
.container-image-fade-in .elementor-icon {
  transition: transform 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

/* Hover: Rotar 45° + cambiar a naranja */
.container-image-fade-in:hover .elementor-icon-wrapper,
.container-image-fade-in:hover .elementor-icon {
  transform: rotate(22deg);
}

.container-image-fade-in:hover .elementor-icon  {
  background-color: #F09941!important; /* Ajusta el naranja que prefieras */
  transition: all 0.7s;
}

/* Estilo general para formulario con clase boton-whatsapp */
.boton-whatsapp .elementor-field-type-submit .elementor-button {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0 !important;
    width: auto;
    cursor: pointer;
}

/* Texto del botón */
.boton-whatsapp .elementor-field-type-submit .elementor-button-text {
    background-color: #25D366;
    padding: 15px;
    border-radius: 20px;
    transition: background-color 0.3s ease;
    color: white !important;
    font-weight: 500;
}

/* Ícono del botón (si tiene) */
.boton-whatsapp .elementor-field-type-submit .elementor-button-icon {
    padding: 15px;
    background-color: #25D366;
    border-radius: 50%;
    transition: background-color 0.3s ease, transform 0.4s ease;
    overflow: hidden;
    position: relative;
}

.boton-whatsapp .elementor-field-type-submit .elementor-button-icon svg {
    filter: brightness(0) invert(1);
    transition: transform 0.4s ease, opacity 0.4s ease;
    display: block;
}

/* Hover */
.boton-whatsapp .elementor-field-type-submit:hover .elementor-button-text,
.boton-whatsapp .elementor-field-type-submit:hover .elementor-button-icon {
    background-color: #128C7E;
}

.boton-whatsapp .elementor-field-type-submit:hover .elementor-button-icon {
    transform: scale(1.1);
}

.boton-whatsapp .elementor-field-type-submit:hover .elementor-button-icon svg {
    transform: translateY(-100%) scale(0.8);
    opacity: 0;
}

/* Icono duplicado desde abajo */
.boton-whatsapp .elementor-field-type-submit .elementor-button-icon::after {
    content: '';
    position: absolute;
    top: 15px;
    left: 15px;
    right: 15px;
    bottom: 15px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='white'%3E%3Cpath d='M17.472 14.382c-.297-.149-1.758-.867-2.03-.967-.273-.099-.471-.148-.67.15-.197.297-.767.966-.94 1.164-.173.199-.347.223-.644.075-.297-.15-1.255-.463-2.39-1.475-.883-.788-1.48-1.761-1.653-2.059-.173-.297-.018-.458.13-.606.134-.133.298-.347.446-.52.149-.174.198-.298.298-.497.099-.198.05-.371-.025-.52-.075-.149-.669-1.612-.916-2.207-.242-.579-.487-.5-.669-.51-.173-.008-.371-.01-.57-.01-.198 0-.52.074-.792.372-.272.297-1.04 1.016-1.04 2.479 0 1.462 1.065 2.875 1.213 3.074.149.198 2.096 3.2 5.077 4.487.709.306 1.262.489 1.694.625.712.227 1.36.195 1.871.118.571-.085 1.758-.719 2.006-1.413.248-.694.248-1.289.173-1.413-.074-.124-.272-.198-.57-.347m-5.421 7.403h-.004a9.87 9.87 0 01-5.031-1.378l-.361-.214-3.741.982.998-3.648-.235-.374a9.86 9.86 0 01-1.51-5.26c.001-5.45 4.436-9.884 9.888-9.884 2.64 0 5.122 1.03 6.988 2.898a9.825 9.825 0 012.893 6.994c-.003 5.45-4.437 9.884-9.885 9.884m8.413-18.297A11.815 11.815 0 0012.05 0C5.495 0 .16 5.335.157 11.892c0 2.096.547 4.142 1.588 5.945L.057 24l6.305-1.654a11.882 11.882 0 005.683 1.448h.005c6.554 0 11.890-5.335 11.893-11.893A11.821 11.821 0 0020.484 3.206'/%3E%3C/svg%3E");
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    transform: translateY(100%) scale(0.8);
    transition: transform 0.4s ease, opacity 0.4s ease;
    opacity: 0;
}

.boton-whatsapp .elementor-field-type-submit:hover .elementor-button-icon::after {
    transform: translateY(0) scale(1);
    opacity: 1;
}

/* Pulso */
.boton-whatsapp .elementor-field-type-submit .elementor-button-icon {
    animation: whatsapp-pulse 2s infinite;
}

@keyframes whatsapp-pulse {
    0% { box-shadow: 0 0 0 0 rgba(37, 211, 102, 0.7); }
    70% { box-shadow: 0 0 0 10px rgba(37, 211, 102, 0); }
    100% { box-shadow: 0 0 0 0 rgba(37, 211, 102, 0); }
}




/* boton header y variacion flecha */
.button-header-1 .elementor-button {
    width: 100%; /* Hacer que el botón ocupe todo el ancho disponible */
}

.button-header-1 .elementor-button-content-wrapper {
    gap: 0px !important;
    display: flex !important;
    width: 100%;
    align-items: center;
}

.button-header-1 .elementor-button-text {
    background-color: #467fbd;
    padding: 15px;
    border-radius: 50px;
    transition: background-color 0.3s ease;
    flex: 1; /* Esto hace que el texto tome todo el espacio disponible */
    text-align: center; /* Centrar el texto */
}

.button-header-1 .elementor-button-icon {
    padding: 15px;
    background-color: #467fbd;
    border-radius: 50%;
    transition: background-color 0.3s ease;
    overflow: hidden;
    position: relative;
    flex-shrink: 0; /* Evita que el ícono se comprima */
    width: auto; /* Mantiene el tamaño natural del ícono */
}

.button-header-1 .elementor-button-icon svg {
    filter: brightness(0) invert(1);
    transition: transform 0.4s ease, opacity 0.4s ease;
    display: block;
}

/* Efectos hover */
.button-header-1:hover .elementor-button-text,
.button-header-1:hover .elementor-button-icon {
    background-color: #F19639;
}

.button-header-1:hover .elementor-button-icon svg {
    transform: translateY(-100%) scale(0.8);
    opacity: 0; /* Ocultar completamente la flecha original */
}

/* Crear el ícono duplicado que aparece desde abajo */
.button-header-1 .elementor-button-icon::after {
    content: '';
    position: absolute;
    top: 15px;
    left: 15px;
    right: 15px;
    bottom: 15px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='800px' height='800px' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M7 17L17 7M17 7H8M17 7V16' stroke='%23ffffff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    transform: translateY(100%) scale(0.8);
    transition: transform 0.4s ease, opacity 0.4s ease;
    opacity: 0;
}

.button-header-1:hover .elementor-button-icon::after {
    transform: translateY(0) scale(1);
    opacity: 1;
}
/* boton whatsapp y icono hover */

.button-whatsapp .elementor-button {
    width: 100%; /* Hacer que el botón ocupe todo el ancho disponible */
}

.button-whatsapp .elementor-button-content-wrapper {
    gap: 0px !important;
    display: flex !important;
    width: 100%;
    align-items: center;
}

.button-whatsapp .elementor-button-text {
    background-color: #25D366; /* Verde oficial de WhatsApp */
    padding: 15px;
    border-radius: 20px;
    transition: background-color 0.3s ease;
    color: white !important;
    font-weight: 500;
    flex: 1; /* Esto hace que el texto tome todo el espacio disponible */
    text-align: center; /* Centrar el texto */
}

.button-whatsapp .elementor-button-icon {
    padding: 15px;
    background-color: #25D366; /* Verde oficial de WhatsApp */
    border-radius: 50%;
    transition: background-color 0.3s ease, transform 0.4s ease;
    overflow: hidden;
    position: relative;
    flex-shrink: 0; /* Evita que el ícono se comprima */
    width: auto; /* Mantiene el tamaño natural del ícono */
}

.button-whatsapp .elementor-button-icon svg {
    filter: brightness(0) invert(1);
    transition: transform 0.4s ease, opacity 0.4s ease;
    display: block;
}

/* Efectos hover con el verde más oscuro de WhatsApp */
.button-whatsapp:hover .elementor-button-text,
.button-whatsapp:hover .elementor-button-icon {
    background-color: #128C7E; /* Verde más oscuro de WhatsApp para hover */
}

.button-whatsapp:hover .elementor-button-icon {
    transform: scale(1.1); /* Efecto de crecimiento en hover */
}

.button-whatsapp:hover .elementor-button-icon svg {
    transform: translateY(-100%) scale(0.8);
    opacity: 0;
}

/* Crear el ícono duplicado que aparece desde abajo */
.button-whatsapp .elementor-button-icon::after {
    content: '';
    position: absolute;
    top: 15px;
    left: 15px;
    right: 15px;
    bottom: 15px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='white'%3E%3Cpath d='M17.472 14.382c-.297-.149-1.758-.867-2.03-.967-.273-.099-.471-.148-.67.15-.197.297-.767.966-.94 1.164-.173.199-.347.223-.644.075-.297-.15-1.255-.463-2.39-1.475-.883-.788-1.48-1.761-1.653-2.059-.173-.297-.018-.458.13-.606.134-.133.298-.347.446-.52.149-.174.198-.298.298-.497.099-.198.05-.371-.025-.52-.075-.149-.669-1.612-.916-2.207-.242-.579-.487-.5-.669-.51-.173-.008-.371-.01-.57-.01-.198 0-.52.074-.792.372-.272.297-1.04 1.016-1.04 2.479 0 1.462 1.065 2.875 1.213 3.074.149.198 2.096 3.2 5.077 4.487.709.306 1.262.489 1.694.625.712.227 1.36.195 1.871.118.571-.085 1.758-.719 2.006-1.413.248-.694.248-1.289.173-1.413-.074-.124-.272-.198-.57-.347m-5.421 7.403h-.004a9.87 9.87 0 01-5.031-1.378l-.361-.214-3.741.982.998-3.648-.235-.374a9.86 9.86 0 01-1.51-5.26c.001-5.45 4.436-9.884 9.888-9.884 2.64 0 5.122 1.03 6.988 2.898a9.825 9.825 0 012.893 6.994c-.003 5.45-4.437 9.884-9.885 9.884m8.413-18.297A11.815 11.815 0 0012.05 0C5.495 0 .16 5.335.157 11.892c0 2.096.547 4.142 1.588 5.945L.057 24l6.305-1.654a11.882 11.882 0 005.683 1.448h.005c6.554 0 11.890-5.335 11.893-11.893A11.821 11.821 0 0020.484 3.206'/%3E%3C/svg%3E");
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    transform: translateY(100%) scale(0.8);
    transition: transform 0.4s ease, opacity 0.4s ease;
    opacity: 0;
}

.button-whatsapp:hover .elementor-button-icon::after {
    transform: translateY(0) scale(1);
    opacity: 1;
}

/* Efecto de pulso opcional para llamar más la atención */
.button-whatsapp .elementor-button-icon {
    animation: whatsapp-pulse 2s infinite;
}

@keyframes whatsapp-pulse {
    0% { box-shadow: 0 0 0 0 rgba(37, 211, 102, 0.7); }
    70% { box-shadow: 0 0 0 10px rgba(37, 211, 102, 0); }
    100% { box-shadow: 0 0 0 0 rgba(37, 211, 102, 0); }
}


/* VARIACIÓN DEL BOTÓN WHATSAPP */

.button-whatsapp-variation .elementor-button {
    width: 100%; /* Hacer que el botón ocupe todo el ancho disponible */
}

.button-whatsapp-variation .elementor-button-content-wrapper {
    gap: 0px !important;
    display: flex !important;
    width: 100%;
    align-items: center;
}

.button-whatsapp-variation .elementor-button-text {
    background-color: #075E54;
    padding: 15px;
    border-radius: 20px;
    transition: background-color 0.3s ease;
    color: white !important;
    font-weight: 500;
    flex: 1; /* Esto hace que el texto tome todo el espacio disponible */
    text-align: center; /* Centrar el texto */
}

.button-whatsapp-variation .elementor-button-icon {
    padding: 15px;
    background-color: #075E54;
    border-radius: 50%;
    transition: background-color 0.3s ease, transform 0.4s ease;
    overflow: hidden;
    position: relative;
    flex-shrink: 0; /* Evita que el ícono se comprima */
    width: auto; /* Mantiene el tamaño natural del ícono */
}

.button-whatsapp-variation .elementor-button-icon svg {
    filter: brightness(0) invert(1);
    transition: transform 0.4s ease, opacity 0.4s ease;
    display: block;
}

/* Efectos hover */
.button-whatsapp-variation:hover .elementor-button-text,
.button-whatsapp-variation:hover .elementor-button-icon {
    background-color: #25D366;
}

.button-whatsapp-variation:hover .elementor-button-icon {
    transform: scale(1.1);
}

.button-whatsapp-variation:hover .elementor-button-icon svg {
    transform: translateY(-100%) scale(0.8);
    opacity: 0;
}

/* Crear el ícono duplicado que aparece desde abajo */
.button-whatsapp-variation .elementor-button-icon::after {
    content: '';
    position: absolute;
    top: 15px;
    left: 15px;
    right: 15px;
    bottom: 15px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='white'%3E%3Cpath d='M17.472 14.382c-.297-.149-1.758-.867-2.03-.967-.273-.099-.471-.148-.67.15-.197.297-.767.966-.94 1.164-.173.199-.347.223-.644.075-.297-.15-1.255-.463-2.39-1.475-.883-.788-1.48-1.761-1.653-2.059-.173-.297-.018-.458.13-.606.134-.133.298-.347.446-.52.149-.174.198-.298.298-.497.099-.198.05-.371-.025-.52-.075-.149-.669-1.612-.916-2.207-.242-.579-.487-.5-.669-.51-.173-.008-.371-.01-.57-.01-.198 0-.52.074-.792.372-.272.297-1.04 1.016-1.04 2.479 0 1.462 1.065 2.875 1.213 3.074.149.198 2.096 3.2 5.077 4.487.709.306 1.262.489 1.694.625.712.227 1.36.195 1.871.118.571-.085 1.758-.719 2.006-1.413.248-.694.248-1.289.173-1.413-.074-.124-.272-.198-.57-.347m-5.421 7.403h-.004a9.87 9.87 0 01-5.031-1.378l-.361-.214-3.741.982.998-3.648-.235-.374a9.86 9.86 0 01-1.51-5.26c.001-5.45 4.436-9.884 9.888-9.884 2.64 0 5.122 1.03 6.988 2.898a9.825 9.825 0 012.893 6.994c-.003 5.45-4.437 9.884-9.885 9.884m8.413-18.297A11.815 11.815 0 0012.05 0C5.495 0 .16 5.335.157 11.892c0 2.096.547 4.142 1.588 5.945L.057 24l6.305-1.654a11.882 11.882 0 005.683 1.448h.005c6.554 0 11.890-5.335 11.893-11.893A11.821 11.821 0 0020.484 3.206'/%3E%3C/svg%3E");
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    transform: translateY(100%) scale(0.8);
    transition: transform 0.4s ease, opacity 0.4s ease;
    opacity: 0;
}

.button-whatsapp-variation:hover .elementor-button-icon::after {
    transform: translateY(0) scale(1);
    opacity: 1;
}

/* Efecto de pulso con el color accesible */
.button-whatsapp-variation .elementor-button-icon {
    animation: whatsapp-pulse-variation 2s infinite;
}

@keyframes whatsapp-pulse-variation {
    0% { box-shadow: 0 0 0 0 rgba(7, 94, 84, 0.7); }
    70% { box-shadow: 0 0 0 10px rgba(7, 94, 84, 0); }
    100% { box-shadow: 0 0 0 0 rgba(7, 94, 84, 0); }
}/* End custom CSS */