@keyframes pulseGlow {
  0%, 100% {
    box-shadow: 0 0 0 rgba(227, 30, 36, 0);
  }
  50% {
    box-shadow: 0 0 24px rgba(227, 30, 36, 0.35);
  }
}

@keyframes floatPanel {
  0%, 100% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-8px);
  }
}

@keyframes preloaderFlash {
  0% {
    opacity: 0.3;
    letter-spacing: 0.12em;
  }
  50% {
    opacity: 1;
    letter-spacing: 0.18em;
  }
  100% {
    opacity: 0.3;
    letter-spacing: 0.12em;
  }
}

@keyframes scanLine {
  0% {
    transform: translateX(-45%);
  }
  100% {
    transform: translateX(160%);
  }
}

@keyframes waveStroke {
  0% {
    stroke-dashoffset: 420;
  }
  100% {
    stroke-dashoffset: 0;
  }
}

@keyframes fadeInUp {
  from {
    opacity: 0;
    transform: translate3d(0, 26px, 0);
  }
  to {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
}

@keyframes fadeInLeft {
  from {
    opacity: 0;
    transform: translate3d(30px, 0, 0);
  }
  to {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
}

@keyframes fadeInRight {
  from {
    opacity: 0;
    transform: translate3d(-30px, 0, 0);
  }
  to {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
}

@keyframes arrowBounce {
  0%, 100% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-5px);
  }
}

@keyframes serviceCardActivate {
  0% {
    transform: translateY(0) scale(1);
  }
  35% {
    transform: translateY(-3px) scale(0.985);
  }
  70% {
    transform: translateY(-11px) scale(1.015);
  }
  100% {
    transform: translateY(-8px) scale(1);
  }
}

@keyframes serviceIconActivate {
  0% {
    transform: scale(1) rotate(0deg);
  }
  45% {
    transform: scale(0.92) rotate(-6deg);
  }
  100% {
    transform: scale(1.08) rotate(0deg);
  }
}

@keyframes configuratorReveal {
  0% {
    opacity: 0;
    transform: translate3d(0, 26px, 0) scale(0.965);
    box-shadow: 0 16px 42px rgba(0, 0, 0, 0.28);
  }
  55% {
    opacity: 1;
    transform: translate3d(0, -6px, 0) scale(1.01);
    box-shadow: 0 30px 80px rgba(0, 0, 0, 0.38), 0 0 34px rgba(227, 30, 36, 0.18);
  }
  100% {
    opacity: 1;
    transform: translate3d(0, 0, 0) scale(1);
    box-shadow: 0 28px 70px rgba(0, 0, 0, 0.35), 0 0 24px rgba(227, 30, 36, 0.14);
  }
}

@keyframes configuratorChildReveal {
  0% {
    opacity: 0;
    transform: translate3d(0, 18px, 0);
  }
  100% {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
}

@keyframes showcaseFadeOut {
  0% {
    opacity: 1;
    transform: translate3d(0, 0, 0) scale(1);
  }
  100% {
    opacity: 0;
    transform: translate3d(-22px, 0, 0) scale(0.97);
  }
}

@keyframes showcaseFadeIn {
  0% {
    opacity: 0;
    transform: translate3d(26px, 0, 0) scale(0.965);
  }
  100% {
    opacity: 1;
    transform: translate3d(0, 0, 0) scale(1);
  }
}

@keyframes heroGlowPulse {
  0%, 100% {
    opacity: 0.42;
    transform: scale(1);
  }
  50% {
    opacity: 0.72;
    transform: scale(1.06);
  }
}

@keyframes heroRingRotate {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}

@keyframes heroTrackDrift {
  0%, 100% {
    transform: translateX(-2%);
    opacity: 0.32;
  }
  50% {
    transform: translateX(2%);
    opacity: 0.62;
  }
}

@keyframes heroPanelSheen {
  0% {
    transform: translateX(-130%);
    opacity: 0;
  }
  25% {
    opacity: 0.45;
  }
  100% {
    transform: translateX(140%);
    opacity: 0;
  }
}

.preloader__logo {
  animation: preloaderFlash 1.5s ease-in-out infinite;
}

.button--primary:hover,
.button--primary:focus-visible,
.nav-cta:hover,
.nav-cta:focus-visible {
  animation: pulseGlow 1.4s ease-in-out infinite;
}

.hero__panel,
.progress-card,
.diagnostic-panel {
  animation: floatPanel 6s ease-in-out infinite;
}

.hero__backdrop img {
  animation: floatPanel 10s ease-in-out infinite;
}

.screen-line {
  animation: scanLine 3.6s linear infinite;
}

.hero-wave path {
  stroke-dasharray: 420;
  animation: waveStroke 2.4s ease forwards;
}

.reveal {
  opacity: 0;
  will-change: transform, opacity;
}

.reveal.is-visible {
  opacity: 1;
}

.reveal[data-animate="slide-up"].is-visible {
  animation: fadeInUp 700ms cubic-bezier(0.2, 0.8, 0.2, 1) forwards;
}

.reveal[data-animate="slide-left"].is-visible {
  animation: fadeInLeft 700ms cubic-bezier(0.2, 0.8, 0.2, 1) forwards;
}

.reveal[data-animate="slide-right"].is-visible {
  animation: fadeInRight 700ms cubic-bezier(0.2, 0.8, 0.2, 1) forwards;
}

.reveal[data-animate="fade-in"].is-visible {
  animation: fadeInUp 520ms ease forwards;
}

.back-to-top.is-visible {
  animation: arrowBounce 1.8s ease-in-out infinite;
}

.service-card.is-activating {
  animation: serviceCardActivate 260ms cubic-bezier(0.2, 0.8, 0.2, 1) forwards;
}

.service-card.is-activating .service-card__icon {
  animation: serviceIconActivate 260ms cubic-bezier(0.2, 0.8, 0.2, 1) forwards;
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }

  .reveal,
  .reveal.is-visible {
    opacity: 1;
    transform: none;
    animation: none;
  }
}