.elementor-1605 .elementor-element.elementor-element-3a1a449{--display:flex;}.elementor-widget-heading .elementor-heading-title{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );color:var( --e-global-color-primary );}.elementor-1605 .elementor-element.elementor-element-a2ff8fc{background-color:transparent;margin:-10px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;background-image:linear-gradient(130deg, var( --e-global-color-13d93a5 ) 0%, var( --e-global-color-683564e ) 100%);text-align:center;}.elementor-1605 .elementor-element.elementor-element-a2ff8fc .elementor-heading-title{font-family:"Inter", Sans-serif;font-size:32px;font-weight:400;color:#DDDCDC;}.elementor-1605 .elementor-element.elementor-element-a2ff8fc .elementor-heading-title a:hover, .elementor-1605 .elementor-element.elementor-element-a2ff8fc .elementor-heading-title a:focus{color:var( --e-global-color-683564e );}/* Start custom CSS for shortcode, class: .elementor-element-98f47a3 *//* 1. Hace que el contenedor de la lista de productos use Flexbox */
.elementor-widget-shortcode ul.products {
    display: flex;
    flex-wrap: wrap; /* Permite que los productos pasen a la siguiente línea */
}

/* 2. Asegura que cada producto ocupe el mismo espacio disponible */
.elementor-widget-shortcode .products li.product {
    display: flex; /* Convierte el producto en un contenedor flex */
    flex-direction: column; /* Coloca el contenido de arriba hacia abajo */
    height: 100%; /* Asegura que se estire a la altura total del ul.products (gracias a Flexbox) */
}

/* 3. Empuja el botón o elemento final (ej. el precio o botón de carrito) hasta el final */
/* Esto se aplica a un elemento dentro del producto, como el precio o el botón */
.elementor-widget-shortcode .products li.product .price,
.elementor-widget-shortcode .products li.product .button { 
    /* Si tienes un botón de "Añadir al carrito" o el precio en la parte inferior, */
    /* puedes usar margin-top: auto; en el último elemento de la caja para que se pegue abajo */
    margin-top: auto; 
}

/* Ejemplo para los títulos: ajusta la altura mínima para evitar saltos de línea excesivos */
.elementor-widget-shortcode .products li.product h2 {
    min-height: 50px; /* Ajusta este valor si es necesario */
}/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-3a1a449 *//* 1. Hace que el contenedor de la lista de productos use Flexbox */
.elementor-widget-shortcode ul.products {
    display: flex;
    flex-wrap: wrap; /* Permite que los productos pasen a la siguiente línea */
}

/* 2. Asegura que cada producto ocupe el mismo espacio disponible */
.elementor-widget-shortcode .products li.product {
    display: flex; /* Convierte el producto en un contenedor flex */
    flex-direction: column; /* Coloca el contenido de arriba hacia abajo */
    height: 100%; /* Asegura que se estire a la altura total del ul.products (gracias a Flexbox) */
}

/* 3. Empuja el botón o elemento final (ej. el precio o botón de carrito) hasta el final */
/* Esto se aplica a un elemento dentro del producto, como el precio o el botón */
.elementor-widget-shortcode .products li.product .price,
.elementor-widget-shortcode .products li.product .button { 
    /* Si tienes un botón de "Añadir al carrito" o el precio en la parte inferior, */
    /* puedes usar margin-top: auto; en el último elemento de la caja para que se pegue abajo */
    margin-top: auto; 
}

/* Ejemplo para los títulos: ajusta la altura mínima para evitar saltos de línea excesivos */
.elementor-widget-shortcode .products li.product h2 {
    min-height: 50px; /* Ajusta este valor si es necesario */
}/* End custom CSS */