/* Subtle motion: calm reveals, tactile links and a little depth on imagery. */
.motion-ready .reveal-on-scroll {
  opacity: 0;
  transform: translateY(26px);
  transition: opacity .9s cubic-bezier(.22, 1, .36, 1),
              transform .9s cubic-bezier(.22, 1, .36, 1);
  transition-delay: var(--reveal-delay, 0ms);
}
.motion-ready .reveal-on-scroll.is-visible {
  opacity: 1;
  transform: translateY(0);
}
header { transition: box-shadow .4s ease, background-color .4s ease; }
header.is-scrolled { box-shadow: 0 8px 28px rgba(26,21,32,.06); }
a, button, [style-hover] {
  transition: color .22s ease, background-color .22s ease,
              border-color .22s ease, box-shadow .22s ease,
              transform .22s ease;
}
a[href^="tel:"]:hover, button:hover { transform: translateY(-2px); }
a[href^="tel:"]:active, button:active { transform: translateY(0) scale(.98); }
main div[style-hover*="border-color"]:hover {
  transform: translateY(-4px);
  box-shadow: 0 14px 34px rgba(58,27,79,.08);
}
figure img {
  transition: transform .7s cubic-bezier(.22, 1, .36, 1), box-shadow .4s ease;
}
figure:hover img {
  transform: scale(1.015);
  box-shadow: 0 14px 32px rgba(26,21,32,.10);
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .motion-ready .reveal-on-scroll { opacity: 1; transform: none; transition: none; }
  *, *::before, *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
