/* ===================== 设计变量（温馨 + 科技感） ===================== */
:root{
  --ink:#2c2a3a;            /* 主文字 */
  --sub:#6f6a80;            /* 次要文字 */
  --line:rgba(120,110,160,.14);
  --peach:#ff9a76;          /* 温暖珊瑚 */
  --peach-soft:#ffe9e0;
  --tech:#6c8cff;           /* 科技蓝 */
  --tech-soft:#e7ecff;
  --indigo:#8a7bff;         /* 科技靛 */
  --radius:22px;
  --maxw:1080px;
  --shadow:0 10px 30px rgba(120,110,160,.12);
  --shadow-lg:0 18px 48px rgba(120,110,160,.20);
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;font-family:"PingFang SC","Microsoft YaHei","Hiragino Sans GB",system-ui,sans-serif;
  color:var(--ink);line-height:1.7;
  background:linear-gradient(160deg,#fff6f0 0%,#f4f0ff 45%,#eef4ff 100%);
  background-attachment:fixed;min-height:100vh;
  -webkit-font-smoothing:antialiased;
}
a{color:inherit;text-decoration:none;}

/* ===================== 背景装饰 ===================== */
.bg-decor{position:fixed;inset:0;z-index:-1;overflow:hidden;}
.orb{position:absolute;border-radius:50%;filter:blur(60px);opacity:.5;}
.orb-peach{width:380px;height:380px;background:radial-gradient(circle,#ffb38a,#ff7e5f);top:-90px;left:-70px;}
.orb-blue{width:420px;height:420px;background:radial-gradient(circle,#9ab6ff,#6c8cff);bottom:-130px;right:-90px;opacity:.4;}
.grid{
  position:absolute;inset:0;
  background-image:
    linear-gradient(rgba(120,110,160,.06) 1px,transparent 1px),
    linear-gradient(90deg,rgba(120,110,160,.06) 1px,transparent 1px);
  background-size:42px 42px;
  -webkit-mask-image:radial-gradient(circle at 50% 30%,#000,transparent 78%);
  mask-image:radial-gradient(circle at 50% 30%,#000,transparent 78%);
}

/* ===================== 顶部导航 ===================== */
.nav{
  position:sticky;top:0;z-index:50;
  background:rgba(255,255,255,.6);
  backdrop-filter:blur(14px) saturate(160%);
  border-bottom:1px solid var(--line);
}
.nav-inner{
  max-width:var(--maxw);margin:0 auto;padding:14px 24px;
  display:flex;align-items:center;justify-content:space-between;
}
.brand{display:flex;align-items:center;gap:10px;font-weight:800;font-size:20px;letter-spacing:1px;}
.brand-logo{height:34px;width:34px;}
.nav-menu{display:flex;align-items:center;gap:8px;}
.nav-menu a{padding:8px 16px;border-radius:999px;font-size:15px;font-weight:600;color:var(--sub);transition:.2s;}
.nav-menu a:hover{color:var(--tech);background:var(--tech-soft);}
.nav-menu a.active{color:var(--tech);}
.nav-menu a.login{
  color:#fff;background:linear-gradient(135deg,var(--peach),#ff7e5f);
  box-shadow:0 6px 16px rgba(255,126,95,.35);
}
.nav-menu a.login:hover{filter:brightness(1.05);transform:translateY(-1px);}

/* ===================== 欢迎区 ===================== */
.hero{text-align:center;padding:84px 24px 36px;}
.hero-title{
  font-size:54px;margin:0 0 14px;letter-spacing:2px;
  background:linear-gradient(120deg,#ff7e5f,#8a7bff);
  -webkit-background-clip:text;background-clip:text;color:transparent;
}
.hero-sub{font-size:18px;color:var(--sub);margin:0 auto;max-width:560px;}

/* ===================== 卡片区 ===================== */
.section{max-width:var(--maxw);margin:0 auto;padding:30px 24px 70px;}
.card-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:24px;}
.card{
  position:relative;background:rgba(255,255,255,.72);
  backdrop-filter:blur(10px);
  border:1px solid var(--line);border-radius:var(--radius);
  padding:32px 28px;box-shadow:var(--shadow);transition:.25s;display:block;
}
.card:hover{transform:translateY(-8px);box-shadow:var(--shadow-lg);border-color:rgba(138,123,255,.45);}
.card-icon{font-size:40px;margin-bottom:14px;display:inline-block;filter:drop-shadow(0 6px 10px rgba(255,126,95,.25));}
.card h3{margin:0 0 10px;font-size:20px;}
.card p{margin:0 0 18px;color:var(--sub);font-size:14.5px;}
.card-go{display:inline-block;font-weight:700;color:var(--tech);font-size:14px;transition:.2s;}
.card:hover .card-go{color:var(--peach);}

/* ===================== 页脚 ===================== */
.footer{
  max-width:var(--maxw);margin:0 auto;padding:30px 24px 40px;
  text-align:center;color:var(--sub);font-size:13px;border-top:1px solid var(--line);
}
.footer p{margin:6px 0;}
.footer .beian a{color:var(--tech);font-weight:600;}

/* ===================== 滚动入场动画 ===================== */
.reveal{opacity:0;transform:translateY(22px);transition:opacity .6s ease,transform .6s ease;}
.reveal.show{opacity:1;transform:none;}

/* ===================== 响应式 ===================== */
@media (max-width:600px){
  .hero-title{font-size:40px;}
  .hero{padding:56px 20px 24px;}
  .section{padding:24px 20px 56px;}
}