/* ============================================
   ANIMATIONS - Scroll-triggered & transitions
   ============================================ */

/* --- Fade Up (scroll reveal) --- */
.fade-up {
  opacity: 0;
  transform: translateY(30px);
  transition: opacity 0.8s cubic-bezier(0.16, 1, 0.3, 1),
              transform 0.8s cubic-bezier(0.16, 1, 0.3, 1);
}

.fade-up.visible {
  opacity: 1;
  transform: translateY(0);
}

.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.55s; }
.delay-6 { transition-delay: 0.7s; }

/* --- Stat Counter Animation --- */
@keyframes countUp {
  from { opacity: 0; transform: translateY(10px); }
  to { opacity: 1; transform: translateY(0); }
}

/* --- Nav scroll effect --- */
.nav {
  transition: background 0.3s ease, box-shadow 0.3s ease;
}

/* --- Card hover lift --- */
.audience-card,
.division-card,
.service-item,
.diff-item,
.for-item,
.pillar-card,
.program-card,
.blog-card,
.client-card {
  transition: transform 0.4s cubic-bezier(0.16, 1, 0.3, 1),
              box-shadow 0.4s cubic-bezier(0.16, 1, 0.3, 1),
              border-color 0.3s ease;
}

/* --- Button hover --- */
.btn {
  transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1);
}

.btn:active {
  transform: scale(0.98);
}

/* --- Platform logo hover --- */
.platform-logo {
  transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1);
}

.platform-logo:hover {
  transform: translateY(-4px);
  border-color: var(--accent-warm);
  color: var(--dark);
  box-shadow: 0 8px 24px rgba(200, 160, 74, 0.12);
}

/* --- Smooth page load --- */
@keyframes pageLoad {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

body {
  animation: pageLoad 0.6s ease;
}

/* --- Hero image float --- */
@keyframes heroFloat {
  0%, 100% { transform: translateY(0px); }
  50% { transform: translateY(-18px); }
}

/* --- Hero glow pulse --- */
@keyframes glowPulse {
  0%, 100% { opacity: 0.4; transform: scale(0.88); }
  50% { opacity: 1; transform: scale(1.12); }
}

/* --- Logo ring expand pulse --- */
@keyframes ringExpand {
  0% { transform: scale(0.85); opacity: 0.55; }
  100% { transform: scale(1.65); opacity: 0; }
}

/* --- Scale in (for cards/badges) --- */
.scale-in {
  opacity: 0;
  transform: scale(0.94);
  transition: opacity 0.7s cubic-bezier(0.16, 1, 0.3, 1),
              transform 0.7s cubic-bezier(0.16, 1, 0.3, 1);
}

.scale-in.visible {
  opacity: 1;
  transform: scale(1);
}

/* --- Fade from left --- */
.fade-left {
  opacity: 0;
  transform: translateX(-32px);
  transition: opacity 0.8s cubic-bezier(0.16, 1, 0.3, 1),
              transform 0.8s cubic-bezier(0.16, 1, 0.3, 1);
}

.fade-left.visible {
  opacity: 1;
  transform: translateX(0);
}

/* --- Fade from right --- */
.fade-right {
  opacity: 0;
  transform: translateX(32px);
  transition: opacity 0.8s cubic-bezier(0.16, 1, 0.3, 1),
              transform 0.8s cubic-bezier(0.16, 1, 0.3, 1);
}

.fade-right.visible {
  opacity: 1;
  transform: translateX(0);
}

/* --- Mobile menu transitions --- */
.mobile-menu-links a {
  opacity: 0;
  transform: translateY(20px);
}

.mobile-menu.active .mobile-menu-links a {
  opacity: 1;
  transform: translateY(0);
  transition: opacity 0.4s ease, transform 0.4s ease;
}

.mobile-menu.active .mobile-menu-links li:nth-child(1) a { transition-delay: 0.05s; }
.mobile-menu.active .mobile-menu-links li:nth-child(2) a { transition-delay: 0.10s; }
.mobile-menu.active .mobile-menu-links li:nth-child(3) a { transition-delay: 0.15s; }
.mobile-menu.active .mobile-menu-links li:nth-child(4) a { transition-delay: 0.20s; }
.mobile-menu.active .mobile-menu-links li:nth-child(5) a { transition-delay: 0.25s; }
.mobile-menu.active .mobile-menu-links li:nth-child(6) a { transition-delay: 0.30s; }
.mobile-menu.active .mobile-menu-links li:nth-child(7) a { transition-delay: 0.35s; }
.mobile-menu.active .mobile-menu-links li:nth-child(8) a { transition-delay: 0.40s; }
.mobile-menu.active .mobile-menu-links li:nth-child(9) a { transition-delay: 0.45s; }
.mobile-menu.active .mobile-menu-links li:nth-child(10) a { transition-delay: 0.50s; }
.mobile-menu.active .mobile-menu-links li:nth-child(11) a { transition-delay: 0.55s; }

/* --- Highlight cards stagger --- */
.highlight {
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.highlight:hover {
  transform: translateY(-2px);
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.04);
}

/* --- Smooth scrollbar (webkit) --- */
::-webkit-scrollbar {
  width: 8px;
}

::-webkit-scrollbar-track {
  background: var(--off-white);
}

::-webkit-scrollbar-thumb {
  background: var(--mid-gray);
  border-radius: 4px;
}

::-webkit-scrollbar-thumb:hover {
  background: var(--text-gray);
}