/* SCROLL MOTION TRIAL (?motion=1). Every rule is under .gs-motion, which motion.js adds only when it is running and the visitor has not asked for reduced motion. */
html.lenis, html.lenis body { height: auto; }
.lenis.lenis-smooth { scroll-behavior: auto !important; }
.lenis.lenis-stopped { overflow: hidden; }

/* hero title: word by word. "backwards" means the words are only hidden while they wait; once done they are plain visible text. */
.gs-motion .mo-w { display: inline-block; animation: mo-word .9s cubic-bezier(.2, .7, .2, 1) backwards; animation-delay: calc(var(--i, 0) * 90ms + 150ms); }
@keyframes mo-word { from { opacity: 0; transform: translateY(.45em); filter: blur(10px); } to { opacity: 1; transform: none; filter: blur(0); } }

/* pictures rise into place */
.gs-motion .mo-pre { opacity: 0; transform: translateY(48px); }
.gs-motion .gs-inline, .gs-motion .gs-grid__item, .gs-motion .gs-pkg, .gs-motion .gs-blognav, .gs-motion .gs-result { transition: opacity .9s ease, transform 1s cubic-bezier(.2, .7, .2, 1); }

/* a gentle drift inside each picture */
.gs-motion .mo-pic { display: block; }
.gs-motion .mo-frame { overflow: hidden; }
.gs-motion .mo-frame img { transform: translate3d(0, var(--mo-y, 0), 0) scale(1.08); will-change: transform; }

/* hero: drifts a little, and settles into a rounded card as you scroll past it */
.gs-motion .gs-hero__pic { overflow: hidden; transform-origin: 50% 0; transform: scale(calc(1 - var(--mo-shrink, 0) * .06)); border-radius: calc(var(--mo-shrink, 0) * 28px); will-change: transform; }
.gs-motion .gs-hero__pic img { transform: translate3d(0, var(--mo-y, 0), 0) scale(1.12); }

@media (prefers-reduced-motion: reduce) {
  .gs-motion .mo-w, .gs-motion .mo-pre { animation: none; opacity: 1; transform: none; filter: none; }
}

.gs-motion .gs-masonry { padding-bottom: 70px; }