/* Motion changes paint and transforms only; it does not change page layout. */
.route-light-glow{opacity:.72}
.route-head{pointer-events:none}
@media(hover:hover) and (pointer:fine){
  .button{transition:background-color .22s ease,box-shadow .22s ease,border-color .22s ease}
  .button-gold:hover{box-shadow:0 0 24px rgba(211,170,89,.2)}
  .button-outline:hover{box-shadow:0 0 20px rgba(211,170,89,.1)}
  .text-link,.service-link{transition:color .2s ease,border-color .2s ease}
  .text-link:hover,.service-link:hover{color:#fff0cb;border-color:#fff0cb}
}
@media(prefers-reduced-motion:reduce){
  .route-light{stroke-dashoffset:0!important}
  .route-head{display:none}
  .button,.text-link,.service-link{transition:none!important}
}

/* The hidden state is applied only below the initial viewport, without a fade-out. */
.motion-reveal{opacity:0;transform:translateY(12px)}
.motion-reveal.motion-photo{transform:translateY(8px);--reveal-duration:1.1s}
.motion-reveal.motion-label{transform:translateY(14px);--reveal-duration:.85s}
.motion-reveal.is-revealed{opacity:1;transform:translateY(0);transition:opacity var(--reveal-duration,.95s) cubic-bezier(.2,.6,.25,1) var(--reveal-delay,0ms),transform var(--reveal-duration,.95s) cubic-bezier(.2,.6,.25,1) var(--reveal-delay,0ms)}
@media(max-width:700px){.motion-reveal{transform:translateY(8px)}.motion-reveal.motion-photo{transform:translateY(5px)}.motion-reveal.motion-label{transform:translateY(10px)}.motion-reveal.is-revealed{transform:translateY(0)}}
@media(prefers-reduced-motion:reduce){.motion-reveal{opacity:1!important;transform:none!important;transition:none!important}}
