/* Scroll vehicle: a little vehicle drives along a strip in step with the page scroll. Our own code (the Patty Wagon
   brand layer on the Lord Burger bones, 09-30), cleaned up as a part with a neutral van.
   The strip is any element; the vehicle sits on its bottom edge and travels from its left end (top of the page) to
   its right end (bottom of the page). Wheels turn by the distance actually travelled; the body bobs only while the
   page is moving. */
.sv {
  --sv-w: 64px;                    /* vehicle width (source: 64px; 88px >= 1920px; 46px <= 479px) */
  --sv-ground: 3px;                /* lift off the strip's bottom edge (sits on a 3px rule in the source) */
  --sv-bob: 1.5px;                 /* bob height while moving */
  --sv-bob-dur: .22s;              /* half a bob (alternate) */
  --sv-body: #f2b134;              /* default van colours */
  --sv-trim: #fff;
  --sv-glass: #dff1ff;
  --sv-ink: #111;
  position: relative; min-width: calc(var(--sv-w) + 8px); min-height: calc(var(--sv-w) * .5);
  pointer-events: none;
}
.sv__vehicle { position: absolute; left: 0; bottom: var(--sv-ground); width: var(--sv-w); will-change: transform; }
.sv__vehicle svg { display: block; width: 100%; height: auto; overflow: visible; }
.sv__wheel { transform-box: fill-box; transform-origin: 50% 50%; }
.sv.is-driving .sv__body { animation: sv-bob var(--sv-bob-dur) ease-in-out infinite alternate; }
@keyframes sv-bob { to { transform: translateY(calc(var(--sv-bob) * -1)); } }
/* default van paint (bring your own SVG and these don't apply) */
.sv__paint { fill: var(--sv-body); stroke: var(--sv-ink); stroke-width: 3; stroke-linejoin: round; }
.sv__glass { fill: var(--sv-glass); stroke: var(--sv-ink); stroke-width: 2.5; stroke-linejoin: round; }
.sv__stripe { fill: var(--sv-trim); }
.sv__tyre { fill: var(--sv-ink); }
.sv__hub { fill: var(--sv-trim); }

@media (prefers-reduced-motion: reduce) { .sv.is-driving .sv__body { animation: none; } }
