/* 重置样式 */
* {margin: 0;padding: 0;box-sizing: border-box;}
a {text-decoration: none;color: inherit;font-size: inherit;font-weight: inherit;background-color: transparent;}
ul, ol {list-style: none;}

/* 基础样式 */
body {font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei', 'Helvetica Neue', Helvetica, Arial, sans-serif;background-color: #f8f9fa;color: #333;line-height: 1.6;}

/* 顶部导航栏 */
.header {background: #fff;box-shadow: 0 1px 5px rgba(0, 0, 0, 0.1);position: sticky;top: 0;z-index: 1000;}
.top-nav {border-bottom: 1px solid #e8eaec;height: 80px;padding-top: 10px;}
.nav-left {display: flex;align-items: center;max-width: 1200px;margin: 0 auto;padding: 0 20px;width: 100%;justify-content: space-between;}
.ai-logo img {height: 60px;width: auto;display: block;}
.main-nav {display: flex;gap: 0;margin-left: auto;}
.nav-item {display: flex;align-items: center;gap: 6px;padding: 12px 17px;text-decoration: none;color: #666;font-size: 16px;transition: all 0.3s ease;border-bottom: 2px solid transparent;}
.nav-item:hover {color: #0060af;background-color: #f0f8ff;}
.nav-item.active {color: #0060af;border-bottom-color: #0060af;background-color: #f0f8ff;}
.nav-item i {font-size: 16px;}

/* 移动端菜单按钮 */
.mobile-menu-toggle {display: none;cursor: pointer;padding: 8px;transition: all 0.3s ease;margin-left: auto;}
.hamburger-icon {width: 24px;height: 24px;display: flex;flex-direction: column;justify-content: space-between;position: relative;}
.hamburger-icon span {display: block;width: 100%;height: 3px;background-color: #0060af;border-radius: 2px;transition: all 0.3s ease;}
.mobile-menu-toggle.active .hamburger-icon span:nth-child(1) {transform: rotate(45deg) translateY(10px);}
.mobile-menu-toggle.active .hamburger-icon span:nth-child(2) {opacity: 0;}
.mobile-menu-toggle.active .hamburger-icon span:nth-child(3) {transform: rotate(-45deg) translateY(-10px);}

/* 主要内容区域 */
.main-content {max-width: 1200px;margin: 0 auto;padding: 0;}

/* 底部版块 */
.footer-section {background: linear-gradient(135deg, #1e293b 0%, #334155 50%, #475569 100%);color: white;padding: 0px 0 20px;margin-top: 20px;}
.footer-content {max-width: 1200px;margin: 0 auto;padding: 20px 20px 0;display: flex;justify-content: space-between;align-items: flex-end;}
.footer-main {display: grid;grid-template-columns: 1fr 2fr;gap: 60px;margin-bottom: 40px;}
.footer-brand {max-width: 1200px;}
.footer-logo {display: flex;align-items: center;gap: 12px;margin-bottom: 20px;}
.footer-logo i {font-size: 28px;color: white;}
.footer-logo span {font-size: 20px;font-weight: 700;color: white;}
.footer-description {font-size: 14px;line-height: 1.6;color: #cbd5e1;margin-bottom: 24px;}
.footer-social {display: flex;gap: 16px;}
.social-link {display: flex;align-items: center;justify-content: center;width: 44px;height: 44px;background: rgba(255, 255, 255, 0.1);color: #cbd5e1;border-radius: 12px;text-decoration: none;transition: all 0.3s ease;backdrop-filter: blur(10px);border: 1px solid rgba(255, 255, 255, 0.1);}
.social-link:hover {background: #8B5CF6;color: white;transform: translateY(-2px);box-shadow: 0 8px 20px rgba(139, 92, 246, 0.3);}
.social-link i {font-size: 20px;}
.footer-links {display: grid;grid-template-columns: repeat(4, 1fr);gap: 40px;}
.link-group {min-width: 0;}
.link-title {font-size: 18px;font-weight: 600;color: white;margin-bottom: 20px;position: relative;}
.link-title::after {content: '';position: absolute;bottom: -8px;left: 0;width: 30px;height: 2px;background: #8B5CF6;border-radius: 1px;}
.link-list {list-style: none;padding: 0;margin: 0;}
.link-list li {margin-bottom: 12px;}
.link-list a {color: #cbd5e1;text-decoration: none;font-size: 14px;transition: all 0.3s ease;display: block;padding: 4px 0;}
.link-list a:hover {color: #8B5CF6;transform: translateX(4px);}
.footer-info {flex: 1;}
.contact-info {display: flex;gap: 40px;margin-bottom: 20px;flex-wrap: wrap;}
.contact-item {display: flex;align-items: center;gap: 8px;color: #cbd5e1;font-size: 14px;}
.contact-item i {color: #8B5CF6;font-size: 16px;width: 16px;}
.footer-copyright {color: #94a3b8;font-size: 12px;line-height: 1.5;}
.footer-copyright p {margin: 4px 0;}

/* 滚动条样式 */
::-webkit-scrollbar {width: 6px;height: 6px;}
::-webkit-scrollbar-track {background: #f1f1f1;border-radius: 3px;}
::-webkit-scrollbar-thumb {background: #c1c1c1;border-radius: 3px;}
::-webkit-scrollbar-thumb:hover {background: #a8a8a8;}

/* 通用响应式设计 */

@media (max-width: 1024px) {
.footer-main {grid-template-columns: 1fr;gap: 40px;}
.footer-links {grid-template-columns: repeat(2, 1fr);gap: 30px;}
.contact-info {gap: 20px;}
}

@media (max-width: 768px) {
.nav-left {padding: 0 16px;position: relative;}

/* 移动端缩小头部 LOGO 尺寸 */
.ai-logo img {height: 44px;}

/* 移动端顶部导航垂直居中 */
.top-nav {height: 56px;padding-top: 0;display: flex;align-items: center;}
.nav-left {height: 56px;display: flex;align-items: center;justify-content: space-between;}
.ai-logo {display: flex;align-items: center;flex-shrink: 0;}

/* 显示移动端菜单按钮 */
.mobile-menu-toggle {display: block;margin-left: auto;}

/* 移动端导航样式 - 弹出菜单 */
.main-nav {position: fixed;top: 56px;left: 0;right: 0;background: #fff;box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);max-height: 0;overflow: hidden;transition: max-height 0.3s ease;flex-direction: column;z-index: 999;display: flex;}

/* 导航打开状态 */
.main-nav.nav-open {max-height: 400px;padding: 10px 0;}
.nav-item {width: 100%;padding: 12px 20px;border-bottom: 1px solid #f0f0f0;white-space: nowrap;}
.nav-item:last-child {border-bottom: none;}
.footer-section {padding: 30px 0 20px;}
.footer-content {padding: 0 16px;}
.footer-links {grid-template-columns: 1fr;gap: 24px;}
.footer-content {flex-direction: column;align-items: center;gap: 30px;text-align: center;}
.contact-info {flex-direction: column;gap: 12px;align-items: center;}
.footer-brand {text-align: center;}

/* 移动端隐藏底部描述文字 */
.footer-description {display: none;}
.footer-social {justify-content: center;}
.footer-qr {justify-content: center;flex-wrap: wrap;gap: 12px;}
}

@media (max-width: 480px) {

/* 小屏幕保持文字显示 */
.nav-item span {display: inline;}

/* 移动端导航调整 */
.nav-item {font-size: 14px;}
.footer-section {padding: 30px 0 20px;}
.footer-logo {justify-content: center;}
.footer-logo span {font-size: 20px;}
.footer-description {font-size: 14px;}
.social-link {width: 40px;height: 40px;}
.social-link i {font-size: 18px;}
.qr-code {padding: 16px;}
.qr-code img {width: 100px;height: 100px;}
}