/* VisioNext AI layer: energetic motion with the existing brand discipline. */
:root{--cyan:#4ecbff}
.hero-visual{isolation:isolate;perspective:900px;--mx:0deg;--my:0deg}
.hero-visual:after{content:'';position:absolute;inset:8% 3%;z-index:-1;border-radius:50%;background:radial-gradient(circle,rgba(78,203,255,.2),transparent 62%);filter:blur(12px);animation:ai-breathe 4.8s ease-in-out infinite}
.ai-grid{position:absolute;inset:7% 4%;opacity:.42;background-image:linear-gradient(rgba(67,174,255,.18) 1px,transparent 1px),linear-gradient(90deg,rgba(67,174,255,.18) 1px,transparent 1px);background-size:32px 32px;mask-image:radial-gradient(ellipse at center,#000 20%,transparent 72%);transform:rotate(-8deg) perspective(600px) rotateX(48deg);animation:grid-drift 13s linear infinite}
.orbit{will-change:transform}.orbit-a{animation:orbit-a 11s ease-in-out infinite}.orbit-b{animation:orbit-b 14s ease-in-out infinite reverse}.orbit-c{position:absolute;width:310px;height:310px;border:1px dashed rgba(78,203,255,.34);border-radius:50%;transform:rotate(24deg);animation:orbit-c 18s linear infinite}
.visual-card{overflow:hidden;transform:rotateX(var(--my)) rotateY(var(--mx));transition:transform .35s cubic-bezier(.2,.7,.2,1),box-shadow .35s;will-change:transform}
.visual-card:before{content:'';position:absolute;inset:0;background:linear-gradient(115deg,transparent 25%,rgba(255,255,255,.1) 50%,transparent 68%);transform:translateX(-130%);animation:card-sweep 5s ease-in-out infinite;pointer-events:none}
.visual-card:after{content:'';position:absolute;top:0;left:0;width:100%;height:2px;background:linear-gradient(90deg,transparent,var(--cyan),transparent);box-shadow:0 0 18px var(--cyan);animation:scan 3.6s ease-in-out infinite}
.card-kicker{display:flex;justify-content:space-between;align-items:center}.card-kicker i{font-size:13px;color:#4ecbff;font-style:normal;animation:live-pulse 1.6s ease-in-out infinite}.visual-number strong{animation:number-glow 3.2s ease-in-out infinite}
.live-chip{position:absolute;z-index:4;top:8%;right:1%;padding:9px 12px;border:1px solid rgba(78,203,255,.45);border-radius:99px;background:rgba(7,20,38,.78);backdrop-filter:blur(10px);color:#d9f4ff;font-size:9px;font-weight:800;letter-spacing:.09em;box-shadow:0 0 24px rgba(0,168,232,.17);animation:chip-float 4s ease-in-out infinite}.live-chip i,.card-status i{display:inline-block;width:6px;height:6px;margin-right:6px;border-radius:50%;background:#55e1ae;box-shadow:0 0 0 4px rgba(85,225,174,.15),0 0 13px #55e1ae;animation:live-pulse 1.6s ease-in-out infinite}
.signal{position:absolute;z-index:1;width:7px;height:7px;border-radius:50%;background:#4ecbff;box-shadow:0 0 0 5px rgba(78,203,255,.1),0 0 20px #4ecbff}.signal:after{content:'';position:absolute;left:50%;top:50%;width:60px;height:1px;background:linear-gradient(90deg,rgba(78,203,255,.8),transparent);transform-origin:left center}.signal-one{top:26%;left:13%;animation:signal-one 7s ease-in-out infinite}.signal-two{right:7%;bottom:24%;animation:signal-two 8s ease-in-out infinite}.signal-three{left:23%;bottom:12%;animation:signal-three 6s ease-in-out infinite}.signal-two:after{transform:rotate(155deg);width:80px}.signal-three:after{transform:rotate(-30deg);width:48px}
.scanline{position:absolute;z-index:3;left:50%;top:50%;width:430px;height:1px;background:linear-gradient(90deg,transparent,rgba(78,203,255,.6),transparent);transform:translate(-50%,-50%) rotate(-33deg);opacity:.65;animation:scanline 6s ease-in-out infinite;pointer-events:none}.ai-caption{position:absolute;z-index:3;bottom:3%;right:0;display:grid;gap:3px;color:#7894ae;font-size:9px;letter-spacing:.12em;text-transform:uppercase}.ai-caption b{color:#294d6a;font-size:10px;letter-spacing:0;text-transform:none}
.card-status{display:flex;justify-content:space-between;margin-top:21px;padding-top:12px;border-top:1px solid rgba(136,185,222,.2);color:#7491ac;font-size:9px;letter-spacing:.08em;text-transform:uppercase}.card-status span:first-child{color:#9bc9dc}
.audience-grid article,.steps article,.startup-guide,.quality-note{transition:transform .3s ease,box-shadow .3s ease}.audience-grid article:hover,.steps article:hover{transform:translateY(-5px);box-shadow:0 12px 25px rgba(7,20,38,.09)}.startup-guide:hover{box-shadow:0 20px 65px rgba(23,105,232,.16)}
@keyframes ai-breathe{0%,100%{transform:scale(.86);opacity:.5}50%{transform:scale(1.08);opacity:1}}@keyframes grid-drift{to{background-position:32px 32px}}@keyframes orbit-a{0%,100%{transform:rotate(-33deg) scale(1)}50%{transform:rotate(-25deg) scale(1.05)}}@keyframes orbit-b{0%,100%{transform:rotate(39deg) scale(1)}50%{transform:rotate(48deg) scale(.94)}}@keyframes orbit-c{to{transform:rotate(384deg)}}@keyframes card-sweep{0%,54%{transform:translateX(-130%)}76%,100%{transform:translateX(130%)}}@keyframes scan{0%,100%{top:0;opacity:0}15%,78%{opacity:1}90%{top:100%;opacity:0}}@keyframes scanline{0%,100%{opacity:0;transform:translate(-72%,-50%) rotate(-33deg)}35%,70%{opacity:.65;transform:translate(-28%,-50%) rotate(-33deg)}}@keyframes live-pulse{0%,100%{opacity:.65}50%{opacity:1;transform:scale(1.16)}}@keyframes number-glow{0%,100%{text-shadow:0 0 0 transparent}50%{text-shadow:0 0 26px rgba(78,203,255,.7)}}@keyframes chip-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}@keyframes signal-one{0%,100%{transform:translate(0,0)}50%{transform:translate(32px,20px)}}@keyframes signal-two{0%,100%{transform:translate(0,0)}50%{transform:translate(-26px,-23px)}}@keyframes signal-three{0%,100%{transform:translate(0,0)}50%{transform:translate(22px,-18px)}}
@media(max-width:760px){.live-chip{top:4%;right:0;font-size:8px}.ai-grid{inset:8% -3%}.orbit-c{width:245px;height:245px}.scanline{width:320px}.ai-caption{bottom:1%;right:4px}.card-status{margin-top:15px}.visual-card:before{animation-duration:6s}}
@media(prefers-reduced-motion:reduce){.hero-visual:after,.ai-grid,.orbit-a,.orbit-b,.orbit-c,.visual-card:before,.visual-card:after,.card-kicker i,.visual-number strong,.live-chip,.live-chip i,.card-status i,.scanline,.signal-one,.signal-two,.signal-three{animation:none}.visual-card{transform:none}}
