/* =====================================================================
   NEXUS — Animations
   Ambient hero motion, hover micro-interactions, page transitions.
   All motion is disabled under prefers-reduced-motion (bottom of file).
   ===================================================================== */

/* Hero: floating hexagon + slow rotation glow */
@keyframes float {
  0%,100%{ transform: translateY(0); }
  50%    { transform: translateY(-12px); }
}
@keyframes spin-slow {
  from{ transform: rotate(0deg); }
  to  { transform: rotate(360deg); }
}
@keyframes glow-pulse {
  0%,100%{ opacity:.55; transform: scale(1); }
  50%    { opacity:.9;  transform: scale(1.06); }
}
@keyframes orbit {
  0%  { transform: translate(0,0); opacity:.4; }
  50% { transform: translate(6px,-10px); opacity:.9; }
  100%{ transform: translate(0,0); opacity:.4; }
}
@keyframes grad-shift {
  0%,100%{ background-position: 0% 50%; }
  50%    { background-position: 100% 50%; }
}

.hex{ animation: float 6s var(--ease) infinite; }
.hex-glow{ animation: glow-pulse 5s ease-in-out infinite; }
.hex-inner span{
  background-size: 200% 200%;
  animation: grad-shift 6s ease infinite;
}
.orb-1{ animation: orbit 7s ease-in-out infinite; }
.orb-2{ animation: orbit 9s ease-in-out infinite .6s; }
.orb-3{ animation: orbit 8s ease-in-out infinite 1.2s; }

/* Animated gradient on brand mark + hero title */
.grad{ background-size: 200% 200%; animation: grad-shift 8s ease infinite; }

/* Ripple on buttons */
@keyframes ripple { to { transform: scale(2.6); opacity:0; } }

/* Page fade transition overlay */
.page-fade{
  position: fixed; inset:0; z-index:200; pointer-events:none;
  background: var(--bg); opacity:0;
}
.page-fade.active{ opacity:1; transition: opacity .32s var(--ease); }

/* Staggered reveal helper — JS adds .in, delay via inline style */
.reveal{ will-change: opacity, transform; }

/* Theme-mode crossfade helper: brief global transition when switching */
body.mode-switching, body.mode-switching *{
  transition: background-color .5s var(--ease), color .5s var(--ease),
              border-color .5s var(--ease) !important;
}

/* Customizer fab subtle attention pulse on first load */
@keyframes fab-pop {
  0%{ transform: scale(0) rotate(-40deg); }
  70%{ transform: scale(1.1) rotate(6deg); }
  100%{ transform: scale(1) rotate(0); }
}
.customizer-fab{ animation: fab-pop .5s var(--ease-out) both; }

/* Nav link underline grow */
.nav-link::after{ transition: transform .25s var(--ease); }

@media (prefers-reduced-motion: reduce){
  *, *::before, *::after{
    animation-duration: .001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .001ms !important;
    scroll-behavior: auto !important;
  }
  .reveal{ opacity:1 !important; transform:none !important; }
}