/* ==========================================================================
   THE ANTOBEL JOURNEY — ANIMATIONS
   ========================================================================== */

/* ---------- Reveal on scroll ---------- */
.reveal {
  opacity: 0;
  transform: translateY(28px);
  transition: opacity 0.8s cubic-bezier(0.16, 1, 0.3, 1), transform 0.8s cubic-bezier(0.16, 1, 0.3, 1);
}

.reveal.is-visible {
  opacity: 1;
  transform: translateY(0);
}

.about__stats .stat-card.reveal:nth-child(1) { transition-delay: 0.05s; }
.about__stats .stat-card.reveal:nth-child(2) { transition-delay: 0.15s; }
.about__stats .stat-card.reveal:nth-child(3) { transition-delay: 0.25s; }
.about__stats .stat-card.reveal:nth-child(4) { transition-delay: 0.35s; }

.business-grid .business-card.reveal:nth-child(1) { transition-delay: 0.05s; }
.business-grid .business-card.reveal:nth-child(2) { transition-delay: 0.15s; }
.business-grid .business-card.reveal:nth-child(3) { transition-delay: 0.25s; }
.business-grid .business-card.reveal:nth-child(4) { transition-delay: 0.35s; }
.business-grid .business-card.reveal:nth-child(5) { transition-delay: 0.45s; }

.stats-grid .stat-block.reveal:nth-child(1) { transition-delay: 0.05s; }
.stats-grid .stat-block.reveal:nth-child(2) { transition-delay: 0.15s; }
.stats-grid .stat-block.reveal:nth-child(3) { transition-delay: 0.25s; }
.stats-grid .stat-block.reveal:nth-child(4) { transition-delay: 0.35s; }

/* ---------- Hero entrance ---------- */
@keyframes heroFadeUp {
  from { opacity: 0; transform: translateY(24px); }
  to { opacity: 1; transform: translateY(0); }
}

.hero__content .reveal {
  animation: heroFadeUp 1s cubic-bezier(0.16, 1, 0.3, 1) both;
}

.hero__content .eyebrow.reveal { animation-delay: 0.1s; }
.hero__title.reveal { animation-delay: 0.25s; }
.hero__subtitle.reveal { animation-delay: 0.4s; }
.hero__intro.reveal { animation-delay: 0.55s; }
.hero__actions.reveal { animation-delay: 0.7s; }

/* Override default reveal opacity/transform since hero uses keyframe animation */
.hero__content .reveal { opacity: 0; }

/* ---------- Floating shapes ---------- */
@keyframes floatY {
  0%, 100% { transform: translateY(0) translateX(0); }
  50% { transform: translateY(-22px) translateX(10px); }
}

.hero__shape--1 { animation: floatY 9s ease-in-out infinite; }
.hero__shape--2 { animation: floatY 11s ease-in-out infinite reverse; }
.hero__shape--3 { animation: floatY 7s ease-in-out infinite; }

/* ---------- Mouse scroll indicator ---------- */
@keyframes scrollWheel {
  0% { transform: translateY(0); opacity: 1; }
  70% { opacity: 0; }
  100% { transform: translateY(14px); opacity: 0; }
}

.hero__mouse-wheel { animation: scrollWheel 1.8s ease-in-out infinite; }

/* ---------- Loader ---------- */
@keyframes loaderSpin {
  to { transform: rotate(270deg); }
}

/* ---------- Philosophy shape drift ---------- */
@keyframes driftShape {
  0%, 100% { transform: translate(0, 0) scale(1); }
  50% { transform: translate(-30px, 20px) scale(1.05); }
}

.philosophy__shape { animation: driftShape 14s ease-in-out infinite; }

/* ---------- Ecosystem connectors ---------- */
@keyframes dashFlow {
  to { stroke-dashoffset: -100; }
}

.eco-connector { animation: dashFlow 3.5s linear infinite; }

/* ---------- Card hover lift already in style.css transitions ---------- */

/* ---------- Back to top visibility ---------- */
.back-to-top {
  opacity: 0.7;
}

.back-to-top:hover { opacity: 1; }