/* =========================================================
   Animaciones
   ========================================================= */

/* ---------- Fondos animados ---------- */
.fondo-animado {
  background-image: linear-gradient(120deg, #f15a24 0%, #f7931e 25%, #42210b 50%, #ff7bac 75%, #f15a24 100%);
  background-size: 400% 400%;
  animation: fondo-ciclo 24s linear infinite;
  animation-delay: var(--retraso-fondo, 0s);
}
.fondo-animado.is-fuera { animation-play-state: paused; }
@keyframes fondo-ciclo {
  0%   { background-position: 0% 50%; }
  50%  { background-position: 100% 50%; }
  100% { background-position: 0% 50%; }
}

/* ---------- Rueda ---------- */
.rueda__giro { transition: rotate var(--rueda-giro) var(--rueda-curva); }
.del-dia__titulo { transition: opacity .4s ease, translate .4s ease; translate: 0 8px; }
.del-dia__titulo.is-activo { translate: 0 0; transition-delay: .3s; }
.del-dia__titulo.is-saliendo { opacity: 0; translate: 0 -8px; transition-delay: 0s; }

.rueda__platillo--gira { animation: girar var(--cafe-giro) linear infinite; }
.del-dia.is-pausada .rueda__platillo--gira { animation-play-state: paused; }
@keyframes girar { to { rotate: 360deg; } }

/* ---------- Aparición de abajo hacia arriba ---------- */
.js [data-aparecer] {
  opacity: 0;
  transition: opacity .6s var(--curva-salida), translate .6s var(--curva-salida);
  transition-delay: calc(var(--retraso, 0s) + var(--i, 0) * .08s);
}
.js [data-aparecer="titulo"] { translate: 0 100%; }
.js [data-aparecer="bloque"] { translate: 0 50%; --retraso: .2s; }
.js [data-aparecer].es-visible { opacity: 1; translate: 0 0; }
/* un titular dentro de un bloque que aparece no se anima dos veces */
.js [data-aparecer="bloque"] [data-aparecer] { opacity: 1; translate: none; }

/* ---------- Flautas ---------- */
.flautas__capa.is-cayendo { animation: caer .5s cubic-bezier(.34, 1.56, .64, 1) both; }
@keyframes caer { from { opacity: 0; translate: 0 -40px; } to { opacity: 1; translate: 0 0; } }
.flautas.is-invitando .flautas__boton { animation: balanceo 4s ease-in-out infinite; transform-origin: 50% 90%; }
@keyframes balanceo {
  0%, 78%, 100% { rotate: 0deg; }
  84% { rotate: -2.5deg; }
  90% { rotate: 2deg; }
  95% { rotate: -1deg; }
}
.flautas__pista { transition: opacity .25s ease; }
.flautas__pista.is-cambiando { opacity: 0; }

/* ---------- Catering: platillos que entran de derecha a izquierda con el scroll ---------- */
.deslizar__item { will-change: transform, opacity; }

/* ---------- Contacto: carrusel de reseñas ---------- */
.carrusel__pista { animation: carrusel var(--duracion, 48s) linear infinite; }
.carrusel--izquierda .carrusel__pista { animation-name: carrusel-izquierda; }
.carrusel:hover .carrusel__pista,
.carrusel:focus-within .carrusel__pista,
.carrusel.is-fuera .carrusel__pista { animation-play-state: paused; }
@keyframes carrusel { from { translate: -50% 0; } to { translate: 0 0; } }
@keyframes carrusel-izquierda { from { translate: 0 0; } to { translate: -50% 0; } }

/* ---------- Movimiento reducido ---------- */
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .fondo-animado { animation: none; background-image: linear-gradient(120deg, #f15a24, #f7931e); background-size: auto; }
  .rueda__giro { transition: none; }
  .rueda--platos { transition: opacity .4s ease; }
  .rueda--platos.is-cambiando { opacity: 0; }
  .rueda__platillo--gira { animation: none; }
  .js [data-aparecer] { translate: none !important; transition: opacity .5s ease; }
  .flautas__capa.is-cayendo { animation: aparecer-suave .4s ease both; }
  .flautas.is-invitando .flautas__boton { animation: none; }
  .carrusel__pista { animation: none; }
  .carrusel { overflow-x: auto; }
  .deslizar__item { transform: none !important; opacity: 1 !important; }
  .boton:hover { transform: none; }
}
@keyframes aparecer-suave { from { opacity: 0; } to { opacity: 1; } }

/* ---------- Halo intermitente en titulares que son enlace (Servicios) ---------- */
.enlace-titulo {
  border-radius: .2em;
  animation: halo-enlace 2.8s ease-in-out infinite;
}
.enlace-titulo:hover, .enlace-titulo:focus-visible { animation-play-state: paused; text-shadow: 0 0 18px rgba(255, 255, 255, .75), 0 0 2px rgba(255, 255, 255, .9); }
.servicio:nth-child(2) .enlace-titulo { animation-delay: -1.4s; } /* que los dos no pulsen al mismo tiempo */
.bloque-final.is-fuera .enlace-titulo { animation-play-state: paused; }
@keyframes halo-enlace {
  0%, 100% { text-shadow: 0 0 0 rgba(255, 255, 255, 0); }
  50%      { text-shadow: 0 0 22px rgba(255, 255, 255, .6), 0 0 4px rgba(255, 255, 255, .45); }
}
@media (prefers-reduced-motion: reduce) {
  .enlace-titulo { animation: none; text-decoration: underline; text-decoration-thickness: .06em; text-underline-offset: .12em; text-decoration-color: rgba(255, 255, 255, .55); }
}