/* ============================================
   ONE Agency — Animation Styles
   GSAP ScrollTrigger & Lenis Support
   ============================================ */

/* --- Reveal Animations (GSAP controlled) --- */
.reveal {
  opacity: 0;
  transform: translateY(60px);
  will-change: transform, opacity;
}

.reveal--left {
  opacity: 0;
  transform: translateX(-60px);
  will-change: transform, opacity;
}

.reveal--right {
  opacity: 0;
  transform: translateX(60px);
  will-change: transform, opacity;
}

.reveal--scale {
  opacity: 0;
  transform: scale(0.9);
  will-change: transform, opacity;
}

/* --- Hero Line Animation --- */
.hero__headline .line {
  overflow: hidden;
}

.hero__headline .line-inner {
  transform: translateY(110%);
  will-change: transform;
}

/* --- Parallax containers --- */
.parallax-img {
  will-change: transform;
}

/* --- Counter Animation --- */
.counter {
  font-variant-numeric: tabular-nums;
}

/* --- Stagger children --- */
.stagger-children > * {
  opacity: 0;
  transform: translateY(30px);
  will-change: transform, opacity;
}

/* --- Image reveal clip --- */
.img-reveal {
  clip-path: inset(100% 0 0 0);
  will-change: clip-path;
}

.img-reveal.revealed {
  clip-path: inset(0 0 0 0);
}

/* --- Magnetic hover (for buttons) --- */
.magnetic {
  will-change: transform;
  transition: transform 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

/* --- Split text chars --- */
.split-char {
  display: inline-block;
  will-change: transform, opacity;
}

/* --- Smooth transitions for page elements --- */
.transition-element {
  transition: all 0.6s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

/* --- Loading states --- */
.is-loading * {
  animation-play-state: paused !important;
}

/* --- Reduced motion preference --- */
@media (prefers-reduced-motion: reduce) {
  .reveal,
  .reveal--left,
  .reveal--right,
  .reveal--scale {
    opacity: 1;
    transform: none;
  }

  .hero__headline .line-inner {
    transform: none;
  }

  .stagger-children > * {
    opacity: 1;
    transform: none;
  }

  .img-reveal {
    clip-path: none;
  }

  .clients__track {
    animation: none;
  }

  .hero__scroll-line {
    animation: none;
  }
}