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

:root{
  --bg:#050E0D; --bg1:#081613; --panel:#0e1e1b;
  --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(760px 460px at 80% 2%,rgba(72,242,194,.05),transparent 60%),
             radial-gradient(640px 480px at 6% 28%,rgba(91,140,255,.04),transparent 60%),#04070A;
  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-cta{ font-size:14px; font-weight:600; color:var(--ink); letter-spacing:.01em; transition:.16s; }
.nav-cta:hover{ color:var(--teal); }
.nav .grow{ flex:1; }

.hero{ position:relative; z-index:5; max-width:none; margin:0; padding:54px 44px 84px; display:block; }
@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:11.5px; color:var(--ink); border:1px solid var(--line-2); border-radius:999px; padding:6px 13px; 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(30px,3.4vw,44px); line-height:1.14; margin:18px 0 0; font-weight:800; letter-spacing:-.02em; white-space:normal; }
@media(max-width:1120px){ .hero h1{ font-size:clamp(28px,5vw,40px); } }
.hero .lead{ font-size:15.5px; color:var(--muted); margin:18px 0 0; }
@media(max-width:900px){ .hero .lead{ margin-inline:auto; } }
.cta{ display:flex; gap:14px; margin-top:28px; 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:21px; 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{ position:relative; }
.hero > div:first-child{ max-width:560px; position:relative; z-index:5; }
.world-map{ position:absolute; top:50%; right:-2%; transform:translateY(-50%);
  width:min(1140px,73vw); aspect-ratio:2 / 1; z-index:0; pointer-events:none; }
.map-img{ position:absolute; inset:0; background:url("/earth.jpg") center/cover no-repeat;
  opacity:.95; filter:brightness(.52) saturate(1.18) contrast(1.05) hue-rotate(-10deg);
  -webkit-mask-image:linear-gradient(to bottom, transparent 0%, #000 22%, #000 78%, transparent 100%),
                     linear-gradient(to right, transparent 0%, #000 10%, #000 88%, transparent 100%);
  -webkit-mask-composite:source-in;
  mask-image:linear-gradient(to bottom, transparent 0%, #000 22%, #000 78%, transparent 100%),
             linear-gradient(to right, transparent 0%, #000 10%, #000 88%, transparent 100%);
  mask-composite:intersect; }
/* 只在上海附近做一处青色高光，不再整张提亮（避免发白发灰） */
.world-map::after{ content:""; position:absolute; inset:0; z-index:0; pointer-events:none;
  background:radial-gradient(26% 34% at 84% 33%, rgba(90,245,203,.22), transparent 70%);
  mix-blend-mode:screen; }
/* 汇聚上海的虚线弧 */
.map-arcs{ position:absolute; inset:0; width:100%; height:100%; z-index:1; overflow:visible; }
.map-arcs .arc{ fill:none; stroke:rgba(120,240,210,.32); stroke-width:0.9; stroke-linecap:round;
  stroke-dasharray:4 9; vector-effect:non-scaling-stroke; animation:arcflow 6s linear infinite;
  filter:drop-shadow(0 0 1px rgba(90,245,203,.5)); }
@keyframes arcflow{ to{ stroke-dashoffset:-40; } }
.map-pins{ position:absolute; inset:0; z-index:2; }
.map-dot{ position:absolute; width:7px; height:7px; border-radius:50%; background:#5AF5CB;
  transform:translate(-50%,-50%); box-shadow:0 0 8px rgba(90,245,203,.95); }
.map-dot.hub{ width:15px; height:15px; background:#eafff8;
  box-shadow:0 0 0 6px rgba(90,245,203,.2), 0 0 22px rgba(90,245,203,.95); }
.map-dot.hub::after{ content:""; position:absolute; inset:-5px; border-radius:50%; border:1.5px solid rgba(90,245,203,.85);
  animation:geopulse 2.6s ease-out infinite; }
@keyframes geopulse{ 0%{ transform:scale(1); opacity:.85; } 100%{ transform:scale(3.4); opacity:0; } }
.map-city{ position:absolute; white-space:nowrap; font-size:13px; font-weight:600; color:#eaf4ff; z-index:2;
  text-shadow:0 1px 3px rgba(0,0,0,.95), 0 0 10px rgba(0,0,0,.85); }
.map-city.rgt{ transform:translate(12px,-50%); }
.map-city.lft{ transform:translate(calc(-100% - 12px),-50%); }
.map-city.hub{ font-size:15.5px; font-weight:800; color:#fff;
  text-shadow:0 1px 4px rgba(0,0,0,.95), 0 0 14px rgba(90,245,203,.7); }

/* 顶部大气弧光（柔光） */
.hero-band::after{ content:""; position:absolute; top:-58%; left:50%; transform:translateX(-50%);
  width:150%; height:120%; border-radius:50%; pointer-events:none; z-index:0;
  background:radial-gradient(closest-side, rgba(72,242,194,.06), rgba(110,157,255,.03) 55%, transparent 72%); }

/* 标题渐变字 + 下划线 */
.hero h1 .grad{ background:linear-gradient(100deg,#8ffbe0,#6E9DFF); -webkit-background-clip:text; background-clip:text; color:transparent; }
.title-underline{ display:block; width:74px; height:4px; border-radius:3px; margin:20px 0 0;
  background:linear-gradient(90deg,#5AF5CB,#6E9DFF); box-shadow:0 0 14px rgba(90,245,203,.5); }
/* 按钮箭头 */
.btn .ar{ font-size:15px; line-height:1; }
.btn.on-blue .ar{ display:inline-grid; place-items:center; width:22px; height:22px; border-radius:50%;
  background:rgba(4,20,15,.18); }
/* 数字分隔线 */
.stats{ align-items:flex-start; }
.stat + .stat{ padding-left:30px; border-left:1px solid var(--line-2); }

@media(max-width:900px){
  .hero{ display:block; text-align:center; }
  .hero > div:first-child{ max-width:none; }
  .world-map{ position:relative; top:auto; left:auto; right:auto; transform:none; width:100%; margin:22px 0 0; opacity:.6; }
  .stat + .stat{ padding-left:22px; }
}