/**
 * Footer reveal y animaciones.
 *
 * El design system es explícito: nada rebota, nada hace spring, nada tiene
 * parallax. Los reveals son fade + 12px de subida y nada más. La modernidad
 * aquí viene de la precisión del timing y del escalonado, no de la cantidad
 * de movimiento. Todo se apaga con prefers-reduced-motion.
 */

/* ---- Footer reveal ------------------------------------------------------
   El footer queda fijo al fondo y el contenido se desliza encima. Se descubre
   solo al llegar al final. La altura la mide el JS y la deja en --gt-footer-h.  */
body.gt-reveal .elementor-location-footer{
  position:fixed;bottom:0;left:0;right:0;z-index:0;width:100%;
}
/* hello-elementor no imprime <main>: el contenido es un div hermano del
   header y del footer. El JS le pone .gt-content para poder anclarlo. */
body.gt-reveal .elementor-location-header,
body.gt-reveal .gt-content{
  position:relative;z-index:1;
}
/* El contenido necesita fondo propio: si no, se ve el footer a través. */
body.gt-reveal .gt-content{
  background:var(--e-global-color-text,#F5F0E8);
  margin-bottom:var(--gt-footer-h,0px);
  box-shadow:0 24px 40px -30px rgba(10,30,36,.45);
}

/* En pantallas cortas el efecto estorba más de lo que aporta. */
@media (max-height:640px){
  body.gt-reveal .elementor-location-footer{position:static}
  body.gt-reveal .gt-content{margin-bottom:0;box-shadow:none}
}

/* ---- Reveal por scroll --------------------------------------------------
   Fade + 12px, escalonado por posición dentro de la sección.                */
.gt-anim{
  opacity:0;
  transform:translateY(12px);
  transition:opacity .72s cubic-bezier(.16,1,.3,1),transform .72s cubic-bezier(.16,1,.3,1);
  transition-delay:var(--gt-delay,0ms);
  will-change:opacity,transform;
}
.gt-anim.is-in{opacity:1;transform:none}

/* ---- Micro-interacciones ------------------------------------------------ */

/* La imagen de una tarjeta respira al pasar el cursor. 1.03, como manda el DS. */
.e-loop-item .gt-card-media{overflow:hidden}
.e-loop-item .gt-card-media img{
  transition:transform 6s cubic-bezier(.16,1,.3,1);
}
.e-loop-item a.e-con:hover .gt-card-media img{transform:scale(1.03)}

/* El título de la tarjeta pasa a brasa: señal clara de que es clicable. */
.e-loop-item a.e-con .elementor-widget-heading h3,
.e-loop-item a.e-con .elementor-widget-heading .elementor-heading-title{
  transition:color .12s cubic-bezier(.2,.6,.2,1);
}
.e-loop-item a.e-con:hover .elementor-widget-heading h3{
  color:var(--e-global-color-secondary,#A24726);
}

/* Botones: compresión casi imperceptible al presionar. */
.elementor-button{transition:background-color .12s cubic-bezier(.2,.6,.2,1),
  border-color .12s cubic-bezier(.2,.6,.2,1),color .12s cubic-bezier(.2,.6,.2,1),
  transform .12s cubic-bezier(.2,.6,.2,1)}
.elementor-button:active{transform:scale(.995)}

/* La regla de sección se dibuja al entrar. */
.gt-anim .elementor-divider-separator{
  transform-origin:left center;
  transform:scaleX(0);
  transition:transform .72s cubic-bezier(.16,1,.3,1) .1s;
}
.gt-anim.is-in .elementor-divider-separator{transform:scaleX(1)}

@media (prefers-reduced-motion:reduce){
  .gt-anim{opacity:1;transform:none;transition:none}
  .gt-anim .elementor-divider-separator{transform:none;transition:none}
  .e-loop-item .gt-card-media img,
  .e-loop-item a.e-con:hover .gt-card-media img{transition:none;transform:none}
  .elementor-button{transition:none}
  body.gt-reveal .elementor-location-footer{position:static}
  body.gt-reveal .gt-content{margin-bottom:0;box-shadow:none}
}

/* ---- Galería de las páginas de detalle ---------------------------------
   Una principal grande y el resto en tira. Sin recortes raros: cada hueco
   tiene proporción fija y la imagen la llena.                              */
.gt-gal{display:grid;gap:12px;margin:0}
.gt-gal__item{display:block;position:relative;overflow:hidden;border-radius:3px;
  border-bottom:0;line-height:0;background:#E4DDD1}
.gt-gal__item img{width:100%;height:100%;object-fit:cover;display:block;
  transition:transform 6s cubic-bezier(.16,1,.3,1)}
.gt-gal__item:hover img{transform:scale(1.03)}

/* Una grande arriba, el resto repartido debajo. */
.gt-gal--destacada{grid-template-columns:repeat(3,1fr)}
.gt-gal--destacada .gt-gal__item{aspect-ratio:4/3}
.gt-gal--destacada .gt-gal__item--lead{grid-column:1 / -1}
.gt-gal--destacada.gt-gal--r3-2 .gt-gal__item--lead{aspect-ratio:3/2}
.gt-gal--destacada.gt-gal--r16-9 .gt-gal__item--lead{aspect-ratio:16/9}
.gt-gal--destacada.gt-gal--r4-3 .gt-gal__item--lead{aspect-ratio:4/3}
/* Con una sola imagen no hay tira que repartir. */
.gt-gal--destacada[data-total="1"]{grid-template-columns:1fr}
.gt-gal--destacada[data-total="2"]{grid-template-columns:repeat(2,1fr)}

.gt-gal--mosaico{grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}
.gt-gal--mosaico .gt-gal__item{aspect-ratio:4/3}

@media(max-width:700px){
  .gt-gal--destacada{grid-template-columns:repeat(2,1fr)}
  .gt-gal--destacada[data-total="1"]{grid-template-columns:1fr}
}
@media(prefers-reduced-motion:reduce){
  .gt-gal__item img,.gt-gal__item:hover img{transition:none;transform:none}
}