/* Minimal global tweaks (no Tailwind processing required) */
html {
  scroll-behavior: smooth;
}
/* Tailwind classes are used inline in HTML. */

/* Subtle grid background for hero */
.bg-grid {
  background-image: linear-gradient(
      to right,
      rgba(59, 130, 246, 0.08) 1px,
      transparent 1px
    ),
    linear-gradient(to bottom, rgba(59, 130, 246, 0.08) 1px, transparent 1px);
  background-size: 24px 24px;
}

/* Gentle floating animation for decorative orbs */
@keyframes floatY {
  0%,
  100% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-10px);
  }
}
@keyframes floatX {
  0%,
  100% {
    transform: translateX(0);
  }
  50% {
    transform: translateX(12px);
  }
}

@media (prefers-reduced-motion: no-preference) {
  .animate-orb {
    animation: floatY 16s ease-in-out infinite;
  }
  .animate-orb-2 {
    animation: floatX 22s ease-in-out infinite;
  }
  .animate-delay {
    animation-delay: -8s;
  }
}

/* Hero reveal animations */
@keyframes fadeUp {
  from {
    opacity: 0;
    transform: translateY(16px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes slideInRight {
  from {
    opacity: 0;
    transform: translateX(24px);
  }
  to {
    opacity: 1;
    transform: translateX(0);
  }
}

/* Subtle grid panning */
@keyframes gridMove {
  0% {
    background-position: 0 0, 0 0;
  }
  100% {
    background-position: 24px 24px, 24px 24px;
  }
}

/* Utility animation classes (safe with reduced motion) */
.animate-fade-up {
  opacity: 1;
}
.animate-slide-in-right {
  opacity: 1;
}
.bg-grid-animate {
  will-change: background-position;
}

@media (prefers-reduced-motion: no-preference) {
  .animate-fade-up {
    opacity: 0;
    will-change: transform, opacity;
    animation: fadeUp 700ms cubic-bezier(0.22, 1, 0.36, 1) forwards;
  }
  .animate-slide-in-right {
    opacity: 0;
    will-change: transform, opacity;
    animation: slideInRight 800ms cubic-bezier(0.22, 1, 0.36, 1) forwards;
  }
  .bg-grid-animate {
    animation: gridMove 30s linear infinite;
  }
}

/* Stagger helpers */
.fx-delay-100 {
  animation-delay: 100ms;
}
.fx-delay-200 {
  animation-delay: 200ms;
}
.fx-delay-300 {
  animation-delay: 300ms;
}
.fx-delay-400 {
  animation-delay: 400ms;
}
.fx-delay-500 {
  animation-delay: 500ms;
}
.fx-delay-600 {
  animation-delay: 600ms;
}

/* Scroll reveal: only hide by default when JS is enabled and user allows motion */
@media (prefers-reduced-motion: no-preference) {
  .js .reveal {
    opacity: 0;
    transform: translateY(14px);
  }
}