.elementor-65 .elementor-element.elementor-element-9f87d03 > .elementor-widget-container{margin:0px 0px 0px 0px;padding:0px 0px 0px 0px;}.elementor-65 .elementor-element.elementor-element-105b343{padding:0px 0px 0px 0px;}.elementor-65 .elementor-element.elementor-element-54ab94f, .elementor-65 .elementor-element.elementor-element-54ab94f > .elementor-background-overlay{border-radius:0px 0px 0px 0px;}.elementor-65 .elementor-element.elementor-element-54ab94f{padding:0px 0px 0px 0px;}@media(max-width:767px){.elementor-65 .elementor-element.elementor-element-41a413a > .elementor-widget-container{margin:0px 0px 0px 0px;}}/* Start custom CSS for hero-banner, class: .elementor-element-9f87d03 */.banner-images .main-img {
    width: 50%;           /* Ocupa todo el ancho del contenedor */
    max-width: none;       /* Elimina cualquier límite predeterminado de ancho máximo */
    height: auto;          /* Mantiene la proporción de la imagen */
    transform: scale(1.2); /* Opcional: escala la imagen un 20% más (ajusta según necesites) */
}

.btn.btn-two {
  background-color: #FF9900; /* Naranja vibrante como en la imagen */
  color: white;
  padding: 12px 32px;
  border-radius: 50px; /* Bordes completamente redondeados */
  font-weight: 600;
  text-decoration: none;
  display: inline-block;
  transition: background-color 0.3s ease;
  border: none;
  box-shadow: 0 4px 10px rgba(255, 153, 0, 0.3);
}

.btn.btn-two:hover {
  background-color: #8F986D; /* Un tono más oscuro al pasar el mouse */
}

/* Aumenta el espacio entre el párrafo y el botón */
.banner-content.text-center .desc {
    margin-bottom: 3rem; /* Ajusta este valor según lo desees */
}

.banner-content.text-center .btn {
    margin-bottom: 5rem; /* Ajusta este valor según lo desees */
}

/* Cambia el color del texto del botón a verde */
/*.banner-content.text-center .btn.btn-two {*/
    /* Verde estándar - puedes cambiarlo por el tono que desees */
/*}*/

/* Opcional: Si también quieres que el texto del párrafo sea verde */
.banner-content.text-center .desc {
    color: #8F986D; /* Verde estándar */
    font-size: 1.1rem;
}

/* Opcional: Si el título también debe ser verde */
.banner-content.text-center .title {
    color: #8F986D; /* Verde estándar */
}


/*TITULO BANNER*/

/* Ajustar título del banner */
.banner-area .banner-content h2.title,
.banner-area .banner-content .title,
.banner-area .banner-content h2.title strong {
    letter-spacing: -3.4px ! important;
    line-height: 1.0 !important;
    word-spacing: -3px !important;
}

/* Ajustar descripción del banner */
.banner-area .banner-content p.desc,
.banner-area .banner-content .desc,
.banner-area .banner-content p.desc strong {
    letter-spacing: -1px !important;
    line-height: 1.2 !important;
}

/* Si aún no funciona, probamos con ! important en todo */
section. banner-area h2 {
    letter-spacing: -2px !important;
    line-height: 1.0 ! important;
}

section.banner-area p {
    letter-spacing: -1px !important;
    line-height: 1.2 ! important;
}/* End custom CSS */
/* Start custom CSS for section, class: .elementor-element-c80e885 *//* Eliminar sombra del banner de productos */
.banner-area .banner-images::after,
.banner-area .banner-images::before {
    display: none !important;
    content: none !important;
}

. banner-area .banner-images {
    box-shadow: none !important;
    filter: none !important;
    text-shadow: none !important;
}

. banner-area .banner-images . main-img {
    box-shadow: none !important;
    filter: none !important;
    -webkit-box-shadow: none !important;
}

/* Eliminar cualquier sombra en imágenes del banner */
.banner-images img {
    box-shadow: none !important;
    filter: none !important;
    -webkit-filter: none ! important;
}

/* Si es una sombra de fondo */
.banner-area . banner-images . bg-shape {
    display: none !important;
}/* End custom CSS */
/* Start custom CSS for products, class: .elementor-element-976fda6 *//* =============================================
   TARJETAS DE PRODUCTOS CON ALTURA UNIFORME
   ============================================= */

/* Contenedor de cada tarjeta */
.home-shop-item {
  display: flex;
  flex-direction: column;
  height: 100%;
  min-height: 450px;
  background: #fff;
}

/* Contenedor de la imagen - altura fija */
.home-shop-thumb {
  height: 250px;
  display: flex;
  align-items: flex-end;
  justify-content: center;
  position: relative;
  overflow: hidden;
  padding: 20px 20px 0;
}

/* La imagen se ajusta y recorta si es necesario */
.home-shop-thumb a {
  display: flex;
  align-items: flex-end;
  justify-content: center;
  height: 100%;
  width: 100%;
  position: relative;
  z-index: 2;
}

. home-shop-thumb img {
  max-height: 220px ! important;
  min-height: 180px !important;
  width: auto !important;
  height: auto;
  object-fit: contain;
  object-position: center bottom;
}

/* El fondo circular (shape) - ajustado */
.home-shop-thumb .shop-thumb-shape {
  position: absolute ! important;
  bottom: 0 ! important;
  left: 50% !important;
  transform: translateX(-50%) !important;
  width: 200px !important;
  height: 100px !important;
  border-radius: 100px 100px 0 0 !important;
  z-index: 1 !important;
}

/* Contenedor del contenido (título, precio, rating, botones) */
.home-shop-content {
  display: flex;
  flex-direction: column;
  flex-grow: 1;
  justify-content: space-between;
  padding: 20px 15px;
  min-height: 200px;
}

/* Título del producto */
.home-shop-content . title {
  min-height: 28px;
  margin-bottom: 8px;
}

. home-shop-content .title a {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  line-height: 1.3;
}

/* Precio */
.home-shop-price {
  margin-bottom: 8px;
}

/* Rating */
.home-shop-rating {
  min-height: 22px;
  margin-bottom: 10px;
}

/* Contenedor de botones */
.shop-content-bottom {
  margin-top: auto;
  display: flex;
  align-items: center;
  gap: 10px;
}

/* =============================================
   AJUSTES PARA SLICK SLIDER
   ============================================= */

. home-shop-active .slick-track {
  display: flex ! important;
}

.home-shop-active .slick-slide {
  height: auto !important;
  display: flex !important;
}

. home-shop-active .slick-slide > div {
  display: flex;
  width: 100%;
}

.home-shop-active .slick-slide . col-xl-3,
.home-shop-active .slick-slide [class*="col-"] {
  display: flex;
  width: 100%;
}

/* =============================================
   RESPONSIVE
   ============================================= */
@media (max-width: 991px) {
  .home-shop-thumb {
    height: 220px;
  }
  
  .home-shop-thumb img {
    max-height: 190px ! important;
    min-height: 150px !important;
  }
  
  .home-shop-thumb .shop-thumb-shape {
    width: 180px !important;
    height: 90px !important;
  }
}

@media (max-width: 768px) {
  .home-shop-item {
    min-height: 400px;
  }
  
  . home-shop-thumb {
    height: 200px;
  }
  
  . home-shop-thumb img {
    max-height: 170px !important;
    min-height: 140px !important;
  }
  
  .home-shop-thumb .shop-thumb-shape {
    width: 160px ! important;
    height: 80px ! important;
  }
  
  .home-shop-content {
    min-height: 180px;
    padding: 15px 12px;
  }
}

@media (max-width: 575px) {
  .home-shop-item {
    min-height: 380px;
  }
  
  . home-shop-thumb {
    height: 180px;
  }
  
  .home-shop-thumb img {
    max-height: 150px !important;
    min-height: 120px !important;
  }
}
/* =============================================
   VISTA MÓVIL - IMÁGENES MÁS GRANDES
   ============================================= */

/* =============================================
   VISTA MÓVIL - IMÁGENES MÁS GRANDES
   ============================================= */

@media (max-width: 575px) {
  /* Tarjeta general */
  .home-shop-item {
    min-height: 400px;
  }
  
  /* Contenedor de imagen - reducimos altura y padding superior */
  .home-shop-thumb {
    height: 240px;
    padding: 5px 15px 0; /* Reducido el padding superior de 15px a 5px */
  }
  
  /* Enlace de imagen pegado arriba */
  . home-shop-thumb a {
    align-items: flex-start; /* Cambiado de flex-end a flex-start */
  }
  
  /* Imagen más grande y pegada arriba */
  .home-shop-thumb img {
    max-height: 220px !important;
    min-height: 180px !important;
    width: auto !important;
    object-fit: contain;
    object-position: center top; /* Cambiado de bottom a top */
  }
  
  /* La figura se mantiene abajo */
  .home-shop-thumb .shop-thumb-shape {
    display: block !important;
    width: 200px !important;
    height: 100px !important;
    border-radius: 100px 100px 0 0 !important;
  }
  
  /* Contenido compacto */
  .home-shop-content {
    min-height: 160px;
    padding: 15px 12px;
  }
  
  /* Título compacto */
  .home-shop-content . title {
    min-height: 24px;
    margin-bottom: 6px;
  }
  
  /* Precio */
  .home-shop-price {
    margin-bottom: 6px;
  }
  
  /* Rating */
  .home-shop-rating {
    min-height: 20px;
    margin-bottom: 8px;
  }
}

/* Para pantallas aún más pequeñas */
@media (max-width: 400px) {
  . home-shop-thumb {
    height: 220px;
    padding: 5px 10px 0;
  }
  
  .home-shop-thumb img {
    max-height: 200px !important;
    min-height: 160px !important;
  }
  
  .home-shop-thumb .shop-thumb-shape {
    width: 180px !important;
    height: 90px !important;
  }
}/* End custom CSS */
/* Start custom CSS for section, class: .elementor-element-105b343 *//* === BOTÓN "COMPRAR AHORA" - CON TU TONO VERDE PERSONALIZADO === */
.home-shop-area .home-shop-item .btn.btn-two {
    background-color: #8F986D !important;     /* Tu tono verde */
    color: white !important;                  /* Texto blanco */
    border: none !important;                  /* Sin borde */
    padding: 10px 20px !important;            /* Espaciado interno */
    border-radius: 30px !important;           /* Bordes redondeados */
    font-weight: bold !important;             /* Negrita */
    text-decoration: none !important;         /* Quitar subrayado si lo tiene */
    display: inline-block !important;         /* Asegurar comportamiento de bloque */
    transition: all 0.3s ease !important;     /* Transición suave */

    /* Forzar visibilidad incluso si el tema lo oculta */
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
}

/* Estado hover - con tono verde más oscuro */
.home-shop-area .home-shop-item .btn.btn-two:hover {
    background-color: #7d865c !important;     /* Verde más oscuro */
    transform: translateY(-2px) !important;
    box-shadow: 0 4px 8px rgba(0,0,0,0.1) !important;
    color: white !important;
}

/* === ICONO DEL CARRITO === */
.home-shop-area .home-shop-item .shop-content-bottom .cart {
    background-color: #8F986D !important;
    color: white !important;
    width: 40px !important;
    height: 40px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 50% !important;
    transition: all 0.3s ease !important;
    text-decoration: none !important;
    opacity: 1 !important;
    visibility: visible !important;
}

/* Hover del carrito */
.home-shop-area .home-shop-item .shop-content-bottom .cart:hover {
    background-color: #7d865c !important;     /* Verde más oscuro */
    transform: scale(1.1) !important;
}/* End custom CSS */
/* Start custom CSS for features-products, class: .elementor-element-41a413a *//* Aumentar el tamaño de las imágenes principales en la sección de productos */

#paroller .features-products-thumb .main-img img {
    width: 130% !important;
    max-width: none !important;
    height: auto !important;
    transform: scale(1.2); /* Escala un 20% más grande */
    transform-origin: center;
}
/* Primer producto: mover imagen a la izquierda */
#paroller .features-products-wrap:first-of-type 
.features-products-thumb .main-img img {
    transform: scale(1.2) translateX(-50px);
}
/* Último producto: mover imagen a la izquierda */
#paroller .features-products-wrap:last-of-type 
.features-products-thumb .main-img img {
    transform: scale(1.2) translateX(-50px);
}

.features-products .btn {
  background-color: #8F986D;
  color: white;
  padding: 10px 24px;
  border-radius: 50px;
  font-weight: 600;
  text-decoration: none;
  display: inline-block;
  border: none;
  transition: background-color 0.3s ease, transform 0.2s ease;
  box-shadow: 0 4px 8px rgba(255, 153, 0, 0.25);
}

.features-products .btn:hover {
  background-color: #FF8800;
  color: white;
  transform: translateY(-2px);
}

/* Oculta el precio dentro de la sección específica */
#paroller .features-product-bottom .price {
    display: none;
}

h2.title::after {
    display: none !important;
}
/* Oculta los círculos decorativos */
.fp-circle {
    display: none !important;
}/* End custom CSS */
/* Start custom CSS for testimonial, class: .elementor-element-ccea969 *//* Solución para Slick Slider en Safari */
.testimonial-active .slick-track,
.testimonial-active .slick-slide {
  transform: translate3d(0, 0, 0); /* Fuerza aceleración por hardware */
  -webkit-transform: translate3d(0, 0, 0); /* Prefijo para navegadores antiguos */
  backface-visibility: hidden; /* Evita problemas de renderizado en la cara trasera */
  -webkit-backface-visibility: hidden; /* Prefijo para Safari */
  /* Opcional: Asegurar posición relativa si es necesario */
  position: relative;
}

/* Opcional: Si el contenedor de cada slide necesita un z-index específico */
.testimonial-active .slick-slide {
  z-index: 1; /* Ajusta si es necesario */
  position: relative; /* Asegura posicionamiento relativo */
}

/* ============================================ */
/* TESTIMONIOS - Quitar shapes/líneas           */
/* ============================================ */

/* Ocultar shapes del área de testimonios */
.testimonial-area::before,
.testimonial-area::after,
.testimonial-bg::before,
.testimonial-bg::after {
    display: none !important;
}

/* Quitar overlay si genera la línea */
.testimonial-overlay::before,
.testimonial-overlay::after {
    display: none !important;
}

/* Si hay shapes como imágenes */
.testimonial-area . shape,
.testimonial-area [class*="shape"],
.testimonial-bg .shape,
.testimonial-bg [class*="shape"] {
    display: none !important;
}

/* Quitar bordes superiores e inferiores */
. testimonial-area,
.testimonial-bg {
    border-top: none !important;
    border-bottom: none !important;
}

/* Asegurar que no hay elementos decorativos */
.testimonial-area > img,
.testimonial-bg > img:not(. slick-slide img) {
    display: none ! important;
}/* End custom CSS */