/* ================================================================
   שכבת אפקטים לכל האתר (js/fx.js). רק transform ו-opacity, מכבדת תנועה מופחתת ואת מתג העצירה (html.still).
   ================================================================ */
/* 1. כותרות: כל מילה עולה מתוך מסכה, ברצף */
html body h2 span.fx-w,.fx-w{display:inline-block!important;color:inherit!important;-webkit-text-stroke:inherit!important;overflow:hidden;vertical-align:top;padding-block:.06em .12em;margin-block:-.06em -.12em}
html body h2 span.fx-w>span,.fx-w>span{display:inline-block!important;color:inherit!important;-webkit-text-stroke:inherit!important;transform:translateY(108%);transition:transform .9s cubic-bezier(.2,.8,.2,1);transition-delay:calc(var(--wi,0)*55ms)}
.fx-in .fx-w>span{transform:none}
/* 2. כפתורים מגנטיים (נכתב ל-translate, לא ל-transform, כדי לא להתנגש בריחופים קיימים) */
.fx-mag{translate:var(--mx,0) var(--my,0);transition:translate .35s cubic-bezier(.2,.8,.2,1)}
.fx-mag.fx-mag--on{transition-duration:.12s}
/* 3. הילה שעוקבת אחרי העכבר על כרטיסים */
.fx-glow{position:absolute;inset:0;z-index:3;pointer-events:none;border-radius:inherit;opacity:0;transition:opacity .45s ease;
  background:radial-gradient(420px circle at var(--gx,50%) var(--gy,50%),rgba(231,53,122,.13),rgba(56,213,241,.05) 40%,transparent 65%)}
.fx-glow-host:hover>.fx-glow{opacity:1}
html[data-theme="light"] .fx-glow{background:radial-gradient(420px circle at var(--gx,50%) var(--gy,50%),rgba(231,53,122,.10),transparent 60%)}
/* 4. פס התקדמות גלילה */
.fx-progress{position:fixed;inset-block-start:0;inset-inline:0;height:2px;z-index:200;pointer-events:none;transform-origin:right center;transform:scaleX(var(--p,0));background:linear-gradient(270deg,#E7357A,#7B2FFF 55%,#38D5F1)}
/* 5. פרלקסה עדינה בתוך מסגרות תמונה */
.fx-par{scale:1.12;translate:0 var(--py,0)}
@media (prefers-reduced-motion:reduce){
  .fx-w>span{transform:none;transition:none}
  .fx-mag{translate:none}
  .fx-progress{display:none}
  .fx-par{scale:1;translate:none}
}