/* v9: iConnect and iGoinLearn showcase pages */
.ax-hero,.ax-try{position:relative;overflow:clip;isolation:isolate;color:#C9DCEC}
.ax-hero{padding:clamp(118px,12vw,150px) 0 clamp(70px,8vw,110px);background:#030914;min-height:min(100svh,980px);display:flex;align-items:center}
.ax-hero>.wrap{width:100%}
.ax-hero canvas.net{position:absolute;inset:0;width:100%;height:100%;z-index:-1;opacity:.5}
.ax-hero .crumbs,.ax-hero .crumbs a{color:#9FC3E0}
.ax-aurora{position:absolute;inset:-20%;z-index:-2;filter:blur(70px) saturate(140%)}
.ax-aurora i{position:absolute;border-radius:50%;opacity:.55;mix-blend-mode:screen;animation:axFloat 18s ease-in-out infinite alternate}
.ax-aurora i:nth-child(1){width:46vw;height:46vw;left:4%;top:8%;background:#1A9AD6}
.ax-aurora i:nth-child(2){width:38vw;height:38vw;right:6%;top:0;background:#5A45B5;animation-duration:22s;animation-delay:-6s}
.ax-aurora i:nth-child(3){width:30vw;height:30vw;left:38%;bottom:4%;background:#0EA5E9;animation-duration:26s;animation-delay:-12s}
.ax-aurora i:nth-child(4){width:22vw;height:22vw;right:24%;bottom:14%;background:#22D3EE;opacity:.35;animation-duration:15s}
.ax-hero.igl .ax-aurora i:nth-child(1){background:#7C3AED}.ax-hero.igl .ax-aurora i:nth-child(2){background:#1A9AD6}.ax-hero.igl .ax-aurora i:nth-child(3){background:#C026D3;opacity:.35}
@keyframes axFloat{to{transform:translate3d(6vw,-4vw,0) scale(1.15)}}
.ax-gridfloor{position:absolute;left:-10%;right:-10%;bottom:-2px;height:46%;z-index:-1;background-image:linear-gradient(rgba(125,211,252,.22) 1px,transparent 1px),linear-gradient(90deg,rgba(125,211,252,.22) 1px,transparent 1px);background-size:64px 64px;transform:perspective(520px) rotateX(64deg);transform-origin:bottom;-webkit-mask:linear-gradient(to top,#000 10%,transparent 85%);mask:linear-gradient(to top,#000 10%,transparent 85%);animation:axGrid 6s linear infinite}
@keyframes axGrid{to{background-position:0 64px}}
.ax-hero-grid{display:grid;grid-template-columns:1fr 1.08fr;gap:clamp(30px,5vw,70px);align-items:center}
.ax-brand{display:flex;align-items:flex-end;gap:12px;margin:10px 0 8px}
.ax-logo{height:clamp(56px,6.4vw,92px);width:auto;filter:drop-shadow(0 10px 40px rgba(26,154,214,.55))}
.ax-hero.igl .ax-logo{height:clamp(48px,5.4vw,74px);filter:drop-shadow(0 10px 40px rgba(167,139,250,.55)) brightness(1.15)}
.ax-by{margin-bottom:10px;padding:3px 10px;border-radius:99px;border:1px solid rgba(125,211,252,.3);color:#9FD8F7;font-size:.74rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase}
.ax-hero h1{color:#fff;font-size:clamp(2.4rem,1.2rem + 3.8vw,4.6rem);line-height:1.02;margin:12px 0 18px;letter-spacing:-.025em}
.ax-hero .lead{color:#BFD3E6;max-width:56ch}
.ax-mini{display:flex;flex-wrap:wrap;gap:8px 18px;margin-top:22px}.ax-mini span{display:inline-flex;align-items:center;gap:7px;color:#A9C4DC;font-size:.88rem}.ax-mini svg{width:16px;height:16px;color:#34D399}
.btn-lg{padding:15px 26px!important;font-size:1.02rem!important}
html body .ax-hero a.btn.btn-ghost,html body .ax-try a.btn.btn-ghost{background:rgba(255,255,255,.08)!important;color:#fff!important;-webkit-text-fill-color:#fff!important;border-color:rgba(255,255,255,.28)!important;backdrop-filter:blur(8px)}
html body .ax-hero a.btn.btn-ghost:hover,html body .ax-try a.btn.btn-ghost:hover{background:rgba(255,255,255,.16)!important}
.ax-magnet{position:relative;transition:transform .25s cubic-bezier(.2,.8,.2,1),box-shadow .3s!important;box-shadow:0 18px 50px -14px rgba(26,154,214,.9),0 0 0 0 rgba(56,189,248,.5)!important;animation:axPulse 2.6s ease-out infinite}
@keyframes axPulse{70%{box-shadow:0 18px 50px -14px rgba(26,154,214,.9),0 0 0 16px rgba(56,189,248,0)}}
/* 3D stage */
.ax-stage{position:relative;perspective:1400px;transform-style:preserve-3d}
.ax-device{position:relative;border-radius:22px;overflow:hidden;transform:rotateY(-14deg) rotateX(8deg) rotateZ(1deg);transform-style:preserve-3d;box-shadow:0 60px 120px -40px rgba(0,0,0,.9),0 0 0 1px rgba(125,211,252,.25),0 0 120px -30px rgba(56,189,248,.7);transition:transform .5s cubic-bezier(.2,.8,.2,1);animation:axHover 7s ease-in-out infinite}
.ax-device img{display:block;width:100%;height:auto}
.ax-device::after{content:"";position:absolute;inset:0;background:linear-gradient(115deg,rgba(255,255,255,.18) 0%,transparent 32%,transparent 70%,rgba(255,255,255,.06));pointer-events:none}
.ax-device.tablet{max-width:560px;margin-left:auto;border-radius:26px;padding:12px;background:linear-gradient(160deg,#1c2b44,#0b1424)}
.ax-device.tablet>*{border-radius:16px;overflow:hidden}
@keyframes axHover{50%{translate:0 -12px}}
.ax-chip{position:absolute;display:inline-flex;align-items:center;gap:8px;padding:10px 14px;border-radius:14px;background:rgba(8,20,38,.78);border:1px solid rgba(125,211,252,.3);color:#fff;font-size:.85rem;font-weight:700;backdrop-filter:blur(12px);box-shadow:0 20px 40px -20px rgba(0,0,0,.8);transform:translateZ(80px);animation:axChip 6s ease-in-out infinite;white-space:nowrap}
.ax-chip svg{width:17px;height:17px;color:#7DD3FC}
.ax-chip.c1{left:-4%;top:6%}.ax-chip.c2{right:-3%;top:24%;animation-delay:-1.5s}.ax-chip.c3{left:6%;bottom:6%;animation-delay:-3s}.ax-chip.c4{right:4%;bottom:-3%;animation-delay:-4.5s}
.ax-hero.igl .ax-chip svg{color:#C4B5FD}
@keyframes axChip{50%{transform:translateZ(80px) translateY(-10px)}}
/* marquee */
.ax-marquee{position:relative;overflow:hidden;padding:18px 0;background:linear-gradient(90deg,#071a33,#0b1d3b,#071a33);border-block:1px solid rgba(125,211,252,.15);-webkit-mask:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);mask:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.ax-mq-track{display:flex;gap:46px;width:max-content;animation:axMq 38s linear infinite}
.ax-mq-track span{display:inline-flex;align-items:center;gap:10px;color:#DCEBFA;font-weight:700;font-size:.98rem;white-space:nowrap}.ax-mq-track svg{width:20px;height:20px;color:#38BDF8}
.ax-marquee:hover .ax-mq-track{animation-play-state:paused}
@keyframes axMq{to{transform:translateX(-50%)}}
/* tabs */
.ax-tabs{position:relative;display:inline-flex;gap:4px;padding:5px;margin:0 auto 30px;border-radius:16px;background:rgba(255,255,255,.06);border:1px solid rgba(125,211,252,.18)}
#who .wrap{text-align:left}#who .ax-tabs{display:flex;width:max-content;max-width:100%}
.ax-tabs button{position:relative;z-index:1;display:inline-flex;align-items:center;gap:8px;padding:11px 18px;border:0;border-radius:12px;background:none;color:#A9C4DC;font:700 .95rem/1 inherit;cursor:pointer;transition:color .3s}
.ax-tabs button svg{width:18px;height:18px}.ax-tabs button[aria-selected=true]{color:#fff}
.ax-tabs-ink{position:absolute;z-index:0;top:5px;bottom:5px;left:5px;width:0;border-radius:12px;background:linear-gradient(135deg,#1A9AD6,#5A45B5);box-shadow:0 10px 30px -10px rgba(56,189,248,.9);transition:left .45s cubic-bezier(.2,.8,.2,1),width .45s cubic-bezier(.2,.8,.2,1)}
.ax-panel{display:none}.ax-panel.on{display:block;animation:axIn .6s cubic-bezier(.2,.8,.2,1) both}
.ax-panel .sx-cards{grid-template-columns:repeat(2,1fr)}
.ax-panel .sx-price{margin-top:22px}
@keyframes axIn{from{opacity:0;transform:translateY(24px);filter:blur(6px)}}
/* gallery */
.ax-gal-sec{padding-bottom:clamp(50px,6vw,80px)}
.ax-gal{display:flex;gap:26px;overflow-x:auto;scroll-snap-type:x mandatory;padding:30px max(16px,calc((100vw - 1200px)/2)) 40px;scrollbar-width:none;perspective:1600px}
.ax-gal::-webkit-scrollbar{display:none}
.ax-shot{flex:none;width:min(560px,82vw);margin:0;scroll-snap-align:center;transform:scale(.88) rotateY(var(--ry,0deg));opacity:.55;transition:transform .6s cubic-bezier(.2,.8,.2,1),opacity .6s}
.ax-shot.tall{width:min(270px,58vw)}
.ax-shot.on{transform:scale(1) rotateY(0);opacity:1}
.ax-shot-img{border-radius:20px;overflow:hidden;background:#0b1424;box-shadow:0 40px 80px -30px rgba(0,0,0,.9),0 0 0 1px rgba(125,211,252,.22);aspect-ratio:16/10;display:grid;place-items:center}
.ax-shot.tall .ax-shot-img{aspect-ratio:auto;height:min(520px,70vh)}
.ax-shot-img img{width:100%;height:100%;object-fit:cover;object-position:top center}
.ax-shot.tall .ax-shot-img img{object-fit:contain}
.ax-shot.on .ax-shot-img{box-shadow:0 50px 100px -30px rgba(0,0,0,.9),0 0 0 1px rgba(125,211,252,.4),0 0 80px -20px rgba(56,189,248,.6)}
.ax-shot figcaption{padding:16px 4px 0;opacity:0;transform:translateY(10px);transition:all .5s .1s}.ax-shot.on figcaption{opacity:1;transform:none}
.ax-shot figcaption b{display:block;color:#fff;font-size:1.05rem}.ax-shot figcaption span{color:#A9C4DC;font-size:.9rem}
.ax-gal-nav{display:flex;align-items:center;justify-content:center;gap:18px}
.ax-gal-nav button{width:46px;height:46px;border-radius:50%;border:1px solid rgba(125,211,252,.35);background:rgba(255,255,255,.06);color:#fff;font-size:1.2rem;cursor:pointer;transition:all .25s}.ax-gal-nav button:hover{background:#1A9AD6;border-color:#1A9AD6;transform:scale(1.08)}
.ax-gal-dots{display:flex;gap:7px}.ax-gal-dots i{width:8px;height:8px;border-radius:99px;background:rgba(255,255,255,.25);transition:all .3s;cursor:pointer}.ax-gal-dots i.on{width:26px;background:#38BDF8}
/* steps path */
.ax-path{list-style:none;margin:10px 0 30px;padding:0;display:grid;grid-template-columns:repeat(4,1fr);gap:18px;position:relative}
.ax-path::before{content:"";position:absolute;left:4%;right:4%;top:31px;height:2px;background:linear-gradient(90deg,#1A9AD6,#A78BFA,#34D399);opacity:.5;transform-origin:left;transform:scaleX(var(--p,0));transition:transform 1.4s cubic-bezier(.2,.8,.2,1)}
.ax-path.in::before{--p:1}
.ax-path li{position:relative;display:flex;flex-direction:column;gap:14px}
.ax-n{position:relative;z-index:1;display:grid;place-items:center;width:62px;height:62px;border-radius:20px;background:linear-gradient(135deg,#1A9AD6,#5A45B5);color:#fff;font:800 1.5rem/1 "Sora",sans-serif;box-shadow:0 18px 40px -14px rgba(56,189,248,.9)}
.ax-path h3{color:#fff;margin:0 0 6px;font-size:1.1rem}.ax-path p{margin:0;color:#B4C9DD;font-size:.94rem;line-height:1.55}
/* final try */
.ax-try{padding:clamp(100px,12vw,170px) 0;background:radial-gradient(70% 70% at 50% 40%,#0c2547,#030914 75%);text-align:center}
.ax-try h2{color:#fff;font-size:clamp(2.2rem,1.2rem + 3.4vw,4.2rem);line-height:1.04;margin:30px auto 16px;max-width:16ch;letter-spacing:-.02em}
.ax-try .lead{color:#BFD3E6;max-width:56ch;margin:0 auto 30px}
.btn-row.center{justify-content:center}
.ax-try-bg{position:absolute;inset:0;z-index:-2;overflow:hidden}
.ax-try-bg i{position:absolute;left:50%;top:44%;width:120vmax;height:120vmax;margin:-60vmax 0 0 -60vmax;border-radius:50%;background:conic-gradient(from 0deg,transparent,rgba(26,154,214,.18),transparent 30%,rgba(90,69,181,.16),transparent 60%,rgba(52,211,153,.1),transparent);animation:spin 40s linear infinite}
.ax-try-bg i:nth-child(2){animation-duration:60s;animation-direction:reverse;opacity:.7}.ax-try-bg i:nth-child(3){animation-duration:90s;opacity:.4}
.ax-try.igl .ax-try-bg i{background:conic-gradient(from 0deg,transparent,rgba(167,139,250,.2),transparent 30%,rgba(26,154,214,.16),transparent 60%,rgba(192,38,211,.1),transparent)}
.ax-stars{position:absolute;inset:0;width:100%;height:100%;z-index:-1}
.ax-try-orb{position:relative;width:170px;height:170px;margin:0 auto;display:grid;place-items:center}
.ax-try-orb img{position:relative;z-index:2;width:104px;height:104px;border-radius:28px;box-shadow:0 20px 60px -10px rgba(56,189,248,.9);animation:axHover 5s ease-in-out infinite}
.ax-try-orb .ring{position:absolute;inset:0;border-radius:50%;border:1.5px solid rgba(125,211,252,.45);animation:axRing 3.6s ease-out infinite}
.ax-try-orb .r2{animation-delay:1.2s}.ax-try-orb .r3{animation-delay:2.4s}
.ax-try.igl .ax-try-orb .ring{border-color:rgba(196,181,253,.5)}
@keyframes axRing{from{transform:scale(.6);opacity:1}to{transform:scale(1.9);opacity:0}}
.ax-third{display:block;width:100%;margin-top:18px;color:#9FD8F7;font-weight:600;text-decoration:none}.ax-third:hover{color:#fff;text-decoration:underline}
@keyframes spin{to{transform:rotate(360deg)}}
/* scroll progress */
.ax-progress{position:fixed;left:0;top:0;height:3px;width:100%;z-index:200;transform-origin:left;transform:scaleX(0);background:linear-gradient(90deg,#1A9AD6,#A78BFA,#34D399);box-shadow:0 0 12px rgba(56,189,248,.8);pointer-events:none}
@media (max-width:1000px){.ax-hero-grid{grid-template-columns:1fr}.ax-device{transform:rotateY(-6deg) rotateX(4deg)}.ax-path{grid-template-columns:1fr 1fr}.ax-path::before{display:none}.ax-panel .sx-cards{grid-template-columns:1fr}.ax-chip.c2,.ax-chip.c4{display:none}}
@media (max-width:600px){.ax-path{grid-template-columns:1fr}.ax-chip{font-size:.75rem;padding:7px 10px}.ax-tabs button{padding:10px 12px;font-size:.85rem}}
@media (prefers-reduced-motion:reduce){.ax-aurora i,.ax-gridfloor,.ax-mq-track,.ax-device,.ax-chip,.ax-try-bg i,.ax-try-orb .ring,.ax-magnet{animation:none!important}}
.ax-hero.igl h1{font-size:clamp(2.2rem,1.1rem + 3.2vw,3.9rem)}