/* Shared motion layer for demo sites. Theme via --fx-accent / --fx-bg / --fx-ink on body */
.fx-curtain{position:fixed;inset:0;z-index:10000;background:var(--fx-bg,#0b0b0f);display:flex;align-items:center;justify-content:center;flex-direction:column;gap:18px;transition:clip-path 1s cubic-bezier(.76,0,.24,1);clip-path:inset(0 0 0 0)}
.fx-curtain.out{clip-path:inset(0 0 100% 0)}
.fx-curtain .fx-word{font-size:clamp(46px,9vw,120px);line-height:1;color:var(--fx-ink,#fff);overflow:hidden;display:flex}
.fx-curtain .fx-word span{display:inline-block;transform:translateY(110%);animation:fxUp .8s cubic-bezier(.16,1,.3,1) forwards}
.fx-curtain .fx-bar{width:160px;height:2px;background:rgba(127,127,127,.25);overflow:hidden;border-radius:2px}
.fx-curtain .fx-bar i{display:block;height:100%;width:0;background:var(--fx-accent,#ff3b5c);animation:fxBar .9s cubic-bezier(.65,0,.35,1) .15s forwards}
@keyframes fxUp{to{transform:none}}
@keyframes fxBar{to{width:100%}}

.fx-progress{position:fixed;left:0;top:0;height:3px;width:100%;transform-origin:0 50%;transform:scaleX(0);background:var(--fx-accent,#ff3b5c);z-index:9990;pointer-events:none}

.fx-cur,.fx-ring{position:fixed;top:0;left:0;pointer-events:none;z-index:9995;border-radius:50%}
.fx-cur{width:7px;height:7px;margin:-3.5px 0 0 -3.5px;background:var(--fx-accent,#ff3b5c)}
.fx-ring{width:40px;height:40px;margin:-20px 0 0 -20px;border:1.5px solid var(--fx-accent,#ff3b5c);opacity:.55;transition:width .35s cubic-bezier(.16,1,.3,1),height .35s cubic-bezier(.16,1,.3,1),margin .35s cubic-bezier(.16,1,.3,1),opacity .3s,background .3s}
.fx-ring.on{width:66px;height:66px;margin:-33px 0 0 -33px;opacity:.9;background:color-mix(in srgb,var(--fx-accent,#ff3b5c) 14%,transparent)}
@media (hover:none),(pointer:coarse){.fx-cur,.fx-ring{display:none}}

[data-split] .fx-w{display:inline-block;overflow:hidden;vertical-align:top;padding-bottom:.08em;margin-bottom:-.08em}
[data-split] .fx-w>span{display:inline-block;transform:translateY(108%) rotate(4deg);transition:transform 1.1s cubic-bezier(.16,1,.3,1)}
[data-split].fx-in .fx-w>span{transform:none}

[data-tilt]{transform-style:preserve-3d;will-change:transform}
[data-tilt] .fx-shine{position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:radial-gradient(400px circle at var(--sx,50%) var(--sy,50%),rgba(255,255,255,.14),transparent 45%);opacity:0;transition:opacity .4s;z-index:3}
[data-tilt]:hover .fx-shine{opacity:1}

.fx-fly{position:fixed;z-index:9980;pointer-events:none;width:90px;filter:drop-shadow(0 12px 18px rgba(0,0,0,.45))}
.fx-fly svg{width:100%;height:auto}
.fx-pop{animation:fxPop .5s cubic-bezier(.16,1,.3,1)}
@keyframes fxPop{40%{transform:scale(1.22)}}

@media (prefers-reduced-motion:reduce){.fx-curtain{display:none}}
