.brand-badge{display:inline-flex;position:relative;overflow:hidden;border-radius:50%;flex-shrink:0;line-height:0}
.brand-badge::after{content:"";position:absolute;inset:-40%;pointer-events:none;background:linear-gradient(110deg,transparent 42%,#fff9 49%,#fff2 53%,transparent 60%);transform:translateX(-130%) rotate(-10deg)}
.brand:hover .brand-badge::after,.brand:focus-visible .brand-badge::after{animation:cblr-glint 1.1s ease-in-out}
@keyframes cblr-glint{to{transform:translateX(130%) rotate(-10deg)}}
.ride-route{width:100%;max-width:640px;height:100px;display:block;margin:0 0 2rem;color:var(--orange-hot);grid-column:1/-1}
.ride-route .route-base{stroke:var(--line);stroke-dasharray:4 7}
.ride-route .route-draw{stroke-dasharray:1;stroke-dashoffset:0}
.ride-route.is-arriving .route-draw{animation:cblr-route 2.5s ease-in-out both}
@keyframes cblr-route{from{stroke-dashoffset:1}to{stroke-dashoffset:0}}
.motion-arrive{animation:cblr-arrive .65s cubic-bezier(.2,.75,.3,1) both;animation-delay:var(--arrival-delay,0ms)}
@keyframes cblr-arrive{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:translateY(0)}}
.ride-welcome{position:absolute;inset:0 0 auto;height:64px;overflow:hidden;pointer-events:none;z-index:2}
.ride-welcome svg{position:absolute;bottom:4px;width:86px;height:56px;color:#fff6df;filter:drop-shadow(0 2px 3px #0009);animation:cblr-welcome 2.8s cubic-bezier(.25,.65,.45,1) both}
@keyframes cblr-welcome{0%{left:-100px;opacity:0}10%{opacity:1}85%{opacity:1}100%{left:100%;opacity:0}}
@media(max-width:700px){.ride-route{height:80px;margin-bottom:1.5rem}}
@media(prefers-reduced-motion:reduce){.motion-arrive,.ride-route .route-draw,.brand-badge::after{animation:none!important}.ride-welcome{display:none}}
