/* Aleas — Motion & Animation System */

/* HERO GLOW DRIFT */
@keyframes glowDriftA {
  0%, 100% { transform: translate(0, 0) scale(1); }
  50%       { transform: translate(4vw, 3vh) scale(1.06); }
}
@keyframes glowDriftB {
  0%, 100% { transform: translate(0, 0) scale(1); }
  50%       { transform: translate(-3vw, -4vh) scale(0.95); }
}
.hero-bg-glow-1, .hero-glow-1 { animation: glowDriftA 22s ease-in-out infinite; }
.hero-bg-glow-2, .hero-glow-2 { animation: glowDriftB 26s ease-in-out infinite; }

/* TIMELINE DRAW (process page; .drawn added by main.js) */
.phase-timeline::before {
  transform: translateX(-50%) scaleY(0);
  transform-origin: top;
  transition: transform 1.6s cubic-bezier(0.16,1,0.3,1);
}
.phase-timeline.drawn::before { transform: translateX(-50%) scaleY(1); }

/* SCROLL REVEAL */
.reveal, .reveal-l, .reveal-r, .reveal-scale {
  transition: opacity 0.75s cubic-bezier(0.16,1,0.3,1),
              transform 0.75s cubic-bezier(0.16,1,0.3,1);
}
.reveal       { opacity: 0; transform: translateY(28px); }
.reveal-l     { opacity: 0; transform: translateX(-28px); }
.reveal-r     { opacity: 0; transform: translateX(28px); }
.reveal-scale { opacity: 0; transform: scale(0.94) translateY(14px); }
.reveal.in, .reveal-l.in, .reveal-r.in { opacity: 1; transform: translate(0); }
.reveal-scale.in { opacity: 1; transform: none; }

/* STAGGER */
.stagger > * {
  opacity: 0;
  transform: translateY(24px);
  transition: opacity 0.7s cubic-bezier(0.16,1,0.3,1),
              transform 0.7s cubic-bezier(0.16,1,0.3,1);
}
.stagger.in > * { opacity: 1; transform: none; }
.stagger.in > *:nth-child(2) { transition-delay: 0.09s; }
.stagger.in > *:nth-child(3) { transition-delay: 0.18s; }
.stagger.in > *:nth-child(4) { transition-delay: 0.27s; }
.stagger.in > *:nth-child(5) { transition-delay: 0.36s; }
.stagger.in > *:nth-child(6) { transition-delay: 0.45s; }

/* WORD-BY-WORD HEADING REVEAL */
.wsplit { display: inline-block; overflow: hidden; vertical-align: bottom; }
.wsplit > span {
  display: inline-block;
  transform: translateY(112%);
  transition: transform 0.75s cubic-bezier(0.16,1,0.3,1);
  transition-delay: calc(var(--wi, 0) * 50ms);
}
.words-in .wsplit > span { transform: none; }

/* RIPPLE */
.btn-ripple { position: relative; overflow: hidden; }
.ripple-el {
  position: absolute;
  border-radius: 50%;
  background: rgba(255,255,255,0.25);
  transform: scale(0);
  animation: rippleOut 0.55s linear forwards;
  pointer-events: none;
}
@keyframes rippleOut { to { transform: scale(35); opacity: 0; } }

/* TYPING DOTS */
.typing-dot {
  width: 4px; height: 4px;
  border-radius: 50%;
  background: var(--blue);
  animation: typingBounce 1.3s ease-in-out infinite;
}
.typing-dot:nth-child(2) { animation-delay: 0.18s; }
.typing-dot:nth-child(3) { animation-delay: 0.36s; }
@keyframes typingBounce {
  0%, 60%, 100% { transform: translateY(0); opacity: 0.4; }
  30%            { transform: translateY(-4px); opacity: 1; }
}

/* STATUS DOT */
.status-dot {
  width: 7px; height: 7px;
  border-radius: 50%;
  background: #3BEB8F;
  animation: statusPulse 2s ease-in-out infinite;
}
@keyframes statusPulse {
  0%, 100% { opacity: 0.5; }
  50%       { opacity: 1; }
}

/* MAGNETIC BUTTONS */
.magnetic { transition: transform 0.3s cubic-bezier(0.22,1,0.36,1); }

/* REDUCED MOTION (a11y) */
@media (prefers-reduced-motion: reduce) {
  .magnetic { transition: none !important; transform: none !important; }
  .hero-content { transform: none !important; opacity: 1 !important; }
  html { scroll-behavior: auto; }
  .fade-up, .reveal, .reveal-l, .reveal-r, .reveal-scale, .stagger > * {
    animation: none !important;
    transition: none !important;
    opacity: 1 !important;
    transform: none !important;
  }
  .wsplit > span { transform: none !important; transition: none !important; }
  .nav-pill, #cursor-glow { display: none !important; }
  #mobile-menu nav a { transition: none !important; opacity: 1 !important; transform: none !important; }
  #back-to-top { transition: none !important; }
  .marquee-track, .anim-node, .anim-line,
  .typing-dot, .status-dot { animation: none !important; }
  #mobile-menu, #menu-backdrop { transition: none !important; }
  .hero-bg-glow-1, .hero-glow-1,
  .hero-bg-glow-2, .hero-glow-2,
  .anim-packet, .h1-accent { animation: none !important; }
  .tilt-panel { transition: none !important; transform: none !important; }
  .phase-timeline::before { transform: translateX(-50%) scaleY(1) !important; transition: none !important; }
  .service-card--featured { animation: none !important; }
  .section-index { transition: none !important; }
}
