/* 页脚样式 - 精简版本 */

* { margin: 0; padding: 0; box-sizing: border-box; }

/* body { background: #000000; color: #b8b8b8; font-family: system-ui, sans-serif; } */

.footer-container { background: #000000; padding: 3rem 0 2rem; height: auto; margin-top: 6rem;}

.footer-content { max-width: 1200px; margin: 0 auto; padding: 0 2rem; }

.footer-top { display: grid; grid-template-columns: 1fr 2fr; gap: 4rem; margin-bottom: 3rem; }

.brand-name { font-size: 1.8rem; font-weight: 600; color: #fff; margin-bottom: 1.5rem; }

.social-icons { display: flex; gap: 0.8rem; }

.social-icon { width: 40px; height: 40px; border-radius: 50%; background: #3a3a3a; display: flex; align-items: center; justify-content: center; color: #b8b8b8; text-decoration: none; transition: all 0.3s; }

.social-icon:hover { background: #4a4a4a; color: #fff; transform: translateY(-2px); }

.nav-links { display: grid; grid-template-columns: repeat(3, 1fr); gap: 2rem; }

.nav-column h4 { font-size: 0.9rem; font-weight: 600; color: #fff; margin-bottom: 1rem; text-transform: uppercase; }

.nav-column ul { list-style: none; }

.nav-column li { margin-bottom: 0.6rem; }

.nav-column a { color: #b8b8b8; text-decoration: none; font-size: 0.9rem; transition: color 0.3s; display: flex; align-items: center; gap: 0.3rem; }

.nav-column a:hover { color: #fff; }

.external-link-icon { font-size: 0.7rem; opacity: 0.7; }

.footer-bottom { border-top: 1px solid #3a3a3a; padding-top: 2rem; display: flex; justify-content: space-between; align-items: flex-start; flex-wrap: wrap; gap: 2rem; }

.legal-links { display: flex; flex-wrap: wrap; gap: 1.5rem; align-items: center; }

.legal-links a { color: #b8b8b8; text-decoration: none; font-size: 0.85rem; transition: color 0.3s; }

.legal-links a:hover { color: #fff; }

.copyright { color: #b8b8b8; font-size: 0.85rem; text-align: right; }

@media (max-width: 768px) {
    .footer-top { grid-template-columns: 1fr; gap: 2rem; }
    .nav-links { grid-template-columns: 1fr; gap: 1.5rem; }
    .footer-bottom { flex-direction: column; align-items: flex-start; }
    .copyright { text-align: left; }
    .legal-links { flex-direction: column; align-items: flex-start; gap: 1rem; }
}

@media (max-width: 480px) {
    .footer-content { padding: 0 1rem; }
    .brand-name { font-size: 1.5rem; }
    .social-icon { width: 35px; height: 35px; font-size: 1rem; }
}