/* ── Scroll-triggered entrance animations (loaded async, non-blocking) ── */

[data-animate="slide-cards"] .card {
  opacity: 0;
  transition: opacity 0.5s var(--ease-out-strong), transform 0.5s var(--ease-out-strong);
}
[data-animate="slide-cards"] .card:nth-child(1),
[data-animate="slide-cards"] .card:nth-child(2) {
  transform: translateX(-60px);
}
[data-animate="slide-cards"] .card:nth-child(3),
[data-animate="slide-cards"] .card:nth-child(4) {
  transform: translateX(60px);
}
[data-animate="slide-cards"] .card:nth-child(2),
[data-animate="slide-cards"] .card:nth-child(4) {
  transition-delay: 150ms;
}
[data-animate="slide-cards"].animate-visible .card {
  opacity: 1;
  transform: translateX(0);
}

[data-animate="stagger-scale-up"] > .grid > *,
[data-animate="stagger-scale-up"] > .flex > * {
  opacity: 0;
  scale: 0.92;
  transition: opacity 0.5s var(--ease-out-strong), scale 0.5s var(--ease-out-strong);
}
[data-animate="stagger-scale-up"].animate-visible > .grid > *,
[data-animate="stagger-scale-up"].animate-visible > .flex > * {
  opacity: 1;
  scale: 1;
}
[data-animate="stagger-scale-up"].animate-visible > .grid > *:nth-child(1),
[data-animate="stagger-scale-up"].animate-visible > .flex > *:nth-child(1) {
  transition-delay: 0ms;
}
[data-animate="stagger-scale-up"].animate-visible > .grid > *:nth-child(2),
[data-animate="stagger-scale-up"].animate-visible > .flex > *:nth-child(2) {
  transition-delay: 80ms;
}
[data-animate="stagger-scale-up"].animate-visible > .grid > *:nth-child(3),
[data-animate="stagger-scale-up"].animate-visible > .flex > *:nth-child(3) {
  transition-delay: 160ms;
}
[data-animate="stagger-scale-up"].animate-visible > .grid > *:nth-child(4),
[data-animate="stagger-scale-up"].animate-visible > .flex > *:nth-child(4) {
  transition-delay: 240ms;
}
[data-animate="stagger-scale-up"].animate-visible > .grid > *:nth-child(5),
[data-animate="stagger-scale-up"].animate-visible > .flex > *:nth-child(5) {
  transition-delay: 320ms;
}

[data-animate="flip-up"] > .flex > * {
  opacity: 0;
  transform: translateY(40px);
  transition: opacity 0.6s var(--ease-out-strong), transform 0.6s var(--ease-out-strong);
}
[data-animate="flip-up"].animate-visible > .flex > * {
  opacity: 1;
  transform: translateY(0);
}
[data-animate="flip-up"].animate-visible > .flex > *:nth-child(1) {
  transition-delay: 0ms;
}
[data-animate="flip-up"].animate-visible > .flex > *:nth-child(2) {
  transition-delay: 120ms;
}
[data-animate="flip-up"].animate-visible > .flex > *:nth-child(3) {
  transition-delay: 240ms;
}

[data-animate="timeline-reveal"] > .flex > * {
  opacity: 0;
  transform: translateY(30px);
  transition: opacity 0.5s var(--ease-out-strong), transform 0.5s var(--ease-out-strong);
}
[data-animate="timeline-reveal"].animate-visible > .flex > * {
  opacity: 1;
  transform: translateY(0);
}
[data-animate="timeline-reveal"].animate-visible > .flex > *:nth-child(1) {
  transition-delay: 0ms;
}
[data-animate="timeline-reveal"].animate-visible > .flex > *:nth-child(2) {
  transition-delay: 60ms;
}
[data-animate="timeline-reveal"].animate-visible > .flex > *:nth-child(3) {
  transition-delay: 120ms;
}

[data-animate="zoom-fade"] > .flex > * {
  opacity: 0;
  scale: 0.95;
  transition: opacity 0.5s var(--ease-out-strong), scale 0.5s var(--ease-out-strong);
}
[data-animate="zoom-fade"].animate-visible > .flex > * {
  opacity: 1;
  scale: 1;
}
[data-animate="zoom-fade"].animate-visible > .flex > *:nth-child(1) {
  transition-delay: 0ms;
}
[data-animate="zoom-fade"].animate-visible > .flex > *:nth-child(2) {
  transition-delay: 100ms;
}
[data-animate="zoom-fade"].animate-visible > .flex > *:nth-child(3) {
  transition-delay: 200ms;
}

[data-animate="slide-up-scale"] > .grid > * {
  opacity: 0;
  transform: translateY(20px);
  scale: 0.96;
  transition: opacity 0.5s var(--ease-out-strong), transform 0.5s var(--ease-out-strong), scale 0.5s
    var(--ease-out-strong);
}
[data-animate="slide-up-scale"].animate-visible > .grid > * {
  opacity: 1;
  transform: translateY(0);
  scale: 1;
}
[data-animate="slide-up-scale"].animate-visible > .grid > *:nth-child(1) {
  transition-delay: 0ms;
}
[data-animate="slide-up-scale"].animate-visible > .grid > *:nth-child(2) {
  transition-delay: 80ms;
}
[data-animate="slide-up-scale"].animate-visible > .grid > *:nth-child(3) {
  transition-delay: 160ms;
}
[data-animate="slide-up-scale"].animate-visible > .grid > *:nth-child(4) {
  transition-delay: 240ms;
}

[data-animate="scale-in-center"] > .wrap {
  opacity: 0;
  scale: 0.97;
  transition: opacity 0.6s var(--ease-out-strong), scale 0.6s var(--ease-out-strong);
}
[data-animate="scale-in-center"].animate-visible > .wrap {
  opacity: 1;
  scale: 1;
}

[data-animate="split"] .split-left,
[data-animate="split"] .split-right {
  opacity: 0;
  transition: opacity 0.5s var(--ease-out-strong), transform 0.5s var(--ease-out-strong);
}
[data-animate="split"] .split-left {
  transform: translateX(-60px);
}
[data-animate="split"] .split-right {
  transform: translateX(60px);
}
[data-animate="split"].animate-visible .split-left,
[data-animate="split"].animate-visible .split-right {
  opacity: 1;
  transform: translateX(0);
}
[data-animate="split"].animate-visible .split-right {
  transition-delay: 150ms;
}

[data-animate="fade-in"] > .wrap {
  opacity: 0;
  transition: opacity 0.6s var(--ease-out-strong);
}
[data-animate="fade-in"].animate-visible > .wrap {
  opacity: 1;
}

@media (prefers-reduced-motion: reduce) {
  [data-animate] .card,
  [data-animate] .pillar,
  [data-animate] .method,
  [data-animate] .testi,
  [data-animate] .output-c,
  [data-animate] .jenjang-item,
  [data-animate] .split-left,
  [data-animate] .split-right,
  [data-animate] > .wrap,
  [data-animate] .grid > *,
  [data-animate] .flex > *,
  [data-animate^="hero"] > * {
    opacity: 1 !important;
    transform: none !important;
    scale: none !important;
    transition: opacity 0.2s ease !important;
  }
}