/* Responsive image wrappers preserve the existing grid / flex geometry. */
.responsive-picture { display: contents; }
@media (max-width: 800px), (pointer: coarse) {
  .main-story .scene-one { background-image: url('assets/mobile/pathway-illustration-1.webp'); background-size: 100% 100%; background-position: left top; }
  .main-story .scene-two { background-image: url('assets/mobile/pathway-illustration-2.webp'); background-size: 100% 100%; background-position: left top; }
  .main-story .scene-three { background-image: url('assets/mobile/pathway-illustration-3.webp'); background-size: 100% 100%; background-position: left top; }
  .main-story .scene-four { background-image: url('assets/mobile/pathway-illustration-4.webp'); background-size: 100% 100%; background-position: left top; }
  .early .e-scene.scene-left { background-image: url('assets/mobile/early-exploration-1.webp'); background-size: 100% 100%; background-position: left top; }
  .early .e-scene.scene-center { background-image: url('assets/mobile/early-exploration-2.webp'); background-size: 100% 100%; background-position: left top; }
  .early .e-scene.scene-right { background-image: url('assets/mobile/early-exploration-3.webp'); background-size: 100% 100%; background-position: left top; }
  .early .e-guide-feedback { background-image: url('assets/mobile/early-guides-orange-1.webp'); background-size: 100% auto; background-position: left top; }
  .early .e-guide-consult { background-image: url('assets/mobile/early-guides-orange-2.webp'); background-size: 100% auto; background-position: left top; }
  .early .e-guide-faq { background-image: url('assets/mobile/early-guides-orange-3.webp'); background-size: 100% auto; background-position: left top; }
  .business .example:nth-child(1) .scene { background-image: url('assets/mobile/business-learning-scenes-1.webp'); background-size: 100% 100%; background-position: left top; }
  .business .scene.scene-two { background-image: url('assets/mobile/business-learning-scenes-2.webp'); background-size: 100% 100%; background-position: left top; }
  .business .scene.scene-three { background-image: url('assets/mobile/business-learning-scenes-3.webp'); background-size: 100% 100%; background-position: left top; }
}