/* ── Apple-grade motion layer ── */
:root { --ease-expo: cubic-bezier(0.16, 1, 0.3, 1); --ease-soft: cubic-bezier(0.22, 1, 0.36, 1); }

/* base reveal: fade + rise */
[data-reveal] {
  opacity: 0;
  transform: translate3d(0, 32px, 0);
  transition: opacity 0.9s var(--ease-expo), transform 1.1s var(--ease-expo);
  transition-delay: calc(var(--i, 0) * 90ms);
  will-change: opacity, transform;
}
[data-reveal].in { opacity: 1; transform: translate3d(0, 0, 0); }

/* image unveil: clip wipe + scale settle */
[data-img] { overflow: hidden; }
[data-img] > img {
  clip-path: inset(0 0 100% 0);
  transform: scale(1.06);
  transition: clip-path 1.2s var(--ease-expo), transform 1.4s var(--ease-expo);
  transition-delay: calc(var(--i, 0) * 90ms);
  will-change: clip-path, transform;
}
[data-img].in > img { clip-path: inset(0 0 0 0); transform: scale(1); }

/* hero headline: line masks rising */
.m-line { display: block; overflow: hidden; }
.m-line > span {
  display: block;
  transform: translate3d(0, 110%, 0);
  transition: transform 1.1s var(--ease-expo);
  transition-delay: calc(var(--i, 0) * 110ms + 120ms);
  will-change: transform;
}
.m-ready .m-line > span { transform: translate3d(0, 0, 0); }

/* hero parallax target */
.m-parallax { will-change: transform; }

/* magnetic buttons */
.btn { transition: background 0.3s var(--ease-soft), transform 0.5s var(--ease-soft), box-shadow 0.3s; }
.btn.m-mag { transform: translate3d(var(--mx, 0), var(--my, 0), 0); }

/* nav fade on load */
.nav { opacity: 0; transform: translateY(-8px); transition: opacity 0.8s var(--ease-expo), transform 0.8s var(--ease-expo); }
.nav.in { opacity: 1; transform: translateY(0); }

@media (prefers-reduced-motion: reduce) {
  [data-reveal], [data-img] > img, .m-line > span, .nav { opacity: 1 !important; transform: none !important; clip-path: none !important; transition: none !important; }
  .btn.m-mag { transform: none !important; }
}