/* Secondary product reveal retains its existing portrait presentation. */
.reveal { --ink: #091422; }
.handpiece-media { width: min(100%, 310px); margin: 64px auto 0; }
@media (min-width: 600px) and (max-width: 999px) {
  .handpiece-media { width: 340px; }
}
@media (min-width: 1000px) {
  .handpiece-media { width: min(100%, 400px); margin-top: 76px; }
}

/* Complete before/after artwork, framed without video masks or overlays. */
.hero-results { width: min(100%, 440px); margin: 28px auto 20px; padding: 6px; border: 1px solid #a5c8e14d; border-radius: 12px; background: #122338; box-shadow: 0 20px 60px #0005, 0 0 40px #75bcdf0d; }
.hero-results img { display: block; width: 100%; height: auto; border-radius: 6px; }
@media (min-width: 1000px) {
  .hero-results { width: min(100%, 480px); margin: 32px auto; }
}