/* Optional motion layer: warm, quiet feedback that leaves the current layout intact. */
#reading-progress {
  position: fixed;
  inset: 0 0 auto;
  z-index: 9999;
  height: 3px;
  pointer-events: none;
  background: rgba(197, 164, 109, .12);
}

#reading-progress > span {
  display: block;
  width: 100%;
  height: 100%;
  transform: scaleX(0);
  transform-origin: left center;
  background: #c5a46d;
  will-change: transform;
}

@media (hover: hover) and (pointer: fine) and (prefers-reduced-motion: no-preference) {
  #services .service-card:not(:nth-child(2))::before {
    transition: transform 700ms cubic-bezier(.2, .65, .3, 1);
  }

  #services .service-card:not(:nth-child(2)):hover::before,
  #services .service-card:not(:nth-child(2)):focus-visible::before {
    transform: scale(1.035);
  }

  .service-overlay-card.has-image > img {
    transition: transform 700ms cubic-bezier(.2, .65, .3, 1);
  }

  .service-overlay-card.has-image:hover > img,
  .service-overlay-card.has-image:focus-within > img {
    transform: scale(1.035);
  }
}

.estimate-total.is-changing {
  animation: estimate-value-nudge 420ms cubic-bezier(.2, .65, .3, 1);
  transform-origin: center;
}

@keyframes estimate-value-nudge {
  0% { transform: scale(1); }
  48% { transform: scale(1.045); }
  100% { transform: scale(1); }
}

@media (prefers-reduced-motion: reduce) {
  #reading-progress > span,
  .estimate-total.is-changing {
    animation: none !important;
    transition: none !important;
  }
}