/* InferenceView motion layer — subtle, fast, reduced-motion aware. */

/* scroll reveal */
.reveal { opacity: 0; transform: translateY(14px); transition: opacity 0.6s cubic-bezier(.2,.7,.2,1), transform 0.6s cubic-bezier(.2,.7,.2,1); }
.reveal.in { opacity: 1; transform: none; }
.reveal.d1 { transition-delay: .06s; } .reveal.d2 { transition-delay: .12s; } .reveal.d3 { transition-delay: .18s; } .reveal.d4 { transition-delay: .24s; }

/* animated hero aurora — drifts behind the grid */
.aurora { position: absolute; inset: 0; overflow: hidden; pointer-events: none; z-index: 0; }
.aurora::before, .aurora::after {
  content: ""; position: absolute; border-radius: 50%; filter: blur(70px); opacity: 0.5;
}
.aurora::before {
  width: 46vw; height: 46vw; top: -14vw; right: -6vw;
  background: radial-gradient(circle, rgba(86,202,221,0.28), transparent 68%);
  animation: drift1 22s ease-in-out infinite alternate;
}
.aurora::after {
  width: 34vw; height: 34vw; top: 8vw; right: 20vw;
  background: radial-gradient(circle, rgba(86,202,221,0.14), transparent 70%);
  animation: drift2 18s ease-in-out infinite alternate;
}
@keyframes drift1 { from { transform: translate(0,0) scale(1); } to { transform: translate(-6vw,5vw) scale(1.12); } }
@keyframes drift2 { from { transform: translate(0,0) scale(1); } to { transform: translate(7vw,-4vw) scale(0.9); } }

/* live pulse dot */
.pulse { position: relative; }
.pulse::after {
  content: ""; position: absolute; inset: -4px; border-radius: 50%;
  border: 1px solid currentColor; opacity: 0; animation: pulse 2.4s ease-out infinite;
}
@keyframes pulse { 0% { opacity: .5; transform: scale(1); } 100% { opacity: 0; transform: scale(2.4); } }

/* button sheen on hover */
.btn-primary { position: relative; overflow: hidden; }
.btn-primary::after {
  content: ""; position: absolute; top: 0; left: -60%; width: 40%; height: 100%;
  background: linear-gradient(100deg, transparent, rgba(255,255,255,0.35), transparent);
  transform: skewX(-18deg); transition: left .5s ease;
}
.btn-primary:hover::after { left: 130%; }

/* count-up numbers hold layout */
.count { font-variant-numeric: tabular-nums; }

/* frame chart draw-in */
.frame.reveal.in .frame-events .fe { animation: fadeUp .5s both; }
.frame .fe:nth-child(1){animation-delay:.25s} .frame .fe:nth-child(2){animation-delay:.4s} .frame .fe:nth-child(3){animation-delay:.55s}
@keyframes fadeUp { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }

@media (prefers-reduced-motion: reduce) {
  .reveal { opacity: 1 !important; transform: none !important; transition: none !important; }
  .aurora::before, .aurora::after, .pulse::after, .frame .fe { animation: none !important; }
  .btn-primary::after { display: none; }
}