/* Vanilla replacements for framer-motion effects used in the original React build.
   Paired with assets/js/reveal.js (scroll-in) and assets/js/header.js (nav). */

/* Scroll reveal (fade + slide up), mirrors <Reveal> */
[data-reveal] {
  opacity: 0;
  transform: translateY(16px);
  transition:
    opacity 0.6s cubic-bezier(0.22, 1, 0.36, 1),
    transform 0.6s cubic-bezier(0.22, 1, 0.36, 1);
}
[data-reveal].is-visible {
  opacity: 1;
  transform: translateY(0);
}
[data-reveal-delay="1"] { transition-delay: 0.08s; }
[data-reveal-delay="2"] { transition-delay: 0.16s; }
[data-reveal-delay="3"] { transition-delay: 0.24s; }
[data-reveal-delay="4"] { transition-delay: 0.32s; }
[data-reveal-delay="5"] { transition-delay: 0.4s; }
[data-reveal-delay="6"] { transition-delay: 0.48s; }

/* Animated underline under section headings, mirrors <SectionTitle> */
.rhub-underline {
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 0.7s cubic-bezier(0.22, 1, 0.36, 1);
  transition-delay: 0.15s;
}
.rhub-underline.center {
  transform-origin: center;
}
[data-reveal].is-visible .rhub-underline {
  transform: scaleX(1);
}

/* Page-load entrance stagger for the hero column */
@keyframes rhub-fade-up {
  from {
    opacity: 0;
    transform: translateY(14px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
.rhub-fade-up {
  opacity: 0;
  animation: rhub-fade-up 0.7s cubic-bezier(0.22, 1, 0.36, 1) forwards;
}

/* Ambient breathing glow blobs (hero background, CTA background) */
@keyframes rhub-breathe {
  0%,
  100% {
    opacity: 0.7;
    transform: scale(1);
  }
  50% {
    opacity: 1;
    transform: scale(1.12);
  }
}
.rhub-glow-breathe {
  animation: rhub-breathe 4.5s ease-in-out infinite;
}

@keyframes rhub-float {
  0%,
  100% {
    opacity: 0.7;
    transform: translateY(0);
  }
  50% {
    opacity: 1;
    transform: translateY(-18px);
  }
}
.rhub-glow-float {
  animation: rhub-float 7s ease-in-out infinite;
}

/* Traveling pulse along the process timeline connector */
@keyframes rhub-travel {
  0% {
    left: -7rem;
    opacity: 0;
  }
  3% {
    opacity: 1;
  }
  82% {
    left: 100%;
    opacity: 1;
  }
  86% {
    opacity: 0;
  }
  100% {
    left: -7rem;
    opacity: 0;
  }
}
.rhub-process-pulse {
  position: absolute;
  top: 0;
  height: 1px;
  width: 7rem;
  background: linear-gradient(90deg, transparent, rgba(255, 159, 28, 0.9), transparent);
  animation: rhub-travel 3.8s linear infinite;
}