/* ==========================================================================
   TEJAJ — animation.css
   Scroll-reveal, entrance, and micro-interaction animations
   ========================================================================== */

/* Scroll reveal base state (JS toggles .is-visible via IntersectionObserver) */
[data-animate] {
  opacity: 0;
  transform: translateY(28px);
  transition: opacity 0.7s var(--tj-ease), transform 0.7s var(--tj-ease);
  will-change: opacity, transform;
}
[data-animate].is-visible { opacity: 1; transform: translateY(0); }

[data-animate="fade"] { transform: none; }
[data-animate="slide-up"] { transform: translateY(40px); }
[data-animate="slide-left"] { transform: translateX(-40px); }
[data-animate="slide-right"] { transform: translateX(40px); }
[data-animate="zoom"] { transform: scale(0.92); }
[data-animate="zoom"].is-visible { transform: scale(1); }

/* Stagger helper: apply via inline style="--d: Nms" or data-delay attribute (set by JS) */
[data-animate] { transition-delay: var(--d, 0ms); }

/* Hero entrance */
@keyframes tj-fade-in-up {
  from { opacity: 0; transform: translateY(24px); }
  to { opacity: 1; transform: translateY(0); }
}
.hero-eyebrow { animation: tj-fade-in-up 0.7s var(--tj-ease) 0.1s both; }
.hero h1 { animation: tj-fade-in-up 0.8s var(--tj-ease) 0.25s both; }
.hero p.lead { animation: tj-fade-in-up 0.8s var(--tj-ease) 0.4s both; }
.hero-actions { animation: tj-fade-in-up 0.8s var(--tj-ease) 0.55s both; }

/* Sticky header shadow transition already handled in style.css; add subtle slide */
@keyframes tj-header-drop {
  from { transform: translateY(-12px); opacity: 0.6; }
  to { transform: translateY(0); opacity: 1; }
}
.site-header { animation: tj-header-drop 0.5s var(--tj-ease); }

/* Card hover lift already in style.css transitions; add icon float */
.value-card:hover .icon-wrap,
.contact-info-card:hover .icon-wrap {
  animation: tj-icon-float 1.4s ease-in-out infinite;
}
@keyframes tj-icon-float {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-4px); }
}

/* Back to top pulse on appear */
.back-to-top.is-visible { animation: tj-fade-in-up 0.4s var(--tj-ease); }

/* Mobile nav collapse animation (Bootstrap collapse handles height; add fade) */
.navbar-collapse.collapsing,
.navbar-collapse.show { transition: height 0.35s var(--tj-ease), opacity 0.35s var(--tj-ease); }

/* Counter number pop when finished (class added by JS) */
.stat-number.tj-counted { animation: tj-pop 0.4s var(--tj-ease); }
@keyframes tj-pop {
  0% { transform: scale(1); }
  50% { transform: scale(1.08); }
  100% { transform: scale(1); }
}

/* Marquee-style logo/testimonial hint (unused unless applied) */
.tj-hover-underline { position: relative; }
.tj-hover-underline::after {
  content: "";
  position: absolute;
  left: 0; bottom: -3px;
  width: 0; height: 2px;
  background: var(--tj-gold);
  transition: width var(--tj-speed) var(--tj-ease);
}
.tj-hover-underline:hover::after { width: 100%; }