/* Hotspots follow image coordinates, not the viewport. */
.photo-canvas{position:absolute;right:0;top:50%;transform:translateY(-50%);isolation:isolate}
.scene-visual .photo-canvas .home-photo{position:absolute;inset:0;width:100%;height:100%;max-width:none;object-fit:fill;object-position:center}
.scene-visual .hero-sim:after,.motion-hero[data-scene=night] .scene-visual .hero-sim:after{display:none}
.photo-canvas .roof-hotspot{left:53%;top:16%;right:auto;bottom:auto}
.photo-canvas .car-hotspot{left:9%;top:76%;right:auto;bottom:auto}
.photo-canvas .battery-hotspot{right:3%;top:auto;bottom:10%;left:auto;flex-direction:row}
.photo-canvas .battery-hotspot .hotspot-dot{font-size:17px}
.photo-canvas .scene-note{top:auto;right:12px;bottom:8px;left:auto;font-size:10px;line-height:1.5;background:#102d23cc;padding:5px 8px;letter-spacing:.015em;z-index:3}
@media(min-width:801px){.motion-intro{width:32%;max-width:32%;padding-right:12px}.motion-intro h1{font-size:clamp(40px,4vw,64px)}.motion-intro h1 em{white-space:normal}.motion-intro .eyebrow{font-size:11px;letter-spacing:.04em}.motion-intro>p:not(.eyebrow){font-size:16px;max-width:250px}.scene-visual .hero-sim{background:#234633}.motion-hero[data-scene=night] .scene-visual .hero-sim{background:#102d23}}
@media(max-width:560px){.photo-canvas .roof-hotspot{left:47%;top:13%}.photo-canvas .car-hotspot{left:4%;top:70%}.photo-canvas .battery-hotspot{right:2%;bottom:15%}.photo-canvas .scene-note{font-size:8px;bottom:4px;right:6px;padding:3px 5px}.photo-canvas .scene-hotspot .hotspot-copy{font-size:10px}.photo-canvas .scene-hotspot{min-height:36px;padding:4px 7px 4px 4px}.photo-canvas .hotspot-copy b{margin-left:3px}}
@media(min-width:801px){.scene-visual .motion-universe{inset:88px 0 0}.motion-header{width:100%;padding-inline:48px;background:#234633}.motion-hero[data-scene=night] .motion-header{background:#102d23}.motion-intro h1{font-size:clamp(40px,3.7vw,60px)}.motion-intro>p:not(.eyebrow){max-width:265px}}
@media(min-width:1600px){.motion-header{padding-inline:72px}}