/* DriveReady home page — scroll effects (1.8.8).
   Loaded only on the front page, after home.css. All pre-animation
   states live behind classes that scroll.js adds (.drhs-*), so with
   JS disabled or reduced motion, everything renders in its final
   state and nothing is ever hidden by CSS alone. */

/* Smooth anchor scrolling (e.g. the FAQ nav link). */
html { scroll-behavior: smooth; }
#faq { scroll-margin-top: 88px; }

/* 1. Scroll progress bar — element is created by scroll.js. */
.drhs-progress { position: fixed; top: 0; left: 0; z-index: 9999;
	width: 100%; height: 3px; transform-origin: left center;
	transform: scaleX(0); pointer-events: none;
	background: linear-gradient(90deg, #3560e6, #4c9d6b); }

/* 5. Header shadow once the page is scrolled a few pixels. */
.drh-header { transition: box-shadow .3s ease; }
.drh-header.drhs-scrolled { box-shadow: 0 6px 24px rgba(16, 29, 58, .10); }

/* 2. Reveal on scroll — .drhs-rv is the JS-added pre-reveal state;
   scroll.js removes both classes after the transition finishes so
   hover effects behave exactly as before. */
.drhs-rv { opacity: 0; transform: translateY(32px); }
.drhs-rv.drhs-rv--in { opacity: 1; transform: none;
	transition: opacity .8s ease-out, transform .8s ease-out; }

/* Reduced motion: no smooth scrolling, no transitions. */
@media (prefers-reduced-motion: reduce) {
	html { scroll-behavior: auto; }
	.drh-header { transition: none; }
}