@keyframes divider-fade {
  0%, 100% {
    opacity: 0.2;
    transform: scaleX(1);
  }
  50% {
    opacity: 1;
    transform: scaleX(1.05);
  }
}

:root {
  --opp-anim-duration: 700;
  --opp-anim-easing: ease-out-cubic;
  --opp-anim-offset: 90;
  --opp-anim-stagger: 120;
}

[data-aos] {
  will-change: auto, opacity;
  transition-duration: calc(var(--opp-anim-duration) * 1ms);
}

.animate-divider-fade {
  animation: divider-fade 2.5s ease-in-out infinite;
  transform-origin: center;
}

html {
  scroll-behavior: smooth;
}

body {
  transition: background-color 0.3s ease, color 0.3s ease;
}

@media (prefers-reduced-motion: reduce) {
  [data-aos] {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
  }

  .animate-divider-fade {
    animation: none !important;
  }
}