/* About (about-motion.php) and Contact (contact-motion.php) motion sections. */
.abx-hero{position:relative;overflow:hidden}
.abx-hero-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:48px;align-items:center}
@media (max-width:900px){.abx-hero-grid{grid-template-columns:1fr}}
.abx-word{display:inline-block;position:relative;color:var(--teal);min-width:8ch}
.abx-word b{display:inline-block;transition:opacity .35s,transform .35s}
.abx-word.swap b{opacity:0;transform:translateY(14px)}
.abx-orbit{position:relative;aspect-ratio:1;max-width:440px;width:100%;margin:0 auto}
.abx-orbit svg{position:absolute;inset:0;width:100%;height:100%}
.abx-orbit .ring{fill:none;stroke:rgba(94,230,223,.3);stroke-width:1.5;stroke-dasharray:6 8;animation:spinsvg 40s linear infinite;transform-origin:200px 200px}
.abx-orbit .ring.r2{stroke:rgba(8,102,255,.4);animation-direction:reverse;animation-duration:26s}
@keyframes spinsvg{to{transform:rotate(360deg)}}
.abx-core{position:absolute;left:50%;top:50%;width:110px;height:110px;margin:-55px 0 0 -55px;border-radius:50%;background:#fff;display:flex;align-items:center;justify-content:center;box-shadow:0 0 0 10px rgba(46,224,214,.12),0 0 60px rgba(8,102,255,.5);animation:corebeat 3s ease-in-out infinite}
@keyframes corebeat{50%{box-shadow:0 0 0 18px rgba(46,224,214,.06),0 0 80px rgba(8,102,255,.6)}}
.abx-spin{position:absolute;inset:0;animation:spinsvg 30s linear infinite}
.abx-p{position:absolute;display:flex;flex-direction:column;align-items:center;gap:2px;width:150px;margin-left:-75px;margin-top:-34px;padding:12px;border-radius:16px;background:#0C2549;border:1px solid rgba(255,255,255,.12);text-align:center;box-shadow:0 14px 30px rgba(0,0,0,.35);animation:spinsvg 30s linear infinite reverse}
.abx-p b{font-family:Sora,sans-serif;color:#fff}.abx-p small{font-size:11.5px;color:#9FB3D3}
.abx-p.p1{left:50%;top:12%}.abx-p.p2{left:17%;top:72%}.abx-p.p3{left:83%;top:72%}
.abx-vgrid{list-style:none;margin:0;padding:0;display:grid;gap:18px;grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr))}
.js .abx-vgrid>.reveal{transition-delay:calc(var(--i,0) * 110ms);transform:translateY(24px) rotateX(18deg)}
.js .abx-vgrid>.reveal.in{transform:none}
.abx-vgrid li{background:#fff;border:1px solid var(--line);border-radius:20px;padding:26px;display:flex;flex-direction:column;gap:10px;transition:transform .35s,box-shadow .35s}
.abx-vgrid li:hover{transform:translateY(-6px);box-shadow:0 22px 44px rgba(7,26,53,.12)}
.abx-vi{width:56px;height:56px;border-radius:16px;background:linear-gradient(145deg,#EEF4FF,#E3FAF8);display:flex;align-items:center;justify-content:center}
.abx-vi svg{width:28px;height:28px;color:#0866FF}
.js .abx-vi path{stroke-dasharray:1;stroke-dashoffset:1}
.js .reveal.in .abx-vi path{animation:draw 1.3s ease forwards;animation-delay:calc(var(--i,0) * 110ms + .2s)}
.abx-vgrid strong{font-family:Sora,sans-serif;font-size:18px}.abx-vgrid span:last-child{color:var(--muted);line-height:1.55}
.abx-path{position:relative}
.abx-path svg{width:100%;height:160px;display:block}
.abx-path path{fill:none;stroke:url(#none);stroke:#BFD3F5;stroke-width:4;stroke-dasharray:10 10;animation:dash2 2s linear infinite}
@keyframes dash2{to{stroke-dashoffset:-40}}
.abx-dot{fill:#0866FF;filter:drop-shadow(0 0 8px #0866FF)}
.abx-path ol{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
@media (max-width:700px){.abx-path ol{grid-template-columns:repeat(2,1fr)}.abx-path svg{display:none}}
.abx-path li{text-align:center;display:flex;flex-direction:column;align-items:center;gap:6px}
.abx-path li b{width:44px;height:44px;border-radius:50%;background:linear-gradient(135deg,#0866FF,#00A7C4);color:#fff;font-family:Sora,sans-serif;display:flex;align-items:center;justify-content:center;box-shadow:0 10px 22px rgba(8,102,255,.3)}
.abx-path li small{color:var(--muted)}

.ctx{position:relative;overflow:hidden}
.ctx-grid{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:48px;align-items:center}
@media (max-width:900px){.ctx-grid{grid-template-columns:1fr}}
.ctx-status{display:flex;align-items:center;gap:12px;padding:12px 16px;border-radius:14px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12);align-self:flex-start}
.ctx-status i{width:12px;height:12px;border-radius:50%;background:#8A9AB5}
.ctx-status.on i{background:#2EE0D6;animation:ping 1.6s infinite}
.ctx-status b{display:block;color:#fff}.ctx-status small{color:#9FB3D3;font-variant-numeric:tabular-nums}
.ctx-channels{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
@media (max-width:520px){.ctx-channels{grid-template-columns:1fr}}
.ctx-ch{display:flex;flex-direction:column;gap:4px;align-items:flex-start;text-align:left;padding:18px;border-radius:16px;background:#0C2549;border:1px solid rgba(255,255,255,.1);color:#fff;text-decoration:none;font:inherit;cursor:pointer;transition:transform .3s,border-color .3s,background .3s}
.ctx-ch:hover{transform:translateY(-4px);border-color:#2EE0D6;background:#0F3166;color:#fff}
.ctx-ch .ic{position:relative;width:44px;height:44px;border-radius:12px;background:rgba(46,224,214,.14);display:flex;align-items:center;justify-content:center;margin-bottom:6px}
.ctx-ch .ic:after{content:"";position:absolute;inset:0;border-radius:inherit;border:2px solid #2EE0D6;opacity:0;animation:ring2 2.8s ease-out infinite}
.ctx-ch:nth-child(2) .ic:after{animation-delay:.7s}.ctx-ch:nth-child(3) .ic:after{animation-delay:1.4s}.ctx-ch:nth-child(4) .ic:after{animation-delay:2.1s}
@keyframes ring2{0%{opacity:.8;transform:scale(1)}100%{opacity:0;transform:scale(1.6)}}
.ctx-ch svg{width:22px;height:22px;color:#2EE0D6}
.ctx-ch small{color:#9FB3D3;overflow-wrap:anywhere}
.ctx-globe{position:relative;aspect-ratio:1;max-width:420px;width:100%;margin:0 auto}
.g-sphere{position:absolute;inset:8%;border-radius:50%;background:radial-gradient(circle at 35% 30%,#1E5BB8,#0C2549 60%,#071A35);box-shadow:inset -20px -20px 60px rgba(0,0,0,.5),0 0 80px rgba(8,102,255,.35);overflow:hidden}
.mer{position:absolute;top:0;bottom:0;left:50%;width:70%;margin-left:-35%;border-radius:50%;border:1px solid rgba(94,230,223,.35);animation:merid 8s linear infinite}
.mer.m2{animation-delay:-2.7s}.mer.m3{animation-delay:-5.3s}
@keyframes merid{0%{transform:scaleX(0)}50%{transform:scaleX(1)}100%{transform:scaleX(0)}}
.lat{position:absolute;left:0;right:0;height:1px;background:rgba(94,230,223,.25)}
.lat.l1{top:30%}.lat.l2{top:50%}.lat.l3{top:70%}
.g-ping{position:absolute;width:12px;height:12px;margin:-6px 0 0 -6px;border-radius:50%;background:#2EE0D6;box-shadow:0 0 0 0 rgba(46,224,214,.7);animation:gping 3.2s ease-out infinite}
@keyframes gping{0%{box-shadow:0 0 0 0 rgba(46,224,214,.7)}70%{box-shadow:0 0 0 22px rgba(46,224,214,0)}100%{box-shadow:0 0 0 0 rgba(46,224,214,0)}}
.g-label{position:absolute;left:50%;bottom:0;transform:translateX(-50%);white-space:nowrap;background:#fff;color:#071A35;font-weight:700;font-size:13px;padding:8px 14px;border-radius:999px;box-shadow:0 10px 24px rgba(0,0,0,.3)}
.ctx-globe3d{position:relative;max-width:520px;width:100%;margin:0 auto}
.ctx-globe3d canvas{display:block;width:100%;aspect-ratio:1;filter:drop-shadow(0 30px 50px rgba(0,0,0,.45))}
.ctx-globe3d:not(.ready) canvas{border-radius:50%;background:radial-gradient(circle at 35% 30%,#6FE3FF,#19B4EE 60%,#0A6FB8)}
.g3-card{position:absolute;left:0;bottom:4%;display:flex;flex-direction:column;gap:2px;padding:12px 16px;border-radius:14px;background:rgba(7,26,53,.85);backdrop-filter:blur(8px);border:1px solid rgba(46,224,214,.4);box-shadow:0 14px 30px rgba(0,0,0,.35)}
.g3-card small{color:#9FB3D3;font-size:11.5px}.g3-card b{color:#fff;font-family:Sora,sans-serif;font-size:20px}
.g3-card span{color:#2EE0D6;font-size:12px;font-variant-numeric:tabular-nums}
@media (prefers-reduced-motion:reduce){.abx-orbit .ring,.abx-core,.abx-spin,.abx-p,.abx-path path,.ctx-status.on i,.ctx-ch .ic:after,.mer,.g-ping{animation:none}}
