/* ============================================================
   NOVEDOX · lux polish layer (design only)
   Motion language: slow glides, 300ms+ easing, nothing snaps.
   All entrance motion is gated behind html.nvx-anim (set by JS,
   skipped for prefers-reduced-motion) so content is never hidden
   without JS. Loaded after styles.min.css — refines, removes nothing.
   ============================================================ */

/* Smooth anchor glide (only when motion is allowed) */
html.nvx-anim { scroll-behavior: smooth; }

/* Keyboard focus: antique-gold ring, visible on light and dark */
:focus-visible {
  outline: 2px solid #B8912A;
  outline-offset: 2px;
  border-radius: 6px;
}

/* ---- Scroll reveal, refined: longer glide + whisper of scale ---- */
.nvx-anim .nvx-reveal {
  opacity: 0;
  transform: translateY(24px) scale(0.988);
  transition:
    opacity 0.9s cubic-bezier(0.16, 1, 0.3, 1),
    transform 0.9s cubic-bezier(0.16, 1, 0.3, 1);
  will-change: opacity, transform;
}
.nvx-anim .nvx-reveal.is-in { opacity: 1; transform: none; }
.nvx-anim .nvx-reveal[data-d="1"] { transition-delay: 0.1s; }
.nvx-anim .nvx-reveal[data-d="2"] { transition-delay: 0.2s; }
.nvx-anim .nvx-reveal[data-d="3"] { transition-delay: 0.3s; }

/* ---- Hero entrance: children rise one after another ---- */
.nvx-anim .lux-stagger { transform: none; }
.nvx-anim .lux-stagger > * {
  opacity: 0;
  transform: translateY(20px);
  transition:
    opacity 0.85s cubic-bezier(0.16, 1, 0.3, 1),
    transform 0.85s cubic-bezier(0.16, 1, 0.3, 1);
}
.nvx-anim .lux-stagger.is-in > * { opacity: 1; transform: none; }
.nvx-anim .lux-stagger.is-in > *:nth-child(1) { transition-delay: 0.05s; }
.nvx-anim .lux-stagger.is-in > *:nth-child(2) { transition-delay: 0.17s; }
.nvx-anim .lux-stagger.is-in > *:nth-child(3) { transition-delay: 0.29s; }
.nvx-anim .lux-stagger.is-in > *:nth-child(4) { transition-delay: 0.41s; }
.nvx-anim .lux-stagger.is-in > *:nth-child(5) { transition-delay: 0.53s; }

/* Hero product image drifts in from the right, a beat later */
.nvx-anim .nvx-reveal.lux-hero-product {
  transform: translateX(32px) scale(0.98);
  transition:
    opacity 1.1s cubic-bezier(0.16, 1, 0.3, 1) 0.25s,
    transform 1.1s cubic-bezier(0.16, 1, 0.3, 1) 0.25s;
}
.nvx-anim .nvx-reveal.lux-hero-product.is-in { transform: none; }

/* ---- Primary CTAs (midnight pills): lift, settle, arrow nudge ---- */
[class*="bg-nvx-navy"] {
  transition:
    background-color 0.3s ease,
    transform 0.35s cubic-bezier(0.16, 1, 0.3, 1),
    box-shadow 0.35s ease;
  box-shadow: 0 1px 2px rgba(11, 29, 38, 0.16);
}
[class*="bg-nvx-navy"]:hover {
  transform: translateY(-2px);
  box-shadow: 0 14px 30px -12px rgba(11, 29, 38, 0.5);
}
[class*="bg-nvx-navy"]:active {
  transform: translateY(0) scale(0.98);
  box-shadow: 0 2px 8px -2px rgba(11, 29, 38, 0.35);
}
.nvx-shine svg { transition: transform 0.35s cubic-bezier(0.16, 1, 0.3, 1); }
.nvx-shine:hover svg { transform: translateX(3px); }

/* Secondary (outlined) pills get the same gentle rise */
a[class*="border-nvx-border"][class*="rounded-full"] {
  transition:
    color 0.3s ease, border-color 0.3s ease, background-color 0.3s ease,
    transform 0.35s cubic-bezier(0.16, 1, 0.3, 1),
    box-shadow 0.35s ease;
}
a[class*="border-nvx-border"][class*="rounded-full"]:hover {
  transform: translateY(-2px);
  box-shadow: 0 10px 24px -14px rgba(11, 29, 38, 0.35);
}

/* ---- Navbar links: antique-gold underline slides in ---- */
#nvx-nav nav a { position: relative; }
#nvx-nav nav a::after {
  content: "";
  position: absolute;
  left: 0; right: 100%; bottom: -6px;
  height: 2px; border-radius: 2px;
  background: #B8912A;
  transition: right 0.35s cubic-bezier(0.16, 1, 0.3, 1);
}
#nvx-nav nav a:hover::after { right: 0; }

/* ---- Gold display gradients: slow, quiet sheen ---- */
.nvx-anim h1 [class*="bg-clip-text"],
.nvx-anim h2 [class*="bg-clip-text"] {
  background-size: 200% auto;
  animation: luxSheen 8s ease-in-out infinite;
}
@keyframes luxSheen {
  0%, 100% { background-position: 0% center; }
  50% { background-position: 100% center; }
}

/* ---- Cards: gentle rise on hover (shadows come from nvx-glow-hover) ---- */
.nvx-glow-hover:hover { transform: translateY(-4px); }

/* ---- Ticker: soft edge fades so it dissolves instead of clipping ---- */
.nvx-ticker {
  -webkit-mask-image: linear-gradient(to right, transparent, #000 6%, #000 94%, transparent);
  mask-image: linear-gradient(to right, transparent, #000 6%, #000 94%, transparent);
}

/* ---- FAQ: chevron turn + answer settles in ---- */
details .faq-chev { transition: transform 0.35s cubic-bezier(0.16, 1, 0.3, 1); }
details[open] .faq-chev { transform: rotate(180deg); }
details[open] > p { animation: luxFaq 0.4s cubic-bezier(0.16, 1, 0.3, 1); }
@keyframes luxFaq {
  from { opacity: 0; transform: translateY(-6px); }
  to { opacity: 1; transform: none; }
}
details summary::-webkit-details-marker { display: none; }

/* ---- Stats: numbers pop softly once counted up ---- */
.lux-counted { animation: luxPop 0.55s cubic-bezier(0.16, 1, 0.3, 1); }
@keyframes luxPop {
  0% { transform: scale(0.94); }
  60% { transform: scale(1.03); }
  100% { transform: scale(1); }
}

/* ---- Session overlay cards: barely-there float ---- */
.nvx-anim [data-session] { animation: luxFloat 7s ease-in-out infinite; }
.nvx-anim [data-session="ldn"] { animation-delay: -2.3s; }
.nvx-anim [data-session="asia"] { animation-delay: -4.6s; }
@keyframes luxFloat {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-6px); }
}

/* ---- Images inside link cards: slow zoom instead of opacity jump ---- */
.nvx-glow-hover img[class*="object-cover"] {
  transition: opacity 0.5s ease, transform 1.2s cubic-bezier(0.16, 1, 0.3, 1);
}
.nvx-glow-hover:hover img[class*="object-cover"] { transform: scale(1.04); }

/* ---- Reduced motion: everything lands instantly, nothing hidden ---- */
@media (prefers-reduced-motion: reduce) {
  html.nvx-anim { scroll-behavior: auto; }
  .nvx-anim .nvx-reveal,
  .nvx-anim .lux-stagger > *,
  .nvx-anim .nvx-reveal.lux-hero-product {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
  }
  .nvx-anim h1 [class*="bg-clip-text"],
  .nvx-anim h2 [class*="bg-clip-text"],
  .nvx-anim [data-session],
  .lux-counted { animation: none !important; }
  [class*="bg-nvx-navy"]:hover,
  a[class*="border-nvx-border"][class*="rounded-full"]:hover,
  .nvx-glow-hover:hover { transform: none; }
}