
*{box-sizing:border-box;margin:0;padding:0}
body{font-family:Arial,sans-serif;line-height:1.6;color:#333;background:#f7f7f7;padding:20px}
.container{max-width:1100px;margin:0 auto;background:#fff;padding:30px;border-radius:8px;box-shadow:0 2px 8px rgba(0,0,0,0.1)}
h1{color:#222;margin-bottom:20px;font-size:26px}
h2{color:#222;margin:25px 0 15px;font-size:20px}
p{margin-bottom:12px;font-size:16px}
ul{margin-left:20px;margin-bottom:15px;list-style:none}
.advantages{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:10px;margin-top:10px}
.advantages li{background:#f0f7ff;padding:10px 14px;border-radius:6px}

/* ========== Applications 图标+3列+悬浮效果 ========== */
.applications {
    display: grid;
    grid-template-columns: repeat(3, 1fr); /* 一排3列 */
    gap: 15px;
    margin: 15px 0 30px;
    padding: 0;
}
.applications li {
    background: #f8f9fa;
    padding: 16px 14px;
    border-radius: 10px;
    display: flex;
    align-items: center;
    gap: 12px;
    font-size: 15px;
    font-weight: 500;
    transition: all 0.3s ease;
    box-shadow: 0 1px 3px rgba(0,0,0,0.05);
}
.applications li i {
    font-size: 18px;
    color: #007bff;
    width: 20px;
    text-align: center;
}
/* 鼠标悬浮效果 */
.applications li:hover {
    background: #e3f2fd;
    transform: translateY(-3px);
    box-shadow: 0 4px 10px rgba(0,123,255,0.15);
    cursor: pointer;
}

/* 移动端自适应：2列 */
@media(max-width:768px){
    .container{padding:20px}
    .applications { grid-template-columns: repeat(2, 1fr); }
}
/* 小屏手机：1列 */
@media(max-width:480px){
    .applications { grid-template-columns: 1fr; }
}
