* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    font-family: "Microsoft YaHei", Arial, sans-serif;
    scroll-behavior: smooth;
}
:root {
    --primary: #4285F4;
    --secondary: #34A853;
    --warning: #FBBC05;
    --danger: #EA4335;
    --dark: #222;
    --light: #f7f7f7;
    --gray: #666;
}
body {
    line-height: 1.7;
    color: var(--dark);
    background: #fff;
}
a {text-decoration: none;color: inherit;}
ul {list-style: none;}
.container {width: 92%;max-width: 1200px;margin: 0 auto;}
.btn {
    display: inline-block;
    padding: 13px 32px;
    background: var(--primary);
    color: #fff;
    border-radius: 6px;
    font-size: 16px;
    transition: 0.3s;
    border: none;
    cursor: pointer;
}
.btn:hover {background: #3367D6;transform: translateY(-2px);}
.btn-secondary {background: var(--secondary);}
.btn-warning {background: var(--warning);color:#222;}
.btn-danger {background: var(--danger);}

.section {padding: 70px 0;}
.section-title {
    text-align: center;
    font-size: 34px;
    margin-bottom: 50px;
    position: relative;
    font-weight: 700;
}
.section-title::after {
    content: "";
    width: 90px;
    height: 4px;
    background: var(--primary);
    position: absolute;
    bottom: -12px;
    left: 50%;
    transform: translateX(-50%);
}

.header {
    position: sticky; top:0; background:#fff;
    box-shadow: 0 3px 15px rgba(0,0,0,0.08);
    z-index: 999; padding:16px 0;
}
.nav {display:flex;justify-content:space-between;align-items:center;}
.logo {font-size:26px;font-weight:bold;color:var(--primary);}
.nav-menu {display:flex;gap:28px;}
.nav-menu a {font-size:16px;transition:0.3s;}
.nav-menu a:hover {color:var(--primary);}
.mobile-menu {display:none;font-size:26px;cursor:pointer;}

.banner {
    background: linear-gradient(135deg, #E8F0FF, #F0F9F4);
    padding: 80px 0; text-align:center;
}
.banner h1 {font-size:42px;margin-bottom:22px;}
.banner p {font-size:18px;color:var(--gray);max-width:800px;margin:0 auto 30px;}

.grid-3 {display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:30px;}
.grid-4 {display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:25px;}
.grid-2 {display:grid;grid-template-columns:repeat(auto-fit,minmax(400px,1fr));gap:40px;align-items:center;}

.card {
    background:#fff;border-radius:12px;
    box-shadow:0 4px 12px rgba(0,0,0,0.05);
    padding:30px;transition:0.3s;
}
.card:hover {transform:translateY(-6px);box-shadow:0 8px 20px rgba(0,0,0,0.08);}

.footer {background:var(--dark);color:#fff;padding:70px 0 20px;}
.footer-grid {display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:40px;margin-bottom:40px;}
.footer-col h3 {margin-bottom:22px;font-size:18px;}
.footer-col li {margin-bottom:10px;}
.footer-col a {color:#ccc;transition:0.3s;}
.footer-col a:hover {color:#fff;}
.copyright {text-align:center;padding-top:25px;border-top:1px solid #444;color:#aaa;font-size:14px;}

.back-top {
    position:fixed;bottom:30px;right:30px;
    width:50px;height:50px;background:var(--primary);
    color:#fff;border-radius:50%;display:flex;
    align-items:center;justify-content:center;
    cursor:pointer;opacity:0;transition:0.4s;z-index:99;
}
.back-top.show {opacity:1;}

.faq-item {cursor:pointer;margin-bottom:15px;}
.faq-answer {display:none;margin-top:15px;color:var(--gray);}
.faq-item.active .faq-answer {display:block;}

@media (max-width:768px){
    .nav-menu{display:none;}
    .mobile-menu{display:block;}
    .banner h1{font-size:30px;}
    .section-title{font-size:28px;}
    .grid-2{grid-template-columns:1fr;}
}