/* Cinematic atmosphere: finite scroll motion, no autoplay, no text overlays.
   Raster lamp anchors measured from the actual 966 × 527 truck cutout. */
.hero-atmosphere,.journey-atmosphere { position:absolute; inset:0; pointer-events:none; z-index:-1; overflow:hidden; }
.hero-shade,.journey-shade { z-index:0; pointer-events:none; }
.hero-atmosphere > div,.journey-atmosphere > div { position:absolute; pointer-events:none; }
.hero-photo { transform:scale(1.12); }
.hero-mist-far {
  inset:24% -10% 8% 28%; opacity:.35;
  background:radial-gradient(ellipse at 70% 55%,rgba(200,211,184,.28),transparent 65%),radial-gradient(ellipse at 35% 72%,rgba(220,211,177,.19),transparent 55%);
}
.hero-mist-near {
  inset:63% -14% -12% 15%; opacity:.45;
  background:radial-gradient(ellipse at 70% 45%,rgba(208,215,187,.32),transparent 57%),radial-gradient(ellipse at 26% 73%,rgba(180,199,177,.23),transparent 50%);
}
.hero-light-shaft {
  inset:-20% -12% 0 48%; opacity:.2; transform:rotate(-18deg);
  background:linear-gradient(100deg,transparent 29%,rgba(232,219,176,.13) 38%,rgba(244,232,191,.28) 42%,transparent 52%);
  mask-image:linear-gradient(transparent,black 25%,transparent 95%);
}
/* Preserve the raster aspect ratio instead of letterboxing in a wider img box.
   The 46svh cap now constrains width, keeping lamp % and lens pixels aligned. */
.hero-vehicle .vehicle-rig { width:min(100%,84.3188svh); margin-left:auto; transition:none; }
.hero-vehicle:hover .vehicle-rig { transform:none; }
.hero-vehicle .truck-base-img { width:100%; height:auto; max-height:none; aspect-ratio:966 / 527; }
.hero-vehicle { pointer-events:none; right:5%; }
.truck-headlight-source {
  position:absolute; left:95.755694%; top:73.434535%; width:1.2%; height:2.7%;
  transform:translate(-50%,-50%); border-radius:50%; z-index:4; pointer-events:none;
  background:radial-gradient(ellipse,#fff9df 10%,rgba(255,226,164,.76) 38%,transparent 75%);
  box-shadow:0 0 7px 2px rgba(255,230,170,.28);
}
.hero-vehicle .truck-headlight-beam {
  left:95.755694%; right:auto; top:73.434535%; width:32%; height:16%;
  transform:translateY(-50%) rotate(4deg); transform-origin:0 50%;
  background:radial-gradient(ellipse at 0 50%,rgba(255,238,184,.5),rgba(242,222,175,.16) 35%,transparent 74%);
  clip-path:polygon(0 44%,100% 0,100% 100%,0 56%);
  filter:none; opacity:.7; animation:none; z-index:3;
}
/* Side-facing rear fixture is amber, not a floating red brake-light dot. */
.hero-vehicle .truck-taillight-marker {
  left:2.898551%; top:75.711575%; width:1%; height:3.2%;
  transform:translate(-50%,-50%); background:rgba(235,139,51,.5);
  box-shadow:0 0 5px 1px rgba(221,117,38,.35); border-radius:40%;
  animation:none; opacity:.8;
}
.journey-layer { transform:scale(1.10); }
.journey-mist {
  inset:34% -12% -6% 18%; opacity:.38;
  background:radial-gradient(ellipse at 60% 35%,rgba(210,221,195,.25),transparent 62%),radial-gradient(ellipse at 88% 68%,rgba(202,215,181,.2),transparent 50%);
}
.journey-water-glints {
  inset:50% -8% 2% 36%; opacity:0;
  background:repeating-linear-gradient(177deg,transparent 0 17px,rgba(238,229,194,.18) 18px,transparent 20px 37px);
  mask-image:radial-gradient(ellipse,black 5%,transparent 67%);
}
.journey-wake {
  position:absolute; pointer-events:none; right:23%; bottom:32%; width:30%; height:3%; z-index:1; opacity:0;
  background:repeating-radial-gradient(ellipse at 95% 50%,transparent 0 17%,rgba(234,225,194,.24) 19%,transparent 22% 28%);
  mask-image:linear-gradient(90deg,transparent,black 35%,transparent);
}
.journey-pickup,.journey-boat { z-index:2; }
@media(min-width:761px) and (max-width:1000px), (min-width:761px) and (max-height:699px) {
  .journey-wake { right:8%; bottom:19%; width:32%; }
}
@media(max-width:760px) {
  .hero-mist-far { left:8%; }
  .hero-mist-near { left:-15%; opacity:.32; }
  .hero-light-shaft { left:25%; opacity:.15; }
  .journey-water-glints { left:5%; }
  .journey-wake { right:14%; bottom:14%; width:72%; }
}
.motion-off .hero-mist-far,.motion-off .hero-mist-near,.motion-off .hero-light-shaft,
.motion-off .journey-mist,.motion-off .journey-water-glints,.motion-off .journey-wake { transform:none !important; }
.motion-off .journey-water-glints,.motion-off .journey-wake { opacity:0 !important; }
@media(prefers-reduced-motion:reduce) {
  .hero-mist-far,.hero-mist-near,.hero-light-shaft,.journey-mist,.journey-water-glints,.journey-wake { transform:none !important; }
  .journey-water-glints,.journey-wake { opacity:0 !important; }
}