/* ═══════════════════════════════════════════════════════════
   هشت — فلش ناوبری
   پایین اسلایدر (ثابت در همان محل) | بالای فوتر (نمایان هنگام رسیدن)
   ═══════════════════════════════════════════════════════════ */

.page-jump {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 2.75rem;
  height: 2.75rem;
  margin-inline: auto;
  border: 1px solid var(--line-strong);
  border-radius: 50%;
  color: var(--c-gold);
  background: var(--bg-raised);
  transition:
    transform var(--dur) var(--ease-out),
    border-color var(--dur) var(--ease-out),
    background-color var(--dur) var(--ease-out),
    color var(--dur) var(--ease-out),
    opacity var(--dur) var(--ease-out);
}

.page-jump svg {
  width: 1.15rem;
  height: 1.15rem;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.page-jump:hover {
  border-color: var(--c-gold);
  background: var(--c-gold);
  color: var(--on-gold);
}

/* دقیقاً زیر اسلایدر — در جریان صفحه، نه fixed روی کل ویوپورت */
.page-jump--down {
  position: relative;
  margin-top: 1.75rem;
  margin-bottom: 0.25rem;
  animation: jump-bob 2s ease-in-out infinite;
}

.page-jump--down:hover {
  transform: translateY(3px);
}

/* بالای فوتر — خارج از جریان سند تا شکاف نسازد */
.page-jump--up {
  position: absolute;
  left: 50%;
  bottom: auto;
  top: 0;
  z-index: 5;
  margin: 0;
  transform: translate(-50%, -50%);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}

.page-jump--up.is-visible {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}

.page-jump--up:hover {
  transform: translate(-50%, calc(-50% - 3px));
}

@keyframes jump-bob {
  0%, 100% { transform: translateY(0); }
  50%      { transform: translateY(6px); }
}

@media (prefers-reduced-motion: reduce) {
  .page-jump--down {
    animation: none;
  }
}