GSAP

Norio uses the GSAP npm package for almost all motion. There is no AOS, Wow.js, or Swiper animation layer. Official docs: https://gsap.com/

---

What is registered

src/assets/js/main.js imports GSAP and plugins, then creates a page-level ScrollSmoother on #smooth-wrapper / #smooth-content. ScrollSmoother is skipped when prefers-reduced-motion: reduce is set.

Typical plugins in the kit:

• ScrollTrigger — pin, scrub, and viewport reveals
• ScrollSmoother — inertia scrolling for the whole page
• ScrollTo — hash / back-to-top scrolling

How effects attach

Each effect is a small ES module imported from main.js (or a page script such as src/assets/js/pages/home.js). Modules query a section class and no-op when the markup is missing, so unused pages stay cheap.

Examples:

• fade-in-up.js / fade-in-down.js — viewport fades
• text-mark.js, text-scramble.js, text-blur-stagger.js — headline reveals
• cover-reveal.js, about-2-pin.js, project-3.js — pinned storytelling
• image-slider-2.js, awards-slider.js — scrubbed horizontal galleries

Authoring rules

• Keep animation in JS modules, not inline <script> in templates.
• Respect prefers-reduced-motion the same way existing modules do.
• After structural DOM changes, call ScrollTrigger.refresh() if you add or remove triggers at runtime.