/* ═══════════════════════════════════════════════════════════════
   تفاعل سكرول احترافي — المحتوى ظاهر دائمًا، الحركة عمق وإضاءة
   ═══════════════════════════════════════════════════════════════ */

html.has-omar-motion {
  --omar-p: 0;
  --omar-bg-y: 0px;
}

.omar-scrollprog {
  position: fixed;
  top: 0;
  inset-inline: 0;
  z-index: 2000;
  height: 3px;
  pointer-events: none;
  background: transparent;
}
.omar-scrollprog__bar {
  display: block;
  height: 100%;
  width: 100%;
  transform: scaleX(var(--omar-p, 0));
  transform-origin: right center;
  background: var(--grad-spectrum);
}
html[dir="ltr"] .omar-scrollprog__bar { transform-origin: left center; }

html.has-omar-motion body.legend-platform {
  background-position:
    100% calc(-5% + var(--omar-bg-y)),
    -5% calc(20% + var(--omar-bg-y)),
    50% 105%,
    0 var(--omar-bg-y),
    0 0;
}

html.has-omar-motion .lg-hdr.is-scrolled {
  box-shadow: var(--shadow);
}
html.has-omar-motion .acc-topbar.is-scrolled .acc-topbar__bar {
  box-shadow: var(--shadow);
}

html.has-omar-motion .lg-hdr__companionMark {
  animation: omarBob 4.8s var(--ease) infinite;
}
html.has-omar-motion .lg-hdr__companionMark + .lg-hdr__companionMark {
  animation-duration: 5.6s;
  animation-delay: -1.1s;
}
html.has-omar-motion .lg-hdr__companionMark:hover {
  animation-play-state: paused;
}
@keyframes omarBob {
  0%, 100% { transform: translate3d(0, 0, 0); }
  50% { transform: translate3d(0, -3px, 0); }
}

html.has-omar-motion .omar-live {
  position: relative;
  isolation: isolate;
}
html.has-omar-motion .omar-shine {
  position: absolute;
  inset: 0;
  z-index: 4;
  pointer-events: none;
  border-radius: inherit;
  opacity: 0;
  background: radial-gradient(
    280px circle at var(--spot-x, 50%) var(--spot-y, 50%),
    rgba(255, 255, 255, .16),
    transparent 58%
  );
  transition: opacity .25s var(--ease);
}
html.has-omar-motion .omar-live:hover .omar-shine { opacity: 1; }
html.has-omar-motion[data-theme="dark"] .omar-shine {
  background: radial-gradient(
    280px circle at var(--spot-x, 50%) var(--spot-y, 50%),
    rgba(111, 224, 188, .12),
    transparent 58%
  );
}

html.has-omar-motion .lg-hero__photo,
html.has-omar-motion .lg-hero__copy {
  will-change: transform;
}

@media (prefers-reduced-motion: reduce) {
  .omar-scrollprog { display: none; }
  html.has-omar-motion .lg-hdr__companionMark { animation: none !important; }
}
