/* =============================================================
   Animation system — scroll reveals, hover micro-interactions
============================================================== */

/* ---------- Reveal on scroll (premium feel) ---------- */
[data-anim] {
  opacity: 0;
  will-change: opacity, transform;
  transition: opacity 900ms var(--ease-out, cubic-bezier(.16,1,.3,1)),
              transform 1000ms var(--ease-out, cubic-bezier(.16,1,.3,1));
}
[data-anim="fade"]       { transform: translateY(0); }
[data-anim="fade-up"]    { transform: translateY(40px); }
[data-anim="fade-down"]  { transform: translateY(-28px); }
[data-anim="fade-left"]  { transform: translateX(48px); }
[data-anim="fade-right"] { transform: translateX(-48px); }
[data-anim="zoom"]       { transform: scale(.93); }
[data-anim="slide-up"]   { transform: translateY(80px); }

[data-anim].is-in {
  opacity: 1;
  transform: none;
}

/* Cascade — parent triggers children stagger */
.cascade > * {
  opacity: 0;
  transform: translateY(36px) scale(.985);
  transition: opacity 800ms var(--ease-out, cubic-bezier(.16,1,.3,1)),
              transform 800ms var(--ease-out, cubic-bezier(.16,1,.3,1));
}
.cascade.is-in > * { opacity: 1; transform: none; }
.cascade.is-in > *:nth-child(1) { transition-delay:   0ms; }
.cascade.is-in > *:nth-child(2) { transition-delay:  90ms; }
.cascade.is-in > *:nth-child(3) { transition-delay: 180ms; }
.cascade.is-in > *:nth-child(4) { transition-delay: 270ms; }
.cascade.is-in > *:nth-child(5) { transition-delay: 360ms; }
.cascade.is-in > *:nth-child(6) { transition-delay: 450ms; }
.cascade.is-in > *:nth-child(7) { transition-delay: 540ms; }
.cascade.is-in > *:nth-child(8) { transition-delay: 630ms; }

/* Image reveal — scales softly on entry */
[data-anim="reveal-img"] img,
.reveal-img img { transform: scale(1.08); transition: transform 1.4s var(--ease-out); }
[data-anim="reveal-img"].is-in img,
.reveal-img.is-in img { transform: scale(1); }

/* ---------- Hero entrance ---------- */
.hero__content > * {
  opacity: 0;
  transform: translateY(24px);
  transition: opacity 900ms var(--ease-out), transform 900ms var(--ease-out);
}
.hero.is-loaded .hero__content > *:nth-child(1) { opacity: 1; transform: none; transition-delay: 100ms; }
.hero.is-loaded .hero__content > *:nth-child(2) { opacity: 1; transform: none; transition-delay: 220ms; }
.hero.is-loaded .hero__content > *:nth-child(3) { opacity: 1; transform: none; transition-delay: 340ms; }
.hero.is-loaded .hero__content > *:nth-child(4) { opacity: 1; transform: none; transition-delay: 460ms; }
.hero.is-loaded .hero__content > *:nth-child(5) { opacity: 1; transform: none; transition-delay: 580ms; }

.hero__scroll { opacity: 0; transition: opacity 1s var(--ease-out); }
.hero.is-loaded .hero__scroll { opacity: 1; transition-delay: 1.4s; }

/* Hero background — static (no Ken Burns) for clean premium feel */
.hero__bg-media img { transform: scale(1.02); }

/* ---------- Animated underline (links) ---------- */
.link-underline {
  position: relative;
  display: inline-flex; align-items: center; gap: 6px;
  font-weight: 600;
}
.link-underline::after {
  content: "";
  position: absolute;
  left: 0; right: 0; bottom: -3px;
  height: 2px;
  background: currentColor;
  transform: scaleX(0);
  transform-origin: right;
  transition: transform 380ms var(--ease-out);
}
.link-underline:hover::after { transform: scaleX(1); transform-origin: left; }

/* ---------- Image kenburns (subtle) ---------- */
.kenburns img {
  animation: kenburns 18s ease-in-out infinite alternate;
}
@keyframes kenburns {
  0%   { transform: scale(1) translateZ(0); }
  100% { transform: scale(1.08) translate(-1.5%, -1%); }
}

/* ---------- Count-up number style ---------- */
[data-count] {
  display: inline-block;
  font-variant-numeric: tabular-nums;
}

/* ---------- Reduced motion ---------- */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
    scroll-behavior: auto !important;
  }
  [data-anim] { opacity: 1 !important; transform: none !important; }
  .hero__content > *, .hero__visual, .float-card { opacity: 1; transform: none; }
  .marquee__track { animation: none; }
}