.scroll-progress {
  position: fixed;
  z-index: 40;
  inset: 0 auto auto 0;
  height: 3px;
  width: 0;
  background: var(--orange);
  box-shadow: 0 0 14px rgba(255, 90, 31, .55);
}

.site-header {
  transition: height .35s, box-shadow .35s;
}

.site-header.scrolled {
  height: 68px;
  box-shadow: 0 12px 35px rgba(10, 14, 17, .1);
}

.hero h1 .title-line {
  display: block;
  color: white;
  opacity: 0;
  transform: translateY(55px);
  animation: titleRise .8s cubic-bezier(.2, .75, .25, 1) forwards;
}

.hero h1 .title-line:nth-child(2) { animation-delay: .12s; }
.hero h1 .title-line:nth-child(3) { animation-delay: .24s; }
.hero h1 .title-line.accent { color: var(--orange); }

.ring-one { animation: slowSpin 32s linear infinite; }
.ring-two { animation: reverseSpin 20s linear infinite; }
.machine-visual { transition: transform .15s linear; }

.machine-row {
  transition: padding .3s, background .3s, border-color .3s;
}

.machine-row:hover {
  padding-left: 18px;
  padding-right: 18px;
  background: rgba(255, 255, 255, .035);
  border-color: var(--orange);
}

.reveal {
  transform: translateY(28px);
  transition: opacity .75s cubic-bezier(.2, .75, .25, 1), transform .75s cubic-bezier(.2, .75, .25, 1);
  transition-delay: var(--reveal-delay, 0ms);
}

@keyframes titleRise {
  to { opacity: 1; transform: none; }
}

@keyframes slowSpin {
  to { transform: rotate(360deg); }
}

@keyframes reverseSpin {
  to { transform: rotate(-360deg); }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .reveal,
  .hero h1 .title-line,
  .site-header,
  .machine-visual,
  .machine-row,
  .service-card {
    animation: none !important;
    transition: none !important;
    opacity: 1;
    transform: none;
  }
  .scroll-progress { display: none; }
}