:root {
  --motion-bg: #061C1A;
  --motion-bg-2: #0B2C29;
  --motion-deep: #083F3B;
  --motion-teal: #229C90;
  --motion-teal-light: #7DD8CF;
  --motion-white: #F7FFFE;
  --motion-gold: #FFB52E;
  --motion-gold-2: #FFC809;

  --motion-micro: 180ms;
  --motion-fast: 240ms;
  --motion-standard: 360ms;
  --motion-section: 520ms;
  --motion-page: 620ms;
  --motion-opener: 3050ms;

  --ease-standard: cubic-bezier(0.22, 1, 0.36, 1);
  --ease-premium: cubic-bezier(0.65, 0, 0.35, 1);
  --ease-enter: cubic-bezier(0.22, 1, 0.36, 1);
  --ease-exit: cubic-bezier(0.4, 0, 1, 1);
}

body.intro-active {
  overflow: hidden;
}

@media (prefers-reduced-motion: reduce) {
  :root {
    --motion-micro: 1ms;
    --motion-fast: 1ms;
    --motion-standard: 120ms;
    --motion-section: 160ms;
    --motion-page: 200ms;
  }
}