.hero-image[data-slide-art] {
  --slide-photo: url('/owner-assets/auron-e7.jpg');
  background: var(--slide-photo) center 55% / cover no-repeat;
  filter: none;
}
.hero-image[data-slide-art="1"] { --slide-photo: url('/owner-assets/auron-s7.jpg'); }
.hero-image[data-slide-art="2"] { --slide-photo: url('/owner-assets/auron-s5.jpg'); }
.hero-image[data-slide-art="3"] { --slide-photo: url('/owner-assets/auron-x8.jpg'); }

.hero-overlay {
  background: linear-gradient(90deg, #0a0e18f2, #101726d9 52%, #101726bd),
              linear-gradient(0deg, #0b101b 0%, transparent 70%);
}
.hero-image[data-slide-art]::after {
  content: '';
  position: absolute;
  z-index: 1;
  top: 100px;
  right: max(28px, calc((100% - 1200px) / 2));
  width: min(39vw, 500px);
  height: 250px;
  background: var(--slide-photo) center / contain no-repeat;
  filter: drop-shadow(0 16px 24px #0006);
  animation: hero-car-float 5s ease-in-out infinite;
}

@keyframes hero-car-float {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-6px); }
}

@media (prefers-reduced-motion: reduce) {
  .hero-image[data-slide-art]::after { animation: none; }
}

.login-backdrop {
  background-image: linear-gradient(90deg, #0a1220d9, #0a122063 55%, #0a12204d),
                    var(--login-photo, url('/owner-assets/auron-s7.jpg'));
  background-position: center 60%;
}
.puzzle-scene[data-variant] {
  background-image: url('/owner-assets/auron-s5.jpg');
  background-position: center 51%;
}
.puzzle-scene[data-variant="1"] { background-image: url('/owner-assets/auron-x8.jpg'); }
.puzzle-scene[data-variant="2"] { background-image: url('/owner-assets/auron-e7.jpg'); }
.vehicle-art[data-model-art] img { object-position: center; filter: none; }

@media (max-width: 760px) {
  .hero-image[data-slide-art] { background-position: 57% 50%; }
  .hero-image[data-slide-art]::after { display: none; }
  .hero-overlay { background: linear-gradient(90deg, #0a0d17ed, #101724bb 70%, #10172491); }
}