/* Sand-pushing bulldozer scene for the Equipment page header (GENERATED - edit gen_sand_css.py, not this file).
   All the moving parts run off ONE master timeline (--cycle) so they stay in step:
   dozer pushes sand to the step -> sand drops into the pit -> dozer backs up -> repeat x3 -> reset. */

/* ---- the bulldozer itself (drawn in a 90 x 52 box, scaled by the scene) ---- */
.dozer-shape .smoke{ transform-box:fill-box; transform-origin:center; opacity:0; animation:smokeUp 2.2s ease-out infinite; }
.dozer-shape .smoke.s2{ animation-delay:1.1s; }
@keyframes smokeUp{
  0%{ opacity:.55; transform:translate(0,0) scale(.6); }
  100%{ opacity:0; transform:translate(-9px,-12px) scale(1.7); }
}
.dozer-shape .dz-body{ animation:dzShake .3s ease-in-out infinite alternate; }
@keyframes dzShake{ from{ transform:translateY(0); } to{ transform:translateY(-.5px); } }
.dozer-shape .tread-f{ animation:treadF .5s linear infinite; }
.dozer-shape .tread-r{ opacity:0; animation:treadR .5s linear infinite; }
@keyframes treadF{ to{ stroke-dashoffset:-6.4; } }
@keyframes treadR{ to{ stroke-dashoffset:6.4; } }
.dozer-shape .dust circle{ transform-box:fill-box; transform-origin:center; opacity:0; animation:dustPuff 1.1s ease-out infinite; }
.dozer-shape .dust circle:nth-child(2){ animation-delay:.37s; }
.dozer-shape .dust circle:nth-child(3){ animation-delay:.74s; }
@keyframes dustPuff{
  0%{ opacity:.5; transform:translate(0,0) scale(.6); }
  100%{ opacity:0; transform:translate(-8px,-7px) scale(2); }
}
.dozer-shape .dz-mound{ opacity:0; }

/* ---- scene wiring ---- */
.sand{ --cycle:30s; --iter:infinite; }
.sand .dz-move{ animation:dzMove var(--cycle) linear var(--iter) forwards; }
.sand .dz-tilt{ transform-box:fill-box; transform-origin:0% 100%; animation:dzTilt var(--cycle) linear var(--iter) forwards; }
.sand .dz-mound{ transform-box:fill-box; transform-origin:0% 100%; animation:moundPush var(--cycle) linear var(--iter) forwards; }
.sand .dz-blade{ animation:bladeLift var(--cycle) linear var(--iter) forwards; }
.sand .heap{ transform-box:fill-box; transform-origin:50% 100%; animation:heapShow var(--cycle) linear var(--iter) forwards; }
.sand .pitfill{ transform-box:fill-box; transform-origin:50% 100%; animation:pitFill var(--cycle) linear var(--iter) forwards; }
.sand .grain{ opacity:0; animation:grainFall var(--cycle) linear var(--iter) forwards; }
.sand .grain.g2{ animation-delay:.12s; } .sand .grain.g3{ animation-delay:.26s; } .sand .grain.g4{ animation-delay:.05s; }
.sand .grain.g5{ animation-delay:.2s; } .sand .grain.g6{ animation-delay:.33s; } .sand .grain.g7{ animation-delay:.16s; }
.sand .tread-f{ animation:treadF .5s linear infinite, showF var(--cycle) linear var(--iter) forwards; }
.sand .tread-r{ animation:treadR .5s linear infinite, showR var(--cycle) linear var(--iter) forwards; }

/* ---- devices set to "reduce motion": no movement, dozer parked with the pit half full ---- */
@media (prefers-reduced-motion:reduce){
  .scene *{ animation:none !important; }
  .sand .pitfill{ transform:scaleY(.5); }
  .dozer-shape .smoke{ display:none; }
}


@keyframes dzMove{
  0%{transform:translateX(0);animation-timing-function:linear;}
  1.5%{transform:translateX(0);animation-timing-function:ease-in-out;}
  15%{transform:translateX(244px);animation-timing-function:linear;}
  18.3%{transform:translateX(244px);animation-timing-function:ease-in-out;}
  29.5%{transform:translateX(0);animation-timing-function:linear;}
  31.5%{transform:translateX(0);animation-timing-function:ease-in-out;}
  45%{transform:translateX(244px);animation-timing-function:linear;}
  48.3%{transform:translateX(244px);animation-timing-function:ease-in-out;}
  59.5%{transform:translateX(0);animation-timing-function:linear;}
  61.5%{transform:translateX(0);animation-timing-function:ease-in-out;}
  75%{transform:translateX(244px);animation-timing-function:linear;}
  78.3%{transform:translateX(244px);animation-timing-function:ease-in-out;}
  89.5%{transform:translateX(0);animation-timing-function:linear;}
  100%{transform:translateX(0);}
}

@keyframes dzTilt{
  0%{transform:rotate(0deg);animation-timing-function:linear;}
  14%{transform:rotate(0deg);animation-timing-function:ease-in-out;}
  15.3%{transform:rotate(4deg);animation-timing-function:linear;}
  17.5%{transform:rotate(4deg);animation-timing-function:ease-in-out;}
  18.6%{transform:rotate(0deg);animation-timing-function:linear;}
  44%{transform:rotate(0deg);animation-timing-function:ease-in-out;}
  45.3%{transform:rotate(4deg);animation-timing-function:linear;}
  47.5%{transform:rotate(4deg);animation-timing-function:ease-in-out;}
  48.6%{transform:rotate(0deg);animation-timing-function:linear;}
  74%{transform:rotate(0deg);animation-timing-function:ease-in-out;}
  75.3%{transform:rotate(4deg);animation-timing-function:linear;}
  77.5%{transform:rotate(4deg);animation-timing-function:ease-in-out;}
  78.6%{transform:rotate(0deg);animation-timing-function:linear;}
  100%{transform:rotate(0deg);}
}

@keyframes moundPush{
  0%{transform:scale(0);opacity:0;animation-timing-function:linear;}
  1.4%{transform:scale(0);opacity:0;animation-timing-function:ease-out;}
  1.5%{transform:scale(.2);opacity:1;animation-timing-function:linear;}
  5%{transform:scale(.7);opacity:1;animation-timing-function:linear;}
  15%{transform:scale(1);opacity:1;animation-timing-function:linear;}
  16%{transform:scale(.95);opacity:1;animation-timing-function:ease-in;}
  18.3%{transform:scale(.25);opacity:.7;animation-timing-function:linear;}
  19.5%{transform:scale(0);opacity:0;animation-timing-function:linear;}
  31.4%{transform:scale(0);opacity:0;animation-timing-function:ease-out;}
  31.5%{transform:scale(.2);opacity:1;animation-timing-function:linear;}
  35%{transform:scale(.7);opacity:1;animation-timing-function:linear;}
  45%{transform:scale(1);opacity:1;animation-timing-function:linear;}
  46%{transform:scale(.95);opacity:1;animation-timing-function:ease-in;}
  48.3%{transform:scale(.25);opacity:.7;animation-timing-function:linear;}
  49.5%{transform:scale(0);opacity:0;animation-timing-function:linear;}
  61.4%{transform:scale(0);opacity:0;animation-timing-function:ease-out;}
  61.5%{transform:scale(.2);opacity:1;animation-timing-function:linear;}
  65%{transform:scale(.7);opacity:1;animation-timing-function:linear;}
  75%{transform:scale(1);opacity:1;animation-timing-function:linear;}
  76%{transform:scale(.95);opacity:1;animation-timing-function:ease-in;}
  78.3%{transform:scale(.25);opacity:.7;animation-timing-function:linear;}
  79.5%{transform:scale(0);opacity:0;animation-timing-function:linear;}
  100%{transform:scale(0);opacity:0;}
}

@keyframes heapShow{
  0%{transform:scaleY(1);opacity:1;animation-timing-function:linear;}
  1.5%{transform:scaleY(1);opacity:1;animation-timing-function:ease-in;}
  5%{transform:scaleY(.2);opacity:0;animation-timing-function:linear;}
  30%{transform:scaleY(.5);opacity:0;animation-timing-function:ease-out;}
  31.5%{transform:scaleY(1);opacity:1;animation-timing-function:ease-in;}
  35%{transform:scaleY(.2);opacity:0;animation-timing-function:linear;}
  60%{transform:scaleY(.5);opacity:0;animation-timing-function:ease-out;}
  61.5%{transform:scaleY(1);opacity:1;animation-timing-function:ease-in;}
  65%{transform:scaleY(.2);opacity:0;animation-timing-function:linear;}
  90%{transform:scaleY(.5);opacity:0;animation-timing-function:ease-out;}
  100%{transform:scaleY(1);opacity:1;}
}

@keyframes pitFill{
  0%{transform:scaleY(0);opacity:1;animation-timing-function:linear;}
  17%{transform:scaleY(0.000);opacity:1;animation-timing-function:ease-out;}
  19%{transform:scaleY(0.333);opacity:1;animation-timing-function:linear;}
  47%{transform:scaleY(0.333);opacity:1;animation-timing-function:ease-out;}
  49%{transform:scaleY(0.667);opacity:1;animation-timing-function:linear;}
  77%{transform:scaleY(0.667);opacity:1;animation-timing-function:ease-out;}
  79%{transform:scaleY(1.000);opacity:1;animation-timing-function:linear;}
  92%{transform:scaleY(1);opacity:1;animation-timing-function:linear;}
  98%{transform:scaleY(1);opacity:0;animation-timing-function:linear;}
  98.01%{transform:scaleY(0);opacity:0;animation-timing-function:linear;}
  100%{transform:scaleY(0);opacity:1;}
}

@keyframes grainFall{
  0%{transform:translateY(0);opacity:0;animation-timing-function:linear;}
  15.3%{transform:translateY(0);opacity:0;animation-timing-function:ease-in;}
  15.8%{transform:translateY(0);opacity:1;animation-timing-function:ease-in;}
  18.8%{transform:translateY(26px);opacity:1;animation-timing-function:linear;}
  19.1%{transform:translateY(26px);opacity:0;animation-timing-function:linear;}
  45.3%{transform:translateY(0);opacity:0;animation-timing-function:ease-in;}
  45.8%{transform:translateY(0);opacity:1;animation-timing-function:ease-in;}
  48.8%{transform:translateY(26px);opacity:1;animation-timing-function:linear;}
  49.1%{transform:translateY(26px);opacity:0;animation-timing-function:linear;}
  75.3%{transform:translateY(0);opacity:0;animation-timing-function:ease-in;}
  75.8%{transform:translateY(0);opacity:1;animation-timing-function:ease-in;}
  78.8%{transform:translateY(26px);opacity:1;animation-timing-function:linear;}
  79.1%{transform:translateY(26px);opacity:0;animation-timing-function:linear;}
  100%{transform:translateY(0);opacity:0;}
}

@keyframes bladeLift{
  0%{transform:translateY(0);animation-timing-function:linear;}
  18.3%{transform:translateY(0);animation-timing-function:ease-in-out;}
  19.5%{transform:translateY(-4px);animation-timing-function:linear;}
  29%{transform:translateY(-4px);animation-timing-function:ease-in-out;}
  29.8%{transform:translateY(0);animation-timing-function:linear;}
  48.3%{transform:translateY(0);animation-timing-function:ease-in-out;}
  49.5%{transform:translateY(-4px);animation-timing-function:linear;}
  59%{transform:translateY(-4px);animation-timing-function:ease-in-out;}
  59.8%{transform:translateY(0);animation-timing-function:linear;}
  78.3%{transform:translateY(0);animation-timing-function:ease-in-out;}
  79.5%{transform:translateY(-4px);animation-timing-function:linear;}
  89%{transform:translateY(-4px);animation-timing-function:ease-in-out;}
  89.8%{transform:translateY(0);animation-timing-function:linear;}
  100%{transform:translateY(0);}
}

@keyframes showF{
  0%{opacity:0;animation-timing-function:linear;}
  1.4%{opacity:0;animation-timing-function:linear;}
  1.5%{opacity:1;animation-timing-function:linear;}
  18.3%{opacity:1;animation-timing-function:linear;}
  18.4%{opacity:0;animation-timing-function:linear;}
  31.4%{opacity:0;animation-timing-function:linear;}
  31.5%{opacity:1;animation-timing-function:linear;}
  48.3%{opacity:1;animation-timing-function:linear;}
  48.4%{opacity:0;animation-timing-function:linear;}
  61.4%{opacity:0;animation-timing-function:linear;}
  61.5%{opacity:1;animation-timing-function:linear;}
  78.3%{opacity:1;animation-timing-function:linear;}
  78.4%{opacity:0;animation-timing-function:linear;}
  100%{opacity:0;}
}

@keyframes showR{
  0%{opacity:0;animation-timing-function:linear;}
  18.3%{opacity:0;animation-timing-function:linear;}
  18.4%{opacity:1;animation-timing-function:linear;}
  29.5%{opacity:1;animation-timing-function:linear;}
  29.6%{opacity:0;animation-timing-function:linear;}
  48.3%{opacity:0;animation-timing-function:linear;}
  48.4%{opacity:1;animation-timing-function:linear;}
  59.5%{opacity:1;animation-timing-function:linear;}
  59.6%{opacity:0;animation-timing-function:linear;}
  78.3%{opacity:0;animation-timing-function:linear;}
  78.4%{opacity:1;animation-timing-function:linear;}
  89.5%{opacity:1;animation-timing-function:linear;}
  89.6%{opacity:0;animation-timing-function:linear;}
  100%{opacity:0;}
}
