/* ---- illustrated curbside arrival; one synchronized 20-second scene ---- */
.arrival-scene { grid-column:1 / -1; margin:1rem 0 -2rem; position:relative; }
.arrival-world { overflow:hidden; }
.arrival-world > svg { display:block; width:100%; height:auto; overflow:hidden; }
.arrival-world > .arrival-mobile { display:none; }
.arrival-world text { font-family:var(--font-sans); }
.arrival-sign-label { font-size:19px; fill:#234b3e; }
.arrival-time { font-size:26px; font-weight:600; font-variant-numeric:tabular-nums; fill:#234b3e; }
.arrival-scene figcaption { color:var(--rallid-muted); font-size:.8125rem; line-height:1.5; max-width:calc(100% - 9rem); text-wrap:pretty; }
.arrival-pause { position:absolute; width:1px; height:1px; opacity:0; }
.arrival-control { position:absolute; right:0; bottom:-.45rem; display:flex; gap:.5rem; align-items:center; font-size:.8125rem; cursor:pointer; min-height:44px; padding:.5rem; border-radius:5px; }
.arrival-control svg { width:16px; height:16px; fill:none; stroke:currentColor; stroke-width:2; }
.arrival-pause:focus-visible + .arrival-control { outline:2px solid var(--rallid-blue); outline-offset:3px; }
.arrival-pause:checked + .arrival-control { background:#e1e7dc; }
.arrival-pause:checked ~ .arrival-world * { animation-play-state:paused !important; }
.arrival-bus { animation:arrival-bus 20s infinite; }
@keyframes arrival-bus { 0%,3% { transform:translateX(-600px); animation-timing-function:cubic-bezier(.12,.7,.25,1); } 23%,82% { transform:translateX(0); } 100% { transform:translateX(680px); animation-timing-function:ease-in; } }
.arrival-bus-door { transform-box:fill-box; transform-origin:right; animation:arrival-door 20s infinite; }
@keyframes arrival-door { 0%,23%,78%,100% { transform:scaleX(1); } 26%,75% { transform:scaleX(.12); } }
.arrival-shop-door { transform-box:fill-box; transform-origin:right; animation:arrival-shop-door 20s infinite; }
@keyframes arrival-shop-door { 0%,35%,78%,100% { transform:scaleX(1); } 40%,74% { transform:scaleX(.12); } }
.arrival-scheduled { animation:arrival-scheduled 20s infinite; }
.arrival-timer { opacity:0; animation:arrival-timer 20s infinite; }
.arrival-complete { opacity:0; animation:arrival-complete 20s infinite; }
@keyframes arrival-scheduled { 0%,21%,100% { opacity:1; } 23%,98% { opacity:0; } }
@keyframes arrival-timer { 0%,22%,83%,100% { opacity:0; } 23%,81% { opacity:1; } }
@keyframes arrival-complete { 0%,82%,99%,100% { opacity:0; } 84%,97% { opacity:1; } }
.arrival-clock-reel { animation:arrival-clock 20s infinite; }
@keyframes arrival-clock { 0%,23% { transform:translateY(0); animation-timing-function:steps(12,end); } 83%,100% { transform:translateY(-372px); } }
.arrival-crew { opacity:0; animation:arrival-unload 20s linear infinite; }
.arrival-crew-two { animation-delay:2.4s; }
.arrival-crew-three { animation-delay:4.8s; }
@keyframes arrival-unload { 0%,27% { opacity:0; transform:translateX(0); } 29% { opacity:1; transform:translateX(0); } 48% { opacity:1; transform:translateX(219px); } 50%,100% { opacity:0; transform:translateX(219px); } }
.arrival-bird-step { animation:arrival-step .32s ease-in-out infinite alternate; transform-box:fill-box; transform-origin:center bottom; }
@keyframes arrival-step { from { transform:translateY(0) rotate(-3deg); } to { transform:translateY(-2px) rotate(3deg); } }
@media (max-width:40rem) {
 .arrival-world > .arrival-desktop { position:absolute; width:0; height:0; }
 .arrival-world > .arrival-mobile { display:block; }
 .arrival-scene { margin-top:0; }
 .arrival-scene figcaption { max-width:100%; padding-top:.5rem; }
 .arrival-control { position:relative; width:max-content; margin-left:auto; bottom:auto; }
}
@media (prefers-reduced-motion:reduce) {
 .arrival-world * { animation:none !important; }
 .arrival-bus { transform:none; }
 .arrival-crew-one { opacity:1; transform:translateX(95px); }
 .arrival-crew-two { opacity:1; transform:translateX(200px); }
 .arrival-crew-three { opacity:1; transform:translateX(150px); }
 .arrival-scheduled { opacity:1; }
 .arrival-timer,.arrival-complete { opacity:0; }
 .arrival-control { display:none; }
 .arrival-scene figcaption { max-width:100%; }
}


/* Give the tour scene an outcome and a clear next step. */
.arrival-scene .arrival-sales { margin-top:1rem; color:var(--rallid-green,#214d3b); }
.arrival-sales strong { display:block; font-size:clamp(1.1rem,1.8vw,1.35rem); line-height:1.45; font-weight:600; text-wrap:pretty; }
.arrival-sales a { display:inline-flex; align-items:center; gap:.75rem; min-height:44px; margin-top:.4rem; font-size:.9375rem; color:inherit; text-decoration:underline; text-underline-offset:5px; text-decoration-thickness:1px; }
.arrival-sales a:hover { text-decoration-thickness:2px; }
.arrival-sales a:focus-visible { outline:2px solid #927a45; outline-offset:4px; }
.arrival-sales a svg { width:20px; height:20px; flex:0 0 20px; fill:none; stroke:currentColor; stroke-width:1.5; stroke-linecap:round; stroke-linejoin:round; }