/* Small, finite motion. Content remains visible when JavaScript is unavailable. */
.header::after {
  content: "";
  position: absolute;
  inset: auto 0 -1px;
  height: 2px;
  background: var(--orange);
  transform: scaleX(var(--reading-progress, 0));
  transform-origin: left;
  pointer-events: none;
}

.desktop-nav a { position: relative; }
.desktop-nav a::after {
  content: "";
  position: absolute;
  inset: auto 0 -7px;
  height: 1px;
  background: currentColor;
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 220ms ease;
}
.desktop-nav a:hover::after,
.desktop-nav a:focus-visible::after { transform: scaleX(1); }

.button > span, .nav-cta > span, .text-link > span {
  display: inline-block;
  transition: transform 220ms cubic-bezier(.2,.7,.2,1);
}
.button:hover > span, .button:focus-visible > span,
.nav-cta:hover > span, .nav-cta:focus-visible > span,
.text-link:hover > span, .text-link:focus-visible > span {
  transform: translate(3px, -3px);
}
.reset-view { transition: color 200ms, background 200ms, transform 300ms; }
.reset-view:hover { transform: rotate(-35deg); }
.step-arrow { transition: transform 240ms ease, color 240ms ease; }
.step.active .step-arrow { transform: translate(3px, -3px); }
.model-controls input::-webkit-slider-thumb { transition: box-shadow 180ms ease; }
.model-controls input::-moz-range-thumb { transition: box-shadow 180ms ease; }
.model-controls input:focus-visible::-webkit-slider-thumb,
.model-controls input:hover::-webkit-slider-thumb { box-shadow: 0 0 0 5px #e967351a; }
.model-controls input:focus-visible::-moz-range-thumb,
.model-controls input:hover::-moz-range-thumb { box-shadow: 0 0 0 5px #e967351a; }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; }
}
