/* ===========================================================
   Venless Solution Ltd — Motion Layer
   Scroll-reveal, animated counters, subtle parallax.
   Loaded after style.css; respects prefers-reduced-motion via
   the existing rule in style.css (motion is disabled there for
   users who've asked for it — this file just defines the motion
   itself).
   =========================================================== */

/* ---------- Scroll reveal ---------- */
[data-reveal]{
  opacity:0;
  transform:translateY(28px);
  transition:opacity 0.7s cubic-bezier(0.16,1,0.3,1), transform 0.7s cubic-bezier(0.16,1,0.3,1);
  will-change:opacity, transform;
}
[data-reveal].is-visible{
  opacity:1;
  transform:translateY(0);
}

/* Staggered children within a revealed group */
[data-reveal-group] > *{
  opacity:0;
  transform:translateY(22px);
  transition:opacity 0.6s cubic-bezier(0.16,1,0.3,1), transform 0.6s cubic-bezier(0.16,1,0.3,1);
}
[data-reveal-group].is-visible > *{
  opacity:1;
  transform:translateY(0);
}
[data-reveal-group].is-visible > *:nth-child(1){ transition-delay:0.03s; }
[data-reveal-group].is-visible > *:nth-child(2){ transition-delay:0.09s; }
[data-reveal-group].is-visible > *:nth-child(3){ transition-delay:0.15s; }
[data-reveal-group].is-visible > *:nth-child(4){ transition-delay:0.21s; }
[data-reveal-group].is-visible > *:nth-child(5){ transition-delay:0.27s; }
[data-reveal-group].is-visible > *:nth-child(6){ transition-delay:0.33s; }
[data-reveal-group].is-visible > *:nth-child(7){ transition-delay:0.39s; }
[data-reveal-group].is-visible > *:nth-child(8){ transition-delay:0.45s; }
[data-reveal-group].is-visible > *:nth-child(9){ transition-delay:0.51s; }
[data-reveal-group].is-visible > *:nth-child(10){ transition-delay:0.57s; }
[data-reveal-group].is-visible > *:nth-child(11){ transition-delay:0.63s; }

/* If JS never runs (fails to load, disabled), don't leave content
   permanently hidden — this is the no-JS / failure fallback. */
.no-js [data-reveal],
.no-js [data-reveal-group] > *{
  opacity:1;
  transform:none;
}

/* ---------- Animated counters ---------- */
.stat-num[data-count-to]{
  font-variant-numeric:tabular-nums;
}

/* ---------- Hero background drift ---------- */
.schematic-bg{
  transition:transform 0.2s ease-out;
}

/* ---------- Card hover lift (already present on leader-card;
   extending the same language to eco-card and track-card for
   consistency) ---------- */
.eco-card,
.track-card{
  transition:transform 0.25s ease, background 0.2s ease, border-color 0.25s ease;
}
.eco-card:hover{
  transform:translateY(-3px);
}
.track-card:hover{
  transform:translateY(-3px);
  border-color:var(--cyan-dim);
}

/* ---------- Button press feedback ---------- */
.btn{
  transition:all 0.2s ease, transform 0.1s ease;
}
.btn:active{
  transform:scale(0.98);
}

/* ---------- Gallery item entrance stagger (uses reveal-group) --- */
.gallery-grid{
  /* handled via [data-reveal-group] on the parent in HTML */
}

@media (prefers-reduced-motion: reduce){
  [data-reveal], [data-reveal-group] > *{
    transition:none !important;
    opacity:1 !important;
    transform:none !important;
  }
  .eco-card:hover, .track-card:hover{ transform:none; }
}