/* ==========================================================================
   Samsung-Elite — Animations
   Reveal states only apply when JS is running (.js on <html>) so content is
   never hidden for crawlers or no-JS users. Everything is disabled under
   prefers-reduced-motion.
   ========================================================================== */

/* ---------- Keyframes ---------- */
@keyframes fade-in { from { opacity: 0; } to { opacity: 1; } }
@keyframes dialog-in { from { opacity: 0; transform: translateY(-14px) scale(0.98); } to { opacity: 1; transform: none; } }
@keyframes ping { 0% { transform: scale(1); opacity: 0.7; } 80%, 100% { transform: scale(1.55); opacity: 0; } }
@keyframes float-y { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-14px); } }
@keyframes float-y-sm { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-7px); } }
@keyframes spin { to { transform: rotate(360deg); } }
@keyframes spin-rev { to { transform: rotate(-360deg); } }
@keyframes shimmer { 0% { background-position: 200% 0; } 100% { background-position: -200% 0; } }
@keyframes glow-pulse { 0%, 100% { opacity: 0.55; transform: scale(1); } 50% { opacity: 0.9; transform: scale(1.06); } }
@keyframes dash { to { stroke-dashoffset: 0; } }
@keyframes marquee { from { transform: translateX(0); } to { transform: translateX(calc(-50% * var(--dir))); } }
@keyframes rise-in { from { opacity: 0; transform: translateY(28px); } to { opacity: 1; transform: none; } }
@keyframes blink { 50% { opacity: 0.25; } }
@keyframes water { 0% { transform: translateX(0) ; } 100% { transform: translateX(-50%); } }

/* ---------- Scroll reveal ---------- */
.js [data-reveal] {
  opacity: 0;
  transition: opacity 0.9s var(--ease), transform 0.9s var(--ease), filter 0.9s var(--ease);
  transition-delay: calc(var(--reveal-i, 0) * 80ms);
  will-change: opacity, transform;
}
.js [data-reveal='up'] { transform: translateY(36px); }
.js [data-reveal='down'] { transform: translateY(-24px); }
.js [data-reveal='start'] { transform: translateX(calc(40px * var(--dir))); }
.js [data-reveal='end'] { transform: translateX(calc(-40px * var(--dir))); }
.js [data-reveal='scale'] { transform: scale(0.94); }
.js [data-reveal='blur'] { filter: blur(12px); transform: translateY(16px); }
.js [data-reveal].is-visible { opacity: 1; transform: none; filter: none; }

/* Split headline words (animations.js wraps words in .word spans) */
.js [data-split] .word { display: inline-block; opacity: 0; transform: translateY(0.6em) rotate(2deg); transition: opacity 0.8s var(--ease), transform 0.8s var(--ease); transition-delay: calc(var(--w, 0) * 55ms + 120ms); }
.js [data-split].is-visible .word { opacity: 1; transform: none; }
/* Gradient text: transformed child words need their own background clip */
.gradient-text .word { background-image: inherit; background-size: inherit; background-position: inherit; animation: inherit; -webkit-background-clip: text; background-clip: text; color: transparent; }
.js [data-split].is-visible .gradient-text .word, .js [data-split].is-visible .word.gradient-word { animation: shimmer 8s linear infinite; }

/* ---------- Ambient motion helpers ---------- */
.float { animation: float-y 6s var(--ease-in-out) infinite; }
.float--slow { animation-duration: 9s; }
.float--sm { animation: float-y-sm 5s var(--ease-in-out) infinite; }
.float--delay-1 { animation-delay: -1.5s; }
.float--delay-2 { animation-delay: -3s; }
.float--delay-3 { animation-delay: -4.5s; }
.shimmer-text { background-size: 200% 100%; animation: shimmer 8s linear infinite; }

/* ---------- Reduced motion: switch everything off ---------- */
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after {
    animation-duration: 0.001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.001ms !important;
    scroll-behavior: auto !important;
  }
  .js [data-reveal], .js [data-split] .word { opacity: 1 !important; transform: none !important; filter: none !important; }
}
