/* Scanner-only horizontal sections: the scroll area reaches the viewport edges. */
.scanner-page {
  --scanner-feature-inset: max(24px, calc((100% - 1000px) / 2));
  --scanner-industry-inset: max(var(--layout-gutter), calc((100% - var(--layout-limit)) / 2 + var(--layout-gutter)));
}

.scanner-page :is(.feature-gallery, .industry-rail) {
  width: 100%;
  max-width: none;
  margin-inline: 0;
}

.scanner-page .feature-gallery { scroll-padding-inline: var(--scanner-feature-inset); }
.scanner-page .gallery-track { padding-inline: var(--scanner-feature-inset); }
.scanner-page .feature-card { flex-basis: 1000px; }

.scanner-page .industry-rail {
  padding-inline: var(--scanner-industry-inset);
  scroll-padding-inline: var(--scanner-industry-inset);
}

.scanner-page .has-mouse-drag { cursor: grab; }
.scanner-page .has-mouse-drag img { -webkit-user-drag: none; }
.scanner-page .has-mouse-drag.is-mouse-dragging {
  cursor: grabbing;
  scroll-snap-type: none;
  scroll-behavior: auto;
  user-select: none;
  -webkit-user-select: none;
}
.scanner-page .has-mouse-drag.is-mouse-dragging * { cursor: grabbing; }

/* The original photo stays still; a diagonal light sweep passes over it. */
.scanner-page .proof-image--laptop {
  position: relative;
  isolation: isolate;
  border-radius: 32px;
  background: #2b2c30;
}
.scanner-page .proof-image--laptop::after {
  content: "";
  position: absolute;
  top: -30%;
  bottom: -30%;
  left: -60%;
  width: 30%;
  z-index: 2;
  pointer-events: none;
  background: linear-gradient(90deg, transparent, #ffffff2e, transparent);
  opacity: 0;
  transform: skewX(-23deg);
  animation: scanner-laptop-sheen 4s ease-in-out infinite;
}
.scanner-page .proof-image--laptop img {
  position: relative;
  z-index: 1;
  width: 100%;
  height: auto;
  min-height: 0;
  object-fit: contain;
  object-position: center;
  opacity: 1;
  transform: none;
  animation: none;
}
@keyframes scanner-laptop-sheen {
  0%, 18% { left: -60%; opacity: 0; }
  25% { opacity: 1; }
  72%, 100% { left: 145%; opacity: 0; }
}

@media (max-width: 1095.98px) {
  .scanner-page .feature-card { flex-basis: calc(100vw - 96px); }
}
@media (max-width: 575.98px) {
  .scanner-page { --scanner-feature-inset: 24px; }
  .scanner-page .feature-card { flex-basis: calc(100vw - 70px); }
  .scanner-page .proof-image--laptop { border-radius: 24px; }
}
@media (max-width: 374px) {
  .scanner-page .feature-card { flex-basis: calc(100vw - 57px); }
}
@media (prefers-reduced-motion: reduce) {
  .scanner-page .proof-image--laptop::after { animation: none; opacity: 0; }
}