Refactor carousel

This PR refactors the carousel to un-nest CSS selectors, simplify overall styling, and improve documentation of key features. More specifically:

• New visuals for a simpler design. I've removed the gradients on the controls, changed the indicators from circles to squares (with larger tap areas), and added new icons.

• Un-nest CSS. Instead of .carousel > .item and the like, we have .carousel-* prefixed on all classes (save for the .active state). This includes the slides, controls, and indicators. Fixes #18396 (closed).

• Simply CSS for sliding effects. We added transforms later in v3's lifecycle, so we had to support transitions for position and transform. No more; now we just have 3D transforms, so our compiled CSS is much simpler.

• More reliance on utilities. Image styles for within carousel items have been removed, so now you'll need to use utilities or custom styles (e.g., .d-block and .img-fluid). Similarly, I've included an example of responsive captions in our docs built with utilities.

• Improved documentation. The original example is now split across a handful of examples, each building on the previous (from slides only, to controls, to indicators, to captions). Rewrites some of the intro docs and also provides better guidance on responsive captions and more.

• Tweak JS to better handle directional states. This pulls in the JS changes from #18830 to accomplish that.

• Fixes #17878 (closed), correcting the Carousel example.

• Update migration docs to mention changes.