/* ============================================
   SCROLL REVEAL SYSTEM
   ============================================ */

.reveal-up,
.reveal-left,
.reveal-right {
  opacity: 0;
  transition:
    opacity 0.7s var(--ease-out),
    transform 0.7s var(--ease-out);
}

.reveal-up {
  transform: translateY(40px);
}
.reveal-left {
  transform: translateX(-50px);
}
.reveal-right {
  transform: translateX(50px);
}

.reveal-up.visible,
.reveal-left.visible,
.reveal-right.visible {
  opacity: 1;
  transform: translate(0);
}

/* Delay utilities */
.delay-1 {
  transition-delay: 0.1s;
}
.delay-2 {
  transition-delay: 0.2s;
}
.delay-3 {
  transition-delay: 0.3s;
}
.delay-4 {
  transition-delay: 0.4s;
}
.delay-5 {
  transition-delay: 0.5s;
}
.delay-6 {
  transition-delay: 0.6s;
}
.delay-7 {
  transition-delay: 0.7s;
}
.delay-8 {
  transition-delay: 0.8s;
}
.delay-9 {
  transition-delay: 0.9s;
}

/* Split text animation */
.split-char {
  display: inline-block;
  opacity: 0;
  transform: translateY(20px);
  transition: opacity 0.4s var(--ease-out), transform 0.4s var(--ease-out);
}

.split-char.visible {
  opacity: 1;
  transform: translateY(0);
}

/* ============================================
   SHARED KEYFRAMES
   ============================================ */

@keyframes fadeInUp {
  from {
    opacity: 0;
    transform: translateY(20px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

@keyframes scaleIn {
  from {
    opacity: 0;
    transform: scale(0.9);
  }
  to {
    opacity: 1;
    transform: scale(1);
  }
}

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

@keyframes shimmerSweep {
  0% {
    transform: translateX(-100%) skewX(-15deg);
  }
  100% {
    transform: translateX(300%) skewX(-15deg);
  }
}

/* ============================================
   PAGE LOAD SEQUENCE
   Hero elements are pre-visible with animation
   ============================================ */

.hero .reveal-up {
  animation: fadeInUp 0.8s var(--ease-out) both;
  opacity: 1;
  transform: none;
}

.hero .reveal-right {
  animation: slideInRight 0.9s var(--ease-out) both;
  opacity: 1;
  transform: none;
}

/* Hero delay overrides (for page load, not scroll) */
.hero .delay-1 {
  animation-delay: 0.3s;
}
.hero .delay-2 {
  animation-delay: 0.45s;
}
.hero .delay-3 {
  animation-delay: 0.6s;
}
.hero .delay-4 {
  animation-delay: 0.7s;
}
.hero .delay-5 {
  animation-delay: 0.8s;
}
.hero .delay-6 {
  animation-delay: 0.9s;
}
.hero .delay-7 {
  animation-delay: 1s;
}
.hero .delay-8 {
  animation-delay: 1.15s;
}
.hero .delay-9 {
  animation-delay: 1.3s;
}