.scroll-progress {
  position: fixed;
  inset: 0 0 auto;
  height: 3px;
  z-index: 120;
  pointer-events: none;
  background: var(--blue, #2451f5);
  transform: scaleX(var(--scroll-progress, 0));
  transform-origin: left center;
}
.scroll-ready .site-header {
  position: sticky;
  top: 0;
  z-index: 60;
  transition: box-shadow 180ms ease;
}
.scroll-ready .site-header[data-scrolled] {
  box-shadow: 0 8px 24px -15px rgb(17 26 41 / 32%);
}
.scroll-reveal {
  opacity: 1;
  translate: 0 0;
}
@media (prefers-reduced-motion: no-preference) {
  .scroll-reveals-ready .scroll-reveal {
    transition: opacity 600ms ease, translate 600ms cubic-bezier(.22, .61, .36, 1);
  }
  .scroll-reveals-ready .scroll-reveal:not(.is-revealed) {
    opacity: 0;
    translate: 0 22px;
  }
  .scroll-ready .design-lab .lab-canvas {
    background-position: 0 var(--scroll-offset, 0px), var(--scroll-offset, 0px) 0;
  }
  .scroll-ready .design-lab .lab-orbit {
    rotate: var(--scroll-rotate, 0deg);
  }
  .scroll-ready .path-display .line {
    rotate: var(--scroll-rotate, 0deg);
  }
  .scroll-ready .path-display .line:nth-child(2) {
    rotate: calc(var(--scroll-rotate, 0deg) * -1);
  }
}
.scroll-reveals-ready .scroll-reveal:focus-within {
  opacity: 1;
  translate: none;
  transition: none;
}
@media (prefers-reduced-motion: reduce) {
  .scroll-ready .site-header,
  .scroll-reveals-ready .scroll-reveal { transition: none; }
  .scroll-reveals-ready .scroll-reveal {
    opacity: 1;
    translate: none;
  }
  .scroll-ready .design-lab .lab-canvas { background-position: 0 0; }
  .scroll-ready .design-lab .lab-orbit,
  .scroll-ready .path-display .line { rotate: none; }
}
@media print {
  .scroll-progress { display: none; }
  .scroll-ready .site-header { position: static; box-shadow: none; }
  .scroll-reveals-ready .scroll-reveal {
    opacity: 1 !important;
    translate: none !important;
    transition: none !important;
  }
  .scroll-ready .design-lab .lab-canvas { background-position: 0 0; }
  .scroll-ready .design-lab .lab-orbit,
  .scroll-ready .path-display .line { rotate: none !important; }
}
