/* ============================================================
   ANIMATIONS — Keyframes, Scroll Reveal, Floating effects
   ============================================================ */

/* ── Keyframes ─────────────────────────────────────────────── */
@keyframes meshShift {
  0%   { filter: hue-rotate(0deg)  brightness(1.00); }
  50%  { filter: hue-rotate(8deg)  brightness(1.05); }
  100% { filter: hue-rotate(-5deg) brightness(0.97); }
}

@keyframes floatOrb {
  0%, 100% { transform: translate(0, 0)     scale(1.00); }
  33%       { transform: translate(30px, -40px) scale(1.05); }
  66%       { transform: translate(-20px, 25px) scale(0.96); }
}

@keyframes cardFloat {
  0%, 100% { transform: rotateY(-6deg) rotateX(3deg) translateY(0);    }
  50%       { transform: rotateY(-4deg) rotateX(2deg) translateY(-12px); }
}

@keyframes iconFloat {
  0%, 100% { transform: translateY(0)     rotate(0deg); }
  50%       { transform: translateY(-14px) rotate(6deg); }
}

@keyframes pulse {
  0%, 100% { opacity: 1;   transform: scale(1.0); }
  50%       { opacity: 0.5; transform: scale(1.5); }
}

/* ── Scroll reveal ─────────────────────────────────────────── */
/*
  Elements marked with .reveal start invisible.
  JS (reveal.js) adds .visible when they enter the viewport.
  Use style="transition-delay: Xs" on siblings to stagger them.
*/
.reveal {
  opacity: 0;
  transform: translateY(30px);
  transition: opacity 0.7s ease, transform 0.7s ease;
}
.reveal.visible {
  opacity: 1;
  transform: translateY(0);
}

/* ── Mobile performance ────────────────────────────────────────
   Touch/small screens: cut expensive GPU layers that cause lag.
   Disables 3D tilt, reduces backdrop-filter blur, dims orbs.
   ──────────────────────────────────────────────────────────── */
@media (hover: none), (max-width: 1100px) {
  .hero-card {
    transform: none !important;
    animation: none;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
    background: rgba(5, 15, 40, 0.92);
  }
  .orb { filter: blur(20px); opacity: 0.5; }
  .program-card,
  .why-card,
  .testimonial-card {
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
    background: rgba(10, 20, 45, 0.88);
  }
  nav {
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
  }
}

/* ── Respect reduced-motion OS preference ──────────────────── */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    transition-duration: 0.01ms !important;
  }
  .reveal { opacity: 1; transform: none; }
}