/* 欧美蓝色工业风 */
* { margin: 0; padding: 0; box-sizing: border-box; }
body { font-family: 'Inter', sans-serif; background: #f5f9ff; color: #1a2c3e; line-height: 1.5; }
.container { max-width: 1280px; margin: 0 auto; padding: 0 2rem; }
.site-header { background: #fff; box-shadow: 0 2px 20px rgba(0,0,0,0.02); position: sticky; top: 0; z-index: 1000; border-bottom: 1px solid #dceaf5; }
.header-inner { display: flex; justify-content: space-between; align-items: center; padding: 0.8rem 2rem; flex-wrap: wrap; }
.logo h1 { font-size: 1.6rem; font-weight: 700; color: #0a5c8e; }
.logo p { font-size: 0.7rem; color: #5f8bb3; }
.nav-list { display: flex; gap: 2rem; list-style: none; }
.nav-list a { text-decoration: none; color: #1e4663; font-weight: 500; font-size: 0.9rem; transition: 0.2s; }
.nav-list a:hover, .nav-list a.active { color: #0a5c8e; border-bottom: 2px solid #0a5c8e; padding-bottom: 0.25rem; }
.lang-switch { display: flex; gap: 0.5rem; background: #eef3fc; padding: 0.3rem 0.8rem; border-radius: 40px; }
.lang-switch a { text-decoration: none; color: #5f8bb3; font-size: 0.8rem; font-weight: 500; }
.lang-switch a.active { color: #0a5c8e; font-weight: 700; }
.mobile-toggle { display: none; font-size: 1.5rem; cursor: pointer; color: #0a5c8e; }
.hero { background: linear-gradient(135deg, #eef5fc 0%, #dce9f5 100%); padding: 5rem 0; text-align: center; }
.hero h1 { font-size: 3.2rem; font-weight: 700; color: #0a4b6e; margin-bottom: 1rem; }
.hero p { font-size: 1.2rem; color: #2c5a7a; max-width: 700px; margin: 0 auto 2rem auto; }
.btn-primary { background: #0a5c8e; color: white; border: none; padding: 0.8rem 2rem; border-radius: 40px; font-weight: 600; text-decoration: none; display: inline-flex; align-items: center; gap: 0.5rem; transition: 0.2s; }
.btn-primary:hover { background: #08456b; transform: translateY(-2px); }
.stats { display: flex; justify-content: center; gap: 3rem; margin-top: 3rem; }
.stat-item { text-align: center; }
.stat-number { font-size: 2rem; font-weight: 800; color: #0a5c8e; display: block; }
.stat-label { color: #3b6b8f; font-size: 0.9rem; }
.section-title { font-size: 2rem; text-align: center; color: #0a4b6e; margin: 2.5rem 0 1.5rem; font-weight: 600; }
.grid-3 { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 2rem; margin: 2rem 0; }
.card { background: #fff; border-radius: 1.5rem; padding: 1.8rem; transition: all 0.3s; border: 1px solid #e2edf7; box-shadow: 0 5px 15px rgba(0,0,0,0.02); }
.card:hover { transform: translateY(-5px); box-shadow: 0 20px 30px -12px rgba(0,0,0,0.1); border-color: #cde1ef; }
.card img { width: 100%; height: 180px; object-fit: cover; border-radius: 1rem; margin-bottom: 1rem; }
.card h3 { font-size: 1.3rem; margin-bottom: 0.5rem; color: #1e3b4f; }
.link-more { color: #0a5c8e; text-decoration: none; font-weight: 600; margin-top: 1rem; display: inline-block; }
.case-item { display: flex; gap: 1.5rem; background: #fafdff; border-radius: 1rem; padding: 1.5rem; margin-bottom: 1.5rem; border: 1px solid #eef2f8; }
.case-icon i { font-size: 2rem; color: #0a5c8e; background: #eef5fc; padding: 0.8rem; border-radius: 50%; }
.site-footer { background: #132b3c; color: #cddfea; padding: 3rem 0; margin-top: 4rem; }
.footer-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 2rem; }
.footer-col h4 { color: #b3d4f0; margin-bottom: 1rem; }
.footer-col a { color: #cddfea; text-decoration: none; line-height: 1.8; }
.social a { margin-right: 1rem; font-size: 1.2rem; }
.chatbot-hidden { display: none; }
.chatbot-widget { position: fixed; bottom: 100px; right: 25px; width: 340px; background: white; border-radius: 28px; box-shadow: 0 20px 40px rgba(0,0,0,0.2); z-index: 1100; border: 1px solid #e2edf7; }
.chatbot-header { background: #0a5c8e; color: white; padding: 0.9rem 1.2rem; border-radius: 28px 28px 0 0; display: flex; align-items: center; gap: 0.6rem; }
.chatbot-close-btn { margin-left: auto; background: none; border: none; color: white; cursor: pointer; }
.chatbot-messages { height: 260px; overflow-y: auto; padding: 1rem; }
.bot-message, .user-message { margin-bottom: 0.8rem; padding: 0.6rem 1rem; border-radius: 20px; max-width: 85%; }
.bot-message { background: #eef2fa; }
.user-message { background: #0a5c8e; color: white; margin-left: auto; }
.chatbot-input-area { display: flex; padding: 0.7rem; border-top: 1px solid #eef2f8; gap: 0.5rem; }
.chatbot-input-area input { flex: 1; padding: 0.6rem 1rem; border: 1px solid #cfdfed; border-radius: 40px; }
.chatbot-input-area button { background: #0a5c8e; border: none; border-radius: 50%; width: 38px; color: white; cursor: pointer; }
.chatbot-toggle-btn { position: fixed; bottom: 25px; right: 25px; background: #0a5c8e; width: 56px; height: 56px; border-radius: 50%; display: flex; align-items: center; justify-content: center; cursor: pointer; color: white; font-size: 1.5rem; box-shadow: 0 6px 14px rgba(0,0,0,0.2); z-index: 1100; }
@media (max-width: 768px) {
    .nav-list { display: none; flex-direction: column; background: white; position: absolute; top: 70px; left: 0; width: 100%; padding: 1rem; box-shadow: 0 10px 20px rgba(0,0,0,0.05); }
    .nav-list.show { display: flex; }
    .mobile-toggle { display: block; }
    .stats { flex-direction: column; gap: 1rem; align-items: center; }
    .hero h1 { font-size: 2rem; }
    .case-item { flex-direction: column; text-align: center; }
}