/* Pork & Pistons — animated Pakse road scene */
.ride-scene{
  background:
    radial-gradient(circle at 72% 18%,rgba(231,193,139,.18),transparent 30%),
    linear-gradient(180deg,#c79862 0%,#76634e 54%,#34312e 100%)!important;
}
.ride-scene.road-animated{
  isolation:isolate;
  background:linear-gradient(180deg,#d8b17c 0%,#c49a67 38%,#6f7553 64%,#3a3834 100%);
  overflow:hidden;
}
.ride-scene.road-animated::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:0;
  background:
    radial-gradient(circle at 78% 16%,rgba(255,222,161,.58),transparent 24%),
    linear-gradient(180deg,rgba(255,242,213,.14),transparent 48%,rgba(16,14,13,.2));
  pointer-events:none;
}
.ride-scene > .moto-scenery,
.ride-scene > .road,
.ride-scene > .moto-wrap{display:none!important}
.ride-scene > .road-sign{opacity:0}
.ride-scene.road-scene-ready > .road-sign{opacity:1;transition:opacity .28s ease}

.road-world{
  position:absolute;
  inset:0;
  overflow:hidden;
  z-index:1;
  pointer-events:none;
  opacity:0;
  transition:opacity .34s ease;
  transform:translateZ(0);
}
.ride-scene.road-scene-ready .road-world{opacity:1}
.road-layer{position:absolute;left:-2%;right:-2%;background-repeat:repeat-x;will-change:background-position;transform:translateZ(0)}
.road-loop-track{position:absolute;left:0;top:0;height:100%;display:flex;width:max-content;will-change:transform;transform:translateZ(0)}

.road-panorama-frame{position:absolute;z-index:1;left:-6%;right:-6%;bottom:31%;height:63%;overflow:hidden}
.road-panorama-segment{position:relative;flex:0 0 auto;height:100%}
.road-panorama-image{display:block;width:auto;height:100%;max-width:none;opacity:.94;filter:saturate(.9) contrast(.98);user-select:none;-webkit-user-drag:none}
.road-panorama-seam{
  position:absolute;z-index:2;right:0;bottom:-4%;height:105%;width:auto;max-width:none;
  transform:translateX(50%);opacity:.88;filter:saturate(.76) brightness(.76) contrast(.98);
  -webkit-mask-image:linear-gradient(90deg,transparent 0%,#000 18%,#000 82%,transparent 100%);
  mask-image:linear-gradient(90deg,transparent 0%,#000 18%,#000 82%,transparent 100%);
  user-select:none;-webkit-user-drag:none;
}

.road-village-frame{
  position:absolute;z-index:4;left:-8%;right:-8%;bottom:-10%;height:102%;overflow:hidden;
  opacity:.99;filter:saturate(.95) brightness(.92) contrast(1.03);
}
.road-village-sequence{position:relative;display:flex;align-items:flex-end;flex:0 0 auto;height:100%;transform:translateY(0)}
.road-village-strip{
  display:block;flex:0 0 auto;width:auto;height:100%;max-width:none;margin-right:-2px;
  object-fit:contain;object-position:bottom center;user-select:none;-webkit-user-drag:none;
}
.road-village-prop{
  position:absolute;z-index:5;display:block;width:auto;max-width:none;opacity:1;visibility:visible;
  pointer-events:none;user-select:none;-webkit-user-drag:none;filter:drop-shadow(0 5px 5px rgba(0,0,0,.22));
}
.road-village-dog{left:61%;bottom:23%;height:9.5%}
.road-village-pakse-sign{left:53%;bottom:23%;height:12%}

.road-foliage{
  z-index:3;bottom:27%;height:50%;background-image:url('road-animation/foliage-strip.webp');
  background-size:auto 100%;background-position:0 100%;filter:saturate(.82) brightness(.62) contrast(1.03);opacity:.92;
}
.road-haze{position:absolute;z-index:5;left:0;right:0;bottom:32%;height:22%;background:linear-gradient(180deg,transparent,rgba(231,202,155,.11),transparent);filter:blur(7px);opacity:.55}
.road-asphalt{
  z-index:6;left:-5%;right:-5%;bottom:-10%;height:49%;background-image:url('road-animation/road-seamless.webp');
  background-size:auto 100%;background-position:0 50%;filter:brightness(.8) saturate(.72);
}
.road-asphalt::after{content:"";position:absolute;left:0;right:0;bottom:0;height:34%;background:linear-gradient(180deg,transparent,rgba(12,10,9,.27))}

.road-moving-prop{
  position:absolute;display:block;width:auto;height:auto;max-width:none;user-select:none;-webkit-user-drag:none;
  will-change:transform;filter:drop-shadow(0 5px 5px rgba(0,0,0,.22));
}

/* Frozen desktop/tablet prop sizing: no vw shrink when the browser window is narrowed. */
.road-tuktuk{
  z-index:8;
  right:-280px;
  bottom:13.6%;
  width:260px;
  opacity:1;
  filter:saturate(.9) brightness(.88) drop-shadow(0 5px 5px rgba(0,0,0,.24));
}
.road-chicken{z-index:8;left:-70px;bottom:17.7%;width:52px;opacity:.96}

.road-trike-stage{
  position:absolute;z-index:9;left:7%;bottom:11.8%;width:min(37vw,388px);aspect-ratio:926/548;
  transform-origin:50% 82%;will-change:transform;overflow:visible;
}
.road-trike-shadow{position:absolute;z-index:0;left:5%;width:90%;bottom:-3.5%;opacity:.6;filter:blur(.4px);transform-origin:center}
.road-trike-dust{
  position:absolute;z-index:1;left:-19%;top:66%;width:39%;height:auto;opacity:0;transform-origin:72% 70%;
  user-select:none;-webkit-user-drag:none;filter:saturate(.7) brightness(.86);
}
.road-trike-machine{position:absolute;inset:0;z-index:2;transform-origin:50% 82%;will-change:transform;overflow:visible}
.road-trike-body{
  position:absolute;inset:0;width:100%;height:100%;object-fit:contain;z-index:3;user-select:none;-webkit-user-drag:none;
  filter:drop-shadow(0 9px 8px rgba(0,0,0,.24));transform-origin:91% 72%;transform:translateY(-1.1%) rotate(.8deg);
}
.road-trike-wheel{
  position:absolute;width:24.3%;height:auto;object-fit:contain;z-index:2;will-change:transform;transform-origin:50% 50%;
  user-select:none;-webkit-user-drag:none;filter:drop-shadow(0 3px 3px rgba(0,0,0,.22));
}
.road-trike-wheel.rear{left:5.62%;top:62.85%}
.road-trike-wheel.front{left:85.85%;top:59.25%}

.road-sign.road-sign-upgraded{top:13%;right:6.5%;z-index:11;max-width:46%;text-align:right;color:#fff9ed;text-shadow:0 2px 8px rgba(0,0,0,.58)}
.road-sign.road-sign-upgraded small{display:block;margin-bottom:6px;color:#ead0a2;font-size:8px;font-weight:900;letter-spacing:.2em;text-transform:uppercase}
.road-sign.road-sign-upgraded strong{font-size:clamp(25px,3.1vw,45px);line-height:.98}
.road-sign.road-sign-upgraded span{display:block;margin-top:8px;font-size:10px;letter-spacing:.11em;line-height:1.4}

@media(max-width:1100px){
  .road-village-frame{height:96%;bottom:-9%}
  .road-village-dog,.road-village-pakse-sign{bottom:23.5%}
  .road-trike-stage{left:5%;width:min(40vw,344px);bottom:12%}
  .road-sign.road-sign-upgraded{top:12%;right:4%;max-width:45%}
}
@media(max-width:850px){
  .ride-scene.road-animated{min-height:52svh}
  .road-panorama-frame{bottom:31%;height:62%}
  .road-panorama-seam{height:101%;opacity:.82}
  .road-village-frame{height:88%;bottom:-8%;opacity:.98}
  .road-village-dog,.road-village-pakse-sign{bottom:24%}
  .road-village-dog{height:10%}
  .road-village-pakse-sign{height:12.5%}
  .road-foliage{height:48%;bottom:27%}
  .road-asphalt{bottom:-9%;height:48%}
  .road-trike-stage{left:5%;bottom:11%;width:min(51vw,360px)}
  .road-sign.road-sign-upgraded{top:11%;right:5%;max-width:43%}
}
@media(max-width:600px){
  .ride-scene.road-animated{min-height:48svh}
  .road-panorama-frame{left:-10%;right:-10%;bottom:32%;height:57%}
  .road-panorama-seam{height:96%;opacity:.78}
  .road-village-frame{height:78%;bottom:-6.5%;opacity:.97}
  .road-village-dog,.road-village-pakse-sign{bottom:25%}
  .road-village-dog{height:10.5%}
  .road-village-pakse-sign{height:13%}
  .road-foliage{height:43%;bottom:29%;filter:saturate(.8) brightness(.6) contrast(1.04)}
  .road-asphalt{height:51%;bottom:-11%}
  .road-trike-stage{left:4%;bottom:10%;width:min(64vw,292px)}
  .road-trike-body{transform:translateY(-.9%) rotate(.7deg)}
  .road-trike-wheel.rear{left:5.64%;top:62.72%}
  .road-sign.road-sign-upgraded{top:10%;right:4%;max-width:42%}
  .road-sign.road-sign-upgraded strong{font-size:25px}
  .road-sign.road-sign-upgraded span{font-size:8px;letter-spacing:.08em}
  .road-sign.road-sign-upgraded small{font-size:7px}
  .road-tuktuk{right:-190px;bottom:12.7%;width:170px;opacity:1}
  .road-chicken{left:-46px;bottom:18%;width:34px}
  .road-trike-dust{left:-18%;top:67%;width:36%}
}
@media(prefers-reduced-motion:reduce){
  .road-loop-track,.road-layer,.road-moving-prop,.road-trike-stage,.road-trike-machine,.road-trike-wheel,.road-trike-shadow,.road-trike-dust{will-change:auto!important}
  .road-moving-prop,.road-trike-dust{display:none!important}
  .road-world{transition:none!important}
}
