/* ─────────────────────────────────────────────────────────────
   INFRADESK ANIMATIONS & MOUSE-TRACKING GLASSMORPHISM REFLECTIONS
   Dynamic Mouse-Tracking Luminous Border Reflection & Reveal Helpers
   ───────────────────────────────────────────────────────────── */

/* Default visible state for progressive enhancement */
.gsap-fade-up,
.gsap-fade-in,
.gsap-scale-up {
  opacity: 1;
  transform: none;
}

/* ── Mouse-Tracking Glassmorphism Border Reflection ──────────── */
.bento-card,
.calc-card,
.comparison-container,
.stat-card,
.glow-beam-card {
  position: relative;
  --mouse-x: 50%;
  --mouse-y: 50%;
}

/* Luminous Wander Edge (Masked 1.5px border glow) */
.bento-card::before,
.calc-card::before,
.glow-beam-card::before,
.comparison-container::before {
  content: '';
  position: absolute;
  inset: 0;
  border-radius: inherit;
  padding: 1.5px;
  background: radial-gradient(
    450px circle at var(--mouse-x, 50%) var(--mouse-y, 50%),
    rgba(39, 186, 54, 0.75) 0%,
    rgba(39, 186, 54, 0.25) 30%,
    transparent 65%
  );
  -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  -webkit-mask-composite: xor;
  mask-composite: exclude;
  opacity: 0;
  transition: opacity 0.3s ease;
  pointer-events: none;
  z-index: 4;
}

/* Inner Glass Refraction Highlight */
.bento-card::after,
.calc-card::after,
.glow-beam-card::after,
.comparison-container::after {
  content: '';
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background: radial-gradient(
    500px circle at var(--mouse-x, 50%) var(--mouse-y, 50%),
    rgba(39, 186, 54, 0.08) 0%,
    rgba(39, 186, 54, 0.02) 40%,
    transparent 70%
  );
  opacity: 0;
  transition: opacity 0.3s ease;
  pointer-events: none;
  z-index: 1;
}

.bento-card:hover::before,
.calc-card:hover::before,
.glow-beam-card:hover::before,
.comparison-container:hover::before,
.bento-card:hover::after,
.calc-card:hover::after,
.glow-beam-card:hover::after,
.comparison-container:hover::after {
  opacity: 1;
}

/* Floating animation for subtle background items */
@keyframes floatSlow {
  0%, 100% {
    transform: translateY(0px);
  }
  50% {
    transform: translateY(-8px);
  }
}

.animate-float {
  animation: floatSlow 6s ease-in-out infinite;
}

.animate-float-delayed {
  animation: floatSlow 7s ease-in-out 2s infinite;
}

/* Reduced Motion Preference */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}