/* ============================================================
   西安郝先生科技 · Design System
   Premium AI Company / Minimal / Dark / Elegant
   ============================================================ */

:root{
  /* ---- Surface ---- */
  --bg:            #08090B;
  --bg-soft:       #0B0C10;
  --surface:       rgba(255,255,255,.020);
  --surface-2:     rgba(255,255,255,.035);
  --surface-3:     rgba(255,255,255,.055);

  /* ---- Line ---- */
  --line:          rgba(255,255,255,.070);
  --line-2:        rgba(255,255,255,.120);
  --line-3:        rgba(255,255,255,.180);

  /* ---- Text ---- */
  --text:          #F4F6F8;
  --text-2:        #B4BAC4;
  --text-3:        #8A909B;

  /* ---- Accent ---- */
  --accent:        #5B8CFF;
  --accent-2:      #8E7CFF;
  --accent-soft:   rgba(91,140,255,.12);
  --accent-line:   rgba(91,140,255,.32);
  --violet-soft:   rgba(142,124,255,.12);

  /* ---- Radius ---- */
  --r-sm: 6px;
  --r:    10px;
  --r-lg: 14px;
  --r-xl: 18px;

  /* ---- Type ---- */
  --font-sans: 'Inter','Geist',-apple-system,BlinkMacSystemFont,'Segoe UI',
               'PingFang SC','HarmonyOS Sans SC','MiSans','Source Han Sans SC',
               'Noto Sans SC','Microsoft YaHei',sans-serif;

  /* ---- Space ---- */
  --gutter: 40px;
  --sec-y:  160px;

  /* ---- Motion ---- */
  --ease: cubic-bezier(.22,.61,.36,1);
  --ease-out: cubic-bezier(.16,1,.3,1);
}

*,*::before,*::after{ box-sizing:border-box; }

html{
  -webkit-text-size-adjust:100%;
  scroll-behavior:smooth;
  scroll-padding-top:96px;
}

body{
  margin:0;
  background:var(--bg);
  color:var(--text);
  font-family:var(--font-sans);
  font-size:16px;
  line-height:1.65;
  font-weight:400;
  letter-spacing:.005em;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  overflow-x:hidden;
}

img,svg{ display:block; max-width:100%; }
a{ color:inherit; text-decoration:none; }
button{ font:inherit; color:inherit; background:none; border:none; cursor:pointer; }
ul,ol,dl,dd{ margin:0; padding:0; list-style:none; }
h1,h2,h3,h4,p{ margin:0; }
::selection{ background:rgba(91,140,255,.28); color:#fff; }

.container{
  width:100%;
  max-width:1240px;
  margin:0 auto;
  padding:0 var(--gutter);
}

/* ---- 滚动条 ---- */
*{ scrollbar-width:thin; scrollbar-color:rgba(120,140,255,.42) transparent; }
::-webkit-scrollbar{ width:11px; height:11px; }
::-webkit-scrollbar-track{ background:transparent; }
::-webkit-scrollbar-corner{ background:transparent; }
::-webkit-scrollbar-thumb{
  background:linear-gradient(180deg,rgba(91,140,255,.62) 0%,rgba(142,124,255,.52) 100%);
  border-radius:999px;
  border:3px solid transparent;
  background-clip:padding-box;
  transition:background .3s var(--ease), border-width .3s var(--ease);
}
::-webkit-scrollbar-thumb:hover{
  background:linear-gradient(180deg,rgba(120,160,255,.95) 0%,rgba(158,140,255,.85) 100%);
  background-clip:padding-box;
  border-width:2px;
}
::-webkit-scrollbar-thumb:active{
  background:linear-gradient(180deg,#6B98FF 0%,#8E7CFF 100%);
  background-clip:padding-box;
}

/* 胶片颗粒 */
.grain{
  position:fixed; inset:0; z-index:200; pointer-events:none;
  opacity:.030;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3'/%3E%3C/filter%3E%3Crect width='200' height='200' filter='url(%23n)'/%3E%3C/svg%3E");
}

/* ============================ Typography ============================ */
.h2{
  font-size:clamp(30px,3.4vw,46px);
  line-height:1.22;
  font-weight:600;
  letter-spacing:-.018em;
}
.sec-sub{
  margin-top:20px;
  color:var(--text-2);
  font-size:17px;
  line-height:1.75;
  max-width:660px;
}
.sec-sub--left{ margin-left:0; }

.eyebrow{
  display:inline-flex; align-items:center; gap:9px;
  font-size:12px; letter-spacing:.20em; text-transform:uppercase;
  font-weight:500; color:var(--text-3);
}
.eyebrow .dot{
  width:5px; height:5px; border-radius:50%;
  background:var(--accent);
  box-shadow:0 0 10px rgba(91,140,255,.9);
  animation:pulseDot 3.2s var(--ease) infinite;
}
@keyframes pulseDot{
  0%,100%{ opacity:.55; box-shadow:0 0 6px rgba(91,140,255,.7); }
  50%    { opacity:1;   box-shadow:0 0 14px rgba(120,150,255,1); }
}
.sec-head{ text-align:center; margin-bottom:72px; }
.sec-head.is-in .h2{ animation:heroMask .95s var(--ease-out) .06s both; }
.sec-head .eyebrow{ margin-bottom:22px; }
.sec-head .sec-sub{ margin-left:auto; margin-right:auto; }

/* ============================ Buttons ============================ */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  height:44px; padding:0 20px;
  border-radius:var(--r-sm);
  font-size:14.5px; font-weight:500; letter-spacing:.005em;
  white-space:nowrap;
  transition:background .35s var(--ease), color .35s var(--ease),
             border-color .35s var(--ease), transform .35s var(--ease),
             box-shadow .35s var(--ease), opacity .35s var(--ease);
}
.btn .arr{ transition:transform .35s var(--ease); }
.btn:hover .arr{ transform:translateX(3px); }

.btn--sm{ height:36px; padding:0 15px; font-size:13.5px; }
.btn--lg{ height:52px; padding:0 28px; font-size:15.5px; }
.btn--full{ width:100%; }

.btn--primary{
  position:relative; overflow:hidden;
  background:linear-gradient(180deg,#6B98FF 0%,#4C7BFF 100%);
  color:#fff;
  box-shadow:0 0 0 1px rgba(255,255,255,.10) inset,
             0 8px 28px -12px rgba(76,123,255,.75);
}
.btn--primary::after{
  content:""; position:absolute; top:-10px; bottom:-10px; width:38%; left:-60%;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.32),transparent);
  transform:skewX(-18deg);
  opacity:0; pointer-events:none;
}
.btn--primary:hover::after{ animation:sheen .85s var(--ease); }
@keyframes sheen{
  0%  { left:-60%; opacity:0; }
  25% { opacity:1; }
  100%{ left:140%; opacity:0; }
}
.btn--primary:hover{
  transform:translateY(-1px);
  background:linear-gradient(180deg,#7BA4FF 0%,#5A87FF 100%);
  box-shadow:0 0 0 1px rgba(255,255,255,.16) inset,
             0 14px 34px -12px rgba(76,123,255,.9);
}
.btn--ghost{
  border:1px solid var(--line-2);
  color:var(--text);
  background:rgba(255,255,255,.014);
}
.btn--ghost:hover{
  border-color:var(--line-3);
  background:rgba(255,255,255,.045);
  transform:translateY(-1px);
}

/* ============================ Nav ============================ */
.nav{
  position:fixed; top:0; left:0; right:0; z-index:100;
  backdrop-filter:blur(14px) saturate(140%);
  -webkit-backdrop-filter:blur(14px) saturate(140%);
  background:rgba(8,9,11,.55);
  border-bottom:1px solid transparent;
  transition:background .4s var(--ease), border-color .4s var(--ease),
             transform .45s var(--ease);
}
.nav.is-hidden{ transform:translateY(-102%); }
.nav.is-scrolled{
  background:rgba(8,9,11,.84);
  border-bottom-color:var(--line);
  backdrop-filter:blur(18px) saturate(150%);
  -webkit-backdrop-filter:blur(18px) saturate(150%);
}
.nav__links a.is-current{ color:var(--text); }
.nav__links a.is-current::after{ opacity:.9; transform:scaleX(1); }

/* 滚动进度 */
.progress{
  position:fixed; top:0; left:0; right:0; height:2px; z-index:130;
  pointer-events:none;
}
.progress i{
  display:block; height:100%; width:0;
  background:linear-gradient(90deg,#4C7BFF 0%,#6B98FF 45%,#8E7CFF 100%);
  box-shadow:0 0 14px rgba(91,140,255,.85);
  transition:width .12s linear;
}
.nav__inner{
  height:68px;
  display:flex; align-items:center; gap:32px;
}
.brand{ display:flex; align-items:center; gap:10px; flex-shrink:0; }
.brand__mark{ width:28px; height:28px; flex:0 0 auto; }
.brand__mark svg{ width:100%; height:100%; }
.brand__name{
  font-size:16px; font-weight:600; letter-spacing:.01em;
}
.nav__links{
  display:flex; align-items:center; gap:30px;
  margin-left:14px;
}
.nav__links a{
  font-size:14px; color:var(--text-2);
  transition:color .3s var(--ease);
  position:relative;
}
.nav__links a::after{
  content:""; position:absolute; left:0; right:0; bottom:-7px; height:1px;
  background:var(--accent); opacity:0; transform:scaleX(.4);
  transition:opacity .35s var(--ease), transform .35s var(--ease);
}
.nav__links a:hover{ color:var(--text); }
.nav__links a:hover::after{ opacity:.9; transform:scaleX(1); }

.nav__actions{ margin-left:auto; display:flex; align-items:center; gap:12px; }
.nav__toggle{ display:none; width:40px; height:36px; position:relative; }
.nav__toggle span{
  position:absolute; left:10px; width:20px; height:1.5px; background:var(--text);
  transition:transform .35s var(--ease), opacity .3s var(--ease);
}
.nav__toggle span:nth-child(1){ top:15px; }
.nav__toggle span:nth-child(2){ top:21px; }
.nav.is-open .nav__toggle span:nth-child(1){ transform:translateY(3px) rotate(45deg); }
.nav.is-open .nav__toggle span:nth-child(2){ transform:translateY(-3px) rotate(-45deg); }

.nav__mobile{
  display:none;
  flex-direction:column; gap:4px;
  padding:12px var(--gutter) 22px;
  border-top:1px solid var(--line);
  background:rgba(8,9,11,.96);
}
.nav__mobile a{
  padding:13px 0; font-size:15px; color:var(--text-2);
  border-bottom:1px solid rgba(255,255,255,.04);
}
.nav__mobile .btn{ margin-top:16px; }

/* ============================ Hero ============================ */
.hero{
  position:relative;
  padding:190px 0 130px;
  overflow:hidden;
}
.hero::after{
  content:""; position:absolute; left:0; right:0; bottom:0; height:220px;
  background:linear-gradient(180deg,rgba(8,9,11,0),var(--bg));
  pointer-events:none;
}
.hero__aura{
  position:absolute; top:-300px; left:50%; transform:translateX(-50%);
  width:1500px; height:1100px; pointer-events:none;
  background:radial-gradient(ellipse at 50% 40%,
      rgba(76,123,255,.26) 0%,
      rgba(142,124,255,.12) 36%,
      rgba(8,9,11,0) 68%);
}

/* 极光氛围层 */
.hero__aurora{ position:absolute; inset:0; pointer-events:none; }
.au{
  position:absolute; border-radius:50%;
  filter:blur(90px);
  opacity:.5;
  will-change:transform;
}
.au--1{
  top:-160px; left:8%;
  width:560px; height:420px;
  background:radial-gradient(ellipse at center, rgba(76,123,255,.32), transparent 70%);
  animation:auFloat1 22s var(--ease) infinite alternate;
}
.au--2{
  top:60px; right:2%;
  width:640px; height:480px;
  background:radial-gradient(ellipse at center, rgba(142,124,255,.26), transparent 70%);
  animation:auFloat2 26s var(--ease) infinite alternate;
}
.au--3{
  top:44%; left:38%;
  width:520px; height:380px;
  background:radial-gradient(ellipse at center, rgba(56,92,190,.20), transparent 70%);
  animation:auFloat1 30s var(--ease) infinite alternate-reverse;
}
@keyframes auFloat1{
  from{ transform:translate(0,0) scale(1); }
  to  { transform:translate(70px,40px) scale(1.12); }
}
@keyframes auFloat2{
  from{ transform:translate(0,0) scale(1.08); }
  to  { transform:translate(-60px,50px) scale(.94); }
}

/* 隐现工程网格 */
.hero__grid{
  position:absolute; inset:0; pointer-events:none;
  background-image:
    linear-gradient(rgba(255,255,255,.045) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.045) 1px, transparent 1px);
  background-size:72px 72px;
  -webkit-mask-image:radial-gradient(ellipse 72% 62% at 50% 32%, #000 18%, transparent 76%);
  mask-image:radial-gradient(ellipse 72% 62% at 50% 32%, #000 18%, transparent 76%);
  opacity:.65;
}

/* 粒子星域 */
.hero__canvas{
  position:absolute; inset:0;
  width:100%; height:100%;
  pointer-events:none;
  -webkit-mask-image:radial-gradient(ellipse 80% 70% at 50% 42%, #000 40%, transparent 82%);
  mask-image:radial-gradient(ellipse 80% 70% at 50% 42%, #000 40%, transparent 82%);
}

/* 光标氛围光 */
.hero__spot{
  position:absolute; inset:0; pointer-events:none;
  background:radial-gradient(420px circle at var(--sx,50%) var(--sy,42%),
              rgba(91,140,255,.13), rgba(142,124,255,.05) 45%, transparent 66%);
  opacity:0; transition:opacity .6s var(--ease);
}
.hero__spot.is-on{ opacity:1; }

.hero__inner{ position:relative; text-align:center; }
.hero__eyebrow{ margin-bottom:34px; }
/* ---- Hero 开场：核心充能序列 ---- */
.hero__title{
  font-size:clamp(40px,6.1vw,80px);
  line-height:1.08;
  font-weight:600;
  letter-spacing:-.035em;
  background:linear-gradient(180deg,#FFFFFF 0%,#DDE1EA 62%,#9BA1AB 100%);
  -webkit-background-clip:text; background-clip:text;
  color:transparent;
  filter:drop-shadow(0 0 34px rgba(91,140,255,.28))
         drop-shadow(0 0 90px rgba(142,124,255,.18));
  animation:heroMask 1.15s var(--ease-out) .18s both;
}
@keyframes heroMask{
  from{ clip-path:inset(0 0 108% 0); opacity:.2; }
  to  { clip-path:inset(-30% -20% -30% -20%); opacity:1; }
}
.hero__sub{
  margin:32px auto 0;
  max-width:660px;
  font-size:17px; line-height:1.8; color:var(--text-2);
}
.hero__actions{
  margin-top:44px;
  display:flex; justify-content:center; gap:14px; flex-wrap:wrap;
}

/* 向下滚动引导 */
.hero__cue{
  position:relative;
  width:1px; height:58px;
  margin:64px auto 0;
  background:linear-gradient(180deg,rgba(255,255,255,.18),transparent);
}
.hero__cue span{
  position:absolute; top:-28px; left:50%; transform:translateX(-50%);
  font-size:9.5px; letter-spacing:.26em; color:var(--text-3);
  white-space:nowrap;
}
.hero__cue i{
  position:absolute; left:-1px; top:0;
  width:3px; height:3px; border-radius:50%;
  background:var(--accent);
  box-shadow:0 0 9px rgba(91,140,255,.95);
  animation:cueDrop 2.6s var(--ease) infinite;
}
@keyframes cueDrop{
  0%  { top:0;    opacity:0; }
  22% { opacity:1; }
  100%{ top:58px; opacity:0; }
}

/* 回到顶部 */
.totop{
  position:fixed; right:26px; bottom:26px; z-index:110;
  width:44px; height:44px; border-radius:50%;
  display:grid; place-items:center;
  border:1px solid var(--line-2);
  background:rgba(12,14,18,.72);
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
  color:var(--text-2);
  opacity:0; transform:translateY(14px) scale(.92); pointer-events:none;
  transition:opacity .45s var(--ease), transform .45s var(--ease),
             border-color .3s var(--ease), color .3s var(--ease),
             background .3s var(--ease), box-shadow .3s var(--ease);
}
.totop svg{ width:18px; height:18px; }
.totop.is-show{ opacity:1; transform:none; pointer-events:auto; }
.totop:hover{
  color:#fff;
  border-color:rgba(142,124,255,.55);
  background:rgba(20,24,32,.88);
  box-shadow:0 14px 34px -14px rgba(91,140,255,.75);
}

/* ---- AI CORE ---- */
.core{ margin-top:96px; position:relative; }
.core__svg{ width:100%; height:auto; overflow:visible; }
.core__mobile{ display:none; }

/* --- AI Core 产品窗口（真实产品界面感） --- */
.coreframe{
  position:relative;
  border:1px solid rgba(255,255,255,.16);
  border-radius:var(--r-lg);
  background:
    radial-gradient(130% 90% at 50% -10%, rgba(91,140,255,.22), transparent 64%),
    linear-gradient(180deg,rgba(255,255,255,.105),rgba(255,255,255,.060));
  overflow:hidden;
  box-shadow:0 70px 140px -80px rgba(91,140,255,.85);
}
.coreframe::before{
  content:""; position:absolute; inset:0; z-index:3;
  border-radius:inherit; padding:1px;
  background:conic-gradient(from 0deg,
      transparent 0%, rgba(91,140,255,.60) 9%,
      rgba(142,124,255,.30) 17%, transparent 26%, transparent 100%);
  -webkit-mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite:xor;
  mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  mask-composite:exclude;
  background:conic-gradient(from 0deg,
      transparent 0%, rgba(91,140,255,.60) 9%,
      rgba(142,124,255,.30) 17%, transparent 26%, transparent 100%);
  background:conic-gradient(from var(--frame-angle,0deg),
      transparent 0%, rgba(91,140,255,.60) 9%,
      rgba(142,124,255,.30) 17%, transparent 26%, transparent 100%);
  animation:frameSpin 14s linear infinite;
  pointer-events:none; opacity:.8;
}
@property --frame-angle{ syntax:"<angle>"; initial-value:0deg; inherits:false; }
@keyframes frameSpin{ to{ --frame-angle:360deg; } }
.coreframe__bar{
  height:44px; padding:0 18px;
  display:flex; align-items:center; gap:12px;
  border-bottom:1px solid rgba(255,255,255,.14);
  background:rgba(255,255,255,.072);
}
.coreframe__title{ font-size:12.5px; color:#DCE0FF; letter-spacing:.02em; font-weight:600; }
.coreframe__meta{ margin-left:auto; display:flex; align-items:center; gap:10px; }
.status{
  display:inline-flex; align-items:center; gap:6px;
  font-size:10px; letter-spacing:.16em; color:#AEBBFF;
}
.status i{
  width:5px; height:5px; border-radius:50%; background:var(--accent);
  box-shadow:0 0 8px rgba(91,140,255,1);
  animation:nodePulse 2.6s var(--ease) infinite;
}
.coreframe__meta .tag{
  font-size:10px; letter-spacing:.14em; color:var(--text-2);
  padding:3px 9px; border-radius:999px;
  border:1px solid rgba(255,255,255,.14);
}
.coreframe__body{ padding:28px 18px 16px; position:relative; }
.coreframe__body::before{
  content:""; position:absolute; inset:0; pointer-events:none;
  background:radial-gradient(55% 55% at 50% 48%, rgba(91,140,255,.16), transparent 72%);
}
.coreframe__foot{
  min-height:44px; padding:11px 18px;
  display:flex; align-items:center; justify-content:space-between; gap:12px;
  border-top:1px solid rgba(255,255,255,.10);
  background:rgba(255,255,255,.045);
  font-size:11.5px; color:var(--text);
}
.coreframe__foot em{
  font-style:normal; letter-spacing:.16em; margin-right:8px;
}
.coreframe__core{
  font-size:11px; letter-spacing:.26em; color:#AEBBFF;
  padding:3px 12px; border-radius:999px;
  border:1px solid rgba(142,124,255,.30);
  background:rgba(142,124,255,.10);
}
.coreframe__body .core__svg{ margin:0 auto; }

/* 开场充能序列 */
.core{ animation:coreRise 1.2s var(--ease-out) .30s both; }
@keyframes coreRise{
  from{ opacity:0; transform:translateY(28px); }
  to  { opacity:1; transform:none; }
}
.ln--in use,.ln--out use{
  stroke:rgba(255,255,255,.13);
  stroke-dasharray:540; stroke-dashoffset:540;
  animation:draw 1.6s var(--ease-out) forwards;
}
.ln--in use:nth-child(1),.ln--out use:nth-child(1){ animation-delay:.50s; }
.ln--in use:nth-child(2),.ln--out use:nth-child(2){ animation-delay:.62s; }
.ln--in use:nth-child(3),.ln--out use:nth-child(3){ animation-delay:.74s; }
.ln--in use:nth-child(4),.ln--out use:nth-child(4){ animation-delay:.86s; }
@keyframes draw{ to{ stroke-dashoffset:0; } }

.node{ opacity:0; animation:fadeIn .9s var(--ease-out) forwards; }
.node:nth-child(1),.node:nth-child(5){ animation-delay:.86s; }
.node:nth-child(2),.node:nth-child(6){ animation-delay:.96s; }
.node:nth-child(3),.node:nth-child(7){ animation-delay:1.06s; }
.node:nth-child(4),.node:nth-child(8){ animation-delay:1.16s; }

.core__center{
  opacity:0;
  transform-origin:470px 260px;
  animation:coreBoot 1.35s var(--ease-out) .55s both;
}
@keyframes coreBoot{
  0%  { opacity:0; transform:scale(.80); }
  55% { opacity:1; transform:scale(1.03); }
  100%{ opacity:1; transform:scale(1); }
}
.core__particles{ opacity:0; animation:fadeIn 1.2s ease 1.9s forwards; }
@keyframes fadeIn{ to{ opacity:1; } }

.core__halo{ animation:breathe 7.5s var(--ease) infinite; transform-origin:470px 260px; }
@keyframes breathe{
  0%,100%{ opacity:.75; transform:scale(.96); }
  50%    { opacity:1.15; transform:scale(1.06); }
}

/* 冲击波扩散环 */
.wave{
  fill:none;
  stroke:rgba(118,142,255,.55);
  stroke-width:1;
}

/* 雷达扫描 */
.core__sweep{ mix-blend-mode:screen; }

/* 轨道卫星点 */
.core__sats circle{
  fill:#B9ABFF;
  filter:drop-shadow(0 0 7px rgba(155,132,255,.95));
}

.ln use{ fill:none; stroke-linecap:round; }
.ln--in use{ stroke:rgba(255,255,255,.16); stroke-width:1; }
.ln--out use{ stroke:rgba(255,255,255,.16); stroke-width:1; }
.ln--flow use{
  stroke-width:1.1;
  stroke-dasharray:3 12;
  animation:flow 3.2s linear infinite;
  opacity:.85;
}
.ln--flow use:nth-child(-n+4){ stroke:var(--accent); }
.ln--flow use:nth-child(n+5){ stroke:var(--accent-2); }
@keyframes flow{ to{ stroke-dashoffset:-60; } }

.pt{ fill:#8FA9FF; filter:drop-shadow(0 0 5px rgba(120,150,255,.9)); opacity:.9; }
.pt--v{ fill:#B3A4FF; filter:drop-shadow(0 0 5px rgba(150,130,255,.9)); }

.node rect{
  fill:rgba(255,255,255,.060);
  stroke:rgba(255,255,255,.26);
  stroke-width:1;
}
.node text{ font-family:var(--font-sans); }
.node__t{
  font-size:11.5px; letter-spacing:.16em; font-weight:500; fill:#E6E8ED;
  text-transform:uppercase;
}
.node__s{ font-size:11px; letter-spacing:.02em; fill:#9AA0AB; }
.node__t,.node__s{ text-anchor:end; }
.node--r .node__t,.node--r .node__s{ text-anchor:start; }
.node__d{ fill:var(--accent); animation:nodePulse 4.5s var(--ease) infinite; }
.node:nth-child(2) .node__d{ animation-delay:.6s; }
.node:nth-child(3) .node__d{ animation-delay:1.2s; }
.node:nth-child(4) .node__d{ animation-delay:1.8s; }
.node--r .node__d{ fill:var(--accent-2); }
@keyframes nodePulse{
  0%,100%{ opacity:.35; }
  50%    { opacity:1; }
}

.ring{ fill:none; }
.ring--a{
  stroke:rgba(142,124,255,.30); stroke-width:1;
  stroke-dasharray:2 11;
  transform-origin:470px 260px;
  animation:spin 64s linear infinite;
}
.ring--b{
  stroke:rgba(255,255,255,.075); stroke-width:1;
  transform-origin:470px 260px;
  animation:spinBack 90s linear infinite;
}
@keyframes spin{ to{ transform:rotate(360deg); } }
@keyframes spinBack{ to{ transform:rotate(-360deg); } }

.corebox{
  fill:url(#coreFill);
  stroke:rgba(188,204,255,.55);
  stroke-width:1;
}
.corebox--inner{
  fill:none;
  stroke:rgba(91,140,255,.15);
}
.corebox--blur{
  fill:none;
  stroke:rgba(128,148,255,.65);
  animation:coreGlow 5.5s var(--ease) infinite;
}
@keyframes coreGlow{
  0%,100%{ opacity:.35; }
  50%    { opacity:1; }
}
.core__label{
  font-family:var(--font-sans);
  font-size:15px; font-weight:600; letter-spacing:.30em;
  fill:#F4F5F8; text-anchor:middle;
}
.core__rule{ stroke:rgba(255,255,255,.16); stroke-width:1; }
.core__brand{
  font-family:var(--font-sans);
  font-size:9.5px; letter-spacing:.22em; fill:#9AA0AB; text-anchor:middle;
}

/* 移动端 AI Core */
.mcore__group{ display:flex; flex-wrap:wrap; gap:8px; justify-content:center; }
.mchip{
  display:inline-block;
  padding:7px 12px; border-radius:var(--r-sm);
  border:1px solid var(--line);
  background:rgba(255,255,255,.022);
  font-size:11px; letter-spacing:.06em; color:var(--text-2);
}
.mchip--v{ border-color:rgba(142,124,255,.20); color:#C9C2FF; }
.mcore__stem{
  position:relative; height:38px; width:2px; margin:6px auto;
  background:linear-gradient(180deg,rgba(91,140,255,.05),rgba(91,140,255,.35));
  overflow:hidden;
}
.mcore__stem--down{ background:linear-gradient(180deg,rgba(142,124,255,.35),rgba(142,124,255,.05)); }
.mcore__stem i{
  position:absolute; left:-1.5px; width:5px; height:5px; border-radius:50%;
  background:var(--accent); box-shadow:0 0 8px rgba(91,140,255,.9);
  animation:stemFlow 2.4s linear infinite;
}
.mcore__stem--down i{ background:var(--accent-2); box-shadow:0 0 8px rgba(142,124,255,.9); }
@keyframes stemFlow{ 0%{ top:-6px; opacity:0; } 20%{opacity:1;} 100%{ top:38px; opacity:0; } }
.mcore__core{
  width:150px; height:150px; margin:0 auto;
  border-radius:16px;
  border:1px solid rgba(255,255,255,.16);
  background:
    radial-gradient(circle at 50% 45%, rgba(91,140,255,.16), transparent 68%),
    rgba(10,12,17,.9);
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:6px;
  box-shadow:0 0 40px -14px rgba(91,140,255,.6);
  animation:mcorePulse 5.5s var(--ease) infinite;
}
@keyframes mcorePulse{
  0%,100%{ box-shadow:0 0 40px -16px rgba(91,140,255,.45); }
  50%    { box-shadow:0 0 54px -10px rgba(91,140,255,.8); }
}
.mcore__core span{ font-size:13px; font-weight:600; letter-spacing:.28em; }
.mcore__core em{ font-style:normal; font-size:9.5px; letter-spacing:.2em; color:var(--text-3); }

/* ============================ Sections ============================ */
.section{
  position:relative;
  padding:var(--sec-y) 0;
}
.section--pain{ background:var(--bg-soft); border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.section--diag{ background:
  radial-gradient(ellipse 95% 65% at 50% 0%, rgba(91,140,255,.10), transparent 70%),
  var(--bg); }
.section--kb{ background:var(--bg-soft); border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.section--arch{ background:var(--bg); }
.section--cases{ background:var(--bg-soft); border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.section--why{ background:var(--bg); }
.section--process{ background:var(--bg-soft); border-top:1px solid var(--line); border-bottom:1px solid var(--line); }

/* 分区光带 */
.section--pain::before,.section--kb::before,
.section--cases::before,.section--process::before,
.section--pain::after,.section--kb::after,
.section--cases::after,.section--process::after{
  content:""; position:absolute; left:0; right:0; height:1px;
  background:linear-gradient(90deg,transparent,rgba(142,124,255,.45),transparent);
  pointer-events:none;
}
.section--pain::before,.section--kb::before,
.section--cases::before,.section--process::before{ top:-1px; }
.section--pain::after,.section--kb::after,
.section--cases::after,.section--process::after{ bottom:-1px; }

/* ============================ 02 Capability cards ============================ */
/* Bento Grid：大小即层级 */
.cards{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  grid-auto-rows:minmax(252px,auto);
  gap:14px;
}
.card--a { grid-column:1 / span 2; grid-row:1; }
.card--kb{ grid-column:3; grid-row:1 / span 2; padding-bottom:34px; }
.card--b { grid-column:1; grid-row:2; }
.card--c { grid-column:2; grid-row:2; }

.mini{ margin-top:24px; display:flex; align-items:center; gap:9px; flex-wrap:wrap; }
.mini__n{
  font-size:10px; letter-spacing:.16em; color:var(--text-2);
  padding:5px 10px; border-radius:var(--r-sm);
  border:1px solid var(--line); background:rgba(255,255,255,.022);
}
.mini__n--a{
  border-color:rgba(91,140,255,.32); color:#CBD7FF;
  background:rgba(91,140,255,.09);
}
.mini__l{
  width:20px; height:1px; position:relative;
  background:linear-gradient(90deg,rgba(91,140,255,.55),rgba(142,124,255,.30));
}
.mini__l::after{
  content:""; position:absolute; right:-2px; top:-1.5px;
  width:4px; height:4px; border-radius:50%;
  background:var(--accent-2); box-shadow:0 0 6px rgba(142,124,255,.9);
}

.card{
  position:relative;
  padding:28px 26px 30px;
  min-height:0;
  border:1px solid var(--line);
  border-radius:var(--r-lg);
  background:linear-gradient(180deg,rgba(255,255,255,.028),rgba(255,255,255,.008));
  display:flex; flex-direction:column;
  overflow:hidden;
  transition:border-color .5s var(--ease), transform .5s var(--ease),
             background .5s var(--ease), box-shadow .5s var(--ease);
}
/* 光标跟随高光 */
.card::before{
  content:""; position:absolute; inset:0; pointer-events:none;
  background:radial-gradient(340px circle at var(--mx,50%) var(--my,50%),
              rgba(91,140,255,.16), rgba(142,124,255,.06) 45%, transparent 66%);
  opacity:0; transition:opacity .5s var(--ease);
}
.card::after{
  content:""; position:absolute; top:0; left:0; right:0; height:1px;
  background:linear-gradient(90deg,transparent,rgba(142,124,255,.6),transparent);
  opacity:0; transition:opacity .55s var(--ease);
}
.card:hover{
  transform:translateY(-3px);
  border-color:rgba(142,124,255,.28);
  box-shadow:0 26px 60px -34px rgba(91,140,255,.55);
}
.card:hover::before{ opacity:1; }
.card:hover::after{ opacity:1; }
.card__top{
  display:flex; align-items:center; justify-content:space-between;
  margin-bottom:44px;
}
.card__no{
  font-size:12px; font-weight:600; letter-spacing:.12em; color:var(--accent);
}
.card__en{
  font-size:9.5px; letter-spacing:.18em; color:var(--text-3); text-transform:uppercase;
}
.card__title{
  font-size:21px; font-weight:600; letter-spacing:-.01em;
}
.card__desc{
  margin-top:12px; font-size:14px; line-height:1.75; color:var(--text-2);
  max-width:250px;
}
.tags{
  margin-top:auto; padding-top:24px;
  display:flex; flex-wrap:wrap; gap:6px;
}
.tags li{
  padding:5px 10px; border-radius:var(--r-sm);
  border:1px solid var(--line);
  background:rgba(255,255,255,.022);
  font-size:12px; color:var(--text-2);
  transition:border-color .4s var(--ease), color .4s var(--ease);
}
.card:hover .tags li{ border-color:rgba(255,255,255,.13); color:#DDE0E6; }
.card__arrow{
  position:absolute; right:24px; bottom:22px;
  font-size:16px; color:var(--text-3);
  transition:transform .5s var(--ease), color .5s var(--ease);
}
.card:hover .card__arrow{ transform:translate(4px,-4px); color:#AEBBFF; }

/* ============================ 03 Pain ============================ */
.pain{
  display:grid; grid-template-columns:repeat(3,1fr);
  gap:1px;
  background:var(--line);
  border:1px solid var(--line);
  border-radius:var(--r-lg);
  overflow:hidden;
}
.pain__item{
  position:relative;
  padding:46px 34px 42px;
  background:var(--bg-soft);
  min-height:210px;
  overflow:hidden;
  transition:background .5s var(--ease);
}
.pain__item::before{
  content:""; position:absolute; top:0; left:0; height:1px; width:100%;
  background:linear-gradient(90deg,transparent,rgba(91,140,255,.0),transparent);
}
.pain__item::after{
  content:""; position:absolute; top:0; left:-30%; width:30%; height:1px;
  background:linear-gradient(90deg,transparent,rgba(120,150,255,.9),transparent);
  animation:sweep 6s cubic-bezier(.4,0,.2,1) infinite;
}
.pain__item:nth-child(2)::after{ animation-delay:.8s; }
.pain__item:nth-child(3)::after{ animation-delay:1.6s; }
.pain__item:nth-child(4)::after{ animation-delay:2.4s; }
.pain__item:nth-child(5)::after{ animation-delay:3.2s; }
.pain__item:nth-child(6)::after{ animation-delay:4.0s; }
@keyframes sweep{
  0%   { left:-32%; opacity:0; }
  12%  { opacity:1; }
  88%  { opacity:1; }
  100% { left:100%; opacity:0; }
}
.pain__item:hover{ background:#0E1014; }
.pain__no{
  display:block;
  font-size:64px; font-weight:600; line-height:1;
  letter-spacing:-.04em;
  color:transparent;
  -webkit-text-stroke:1px rgba(255,255,255,.19);
  margin-bottom:26px;
  transition:color .5s var(--ease), -webkit-text-stroke-color .5s var(--ease);
}
.pain__item:hover .pain__no{
  color:rgba(91,140,255,.14);
  -webkit-text-stroke-color:rgba(142,124,255,.48);
}
.pain__text{
  font-size:17px; line-height:1.7; color:#DDE0E6; font-weight:450;
  max-width:280px;
}
.pain__foot{
  margin-top:72px; text-align:center;
  display:flex; flex-direction:column; align-items:center; gap:28px;
}
.pain__claim{
  font-size:clamp(20px,2.2vw,27px);
  font-weight:500; letter-spacing:-.01em; color:var(--text);
}

/* ============================ 04 Diagnosis ============================ */
.diag{
  display:grid; grid-template-columns:1fr 1fr; gap:18px;
  max-width:1080px; margin:0 auto;
}
.diag__panel{
  border:1px solid var(--line);
  border-radius:var(--r-lg);
  background:linear-gradient(180deg,rgba(255,255,255,.032),rgba(255,255,255,.008));
  overflow:hidden;
  box-shadow:0 40px 90px -60px rgba(0,0,0,.9);
}
.diag__panel--a{
  background:
    radial-gradient(ellipse 100% 60% at 50% 0%, rgba(91,140,255,.12), transparent 70%),
    linear-gradient(180deg,rgba(255,255,255,.032),rgba(255,255,255,.008));
}

/* 科技边角 */
.diag__panel,.chat{ position:relative; }
.diag__panel::before,.diag__panel::after,
.chat::before,.chat::after{
  content:""; position:absolute; width:18px; height:18px; z-index:2;
  border:0 solid rgba(142,124,255,.55);
  pointer-events:none;
}
.diag__panel::before,.chat::before{
  top:-1px; left:-1px;
  border-top-width:1px; border-left-width:1px;
  border-top-left-radius:var(--r-lg);
}
.diag__panel::after,.chat::after{
  bottom:-1px; right:-1px;
  border-bottom-width:1px; border-right-width:1px;
  border-bottom-right-radius:var(--r-lg);
}
.diag__bar{
  height:46px; padding:0 18px;
  display:flex; align-items:center; gap:12px;
  border-bottom:1px solid var(--line);
  background:rgba(255,255,255,.018);
}
.diag__bar-title{ font-size:13px; color:var(--text-2); letter-spacing:.02em; }
.diag__step{ margin-left:auto; font-size:11px; letter-spacing:.14em; color:var(--text-3); }
.diag__live{
  margin-left:auto; display:inline-flex; align-items:center; gap:6px;
  font-size:10px; letter-spacing:.16em; color:#9FB0FF;
}
.diag__live i{
  width:5px; height:5px; border-radius:50%; background:var(--accent);
  box-shadow:0 0 8px rgba(91,140,255,1);
  animation:nodePulse 2.6s var(--ease) infinite;
}
.tl{ display:inline-flex; gap:5px; }
.tl i{ width:8px; height:8px; border-radius:50%; background:rgba(255,255,255,.13); }
.diag__body{ padding:30px 26px 32px; }
.diag__q{
  font-size:19px; font-weight:500; letter-spacing:-.005em; margin-bottom:24px;
}
.opts{ display:grid; grid-template-columns:1fr 1fr; gap:9px; }
.opt{
  text-align:left;
  padding:13px 15px;
  border:1px solid var(--line);
  border-radius:var(--r-sm);
  background:rgba(255,255,255,.018);
  font-size:14px; color:var(--text-2);
  transition:all .35s var(--ease);
}
.opt:hover{ border-color:var(--line-2); color:var(--text); background:rgba(255,255,255,.04); }
.opt.is-active{
  border-color:rgba(91,140,255,.55);
  background:rgba(91,140,255,.12);
  color:#EAF0FF;
  box-shadow:0 0 0 3px rgba(91,140,255,.08);
}

.diag__result{ min-height:296px; }
.diag__empty p{
  margin-top:26px; font-size:14px; color:var(--text-3); line-height:1.7;
}
.sk{
  height:34px; border-radius:var(--r-sm);
  background:linear-gradient(90deg,rgba(255,255,255,.030),rgba(255,255,255,.055),rgba(255,255,255,.030));
  background-size:200% 100%;
  animation:sk 2.4s ease-in-out infinite;
}
.sk--2{ width:78%; margin-top:10px; }
.sk--3{ width:56%; margin-top:10px; }
@keyframes sk{ 0%{background-position:120% 0;} 100%{background-position:-20% 0;} }

.diag__label{
  font-size:11px; letter-spacing:.18em; text-transform:uppercase; color:var(--text-3);
  margin-bottom:16px;
}
.scenes{ counter-reset:s; }
.scenes li{
  counter-increment:s;
  display:flex; align-items:center; gap:14px;
  padding:14px 16px; margin-bottom:9px;
  border:1px solid var(--line);
  border-radius:var(--r-sm);
  background:rgba(255,255,255,.022);
  font-size:15px; color:#E7E9EE;
  opacity:0; transform:translateY(8px);
  animation:sceneIn .55s var(--ease-out) forwards;
}
.scenes li:nth-child(1){ animation-delay:.05s; }
.scenes li:nth-child(2){ animation-delay:.15s; }
.scenes li:nth-child(3){ animation-delay:.25s; }
@keyframes sceneIn{ to{ opacity:1; transform:none; } }
.scenes li::before{
  content:attr(data-n);
  flex:0 0 auto;
  width:24px; height:24px; border-radius:50%;
  display:grid; place-items:center;
  font-size:13px; color:#AEBBFF;
  border:1px solid rgba(142,124,255,.32);
  background:rgba(142,124,255,.10);
}
.scenes li.is-primary{
  border-color:rgba(91,140,255,.34);
  background:linear-gradient(90deg,rgba(91,140,255,.13),rgba(91,140,255,.03));
}
.scenes li small{
  margin-left:auto; font-size:11px; letter-spacing:.08em; color:var(--text-3);
}
.advice{
  margin-top:20px; padding:16px 18px;
  border:1px solid rgba(91,140,255,.22);
  border-radius:var(--r-sm);
  background:rgba(91,140,255,.07);
  display:flex; gap:12px; align-items:flex-start;
  opacity:0; transform:translateY(8px);
  animation:sceneIn .55s var(--ease-out) .34s forwards;
}
.advice__k{
  flex:0 0 auto; font-size:11px; letter-spacing:.14em; color:#AEBBFF;
  padding-top:3px;
}
.advice__v{ font-size:14.5px; line-height:1.7; color:#E4E8F2; }
.advice__v b{ color:#fff; font-weight:600; }

.diag__cta{
  margin-top:56px; text-align:center;
  display:flex; flex-direction:column; align-items:center; gap:18px;
}
.diag__note{ font-size:12.5px; color:var(--text-3); }

/* ============================ 05 Knowledge ============================ */
.kb{
  display:grid; grid-template-columns:0.92fr 1.08fr;
  gap:64px; align-items:center;
}
.kb__copy .eyebrow{ margin-bottom:22px; }
.kb__copy .h2{ margin-bottom:22px; }

.pipeline{ margin-top:38px; display:flex; flex-direction:column; gap:0; }
.pipeline__row{
  display:flex; align-items:center; gap:14px;
  padding:13px 18px;
  border:1px solid var(--line);
  border-radius:var(--r-sm);
  background:rgba(255,255,255,.020);
}
.pipeline__row span{
  font-size:12px; letter-spacing:.18em; color:#DDE1E8; font-weight:500;
}
.pipeline__row em{
  font-style:normal; font-size:12.5px; color:var(--text-3);
  padding-left:14px; border-left:1px solid var(--line);
}
.pipeline__row.is-accent{
  border-color:rgba(91,140,255,.30);
  background:linear-gradient(90deg,rgba(91,140,255,.13),rgba(91,140,255,.03));
}
.pipeline__row.is-accent span{ color:#C6D3FF; }
.pipeline__arw{
  width:1px; height:20px; margin-left:26px;
  background:linear-gradient(180deg,rgba(91,140,255,.45),rgba(142,124,255,.15));
  position:relative; overflow:hidden;
}
.pipeline__arw::after{
  content:""; position:absolute; left:-1px; width:3px; height:3px; border-radius:50%;
  background:var(--accent-2); box-shadow:0 0 6px rgba(142,124,255,1);
  animation:drop 2.6s linear infinite;
}
@keyframes drop{ 0%{ top:-4px; opacity:0;} 25%{opacity:1;} 100%{ top:20px; opacity:0;} }

.srcs{ margin-top:30px; display:flex; flex-wrap:wrap; gap:8px; }
.srcs li{
  display:inline-flex; align-items:center; gap:8px;
  padding:8px 13px;
  border:1px solid var(--line); border-radius:999px;
  background:rgba(255,255,255,.020);
  font-size:12.5px; color:var(--text-2);
  transition:border-color .4s var(--ease), color .4s var(--ease);
}
.srcs li:hover{ border-color:var(--line-2); color:var(--text); }
.ic{
  width:13px; height:13px; border-radius:3px; display:inline-block;
  background:rgba(255,255,255,.10);
  position:relative;
}
.ic--pdf{ background:linear-gradient(180deg,#7C9BFF,#4E6FE0); }
.ic--doc{ background:linear-gradient(180deg,#8E7CFF,#5F52C9); }
.ic--xls{ background:linear-gradient(180deg,#6FB6A6,#3E7F72); }
.ic--web{ background:linear-gradient(180deg,#9AA6B8,#5B6675); }
.ic--faq{ background:linear-gradient(180deg,#C0A27A,#8A6F49); }

/* Chat */
.demo-tabs{
  display:inline-flex; gap:4px;
  margin:0 0 12px; padding:4px;
  border:1px solid var(--line); border-radius:999px;
  background:rgba(255,255,255,.018);
}
.demo-tabs__t{
  padding:7px 15px; border-radius:999px;
  font-size:12.5px; color:var(--text-3);
  border:1px solid transparent;
  transition:color .3s var(--ease), background .3s var(--ease), border-color .3s var(--ease);
}
.demo-tabs__t:hover{ color:var(--text-2); }
.demo-tabs__t.is-active{
  color:#EAF0FF;
  background:rgba(91,140,255,.14);
  border-color:rgba(91,140,255,.42);
}
.chat{
  border:1px solid var(--line);
  border-radius:var(--r-lg);
  background:linear-gradient(180deg,rgba(255,255,255,.036),rgba(255,255,255,.010));
  overflow:hidden;
  box-shadow:0 60px 120px -70px rgba(91,140,255,.55);
}
.chat__bar{
  position:relative; z-index:2;
  height:48px; padding:0 18px;
  display:flex; align-items:center; gap:12px;
  border-bottom:1px solid var(--line);
  background:rgba(255,255,255,.020);
}
.chat__title{ font-size:13px; color:var(--text-2); }
.chat__badge{
  margin-left:auto;
  font-size:10px; letter-spacing:.16em; color:#AEBBFF;
  padding:3px 9px; border-radius:999px;
  border:1px solid rgba(142,124,255,.30);
  background:rgba(142,124,255,.10);
}
/* 知识库：检索扫描线 */
.chat__scan{
  position:absolute; left:0; right:0; top:0; height:150px; z-index:1;
  pointer-events:none;
  background:linear-gradient(180deg,
      rgba(91,140,255,0) 0%,
      rgba(91,140,255,.075) 55%,
      rgba(142,124,255,.10) 78%,
      rgba(91,140,255,0) 100%);
  animation:scan 7.5s cubic-bezier(.5,0,.5,1) infinite;
}
.chat__scan::after{
  content:""; position:absolute; left:0; right:0; bottom:0; height:1px;
  background:linear-gradient(90deg,transparent,rgba(140,165,255,.55),transparent);
}
@keyframes scan{
  0%  { transform:translateY(-160px); opacity:0; }
  10% { opacity:1; }
  90% { opacity:1; }
  100%{ transform:translateY(540px); opacity:0; }
}

.chat__body{ padding:26px 24px 8px; position:relative; z-index:2; }
.msg{ display:flex; gap:12px; margin-bottom:22px; }
.msg--me{ justify-content:flex-end; }
.bubble{
  max-width:82%;
  padding:14px 17px;
  border-radius:12px;
  font-size:14.5px; line-height:1.8; color:#E6E8EE;
}
.msg--me .bubble{
  background:rgba(255,255,255,.055);
  border:1px solid var(--line);
  border-bottom-right-radius:4px;
}
.msg--ai .bubble{
  background:rgba(255,255,255,.028);
  border:1px solid var(--line);
  border-bottom-left-radius:4px;
}
.avatar{ width:30px; height:30px; flex:0 0 auto; }
.avatar svg{ width:100%; height:100%; }
.typing .caret{
  display:inline-block; width:2px; height:15px; margin-left:2px;
  background:var(--accent); vertical-align:-2px;
  animation:caret 1s steps(1) infinite;
}
@keyframes caret{ 50%{ opacity:0; } }
.cite{
  margin-top:16px; padding-top:14px;
  border-top:1px dashed var(--line-2);
  display:flex; align-items:center; gap:10px; flex-wrap:wrap;
  font-size:12.5px;
}
.cite__k{ color:var(--text-3); letter-spacing:.1em; }
.cite__f{
  display:inline-flex; align-items:center; gap:7px;
  padding:5px 10px; border-radius:var(--r-sm);
  border:1px solid rgba(91,140,255,.26);
  background:rgba(91,140,255,.09);
  color:#CBD7FF;
}
.cite__p{ color:var(--text-3); }
.chat__input{
  margin:8px 24px 24px;
  height:46px; padding:0 14px 0 18px;
  display:flex; align-items:center;
  border:1px solid var(--line);
  border-radius:10px;
  background:rgba(255,255,255,.020);
}
.chat__ph{ font-size:13.5px; color:var(--text-3); }
.chat__send{
  margin-left:auto;
  width:28px; height:28px; border-radius:8px;
  display:grid; place-items:center;
  font-size:13px; color:#fff;
  background:linear-gradient(180deg,#6B98FF,#4C7BFF);
}

/* ============================ 06 Architecture ============================ */
.arch{
  display:grid; grid-template-columns:1fr 340px; gap:56px; align-items:start;
  max-width:1080px; margin:0 auto;
}
.arch__stack{ display:flex; flex-direction:column; align-items:stretch; }
.layer{
  position:relative;
  display:flex; align-items:center; gap:24px;
  padding:22px 26px;
  border:1px solid var(--line);
  border-radius:var(--r);
  background:linear-gradient(180deg,rgba(255,255,255,.030),rgba(255,255,255,.008));
  transition:border-color .5s var(--ease), transform .5s var(--ease), box-shadow .5s var(--ease);
}
.layer:hover{
  border-color:rgba(142,124,255,.26);
  transform:translateX(3px);
  box-shadow:0 20px 50px -34px rgba(91,140,255,.7);
}
.layer__en{
  flex:0 0 148px;
  font-size:11px; letter-spacing:.18em; color:var(--accent);
}
.layer__main h3{ font-size:17px; font-weight:600; }
.layer__main p{ margin-top:5px; font-size:13.5px; color:var(--text-2); }
.layer::after{
  content:""; position:absolute; top:-1px; left:12%; right:12%; height:1px;
  background:linear-gradient(90deg,transparent,rgba(142,124,255,.55),transparent);
  opacity:0; transition:opacity .5s var(--ease);
}
.layer:hover::after{ opacity:1; }
.layer--last{
  border-color:rgba(91,140,255,.28);
  background:linear-gradient(90deg,rgba(91,140,255,.11),rgba(255,255,255,.010));
}
.layer--last .layer__en{ color:#AEBBFF; }
.link{
  width:1px; height:34px; margin-left:52px;
  background:linear-gradient(180deg,rgba(91,140,255,.05),rgba(142,124,255,.30));
  position:relative; overflow:hidden;
}
.link i{
  position:absolute; left:-1.5px; top:-4px;
  width:4px; height:4px; border-radius:50%;
  background:var(--accent-2); box-shadow:0 0 7px rgba(142,124,255,1);
  animation:drop2 2.8s linear infinite;
}
@keyframes drop2{ 0%{ top:-4px; opacity:0; } 20%{opacity:1;} 100%{ top:34px; opacity:0; } }
.arch__note{
  position:sticky; top:120px;
  padding:30px 28px;
  border:1px solid var(--line);
  border-radius:var(--r-lg);
  background:
    radial-gradient(ellipse 100% 50% at 50% 0%, rgba(142,124,255,.10), transparent 70%),
    rgba(255,255,255,.018);
}
.arch__note-t{ font-size:19px; font-weight:600; letter-spacing:-.01em; }
.arch__note-d{ margin-top:14px; font-size:14.5px; line-height:1.8; color:var(--text-2); }
.arch__meta{ margin-top:26px; display:flex; flex-direction:column; gap:9px; }
.arch__meta span{
  font-size:12.5px; color:var(--text-3);
  padding-left:14px; position:relative;
}
.arch__meta span::before{
  content:""; position:absolute; left:0; top:9px;
  width:4px; height:4px; border-radius:50%; background:rgba(142,124,255,.7);
}

/* ============================ 07 Cases ============================ */
.cases{ display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
.case{
  position:relative; overflow:hidden;
  padding:34px 30px 36px;
  border:1px solid var(--line);
  border-radius:var(--r-lg);
  background:linear-gradient(180deg,rgba(255,255,255,.028),rgba(255,255,255,.006));
  transition:border-color .5s var(--ease), transform .5s var(--ease), box-shadow .5s var(--ease);
}
.case::before{
  content:""; position:absolute; inset:0; pointer-events:none;
  background:radial-gradient(360px circle at var(--mx,50%) var(--my,50%),
              rgba(91,140,255,.14), rgba(142,124,255,.05) 45%, transparent 66%);
  opacity:0; transition:opacity .5s var(--ease);
}
.case:hover::before{ opacity:1; }
.case__no,.case__title,.case__body{ position:relative; }
.case:hover{
  transform:translateY(-3px);
  border-color:rgba(142,124,255,.26);
  box-shadow:0 30px 70px -40px rgba(91,140,255,.6);
}
.case__no{ font-size:11.5px; letter-spacing:.18em; color:var(--text-3); }
.case__title{
  margin-top:16px;
  font-size:26px; font-weight:600; letter-spacing:-.015em;
}
.case__body{ margin-top:30px; display:flex; flex-direction:column; gap:18px; }
.case__body dt{
  font-size:11px; letter-spacing:.18em; color:var(--text-3); margin-bottom:8px;
}
.case__body dd{ font-size:14.5px; line-height:1.75; color:var(--text-2); }
.case__body dd.is-accent{ color:#CBD7FF; }

/* ============================ 08 Why ============================ */
.why{
  display:grid; grid-template-columns:repeat(4,1fr);
  gap:1px; background:var(--line);
  border:1px solid var(--line); border-radius:var(--r-lg); overflow:hidden;
}
.why__item{
  padding:40px 28px 44px;
  background:var(--bg);
  transition:background .5s var(--ease);
}
.why__item:hover{ background:#0E1014; }
.why__item h3{
  font-size:22px; font-weight:600; letter-spacing:-.01em;
  background:linear-gradient(180deg,#FFFFFF,#C3C8D2);
  -webkit-background-clip:text; background-clip:text; color:transparent;
}
.why__item p{ margin-top:14px; font-size:14px; line-height:1.8; color:var(--text-2); }
.statement{
  margin:96px auto 0;
  max-width:900px; text-align:center;
  font-size:clamp(26px,3.4vw,44px);
  line-height:1.42; font-weight:600; letter-spacing:-.022em;
  background:linear-gradient(180deg,#FFFFFF 0%,#B9BEC8 100%);
  -webkit-background-clip:text; background-clip:text; color:transparent;
}

/* ============================ 09 Process ============================ */
.steps{
  display:grid; grid-template-columns:repeat(6,1fr); gap:0;
  border:1px solid var(--line); border-radius:var(--r-lg);
  background:var(--bg-soft);
  overflow:hidden;
}
.step{
  padding:32px 20px 34px;
  border-right:1px solid var(--line);
  position:relative;
  transition:background .5s var(--ease);
}
.step:last-child{ border-right:none; }
.step:hover{ background:#0E1014; }
.step__no{
  display:block;
  font-size:30px; font-weight:600; letter-spacing:-.03em;
  color:transparent; -webkit-text-stroke:1px rgba(142,124,255,.42);
  transition:color .5s var(--ease);
}
.step:hover .step__no{ color:rgba(142,124,255,.14); }
.step__t{ display:block; margin-top:20px; font-size:14.5px; color:#DDE0E6; }
.step::after{
  content:""; position:absolute; top:0; left:0; right:0; height:1px;
  background:linear-gradient(90deg,transparent,rgba(142,124,255,.55),transparent);
  opacity:0; transition:opacity .5s var(--ease);
}
.step:hover::after{ opacity:1; }

/* ============================ 10 CTA ============================ */
.cta{
  position:relative;
  padding:200px 0 150px;
  background:var(--bg);
  overflow:hidden;
}
.cta__aura{
  position:absolute; bottom:-420px; left:50%; transform:translateX(-50%);
  width:1600px; height:1050px;
  background:radial-gradient(ellipse at 50% 60%, rgba(76,123,255,.20), transparent 64%);
  pointer-events:none;
}
.cta__ring{
  position:absolute; top:60px; left:50%; margin-left:-320px;
  width:640px; height:640px; border-radius:50%;
  background:conic-gradient(from 0deg,
      rgba(91,140,255,0) 0%,
      rgba(91,140,255,.30) 18%,
      rgba(142,124,255,.22) 32%,
      rgba(91,140,255,0) 52%);
  filter:blur(72px);
  animation:spin 28s linear infinite;
  pointer-events:none;
}
.cta__aura::after{
  content:""; position:absolute; top:-260px; left:50%; transform:translateX(-50%);
  width:900px; height:520px;
  background:radial-gradient(ellipse at center, rgba(142,124,255,.14), transparent 70%);
  filter:blur(40px);
}
.cta__inner{ position:relative; text-align:center; }
.cta__title{
  font-size:clamp(36px,5.4vw,72px);
  line-height:1.12; font-weight:600; letter-spacing:-.035em;
  background:linear-gradient(180deg,#FFFFFF,#C6CBD4);
  -webkit-background-clip:text; background-clip:text; color:transparent;
  filter:drop-shadow(0 0 40px rgba(91,140,255,.26));
}
.cta__sub{
  margin:30px auto 0; max-width:560px;
  font-size:17px; line-height:1.8; color:var(--text-2);
}
.cta__actions{
  margin-top:46px; display:flex; justify-content:center; gap:14px; flex-wrap:wrap;
}
.cta__brand{
  margin-top:110px;
  display:flex; flex-direction:column; align-items:center; gap:10px;
}
.cta__brand-n{ font-size:18px; font-weight:600; letter-spacing:.01em; }
.cta__brand-s{ font-size:14px; color:var(--text-3); }

/* ============================ Footer ============================ */
.footer{
  border-top:1px solid var(--line);
  background:var(--bg);
  padding:64px 0 34px;
}
.footer__inner{
  display:flex; align-items:flex-start; justify-content:space-between; gap:48px;
}
.footer__name{ font-size:16px; font-weight:600; }
.footer__slogan{ margin-top:10px; font-size:14px; color:var(--text-2); }
.footer__nav{
  display:grid; grid-template-columns:repeat(4,auto); gap:14px 40px;
}
.footer__nav a{
  font-size:13.5px; color:var(--text-2);
  transition:color .3s var(--ease);
}
.footer__nav a:hover{ color:var(--text); }
.footer__bottom{
  margin-top:56px; padding-top:24px;
  border-top:1px solid var(--line);
  font-size:12.5px; color:var(--text-3);
}

/* ============================ Reveal ============================ */
[data-reveal]{
  opacity:0; transform:translateY(22px);
  transition:opacity .9s var(--ease-out), transform .9s var(--ease-out);
}
[data-reveal].is-in{ opacity:1; transform:none; }
[data-reveal-delay="1"]{ transition-delay:.08s; }
[data-reveal-delay="2"]{ transition-delay:.16s; }
[data-reveal-delay="3"]{ transition-delay:.24s; }
[data-reveal-delay="4"]{ transition-delay:.32s; }
[data-reveal-delay="5"]{ transition-delay:.40s; }
[data-reveal-delay="6"]{ transition-delay:.48s; }

/* ============================ Responsive ============================ */

/* ---- Tablet 1024 ---- */
@media (max-width:1140px){
  :root{ --gutter:32px; --sec-y:130px; }
  .nav__links{ display:none; }
  .nav__toggle{ display:block; }
  .nav.is-open .nav__mobile{ display:flex; }
  .nav.is-open{ background:rgba(8,9,11,.96); }

  .cards{ grid-template-columns:repeat(2,1fr); grid-auto-rows:auto; }
  .card--a { grid-column:1 / span 2; grid-row:auto; }
  .card--kb{ grid-column:1 / span 2; grid-row:auto; }
  .card--b,.card--c{ grid-column:span 1; grid-row:auto; }
  .pain{ grid-template-columns:repeat(2,1fr); }
  .why{ grid-template-columns:repeat(2,1fr); }
  .cases{ grid-template-columns:1fr; }
  .case__title{ font-size:23px; }

  .kb{ grid-template-columns:1fr; gap:48px; }
  .arch{ grid-template-columns:1fr; gap:40px; }
  .arch__note{ position:static; }
  .steps{ grid-template-columns:repeat(3,1fr); }
  .step:nth-child(3){ border-right:none; }
  .step:nth-child(n+4){ border-top:1px solid var(--line); }

  .footer__inner{ flex-direction:column; gap:36px; }
  .footer__nav{ grid-template-columns:repeat(3,auto); }
}

/* ---- Mobile 390 ---- */
@media (max-width:720px){
  :root{ --gutter:22px; --sec-y:100px; }
  html{ scroll-padding-top:76px; }
  body{ font-size:15.5px; }

  .nav__inner{ height:60px; gap:16px; }
  .nav__actions .btn--primary{ display:none; }

  .hero{ padding:132px 0 84px; }
  .hero__eyebrow{ font-size:10.5px; letter-spacing:.14em; }
  .hero__title{ font-size:clamp(34px,10vw,42px); letter-spacing:-.03em; }
  .hero__sub{ margin-top:24px; font-size:15.5px; }
  .hero__actions{ margin-top:34px; flex-direction:column; align-items:stretch; }
  .hero__actions .btn{ width:100%; }
  .core{ margin-top:56px; }
  .core__svg{ display:none; }
  .core__mobile{ display:block; }

  .cards{ grid-template-columns:1fr; gap:12px; grid-auto-rows:auto; }
  .card--a,.card--b,.card--c,.card--kb{ grid-column:auto; grid-row:auto; }
  .card{ min-height:0; padding:24px 22px 26px; }
  .card--kb{ padding-bottom:26px; }
  .mini{ margin-top:20px; }
  .card__top{ margin-bottom:28px; }
  .card__desc{ max-width:none; }
  .tags{ padding-top:20px; }
  .card__arrow{ right:20px; bottom:18px; }

  .sec-head{ margin-bottom:48px; }
  .h2{ font-size:clamp(26px,7.4vw,32px); }
  .sec-sub{ font-size:15.5px; margin-top:16px; }

  .pain{ grid-template-columns:1fr; }
  .pain__item{ padding:32px 24px 30px; min-height:0; }
  .pain__no{ font-size:46px; margin-bottom:18px; }
  .pain__text{ font-size:16px; max-width:none; }
  .pain__foot{ margin-top:48px; gap:22px; }
  .pain__foot .btn{ width:100%; }

  .diag{ grid-template-columns:1fr; gap:14px; }
  .diag__body{ padding:24px 20px 26px; }
  .diag__q{ font-size:17px; }
  .opts{ grid-template-columns:1fr; }
  .diag__result{ min-height:0; }
  .diag__cta{ margin-top:40px; }
  .diag__cta .btn{ width:100%; }

  /* 手机聊天界面 */
  .kb{ gap:40px; }
  .coreframe__bar{ height:40px; padding:0 14px; }
  .coreframe__body{ padding:22px 12px 12px; }
  .coreframe__foot{
    flex-direction:column; align-items:center; gap:8px;
    padding:12px 14px; font-size:10.5px; text-align:center;
  }
  .coreframe__foot .coreframe__core{ order:-1; }
  .demo-tabs{ width:100%; }
  .demo-tabs__t{ flex:1; padding:7px 8px; font-size:12px; }
  .kb__demo{
    max-width:330px; margin:0 auto; width:100%;
    border-radius:30px; padding:9px;
    border:1px solid var(--line-2);
    background:linear-gradient(180deg,rgba(255,255,255,.05),rgba(255,255,255,.012));
    box-shadow:0 40px 80px -50px rgba(91,140,255,.6);
  }
  .chat{
    border-radius:22px;
    border-color:rgba(255,255,255,.06);
    box-shadow:none;
    max-height:520px; overflow:hidden;
  }
  .chat__bar{ height:44px; padding:0 14px; }
  .chat__body{ padding:20px 16px 4px; }
  .bubble{ max-width:88%; font-size:14px; padding:12px 14px; }
  .chat__input{ margin:6px 16px 18px; }

  .arch{ gap:32px; }
  .layer{ padding:18px 20px; gap:16px; }
  .layer__en{ flex-basis:auto; font-size:10px; }
  .layer{ flex-direction:column; align-items:flex-start; gap:8px; }
  .layer__main h3{ font-size:16px; }
  .link{ margin-left:26px; height:26px; }
  .arch__note{ padding:24px 22px; }

  .cases{ gap:12px; }
  .case{ padding:26px 22px 28px; }

  .why{ grid-template-columns:1fr; }
  .why__item{ padding:30px 22px 32px; }
  .statement{ margin-top:56px; font-size:24px; }
  .statement br{ display:none; }

  .steps{ grid-template-columns:repeat(2,1fr); }
  .step{ padding:24px 18px 26px; }
  .step:nth-child(2n){ border-right:none; }
  .step:nth-child(n+3){ border-top:1px solid var(--line); }

  .cta{ padding:120px 0 90px; }
  .cta__ring{
    top:10px; width:420px; height:420px; margin-left:-210px;
    filter:blur(54px);
  }
  .chat::before{ border-top-left-radius:22px; }
  .chat::after{ border-bottom-right-radius:22px; }
  .cta__actions{ flex-direction:column; }
  .cta__actions .btn{ width:100%; }
  .cta__brand{ margin-top:64px; }

  .totop{ right:16px; bottom:16px; width:40px; height:40px; }
  .totop svg{ width:16px; height:16px; }
  .hero__cue{ margin-top:44px; height:48px; }
  .hero__cue i{ animation-name:cueDropSm; }
  @keyframes cueDropSm{
    0%  { top:0;    opacity:0; }
    22% { opacity:1; }
    100%{ top:48px; opacity:0; }
  }

  .footer{ padding:48px 0 28px; }
  .footer__nav{ grid-template-columns:repeat(2,1fr); gap:12px 20px; }
  .footer__bottom{ margin-top:40px; }
}

@media (max-width:380px){
  .footer__nav{ grid-template-columns:1fr 1fr; }
}

/* ---- 减少动效 ---- */
@media (prefers-reduced-motion:reduce){
  html{ scroll-behavior:auto; }
  *,*::before,*::after{
    animation-duration:.001ms !important;
    animation-iteration-count:1 !important;
    transition-duration:.001ms !important;
  }
  [data-reveal]{ opacity:1; transform:none; }
}