/* Start states for animations. Only under html.motion (JavaScript on, motion not reduced),
   so content is always visible without JavaScript or with "reduce motion". motion.js animates
   these elements to their normal state. */
.motion [data-hero] { opacity: 0; transform: translateY(16px); }
.motion [data-reveal] { opacity: 0; transform: translateY(22px); }

/* topic band on the home page: the track holds the items twice, so -50% loops seamlessly */
.motion .band__track { animation: band-run 40s linear infinite; }
@keyframes band-run { to { transform: translateX(-50%); } }