:root {
  --font-sans: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
}

body {
  font-family: var(--font-sans);
}

@media (prefers-reduced-motion: no-preference) {
  .animate-on-scroll.fade-in.is-visible {
    animation: fadeIn 0.8s ease-out forwards;
  }

  .animate-on-scroll.slide-in.is-visible {
    animation: slideIn 0.8s ease-out forwards;
  }
}

@keyframes fadeIn {
  from { opacity: 0; }
  to { opacity: 1; }
}

@keyframes slideIn {
  from { opacity: 0; transform: translateY(2rem); }
  to { opacity: 1; transform: translateY(0); }
}