/* AroVantage Animations CSS */

/* Fade In Up */
.fade-in-up {
  opacity: 0;
  transform: translateY(30px);
  transition: opacity 0.7s ease, transform 0.7s ease;
}
.fade-in-up.visible {
  opacity: 1;
  transform: translateY(0);
}

/* Delay classes */
.delay-1 { transition-delay: 0.15s; }
.delay-2 { transition-delay: 0.3s; }
.delay-3 { transition-delay: 0.45s; }
.delay-4 { transition-delay: 0.6s; }
.delay-5 { transition-delay: 0.75s; }

/* Slide In Left */
.slide-in-left {
  opacity: 0;
  transform: translateX(-40px);
  transition: opacity 0.7s ease, transform 0.7s ease;
}
.slide-in-left.visible {
  opacity: 1;
  transform: translateX(0);
}

/* Slide In Right */
.slide-in-right {
  opacity: 0;
  transform: translateX(40px);
  transition: opacity 0.7s ease, transform 0.7s ease;
}
.slide-in-right.visible {
  opacity: 1;
  transform: translateX(0);
}

/* Scale In */
.scale-in {
  opacity: 0;
  transform: scale(0.9);
  transition: opacity 0.6s ease, transform 0.6s ease;
}
.scale-in.visible {
  opacity: 1;
  transform: scale(1);
}

/* Navbar scroll behavior */
.navbar {
  transition: background-color 0.3s ease, box-shadow 0.3s ease, padding 0.3s ease;
}
.navbar.scrolled {
  background-color: rgba(0, 30, 60, 0.98) !important;
  box-shadow: 0 2px 30px rgba(0,0,0,0.3);
  padding-top: 8px !important;
  padding-bottom: 8px !important;
}

/* Hover glow on service blocks */
.service-deep-dive,
.audience-card,
.pedigree-card {
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}
.service-deep-dive:hover {
  transform: translateY(-6px);
  box-shadow: 0 20px 60px rgba(0, 168, 181, 0.2);
}
.audience-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 16px 50px rgba(74, 144, 226, 0.25);
}
.pedigree-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 12px 40px rgba(0, 168, 181, 0.2);
}

/* Button pulse animation */
@keyframes pulse-border {
  0% { box-shadow: 0 0 0 0 rgba(0, 168, 181, 0.5); }
  70% { box-shadow: 0 0 0 12px rgba(0, 168, 181, 0); }
  100% { box-shadow: 0 0 0 0 rgba(0, 168, 181, 0); }
}
.btn-primary {
  animation: pulse-border 2.5s ease-out infinite;
}
.btn-primary:hover {
  animation: none;
}

/* Counter number animation */
@keyframes countUp {
  from { opacity: 0; transform: translateY(10px); }
  to { opacity: 1; transform: translateY(0); }
}
.pedigree-number {
  animation: countUp 0.5s ease both;
}

/* Capability wheel segment hover */
.wheel-segment {
  transition: all 0.3s ease;
}
.wheel-segment.active,
.wheel-segment:hover {
  transform: scale(1.05);
  filter: brightness(1.15);
}

/* Tab transition */
.tab-panel {
  transition: opacity 0.3s ease;
}
.tab-panel.hidden {
  opacity: 0;
  pointer-events: none;
}

/* Loading shimmer for dynamic content */
@keyframes shimmer {
  0% { background-position: -1000px 0; }
  100% { background-position: 1000px 0; }
}
.shimmer {
  animation: shimmer 2s infinite linear;
  background: linear-gradient(to right, #f0f4f8 4%, #e0e8ef 25%, #f0f4f8 36%);
  background-size: 1000px 100%;
}

/* Mobile nav slide */
@media (max-width: 768px) {
  .nav-menu {
    transition: transform 0.35s ease, opacity 0.35s ease;
  }
  .nav-menu:not(.open) {
    transform: translateY(-10px);
    opacity: 0;
    pointer-events: none;
  }
  .nav-menu.open {
    transform: translateY(0);
    opacity: 1;
    pointer-events: all;
  }
}