/* Garvizu Motion Kit v1 — scroll dinámico + imágenes en movimiento.
   Autocontenido, sin dependencias. Respeta prefers-reduced-motion. */

/* ---- Reveal al hacer scroll ---- */
.gmk-reveal { opacity: 0; transform: translateY(28px); transition: opacity .7s cubic-bezier(.22,.61,.36,1), transform .7s cubic-bezier(.22,.61,.36,1); will-change: opacity, transform; }
.gmk-reveal.gmk-in { opacity: 1; transform: none; }
.gmk-reveal[data-gmk-delay="1"] { transition-delay: .12s; }
.gmk-reveal[data-gmk-delay="2"] { transition-delay: .24s; }
.gmk-reveal[data-gmk-delay="3"] { transition-delay: .36s; }

/* ---- Ken Burns (imágenes vivas del hero) ---- */
@keyframes gmk-kenburns {
  0%   { transform: scale(1) translate(0,0); }
  50%  { transform: scale(1.08) translate(1.5%, -1.5%); }
  100% { transform: scale(1) translate(0,0); }
}
.gmk-kenburns { animation: gmk-kenburns 18s ease-in-out infinite; will-change: transform; }
.gmk-kb-wrap { overflow: hidden; }

/* ---- Parallax suave (JS setea --gmk-y) ---- */
.gmk-parallax { transform: translateY(var(--gmk-y, 0)); will-change: transform; }

/* ---- Zoom elegante en imágenes de galería/tarjetas ---- */
.gmk-zoom { transition: transform .6s cubic-bezier(.22,.61,.36,1), box-shadow .6s; }
.gmk-zoom:hover { transform: scale(1.04); }

/* ---- Flotación sutil (CTA / badges) ---- */
@keyframes gmk-float { 0%,100% { transform: translateY(0); } 50% { transform: translateY(-8px); } }
.gmk-float { animation: gmk-float 5s ease-in-out infinite; }

/* ---- Barra de progreso de lectura ---- */
#gmk-progress { position: fixed; top: 0; left: 0; height: 3px; width: 0; z-index: 9999;
  background: var(--gmk-accent, #1B73BA); transition: width .1s linear; }

/* ---- Accesibilidad: sin movimiento si el usuario lo pide ---- */
@media (prefers-reduced-motion: reduce) {
  .gmk-reveal { opacity: 1 !important; transform: none !important; transition: none !important; }
  .gmk-kenburns, .gmk-float { animation: none !important; }
  .gmk-parallax { transform: none !important; }
  .gmk-zoom, .gmk-zoom:hover { transform: none !important; transition: none !important; }
}
