/* ============================================================
 * ANEW · MOTION v1.0
 * Webflow-style scroll reveal, marquee, counter, magnetic, parallax.
 * Opt-in via data attributes. Respects prefers-reduced-motion.
 * ============================================================ */

[data-reveal] {
  opacity: 0;
  transform: translateY(28px);
  transition:
    opacity var(--an-dur-reveal) var(--an-ease-out),
    transform var(--an-dur-reveal) var(--an-ease-out);
  transition-delay: var(--an-reveal-delay, 0s);
}
[data-reveal].is-visible {
  opacity: 1;
  transform: translateY(0);
}

[data-reveal="left"] { transform: translateX(-32px); }
[data-reveal="left"].is-visible { transform: translateX(0); }
[data-reveal="right"] { transform: translateX(32px); }
[data-reveal="right"].is-visible { transform: translateX(0); }
[data-reveal="scale"] { transform: scale(0.96); }
[data-reveal="scale"].is-visible { transform: scale(1); }

/* Stagger children */
[data-stagger] > * {
  opacity: 0;
  transform: translateY(24px);
  transition:
    opacity var(--an-dur-reveal) var(--an-ease-out),
    transform var(--an-dur-reveal) var(--an-ease-out);
}
[data-stagger].is-visible > * {
  opacity: 1;
  transform: translateY(0);
}
[data-stagger].is-visible > *:nth-child(1) { transition-delay: 0.05s; }
[data-stagger].is-visible > *:nth-child(2) { transition-delay: 0.12s; }
[data-stagger].is-visible > *:nth-child(3) { transition-delay: 0.19s; }
[data-stagger].is-visible > *:nth-child(4) { transition-delay: 0.26s; }
[data-stagger].is-visible > *:nth-child(5) { transition-delay: 0.33s; }
[data-stagger].is-visible > *:nth-child(6) { transition-delay: 0.40s; }
[data-stagger].is-visible > *:nth-child(7) { transition-delay: 0.47s; }
[data-stagger].is-visible > *:nth-child(8) { transition-delay: 0.54s; }

/* Word-split reveal */
[data-split] .word {
  display: inline-block;
  overflow: hidden;
  vertical-align: top;
}
[data-split] .word > span {
  display: inline-block;
  transform: translateY(110%);
  transition: transform var(--an-dur-reveal) var(--an-ease-out);
  transition-delay: calc(var(--word-i, 0) * 60ms);
}
[data-split].is-visible .word > span { transform: translateY(0); }

/* Marquee */
.marquee {
  display: flex;
  gap: 3rem;
  overflow: hidden;
  white-space: nowrap;
  mask-image: linear-gradient(90deg, transparent 0, #000 8%, #000 92%, transparent 100%);
}
.marquee-track {
  display: flex;
  gap: 3rem;
  animation: marquee 38s linear infinite;
  flex-shrink: 0;
}
@keyframes marquee {
  from { transform: translateX(0); }
  to   { transform: translateX(-50%); }
}

/* Magnetic CTA */
.magnetic {
  transition: transform 0.24s var(--an-ease-out), box-shadow 0.24s var(--an-ease-out);
  will-change: transform;
}

/* Tilt */
.tilt { transition: transform 0.45s var(--an-ease); transform-style: preserve-3d; }
.tilt:hover { transform: perspective(900px) rotateX(2deg) rotateY(-3deg) translateY(-4px); }

/* Image zoom on hover */
.img-zoom { overflow: hidden; }
.img-zoom > img,
.img-zoom .bg {
  transition: transform 0.9s var(--an-ease);
}
.img-zoom:hover > img,
.img-zoom:hover .bg { transform: scale(1.04); }

/* Live pulse dot */
.pulse {
  display: inline-block; width: 7px; height: 7px;
  border-radius: 50%; background: var(--an-gold-600);
  box-shadow: 0 0 0 0 rgba(196,160,112,0.55);
  animation: pulse-ring 1.8s ease-out infinite;
}
@keyframes pulse-ring {
  0%   { box-shadow: 0 0 0 0 rgba(196,160,112,0.55); }
  70%  { box-shadow: 0 0 0 14px rgba(196,160,112,0); }
  100% { box-shadow: 0 0 0 0 rgba(196,160,112,0); }
}

/* Parallax (CSS-driven) */
.parallax {
  transition: transform 0.05s linear;
  will-change: transform;
}

/* === Mobile sticky FAB book button (shared across concepts) === */
.mobile-fab {
  position: fixed;
  bottom: 16px; left: 50%; transform: translateX(-50%);
  z-index: 70;
  display: none;
  padding: 14px 24px;
  background: var(--an-ink-800);
  color: #fff;
  border-radius: 999px;
  box-shadow: 0 10px 28px rgba(14,14,14,0.28), 0 2px 6px rgba(14,14,14,0.18);
  font-family: var(--an-font-ui);
  font-size: 14px; font-weight: 600;
  letter-spacing: 0.02em;
  text-decoration: none;
  align-items: center; gap: 8px;
  white-space: nowrap;
  transition: transform 0.3s var(--an-ease), opacity 0.3s var(--an-ease);
}
.mobile-fab svg { width: 14px; height: 14px; }
@media (max-width: 768px) {
  .mobile-fab { display: inline-flex; }
}
@media (prefers-reduced-motion: no-preference) {
  .mobile-fab.is-hidden { transform: translateX(-50%) translateY(160%); opacity: 0; pointer-events: none; }
}

/* Underline link */
.u-link {
  position: relative;
  display: inline-block;
  padding-bottom: 2px;
}
.u-link::after {
  content: "";
  position: absolute;
  left: 0; right: 0; bottom: 0;
  height: 1px;
  background: currentColor;
  transform: scaleX(0); transform-origin: right;
  transition: transform 0.5s var(--an-ease-out);
}
.u-link:hover::after {
  transform: scaleX(1); transform-origin: left;
}
