﻿/* ============================================================
   NexaCore Technologies â€” Animations
   css/animations.css
   ============================================================ */

/* ---- Keyframes ---- */
@keyframes spinRing {
  to { transform: rotate(360deg); }
}

@keyframes floatParticle {
  0%, 100% { transform: translate(0,0) scale(1); }
  33%       { transform: translate(30px,-20px) scale(1.1); }
  66%       { transform: translate(-20px,15px) scale(0.95); }
}

@keyframes rotateSlow {
  from { transform: rotate(0deg); }
  to   { transform: rotate(360deg); }
}

@keyframes rippleEffect {
  to { transform: scale(4); opacity: 0; }
}

@keyframes scrollLogos {
  from { transform: translateX(0); }
  to   { transform: translateX(-50%); }
}

@keyframes pulseGlow {
  0%, 100% { box-shadow: 0 0 0 0 rgba(0,82,204,0.4); }
  50%       { box-shadow: 0 0 0 12px rgba(0,82,204,0); }
}

@keyframes shimmer {
  0%   { background-position: -200% center; }
  100% { background-position:  200% center; }
}

@keyframes fadeInDown {
  from { opacity:0; transform:translateY(-20px); }
  to   { opacity:1; transform:translateY(0); }
}

@keyframes fadeInUp {
  from { opacity:0; transform:translateY(30px); }
  to   { opacity:1; transform:translateY(0); }
}

@keyframes fadeInLeft {
  from { opacity:0; transform:translateX(-40px); }
  to   { opacity:1; transform:translateX(0); }
}

@keyframes fadeInRight {
  from { opacity:0; transform:translateX(40px); }
  to   { opacity:1; transform:translateX(0); }
}

@keyframes zoomIn {
  from { opacity:0; transform:scale(0.88); }
  to   { opacity:1; transform:scale(1); }
}

@keyframes countUp {
  from { opacity:0; transform:translateY(10px); }
  to   { opacity:1; transform:translateY(0); }
}

/* ---- SVG hero animation ---- */
@keyframes svgFloat {
  0%, 100% { transform: translateY(0); }
  50%       { transform: translateY(-12px); }
}
.hero-svg-wrap svg { animation: svgFloat 5s ease-in-out infinite; }

/* ---- Scroll-reveal base states ---- */
.reveal,
.reveal-left,
.reveal-right,
.reveal-zoom {
  opacity: 0;
  transition: opacity 0.7s cubic-bezier(0.4,0,0.2,1),
              transform 0.7s cubic-bezier(0.4,0,0.2,1);
}

.reveal       { transform: translateY(28px); }
.reveal-left  { transform: translateX(-40px); }
.reveal-right { transform: translateX(40px); }
.reveal-zoom  { transform: scale(0.9); }

/* Active / visible state */
.reveal.active,
.reveal-left.active,
.reveal-right.active,
.reveal-zoom.active {
  opacity:1 !important;
  transform: translate(0) scale(1) !important;
}

/* Stagger delays */
.reveal-d1 { transition-delay: 0.05s; }
.reveal-d2 { transition-delay: 0.12s; }
.reveal-d3 { transition-delay: 0.19s; }
.reveal-d4 { transition-delay: 0.26s; }
.reveal-d5 { transition-delay: 0.33s; }
.reveal-d6 { transition-delay: 0.40s; }
.reveal-d7 { transition-delay: 0.47s; }

/* ---- Hero entrance animations ---- */
.hero-anim-badge {
  animation: fadeInDown 0.7s cubic-bezier(0.4,0,0.2,1) 0.2s both;
}
.hero-anim-title {
  animation: fadeInUp 0.8s cubic-bezier(0.4,0,0.2,1) 0.4s both;
}
.hero-anim-text {
  animation: fadeInUp 0.8s cubic-bezier(0.4,0,0.2,1) 0.6s both;
}
.hero-anim-btns {
  animation: fadeInUp 0.8s cubic-bezier(0.4,0,0.2,1) 0.75s both;
}
.hero-anim-tags {
  animation: fadeInUp 0.8s cubic-bezier(0.4,0,0.2,1) 0.9s both;
}
.hero-anim-img {
  animation: zoomIn 1s cubic-bezier(0.4,0,0.2,1) 0.3s both;
}

/* ---- Full-page section transition ---- */
/* Sections enter from bottom (going forward) */
.fp-section.entering-from-bottom { animation: sectionEnterUp 0.75s cubic-bezier(0.77,0,0.18,1) both; }
.fp-section.entering-from-top    { animation: sectionEnterDown 0.75s cubic-bezier(0.77,0,0.18,1) both; }

@keyframes sectionEnterUp {
  from { transform: translateY(60px); opacity:0; }
  to   { transform: translateY(0);    opacity:1; }
}
@keyframes sectionEnterDown {
  from { transform: translateY(-60px); opacity:0; }
  to   { transform: translateY(0);     opacity:1; }
}

/* ---- Image zoom on hover ---- */
.img-zoom { overflow: hidden; border-radius: var(--border-radius); }
.img-zoom img { transition: transform 0.5s ease; }
.img-zoom:hover img { transform: scale(1.06); }

/* ---- Shimmer loading skeleton ---- */
.shimmer {
  background: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 37%, #f0f0f0 63%);
  background-size: 400% 100%;
  animation: shimmer 1.4s ease infinite;
}

/* ---- Pulse glow on CTA buttons ---- */
.btn-primary-custom { animation: pulseGlow 3s ease infinite; }
.btn-primary-custom:hover { animation: none; }

/* ---- Number counter entrance ---- */
.stat-box.active .counter { animation: countUp 0.5s ease both; }

/* ---- Floating dots decoration ---- */
.floating-dots {
  position: absolute; pointer-events: none;
  width: 200px; height: 200px;
  background-image: radial-gradient(circle, rgba(0,82,204,0.18) 1.5px, transparent 1.5px);
  background-size: 18px 18px;
}

