.intro-v4 .fx-surface{position:relative;isolation:isolate}
.fx-spot{position:absolute;inset:0;border-radius:inherit;pointer-events:none;z-index:0;opacity:0;background:radial-gradient(240px circle at var(--fx-x,50%) var(--fx-y,50%),#4d83ef14,transparent 72%);transition:opacity .3s}
.fx-surface[data-fx-hover=true]>.fx-spot{opacity:1}
.intro-v4 .cloud-service.fx-surface{transition:translate .28s,border-color .28s,box-shadow .28s}
.intro-v4 .cloud-service.fx-surface:hover{transform:none;translate:0 -4px;border-color:#9ab7ee;box-shadow:0 20px 45px #2457db0d}
.intro-v4 .cloud-apps{position:relative;isolation:isolate}
.intro-v4 .cloud-apps:before{content:"";position:absolute;inset:12% 0 12% 45%;z-index:-1;pointer-events:none;background:radial-gradient(ellipse,#4386f50c,transparent 70%)}
.intro-v4 .cloud-steps{position:relative;isolation:isolate}
.intro-v4 .cloud-steps>div{overflow:hidden}
.intro-v4 .cloud-steps>div:after{content:"";position:absolute;inset:auto 0 0;height:2px;background:linear-gradient(90deg,transparent,#5587ef,transparent);transform:scaleX(0);transform-origin:left}
.intro-v4 .cloud-steps.fx-entered>div:after{animation:fx-connect 1.5s ease both}
.intro-v4 .cloud-steps.fx-entered>div:nth-child(2):after{animation-delay:.3s}
.intro-v4 .cloud-steps.fx-entered>div:nth-child(3):after{animation-delay:.6s}
.intro-v4 .cloud-trial.fx-entered:before{animation:fx-orbit-arrive 3.5s ease-out both}
.intro-v4 .service-art.fx-art-entered>.mini-stack,.intro-v4 .service-art.fx-art-entered>.mini-rack,.intro-v4 .service-art.fx-art-entered>.mini-globe{animation:fx-art-arrive 1.1s cubic-bezier(.2,.7,.2,1) both}
.intro-v4 .application-board>a{transition:transform .25s,box-shadow .25s,border-color .25s}
.intro-v4 .application-board>a:hover{border-color:#9ab7ee;box-shadow:0 12px 32px #2457db12}
[data-theme=dark] .fx-spot{background:radial-gradient(240px circle at var(--fx-x,50%) var(--fx-y,50%),#6c9eff18,transparent 72%)}
[data-page-motion=paused] .intro-v4 :is(.fx-spot,.fx-surface,.application-board>a){transition:none}
[data-page-motion=paused] .fx-spot{opacity:0!important}
[data-page-motion=paused] .intro-v4 .fx-surface:hover{translate:none}
[data-page-motion=paused] .intro-v4 .cloud-steps>div:after,[data-page-motion=paused] .intro-v4 .cloud-trial:before,[data-page-motion=paused] .intro-v4 .service-art>*{animation:none!important}
[data-page-background=true] .intro-v4 :is(.cloud-steps>div:after,.cloud-trial:before,.service-art>*){animation-play-state:paused!important}
@keyframes fx-connect{0%{transform:scaleX(0);opacity:0}35%{opacity:.7}100%{transform:scaleX(1);opacity:0}}
@keyframes fx-orbit-arrive{from{transform:translate(30px,15px) scale(.96);opacity:.3}to{transform:none;opacity:1}}
@keyframes fx-art-arrive{from{translate:0 14px;opacity:.5}to{translate:0 0;opacity:1}}
@media(hover:none),(pointer:coarse){.fx-spot{display:none}.intro-v4 .cloud-service.fx-surface:hover{translate:none}}
@media(max-width:640px){.intro-v4 .cloud-apps:before{inset:45% 0 0}}
@media(prefers-reduced-motion:reduce){.fx-spot{display:none}.intro-v4 .cloud-steps>div:after,.intro-v4 .cloud-trial.fx-entered:before,.intro-v4 .service-art.fx-art-entered>*{animation:none!important}.intro-v4 .fx-surface,.intro-v4 .application-board>a{transition:none!important}.intro-v4 .cloud-service.fx-surface:hover{translate:none}}