/* =====================================================================
   Riverside Holdings — animations.css
   Initial (pre-animation) states for GSAP-driven reveals + reduced motion.
   Elements get their final state from animations.js; if JS fails, the
   .rs-no-js fallback (added by main.js absence) keeps content visible.
   ===================================================================== */

/* Default hidden states only apply when motion is enabled + JS present. */
.rs-has-motion.js .rs-reveal,
.rs-has-motion.js .rs-reveal-left,
.rs-has-motion.js .rs-reveal-right,
.rs-has-motion.js .rs-hero-content > * {
  opacity: 0;
  will-change: transform, opacity;
}
.rs-has-motion.js .rs-reveal { transform: translateY(35px); }
.rs-has-motion.js .rs-reveal-left { transform: translateX(-40px); }
.rs-has-motion.js .rs-reveal-right { transform: translateX(40px); }
.rs-has-motion.js .rs-hero-content > * { transform: translateY(35px); }

.rs-image-reveal { overflow: hidden; }
.rs-has-motion.js .rs-image-reveal img { transform: scale(1.05); }

/* Timeline progress line */
.rs-timeline { position: relative; }
.rs-timeline::before { content: ""; position: absolute; left: 20px; top: 0; bottom: 0; width: 2px; background: var(--rs-border); }
.rs-timeline__progress { position: absolute; left: 20px; top: 0; width: 2px; height: 0; background: var(--rs-primary); }

/* Counters keep layout stable */
.rs-counter { font-variant-numeric: tabular-nums; }

/* Reduced motion: reveal everything instantly, no transforms */
@media (prefers-reduced-motion: reduce) {
  .rs-has-motion.js .rs-reveal,
  .rs-has-motion.js .rs-reveal-left,
  .rs-has-motion.js .rs-reveal-right,
  .rs-has-motion.js .rs-hero-content > *,
  .rs-has-motion.js .rs-image-reveal img {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
  }
  html { scroll-behavior: auto !important; }
}
