@keyframes hero-scale-in {
  from {
    opacity: 0;
    transform: scale(0.95);
  }

  to {
    opacity: 1;
    transform: scale(1);
  }
}

@keyframes hero-chat-rise {
  from {
    opacity: 0;
    transform: translateY(50px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes hero-message-in {
  from {
    opacity: 0;
    transform: translateX(-10px);
  }

  to {
    opacity: 1;
    transform: translateX(0);
  }
}

@keyframes call-connected-float {
  0%,
  100% {
    transform: translateY(0);
  }

  50% {
    transform: translateY(-10px);
  }
}

@keyframes voice-bar-wave {
  0%,
  100% {
    height: 30%;
  }

  50% {
    height: 100%;
  }
}

.hero-scale-in {
  animation: hero-scale-in 1s ease-out 0.2s both;
}

.hero-chat-rise {
  animation: hero-chat-rise 0.8s ease-out 0.6s both;
}

.hero-message-in {
  opacity: 0;
  animation: hero-message-in 0.5s ease-out forwards;
}

.hero-message-in-1 {
  animation-delay: 1s;
}

.hero-message-in-2 {
  animation-delay: 1.5s;
}

.call-connected-float {
  animation: call-connected-float 4s ease-in-out infinite;
}

.voice-bar-wave {
  height: 30%;
  animation-name: voice-bar-wave;
  animation-timing-function: ease-in-out;
  animation-iteration-count: infinite;
}

.icon-4 svg {
  width: 1rem;
  height: 1rem;
}

.icon-5 svg {
  width: 1.25rem;
  height: 1.25rem;
}
@keyframes scroll {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(-50%);
  }
}
.animate-scroll {
  display: flex;
  width: max-content;
  animation: scroll 40s linear infinite;
}
.animate-scroll:hover {
  animation-play-state: paused;
}
.animate-scroll-reverse {
  display: flex;
  width: max-content;
  animation: scroll 45s linear infinite reverse;
}
.animate-scroll-reverse:hover {
  animation-play-state: paused;
}

@keyframes ai-hero-visual-in {
  from {
    opacity: 0;
    transform: scale(0.9) rotateY(-15deg);
  }

  to {
    opacity: 1;
    transform: scale(1) rotateY(0deg);
  }
}

@keyframes ai-ring-spin {
  to {
    transform: rotate(360deg);
  }
}

@keyframes ai-ring-spin-reverse {
  to {
    transform: rotate(-360deg);
  }
}

@keyframes ai-brain-pop {
  0% {
    opacity: 0;
    transform: scale(0);
  }

  70% {
    transform: scale(1.08);
  }

  100% {
    opacity: 1;
    transform: scale(1);
  }
}

@keyframes ai-draw-stroke {
  to {
    stroke-dashoffset: 0;
  }
}

@keyframes ai-node-pulse {
  0%,
  100% {
    opacity: 1;
    transform: scale(1);
  }

  50% {
    opacity: 0.8;
    transform: scale(1.3);
  }
}

@keyframes ai-pulse-border {
  0%,
  100% {
    opacity: 0.5;
    transform: scale(1);
  }

  50% {
    opacity: 0;
    transform: scale(1.1);
  }
}

@keyframes ai-floating-tech-in {
  from {
    opacity: 0;
    transform: scale(0) rotate(-180deg);
  }

  to {
    opacity: 1;
    transform: scale(1) rotate(0deg);
  }
}

@keyframes ai-benefit-card-in {
  from {
    opacity: 0;
    transform: translateY(20px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes ai-heading-rise {
  from {
    opacity: 0;
    transform: translateY(-20px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.ai-hero-visual {
  perspective: 2000px;
  animation: ai-hero-visual-in 1s ease-out both;
}

.ai-grid-pattern {
  background-image:
    linear-gradient(to right, #358c89 1px, transparent 1px),
    linear-gradient(to bottom, #358c89 1px, transparent 1px);
  background-size: 20px 20px;
}

.ai-ring-spin {
  animation: ai-ring-spin 40s linear infinite;
}

.ai-ring-spin-reverse {
  animation: ai-ring-spin-reverse 30s linear infinite;
}

.ai-brain-tile {
  animation: ai-brain-pop 0.8s cubic-bezier(0.34, 1.56, 0.64, 1) 0.25s both;
}

.ai-brain-path {
  stroke-dasharray: 520;
  stroke-dashoffset: 520;
  animation: ai-draw-stroke 2s ease-in-out 0.6s forwards;
}

.ai-neural-line {
  stroke-dasharray: 120;
  stroke-dashoffset: 120;
  animation: ai-draw-stroke 1.5s ease-in-out forwards;
}

.ai-node-pulse {
  opacity: 0;
  transform-box: fill-box;
  transform-origin: center;
  animation: ai-node-pulse 2s ease-in-out infinite;
}

.ai-pulse-border {
  animation: ai-pulse-border 2s ease-in-out infinite;
}

.ai-floating-tech {
  opacity: 1;
  animation: ai-floating-tech-in 0.6s cubic-bezier(0.34, 1.56, 0.64, 1)
    backwards;
}

.ai-floating-tech-icon svg {
  width: 100%;
  height: 100%;
}

.ai-benefit-card {
  animation: ai-benefit-card-in 0.5s ease-out backwards;
}

.ai-benefit-icon svg {
  width: 100%;
  height: 100%;
}

.ai-heading-rise {
  animation: ai-heading-rise 0.5s ease-out backwards;
}

.ai-platform-icon svg {
  width: 100%;
  height: 100%;
}

.ai-agent-chip-icon svg {
  width: 100%;
  height: 100%;
}

.ai-capability-icon svg {
  width: 100%;
  height: 100%;
}

.ai-pillar-icon svg {
  width: 100%;
  height: 100%;
}

.ai-integration-icon svg {
  width: 100%;
  height: 100%;
}

.ai-infrastructure-icon svg {
  width: 100%;
  height: 100%;
}

.ai-security-feature-icon svg {
  width: 100%;
  height: 100%;
}

.ai-up-arrow-bounce {
  animation: ai-up-arrow-bounce 2s ease-in-out infinite;
}

@keyframes ai-up-arrow-bounce {
  0%,
  100% {
    transform: translateY(0);
  }

  50% {
    transform: translateY(-5px);
  }
}
