Slow down spinners when prefers-reduced-motion: reduce

site/content/docs/5.0/components/spinners.md

@@ -12,6 +12,10 @@ Bootstrap "spinners" can be used to show the loading state in your projects. The
 
 For accessibility purposes, each loader here includes `role="status"` and a nested `<span class="visually-hidden">Loading...</span>`.
 
+{{% callout info %}}
+{{< partial "callout-info-prefersreducedmotion.md" >}}
+{{% /callout %}}
+
 ## Border spinner
 
 Use the border spinners for a lightweight loading indicator.

site/content/docs/5.0/getting-started/accessibility.md

@@ -45,7 +45,7 @@ For visually hidden interactive controls, such as traditional "skip" links, use
 
 ### Reduced motion
 
-Bootstrap includes support for the [`prefers-reduced-motion` media feature](https://drafts.csswg.org/mediaqueries-5/#prefers-reduced-motion). In browsers/environments that allow the user to specify their preference for reduced motion, most CSS transition effects in Bootstrap (for instance, when a modal dialog is opened or closed, or the sliding animation in carousels) will be disabled.
+Bootstrap includes support for the [`prefers-reduced-motion` media feature](https://drafts.csswg.org/mediaqueries-5/#prefers-reduced-motion). In browsers/environments that allow the user to specify their preference for reduced motion, most CSS transition effects in Bootstrap (for instance, when a modal dialog is opened or closed, or the sliding animation in carousels) will be disabled—or slowed down when animation is meaningful, such as in spinners.
 
 ## Additional resources