/* diflow/assets/css/effects.css */

/* =========================================================
   ---------- 1) EFECTOS (OPCIONALES) ----------
   Nota: todo esto es decorativo. Si lo quitas, el sitio sigue funcionando.
   ========================================================= */

/* Glow sutil en tarjetas */
.hero-card::after{
  content:"";
  position:absolute;
  inset:-2px;
  background: radial-gradient(380px 240px at 30% 20%, rgba(119,212,212,.18), transparent 60%),
              radial-gradient(320px 220px at 80% 30%, rgba(79,186,203,.16), transparent 55%);
  pointer-events:none;
  opacity: .75;
}

/* Hover lift */
.card, .product, .mini-card, .hero-card{
  transition: transform .12s ease, border-color .18s ease, background .18s ease;
}
.card:hover, .product:hover, .mini-card:hover{
  transform: translateY(-1px);
  border-color: rgba(255,255,255,0.18);
  background: rgba(255,255,255,0.05);
}

/* Respeta usuarios con reduce motion */
@media (prefers-reduced-motion: reduce){
  .card, .product, .mini-card, .hero-card{ transition: none; }
  .card:hover, .product:hover, .mini-card:hover{ transform: none; }
}