/* ==========================================================================
   SAIMEN CONSTRUCTION COMPANY — ANIMATIONS
   Scroll reveals, floating elements, blueprint draw-in, ripple, counters.
   ========================================================================== */

/* ---- Reveal on scroll (base state, activated via .is-visible from JS) ---- */
.reveal-up{
  opacity: 0;
  transform: translateY(28px);
  transition: opacity .8s var(--ease), transform .8s var(--ease);
}
.reveal-up.is-visible{ opacity: 1; transform: translateY(0); }

.reveal-up[data-delay="1"]{ transition-delay: .12s; }
.reveal-up[data-delay="2"]{ transition-delay: .24s; }
.reveal-up[data-delay="3"]{ transition-delay: .36s; }
.reveal-up[data-delay="4"]{ transition-delay: .48s; }

/* ---- Floating glass cards (hero) ---- */
@keyframes float-y{
  0%, 100%{ transform: translateY(0); }
  50%{ transform: translateY(-14px); }
}
.float-slow{ animation: float-y 6s ease-in-out infinite; }
.float-slow-delay{ animation: float-y 6s ease-in-out infinite; animation-delay: 1.4s; }

/* ---- Blueprint hero line draw-in ---- */
.bp-line line, .bp-line polyline{
  stroke-dasharray: 1600;
  stroke-dashoffset: 1600;
  animation: draw-blueprint 3.2s var(--ease) forwards;
  animation-delay: .4s;
}
.bp-line circle{
  opacity: 0;
  animation: fade-in-circle .6s var(--ease) forwards;
  animation-delay: 3.2s;
}
@keyframes draw-blueprint{ to{ stroke-dashoffset: 0; } }
@keyframes fade-in-circle{ to{ opacity: 1; } }

/* ---- Image reveal (project & news cards on load) ---- */
@keyframes img-reveal{
  from{ clip-path: inset(0 100% 0 0); }
  to{ clip-path: inset(0 0 0 0); }
}
.project-card__img img, .news-card__img img{ animation: none; }

/* ---- Counter pulse when animated ---- */
.stat__num.is-counting, .glass-card__num.is-counting{ transition: color .3s var(--ease); }

/* ---- Header shadow transition already handled in style.css; add subtle logo pulse ---- */
@keyframes gentle-pulse{
  0%, 100%{ opacity: 1; }
  50%{ opacity: .7; }
}

/* ---- Scroll indicator fade on scroll (class toggled by JS) ---- */
.scroll-indicator{ transition: opacity .4s var(--ease); }
.scroll-indicator.is-hidden{ opacity: 0; pointer-events: none; }

/* ---- Testimonial fade handled inline in style.css via .is-active ---- */

/* ---- Parallax hero background ---- */
.hero__bg{ will-change: transform; }