/* Animaciones sutiles del inicio. Va ULTIMO para ganarle a los hover de 10-banner-y-categorias.css.
   Se ven igual en todos los equipos (no se apagan con «movimiento reducido»). */
@media all{
  /* Aparicion al hacer scroll (la clase .reveal la pone iniciarReveal() en app.js) */
  .reveal{opacity:0;transform:translateY(22px);transition:opacity .6s ease,transform .6s cubic-bezier(.2,.7,.2,1)}
  .reveal.visto{opacity:1;transform:none}

  /* Tarjetas de categoria: zoom de la imagen, titulo que sube y sombra mas marcada */
  #categorias .tarjeta{transition:box-shadow .35s ease}
  #categorias .tarjeta img{transition:transform .7s cubic-bezier(.2,.7,.2,1)}
  #categorias .tarjeta:hover img{transform:scale(1.08)}
  #categorias .tarjeta span{transition:transform .35s ease}
  #categorias .tarjeta:hover span{transform:translateY(-3px)}
  #categorias .tarjeta:hover{box-shadow:0 12px 26px rgba(0,0,0,.28)}

  /* Productos: mismo zoom suave de la foto */
  .prod .prod-img img{transition:transform .5s ease}
  .prod:hover .prod-img img{transform:scale(1.05)}
}
