.elementor-1529 .elementor-element.elementor-element-83a5db6{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--margin-top:0px;--margin-bottom:60px;--margin-left:0px;--margin-right:0px;}.elementor-1529 .elementor-element.elementor-element-b386f21{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;}.elementor-1529 .elementor-element.elementor-element-3d4b364{width:var( --container-widget-width, 18.777% );max-width:18.777%;--container-widget-width:18.777%;--container-widget-flex-grow:0;--wd-img-height:350px;}.elementor-1529 .elementor-element.elementor-element-3d4b364.elementor-element{--flex-grow:0;--flex-shrink:0;}.elementor-1529 .elementor-element.elementor-element-3d4b364 .banner-image{object-position:center center;}.elementor-1529 .elementor-element.elementor-element-3d4b364 .banner-title{color:#161616D4;font-size:30px;line-height:1.2em;}.elementor-1529 .elementor-element.elementor-element-3d4b364 .promo-banner:not(.banner-content-background) .content-banner, .elementor-1529 .elementor-element.elementor-element-3d4b364 .promo-banner.banner-content-background .wrapper-content-banner{max-width:360px;}.elementor-1529 .elementor-element.elementor-element-65ae54d{width:var( --container-widget-width, 18.777% );max-width:18.777%;--container-widget-width:18.777%;--container-widget-flex-grow:0;--wd-img-height:350px;}.elementor-1529 .elementor-element.elementor-element-65ae54d.elementor-element{--flex-grow:0;--flex-shrink:0;}.elementor-1529 .elementor-element.elementor-element-65ae54d .banner-image{object-position:center center;}.elementor-1529 .elementor-element.elementor-element-65ae54d .banner-title{color:#161616D4;font-size:30px;line-height:1.2em;}.elementor-1529 .elementor-element.elementor-element-65ae54d .promo-banner:not(.banner-content-background) .content-banner, .elementor-1529 .elementor-element.elementor-element-65ae54d .promo-banner.banner-content-background .wrapper-content-banner{max-width:360px;}.elementor-1529 .elementor-element.elementor-element-f708088{width:var( --container-widget-width, 18.777% );max-width:18.777%;--container-widget-width:18.777%;--container-widget-flex-grow:0;--wd-img-height:350px;}.elementor-1529 .elementor-element.elementor-element-f708088.elementor-element{--flex-grow:0;--flex-shrink:0;}.elementor-1529 .elementor-element.elementor-element-f708088 .banner-image{object-position:center center;}.elementor-1529 .elementor-element.elementor-element-f708088 .banner-title{color:#161616D4;font-size:30px;line-height:1.2em;}.elementor-1529 .elementor-element.elementor-element-f708088 .promo-banner:not(.banner-content-background) .content-banner, .elementor-1529 .elementor-element.elementor-element-f708088 .promo-banner.banner-content-background .wrapper-content-banner{max-width:360px;}.elementor-1529 .elementor-element.elementor-element-f1d13b6{width:var( --container-widget-width, 18.777% );max-width:18.777%;--container-widget-width:18.777%;--container-widget-flex-grow:0;--wd-img-height:350px;}.elementor-1529 .elementor-element.elementor-element-f1d13b6.elementor-element{--flex-grow:0;--flex-shrink:0;}.elementor-1529 .elementor-element.elementor-element-f1d13b6 .banner-image{object-position:center center;}.elementor-1529 .elementor-element.elementor-element-f1d13b6 .banner-title{color:#161616D4;font-size:30px;line-height:1.2em;}.elementor-1529 .elementor-element.elementor-element-f1d13b6 .promo-banner:not(.banner-content-background) .content-banner, .elementor-1529 .elementor-element.elementor-element-f1d13b6 .promo-banner.banner-content-background .wrapper-content-banner{max-width:360px;}.elementor-1529 .elementor-element.elementor-element-6525937{width:var( --container-widget-width, 18.777% );max-width:18.777%;--container-widget-width:18.777%;--container-widget-flex-grow:0;--wd-img-height:350px;}.elementor-1529 .elementor-element.elementor-element-6525937.elementor-element{--flex-grow:0;--flex-shrink:0;}.elementor-1529 .elementor-element.elementor-element-6525937 .banner-image{object-position:center center;}.elementor-1529 .elementor-element.elementor-element-6525937 .banner-title{color:#161616D4;font-size:30px;line-height:1.2em;}.elementor-1529 .elementor-element.elementor-element-6525937 .promo-banner:not(.banner-content-background) .content-banner, .elementor-1529 .elementor-element.elementor-element-6525937 .promo-banner.banner-content-background .wrapper-content-banner{max-width:360px;}.elementor-1529 .elementor-element.elementor-element-effd22f{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--gap:20px 20px;--row-gap:20px;--column-gap:20px;}.elementor-1529 .elementor-element.elementor-element-1f26e6e{width:var( --container-widget-width, 33.3% );max-width:33.3%;--container-widget-width:33.3%;--container-widget-flex-grow:0;--wd-img-height:400px;}.elementor-1529 .elementor-element.elementor-element-1f26e6e .banner-image{object-position:center center;}.elementor-1529 .elementor-element.elementor-element-1f26e6e .wrapper-content-banner{background-color:#9E724B;}.elementor-1529 .elementor-element.elementor-element-1f26e6e .banner-title{color:#FEFAF5D4;font-size:30px;line-height:1.2em;}.elementor-1529 .elementor-element.elementor-element-1f26e6e .promo-banner:not(.banner-content-background) .content-banner, .elementor-1529 .elementor-element.elementor-element-1f26e6e .promo-banner.banner-content-background .wrapper-content-banner{max-width:100%;min-height:190px;}.elementor-1529 .elementor-element.elementor-element-c9088d8{width:var( --container-widget-width, 33.3% );max-width:33.3%;--container-widget-width:33.3%;--container-widget-flex-grow:0;--wd-img-height:400px;}.elementor-1529 .elementor-element.elementor-element-c9088d8 .banner-image{object-position:center center;}.elementor-1529 .elementor-element.elementor-element-c9088d8 .wrapper-content-banner{background-color:#B6431F;}.elementor-1529 .elementor-element.elementor-element-c9088d8 .banner-title{color:#FEFAF5D4;font-size:30px;line-height:1.2em;}.elementor-1529 .elementor-element.elementor-element-c9088d8 .promo-banner:not(.banner-content-background) .content-banner, .elementor-1529 .elementor-element.elementor-element-c9088d8 .promo-banner.banner-content-background .wrapper-content-banner{max-width:100%;min-height:190px;}.elementor-1529 .elementor-element.elementor-element-653abcb{width:var( --container-widget-width, 33.3% );max-width:33.3%;--container-widget-width:33.3%;--container-widget-flex-grow:0;--wd-img-height:400px;}.elementor-1529 .elementor-element.elementor-element-653abcb .banner-image{object-position:center center;}.elementor-1529 .elementor-element.elementor-element-653abcb .wrapper-content-banner{background-color:#B6431F;}.elementor-1529 .elementor-element.elementor-element-653abcb .banner-title{color:#FEFAF5D4;font-size:30px;line-height:1.2em;}.elementor-1529 .elementor-element.elementor-element-653abcb .promo-banner:not(.banner-content-background) .content-banner, .elementor-1529 .elementor-element.elementor-element-653abcb .promo-banner.banner-content-background .wrapper-content-banner{max-width:100%;min-height:190px;}@media(max-width:1024px){.elementor-1529 .elementor-element.elementor-element-83a5db6{--margin-top:0px;--margin-bottom:30px;--margin-left:0px;--margin-right:0px;}.elementor-1529 .elementor-element.elementor-element-3d4b364 .banner-title{font-size:22px;}.elementor-1529 .elementor-element.elementor-element-3d4b364 .promo-banner:not(.banner-content-background) .content-banner, .elementor-1529 .elementor-element.elementor-element-3d4b364 .promo-banner.banner-content-background .wrapper-content-banner{max-width:240px;}.elementor-1529 .elementor-element.elementor-element-65ae54d .banner-title{font-size:22px;}.elementor-1529 .elementor-element.elementor-element-65ae54d .promo-banner:not(.banner-content-background) .content-banner, .elementor-1529 .elementor-element.elementor-element-65ae54d .promo-banner.banner-content-background .wrapper-content-banner{max-width:240px;}.elementor-1529 .elementor-element.elementor-element-f708088 .banner-title{font-size:22px;}.elementor-1529 .elementor-element.elementor-element-f708088 .promo-banner:not(.banner-content-background) .content-banner, .elementor-1529 .elementor-element.elementor-element-f708088 .promo-banner.banner-content-background .wrapper-content-banner{max-width:240px;}.elementor-1529 .elementor-element.elementor-element-f1d13b6 .banner-title{font-size:22px;}.elementor-1529 .elementor-element.elementor-element-f1d13b6 .promo-banner:not(.banner-content-background) .content-banner, .elementor-1529 .elementor-element.elementor-element-f1d13b6 .promo-banner.banner-content-background .wrapper-content-banner{max-width:240px;}.elementor-1529 .elementor-element.elementor-element-6525937 .banner-title{font-size:22px;}.elementor-1529 .elementor-element.elementor-element-6525937 .promo-banner:not(.banner-content-background) .content-banner, .elementor-1529 .elementor-element.elementor-element-6525937 .promo-banner.banner-content-background .wrapper-content-banner{max-width:240px;}.elementor-1529 .elementor-element.elementor-element-1f26e6e .banner-title{font-size:22px;}.elementor-1529 .elementor-element.elementor-element-c9088d8 .banner-title{font-size:22px;}.elementor-1529 .elementor-element.elementor-element-653abcb .banner-title{font-size:22px;}}@media(max-width:768px){.elementor-1529 .elementor-element.elementor-element-3d4b364{width:100%;max-width:100%;}.elementor-1529 .elementor-element.elementor-element-65ae54d{width:100%;max-width:100%;}.elementor-1529 .elementor-element.elementor-element-f708088{width:100%;max-width:100%;}.elementor-1529 .elementor-element.elementor-element-f1d13b6{width:100%;max-width:100%;}.elementor-1529 .elementor-element.elementor-element-6525937{width:100%;max-width:100%;}.elementor-1529 .elementor-element.elementor-element-1f26e6e{width:100%;max-width:100%;}.elementor-1529 .elementor-element.elementor-element-c9088d8{width:100%;max-width:100%;}.elementor-1529 .elementor-element.elementor-element-653abcb{width:100%;max-width:100%;}}@media(min-width:769px){.elementor-1529 .elementor-element.elementor-element-b386f21{--width:100%;}}/* Start custom CSS for wd_banner, class: .elementor-element-3d4b364 *//* ==========================================
   0. FORZAR LA CARTILLA COMO CONTENEDOR BASE Y DISTRIBUIR
   ========================================= */
.promo-banner,
.woodmart-promo-banner,
.elementor-1529 .elementor-element.elementor-element-3d4b364 .promo-banner {
  position: relative !important;
  overflow: hidden !important;
  height: 100% !important;
  cursor: pointer !important; /* Indica que toda la tarjeta es clicable */
}

/* Forzamos al contenedor de texto interno a estirarse y separar los elementos */
.elementor-1529 .elementor-element.elementor-element-3d4b364 .banner-content,
.elementor-1529 .elementor-element.elementor-element-3d4b364 .promo-banner-content {
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  width: 100% !important;
  height: 100% !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: space-between !important; /* Envía subtítulo/título ARRIBA y contenido ABAJO */
  align-items: center !important;
  text-align: center !important;
  padding: 35px 20px !important; /* Espaciado interno de la tarjeta */
  box-sizing: border-box !important;
  z-index: 99 !important;
}

/* ==========================================
   1. TEXTOS SUPERIORES (Ocultos pero reservando espacio)
   ========================================= */
.elementor-1529 .elementor-element.elementor-element-3d4b364 .banner-subtitle,
.elementor-1529 .elementor-element.elementor-element-3d4b364 .promo-banner-subtitle {
  opacity: 0 !important;          /* Se vuelve invisible */
  visibility: visible !important; /* Mantiene su espacio físico */
  margin-bottom: 5px !important;
}

.elementor-1529 .elementor-element.elementor-element-3d4b364 .banner-title,
.elementor-1529 .elementor-element.elementor-element-3d4b364 .promo-banner-title,
.elementor-1529 .elementor-element.elementor-element-3d4b364 h3 {
  position: relative !important;
  top: auto !important;
  left: auto !important;
  transform: none !important;
  opacity: 0 !important;          /* Se vuelve invisible */
  visibility: visible !important; /* Mantiene su espacio físico */
  margin: 0 0 auto 0 !important;  /* Sigue empujando el botón hacia abajo */
}

/* ==========================================
   2. EL CONTENIDO DE ABAJO TRANSFORMADO EN BOTÓN
   ========================================= */
.elementor-1529 .elementor-element.elementor-element-3d4b364 .banner-inner, 
.elementor-1529 .elementor-element.elementor-element-3d4b364 .promo-banner-description,
.elementor-1529 .elementor-element.elementor-element-3d4b364 p {
  margin-left: auto !important;   /* Estos dos autos centran por completo */
  margin-right: auto !important;  /* el bloque entero horizontalmente */
  margin-top: auto !important;    /* Lo ancla abajo */
  margin-bottom: 1px !important;

  /* Forzar tamaño compacto para que el borde no se estire */
  display: flex !important;
  width: 125px !important;
  max-width: max-content !important;

  /* Centrado interno perfecto del texto */
  align-items: center !important;     
  justify-content: center !important;   
  text-align: center !important;
  line-height: 1 !important;          

  /* Estilo del botón (Turquesa por defecto) */
  background-color: rgba(0, 0, 0, 0.2) !important;
  border: 3px solid #40E0D0 !important; /* Primer borde turquesa */
  border-radius: 150px !important;
  
  /* ---> TEXTO EN BOLD BLANCO <--- */
  color: #ffffff !important; 
  font-size: 30px !important;         
  padding: 20px 25px !important; /* Controla el tamaño interno del botón */
  text-transform: uppercase !important;
  letter-spacing: 1px !important;
  transition: all 0.3s ease-in-out !important;
  font-family: 'Impact', 'Arial Black', sans-serif !important; /* Fuente muy fuerte y gruesa */
  font-weight: 900 !important; /* Máximo grosor disponible */
  letter-spacing: 2px !important; /* Un poco de separación si las letras se juntan

  /* ---> DOBLE BORDE CORREGIDO (Pegado al botón original) <--- */
  box-shadow: 
    0 0 0 4px transparent,
    0 0 0 7px rgba(64, 224, 208, 0.45) !important;
}

/* ==========================================
   3. EFECTO HOVER EN ROSA (Al pasar el cursor sobre la tarjeta)
   ========================================= */
/* Detectamos el hover en el contenedor, pero alteramos el bloque de contenido (botón) */
.elementor-1529 .elementor-element.elementor-element-3d4b364:hover .banner-inner,
.elementor-1529 .elementor-element.elementor-element-3d4b364:hover .promo-banner-description,
.elementor-1529 .elementor-element.elementor-element-3d4b364:hover p {
  
  /* ---> CAMBIO A COLOR ROSA VIBRANTE <--- */
  background-color: #ff0066 !important; /* Fondo Rosa */
  border-color: #ff0066 !important;     /* Borde interno Rosa */
  color: #ffffff !important;           /* Texto Blanco */
  
  /* Efecto de crecimiento sutil del botón */
  transform: scale(1.05) !important;
  
  /* Mantenemos el doble borde, pero ahora en Rosa y con más brillo */
  box-shadow: 
    0 0 0 6px transparent, 
    0 0 0 7.5px rgba(255, 0, 102, 0.4),  /* Borde exterior Rosa suave */
    0 12px 24px rgba(255, 0, 102, 0.35) !important; /* Sombra de relieve Rosa */
  
  /* Sutil efecto 3D en las letras blancas sobre fondo rosa */
  text-shadow: 
    -1px -1px 0px rgba(0, 255, 255, 0.5), 
    1px 1px 0px rgba(255, 255, 255, 0.2) !important;
}

@media only screen and (min-width: 768px) and (max-width: 1024px) {

    /* Forzamos la reducción del texto atacando h3 y p juntos */
    .elementor-1529 .elementor-element.elementor-element-3d4b364 h3,
    .elementor-1529 .elementor-element.elementor-element-3d4b364 p,
    .elementor-1529 .elementor-element.elementor-element-3d4b364 .banner-title,
    .elementor-1529 .elementor-element.elementor-element-3d4b364 .promo-banner-description {
        font-size: 12px !important;    /* Achica la letra radicalmente */
        font-weight: 700 !important;   /* Reduce el grosor */
        letter-spacing: 0px !important;/* Junta las letras */
        
    }

    /* Reducimos el óvalo contenedor para que se adapte al nuevo texto chico */
    .elementor-1529 .elementor-element.elementor-element-3d4b364 p {
        width: 20px !important;
        max-width: 85px !important;
        padding: 4px 8px !important;
        margin: 0 auto !important;
        display: inline-flex !important;
    }
}/* End custom CSS */
/* Start custom CSS for wd_banner, class: .elementor-element-65ae54d *//* ==========================================
   0. FORZAR LA CARTILLA COMO CONTENEDOR BASE Y DISTRIBUIR
   ========================================= */
.promo-banner,
.woodmart-promo-banner,
.elementor-1529 .elementor-element.elementor-element-65ae54d .promo-banner {
  position: relative !important;
  overflow: hidden !important;
  height: 100% !important;
  cursor: pointer !important; /* Indica que toda la tarjeta es clicable */
}

/* Forzamos al contenedor de texto interno a estirarse y separar los elementos */
.elementor-1529 .elementor-element.elementor-element-65ae54d .banner-content,
.elementor-1529 .elementor-element.elementor-element-65ae54d .promo-banner-content {
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  width: 100% !important;
  height: 100% !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: space-between !important; /* Envía subtítulo/título ARRIBA y contenido ABAJO */
  align-items: center !important;
  text-align: center !important;
  padding: 35px 20px !important; /* Espaciado interno de la tarjeta */
  box-sizing: border-box !important;
  z-index: 99 !important;
}

/* ==========================================
   1. TEXTOS SUPERIORES (Ocultos pero reservando espacio)
   ========================================= */
.elementor-1529 .elementor-element.elementor-element-65ae54d .banner-subtitle,
.elementor-1529 .elementor-element.elementor-element-65ae54d .promo-banner-subtitle {
  opacity: 0 !important;          /* Se vuelve invisible */
  visibility: visible !important; /* Mantiene su espacio físico */
  margin-bottom: 5px !important;
}
.elementor-1529 .elementor-element.elementor-element-65ae54d .banner-title,
.elementor-1529 .elementor-element.elementor-element-65ae54d .promo-banner-title,
.elementor-1529 .elementor-element.elementor-element-65ae54d h3 {
  position: relative !important;
  top: auto !important;
  left: auto !important;
  transform: none !important;
  opacity: 0 !important;          /* Se vuelve invisible */
  visibility: visible !important; /* Mantiene su espacio físico */
  margin: 0 0 auto 0 !important;  /* Sigue empujando el botón hacia abajo */
}

/* ==========================================
   2. EL CONTENIDO DE ABAJO TRANSFORMADO EN BOTÓN
   ========================================= */
.elementor-1529 .elementor-element.elementor-element-65ae54d .banner-inner, 
.elementor-1529 .elementor-element.elementor-element-65ae54d .promo-banner-description,
.elementor-1529 .elementor-element.elementor-element-65ae54d p {
  margin-left: auto !important;   /* Estos dos autos centran por completo */
  margin-right: auto !important;  /* el bloque entero horizontalmente */
  margin-top: auto !important;    /* Lo ancla abajo */
  margin-bottom: 1px !important;

  /* Forzar tamaño compacto para que el borde no se estire */
  display: flex !important;
  width: 125px !important;
  max-width: max-content !important;

  /* Centrado interno perfecto del texto */
  align-items: center !important;     
  justify-content: center !important;   
  text-align: center !important;
  line-height: 1 !important;          

  /* Estilo del botón (Turquesa por defecto) */
  background-color: rgba(0, 0, 0, 0.2) !important;
  border: 3px solid #40E0D0 !important; /* Primer borde turquesa */
  border-radius: 150px !important;
  
  /* ---> TEXTO EN BOLD BLANCO <--- */
  color: #ffffff !important; 
  font-size: 30px !important;         
  padding: 20px 25px !important; /* Controla el tamaño interno del botón */
  text-transform: uppercase !important;
  letter-spacing: 1px !important;
  transition: all 0.3s ease-in-out !important;
  font-family: 'Impact', 'Arial Black', sans-serif !important; /* Fuente muy fuerte y gruesa */
  font-weight: 900 !important; /* Máximo grosor disponible */
  letter-spacing: 2px !important; /* Un poco de separación si las letras se juntan*/

  /* ---> DOBLE BORDE CORREGIDO (Pegado al botón original) <--- */
  box-shadow: 
    0 0 0 4px transparent,
    0 0 0 7px rgba(64, 224, 208, 0.45) !important;
}
/* ==========================================
   3. EFECTO HOVER EN ROSA (Al pasar el cursor sobre la tarjeta)
   ========================================= */
/* Detectamos el hover en el contenedor, pero alteramos el bloque de contenido (botón) */
.elementor-1529 .elementor-element.elementor-element-65ae54d:hover .banner-inner,
.elementor-1529 .elementor-element.elementor-element-65ae54d:hover .promo-banner-description,
.elementor-1529 .elementor-element.elementor-element-65ae54d:hover p {
  
  /* ---> CAMBIO A COLOR ROSA VIBRANTE <--- */
  background-color: #ff0066 !important; /* Fondo Rosa */
  border-color: #ff0066 !important;     /* Borde interno Rosa */
  color: #ffffff !important;           /* Texto Blanco */
  
  /* Efecto de crecimiento sutil del botón */
  transform: scale(1.05) !important;
  
  /* Mantenemos el doble borde, pero ahora en Rosa y con más brillo */
  box-shadow: 
    0 0 0 6px transparent, 
    0 0 0 7.5px rgba(255, 0, 102, 0.4),  /* Borde exterior Rosa suave */
    0 12px 24px rgba(255, 0, 102, 0.35) !important; /* Sombra de relieve Rosa */
  
  /* Sutil efecto 3D en las letras blancas sobre fondo rosa */
  text-shadow: 
    -1px -1px 0px rgba(0, 255, 255, 0.5), 
    1px 1px 0px rgba(255, 255, 255, 0.2) !important;
}

@media only screen and (min-width: 768px) and (max-width: 1024px) {

    /* Forzamos la reducción del texto atacando h3 y p juntos */
    .elementor-1529 .elementor-element.elementor-element-65ae54d h3,
    .elementor-1529 .elementor-element.elementor-element-65ae54d p,
    .elementor-1529 .elementor-element.elementor-element-65ae54d .banner-title,
    .elementor-1529 .elementor-element.elementor-element-65ae54d .promo-banner-description {
        font-size: 12px !important;    /* Achica la letra radicalmente */
        font-weight: 700 !important;   /* Reduce el grosor */
        letter-spacing: 0px !important;/* Junta las letras */
        
    }

    /* Reducimos el óvalo contenedor para que se adapte al nuevo texto chico */
    .elementor-1529 .elementor-element.elementor-element-65ae54d p {
        width: 20px !important;
        max-width: 85px !important;
        padding: 4px 8px !important;
        margin: 0 auto !important;
        display: inline-flex !important;
    }
}/* End custom CSS */
/* Start custom CSS for wd_banner, class: .elementor-element-f708088 *//* ==========================================
   0. FORZAR LA CARTILLA COMO CONTENEDOR BASE Y DISTRIBUIR
   ========================================= */
.promo-banner,
.woodmart-promo-banner,
.elementor-1529 .elementor-element.elementor-element-f708088 .promo-banner {
  position: relative !important;
  overflow: hidden !important;
  height: 100% !important;
  cursor: pointer !important; /* Indica que toda la tarjeta es clicable */
}

/* Forzamos al contenedor de texto interno a estirarse y separar los elementos */
.elementor-1529 .elementor-element.elementor-element-f708088 .banner-content,
.elementor-1529 .elementor-element.elementor-element-f708088 .promo-banner-content {
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  width: 100% !important;
  height: 100% !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: space-between !important; /* Envía subtítulo/título ARRIBA y contenido ABAJO */
  align-items: center !important;
  text-align: center !important;
  padding: 35px 20px !important; /* Espaciado interno de la tarjeta */
  box-sizing: border-box !important;
  z-index: 99 !important;
}

/* ==========================================
   1. TEXTOS SUPERIORES (Ocultos pero reservando espacio)
   ========================================= */
.elementor-1529 .elementor-element.elementor-element-f708088 .banner-subtitle,
.elementor-1529 .elementor-element.elementor-element-f708088 .promo-banner-subtitle {
  opacity: 0 !important;          /* Se vuelve invisible */
  visibility: visible !important; /* Mantiene su espacio físico */
  margin-bottom: 5px !important;
}
.elementor-1529 .elementor-element.elementor-element-f708088 .banner-title,
.elementor-1529 .elementor-element.elementor-element-f708088 .promo-banner-title,
.elementor-1529 .elementor-element.elementor-element-f708088 h3 {
  position: relative !important;
  top: auto !important;
  left: auto !important;
  transform: none !important;
  opacity: 0 !important;          /* Se vuelve invisible */
  visibility: visible !important; /* Mantiene su espacio físico */
  margin: 0 0 auto 0 !important;  /* Sigue empujando el botón hacia abajo */
}

/* ==========================================
   2. EL CONTENIDO DE ABAJO TRANSFORMADO EN BOTÓN
   ========================================= */
.elementor-1529 .elementor-element.elementor-element-f708088 .banner-inner, 
.elementor-1529 .elementor-element.elementor-element-f708088 .promo-banner-description,
.elementor-1529 .elementor-element.elementor-element-f708088 p {
  margin-left: auto !important;   /* Estos dos autos centran por completo */
  margin-right: auto !important;  /* el bloque entero horizontalmente */
  margin-top: auto !important;    /* Lo ancla abajo */
  margin-bottom: 1px !important;

  /* Forzar tamaño compacto para que el borde no se estire */
  display: flex !important;
  width: 125px !important;
  max-width: max-content !important;

  /* Centrado interno perfecto del texto */
  align-items: center !important;     
  justify-content: center !important;   
  text-align: center !important;
  line-height: 1 !important;          

  /* Estilo del botón (Turquesa por defecto) */
  background-color: rgba(0, 0, 0, 0.2) !important;
  border: 3px solid #40E0D0 !important; /* Primer borde turquesa */
  border-radius: 150px !important;
  
  /* ---> TEXTO EN BOLD BLANCO <--- */
  color: #ffffff !important; 
  font-size: 30px !important;         
  padding: 20px 25px !important; /* Controla el tamaño interno del botón */
  text-transform: uppercase !important;
  letter-spacing: 1px !important;
  transition: all 0.3s ease-in-out !important;
  font-family: 'Impact', 'Arial Black', sans-serif !important; /* Fuente muy fuerte y gruesa */
  font-weight: 900 !important; /* Máximo grosor disponible */
  letter-spacing: 2px !important; /* Un poco de separación si las letras se juntan

  /* ---> DOBLE BORDE CORREGIDO (Pegado al botón original) <--- */
  box-shadow: 
    0 0 0 4px transparent,
    0 0 0 7px rgba(64, 224, 208, 0.45) !important;
}
/* ==========================================
   3. EFECTO HOVER EN ROSA (Al pasar el cursor sobre la tarjeta)
   ========================================= */
/* Detectamos el hover en el contenedor, pero alteramos el bloque de contenido (botón) */
.elementor-1529 .elementor-element.elementor-element-f708088:hover .banner-inner,
.elementor-1529 .elementor-element.elementor-element-f708088:hover .promo-banner-description,
.elementor-1529 .elementor-element.elementor-element-f708088:hover p {
  
  /* ---> CAMBIO A COLOR ROSA VIBRANTE <--- */
  background-color: #ff0066 !important; /* Fondo Rosa */
  border-color: #ff0066 !important;     /* Borde interno Rosa */
  color: #ffffff !important;           /* Texto Blanco */
  
  /* Efecto de crecimiento sutil del botón */
  transform: scale(1.05) !important;
  
  /* Mantenemos el doble borde, pero ahora en Rosa y con más brillo */
  box-shadow: 
    0 0 0 6px transparent, 
    0 0 0 7.5px rgba(255, 0, 102, 0.4),  /* Borde exterior Rosa suave */
    0 12px 24px rgba(255, 0, 102, 0.35) !important; /* Sombra de relieve Rosa */
  
  /* Sutil efecto 3D en las letras blancas sobre fondo rosa */
  text-shadow: 
    -1px -1px 0px rgba(0, 255, 255, 0.5), 
    1px 1px 0px rgba(255, 255, 255, 0.2) !important;
}

@media only screen and (min-width: 768px) and (max-width: 1024px) {

    /* Forzamos la reducción del texto atacando h3 y p juntos */
    .elementor-1529 .elementor-element.elementor-element-f708088 h3,
    .elementor-1529 .elementor-element.elementor-element-f708088 p,
    .elementor-1529 .elementor-element.elementor-element-f708088 .banner-title,
    .elementor-1529 .elementor-element.elementor-element-f708088 .promo-banner-description {
        font-size: 12px !important;    /* Achica la letra radicalmente */
        font-weight: 700 !important;   /* Reduce el grosor */
        letter-spacing: 0px !important;/* Junta las letras */
        
    }

    /* Reducimos el óvalo contenedor para que se adapte al nuevo texto chico */
    .elementor-1529 .elementor-element.elementor-element-f708088 p {
        width: 20px !important;
        max-width: 85px !important;
        padding: 4px 8px !important;
        margin: 0 auto !important;
        display: inline-flex !important;
    }
}/* End custom CSS */
/* Start custom CSS for wd_banner, class: .elementor-element-f1d13b6 *//* ==========================================
   0. FORZAR LA CARTILLA COMO CONTENEDOR BASE Y DISTRIBUIR
   ========================================= */
.promo-banner,
.woodmart-promo-banner,
.elementor-1529 .elementor-element.elementor-element-f1d13b6 .promo-banner {
  position: relative !important;
  overflow: hidden !important;
  height: 100% !important;
  cursor: pointer !important; /* Indica que toda la tarjeta es clicable */
}

/* Forzamos al contenedor de texto interno a estirarse y separar los elementos */
.elementor-1529 .elementor-element.elementor-element-f1d13b6 .banner-content,
.elementor-1529 .elementor-element.elementor-element-f1d13b6 .promo-banner-content {
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  width: 100% !important;
  height: 100% !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: space-between !important; /* Envía subtítulo/título ARRIBA y contenido ABAJO */
  align-items: center !important;
  text-align: center !important;
  padding: 35px 20px !important; /* Espaciado interno de la tarjeta */
  box-sizing: border-box !important;
  z-index: 99 !important;
}

/* ==========================================
   1. TEXTOS SUPERIORES (Ocultos pero reservando espacio)
   ========================================= */
.elementor-1529 .elementor-element.elementor-element-f1d13b6 .banner-subtitle,
.elementor-1529 .elementor-element.elementor-element-f1d13b6 .promo-banner-subtitle {
  opacity: 0 !important;          /* Se vuelve invisible */
  visibility: visible !important; /* Mantiene su espacio físico */
  margin-bottom: 5px !important;
}
.elementor-1529 .elementor-element.elementor-element-f1d13b6 .banner-title,
.elementor-1529 .elementor-element.elementor-element-f1d13b6 .promo-banner-title,
.elementor-1529 .elementor-element.elementor-element-f1d13b6 h3 {
  position: relative !important;
  top: auto !important;
  left: auto !important;
  transform: none !important;
  opacity: 0 !important;          /* Se vuelve invisible */
  visibility: visible !important; /* Mantiene su espacio físico */
  margin: 0 0 auto 0 !important;  /* Sigue empujando el botón hacia abajo */
}

/* ==========================================
   2. EL CONTENIDO DE ABAJO TRANSFORMADO EN BOTÓN
   ========================================= */
.elementor-1529 .elementor-element.elementor-element-f1d13b6 .banner-inner, 
.elementor-1529 .elementor-element.elementor-element-f1d13b6 .promo-banner-description,
.elementor-1529 .elementor-element.elementor-element-f1d13b6 p {
  margin-left: auto !important;   /* Estos dos autos centran por completo */
  margin-right: auto !important;  /* el bloque entero horizontalmente */
  margin-top: auto !important;    /* Lo ancla abajo */
  margin-bottom: 1px !important;

  /* Forzar tamaño compacto para que el borde no se estire */
  display: flex !important;
  width: 125px !important;
  max-width: max-content !important;

  /* Centrado interno perfecto del texto */
  align-items: center !important;     
  justify-content: center !important;   
  text-align: center !important;
  line-height: 1 !important;          

  /* Estilo del botón (Turquesa por defecto) */
  background-color: rgba(0, 0, 0, 0.2) !important;
  border: 3px solid #40E0D0 !important; /* Primer borde turquesa */
  border-radius: 150px !important;
  
  /* ---> TEXTO EN BOLD BLANCO <--- */
  color: #ffffff !important; 
  font-size: 30px !important;         
  padding: 20px 25px !important; /* Controla el tamaño interno del botón */
  text-transform: uppercase !important;
  letter-spacing: 1px !important;
  transition: all 0.3s ease-in-out !important;
  font-family: 'Impact', 'Arial Black', sans-serif !important; /* Fuente muy fuerte y gruesa */
  font-weight: 900 !important; /* Máximo grosor disponible */
  letter-spacing: 2px !important; /* Un poco de separación si las letras se juntan

  /* ---> DOBLE BORDE CORREGIDO (Pegado al botón original) <--- */
  box-shadow: 
    0 0 0 4px transparent,
    0 0 0 7px rgba(64, 224, 208, 0.45) !important;
}
/* ==========================================
   3. EFECTO HOVER EN ROSA (Al pasar el cursor sobre la tarjeta)
   ========================================= */
/* Detectamos el hover en el contenedor, pero alteramos el bloque de contenido (botón) */
.elementor-1529 .elementor-element.elementor-element-f1d13b6:hover .banner-inner,
.elementor-1529 .elementor-element.elementor-element-f1d13b6:hover .promo-banner-description,
.elementor-1529 .elementor-element.elementor-element-f1d13b6:hover p {
  
  /* ---> CAMBIO A COLOR ROSA VIBRANTE <--- */
  background-color: #ff0066 !important; /* Fondo Rosa */
  border-color: #ff0066 !important;     /* Borde interno Rosa */
  color: #ffffff !important;           /* Texto Blanco */
  
  /* Efecto de crecimiento sutil del botón */
  transform: scale(1.05) !important;
  
  /* Mantenemos el doble borde, pero ahora en Rosa y con más brillo */
  box-shadow: 
    0 0 0 6px transparent, 
    0 0 0 7.5px rgba(255, 0, 102, 0.4),  /* Borde exterior Rosa suave */
    0 12px 24px rgba(255, 0, 102, 0.35) !important; /* Sombra de relieve Rosa */
  
  /* Sutil efecto 3D en las letras blancas sobre fondo rosa */
  text-shadow: 
    -1px -1px 0px rgba(0, 255, 255, 0.5), 
    1px 1px 0px rgba(255, 255, 255, 0.2) !important;
}

@media only screen and (min-width: 768px) and (max-width: 1024px) {

    /* Forzamos la reducción del texto atacando h3 y p juntos */
    .elementor-1529 .elementor-element.elementor-element-f1d13b6 h3,
    .elementor-1529 .elementor-element.elementor-element-f1d13b6 p,
    .elementor-1529 .elementor-element.elementor-element-f1d13b6 .banner-title,
    .elementor-1529 .elementor-element.elementor-element-f1d13b6 .promo-banner-description {
        font-size: 12px !important;    /* Achica la letra radicalmente */
        font-weight: 700 !important;   /* Reduce el grosor */
        letter-spacing: 0px !important;/* Junta las letras */
        
    }

    /* Reducimos el óvalo contenedor para que se adapte al nuevo texto chico */
    .elementor-1529 .elementor-element.elementor-element-f1d13b6 p {
        width: 20px !important;
        max-width: 85px !important;
        padding: 4px 8px !important;
        margin: 0 auto !important;
        display: inline-flex !important;
    }
}/* End custom CSS */
/* Start custom CSS for wd_banner, class: .elementor-element-6525937 *//* ==========================================
   0. FORZAR LA CARTILLA COMO CONTENEDOR BASE Y DISTRIBUIR
   ========================================= */
.promo-banner,
.woodmart-promo-banner,
.elementor-1529 .elementor-element.elementor-element-6525937 .promo-banner {
  position: relative !important;
  overflow: hidden !important;
  height: 100% !important;
  cursor: pointer !important; /* Indica que toda la tarjeta es clicable */
}

/* Forzamos al contenedor de texto interno a estirarse y separar los elementos */
.elementor-1529 .elementor-element.elementor-element-6525937 .banner-content,
.elementor-1529 .elementor-element.elementor-element-6525937 .promo-banner-content {
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  width: 100% !important;
  height: 100% !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: space-between !important; /* Envía subtítulo/título ARRIBA y contenido ABAJO */
  align-items: center !important;
  text-align: center !important;
  padding: 35px 20px !important; /* Espaciado interno de la tarjeta */
  box-sizing: border-box !important;
  z-index: 99 !important;
}

/* ==========================================
   1. TEXTOS SUPERIORES (Ocultos pero reservando espacio)
   ========================================= */
.elementor-1529 .elementor-element.elementor-element-6525937 .banner-subtitle,
.elementor-1529 .elementor-element.elementor-element-6525937 .promo-banner-subtitle {
  opacity: 0 !important;          /* Se vuelve invisible */
  visibility: visible !important; /* Mantiene su espacio físico */
  margin-bottom: 5px !important;
}
.elementor-1529 .elementor-element.elementor-element-6525937 .banner-title,
.elementor-1529 .elementor-element.elementor-element-6525937 .promo-banner-title,
.elementor-1529 .elementor-element.elementor-element-6525937 h3 {
  position: relative !important;
  top: auto !important;
  left: auto !important;
  transform: none !important;
  opacity: 0 !important;          /* Se vuelve invisible */
  visibility: visible !important; /* Mantiene su espacio físico */
  margin: 0 0 auto 0 !important;  /* Sigue empujando el botón hacia abajo */
}

/* ==========================================
   2. EL CONTENIDO DE ABAJO TRANSFORMADO EN BOTÓN
   ========================================= */
.elementor-1529 .elementor-element.elementor-element-6525937 .banner-inner, 
.elementor-1529 .elementor-element.elementor-element-6525937 .promo-banner-description,
.elementor-1529 .elementor-element.elementor-element-6525937 p {
  margin-left: auto !important;   /* Estos dos autos centran por completo */
  margin-right: auto !important;  /* el bloque entero horizontalmente */
  margin-top: auto !important;    /* Lo ancla abajo */
  margin-bottom: 1px !important;

  /* Forzar tamaño compacto para que el borde no se estire */
  display: flex !important;
  width: 125px !important;
  max-width: max-content !important;

  /* Centrado interno perfecto del texto */
  align-items: center !important;     
  justify-content: center !important;   
  text-align: center !important;
  line-height: 1 !important;          

  /* Estilo del botón (Turquesa por defecto) */
  background-color: rgba(0, 0, 0, 0.2) !important;
  border: 3px solid #40E0D0 !important; /* Primer borde turquesa */
  border-radius: 150px !important;
  
  /* ---> TEXTO EN BOLD BLANCO <--- */
  color: #ffffff !important; 
  font-size: 30px !important;         
  padding: 20px 25px !important; /* Controla el tamaño interno del botón */
  text-transform: uppercase !important;
  letter-spacing: 1px !important;
  transition: all 0.3s ease-in-out !important;
  font-family: 'Impact', 'Arial Black', sans-serif !important; /* Fuente muy fuerte y gruesa */
  font-weight: 900 !important; /* Máximo grosor disponible */
  letter-spacing: 2px !important; /* Un poco de separación si las letras se juntan

  /* ---> DOBLE BORDE CORREGIDO (Pegado al botón original) <--- */
  box-shadow: 
    0 0 0 4px transparent,
    0 0 0 7px rgba(64, 224, 208, 0.45) !important;
}
/* ==========================================
   3. EFECTO HOVER EN ROSA (Al pasar el cursor sobre la tarjeta)
   ========================================= */
/* Detectamos el hover en el contenedor, pero alteramos el bloque de contenido (botón) */
.elementor-1529 .elementor-element.elementor-element-6525937:hover .banner-inner,
.elementor-1529 .elementor-element.elementor-element-6525937:hover .promo-banner-description,
.elementor-1529 .elementor-element.elementor-element-6525937:hover p {
  
  /* ---> CAMBIO A COLOR ROSA VIBRANTE <--- */
  background-color: #ff0066 !important; /* Fondo Rosa */
  border-color: #ff0066 !important;     /* Borde interno Rosa */
  color: #ffffff !important;           /* Texto Blanco */
  
  /* Efecto de crecimiento sutil del botón */
  transform: scale(1.05) !important;
  
  /* Mantenemos el doble borde, pero ahora en Rosa y con más brillo */
  box-shadow: 
    0 0 0 6px transparent, 
    0 0 0 7.5px rgba(255, 0, 102, 0.4),  /* Borde exterior Rosa suave */
    0 12px 24px rgba(255, 0, 102, 0.35) !important; /* Sombra de relieve Rosa */
  
  /* Sutil efecto 3D en las letras blancas sobre fondo rosa */
  text-shadow: 
    -1px -1px 0px rgba(0, 255, 255, 0.5), 
    1px 1px 0px rgba(255, 255, 255, 0.2) !important;
}

@media only screen and (min-width: 768px) and (max-width: 1024px) {

    /* Forzamos la reducción del texto atacando h3 y p juntos */
    .elementor-1529 .elementor-element.elementor-element-6525937 h3,
    .elementor-1529 .elementor-element.elementor-element-6525937 p,
    .elementor-1529 .elementor-element.elementor-element-6525937 .banner-title,
    .elementor-1529 .elementor-element.elementor-element-6525937 .promo-banner-description {
        font-size: 12px !important;    /* Achica la letra radicalmente */
        font-weight: 700 !important;   /* Reduce el grosor */
        letter-spacing: 0px !important;/* Junta las letras */
        
    }

    /* Reducimos el óvalo contenedor para que se adapte al nuevo texto chico */
    .elementor-1529 .elementor-element.elementor-element-6525937 p {
        width: 20px !important;
        max-width: 85px !important;
        padding: 4px 8px !important;
        margin: 0 auto !important;
        display: inline-flex !important;
    }
}/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-effd22f *//* ===== Banner Corporativo Premium - Calibración de Espacios ===== */

:root {
    --text-light: #FFFFFF;
    --text-dark: #0F172A;
}

.elementor-1529 .elementor-element.elementor-element-effd22f .promo-banner:hover {
    transform: translateY(-4px);
    box-shadow: 0 25px 55px rgba(15, 23, 42, 0.2);
}

/* Fondo: Más transparente para integrarse perfectamente con la imagen */
.elementor-1529 .elementor-element.elementor-element-effd22f .banner-content-background,
.elementor-1529 .elementor-element.elementor-element-effd22f .wrapper-content-banner,
.elementor-1529 .elementor-element.elementor-element-effd22f .content-banner {
    background: linear-gradient(135deg, 
                rgba(15, 32, 67, 0.5) 0%, 
                rgba(30, 58, 138, 0.70) 100%) !important;
    backdrop-filter: blur(2px);
    -webkit-backdrop-filter: blur(12px);
    /* Ajuste de padding interno para dar más espacio vertical */
    padding: 20px 20px !important; 
}

/* Botón: Compacto, ultra-visible y rescatado del borde */
.elementor-1529 .elementor-element.elementor-element-effd22f .banner-btn-wrapper {
    margin-top: 10px !important;
    display: block !important;
}

.elementor-1529 .elementor-element.elementor-element-effd22f .banner-btn-wrapper a {
    background: linear-gradient(135deg, #FFFFFF 0%, #F1F5F9 100%) !important;
    color: var(--text-dark) !important;
    padding: 10px 24px !important; /* Padding un poco más compacto */
    border-radius: 40px;
    font-weight: 600;
    font-size: 15px;
    text-decoration: none;
    display: inline-block !important;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.15);
    transition: all 0.3s ease;
}
.elementor-1529 .elementor-element.elementor-element-effd22f .banner-btn-wrapper a:hover {
    background: #FFFFFF !important;
    transform: translateY(-2px);
    box-shadow: 0 8px 18px rgba(0, 0, 0, 0.22);
}

/* Imagen de fondo */
.elementor-1529 .elementor-element.elementor-element-effd22f .main-wrap-img img {
    transition: transform 0.6s ease;
}

.elementor-1529 .elementor-element.elementor-element-effd22f:hover .main-wrap-img img {
    transform: scale(1.03);
}/* End custom CSS */