/* Shared motion. Content is fully visible before JavaScript and at rest. */
:root {
  --motion-ease: cubic-bezier(.16, 1, .3, 1);
  --motion-ease-in-out: cubic-bezier(.76, 0, .24, 1);
}
html.lenis, html.lenis body { height: auto; }
html.lenis { scroll-behavior: auto !important; }
.lenis.lenis-stopped { overflow: clip; }
[data-lenis-prevent] { overscroll-behavior: contain; }

.motion-word {
  display: inline-block;
  vertical-align: baseline;
  clip-path: inset(-.06em -.2em -.23em);
}
.motion-word-ink { display: inline-block; }
.motion-photo-frame { overflow: hidden; }
.footer-ribbon.is-outside .footer-ribbon-track { animation-play-state: paused; }

@media (prefers-reduced-motion: no-preference) {
  .button {
    transition: background .4s var(--motion-ease), color .4s var(--motion-ease),
      border-color .4s var(--motion-ease), transform .55s var(--motion-ease);
  }
  .button > span, .text-link > span {
    display: inline-block;
    transition: transform .55s var(--motion-ease);
  }
  .service-card, .contact-type, .journal-card {
    transition-duration: .6s;
    transition-timing-function: var(--motion-ease);
  }
  .service-image, .journal-card-image img { transition-duration: 1.1s; transition-timing-function: var(--motion-ease); }
  @media (hover: hover) and (pointer: fine) {
    .button:hover > span, .text-link:hover > span { transform: translateX(3px); }
  }
  @media (min-width: 901px) and (hover: hover) and (pointer: fine) {
    .motion-photo-frame > img { scale: 1.05; }
  }
}
@media (prefers-reduced-motion: reduce) {
  .motion-word { clip-path: none; }
  .motion-photo-frame > img { scale: none; translate: none !important; }
}
