/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   Home Page — Entrance & Scroll Animations
   Driven by Intersection Observer + CSS custom properties.
   ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */

/* ── Keyframes ─────────────────────────────────────────────── */

@keyframes ha-rise {
  from {
    opacity: 0;
    transform: translateY(48px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes ha-slide-r {
  from {
    opacity: 0;
    transform: translateX(72px);
  }

  to {
    opacity: 1;
    transform: translateX(0);
  }
}

/* ── Hero: elements are invisible until body gets .ha-ready ── */

[data-ha-delay] {
  opacity: 0;
}

.ha-ready [data-ha-delay] {
  animation: ha-rise 0.9s cubic-bezier(0.16, 1, 0.3, 1) var(--ha-d, 0s) both;
}

.ha-ready [data-ha-delay][data-ha-dir="r"] {
  animation-name: ha-slide-r;
  animation-duration: 1.05s;
}

/* ── Scroll-reveal base states ─────────────────────────────── */

.ha-reveal,
.ha-reveal-l,
.ha-reveal-r {
  opacity: 0;
  transition:
    opacity 0.85s cubic-bezier(0.16, 1, 0.3, 1),
    transform 0.85s cubic-bezier(0.16, 1, 0.3, 1);
}

.ha-reveal {
  transform: translateY(44px);
}

.ha-reveal-l {
  transform: translateX(-54px);
}

.ha-reveal-r {
  transform: translateX(54px);
}

.ha-reveal.ha-in,
.ha-reveal-l.ha-in,
.ha-reveal-r.ha-in {
  opacity: 1;
  transform: none;
}

/* ── Respect prefers-reduced-motion ───────────────────────── */

@media (prefers-reduced-motion: reduce) {

  [data-ha-delay],
  .ha-reveal,
  .ha-reveal-l,
  .ha-reveal-r {
    opacity: 1 !important;
    transform: none !important;
    animation: none !important;
    transition: none !important;
  }
}