/******* Do not edit this file *******
Simple Custom CSS and JS - by Silkypress.com
Saved: Feb 12 2026 | 22:42:57 */
/* =========================================
   1. Contenedores y Estructura Base
   ========================================= */

/* Wrapper principal */
.qh-galeria-fotos--altura {
  width: 855px;
  max-width: 100%;
  height: 435px;
  padding-inline: 0;
  box-sizing: border-box;
  margin: 0 auto; /* Centrado opcional si es necesario */
}

.qh-galeria-frame {
  width: 100%;
  height: 435px;
  display: flex;
  align-items: flex-end;
}

/* Configuración del Track para permitir overflow lateral visible */
.qh-galeria-splide--altura .splide__track {
  overflow: visible;
}

.qh-galeria-splide--altura .splide__list {
  will-change: transform;
  align-items: flex-end; /* Alineación inferior para el efecto de crecimiento */
}

/* Configuración del Slide individual */
.qh-galeria-splide--altura .splide__slide {
  width: 850px;
  max-width: 100%;
  display: flex;
  align-items: flex-end;
}

/* =========================================
   2. Tarjetas e Imágenes (Animaciones)
   ========================================= */

/* Caja de la imagen (Estado inactivo/base) */
.qh-galeria-slide--altura {
  width: 100%;
  height: 372px; /* Altura por defecto */
  border-radius: 14px;
  overflow: hidden;
  background: #eee;
  transition: height 900ms cubic-bezier(0.25, 1, 0.5, 1);
}

.qh-galeria-slide--altura img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* Estado Activo (La imagen crece) */
.qh-galeria-splide--altura .splide__slide.is-active .qh-galeria-slide--altura {
  height: 435px;
}

/* Estado Previo/Siguiente (Escalón intermedio opcional) */
.qh-galeria-splide--altura .splide__slide.is-prev .qh-galeria-slide--altura,
.qh-galeria-splide--altura .splide__slide.is-next .qh-galeria-slide--altura {
  height: 400px;
}

/* =========================================
   3. Flechas de Navegación
   ========================================= */

.qh-galeria-splide .splide__arrow {
  width: 42px !important;
  height: 42px !important;
  border-radius: 14px !important;
  background-color: #faf4e6;
  border: 0 !important;
  background-repeat: no-repeat;
  background-position: center;
  transition: background-color 0.3s ease;
  
  /* Icono flecha izquierda (Prev) por defecto */
  background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%229%22%20height%3D%2216%22%20viewBox%3D%220%200%209%2016%22%20fill%3D%22none%22%3E%0A%20%20%3Cpath%20d%3D%22M2.55291%207.87767L8.5623%2013.8867C8.76638%2014.091%208.87089%2014.3479%208.8758%2014.6572C8.88048%2014.9663%208.77597%2015.2278%208.5623%2015.4417C8.34837%2015.6554%208.08921%2015.7622%207.7848%2015.7622C7.48039%2015.7622%207.22122%2015.6554%207.0073%2015.4417L0.376798%208.81119C0.238855%208.673%200.141481%208.52731%200.0846809%208.37412C0.027881%208.22093%20-0.000519473%208.05545%20-0.000519488%207.87767C-0.000519504%207.6999%200.0278809%207.53442%200.0846808%207.38123C0.141481%207.22804%200.238855%207.08235%200.376798%206.94416L7.0073%200.313658C7.21163%200.109571%207.46846%200.00506795%207.77779%200.000149823C8.08687%20-0.00452225%208.34837%200.0999804%208.5623%200.313658C8.77597%200.52758%208.88281%200.786746%208.88281%201.09116C8.88281%201.39557%208.77597%201.65473%208.5623%201.86865L2.55291%207.87767Z%22%20fill%3D%22%237BAA39%22%2F%3E%0A%3C%2Fsvg%3E");
}

/* Ocultar el SVG por defecto de Splide si usamos background-image */
.qh-galeria-splide .splide__arrow svg {
  display: none;
}

/* Hover States */
.qh-galeria-splide .splide__arrow:hover,
.qh-galeria-splide .splide__arrow:focus-visible {
  background-color: #faf4e6;
}

/* Posición Flecha Izquierda */
.qh-galeria-splide .splide__arrow--prev {
  left: calc((100vw - 853px) / -2 + 20px);
}

/* Posición e Icono Flecha Derecha */
.qh-galeria-splide .splide__arrow--next {
  right: calc((100vw - 853px) / -2 + 20px);
  background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%229%22%20height%3D%2216%22%20viewBox%3D%220%200%209%2016%22%20fill%3D%22none%22%3E%0A%20%20%3Cpath%20d%3D%22M6.3299%207.88453L0.320516%201.87551C0.116428%201.67118%200.0119257%201.41435%200.00700791%201.10502C0.00233603%200.795941%200.106839%200.534438%200.320516%200.320516C0.534438%200.106839%200.793604%200%201.09801%200C1.40242%200%201.66159%200.106839%201.87551%200.320516L8.50601%206.95102C8.64396%207.08921%208.74133%207.2349%208.79813%207.38808C8.85493%207.54127%208.88333%207.70676%208.88333%207.88453C8.88333%208.06231%208.85493%208.22779%208.79813%208.38098C8.74133%208.53417%208.64396%208.67986%208.50601%208.81805L1.87551%2015.4485C1.67118%2015.6526%201.41435%2015.7571%201.10502%2015.7621C0.79594%2015.7667%200.534438%2015.6622%200.320516%2015.4485C0.106839%2015.2346%200%2014.9755%200%2014.6711C0%2014.3666%200.106839%2014.1075%200.320516%2013.8936L6.3299%207.88453Z%22%20fill%3D%22%237BAA39%22%2F%3E%0A%3C%2Fsvg%3E");
}

/* Modificación específica para la galería tipo "altura" (redondas) */
.qh-galeria-splide--altura .splide__arrow {
  width: 44px !important;
  height: 44px !important;
  border-radius: 50% !important;
}

/* =========================================
   4. Paginación (Dots)
   ========================================= */

.qh-galeria-fotos .splide__pagination {
  bottom: -18px;
  width: fit-content;
  margin: auto;
  border-radius: 32px;
  background: var(--color-white-solid, #fff);
  display: flex;
  padding: 10px 24px;
  align-items: flex-start;
  gap: 2px;
}

/* Ajuste específico para la galería altura */
.qh-galeria-splide--altura .splide__pagination {
  bottom: -11px;
}

.qh-galeria-fotos .splide__pagination li {
  width: 27px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.qh-galeria-fotos button.splide__pagination__page {
  border: 0;
  width: 12px;
  height: 12px;
  border-radius: 100px;
  background: var(--Neutral-neutral-6, #c1c1c1);
  margin: 0;
  padding: 0;
  transition: all 0.2s ease;
}

.qh-galeria-fotos .splide__pagination__page:hover,
.qh-galeria-fotos .splide__pagination__page:focus {
  background: var(--Neutral-neutral-6, #c1c1c1);
}

.qh-galeria-fotos .splide__pagination__page.is-active {
  transform: scale(1);
  width: 27px;
  background-color: #93d500;
}

/* =========================================
   5. Responsive (Móvil)
   ========================================= */

@media (max-width: 768px) {
  /* Flechas pegadas a los bordes */
  .qh-galeria-splide .splide__arrow--prev {
    left: 10px;
  }
  .qh-galeria-splide .splide__arrow--next {
    right: 10px;
  }
  
  /* Ajuste de anchos */
  .qh-galeria-splide--altura .splide__slide {
    width: 86vw;
  }

  /* Ajuste de alturas (Se tomó la última regla del código original: altura fija 430px) */
  .qh-galeria-frame,
  .qh-galeria-slide--altura,
  .qh-galeria-splide--altura .splide__slide.is-active .qh-galeria-slide--altura,
  .qh-galeria-splide--altura .splide__slide.is-prev .qh-galeria-slide--altura {
    height: 430px;
  }
  
  .qh-galeria-splide--altura .splide__slide.is-next .qh-galeria-slide--altura{
    height: 370;
  }
}