/* Digital Holding – motion layer. Only active when <html class="motion"> (set in <head>, skipped for prefers-reduced-motion). */
@view-transition{navigation:auto}
::view-transition-old(root){animation:vtOut .22s ease both}
::view-transition-new(root){animation:vtIn .32s cubic-bezier(.2,.7,.2,1) both}
@keyframes vtOut{to{opacity:0;transform:translateY(-6px)}}
@keyframes vtIn{from{opacity:0;transform:translateY(8px)}}

/* ---------- scroll progress + header ---------- */
.dhx-progress{position:fixed;top:0;left:0;right:0;height:3px;z-index:70;transform-origin:0 50%;transform:scaleX(0);background:linear-gradient(90deg,#A126E5,#6010A6,#31BA52);pointer-events:none}
[dir=rtl] .dhx-progress{transform-origin:100% 50%}
.hdr{transition:box-shadow .3s ease,background-color .3s ease,backdrop-filter .3s ease}
.hdr.is-scrolled{box-shadow:0 8px 30px rgba(40,20,90,.10);background:rgba(255,255,255,.86)!important}

/* ---------- hero load sequence ---------- */
@keyframes mUp{from{opacity:0;transform:translate3d(0,22px,0)}to{opacity:1;transform:none}}
@keyframes mFade{from{opacity:0}to{opacity:1}}
@keyframes mMask{from{opacity:0;clip-path:inset(0 0 100% 0);transform:translate3d(0,28px,0);filter:blur(6px)}to{opacity:1;clip-path:inset(0 0 -20% 0);transform:none;filter:none}}
@keyframes mShot{from{opacity:0;transform:perspective(1400px) rotateX(14deg) rotateY(-10deg) translate3d(30px,40px,0) scale(.94)}to{opacity:1;transform:perspective(1400px) rotateX(0) rotateY(0) translate3d(0,0,0) scale(1)}}
@keyframes mPop{0%{opacity:0;transform:translate3d(0,14px,0) scale(.86)}70%{opacity:1;transform:translate3d(0,-3px,0) scale(1.03)}100%{opacity:1;transform:none}}
@keyframes mBob{0%,100%{translate:0 0}50%{translate:0 -9px}}
@keyframes mBlob{0%{transform:translate3d(0,0,0) scale(1)}50%{transform:translate3d(-6%,4%,0) scale(1.12)}100%{transform:translate3d(0,0,0) scale(1)}}
@keyframes mShine{from{transform:translateX(-120%) skewX(-20deg)}to{transform:translateX(220%) skewX(-20deg)}}

html.motion #main>section:first-of-type{position:relative;isolation:isolate}
.m-bg{position:absolute;inset:0;overflow:hidden;z-index:-1;pointer-events:none}
html.motion .m-bg::before{content:"";position:absolute;z-index:-1;width:62vmax;height:62vmax;right:-18vmax;top:-26vmax;border-radius:50%;background:radial-gradient(closest-side,rgba(161,38,229,.20),rgba(161,38,229,0));animation:mBlob 14s ease-in-out infinite;pointer-events:none}
html.motion .m-bg::after{content:"";position:absolute;z-index:-1;width:40vmax;height:40vmax;left:-14vmax;bottom:-22vmax;border-radius:50%;background:radial-gradient(closest-side,rgba(49,186,82,.10),rgba(49,186,82,0));animation:mBlob 18s ease-in-out -6s infinite reverse;pointer-events:none}
html.motion #main>section:first-of-type .crumbs{animation:mFade .6s ease both}
html.motion #main>section:first-of-type .eyebrow,html.motion #main>section:first-of-type .dhx-badge2,html.motion #main>section:first-of-type .dhx-status{animation:mUp .7s cubic-bezier(.2,.7,.2,1) .05s both}
html.motion #main>section:first-of-type h1{animation:mMask 1s cubic-bezier(.2,.7,.2,1) .15s both}
html.motion #main>section:first-of-type h1 .hl{display:inline;background:linear-gradient(90deg,#A126E5,#6010A6 45%,#A126E5);background-size:200% 100%;-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;animation:mHl 6s ease-in-out 1.2s infinite}
@keyframes mHl{0%,100%{background-position:0 0}50%{background-position:100% 0}}
html.motion #main>section:first-of-type .sub{animation:mUp .8s cubic-bezier(.2,.7,.2,1) .38s both}
html.motion #main>section:first-of-type .lead{animation:mUp .8s cubic-bezier(.2,.7,.2,1) .48s both}
html.motion #main>section:first-of-type .hero-actions{animation:mUp .8s cubic-bezier(.2,.7,.2,1) .6s both}
html.motion #main>section:first-of-type .hero-proof li{animation:mPop .6s cubic-bezier(.2,.7,.2,1) both}
html.motion #main>section:first-of-type .hero-proof li:nth-child(1){animation-delay:.78s}
html.motion #main>section:first-of-type .hero-proof li:nth-child(2){animation-delay:.86s}
html.motion #main>section:first-of-type .hero-proof li:nth-child(3){animation-delay:.94s}
html.motion #main>section:first-of-type .hero-proof li:nth-child(4){animation-delay:1.02s}
html.motion #main>section:first-of-type .hero-shot,html.motion #main>section:first-of-type .dhx-int-shot,html.motion #main>section:first-of-type .shotwrap>img{animation:mShot 1.2s cubic-bezier(.16,.84,.24,1) .25s both;will-change:transform}
html.motion #main>section:first-of-type .float{animation:mPop .7s cubic-bezier(.2,.7,.2,1) both,mBob 5.5s ease-in-out infinite}
html.motion #main>section:first-of-type .float.f1{animation-delay:1s,1.7s}
html.motion #main>section:first-of-type .float.f2{animation-delay:1.15s,2.4s}
html.motion #main>section:first-of-type .float.f3{animation-delay:1.3s,3.1s}
html.motion #main>section:first-of-type .searchcard{animation:mUp .9s cubic-bezier(.2,.7,.2,1) .85s both}
html.motion #main>section:first-of-type .badge{animation:mUp .8s cubic-bezier(.2,.7,.2,1) .7s both}
html.motion .hdr{animation:mFade .5s ease both}

/* ---------- scroll reveal (classes set by dhx-motion.js) ---------- */
html.motion .rv{opacity:0;transform:translate3d(0,28px,0);transition:opacity .75s cubic-bezier(.2,.7,.2,1),transform .75s cubic-bezier(.2,.7,.2,1);transition-delay:var(--d,0s)}
html.motion .rv.rv-l{transform:translate3d(-36px,0,0)}html.motion .rv.rv-r{transform:translate3d(36px,0,0)}
html.motion .rv.rv-s{transform:scale(.94)}
[dir=rtl] html.motion .rv.rv-l,html.motion[dir=rtl] .rv.rv-l{transform:translate3d(36px,0,0)}
html.motion[dir=rtl] .rv.rv-r{transform:translate3d(-36px,0,0)}
html.motion .rv.in{opacity:1;transform:none}
html.motion-off .rv{opacity:1!important;transform:none!important}
html.motion h2 .hl{background-image:linear-gradient(transparent 82%,rgba(161,38,229,.22) 82%);background-repeat:no-repeat;background-size:0 100%;transition:background-size .9s cubic-bezier(.2,.7,.2,1) .35s}
html.motion .in h2 .hl,html.motion h2.in .hl{background-size:100% 100%}

/* ---------- micro-interactions ---------- */
.card,.tcard,.ccard,.dhx-pcard,.plan,.logo-chip,.scard,.cfg-opt>span,.dhx-rowi,.qcard .formcard{transition:transform .35s cubic-bezier(.2,.7,.2,1),box-shadow .35s ease,border-color .35s ease}
@media(hover:hover){
 .card:hover,.tcard:hover,.ccard:hover,.dhx-pcard:hover,.plan:hover,.scard:hover{transform:translateY(-6px);box-shadow:0 22px 48px rgba(96,16,166,.14)}
 .logo-chip:hover{transform:translateY(-3px) scale(1.03)}
 .dhx-rowi:hover{transform:translateX(4px)}
 [dir=rtl] .dhx-rowi:hover{transform:translateX(-4px)}
 .btn-primary{position:relative;overflow:hidden}
 .btn-primary::after{content:"";position:absolute;top:0;bottom:0;left:0;width:40%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.35),transparent);transform:translateX(-120%) skewX(-20deg);pointer-events:none}
 .btn-primary:hover::after{animation:mShine .8s ease}
 .btn{transition:transform .2s ease,box-shadow .25s ease,background-color .2s ease,color .2s ease}
 .btn:active{transform:scale(.97)}
}
.tilt{transform-style:preserve-3d;transition:transform .2s ease-out}
.cfg-mbar.on{animation:mUp .35s cubic-bezier(.2,.7,.2,1) both}
.mbar{animation:mUp .5s cubic-bezier(.2,.7,.2,1) 1.2s both}

@media (prefers-reduced-motion:reduce){
 *,*::before,*::after{animation:none!important;transition:none!important}
 .rv{opacity:1!important;transform:none!important}
 @view-transition{navigation:none}
}
#main{overflow-x:clip}
@media(max-width:900px){html.motion .rv.rv-l,html.motion .rv.rv-r,html.motion[dir=rtl] .rv.rv-l,html.motion[dir=rtl] .rv.rv-r{transform:translate3d(0,24px,0)}}