/* 移动端适配补充 - 不修改原有common.css */
@media (max-width: 992px) {
    /* 1. 移动端导航菜单样式补全 */
    .mobile-nav {
        display: block; /* 确保移动端导航容器显示 */
        transform: translateX(100%);
        transition: transform 0.3s ease;
        height: calc(100vh - 70px);
        overflow-y: auto;
    }
    .mobile-nav.active {
        transform: translateX(0);
    }
    /* 2. 移动端下拉菜单交互优化 */
    .mobile-dropdown > a {
        display: flex;
        justify-content: space-between;
        align-items: center;
    }
    .mobile-dropdown > a::after {
        content: "\f078";
        font-family: "Font Awesome 6 Free";
        font-weight: 900;
        font-size: 12px;
        transition: transform 0.3s ease;
    }
    .mobile-dropdown.active > a::after {
        transform: rotate(180deg);
    }
    /* 3. 移动端按钮/间距优化 */
    .consult-btn, .login-btn {
        padding: 6px 12px !important;
        font-size: 14px !important;
    }
    /* 4. 容器适配：移动端取消最大宽度限制，增加内边距 */
    .container {
        padding: 0 10px;
    }
}

@media (max-width: 768px) {
    /* 1. 底部列布局改为堆叠 */
    .footer-container {
        flex-direction: column;
        gap: 30px;
        padding: 0 15px;
    }
    /* 2. Banner高度适配，避免内容溢出 */
    .banner {
        height: 280px !important;
    }
    /* 3. 卡片组件适配：减少内边距，优化点击区域 */
    .highlight-card {
        padding: 15px;
        margin-bottom: 15px;
    }
    /* 4. 表单适配：全屏宽度，优化输入体验 */
    .consult-form {
        gap: 15px;
    }
    .form-group input, .form-group textarea {
        font-size: 14px;
        padding: 10px;
    }
}

@media (max-width: 576px) {
    /* 1. 导航栏高度降低，适配小屏 */
    .header {
        height: 60px;
    }
    .nav {
        height: 60px;
    }
    /* 2. Logo文字隐藏，仅保留图标（节省空间） */
    .logo span {
        display: none;
    }
    .logo i {
        margin-right: 0;
        font-size: 24px;
    }
    /* 3. 回到顶部按钮位置调整 */
    .back-to-top {
        bottom: 20px;
        right: 20px;
        width: 40px;
        height: 40px;
    }
    /* 4. 底部版权信息换行适配 */
    .footer-bottom p {
        font-size: 12px;
        line-height: 1.5;
        padding: 0 10px;
    }
}

/* 移动端触摸交互优化 */
@media (pointer: coarse) {
    /* 增大移动端点击区域 */
    a, button, .nav-list li a, .dropdown-menu li a {
        min-height: 44px;
        min-width: 44px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
    }
    /* 取消移动端hover效果（避免误触） */
    .dropdown:hover .dropdown-menu {
        display: none;
    }
    .dropdown.touched .dropdown-menu {
        display: block;
        opacity: 1;
        visibility: visible;
    }
}

/* 增强汉堡按钮样式 */
.mobile-nav-btn {
    padding: 8px 12px;
    border-radius: var(--radius-sm);
    background-color: var(--bg-light);
    transition: var(--transition-base);
}
.mobile-nav-btn:hover {
    background-color: rgba(30,136,229,0.1);
}
.mobile-nav-btn i {
    font-size: 22px !important;
}
