/* One short journey on arrival, then a calm resting illustration. */
.journey-art{display:block;width:100%;height:auto;overflow:hidden}
.journey-trail{stroke-dasharray:.12 1;stroke-dashoffset:1.12;opacity:0}
.destination-ring{opacity:0;transform-origin:341px 91px}
@media(prefers-reduced-motion:no-preference){
  .journey-started .journey-trail{animation:trace-journey 3.6s .25s ease-in-out both}
  .journey-started .destination-ring{animation:arrive 1s 3s ease-out both}
  .journey-started .journey-car{animation:car-arrival 1.1s .15s cubic-bezier(.2,.7,.2,1) both}
  .journey-started .art-tag{animation:tag-arrival .8s .35s cubic-bezier(.2,.7,.2,1) backwards}
  .button,.ride-card,.text-link .arrow,.nav-contact .arrow,.mobile-contact a{transition:transform .25s cubic-bezier(.2,.7,.2,1),box-shadow .25s ease,background-color .25s ease}
  .button:active,.mobile-contact a:active{transform:translateY(1px) scale(.98)}
  .text-link:focus-visible .arrow,.nav-contact:focus-visible .arrow{transform:translate(3px,-3px)}
  @media(hover:hover) and (pointer:fine){
    .ride-card:hover{transform:translateY(-5px);box-shadow:0 10px 0 #ff7a1826}
    .text-link:hover .arrow,.nav-contact:hover .arrow{transform:translate(3px,-3px)}
    .button:hover{transform:translateY(-3px);box-shadow:0 5px 0 #142e4215}
  }
}
@keyframes trace-journey{
  0%{stroke-dashoffset:1.12;opacity:0}
  12%{opacity:1}
  85%{opacity:1}
  100%{stroke-dashoffset:-.12;opacity:0}
}
@keyframes arrive{0%{opacity:0;transform:scale(.6)}30%{opacity:.8}100%{opacity:0;transform:scale(1.8)}}
@keyframes car-arrival{from{transform:translateX(-24px)}to{transform:translateX(0)}}
@keyframes tag-arrival{from{opacity:.3;transform:translate(8px,12px)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .button,.ride-card,.text-link .arrow,.nav-contact .arrow,.mobile-contact a{transition:none;transform:none}
}
