    body {
      font-family: 'Inter', sans-serif;
      scroll-behavior: smooth;
    }
    

    /* Gradient Backgrounds */
    .hero-bg {
      background: radial-gradient(circle at top center, #1e3a8a 0%, #0B1120 80%);
    }

    .ai-bg {
      background: #0f172a;
      position: relative;
      overflow: hidden;
    }

    /* Neural Network Animation Effect */
    .ai-bg::before {
      content: '';
      position: absolute;
      width: 100%;
      height: 100%;
      background-image:
        radial-gradient(circle at 20% 30%, rgba(59, 130, 246, 0.1) 0%, transparent 20%),
        radial-gradient(circle at 80% 70%, rgba(99, 102, 241, 0.1) 0%, transparent 20%);
      animation: pulse-glow 8s infinite alternate;
    }

    @keyframes pulse-glow {
      0% {
        opacity: 0.5;
      }

      100% {
        opacity: 1;
      }
    }

    /* Animations */
    .fade-up {
      opacity: 0;
      transform: translateY(30px);
      transition: opacity 0.8s cubic-bezier(0.16, 1, 0.3, 1), transform 0.8s cubic-bezier(0.16, 1, 0.3, 1);
    }

    .fade-up.visible {
      opacity: 1;
      transform: translateY(0);
    }

    .glass-card {
      background: rgba(255, 255, 255, 0.03);
      backdrop-filter: blur(16px);
      border: 1px solid rgba(255, 255, 255, 0.08);
      transition: all 0.4s ease;
    }

    .glass-card:hover {
      background: rgba(255, 255, 255, 0.08);
      border-color: rgba(59, 130, 246, 0.4);
      transform: translateY(-5px);
      box-shadow: 0 20px 40px -10px rgba(0, 0, 0, 0.5);
    }

    .pp-card:hover {
      border-color: rgba(59, 130, 246, 0.4);
      transform: translateY(-5px);
      background-color: rgba(59, 130, 246, 0.1);
      /* box-shadow: 0 20px 40px -10px rgba(0, 0, 0, 0.5); */
    }
    .case-card:hover {
      /* border-color: rgba(59, 130, 246, 0.4); */
      transform: translateY(-5px);
      /* background-color: rgba(59, 130, 246, 0.1); */
      /* box-shadow: 0 20px 40px -10px rgba(0, 0, 0, 0.5); */
    }

    /* 3D Perspective for Hero Image */
    .perspective-container {
      perspective: 2000px;
    }

    .hero-dashboard {
      transform: rotateX(10deg) rotateY(0deg) scale(0.95);
      transition: transform 0.6s ease-out;
      /* box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.5); */
    }

    .hero-dashboard:hover {
      transform: rotateX(2deg) scale(1);
    }

    /* Navigation Scroll Effect */
    

    .case-scroll{
      padding-top: 10px;
    }
    /* Horizontal Scroll for Cases */
    .case-scroll::-webkit-scrollbar {
      height: 6px;
    }

    .case-scroll::-webkit-scrollbar-track {
      background: #f1f5f9;
    }

    .case-scroll::-webkit-scrollbar-thumb {
      background: #cbd5e1;
      border-radius: 10px;
    }

    .name1 {
      color: #FFFFFF;
      /* font-family: Roboto; */
      font-weight: black;
      font-size: 72px;
      line-height: normal;
      letter-spacing: 0px;
      text-align: left;
    }

    .name2 {
      /* font-family: Roboto; */
      font-weight: black;
      font-size: 72px;
      line-height: normal;
      letter-spacing: 0px;
      text-align: center;
    }

    .name3 {
      color: #FFFFFFAD;
      /* font-family: Roboto; */
      font-weight: regular;
      font-size: 24px;
      line-height: normal;
      letter-spacing: 0px;
      text-align: center;
    }

    .ysxy {
      color: #94A3B8;
      text-align: center;
      font-family: Inter;
      font-size: 16px;
      font-style: normal;
      font-weight: 400;
      line-height: 26px;
      /* 162.5% */
      text-decoration-line: underline;
      text-decoration-style: solid;
      text-decoration-skip-ink: none;
      text-decoration-thickness: auto;
      text-underline-offset: auto;
      /* text-underline-position: from-font; */
      opacity: 0.9;
    }


    

.header {
  position: fixed;
  left: 0;
  right: 0;
  top: 0;
  z-index: 50;
  height: 80px;
  /* 约等于 4.166rem */
  padding-top: 20px;
  box-sizing: border-box;
  background: transparent;
  /* 初始透明，滚动后变深蓝见下方 JS */
}

/* 滚动后变深蓝背景（你原来 .layout.active .header 的效果） */
.header.scrolled {
  background: #012D6F !important;
}

/* 导航项间距 */
.anaver .ali {
  position: relative;
  margin-left: 2.916666666666667rem;
  /* 约 35px */
}

/* 下划线动画（你原来的青色下划线） */
.anaver .ali::before{
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: -10px;
  height: 2px;
  width: 0;
  margin: 0 auto;
  background: #59E1F7;
  transition: width 0.3s ease;
  z-index: 1;
}
.anaver .ali.on:before{
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: -10px;
  width: 26px;
  height: 2px;
  margin: 0 auto;
  background: #59E1F7;
  z-index: 1;
}
/* hover 和当前页高亮 */
.anaver .ali:hover::before,
.anaver .ali.active::before {
  width: 28px;
  /* 你原来 0.7291666666666667rem ≈ 28px */
}

/* hover 时文字加粗（你原来的效果） */
.anaver .ali a:hover,
.anaver .ali.active a {
  font-weight: bold !important;
}




.nav-scrolled {
  background-color: #012D6F;
  /* backdrop-filter: blur(12px); */
  box-shadow: 0 4px 20px -1px rgba(0, 0, 0, 0.05);
  padding-top: 1rem !important;
  padding-bottom: 1rem !important;
}

.nav-link {
  color: #FFFFFF;
  font-family: Roboto;
  font-weight: black;
  /* font-size: 72px; */
  line-height: normal;
  letter-spacing: 0px;
  text-align: left;
}

.nav-scrolled .nav-link {
  /* color: #1e293b; */
}

.nav-scrolled .logo-text {
  color: #1e3a8a;
}