/* Rize marketing: keyframes, scroll reveals, illustration motion, reduced motion.
   Everything ambient is slow (7s breath, 40s+ drift). Nothing snaps. */

/* Orb */
@keyframes orb-halo {
  0%, 100% { transform: translateZ(0) scale(0.97); opacity: 0.7; }
  50% { transform: translateZ(0) scale(1.035); opacity: 1; }
}
@keyframes orb-glow {
  0%, 100% { transform: translateZ(0) scale(1); opacity: 0.32; }
  50% { transform: translateZ(0) scale(1.1); opacity: 0.46; }
}
@keyframes orb-breathe {
  0%, 100% { transform: translateZ(0) scale(1); }
  50% { transform: translateZ(0) scale(1.04); }
}
@keyframes orb-shimmer {
  from { transform: translateZ(0) rotate(0deg); }
  to { transform: translateZ(0) rotate(360deg); }
}
@keyframes orb-ripple {
  0% { transform: scale(1); opacity: 0; }
  8% { opacity: 0.55; }
  100% { transform: scale(3.2); opacity: 0; }
}

/* Ambient field */
@keyframes drift {
  0% { transform: translate3d(0, 0, 0) scale(1); }
  33% { transform: translate3d(6%, -5%, 0) scale(1.08); }
  66% { transform: translate3d(-5%, 6%, 0) scale(0.95); }
  100% { transform: translate3d(3%, 3%, 0) scale(1.04); }
}

/* Hero entrance */
@keyframes word-in {
  to { opacity: 1; transform: none; filter: blur(0); }
}
@keyframes fade-up {
  to { opacity: 1; transform: none; }
}
@keyframes cue {
  0% { transform: scaleY(0); opacity: 0; }
  30% { opacity: 1; }
  100% { transform: scaleY(1); opacity: 0; }
}

/* Misc */
@keyframes spin { to { transform: rotate(360deg); } }
@keyframes typing {
  0%, 60%, 100% { transform: translateY(0); opacity: 0.5; }
  30% { transform: translateY(-4px); opacity: 1; }
}
@keyframes marquee {
  from { transform: translate3d(0, 0, 0); }
  to { transform: translate3d(-50%, 0, 0); }
}

/* Scroll reveals. Everything uses the same fade and rise, so no element
   arrives from a different direction or at a different speed. "fade" is
   opacity only, for hairlines, labels, and the marquee. */
[data-reveal] {
  opacity: 0;
  transform: translateY(var(--rise));
  transition: opacity var(--reveal) var(--ease-reveal), transform var(--reveal) var(--ease-reveal);
  transition-delay: var(--delay, 0s);
  will-change: opacity, transform;
}
[data-reveal="fade"] { transform: none; }
[data-reveal="none"] { opacity: 1; transform: none; transition: none; }
[data-reveal].is-visible { opacity: 1; transform: none; }
[data-reveal].is-visible:not([data-reveal="none"]) { will-change: auto; }

/* Lumina's own entrance. The rest of the page fades and rises; Lumina
   wakes. It gathers out of a soft, blurred haze, swells a little past
   full size like a first inhale, then settles into the 7s breath. No
   brightness filter: the orb's own glow carries the light, so it never
   blows out to white on the way in. Used for the standalone orbs (hero, join), not the small one
   in the chat header. */
@keyframes lumina-wake {
  0% { opacity: 0; transform: scale(0.42); filter: blur(7px); }
  35% { opacity: 1; }
  62% { filter: blur(2px); }
  78% { transform: scale(1.035); filter: blur(0); }
  100% { opacity: 1; transform: scale(1); filter: blur(0); }
}
.lumina-wake { animation: lumina-wake 2s var(--ease-breath) var(--d, 0.05s) both; }
[data-reveal="lumina"] {
  opacity: 0;
  transform: scale(0.16);
  filter: blur(12px);
  transition: none;
}
[data-reveal="lumina"].is-visible { animation: lumina-wake 2s var(--ease-breath) both; }

/* Feature illustration motion lives in illustrations.css. */

/* Reduced motion: keep the page, drop the choreography. */
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    animation-delay: 0s !important;
    transition-delay: 0s !important;
  }
  .hero-title .w, .fade-up, .lumina-wake, [data-reveal="lumina"] { opacity: 1; transform: none; filter: none; }
  [data-reveal] { opacity: 1; transform: none; }
  .marquee-track { animation: none; flex-wrap: wrap; width: auto; justify-content: center; padding: 0 var(--gutter); }
  .marquee { -webkit-mask-image: none; mask-image: none; }
  .marquee-track > .voice:nth-child(n + 4) { display: none; }
  .msg { opacity: 1; transform: none; }
  .feature { opacity: 1; }
  .blob { filter: blur(70px); }
}