:root {
  --motion-fast: 140ms;
  --motion-medium: 220ms;
  --motion-slow: 320ms;
  --motion-ease: cubic-bezier(.2, .7, .3, 1);
}

html:focus-within {
  scroll-behavior: smooth;
}

.journey-stop,
.eligibility-rail li,
.eligibility-rail a {
  transition: color var(--motion-fast) var(--motion-ease), background-color var(--motion-fast) var(--motion-ease), border-color var(--motion-fast) var(--motion-ease);
}

.journey-stop[aria-current="page"]::after,
.eligibility-rail li[aria-current="step"]::after {
  animation: rail-progress var(--motion-medium) var(--motion-ease) both;
  transform-origin: left center;
}

#savedLocalMark.is-saving {
  animation: saved-local var(--motion-medium) var(--motion-ease);
}

.vibe-chip,
.vibe-chip .vibe-count {
  transition: color var(--motion-fast) var(--motion-ease), background-color var(--motion-fast) var(--motion-ease), border-color var(--motion-fast) var(--motion-ease), box-shadow var(--motion-fast) var(--motion-ease);
}

.vibe-chip:active,
.compare-toggle:active,
.compare-remove:active,
.btn2:active,
.btn:active {
  transform: translateY(1px);
}

#segCity button:active,
#searchBtn:active,
#themeBtn:active,
.iconbtn:active,
.stepbtn:active,
.car-btn2:active,
.imgcard:active {
  transform: scale(.98);
}

#budgetTicket {
  transition: opacity var(--motion-medium) var(--motion-ease);
}

#budgetTicket.is-updating {
  animation: budget-crossfade var(--motion-medium) var(--motion-ease);
}

.page.active {
  animation: route-enter var(--motion-slow) var(--motion-ease) both;
}

@keyframes rail-progress {
  from { opacity: .35; transform: scaleX(.15); }
  to { opacity: 1; transform: scaleX(1); }
}

@keyframes saved-local {
  50% { filter: saturate(1.18); transform: rotate(-1deg) scale(1.02); }
}

@keyframes budget-crossfade {
  50% { opacity: .72; }
}

@keyframes route-enter {
  from { opacity: .01; transform: translateY(8px); }
  to { opacity: 1; transform: none; }
}

@media (prefers-reduced-motion: reduce) {
  html,
  html:focus-within {
    scroll-behavior: auto;
  }

  *,
  *::before,
  *::after {
    animation: none !important;
    scroll-behavior: auto !important;
    transition: none !important;
  }

  .has-reveal .rv,
  .page.active,
  #savedLocalMark.is-saving,
  .journey-stop[aria-current="page"]::after,
  .eligibility-rail li[aria-current="step"]::after {
    opacity: 1 !important;
    transform: none !important;
  }
}