/* ============================================================
   תנועה עדינה בדף  —  motion.css (יחד עם motion.js)
   הכול פועל רק כשל-<html> יש class="motion". מי שביקש "פחות תנועה"
   במערכת ההפעלה, או אם motion.js לא נטען, רואה את הדף הרגיל בלי אנימציות.
   משמש גם את הביבליוגרפיה (sources/). הסדר והמהירות של כל אלמנט נקבעים ב-motion.js (PAGES).
   ============================================================ */
:root{
  --mo-ease: cubic-bezier(.2,.7,.2,1);
  --mo-pop:  cubic-bezier(.34,1.56,.64,1);
}

/* ---------- סוגי הכניסה ---------- */
@keyframes moUp{ from{ opacity:0; transform:translateY(18px); } to{ opacity:1; transform:none; } }
@keyframes moSideRtl{ from{ opacity:0; transform:translateX(22px); } to{ opacity:1; transform:none; } }
@keyframes moSideLtr{ from{ opacity:0; transform:translateX(-22px); } to{ opacity:1; transform:none; } }
@keyframes moPop{ 0%{ opacity:0; transform:scale(.4) rotate(-12deg); } 70%{ opacity:1; transform:scale(1.08) rotate(0); } 100%{ opacity:1; transform:none; } }
@keyframes moBook{ from{ opacity:0; transform:translateY(26px) scale(.96); } to{ opacity:1; transform:none; } }
/* התגית "חדש" יושבת בתוך הספר התלת־ממדי, לכן היא שומרת על translateZ שלה */
@keyframes moBadge{ 0%{ opacity:0; transform:translateZ(60px) scale(.3) rotate(-14deg); } 70%{ opacity:1; transform:translateZ(60px) scale(1.1); } 100%{ opacity:1; transform:translateZ(60px); } }
/* האלמנט עצמו רק מופיע; התנועה היא של מה שבתוכו (למשל: קודם הסמל, אחר כך המילה) */
@keyframes moShow{ from{ opacity:1; } to{ opacity:1; } }
@keyframes moSheen{ from{ transform:translateX(-120%) skewX(-20deg); } to{ transform:translateX(220%) skewX(-20deg); } }

/* ---------- ממתין: מוסתר עד שמגיע תורו ---------- */
.motion .rv-wait,
.motion .rv-wait-kids > *{ opacity:0; }
/* עד ש-motion.js מכין את הרצף, ראש הדף מוסתר (כדי שלא יהבהב) */
.motion:not(.mo-ready) .hero-grid,
.motion:not(.mo-ready) div.hero,
.motion:not(.mo-ready) .crumb, .motion:not(.mo-ready) .docpage{ opacity:0; }

/* ---------- נכנס ---------- */
.motion .rv-run{
  animation:var(--anim, moUp) var(--dur, 1000ms) var(--mo-ease) both;
  animation-delay:var(--d, 0ms);
}
.motion .rv-run.book-badge{ animation-timing-function:var(--mo-pop); }

/* הסמל שבתוך השורה קופץ פנימה רגע אחרי שהשורה מתחילה להיכנס */
.motion .rv-run .tier-ico,
.motion .rv-run .review-q,
.motion .rv-run.share-title .share-ico,
.motion .milestones > li.rv-run > i,
.motion .entry.rv-run > .num{
  animation:moPop calc(var(--dur, 1000ms) * .8) var(--mo-pop) both;
  animation-delay:calc(var(--d, 0ms) + var(--dur, 1000ms) * .35);
}

/* עיון · תיעוד · טיעון, והשורות של "על הספר": קודם הסמל קופץ, ואז הכיתוב נכנס לידו */
.motion .perks > li.rv-run > .perk-ico,
.motion .feat-card > li.rv-run > .feat-ico{
  animation:moPop calc(var(--dur, 1000ms) * .7) var(--mo-pop) both;
}
.motion .perks > li.rv-run > :not(.perk-ico),
.motion .feat-card > li.rv-run > :not(.feat-ico){
  animation:var(--side, moSideRtl) calc(var(--dur, 1000ms) * .7) var(--mo-ease) both;
  animation-delay:calc(var(--dur, 1000ms) * .4);
}
.motion[dir="ltr"]{ --side:moSideLtr; }

/* ---------- ברק אחד שעובר על כפתור ההזמנה ---------- */
.motion .btn.mo-sheen{ position:relative; overflow:hidden; }
.motion .btn.mo-sheen::after{
  content:""; position:absolute; inset:0; width:40%; pointer-events:none;
  background:linear-gradient(90deg, transparent, rgba(255,255,255,.45), transparent);
  animation:moSheen 1.4s ease-out 1 both;
}

/* ---------- סרגל עליון: צל עדין כשגוללים ---------- */
header.site, header.mast{ transition:box-shadow .25s ease, background-color .25s ease; }
.motion header.site.mo-scrolled,
.motion header.mast.mo-scrolled{ box-shadow:0 6px 18px rgba(20,32,52,.08); }

/* ---------- בהדפסה הכול גלוי ---------- */
@media print{
  .motion .rv-wait, .motion .rv-wait-kids > *, .motion:not(.mo-ready) .hero-grid, .motion:not(.mo-ready) div.hero,
  .motion:not(.mo-ready) .crumb, .motion:not(.mo-ready) .docpage{ opacity:1 !important; }
}

/* ---------- פחות תנועה ---------- */
@media (prefers-reduced-motion: reduce){
  .motion .rv-wait, .motion .rv-wait-kids > *{ opacity:1; }
  .motion .rv-run, .motion .rv-run *, .motion .btn.mo-sheen::after{ animation:none !important; }
}
