/* ============================================================
   GlobalMind · Landing —— 深色科技主题
   近黑底 #080B10 / 石墨灰 #111720 / 青绿 #48F2C2 / 电光蓝 #5B8CFF
   经纬网 · 数据节点 · 扫描线 · 透明信息卡；动效缓慢克制
   ============================================================ */

:root{
  --bg:#080B10; --bg1:#0c1119; --panel:#111720;
  --ink:#e7eef6; --head:#f4f8fc; --muted:#8a97ad; --faint:#5a6577;
  --line:rgba(255,255,255,.08); --line-2:rgba(255,255,255,.15);
  --teal:#5AF5CB; --blue:#6E9DFF; --cyan:#5AF5CB;
  --card:rgba(17,23,32,.6);
  --grad:linear-gradient(100deg,#5AF5CB,#6E9DFF);
  --grad-txt:linear-gradient(100deg,#8ffbe0,#a6c3ff);
  --shadow:0 2px 6px rgba(0,0,0,.5),0 24px 60px -30px rgba(72,242,194,.35);
  --font:"Inter","PingFang SC","Source Han Sans SC","Noto Sans SC","Microsoft YaHei",-apple-system,BlinkMacSystemFont,sans-serif;
}
*{box-sizing:border-box;}
html,body{margin:0;padding:0;}
body{ font-family:var(--font); color:var(--ink); background:var(--bg); -webkit-font-smoothing:antialiased; overflow-x:hidden; line-height:1.6; }
a{color:inherit; text-decoration:none;}
h1,h2,h3{ color:var(--head); letter-spacing:-.02em; margin:0; font-weight:700; }
.grad-text{ background:var(--grad-txt); -webkit-background-clip:text; background-clip:text; color:transparent; }

/* 全局经纬网 + 扫描线 */
body::before{ content:""; position:fixed; inset:0; z-index:0; pointer-events:none;
  background-image:linear-gradient(rgba(91,140,255,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(72,242,194,.045) 1px,transparent 1px);
  background-size:66px 66px; mask-image:radial-gradient(circle at 50% 20%,#000,transparent 80%); }
body::after{ content:""; position:fixed; left:0; right:0; top:0; height:200px; z-index:0; pointer-events:none;
  background:linear-gradient(180deg,transparent,rgba(72,242,194,.05),transparent); animation:scan 12s linear infinite; }
@keyframes scan{ 0%{ transform:translateY(-220px);} 100%{ transform:translateY(110vh);} }

/* Buttons */
.btn{ font-family:var(--font); cursor:pointer; border:none; border-radius:12px; font-weight:650; font-size:14.5px;
  padding:12px 22px; color:#04140f; background:var(--grad); box-shadow:0 10px 26px -10px rgba(72,242,194,.6); transition:.18s;
  display:inline-flex; align-items:center; gap:8px; }
.btn:hover{ transform:translateY(-2px); box-shadow:0 16px 34px -12px rgba(72,242,194,.85); }
.btn.on-blue{ background:var(--grad); color:#04140f; }
.btn.ghost, .btn.ghost.on-blue{ background:rgba(255,255,255,.04); color:var(--ink); border:1px solid var(--line-2); box-shadow:none; }
.btn.ghost:hover, .btn.ghost.on-blue:hover{ border-color:var(--teal); color:var(--head); }

/* HERO */
.hero-band{ position:relative; overflow:hidden; color:var(--ink);
  background:radial-gradient(800px 520px at 78% 4%,rgba(72,242,194,.14),transparent 60%),
             radial-gradient(720px 520px at 10% 30%,rgba(91,140,255,.14),transparent 60%),var(--bg1);
  border-bottom:1px solid var(--line); }
.silk{ position:absolute; inset:-30% -10%; z-index:0; filter:blur(40px); opacity:.6; pointer-events:none; }
.silk i{ position:absolute; border-radius:50%; mix-blend-mode:screen; }
.silk i:nth-child(1){ width:55%; height:65%; left:-2%; top:-6%; background:radial-gradient(circle,rgba(72,242,194,.5),transparent 62%); animation:drift1 18s ease-in-out infinite; }
.silk i:nth-child(2){ width:50%; height:75%; right:-6%; top:-16%; background:radial-gradient(circle,rgba(91,140,255,.55),transparent 60%); animation:drift2 22s ease-in-out infinite; }
.silk i:nth-child(3){ width:65%; height:55%; left:22%; bottom:-26%; background:radial-gradient(circle,rgba(72,242,194,.35),transparent 62%); animation:drift1 26s ease-in-out infinite reverse; }
@keyframes drift1{ 0%,100%{ transform:translate(0,0);} 50%{ transform:translate(5%,3%);} }
@keyframes drift2{ 0%,100%{ transform:translate(0,0);} 50%{ transform:translate(-4%,5%);} }
.flow-lines{ position:absolute; inset:0; z-index:0; width:100%; height:100%; opacity:.5; pointer-events:none; }
.flow-lines path{ fill:none; stroke:rgba(72,242,194,.4); stroke-width:1.2; stroke-dasharray:5 12; animation:flow 9s linear infinite; }
@keyframes flow{ to{ stroke-dashoffset:-200; } }

.nav{ position:relative; z-index:5; display:flex; align-items:center; gap:22px; padding:20px 44px; }
.logo{ display:flex; align-items:center; gap:11px; font-weight:750; letter-spacing:-.02em; font-size:19px; color:var(--head); }
.logo-img{ width:32px; height:32px; object-fit:contain; }
.wm .wm-logo{ width:38px; height:38px; object-fit:contain; }
.orb{ width:26px; height:26px; border-radius:50%; background:radial-gradient(circle at 35% 30%,#eafff8,#48F2C2 55%,#2f7dff 100%); box-shadow:0 0 18px rgba(72,242,194,.7); }
.nav .links{ display:flex; gap:26px; margin-left:16px; font-size:14px; color:var(--muted); }
.nav .links a:hover{ color:var(--head); }
.nav .grow{ flex:1; }

.hero{ position:relative; z-index:5; max-width:1220px; margin:0 auto; padding:44px 44px 90px; display:grid; grid-template-columns:1.05fr .95fr; gap:20px; align-items:center; }
@media(max-width:900px){ .hero{ grid-template-columns:1fr; text-align:center; padding-bottom:60px; } .sphere-wrap{order:-1;} }
.eyebrow{ display:inline-flex; align-items:center; gap:9px; font-size:12.5px; color:var(--ink); border:1px solid var(--line-2); border-radius:999px; padding:7px 14px; background:rgba(255,255,255,.03); }
.eyebrow .d{ width:7px; height:7px; border-radius:50%; background:var(--teal); box-shadow:0 0 10px var(--teal); }
.hero h1{ color:var(--head); font-size:clamp(24px,2.6vw,34px); line-height:1.14; margin:22px 0 0; font-weight:760; white-space:nowrap; }
@media(max-width:1120px){ .hero h1{ white-space:normal; font-size:clamp(28px,5.5vw,42px); } }
.hero .lead{ font-size:17px; color:var(--muted); max-width:560px; margin:18px 0 0; }
@media(max-width:900px){ .hero .lead{ margin-inline:auto; } }
.cta{ display:flex; gap:14px; margin-top:32px; flex-wrap:wrap; }
@media(max-width:900px){ .cta{ justify-content:center; } }
.stats{ display:flex; gap:30px; margin-top:38px; flex-wrap:wrap; }
@media(max-width:900px){ .stats{ justify-content:center; } }
.stat b{ display:block; font-size:23px; font-weight:750; background:var(--grad-txt); -webkit-background-clip:text; background-clip:text; color:transparent; }
.stat span{ font-size:12.5px; color:var(--faint); }

/* 写实夜地球 + 光轨 + 标记 */
.sphere-wrap{ position:relative; display:grid; place-items:center; min-height:420px; }
.glow-ring{ position:absolute; width:min(470px,92vw); aspect-ratio:1; border-radius:50%; border:1px solid rgba(90,245,203,.16); box-shadow:inset 0 0 70px rgba(110,157,255,.2); }
.sphere{ position:relative; width:min(420px,84vw); aspect-ratio:1; border-radius:50%; overflow:hidden;
  background-color:#04070e; background-image:url("/earth.jpg"); background-repeat:repeat-x; background-size:auto 460px; background-position:0 center;
  box-shadow: inset -30px -34px 100px 8px rgba(2,5,12,.96), inset 22px 18px 72px rgba(110,157,255,.22),
              0 0 130px rgba(90,245,203,.4), 0 0 70px rgba(110,157,255,.5);
  animation:globe-spin 72s linear infinite; }
@keyframes globe-spin{ from{ background-position:0 center; } to{ background-position:-920px center; } }
.sphere::before{ content:""; position:absolute; inset:0; border-radius:50%; z-index:2; background:radial-gradient(circle at 33% 28%, rgba(150,190,255,.35), transparent 46%); mix-blend-mode:screen; }
.sphere::after{ content:""; position:absolute; inset:0; border-radius:50%; z-index:3; box-shadow:inset 0 0 46px rgba(110,157,255,.45); }
@keyframes breathe{ 0%,100%{filter:brightness(1);} 50%{filter:brightness(1.1);} }
.orbit{ position:absolute; width:min(438px,86vw); aspect-ratio:1; pointer-events:none; overflow:visible; z-index:4; }
.orbit .arc{ fill:none; stroke:url(#og); stroke-width:2; stroke-dasharray:6 8; animation:flow 6s linear infinite; filter:drop-shadow(0 0 4px rgba(90,245,203,.7)); }
.orbit .arc.arc2{ opacity:.55; animation-duration:8s; }
.orbit .node{ fill:#5AF5CB; filter:drop-shadow(0 0 6px rgba(90,245,203,.9)); }
.mk{ position:absolute; z-index:5; font-size:11px; font-weight:600; color:var(--head); background:rgba(17,23,32,.85); border:1px solid var(--line-2); border-radius:999px; padding:4px 10px; backdrop-filter:blur(4px); white-space:nowrap; }
.mk1{ top:15%; left:24%; } .mk2{ bottom:24%; right:12%; }
.mk.plane{ top:43%; left:45%; width:36px; height:36px; padding:0; display:grid; place-items:center; border-radius:50%; background:var(--grad); color:#04140f; box-shadow:0 0 18px rgba(90,245,203,.7); font-size:16px; border:none; }

/* 内容区 */
.section{ position:relative; z-index:1; max-width:1180px; margin:0 auto; padding:74px 44px; text-align:center; }
.section .tag{ font-size:12px; letter-spacing:.16em; text-transform:uppercase; color:var(--teal); font-weight:700; }
.section h2{ font-size:clamp(24px,3.4vw,36px); margin:12px 0 0; }
.section .desc{ color:var(--muted); max-width:620px; margin:14px auto 0; }

.loop{ display:flex; align-items:stretch; justify-content:center; gap:6px; margin-top:46px; flex-wrap:wrap; text-align:left; }
.loop .step{ flex:1; min-width:150px; max-width:190px; padding:18px; border:1px solid var(--line); border-radius:16px; background:var(--card); box-shadow:var(--shadow); backdrop-filter:blur(6px); }
.loop .step .n{ font-size:12px; color:var(--teal); font-weight:700; }
.loop .step h4{ margin:8px 0 4px; font-size:14.5px; }
.loop .step p{ margin:0; font-size:12px; color:var(--muted); }
.loop .arrow{ align-self:center; color:var(--teal); font-size:20px; opacity:.6; }
@media(max-width:820px){ .loop .arrow{ display:none; } .loop .step{ flex-basis:100%; max-width:none; } }

.cards{ display:grid; grid-template-columns:repeat(auto-fit,minmax(250px,1fr)); gap:18px; margin-top:44px; text-align:left; }
.cap{ padding:26px; border:1px solid var(--line); border-radius:18px; background:var(--card); box-shadow:var(--shadow); position:relative; overflow:hidden; transition:.2s; backdrop-filter:blur(6px); }
.cap:hover{ transform:translateY(-5px); border-color:rgba(72,242,194,.35); box-shadow:0 30px 60px -30px rgba(72,242,194,.5); }
.cap::before{ content:""; position:absolute; left:0; top:0; height:3px; width:100%; background:var(--grad); }
.cap .ic{ width:46px; height:46px; border-radius:13px; display:grid; place-items:center; font-size:21px; background:rgba(72,242,194,.08); border:1px solid var(--line-2); margin-bottom:16px; }
.cap h3{ font-size:17px; margin:0 0 6px; }
.cap .q{ font-size:12.5px; color:var(--teal); font-weight:600; margin-bottom:8px; }
.cap p{ font-size:13px; color:var(--muted); margin:0; }

.showcase{ position:relative; z-index:1; max-width:1180px; margin:0 auto; padding:0 44px; }
.showcase .inner{ border-radius:26px; border:1px solid var(--line); background:radial-gradient(700px 380px at 70% 30%,rgba(72,242,194,.2),transparent 60%),var(--panel); color:var(--ink); padding:60px; display:grid; grid-template-columns:1fr 1fr; gap:30px; align-items:center; overflow:hidden; position:relative; }
@media(max-width:820px){ .showcase .inner{ grid-template-columns:1fr; text-align:center; padding:40px; } }
.showcase .tag{ font-size:12px; letter-spacing:.16em; text-transform:uppercase; color:var(--teal); font-weight:700; }
.showcase h2{ color:var(--head); margin-top:12px; }
.showcase p{ color:var(--muted); margin-top:14px; }
.showcase .orb-lg{ justify-self:center; width:260px; height:260px; border-radius:50%; background:radial-gradient(circle at 38% 32%,rgba(72,242,194,.7),rgba(91,140,255,.3) 45%,rgba(10,16,26,.2) 70%,transparent 74%); box-shadow:0 0 120px rgba(72,242,194,.5), inset -10px -14px 70px rgba(10,16,26,.7); animation:breathe 6s ease-in-out infinite; }

.value{ text-align:center; }
.value h2{ max-width:820px; margin:14px auto 0; }
.footer-cta{ position:relative; z-index:1; max-width:1080px; margin:36px auto 90px; padding:60px 44px; text-align:center; color:var(--ink);
  border-radius:30px; overflow:hidden; border:1px solid var(--line-2);
  background:radial-gradient(600px 320px at 50% 0%,rgba(72,242,194,.18),transparent 70%),var(--panel); box-shadow:var(--shadow); }
.footer-cta h2{ color:var(--head); font-size:clamp(24px,3.6vw,40px); position:relative; z-index:2; }
.footer-cta p{ color:var(--muted); margin:14px 0 26px; position:relative; z-index:2; }
.footer-cta .btn{ position:relative; z-index:2; }
.footer-cta .wm{ position:relative; z-index:2; margin-top:34px; font-size:34px; font-weight:800; letter-spacing:-.02em; display:flex; align-items:center; justify-content:center; gap:12px; background:var(--grad-txt); -webkit-background-clip:text; background-clip:text; color:transparent; }
.foot{ position:relative; z-index:1; text-align:center; color:var(--faint); font-size:12px; padding:0 20px 46px; }

/* 能力卡图标 & 展示球（替换为图片） */
.cap .ic{ overflow:hidden; }
.cap .ic img{ width:30px; height:30px; object-fit:contain; }
.showcase .orb-lg{ background:none; box-shadow:none; width:300px; height:300px; }
.showcase .orb-lg img{ width:100%; height:100%; object-fit:contain; filter:drop-shadow(0 0 46px rgba(90,245,203,.4)); }

/* 展示球去黑框：暗部用 screen 融入深色面板，只留发光网络/光环 */
.showcase .orb-lg{ width:340px; height:340px; }
.showcase .orb-lg img{ mix-blend-mode:screen; width:100%; height:100%; object-fit:contain;
  filter:drop-shadow(0 0 40px rgba(90,245,203,.35)); }

/* 展示球 最终：羽化边缘 + 大气辉光，彻底消除方框/硬边 */
.showcase .orb-lg{ position:relative; width:360px; height:360px; background:none; box-shadow:none; }
.showcase .orb-lg::before{ content:""; position:absolute; inset:-4%; border-radius:50%;
  background:radial-gradient(circle, rgba(90,245,203,.16), rgba(110,157,255,.08) 45%, transparent 66%); z-index:0; }
.showcase .orb-lg img{ position:relative; z-index:1; mix-blend-mode:normal; width:100%; height:100%; object-fit:contain;
  -webkit-mask-image:radial-gradient(circle closest-side, #000 72%, transparent 100%);
          mask-image:radial-gradient(circle closest-side, #000 72%, transparent 100%);
  filter:drop-shadow(0 0 34px rgba(90,245,203,.38)); }

/* ============ HERO 正射投影地球（真实经纬度城市点，无连线）============ */
.hero > div:first-child{ max-width:600px; position:relative; z-index:5; }
.geo-stage{ position:absolute; top:50%; right:-7%; transform:translateY(-50%);
  width:min(820px,56vw); aspect-ratio:1; z-index:1; pointer-events:none; }
@media(max-width:900px){
  .hero{ display:block; text-align:center; }
  .hero > div:first-child{ max-width:none; }
  .geo-stage{ position:relative; top:auto; right:auto; transform:none; margin:26px auto 0; width:min(460px,88vw); }
}
#geoCanvas{ width:100%; height:100%; display:block; }
.geo-labels{ position:absolute; inset:0; z-index:2; pointer-events:none; }
.geo-dot{ position:absolute; width:8px; height:8px; border-radius:50%; background:#5AF5CB;
  transform:translate(-50%,-50%); box-shadow:0 0 8px rgba(90,245,203,.9); }
.geo-dot.edge{ opacity:.6; }
.geo-dot.hub{ width:15px; height:15px; background:#eafff8;
  box-shadow:0 0 0 5px rgba(90,245,203,.22), 0 0 22px rgba(90,245,203,.95); }
.geo-dot.hub::after{ content:""; position:absolute; inset:-4px; border-radius:50%; border:1.5px solid rgba(90,245,203,.8);
  animation:geopulse 2.6s ease-out infinite; }
@keyframes geopulse{ 0%{ transform:scale(1); opacity:.85; } 100%{ transform:scale(3.4); opacity:0; } }
.geo-city{ position:absolute; white-space:nowrap; font-size:12.5px; line-height:1; color:#dbe8f5;
  background:rgba(9,14,22,.72); border:1px solid rgba(90,245,203,.32); border-radius:999px; padding:4px 10px;
  -webkit-backdrop-filter:blur(3px); backdrop-filter:blur(3px); box-shadow:0 2px 10px rgba(0,0,0,.45); z-index:3; }
.geo-city.rgt{ transform:translate(14px,-50%); }
.geo-city.lft{ transform:translate(calc(-100% - 14px),-50%); }
.geo-city.hub{ font-weight:700; color:#eafff8; font-size:13px; border-color:rgba(90,245,203,.7);
  background:rgba(9,26,22,.85); box-shadow:0 0 16px rgba(90,245,203,.35); }