/* ═══════════════════════════════════════════════════════════════
   MYSTIC FOREST — Apex (scroll + nav only — no video cover)
   ═══════════════════════════════════════════════════════════════ */

.mw-btn--glow.mx-shimmer {
  position: relative;
  overflow: hidden;
  isolation: isolate;
}

.mw-btn--glow.mx-shimmer::after {
  content: "";
  position: absolute;
  inset: -2px;
  border-radius: inherit;
  padding: 1px;
  background: linear-gradient(120deg,
    transparent 30%,
    rgba(165, 148, 255, 0.75) 45%,
    rgba(94, 228, 200, 0.6) 55%,
    transparent 70%);
  background-size: 250% 100%;
  animation: mxShimmer 4s linear infinite;
  -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  -webkit-mask-composite: xor;
  mask-composite: exclude;
  pointer-events: none;
}

@keyframes mxShimmer {
  to { background-position: 250% 0; }
}

.mw-nav::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  height: 1px;
  width: var(--mx-nav-progress, 0%);
  background: linear-gradient(90deg, var(--mw-nebula), var(--mw-jewel));
  box-shadow: 0 0 16px rgba(165, 148, 255, 0.3);
}

.mw-nav__links a.mx-active {
  color: var(--mw-moon);
  text-shadow: 0 0 18px rgba(165, 148, 255, 0.35);
}

.mw-classes__name.is-swapping {
  animation: mxClassSwap 0.55s cubic-bezier(0.22, 1, 0.36, 1);
}

@keyframes mxClassSwap {
  0% { opacity: 0.35; transform: translateY(12px); filter: blur(4px); }
  100% { opacity: 1; transform: translateY(0); filter: blur(0); }
}

.mx-split .mx-char {
  display: inline-block;
  opacity: 0;
  transform: translateY(0.7em);
  animation: mxCharIn 0.8s cubic-bezier(0.22, 1, 0.36, 1) forwards;
  animation-delay: calc(0.2s + var(--i, 0) * 0.03s);
}

.mx-split .mx-char--space { width: 0.28em; }

@keyframes mxCharIn {
  to { opacity: 1; transform: translateY(0); }
}

.mw-hero__title.mx-split { animation: none; }

@media (prefers-reduced-motion: reduce) {
  .mx-split .mx-char { opacity: 1; transform: none; animation: none; }
  .mw-btn--glow.mx-shimmer::after { animation: none; }
  .mw-classes__name.is-swapping { animation: none; }
  .mw-portrait { transition: none; }
}