body{background: linear-gradient(135deg, #f0f7ff 0%, #ffffff 100%);}
#indexbgbox{width:100%;height:500px;position:relative;overflow:hidden; text-align: center;background-image:url(/images/aibanner1.jpg);background-size:cover;background-position:center;}
.bg-video{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:cover;object-position:center;background-color:transparent}
#indexbgbox h1{font-size:80px;color:white;position: relative;text-shadow:0 4px 20px rgba(0,102,255,0.1);margin:0 0 60px 0;letter-spacing:5px;background:linear-gradient(to bottom,#ffffff,#e6f0ff);-webkit-background-clip:text;-webkit-text-fill-color:transparent;filter:drop-shadow(0 2px 4px rgba(0,0,0,0.1))}
#indexbgbox p{ display:block;color:#fff;font-size:16px; z-index: 9999;position: relative; line-height: 40px;}
.hero-nav{display:flex;gap:20px; width: 1000px; margin: 60px auto 0 auto; justify-content: space-between; background:rgba(255,255,255,0.15);padding:10px 80px;border-radius:50px;backdrop-filter:blur(10px)}
.hero-nav-item{background:linear-gradient(97.79deg, #dfebfe 9.39%, #f2f6ff 70.46%, #eeebff 91.53%);padding:12px 30px;min-width:200px;border-radius:10px;cursor:pointer;transition:0.3s;font-weight:500;display:flex;flex-direction:column;align-items:center;gap:5px}
.hero-nav-item:hover,.hero-nav-item.active{background:linear-gradient(to bottom,#ffffff,#e6f0ff);color:var(--primary-blue);box-shadow:0 4px 15px rgba(0,0,0,0.2)}

.hero-nav i{font-size:32px;margin-bottom:5px; background: linear-gradient(96deg, #005eff 3.57%, #4ec0ff 40%, #00cec9 107.23%); background-clip: text; -webkit-background-clip: text; -webkit-text-fill-color: transparent;}
.hero-nav-item:hover i{ transform: scale(1.5);  }
/*特色栏目、课程中心*/
#tslm{ background: url(/images/aibg3.png) center no-repeat; background-size: cover; padding: 40px 0; display: flex; }
.grid-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:30px;}
.card{background:white;border-radius:12px;overflow:hidden;box-shadow:var(--card-shadow);transition:all 0.3s ease;cursor:pointer;border:1px solid rgba(0,0,0,0.02)}
.card:hover{transform:translateY(-8px);box-shadow:var(--hover-shadow)}
.card-img{width:100%;height:180px;background:#eee;position:relative}
.card-img img{width:100%;height:100%;object-fit:cover}
.card-tag{position:absolute;top:10px;left:10px;background:rgba(0,0,0,0.6);color:white;padding:4px 10px;border-radius:4px;font-size:12px}
.card-body{padding:20px}
.card-title{font-size:18px;font-weight:bold;margin-bottom:10px;color:var(--text-main)}
.card-meta{display:flex;justify-content:space-between;font-size:12px;color:#999;margin-top:15px}
.colorh1box{justify-content: center; display: flex;}
.colorh1{display:flex;flex-direction:row;align-items:center;padding:0;z-index:0; }
.colorh1::before{content:"";display:inline-block;width:50px;height:36px;background:url(/images/aibg9.png) no-repeat;background-size:contain;margin:0 40px}
.colorh1::after{content:"";display:inline-block;width:50px;height:36px;background:url(/images/aibg9.png) no-repeat;background-size:contain;margin:0 30px}
h1{ color: #222; font-weight: 600; font-size:36px; text-align: center; margin:40px 0;}
.colorh1 h1::after{content:'';display:block;width:60px;height:4px;background:linear-gradient(97.79deg, #9ec3ff 9.39%, #b4fffd 50.46%, #a5f7ff 91.53%);margin:10px auto 0;border-radius:2px}
#indexbox{ position: relative; height:550px;width:100%;}
/*教师研修*/
#jsyx{background: url(/images/aibg5.png) center no-repeat; background-size: cover; padding: 40px 0; display: flex; }
/*ai实训*/
#airealtrain{background: url(/images/aibg3.png) center no-repeat; background-size: cover; padding: 40px 0; display: flex; }
/*资质信息*/
#index4{ margin: 0; padding-bottom: 80px;}
#index4 h2{ color: #222; font-weight: 600; font-size:36px; text-align: center; padding:50px 0;}
#index4 h2::after{content:'';display:block;width:60px;height:4px;background:#2563eb;margin:10px auto 0;border-radius:2px}
.zzCard{position:relative;z-index:2;transition:all 0.3s ease;background-color:#fff; box-sizing: border-box;border-radius:10px;box-shadow:0 0 14px 0 rgba(78,112,163,.2);margin-bottom:48px;overflow:hidden;padding:25px 24px;padding-bottom:0;width:386px;height:235px}
.zzCard:hover{transform:translateY(-8px);}
#index4 .tit{display:flex;flex-direction:row;align-items:center;margin-bottom:32px;box-sizing: border-box;}
#index4 .icon{display:inline-block;width:34px;height:34px;margin-right:16px}
#index4 .bg{width:142px;height:103px;position:absolute;right:0;bottom:0}
#index4 p{color:#666;font-size:14px;line-height:24px;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;word-wrap:break-word;-webkit-hyphens:auto;hyphens:auto}
#index4 .btn{width:112px;height:36px;position:absolute;left:24px;bottom:30px;background:linear-gradient(85deg, #1366EC 0%, #856EFA 69%);border-radius:19px;text-align:center;line-height:38px;color:#fff;font-size:14px;cursor:pointer}
#index4 .btn a{ color: #fff;}
#index5{ background: url(/images/index5.png) center top no-repeat; background-size: 100%; margin-top: -60px; text-align: center;}
#index5 h2{display:block;text-align:center;color:#000;font-size:40px;font-weight:700;margin-bottom:18px; padding-top:60px;}
#index5 p{display:block;text-align:center;color:#666;font-size:18px;font-weight:400;margin-bottom:15px}

a.visitmore{padding:10px 30px; display: inline-block; border:1px solid #ddd; background:white; border-radius:20px; cursor:pointer; color:#666;}
a.visitmore:hover{ background: linear-gradient(85deg, #1366EC 0%, #856EFA 69%);color: #fff;}