* {margin: 0;padding: 0;box-sizing: border-box;font-family: 'PingFang SC', 'Microsoft YaHei', sans-serif;}
.container {width: 100%;max-width: 1200px;margin: 0 auto;padding: 0 20px;}

.gradientBg {background: linear-gradient(to bottom,#ffffff 0%,#fcfdff 5%,#f8f9fd 10%,#f2f4fb 15%,#eaeef7 20%,#e3e7f3 25%,#dce1ee 30%,#d5d9e9 35%,#cfd4e5 40%,#c9cee1 45%,#c5cbdf 50%,#c9cee1 55%,#cfd4e5 60%,#d5d9e9 65%,#dce1ee 70%,#e3e7f3 75%,#eaeef7 80%,#f2f4fb 85%,#f8f9fd 90%,#fcfdff 95%,#ffffff 100%);/* padding: 0 280px; */box-sizing: border-box;}

body {color: #333;line-height: 1.6;overflow-x: hidden;}
a {text-decoration: none;color: #666;}
ul {list-style: none;}


/* 头部样式 */
header {background-color: #fff;}
.header-container {display: flex;justify-content: space-between;align-items: center;width: 100vw !important;margin: 0;max-width: unset;padding: 0 100px;}

.logo {display: flex;align-items: center;gap: 8px;}
.logo  img {transform: scale(1.1);/* position: relative; *//* top: 4px; */}
.logo-icon {width: 32px;height: 32px;background-color: #2e44e4;border-radius: 6px;display: flex;align-items: center;justify-content: center;color: white;font-weight: bold;}
.logo-text {font-weight: bold;color: #2838b8;}
.nav {display: flex;gap: 24px;}
.nav a:first-child {color: #2838b8;font-weight: 500;}
.header-right {display: flex;/* align-items: center; */flex-direction: column;/* gap: 16px; */height: 76px;justify-content: space-around;box-sizing: border-box;padding: 12px 0 10px 0;}
.contact {font-size: 14px;color: #666;display: flex;padding: 0 0 10px 0;}
.contact-btn {display: flex;justify-content: flex-end;align-items: center;}
.contact-btn .login {margin-right: 15px;}
.tel {width: 17px;height: 17px;margin-right: 10px;}
.phone {transform: scale(1.1);color: #31408f;font-size: 14px;font-weight: bold;line-height: normal;letter-spacing: 0em;position: relative;bottom: 1px;margin-left: 5px;}
.login {font-size: 14px;}
.register-btn {display: inline-block;background-color: #2838b8;color: white;border-radius: 50px;font-size: 14px;/* width: 76px;height: 35px; */width: 52px;height: 27px;line-height: 27px;font-size: 13px;text-align: center;transform: scale(1.1);}

/* 英雄区域样式 */
.hero {position: relative;padding: 80px;box-sizing: border-box;}
.left1 {position: absolute;left: 0px;bottom: 0;transform: translate(-50%, 50%);width: 321.62px;height: 339px;z-index: 1;}
.right1 {position: absolute;right: 25px;bottom: 0;transform: translate(50%, 5%);width: 223px;height: 223px;z-index: 1;}
.hero-content {display: flex;align-items: center;flex-wrap: wrap;position: relative;left: 34px;max-width: 820px!important;}
.hero-text {flex: 1;min-width: 300px;}
.hero-title {font-size: 32px;font-weight: bold;margin-bottom: 16px;color: #222;}
.hero-desc {color: #666;margin-bottom: 32px;max-width: 500px;}
.hero-btns {display: flex;gap: 16px;/* position: relative; */}

.hero-btns a {display: inline-block;width: 112px;height: 35px;line-height: 14px;font-size: 13px;text-align: center;/* font-weight: 700 !important; */}
.primary-btn {background-color: #31408F;color: white;padding: 10px 24px;border-radius: 30px;font-weight: 500;}
.outline-btn {color: white;padding: 10px 24px;border-radius: 30px;font-weight: 500;background-color: #31408F;}
.hero-image {flex: 1;min-width: 300px;display: flex;justify-content: center;}
.hero-image img {max-width: 100%;height: auto;}

/* 痛点区域样式 */
.pain-points {padding: 40px 0 80px 0;width: 100%;position: relative; overflow: hidden;}
.painBg {max-width: 1000px;}
.right2 {position: absolute;right: -20px;bottom: -150px;width: 223px;height: 223px;transform: scale(1.5);z-index: 1;}
.title-box {display: flex;flex-direction: column;justify-content: center;align-items: center;margin-bottom: 60px;}
.section-title {text-align: center;font-size: 24px;font-weight: bold;margin-bottom: 15px;/* position: relative;/ */}
.title-box img {width: 64px;height: 4px;}

.cards {display: flex;flex-wrap: wrap;gap: 24px;justify-content: center;}

.card {
  /* border-radius: 8px;
  padding: 24px;
  width: calc(25% - 24px);
  min-width: 240px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
  transition: box-shadow 0.3s; */
  left: 0px;
  top: 23.95px;
  width: 164px;
  height: 181px;
  border-radius: 12px;
  opacity: 1;

  /* 自动布局 */
  display: flex;
  flex-direction: column;
  padding: 40px 28px 24px 28px;
  gap: 20px;

  background: linear-gradient(336deg, rgba(49, 64, 143, 0.12) 0%, rgba(0, 0, 0, 0) 85%), #FFFFFF;

  box-shadow: 0px 4px 10px 0px rgba(0, 0, 0, 0.3);

/* display: flex;
flex-direction: column;
justify-content: center; */
position: relative;
}

.card:hover {box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);}
.card {display: flex;flex-direction: column;/* justify-content: center; */align-items: center;text-align: center;/* padding: 20px; */}
.card p {text-align: left;}

.card-icon {/* width: 32px;height: 32px; */width: 38px;height: 48px;margin-bottom: 16px;color: #2e44e4;position: absolute;top: -27px;left: 50%;transform: translateX(-50%);z-index: 1;}
.card-icon img {width: 100%;height: 100%;z-index: 999;mix-blend-mode: multiply;opacity: 1;}
.card-title {font-size: 18px;font-weight: bold;margin-bottom: 8px;text-align: left;}
.card-desc {font-size: 14px;color: #666;position: relative;bottom: 10px;}

/* 产品优势样式 */
.advantages {padding: 80px 0 20px 0;position: relative;/* box-sizing: border-box; */overflow: hidden;}
.container {position: unset;}

.left3 {left: -50px;bottom: 650px;transform: translate(-50%, -50%);position: absolute;width: 111px;height: 111px;z-index: 1;transform: scale(1.5);}
.right4 {position: absolute;right: 80px;bottom: 420px;width: 61px;height: 61px;z-index: 1;transform: scale(1.5);}
.right5 {position: absolute;right: -90px;bottom: 50px;width: 298px;height: 287px;z-index: 1;transform: scale(1.1);}


.advantage-item {display: flex;flex-wrap: wrap;align-items: center;margin-bottom: 80px;box-sizing: border-box;position: relative;left: 45px;padding: 0 150px;}
.advantage-item:nth-child(even) {flex-direction: row-reverse;}
.advantage-image {flex: 1;min-width: 300px;display: flex;justify-content: center;padding: 20px;}
.advantage-image img {max-width: 100%;height: auto;}
.advantage-text {flex: 1;min-width: 300px;padding: 20px;}
.advantage-title {font-size: 20px;font-weight: bold;margin-bottom: 16px;}
.advantage-desc {color: #666;width: 350px;}

/* 页脚样式 */
footer {padding: 40px 0;position: relative;}
.footer-content {display: flex;flex-wrap: wrap;/* gap: 40px; *//* justify-content: center; */justify-content: space-around;box-sizing: border-box;padding: 0 120px;position: relative;left: 30px;}
.footer-qr {min-width: 120px;display: flex;flex-direction: column;align-items: center;text-align: center;}
.footer-qr img {width: 120px;height: 120px;margin-bottom: 8px;}
.footer-qr p {font-size: 14px;color: #666;/* font-weight: 700; */}
.footer-links {/* flex: 1; *//* min-width: 200px; */}
.footer-title {font-weight: bold;margin-bottom: 16px;}
.footer-menu {display: flex;flex-wrap: wrap;gap: 40px;}
.footer-menu-col {min-width: 120px;}
.footer-menu-col ul li {margin-bottom: 8px;}
.footer-menu-col ul li a {font-size: 14px;color: #666;}
.footer-menu-col ul li a:hover {color: #2e44e4;}
.footer-menu-col.menu-col2{position: relative;left:30px;}
.footer-bottom {margin-top: 32px;padding-top: 24px;border-top: 1px solid #eaeaea;text-align: center;}
.footer-logo {display: flex;align-items: center;justify-content: center;gap: 8px;margin-bottom: 8px;}
.footer-logo-icon {width: 24px;height: 24px;background-color: #2e44e4;border-radius: 4px;display: flex;align-items: center;justify-content: center;color: white;font-weight: bold;font-size: 12px;}
.footer-logo-text {font-weight: bold;color: #2838b8;}
.copyright {font-size: 12px;color: #999;}

/* 侧边栏样式 */
.side-menu {position: fixed;right: 0;top: 50%;transform: translateY(-50%);background-color: #2838b8;border-radius: 4px 0 0 4px;/* overflow: hidden; */z-index: 100;}
.side-menu a {display: block;padding: 12px;color: white;transition: background-color 0.3s;}
.side-menu a:hover {background-color: #3a56f5;}

/* .side-menu svg {
  width: 20px;
  height: 20px;
} */
/* 默认隐藏二维码 */
.qrcode-popup {display: none;position: absolute;top: 0;right: 100%; /* 放在图标的左侧 */transform: translateX(0px); /* 初始位置稍微偏移 */transition: transform 0.8s ease-out, opacity 0.8s ease-out;opacity: 0;background-color: #fff;}
.qrcode-popup img{/* margin-bottom:10px; */}
.qrcode-popup p{color: #333;text-align: center;white-space: nowrap;}
.qrcode-trigger {position: relative;}

/* 当鼠标悬停时显示二维码并应用动画 */
.qrcode-trigger:hover .qrcode-popup {display: block;/* transform: translateX(0); */opacity: 1;}


/* 响应式 */
@media(max-width:1200px){
.hero{padding: 80px 5%;}
.advantage-item{padding: 0 5%;}
.footer-content{padding: 0 5%;}
}

@media(max-width:1024px){
.container{padding: 0 2%;}
.nav{ display: none;}
.phone{transform: scale(1);}
.logo img{transform: scale(1);}
.hero{padding: 20px 2%; overflow: hidden;}

.header-container{padding: 0 2%;}
.right1,
.right2,
.right5{right: 0px;}
.hero-title{font-size: 28px;}
.hero-text{ margin-bottom: 20px;}
.card{margin-bottom: 24px;padding: 40px 20px 24px 20px;}
.title-box{margin-bottom: 30px;}
.advantage-item{padding: 0 2%;margin-bottom: 30px;left: 0px;}
.advantage-desc{ width: 100%;}

.pain-points{ overflow: hidden;}
.advantages{overflow: hidden;}

footer{padding: 40px 0 20px 0;}
.footer-content{padding: 0 2%;left: 0px;}
.footer-menu-col{ margin-bottom: 20px;}
.footer-menu-col.menu-col2{position: relative;left:0px;}
}

@media(max-width:768px){
.hero-title{font-size: 26px;}
}

@media(max-width:640px){
.hero-title{font-size: 24px;}
}