/* Shared motion layer: intentionally loaded after each site's visual styles. */
:root {
  --motion-ease: cubic-bezier(.22, .72, .2, 1);
  --motion-soft: cubic-bezier(.2, .65, .25, 1);
}

html,
body {
  max-width: 100%;
  overflow-x: clip;
}

html.motion-ready .hero-copy > * {
  animation: none !important;
  opacity: 0;
  transform: translate3d(0, 20px, 0);
  transition: opacity .68s var(--motion-ease), transform .72s var(--motion-ease);
  transition-delay: var(--hero-delay, 0s);
  will-change: opacity, transform;
}

html.motion-ready .hero-copy > :nth-child(1) { --hero-delay: 0s; }
html.motion-ready .hero-copy > :nth-child(2) { --hero-delay: .09s; }
html.motion-ready .hero-copy > :nth-child(3) { --hero-delay: .18s; }
html.motion-ready .hero-copy > :nth-child(4) { --hero-delay: .27s; }
html.motion-ready .hero-copy > :nth-child(n + 5) { --hero-delay: .34s; }

html.motion-ready .hero-media,
html.motion-ready .hero-photo,
html.motion-ready .hero > .visual {
  opacity: 0;
  transform: scale(1.025);
  transition: opacity .78s var(--motion-soft) .38s, transform .88s var(--motion-ease) .38s;
  will-change: opacity, transform;
}

html.motion-ready.motion-start .hero-copy > *,
html.motion-ready.motion-start .hero-media,
html.motion-ready.motion-start .hero-photo,
html.motion-ready.motion-start .hero > .visual {
  opacity: 1;
  transform: none;
}

html.motion-ready .reveal {
  animation: none !important;
  opacity: 0;
  transform: translate3d(0, 22px, 0);
  transition: opacity .66s var(--motion-soft), transform .74s var(--motion-ease);
  transition-delay: var(--motion-delay, 0ms);
  will-change: opacity, transform;
}

html.motion-ready .reveal[data-motion="left"] { transform: translate3d(-30px, 0, 0); }
html.motion-ready .reveal[data-motion="right"] { transform: translate3d(30px, 0, 0); }
html.motion-ready .reveal[data-motion="scale"] { transform: translate3d(0, 10px, 0) scale(.982); }

html.motion-ready .reveal.on {
  opacity: 1;
  transform: none;
}

html.motion-ready .motion-media {
  clip-path: inset(0 0 12% 0);
  opacity: 0;
  transform: scale(1.025);
  transform-origin: center;
  transition: clip-path .9s var(--motion-ease), opacity .65s var(--motion-soft), transform 1s var(--motion-ease);
  will-change: clip-path, opacity, transform;
}

html.motion-ready .motion-media.on {
  clip-path: inset(0 0 0 0);
  opacity: 1;
  transform: none;
}

a:focus-visible,
button:focus-visible {
  outline: 2px solid currentColor;
  outline-offset: 4px;
}

@media (hover: hover) and (pointer: fine) {
  .nav a,
  .links a,
  .top .nav a {
    position: relative;
  }

  .nav a::after,
  .links a::after,
  .top .nav a::after {
    background: currentColor;
    bottom: -6px;
    content: "";
    height: 1px;
    left: 0;
    position: absolute;
    transform: scaleX(0);
    transform-origin: right;
    transition: transform .35s var(--motion-ease);
    width: 100%;
  }

  .nav a:hover::after,
  .links a:hover::after,
  .top .nav a:hover::after {
    transform: scaleX(1);
    transform-origin: left;
  }

  .btn,
  .button,
  .cta,
  .call,
  .header-cta,
  .nav-cta {
    transition: transform .3s var(--motion-ease), background-color .3s ease, border-color .3s ease, box-shadow .3s ease !important;
  }

  .btn:hover,
  .button:hover,
  .cta:hover,
  .call:hover,
  .header-cta:hover,
  .nav-cta:hover {
    transform: translateY(-3px);
  }

  .service,
  .discipline,
  .person,
  .care-grid article,
  .method article {
    transition: transform .38s var(--motion-ease), box-shadow .38s ease, border-color .38s ease;
  }

  .service:hover,
  .discipline:hover,
  .person:hover,
  .care-grid article:hover,
  .method article:hover {
    transform: translateY(-5px);
  }

  .gallery img,
  .visit-photo img,
  .place-image img,
  .exotics-image img,
  .tech-image img,
  .person img,
  .method figure img {
    transition: transform .7s var(--motion-ease);
  }

  .gallery img:hover,
  .visit-photo:hover img,
  .place-image:hover img,
  .exotics-image:hover img,
  .tech-image:hover img,
  .person:hover img,
  .method figure:hover img {
    transform: scale(1.03);
  }
}
