/* =========================================================================
   الصعود الاستثنائي — طبقة الحركة العامة (Motion v2)
   تُضاف فوق التصميم دون تغيير المحتوى
   ========================================================================= */

/* ---------- headings: word-by-word rise ---------- */
.fx-split .w{display:inline-block;opacity:0;transform:translateY(.6em);filter:blur(6px);transition:opacity .8s var(--ease-out),transform .9s var(--ease-out),filter .8s var(--ease-out);transition-delay:calc(var(--i,0) * 55ms)}
.fx-split.fx-in .w{opacity:1;transform:none;filter:none}

/* eyebrow line grows in */
.fx-eyebrow::before,.fx-eyebrow::after{transform:scaleX(0);transform-origin:center;transition:transform 1s var(--ease-out) .15s}
.fx-eyebrow.fx-in::before,.fx-eyebrow.fx-in::after{transform:scaleX(1)}

/* ---------- icons draw their strokes ---------- */
.fx-draw :is(path,line,polyline,polygon,circle,rect,ellipse){stroke-dasharray:1;stroke-dashoffset:1;transition:stroke-dashoffset 1.3s var(--ease-out);transition-delay:calc(var(--i,0) * 70ms + .1s)}
.fx-draw.fx-in :is(path,line,polyline,polygon,circle,rect,ellipse){stroke-dashoffset:0}

/* ---------- images: curtain reveal + settle ---------- */
.fx-img{clip-path:inset(0 0 100% 0);transition:clip-path 1.25s var(--ease-out)}
.fx-img.fx-in{clip-path:inset(-60px)}
.fx-img img{transform:scale(1.18);transition:transform 1.8s var(--ease-out)}
.fx-img.fx-in img{transform:scale(1)}
.acard:hover .fx-img.fx-in img{transform:scale(1.07)}

/* parallax images (JS drives --py) */
.fx-par{transform:translate3d(0,var(--py,0px),0) scale(1.12)!important;transition:none!important;will-change:transform}

/* ---------- ambient light in dark sections ---------- */
.fx-host>.container,.fx-host>.stats{position:relative;z-index:2}
.cta>.fx-amb,.cta>.fx-rise{z-index:1}
.fx-amb{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:0}
.fx-amb i{position:absolute;border-radius:50%;filter:blur(70px);opacity:.42;mix-blend-mode:screen;will-change:transform}
.fx-amb i:nth-child(1){width:46vw;height:46vw;max-width:620px;max-height:620px;background:radial-gradient(circle,rgba(58,215,5,.38),transparent 65%);top:-18%;inset-inline-start:-10%;animation:fxDrift1 22s ease-in-out infinite alternate}
.fx-amb i:nth-child(2){width:40vw;height:40vw;max-width:560px;max-height:560px;background:radial-gradient(circle,rgba(0,198,184,.34),transparent 65%);bottom:-24%;inset-inline-end:-8%;animation:fxDrift2 26s ease-in-out infinite alternate}
.fx-amb i:nth-child(3){width:30vw;height:30vw;max-width:420px;max-height:420px;background:radial-gradient(circle,rgba(179,215,7,.26),transparent 65%);top:30%;inset-inline-start:42%;animation:fxDrift3 30s ease-in-out infinite alternate}
.fx-amb b{position:absolute;inset:0;background:radial-gradient(420px 420px at var(--cx,50%) var(--cy,50%),rgba(122,224,42,.10),transparent 60%);opacity:0;transition:opacity .6s}
.fx-host:hover .fx-amb b{opacity:1}
.fx-amb::after{content:"";position:absolute;top:0;inset-inline:0;height:1px;background:linear-gradient(90deg,transparent,rgba(122,224,42,.7),rgba(0,198,184,.6),transparent);transform:scaleX(0);transition:transform 1.8s var(--ease-out)}
.fx-host.fx-in .fx-amb::after{transform:scaleX(1)}
@keyframes fxDrift1{to{transform:translate3d(18vw,10vh,0) scale(1.15)}}
@keyframes fxDrift2{to{transform:translate3d(-16vw,-12vh,0) scale(1.2)}}
@keyframes fxDrift3{to{transform:translate3d(-12vw,8vh,0) scale(.85)}}

/* rising "ascent" particles */
.fx-rise{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:1;opacity:.85}

/* ---------- cards: depth on hover ---------- */
.fx-tilt{transform-style:preserve-3d;will-change:transform}
.fx-tilt.fx-tilting{transition:transform .12s linear,box-shadow .4s,border-color .4s!important}

/* ---------- process steps: sequential glow ---------- */
.process.is-in .step__badge{animation:fxPulse 3.6s ease-in-out infinite;animation-delay:calc(var(--i,0) * .6s + 1.6s)}
@keyframes fxPulse{0%,100%{box-shadow:0 0 0 8px rgba(255,255,255,.03)}40%{box-shadow:0 0 0 8px rgba(255,255,255,.03),0 0 0 16px rgba(58,215,5,.12),0 0 40px rgba(58,215,5,.35)}}

/* ---------- stats: underline fill when counted ---------- */
.fx-stat{position:relative}
.fx-stat::after{content:"";position:absolute;inset-inline:30%;bottom:-10px;height:2px;border-radius:2px;background:var(--gold-grad);transform:scaleX(0);transition:transform 1.6s var(--ease-out) .3s}
.fx-stat.fx-in::after{transform:scaleX(1)}

/* ---------- page transitions ---------- */
@keyframes fxPageIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
main{animation:fxPageIn .6s var(--ease-out) backwards}
html.fx-leave main,html.fx-leave .site-footer{opacity:0;transform:translateY(-6px);transition:opacity .28s ease,transform .28s ease}

/* ---------- scroll progress: brand gradient glow ---------- */
.scroll-progress{box-shadow:0 0 12px rgba(58,215,5,.55)}

/* ---------- reduced motion / no-js ---------- */
@media (prefers-reduced-motion:reduce){
  .fx-split .w{opacity:1!important;transform:none!important;filter:none!important}
  .fx-draw :is(path,line,polyline,polygon,circle,rect,ellipse){stroke-dashoffset:0!important}
  .fx-img{clip-path:none!important}.fx-img img{transform:none!important}
  .fx-amb i{animation:none!important}.fx-rise{display:none}
  .fx-eyebrow::before,.fx-eyebrow::after,.fx-stat::after{transform:none!important}
  main{animation:none}
}
@media print{.fx-amb,.fx-rise{display:none!important}.fx-split .w{opacity:1!important;transform:none!important;filter:none!important}.fx-img{clip-path:none!important}}