Hero component - Add swipe action to slideshow

[minimaldesign]

Assessment

Worth doing — expected UX on touch devices. The slideshow variant (src/components/Hero.astro, variant === 'slideshow') currently only navigates via pagination dots and autoplay. On touch screens users instinctively swipe; dots are tiny targets. The existing script structure (show(), stopAutoplay(), define:vars module at Hero.astro:199-270) makes this a contained addition. Effort: S/M.

Implementation plan

1. Pointer-events swipe handling in the existing slideshow <script type="module"> (Hero.astro:201) — Pointer Events cover touch, pen, and mouse-drag in one API, consistent with the component's other listeners:

   • Only attach when slideshowItems.length > 1.
   • pointerdown on root (.hero_wrap): record startX/startY and pointer id.
   • pointerup: compute dx/dy. Trigger only when |dx| ≥ ~40px and |dx| > |dy| (horizontal intent). dx < 0 → show((active + 1) % n), dx > 0 → show((active − 1 + n) % n).
   • On a successful swipe, call stopAutoplay() — same policy as clicking a dot (Hero.astro:247-252).
   • Ignore gestures starting on interactive elements (event.target.closest('a, button')) so dots, play/pause, and CTA links keep working; taps below the threshold do nothing.
   • Remove listeners on teardown, matching the existing cleanup pattern (Hero.astro:189).

2. CSS in src/styles/framework/component.hero.css:

   • .hero_wrap[data-slideshow] { touch-action: pan-y; } — keeps vertical page scroll working while letting horizontal swipes reach the handler.
   • Suppress accidental text/image selection during drags (user-select: none on the wrap during an active drag, or -webkit-user-drag: none on media). Keep the transition scoped per the no-transition: all rule (agents/css.md).

3. Non-goals (keep v1 simple): no drag-follow/parallax animation — the current crossfade via is-active class toggles stays; swipe is just another way to call show(). Keyboard arrow support can be a follow-up.

4. Docs: mention swipe support in the hero component docs (src/content/components/hero.mdx), including the autoplay-stops-on-swipe behavior.

5. Verify: dev server, hero demo page in mobile viewport emulation — swipe left/right changes slides, vertical scrolling over the hero still works, dot clicks and play/pause unaffected, autoplay stops after a swipe, prefers-reduced-motion behavior unchanged (autoplay off; swipe still allowed since it's user-initiated).