*{
            margin:0;
            padding:0;
            box-sizing:border-box;
            font-family:'Noto Sans SC',sans-serif
        }
        :root{
            --primary:#F4A5C0;
            --primary-light:#FADADD;
            --primary-dark:#E486A7;
            --gold:#D4B98A;
            --gold-light:#E8D5B0;
            --bg:#121212;
            --card-bg:#1A1A1A;
            --dark:#fff;
            --gray:#ccc;
            --gray-light:#888;
            --white:#fff;
            --border:rgba(255,255,255,0.08);
            --shadow:0 8px 30px rgba(0,0,0,0.4);
            --shadow-light:0 4px 15px rgba(0,0,0,0.2);
            --transition:all 0.45s cubic-bezier(0.16,1,0.3,1);
        }
        body{
            background:var(--bg);
            color:var(--dark);
            overflow-x:hidden;
            line-height:1.85;
            letter-spacing:0.4px
        }
        a{text-decoration:none}
        ul{list-style:none}
        img{max-width:100%;vertical-align:middle}
        .container{
            width:92%;
            max-width:1360px;
            margin:0 auto
        }

        /* 渐变文字 */
        .gradient-text {
            background: linear-gradient(135deg, #F4A5C0 0%, #D4B98A 50%, #F4A5C0 100%);
            -webkit-background-clip: text;
            background-clip: text;
            color: transparent;
            font-weight: 900;
        }
        .gradient-pink {
            background: linear-gradient(135deg, #F4A5C0, #FADADD, #E486A7);
            -webkit-background-clip: text;
            background-clip: text;
            color: transparent;
            font-weight: 700;
        }
        .gradient-gold {
            background: linear-gradient(135deg, #D4B98A, #E8D5B0, #B49B6F);
            -webkit-background-clip: text;
            background-clip: text;
            color: transparent;
            font-weight: 700;
        }

        /* 导航 */
        .navbar{
            position:fixed;
            top:0;
            left:0;
            width:100%;
            padding:28px 0;
            background:rgba(18,18,18,0.88);
            backdrop-filter:blur(20px);
            z-index:9999;
            transition:var(--transition);
            border-bottom:1px solid rgba(255,255,255,0.05)
        }
        .navbar.fixed{
            padding:18px 0;
            background:rgba(18,18,18,0.98);
            box-shadow:0 5px 15px rgba(0,0,0,0.3)
        }
        .nav-wrap{
            display:flex;
            justify-content:space-between;
            align-items:center
        }
        .logo{
            font-size:30px;
            font-weight:900;
            background: linear-gradient(135deg, #F4A5C0, #D4B98A);
            -webkit-background-clip: text;
            background-clip: text;
            color: transparent;
            letter-spacing:1px
        }
        .nav-menu{
            display:flex;
            gap:46px
        }
        .nav-menu a{
            color:var(--dark);
            font-size:15px;
            font-weight:500;
            transition:var(--transition);
            position:relative
        }
        .nav-menu li{padding:0 20px}
        .nav-menu a::after{
            content:'';
            position:absolute;
            left:0;bottom:-6px;
            width:0;
            height:2px;
            background:var(--primary);
            transition:var(--transition)
        }
        .nav-menu a:hover{
            color:var(--primary);
        }
        .nav-menu a:hover::after{width:100%}
        .mobile-btn{
            display:none;
            color:var(--dark);
            font-size:26px;
            cursor:pointer
        }

        /* Banner */
        .banner{
            width:100%;
            height:100vh;
            min-height:820px;
            background:linear-gradient(rgba(18,18,18,0.85),rgba(18,18,18,0.95)),url('/pp.jpg');
            background-size:cover;
            background-position:center;
            background-attachment:fixed;
            display:flex;
            align-items:center;
            position:relative
        }
        .banner-content{
            max-width:880px;
            position:relative;
            z-index:2
        }
        .banner-tag{
            display:inline-block;
            padding:12px 32px;
            background:rgba(244,165,192,0.12);
            border:1px solid rgba(244,165,192,0.25);
            color: var(--primary-light);
            border-radius:50px;
            font-size:14px;
            margin-bottom:38px
        }
        .banner h1{
            font-size:74px;
            line-height:1.1;
            margin-bottom:34px;
            font-weight:900;
            color:var(--white)
        }
        .banner p{
            font-size:20px;
            color:var(--gray);
            margin-bottom:52px;
            max-width:700px;
            text-align: justify;
        }
        .btn{
            display:inline-block;
            padding:20px 38px;
            background:linear-gradient(135deg, #F4A5C0, #E486A7);
            color:#fff;
            font-size:16px;
            font-weight:700;
            border-radius:50px;
            transition:var(--transition);
            border:none;
            cursor:pointer;
            box-shadow:0 8px 20px rgba(244,165,192,0.25)
        }
        .btn:hover{
            transform:translateY(-6px);
            box-shadow:0 12px 28px rgba(244,165,192,0.35)
        }
        .btn-line{
            background:transparent !important;
            border:1px solid var(--primary);
            color: var(--primary-light) !important;
            margin-left:20px
        }

        /* 模块标题 */
        .section{padding:130px 0}
        .section-title{
            text-align:center;
            margin-bottom:75px
        }
        .section-title h2{
            font-size:30px;
            font-weight:700;
            margin-bottom:20px;
            color:var(--white)
        }
        .section-title p{
            color:var(--gray);
            max-width:720px;
            margin:0 auto;
            font-size:17px
        }

        /* 平台优势 */
        .advantage{background:var(--bg)}
        .adv-grid{
            display:grid;
            grid-template-columns:repeat(4,1fr);
            gap:38px
        }
        .adv-card{
            padding:50px 34px;
            background:var(--card-bg);
            border-radius:22px;
            text-align:center;
            transition:var(--transition);
            border:1px solid var(--border);
            box-shadow:var(--shadow-light)
        }
        .adv-card:hover{
            transform:translateY(-10px);
            border-color: var(--primary);
            box-shadow:var(--shadow)
        }
        .adv-card i{
            font-size:48px;
            background: linear-gradient(135deg, #F4A5C0, #D4B98A);
            -webkit-background-clip: text;
            background-clip: text;
            color: transparent;
            margin-bottom:28px
        }
        .adv-card h3{
            font-size:22px;
            margin-bottom:16px;
            font-weight:600;
            color:var(--white)
        }
        .adv-card p{
            color:var(--gray);
            font-size:15px;
            line-height:1.8
        }

        /* 为什么选择我们 */
        .why{background:var(--card-bg)}
        .why-grid{
            display:grid;
            grid-template-columns:repeat(3,1fr);
            gap:30px
        }
        .why-item{
            padding:40px 30px;
            background:var(--bg);
            border-radius:18px;
            text-align:center;
            border:1px solid var(--border)
        }
        .why-item i{
            font-size:40px;
            color:var(--primary);
            margin-bottom:20px
        }
        .why-item h3{
            font-size:22px;
            margin-bottom:15px;
            color:var(--white)
        }
        .why-item p{color:var(--gray)}

        /* 学员见证 */
        .testi{background:var(--bg)}
        .testi-grid{
            display:grid;
            grid-template-columns:repeat(3,1fr);
            gap:30px
        }
        .testi-card{
            padding:35px;
            background:var(--card-bg);
            border-radius:18px;
            border:1px solid var(--border)
        }
        .testi-text{
            color:var(--gray);
            margin-bottom:25px;
            font-style:italic
        }
        .testi-user{
            display:flex;
            align-items:center;
            gap:15px
        }
        .testi-img{
            width:50px;height:50px;
            border-radius:50%;
            object-fit:cover
        }
        .testi-info h4{color:var(--white)}
        .testi-info p{color:var(--primary)}

        /* 学员作品 */
        .student{background:var(--card-bg)}
        .student-grid{
            display:grid;
            grid-template-columns:repeat(4,1fr);
            gap:25px
        }
        .student-item{
            border-radius:16px;
            overflow:hidden;
            height:260px
        }
        .student-item img{
            width:100%;height:100%;
            object-fit:cover;
            transition:var(--transition)
        }
        .student-item:hover img{transform:scale(1.1)}

        /* 学习保障 */
        .safe{background:var(--bg)}
        .safe-wrap{
            max-width:900px;
            margin:0 auto;
            text-align:center
        }
        .safe-list{
            display:grid;
            grid-template-columns:repeat(2,1fr);
            gap:25px;
            margin-top:50px
        }
        .safe-list li{
            background:var(--card-bg);
            padding:25px;
            border-radius:14px;
            color:var(--gray);
            font-size:16px;
            border:1px solid var(--border)
        }
        .safe-list li i{
            color:var(--primary);
            margin-right:10px
        }

        /* 入驻培训学校 */
        .school{background:var(--card-bg)}
        .school-grid{
            display:grid;
            grid-template-columns:repeat(3,1fr);
            gap:40px
        }
        .school-card{
            background:var(--bg);
            border-radius:22px;
            overflow:hidden;
            transition:var(--transition);
            border:1px solid var(--border);
            box-shadow:var(--shadow-light)
        }
        .school-card:hover{
            transform:translateY(-10px);
            border-color: var(--primary);
            box-shadow:var(--shadow)
        }
        .school-img{
            width:100%;
            height:260px;
            object-fit:cover;
            transition:var(--transition)
        }
        .school-card:hover .school-img{
            transform:scale(1.05)
        }
        .school-info{padding:34px}
        .school-tag{
            display:inline-block;
            padding:6px 12px;
            background:rgba(244,165,192,0.12);
            color: var(--primary-light);
            font-size:12px;
            border-radius:6px;
            margin-bottom:14px
        }
        .school-info h3{
            font-size:22px;
            margin-bottom:12px;
            font-weight:600;
            color:var(--white)
        }
        .school-info p{
            color:var(--gray);
            font-size:15px;
            margin-bottom:24px
        }
        .school-bottom{
            display:flex;
            justify-content:space-between;
            align-items:center
        }
        .school-score{
            color: var(--gold);
            font-size:15px;
            font-weight:600
        }
        .school-btn{
            padding:10px 22px;
            background:linear-gradient(135deg, #F4A5C0, #E486A7);
            color:#fff;
            border:none;
            border-radius:8px;
            font-size:14px;
            font-weight:600;
            cursor:pointer;
            transition:var(--transition)
        }
        .school-btn:hover{background:var(--primary-dark)}

        /* 培训课程 */
        .course{background:var(--bg)}
        .course-grid{
            display:grid;
            grid-template-columns:repeat(4,1fr);
            gap:34px
        }
        .course-card{
            background:var(--card-bg);
            border-radius:22px;
            overflow:hidden;
            transition:var(--transition);
            border:1px solid var(--border);
            box-shadow:var(--shadow-light)
        }
        .course-card:hover{
            transform:translateY(-8px);
            border-color: var(--primary);
            box-shadow:var(--shadow)
        }
        .course-img{
            width:100%;
            height:220px;
            object-fit:cover;
            transition:var(--transition)
        }
        .course-card:hover .course-img{
            transform:scale(1.06)
        }
        .course-info{padding:28px}
        .course-tag{
            display:inline-block;
            padding:5px 10px;
            background:rgba(244,165,192,0.12);
            color: var(--primary-light);
            font-size:12px;
            border-radius:6px;
            margin-bottom:12px
        }
        .course-info h3{
            font-size:19px;
            margin-bottom:12px;
            font-weight:600;
            color:var(--white)
        }
        .course-price{
            font-size:24px;
            font-weight:700;
            background: linear-gradient(135deg, #F4A5C0, #D4B98A);
            -webkit-background-clip: text;
            background-clip: text;
            color: transparent;
            margin-bottom:20px
        }
        .buy-btn{
            width:100%;
            padding:13px;
            background:linear-gradient(135deg, #F4A5C0, #E486A7);
            color:#fff;
            border:none;
            border-radius:10px;
            font-weight:700;
            cursor:pointer;
            transition:var(--transition)
        }
        .buy-btn:hover{background:var(--primary-dark)}

        /* 限时优惠 */
        .sale{
            background:linear-gradient(135deg,#1a1a1a,#121212);
            text-align:center;
            border-top:1px solid var(--border);
            border-bottom:1px solid var(--border);
        }
        .sale h2{
            font-size:42px;
            margin-bottom:20px
        }
        .sale p{
            font-size:18px;
            color:var(--gray);
            margin-bottom:40px
        }

        /* FAQ */
        .faq{background:var(--card-bg)}
        .faq-list{
            max-width:900px;
            margin:0 auto
        }
        .faq-item{
            padding:25px 30px;
            background:var(--bg);
            margin-bottom:15px;
            border-radius:12px;
            border:1px solid var(--border)
        }
        .faq-item h3{
            color:var(--white);
            font-size:18px;
            margin-bottom:10px
        }
        .faq-item p{color:var(--gray)}

        /* 学校入驻 */
        .join{
            background:linear-gradient(rgba(18,18,18,0.96),rgba(18,18,18,0.99)),url('https://picsum.photos/id/306/1920/800');
            background-size:cover;
            background-position:center;
            text-align:center
        }
        .join-form{
            max-width:720px;
            margin:0 auto;
            display:flex;
            flex-direction:column;
            gap:22px
        }
        .join-form input,
        .join-form textarea{
            padding:20px;
            border-radius:14px;
            border:1px solid rgba(255,255,255,0.1);
            background:#222;
            color:var(--white);
            outline:none;
            font-size:16px;
            transition:var(--transition)
        }
        .join-form input:focus,
        .join-form textarea:focus{
            border-color: var(--primary);
            background:#242424;
        }
        .join-form input::placeholder,
        .join-form textarea::placeholder{
            color:var(--gray-light)
        }

        /* 底部 */
        .footer{
            background:var(--card-bg);
            padding:80px 0 30px;
            border-top:1px solid rgba(255,255,255,0.05)
        }
        .footer-grid{
            display:grid;
            grid-template-columns:repeat(4,1fr);
            gap:46px;
            margin-bottom:50px
        }
        .footer-col h3{
            background: linear-gradient(135deg, #F4A5C0, #D4B98A);
            -webkit-background-clip: text;
            background-clip: text;
            color: transparent;
            font-size:20px;
            margin-bottom:28px;
            font-weight:600
        }
        .footer-col a,.footer-col p{
            color:var(--gray);
            line-height:2.4;
            font-size:15px;
            transition:var(--transition)
        }
        .footer-col a:hover{
            color:var(--primary);
            padding-left:6px
        }
        .copyright{
            text-align:center;
            padding-top:34px;
            border-top:1px solid rgba(255,255,255,0.05);
            color:var(--gray-light);
            margin-top:50px;
            font-size:14px
        }

        /* 自适应 */
        @media(max-width:1024px){
            .banner h1{font-size:54px}
            .adv-grid{grid-template-columns:repeat(2,1fr)}
            .school-grid{grid-template-columns:repeat(2,1fr)}
            .course-grid{grid-template-columns:repeat(2,1fr)}
            .why-grid,.testi-grid{grid-template-columns:repeat(2,1fr)}
            .student-grid{grid-template-columns:repeat(2,1fr)}
        }
        @media(max-width:768px){
            .nav-menu{
                position:fixed;
                left:-100%;top:80px;
                flex-direction:column;
                background:#1A1A1A;
                width:100%;
                padding:40px 0;
                transition:var(--transition);
                box-shadow:0 10px 30px rgba(0,0,0,0.5)
            }
            .nav-menu.active{left:0}
            .mobile-btn{display:block}
            .banner h1{font-size:30px}
            .section{padding:90px 0}
            .adv-grid,.school-grid,.course-grid,.footer-grid,
            .why-grid,.testi-grid,.student-grid,.safe-list{grid-template-columns:1fr}
        }
        
        .kefu {
    position: fixed;
    right: 20px;
    bottom: 100px;
    z-index: 200;
}    
.kefu .card {
    position: relative;
    width: 80px;
    color: #16ffcb;
    background: #0d3f3a;
    border-radius: 14px;
}
.kefu .uwu {
    filter: blur(8px);
    transition: filter 0.3s;
}
.kefu .bg {
    position: absolute;
    z-index: -1;
    inset: -4px;
    border-radius: 16px;
    overflow: hidden;
}
.kefu .bg::before {
    content: '';
    position: absolute;
    aspect-ratio: 1 / 1;
    top: 50%;
    left: 50%;
    min-width: 150%;
    min-height: 150%;
    background-image: conic-gradient(hsl(0, 100%, 50%), hsl(30, 100%, 50%), hsl(60, 100%, 50%), hsl(90, 100%, 50%), hsl(120, 100%, 50%), hsl(150, 100%, 50%), hsl(180, 100%, 50%), hsl(210, 100%, 50%), hsl(240, 100%, 60%), hsl(270, 100%, 50%), hsl(300, 100%, 50%), hsl(330, 100%, 50%), hsl(360, 100%, 50%));
    animation: speeen 4s linear infinite;
    transform-origin: 0% 0%;
    transform: rotate(0deg) translate(-50%, -50%);
}
.kefu .content {
    position: relative;
    padding: 14px 10px;
}
.kefu .content div {
    text-align: center;
}
.kefu .img {
    height: 50px;
    width: 50px;
    margin: auto;
    background-color: rgba(0, 0, 0, .3);
    border-radius: 8px;
}
.u-flex-xy-center {
    display: flex;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    justify-content: center;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    align-items: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
}
.kefu .pic {
    height: 38px;
    width: 38px;
}
.u-p-t-6 {
    padding-top: 6px !important;
}
.kefu .p {
    font-size: 0.75em;
}
.kefu .p a {
    display: block;
    margin-top: 0.5em;
    padding: 0.5em 0;
    background-color: #0003;
    border-radius: 1em;
    cursor: pointer;
    color: #fff;
    font-size: 12px;
}
@keyframes speeen {
  0% {
    transform: rotate(0deg) translate(-50%, -50%);
}
100% {
    transform: rotate(360deg) translate(-50%, -50%);
}
}

@media screen and (max-width:768px){
    .kefu{display:none}
}