02 让 AI 做出动效，先把名字报对

Add a Stagger entrance to the task list.
Reveal items one by one, in their existing order.
Each item fades in and moves up 12px over 0.3 seconds.
Start each item 0.08 seconds after the previous one. Use ease-out.
Play once when the list first enters the viewport.
Use pure CSS animation with animation-delay. Add no dependencies.
With reduced motion enabled, show all items immediately.

Add a subtle Spring-style response to the save button after a click.
Scale from 0.96 to 1.05, then 0.99, and settle at 1.
Complete the animation in 0.45 seconds. Do not loop.
Use pure CSS keyframes to approximate the spring effect.
Do not install Motion, Framer Motion, or any other dependency.
Keep the button's layout space unchanged.
With reduced motion enabled, keep the button still.

Add a Skeleton loading state to the profile card.
Use gray placeholders for the avatar, title, and two lines of text.
Add a subtle Shimmer that moves from left to right every 1.4 seconds.
Use a transformed gradient overlay, not an animated background position.
Match the final content's dimensions to avoid layout shifts.
Replace the skeleton when data arrives; show an error if loading fails.
Use pure CSS animation. Add no dependencies.
With reduced motion enabled, keep the placeholders static.

Add a Count Up animation to the learner count.
Count from 0 to 1,280 over 1.2 seconds with ease-out.
Display whole numbers with thousands separators and tabular numerals.
Play once when the number first enters the viewport.
Use a small requestAnimationFrame loop. Add no animation library.
Finish at exactly 1,280 and cancel the loop when the component unmounts.
Expose the final number to screen readers without announcing every frame.
With reduced motion enabled, show 1,280 immediately.

Add a Typewriter effect to one short headline.
Reveal one character every 0.08 seconds, then stop.
Keep the full text's space reserved so nearby content does not move.
Allow wrapping on narrow screens. Do not loop or delete the text.
Use native JavaScript. Add no dependencies.
Expose the complete sentence to screen readers as a single text.
With reduced motion enabled, show the complete sentence immediately.

Add a Marquee to the partner logo row.
Move from right to left at a constant speed, with a 12-second cycle.
Repeat seamlessly with no gap or jump at the loop boundary.
Keep duplicate logo groups hidden from screen readers.
Provide a keyboard-accessible pause/resume button.
Pause on hover and while keyboard focus is inside the logo track.
Use pure CSS transform animation with linear easing. Add no dependencies.
With reduced motion enabled, show a static, wrapping logo list.