/* animations.css — keyframes + scroll reveal + kinetic + magnetic */

@keyframes xw-fade-in {
  from { opacity: 0; }
  to { opacity: 1; }
}
@keyframes xw-fade-up {
  from { opacity: 0; transform: translateY(40px); }
  to { opacity: 1; transform: translateY(0); }
}
@keyframes xw-slide-left {
  from { opacity: 0; transform: translateX(40px); }
  to { opacity: 1; transform: translateX(0); }
}
@keyframes xw-pop {
  0% { opacity: 0; transform: scale(0.9); }
  100% { opacity: 1; transform: scale(1); }
}
@keyframes xw-spin {
  to { transform: rotate(360deg); }
}
@keyframes xw-blink {
  0%, 100% { transform: scaleY(1); }
  50% { transform: scaleY(0.1); }
}
@keyframes xw-progress {
  from { transform: scaleX(0); }
  to { transform: scaleX(1); }
}

/* fade-up element */
.xw-fade-up { opacity: 0; transform: translateY(40px); transition: opacity .8s var(--ease-out-expo), transform .8s var(--ease-out-expo); }
.xw-fade-up.in-view { opacity: 1; transform: translateY(0); }
.xw-fade-up[data-delay="100"] { transition-delay: 0.1s; }
.xw-fade-up[data-delay="200"] { transition-delay: 0.2s; }
.xw-fade-up[data-delay="300"] { transition-delay: 0.3s; }
.xw-fade-up[data-delay="400"] { transition-delay: 0.4s; }
.xw-fade-up[data-delay="500"] { transition-delay: 0.5s; }
.xw-fade-up[data-delay="600"] { transition-delay: 0.6s; }
.xw-fade-up[data-delay="800"] { transition-delay: 0.8s; }

/* split text (word-by-word) */
.xw-split-word { display: inline-block; overflow: hidden; vertical-align: bottom; }
.xw-split-word > span { display: inline-block; transform: translateY(110%); transition: transform .9s var(--ease-out-expo); }
.xw-split-word.in-view > span { transform: translateY(0); }
.xw-split-word:nth-child(1) > span { transition-delay: 0.0s; }
.xw-split-word:nth-child(2) > span { transition-delay: 0.05s; }
.xw-split-word:nth-child(3) > span { transition-delay: 0.1s; }
.xw-split-word:nth-child(4) > span { transition-delay: 0.15s; }
.xw-split-word:nth-child(5) > span { transition-delay: 0.2s; }
.xw-split-word:nth-child(6) > span { transition-delay: 0.25s; }
.xw-split-word:nth-child(7) > span { transition-delay: 0.3s; }
.xw-split-word:nth-child(8) > span { transition-delay: 0.35s; }
.xw-split-word:nth-child(9) > span { transition-delay: 0.4s; }
.xw-split-word:nth-child(10) > span { transition-delay: 0.45s; }
.xw-split-word:nth-child(n+11) > span { transition-delay: 0.5s; }

/* parallax */
.xw-parallax { will-change: transform; }

/* image reveal */
.xw-reveal-clip { clip-path: inset(0 100% 0 0); transition: clip-path 1.1s var(--ease-pop); }
.xw-reveal-clip.in-view { clip-path: inset(0 0 0 0); }

/* stat counter animated */
.xw-counter { display: inline-block; }

/* card tilt */
.xw-tilt { transform-style: preserve-3d; transition: transform .3s var(--ease-out); }

/* hero scroll cue */
.scroll-cue {
  position: absolute; left: 50%; bottom: 28px; transform: translateX(-50%);
  color: var(--paper); font-size: 11px; letter-spacing: 0.3em; text-transform: uppercase;
  display: inline-flex; flex-direction: column; align-items: center; gap: 8px; opacity: 0.85;
}
.scroll-cue::after {
  content: ""; width: 1px; height: 40px; background: var(--paper);
  transform-origin: top; animation: xw-progress 2.2s var(--ease-out) infinite;
}

/* page transition curtain */
.xw-curtain {
  position: fixed; inset: 0; background: var(--ink); z-index: 100;
  transform-origin: bottom; transform: scaleY(0);
  transition: transform .8s var(--ease-pop);
  pointer-events: none;
}
.xw-curtain.is-active { transform: scaleY(1); }
.xw-curtain.is-leaving { transform-origin: top; transform: scaleY(0); }

/* hover image sequence (cards) */
.xw-hover-zoom img { transition: transform .8s var(--ease-out); }
.xw-hover-zoom:hover img { transform: scale(1.08); }

/* cookie bar mascot blink */
.xw-blink { animation: xw-blink 4s ease-in-out infinite; transform-origin: center; }