/**
 * Animations — DR Digital Solution
 * AOS overrides, custom keyframe animations, and entrance effects.
 */

/* ─── Custom AOS Variants ────────────────────────────────────────────────── */
[data-aos="fade-up-custom"] {
  transform: translate3d(0, 30px, 0);
  opacity: 0;
  transition-property: transform, opacity;
}
[data-aos="fade-up-custom"].aos-animate {
  transform: translate3d(0, 0, 0);
  opacity: 1;
}

[data-aos="scale-in"] {
  transform: scale(0.92);
  opacity: 0;
  transition-property: transform, opacity;
}
[data-aos="scale-in"].aos-animate {
  transform: scale(1);
  opacity: 1;
}

[data-aos="slide-right"] {
  transform: translate3d(-40px, 0, 0);
  opacity: 0;
  transition-property: transform, opacity;
}
[data-aos="slide-right"].aos-animate {
  transform: translate3d(0, 0, 0);
  opacity: 1;
}

[data-aos="slide-left"] {
  transform: translate3d(40px, 0, 0);
  opacity: 0;
  transition-property: transform, opacity;
}
[data-aos="slide-left"].aos-animate {
  transform: translate3d(0, 0, 0);
  opacity: 1;
}

/* ─── Global Keyframes ───────────────────────────────────────────────────── */
@keyframes fadeInUp {
  from { opacity: 0; transform: translateY(30px); }
  to   { opacity: 1; transform: translateY(0); }
}
@keyframes fadeIn {
  from { opacity: 0; }
  to   { opacity: 1; }
}
@keyframes slideInLeft {
  from { opacity: 0; transform: translateX(-40px); }
  to   { opacity: 1; transform: translateX(0); }
}
@keyframes slideInRight {
  from { opacity: 0; transform: translateX(40px); }
  to   { opacity: 1; transform: translateX(0); }
}
@keyframes scaleIn {
  from { opacity: 0; transform: scale(0.90); }
  to   { opacity: 1; transform: scale(1); }
}
@keyframes floatUpDown {
  0%, 100% { transform: translateY(0); }
  50%       { transform: translateY(-12px); }
}
@keyframes rotateGlow {
  0%   { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}
@keyframes gradientShift {
  0%   { background-position: 0% 50%; }
  50%  { background-position: 100% 50%; }
  100% { background-position: 0% 50%; }
}
@keyframes shimmer {
  0%   { background-position: -200% 0; }
  100% { background-position: 200% 0; }
}
@keyframes countUp {
  from { opacity: 0; transform: translateY(10px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* ─── Hero Entrance (triggered by JS on load) ────────────────────────────── */
.hero-animate-1 { animation: fadeInUp 0.8s ease both; animation-delay: 0.1s; }
.hero-animate-2 { animation: fadeInUp 0.8s ease both; animation-delay: 0.25s; }
.hero-animate-3 { animation: fadeInUp 0.8s ease both; animation-delay: 0.4s; }
.hero-animate-4 { animation: fadeInUp 0.8s ease both; animation-delay: 0.55s; }
.hero-animate-5 { animation: fadeInUp 0.8s ease both; animation-delay: 0.7s; }
.hero-visual-animate { animation: scaleIn 0.9s ease both; animation-delay: 0.3s; }

/* Floating animation for stat chips and hero visual */
.float-anim { animation: floatUpDown 4s ease-in-out infinite; }
.float-anim-delay-1 { animation-delay: 0.5s; }
.float-anim-delay-2 { animation-delay: 1s; }
.float-anim-delay-3 { animation-delay: 1.5s; }

/* ─── Gradient Animated Button Hover ─────────────────────────────────────── */
.btn-animated-gradient {
  background-size: 200% auto;
  background-image: linear-gradient(135deg, #1E5FFF 0%, #7B2FF7 50%, #1E5FFF 100%);
  animation: gradientShift 3s ease infinite;
}

/* ─── Shimmer Loading Skeleton ───────────────────────────────────────────── */
.skeleton {
  background: linear-gradient(90deg, var(--color-border) 25%, var(--color-off-white) 50%, var(--color-border) 75%);
  background-size: 200% 100%;
  animation: shimmer 1.5s infinite;
  border-radius: var(--radius-md);
}
.skeleton-text   { height: 1rem; margin-bottom: 0.5rem; }
.skeleton-title  { height: 1.5rem; width: 60%; margin-bottom: 1rem; }
.skeleton-img    { aspect-ratio: 16/9; width: 100%; }

/* ─── Stagger Animation Delays ───────────────────────────────────────────── */
.stagger-1 [data-aos]:nth-child(1) { transition-delay: 0ms !important; }
.stagger-1 [data-aos]:nth-child(2) { transition-delay: 100ms !important; }
.stagger-1 [data-aos]:nth-child(3) { transition-delay: 200ms !important; }
.stagger-1 [data-aos]:nth-child(4) { transition-delay: 300ms !important; }
.stagger-1 [data-aos]:nth-child(5) { transition-delay: 400ms !important; }
.stagger-1 [data-aos]:nth-child(6) { transition-delay: 500ms !important; }

/* ─── Hover Gradient Underline (nav) ─────────────────────────────────────── */
.gradient-underline {
  background: linear-gradient(to right, transparent 50%, var(--color-blue) 50%);
  background-size: 200% 2px;
  background-repeat: no-repeat;
  background-position: 100% 100%;
  transition: background-position 0.3s ease;
}
.gradient-underline:hover { background-position: 0 100%; }

/* ─── Scroll Reveal (JS-triggered, fallback) ─────────────────────────────── */
.reveal { opacity: 0; transform: translateY(30px); transition: opacity 0.6s ease, transform 0.6s ease; }
.reveal.revealed { opacity: 1; transform: translateY(0); }

/* ─── Spinning Icon Animation ────────────────────────────────────────────── */
.spin-slow { animation: rotateGlow 8s linear infinite; }

/* ─── Card hover glow ────────────────────────────────────────────────────── */
.card-glow:hover {
  box-shadow: 0 0 0 2px rgba(30, 95, 255, 0.15), var(--shadow-xl);
}

/* ─── Blob background shapes ─────────────────────────────────────────────── */
.blob-shape {
  position: absolute;
  border-radius: 50% 40% 60% 30% / 50% 60% 40% 50%;
  filter: blur(60px);
  opacity: 0.08;
  pointer-events: none;
  animation: blobMorph 10s ease-in-out infinite;
}
@keyframes blobMorph {
  0%, 100% { border-radius: 50% 40% 60% 30% / 50% 60% 40% 50%; }
  33%       { border-radius: 60% 50% 40% 70% / 40% 30% 70% 60%; }
  66%       { border-radius: 40% 70% 50% 30% / 60% 40% 60% 50%; }
}

/* ─── Type cursor blink ──────────────────────────────────────────────────── */
.typed-cursor {
  font-weight: var(--fw-regular) !important;
  color: var(--color-purple) !important;
  animation: typedCursorBlink 0.75s ease-in-out infinite;
}
@keyframes typedCursorBlink {
  0%, 100% { opacity: 1; }
  50%       { opacity: 0; }
}

/* ─── Counter animation class ────────────────────────────────────────────── */
.counter-animated { animation: countUp 0.5s ease both; }