/* ============================================================
 * H5 移动端统一UI设计系统 v3.1
 * 现代化、简洁、专业的移动端适配方案
 * ============================================================ */

/* ============ 强制覆盖 - 最高优先级 ============ */
@media only screen and (max-width: 768px) {
    /* 强制重置body */
    body.body,
    body.min990,
    body {
        min-width: 0 !important;
        max-width: 100% !important;
        width: 100% !important;
        overflow-x: hidden !important;
        position: static !important;
    }
    
    /* 强制重置所有容器 */
    .wide1190,
    .wide990,
    .container,
    .wrap,
    .con-padding,
    .wide750,
    .wide960 {
        min-width: 0 !important;
        max-width: 100% !important;
        width: 100% !important;
        float: none !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
    }
    
    /* 强制重置header */
    #header2016 {
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
    }
    
    /* 强制重置header-nav-content (覆盖tp2016_v6) */
    #header2016 .header-nav-content {
        width: 100% !important;
        height: auto !important;
        min-height: 56px !important;
        bottom: auto !important;
        position: relative !important;
    }
}

/* ============ 设计令牌 (Design Tokens) ============ */
@media only screen and (max-width: 768px) {
    :root {
        --h5-primary: #1a73e8;
        --h5-primary-dark: #1557b0;
        --h5-primary-light: #e8f0fe;
        --h5-secondary: #5f6368;
        --h5-success: #34a853;
        --h5-warning: #fbbc04;
        --h5-danger: #ea4335;
        --h5-bg: #f8f9fa;
        --h5-bg-white: #ffffff;
        --h5-text: #202124;
        --h5-text-secondary: #5f6368;
        --h5-text-hint: #80868b;
        --h5-border: #dadce0;
        --h5-border-light: #e8eaed;
        --h5-shadow-sm: 0 1px 2px rgba(0,0,0,0.05);
        --h5-shadow-md: 0 2px 8px rgba(0,0,0,0.08);
        --h5-shadow-lg: 0 4px 16px rgba(0,0,0,0.12);
        --h5-radius-sm: 6px;
        --h5-radius-md: 10px;
        --h5-radius-lg: 16px;
        --h5-space-xs: 4px;
        --h5-space-sm: 8px;
        --h5-space-md: 16px;
        --h5-space-lg: 24px;
        --h5-space-xl: 32px;
    }
}

/* ============ 全局基础重置 ============ */
@media only screen and (max-width: 768px) {
    /* 清除min-width限制，允许移动端缩放 */
    body.min990,
    body {
        min-width: 0 !important;
        width: 100% !important;
        max-width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
        overflow-x: hidden !important;
        font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei', sans-serif !important;
        font-size: 14px !important;
        line-height: 1.6 !important;
        color: var(--h5-text) !important;
        background: var(--h5-bg) !important;
        -webkit-text-size-adjust: 100% !important;
        -webkit-tap-highlight-color: transparent !important;
    }

    /* 容器宽度适配 */
    .wide1190,
    .wide990,
    .container,
    .wrap,
    .con-padding {
        min-width: 0 !important;
        width: 100% !important;
        max-width: 100% !important;
        padding-left: 16px !important;
        padding-right: 16px !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        float: none !important;
    }

    /* 全局盒模型 */
    *, *::before, *::after {
        box-sizing: border-box !important;
    }

    /* 图片响应式 */
    img, video, canvas, svg {
        max-width: 100% !important;
        height: auto !important;
    }

    /* 清除所有浮动 */
    .f-l, .f-r, .fl, .fr,
    [class*="f-l"], [class*="f-r"] {
        float: none !important;
    }

    /* 清除内联块 */
    .cl, .clearfix, .clear {
        zoom: 1;
    }

    /* 表单元素防止iOS缩放 */
    input, select, textarea, button {
        font-size: 16px !important;
    }

    /* 触摸区域优化 */
    a, button, input, select, textarea {
        min-height: 44px !important;
        min-width: 44px !important;
    }

    /* 隐藏不需要的元素 */
    .no-mobile,
    #rightMenuBar2016 {
        display: none !important;
    }
}

/* ============ 顶部导航栏重构 ============ */
@media only screen and (max-width: 768px) {
    #header2016 {
        position: sticky !important;
        top: 0 !important;
        z-index: 1000 !important;
        background: var(--h5-bg-white) !important;
        box-shadow: var(--h5-shadow-sm) !important;
    }

    /* 顶部工具栏 */
    #header2016 .headerTop {
        display: none !important;
    }

    /* Logo区域 */
    #header2016 .header-nav {
        background: var(--h5-bg-white) !important;
        border-bottom: 1px solid var(--h5-border-light) !important;
    }

    #header2016 .header-nav-content {
        height: 56px !important;
        min-height: 56px !important;
        padding: 0 12px !important;
        position: relative !important;
        display: flex !important;
        align-items: center !important;
        justify-content: space-between !important;
    }

    #header2016 .header-nav .logo {
        float: none !important;
        margin: 0 !important;
        padding: 0 !important;
        text-align: left !important;
        order: 1 !important;
    }

    #header2016 .header-nav .logo img {
        max-width: 90px !important;
        height: auto !important;
        display: block !important;
    }

    /* 主导航容器 - 横向滚动 */
    #header2016 .nav-content,
    #header2016 .main-nav-wrapper.index-nav {
        order: 2 !important;
        flex: 1 !important;
        margin: 0 !important;
        padding: 0 8px !important;
        display: flex !important;
        flex-wrap: nowrap !important;
        overflow-x: auto !important;
        overflow-y: hidden !important;
        -webkit-overflow-scrolling: touch !important;
        white-space: nowrap !important;
        scrollbar-width: none !important;
        -ms-overflow-style: none !important;
    }

    #header2016 .main-nav-wrapper.index-nav::-webkit-scrollbar {
        display: none !important;
    }

    #header2016 .main-nav-wrapper.index-nav > li {
        float: none !important;
        display: inline-block !important;
        width: auto !important;
        flex: 0 0 auto !important;
        margin: 0 2px !important;
        vertical-align: top !important;
    }

    #header2016 .main-nav-wrapper.index-nav > li > a.nav-menu {
        display: block !important;
        padding: 8px 12px !important;
        font-size: 14px !important;
        font-weight: 500 !important;
        line-height: 1.4 !important;
        white-space: nowrap !important;
        border-bottom: none !important;
        border-radius: 20px !important;
        min-height: auto !important;
        min-width: auto !important;
        text-align: center !important;
        background: transparent !important;
        color: var(--h5-text-secondary) !important;
        transition: all 0.2s ease !important;
    }

    #header2016 .main-nav-wrapper.index-nav > li > a.nav-menu:hover {
        background: var(--h5-primary-light) !important;
        color: var(--h5-primary) !important;
    }

    #header2016 .main-nav-wrapper.index-nav > li.current > a.nav-menu,
    #header2016 .main-nav-wrapper.index-nav > li > a.nav-menu.current {
        background: var(--h5-primary) !important;
        color: #fff !important;
    }

    /* 搜索框隐藏或简化 */
    #header2016 .index-nav {
        order: 3 !important;
        display: none !important;
    }
}

/* ============ 移动端菜单按钮 ============ */
@media only screen and (max-width: 768px) {
    #mobileNavToggle {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        position: absolute !important;
        right: 12px !important;
        top: 50% !important;
        transform: translateY(-50%) !important;
        width: 40px !important;
        height: 40px !important;
        background: var(--h5-primary) !important;
        border: none !important;
        border-radius: 50% !important;
        color: #fff !important;
        font-size: 20px !important;
        cursor: pointer !important;
        z-index: 101 !important;
        padding: 0 !important;
        box-shadow: 0 2px 8px rgba(26,115,232,0.3) !important;
        transition: transform 0.2s ease !important;
    }

    #mobileNavToggle:active {
        transform: translateY(-50%) scale(0.92) !important;
    }

    #mobileNavToggle::before {
        content: '☰' !important;
        font-size: 18px !important;
        line-height: 1 !important;
    }

    #header2016.nav-expanded #mobileNavToggle::before {
        content: '✕' !important;
    }

    /* 展开状态 */
    #header2016.nav-expanded .header-nav-content {
        height: auto !important;
        min-height: 56px !important;
        align-items: flex-start !important;
        padding-bottom: 12px !important;
    }

    #header2016.nav-expanded .main-nav-wrapper.index-nav {
        display: grid !important;
        grid-template-columns: repeat(3, 1fr) !important;
        gap: 8px !important;
        overflow: visible !important;
        padding: 60px 12px 12px !important;
        position: absolute !important;
        top: 0 !important;
        left: 0 !important;
        right: 0 !important;
        background: var(--h5-bg-white) !important;
        z-index: 100 !important;
        border-radius: 0 0 var(--h5-radius-lg) var(--h5-radius-lg) !important;
        box-shadow: var(--h5-shadow-lg) !important;
        max-height: 80vh !important;
        overflow-y: auto !important;
    }

    #header2016.nav-expanded .main-nav-wrapper.index-nav > li {
        display: block !important;
        width: 100% !important;
    }

    #header2016.nav-expanded .main-nav-wrapper.index-nav > li > a.nav-menu {
        width: 100% !important;
        padding: 14px 8px !important;
        font-size: 14px !important;
        font-weight: 500 !important;
        border: 1px solid var(--h5-border-light) !important;
        border-radius: var(--h5-radius-md) !important;
        background: var(--h5-bg) !important;
        text-align: center !important;
    }

    #header2016.nav-expanded .main-nav-wrapper.index-nav > li > a.nav-menu:active {
        background: var(--h5-primary-light) !important;
        border-color: var(--h5-primary) !important;
    }
}

/* ============ 轮播图优化 ============ */
@media only screen and (max-width: 768px) {
    #banner,
    .sec-banner {
        height: 180px !important;
        min-height: 180px !important;
        overflow: hidden !important;
        border-radius: 0 !important;
    }

    #banner .slide-wrapper,
    .sec-banner .slide-wrapper {
        height: 180px !important;
    }

    #banner .slide-wrapper li,
    .sec-banner .slide-wrapper li {
        height: 180px !important;
        width: 100% !important;
    }

    #banner .slide-wrapper li a.slide,
    .sec-banner .slide-wrapper li a.slide {
        height: 180px !important;
        background-size: cover !important;
        background-position: center center !important;
    }

    /* 隐藏轮播图文字 */
    #banner .slide-wrapper li a.slide,
    .sec-banner .slide-wrapper li a.slide {
        text-indent: -9999px !important;
        font-size: 0 !important;
        color: transparent !important;
    }

    .slide-pagination {
        bottom: 12px !important;
    }

    .slide-pagination ul li {
        width: 6px !important;
        height: 6px !important;
        margin: 0 3px !important;
        border-radius: 50% !important;
        background: rgba(255,255,255,0.5) !important;
    }

    .slide-pagination ul li.active {
        background: #fff !important;
        width: 18px !important;
        border-radius: 3px !important;
    }
}

/* ============ 内容区域通用样式 ============ */
@media only screen and (max-width: 768px) {
    #content {
        width: 100% !important;
        overflow: hidden !important;
    }

    /* 区块间距 */
    .normal-bg,
    .gray-bg,
    .product-bg {
        padding: 20px 0 !important;
        overflow: hidden;
    }

    /* 标题样式 */
    h1.title {
        font-size: 20px !important;
        font-weight: 700 !important;
        padding: 16px 0 12px !important;
        text-align: center !important;
        color: var(--h5-text) !important;
    }

    h1, h2, h3, h4, h5, h6 {
        line-height: 1.4 !important;
        word-break: break-word;
    }

    h1 { font-size: 20px !important; }
    h2 { font-size: 18px !important; }
    h3 { font-size: 16px !important; }
    h4 { font-size: 15px !important; }
    h5 { font-size: 14px !important; }
    h6 { font-size: 13px !important; }

    .font18 { font-size: 15px !important; }
    .font20 { font-size: 16px !important; }
    .font24 { font-size: 18px !important; }
    .font28 { font-size: 22px !important; }
    .font32 { font-size: 26px !important; }
}

/* ============ 域名搜索区域 ============ */
@media only screen and (max-width: 768px) {
    .domain-top {
        padding: 12px 0 !important;
        text-align: center !important;
    }

    .domain-top .font18 {
        font-size: 14px !important;
        font-weight: 500 !important;
        float: none !important;
        display: block !important;
        margin: 0 auto 10px !important;
        text-align: center !important;
        padding: 0 16px !important;
    }

    .domain-top .f-r {
        float: none !important;
        display: block !important;
        text-align: center !important;
        margin-top: 8px !important;
        padding: 0 16px !important;
    }

    .domain-query-container {
        padding: 0 12px !important;
    }

    .query-container {
        padding: 0 !important;
        background: var(--h5-bg-white) !important;
        border-radius: var(--h5-radius-lg) !important;
        box-shadow: var(--h5-shadow-md) !important;
        overflow: hidden !important;
    }

    .query-container .query-input-container {
        margin: 0 !important;
        width: 100% !important;
    }

    .query-container .query-input-container .common-input,
    .query-container .common-input {
        border-radius: 0 !important;
        height: 50px !important;
        line-height: 50px !important;
        text-indent: 16px !important;
        font-size: 15px !important;
        border: none !important;
        border-bottom: 1px solid var(--h5-border-light) !important;
        background: var(--h5-bg-white) !important;
    }

    .query-container .domain-query-btn,
    .query-container .domain-query-submit {
        width: 100% !important;
        height: 50px !important;
        font-size: 16px !important;
        font-weight: 600 !important;
        background: var(--h5-primary) !important;
        color: #fff !important;
        border: none !important;
        border-radius: 0 !important;
        padding: 0 !important;
    }

    .domext-container {
        padding: 12px 0 !important;
    }

    .adver-ext-container li {
        float: none !important;
        display: inline-block !important;
        margin: 4px !important;
    }

    .adver-ext-container .adver-ext,
    .adver-ext-container .adver-link {
        height: auto !important;
        line-height: 1.4 !important;
        padding: 6px 12px !important;
        font-size: 13px !important;
        border-radius: 16px !important;
        background: var(--h5-bg) !important;
        color: var(--h5-text-secondary) !important;
        border: 1px solid var(--h5-border-light) !important;
    }
}

/* ============ 产品/服务卡片 ============ */
@media only screen and (max-width: 768px) {
    .product-bg {
        height: auto !important;
        min-height: 200px !important;
        padding: 24px 0 !important;
        background-size: cover !important;
        background-position: center top !important;
    }

    .product-con {
        padding: 16px 12px !important;
    }

    .product-con ul {
        text-align: left !important;
    }

    .product-con ul li {
        float: none !important;
        width: 100% !important;
        margin: 0 0 12px !important;
        display: block !important;
    }

    .product-con ul li a {
        display: block !important;
        padding: 16px !important;
        border-radius: var(--h5-radius-md) !important;
        background: var(--h5-bg-white) !important;
        box-shadow: var(--h5-shadow-sm) !important;
        transition: box-shadow 0.2s ease !important;
    }

    .product-con ul li a:active {
        box-shadow: var(--h5-shadow-md) !important;
    }

    .product-list-con {
        margin: 0 0 12px !important;
    }

    .product-list-con h1 {
        font-size: 15px !important;
        padding: 8px 0 !important;
    }

    .product-list-con .view-more {
        padding: 10px 0 !important;
        font-size: 13px !important;
        color: var(--h5-primary) !important;
    }
}

/* ============ 通用卡片/列表 ============ */
@media only screen and (max-width: 768px) {
    .feature-con,
    .service-con,
    .news-con,
    .help-con {
        padding: 16px 0 !important;
    }

    .feature-item,
    .service-item,
    .news-item {
        float: none !important;
        width: 100% !important;
        margin: 0 0 12px !important;
        text-align: left !important;
    }

    .card,
    .panel,
    .box,
    .product-list-con,
    .service-card,
    .feature-card,
    .help-item {
        margin: 10px 12px !important;
        padding: 16px !important;
        border-radius: var(--h5-radius-md) !important;
        background: var(--h5-bg-white) !important;
        box-shadow: var(--h5-shadow-sm) !important;
    }

    .news-list,
    .article-list,
    .help-list,
    .product-list {
        padding: 0 12px !important;
    }

    .news-list li,
    .article-list li,
    .product-list li {
        padding: 12px 0 !important;
        border-bottom: 1px solid var(--h5-border-light) !important;
        float: none !important;
        width: 100% !important;
        display: block !important;
    }

    .news-list li:last-child,
    .article-list li:last-child {
        border-bottom: none !important;
    }

    .news-list .date,
    .article-list .date,
    .product-list .date {
        float: none !important;
        display: block !important;
        font-size: 12px !important;
        color: var(--h5-text-hint) !important;
        margin-top: 4px !important;
    }
}

/* ============ 按钮样式 ============ */
@media only screen and (max-width: 768px) {
    button,
    input[type="submit"],
    input[type="button"],
    .btn,
    .common-btn {
        min-height: 44px !important;
        padding: 10px 24px !important;
        font-size: 15px !important;
        font-weight: 500 !important;
        border-radius: var(--h5-radius-sm) !important;
        background: var(--h5-primary) !important;
        color: #fff !important;
        border: none !important;
        cursor: pointer !important;
        transition: background 0.2s ease !important;
    }

    button:active,
    input[type="submit"]:active,
    .btn:active {
        background: var(--h5-primary-dark) !important;
    }

    .btn-secondary {
        background: var(--h5-bg) !important;
        color: var(--h5-text) !important;
        border: 1px solid var(--h5-border) !important;
    }

    .btn-block {
        display: block !important;
        width: 100% !important;
    }
}

/* ============ 表单样式 ============ */
@media only screen and (max-width: 768px) {
    input[type="text"],
    input[type="email"],
    input[type="password"],
    input[type="tel"],
    input[type="url"],
    input[type="search"],
    input[type="number"],
    select,
    textarea {
        font-size: 16px !important;
        height: 44px !important;
        padding: 10px 14px !important;
        border-radius: var(--h5-radius-sm) !important;
        border: 1px solid var(--h5-border) !important;
        background: var(--h5-bg-white) !important;
        width: 100% !important;
        box-sizing: border-box !important;
        transition: border-color 0.2s ease !important;
    }

    input:focus,
    select:focus,
    textarea:focus {
        outline: none !important;
        border-color: var(--h5-primary) !important;
        box-shadow: 0 0 0 3px var(--h5-primary-light) !important;
    }

    textarea {
        height: auto !important;
        min-height: 100px !important;
        resize: vertical !important;
    }
}

/* ============ 管理中心页面适配 ============ */
@media only screen and (max-width: 768px) {
    /* 布局改为单列 */
    .content.con-padding {
        padding: 12px !important;
    }

    /* 左侧导航改为顶部标签 */
    .navbar-left {
        position: sticky !important;
        top: 56px !important;
        z-index: 100 !important;
        background: var(--h5-bg-white) !important;
        border-bottom: 1px solid var(--h5-border-light) !important;
        padding: 0 !important;
        margin: 0 -12px 12px !important;
        width: calc(100% + 24px) !important;
        overflow-x: auto !important;
        -webkit-overflow-scrolling: touch !important;
        scrollbar-width: none !important;
    }

    .navbar-left::-webkit-scrollbar {
        display: none !important;
    }

    .navbar-left .nl-title {
        display: none !important;
    }

    .navbar-left .nl-list {
        display: flex !important;
        flex-wrap: nowrap !important;
        padding: 8px 12px !important;
        margin: 0 !important;
        min-width: max-content !important;
    }

    .navbar-left .nl-list .item {
        float: none !important;
        display: inline-block !important;
        margin: 0 4px !important;
    }

    .navbar-left .nl-list .item a {
        display: block !important;
        padding: 8px 14px !important;
        font-size: 13px !important;
        font-weight: 500 !important;
        color: var(--h5-text-secondary) !important;
        background: var(--h5-bg) !important;
        border-radius: 20px !important;
        white-space: nowrap !important;
        border: none !important;
        line-height: 1.4 !important;
    }

    .navbar-left .nl-list .item.active a,
    .navbar-left .nl-list .item.current a {
        background: var(--h5-primary) !important;
        color: #fff !important;
    }

    .navbar-left .nl-list .item a i {
        display: none !important;
    }

    /* 右侧内容区 */
    #MainRight.content-right {
        float: none !important;
        width: 100% !important;
        padding: 0 !important;
    }

    /* 搜索框 */
    .cr-search {
        margin-bottom: 16px !important;
    }

    .cr-search form {
        display: flex !important;
        gap: 8px !important;
    }

    .cr-search select {
        width: 80px !important;
        flex-shrink: 0 !important;
    }

    .cr-search input[type="text"] {
        flex: 1 !important;
    }

    .cr-search button {
        width: auto !important;
        flex-shrink: 0 !important;
    }

    /* 快捷入口列表 */
    .cr-search-list {
        display: flex !important;
        flex-wrap: wrap !important;
        gap: 8px !important;
        padding: 0 !important;
        margin: 0 0 16px !important;
    }

    .cr-search-list li {
        float: none !important;
        width: auto !important;
        margin: 0 !important;
    }

    .cr-search-list li a {
        display: block !important;
        padding: 8px 14px !important;
        font-size: 13px !important;
        color: var(--h5-text-secondary) !important;
        background: var(--h5-primary-light) !important;
        border-radius: 20px !important;
        white-space: nowrap !important;
    }

    /* Tab切换 */
    #DiySite_List_Box {
        margin-top: 0 !important;
    }

    #DiySite_List_Box_top {
        height: auto !important;
        padding: 0 !important;
        display: flex !important;
        border-bottom: 1px solid var(--h5-border-light) !important;
        overflow-x: auto !important;
        -webkit-overflow-scrolling: touch !important;
        scrollbar-width: none !important;
    }

    #DiySite_List_Box_top::-webkit-scrollbar {
        display: none !important;
    }

    #DiySite_List_Box_top ul {
        display: flex !important;
        flex-wrap: nowrap !important;
        margin: 0 !important;
        min-width: max-content !important;
    }

    #DiySite_List_Box_top ul li {
        float: none !important;
        height: auto !important;
        line-height: 1.4 !important;
        width: auto !important;
        padding: 12px 16px !important;
        font-size: 14px !important;
        font-weight: 500 !important;
        background: transparent !important;
        color: var(--h5-text-secondary) !important;
        white-space: nowrap !important;
        border-bottom: 2px solid transparent !important;
    }

    .mail_tab_center_on {
        background: transparent !important;
        color: var(--h5-primary) !important;
        border-bottom-color: var(--h5-primary) !important;
    }

    .mail_tab_center_off {
        background: transparent !important;
        color: var(--h5-text-secondary) !important;
    }

    /* Tab内容 */
    .DiySite_List_Box_Contet_1 {
        width: 100% !important;
        height: auto !important;
        margin: 0 !important;
        padding: 16px !important;
    }

    .customer_que_pic_1,
    .customer_que_pic_2,
    .customer_que_pic_3,
    .customer_que_pic_4,
    .customer_que_pic_5,
    .customer_que_pic_6 {
        float: none !important;
        width: 100% !important;
        height: auto !important;
        margin: 0 0 16px !important;
        background: none !important;
        padding: 0 !important;
    }

    .customer_que_content ul {
        margin: 0 0 12px !important;
        padding: 0 !important;
    }

    .customer_que_content ul li {
        float: none !important;
        width: 100% !important;
        padding: 10px 0 !important;
        border-bottom: 1px solid var(--h5-border-light) !important;
        font-size: 14px !important;
    }

    .customer_que_content ul li a {
        color: var(--h5-text) !important;
        text-decoration: none !important;
        display: block !important;
    }

    .customer_que_content ul li a:hover {
        color: var(--h5-primary) !important;
    }
}

/* ============ 表格适配 ============ */
@media only screen and (max-width: 768px) {
    table {
        width: 100% !important;
        max-width: 100% !important;
        overflow-x: auto !important;
        display: block !important;
        -webkit-overflow-scrolling: touch !important;
        border-radius: var(--h5-radius-md) !important;
        background: var(--h5-bg-white) !important;
    }

    table thead {
        display: none !important;
    }

    table tbody tr {
        display: block !important;
        margin-bottom: 12px !important;
        border: 1px solid var(--h5-border-light) !important;
        border-radius: var(--h5-radius-md) !important;
        overflow: hidden !important;
    }

    table tbody td {
        display: flex !important;
        justify-content: space-between !important;
        align-items: center !important;
        padding: 10px 14px !important;
        border-bottom: 1px solid var(--h5-border-light) !important;
        text-align: right !important;
        float: none !important;
        width: auto !important;
        font-size: 14px !important;
    }

    table tbody td:last-child {
        border-bottom: none !important;
    }

    table tbody td::before {
        content: attr(data-label) !important;
        font-weight: 600 !important;
        color: var(--h5-text-secondary) !important;
        text-align: left !important;
        margin-right: 10px !important;
        font-size: 13px !important;
    }
}

/* ============ 页脚适配 ============ */
@media only screen and (max-width: 768px) {
    #footer2016 {
        padding: 24px 0 16px !important;
        background: #202124 !important;
        color: #9aa0a6 !important;
    }

    #footer2016 .wide1190 {
        padding: 0 16px !important;
    }

    #footer2016 .footer-col {
        float: none !important;
        width: 100% !important;
        margin: 0 0 20px !important;
        text-align: left !important;
    }

    #footer2016 .footer-col h4,
    #footer2016 .footer-col h3 {
        font-size: 15px !important;
        margin-bottom: 12px !important;
        text-align: left !important;
        color: #fff !important;
    }

    #footer2016 .footer-col ul li {
        padding: 6px 0 !important;
        text-align: left !important;
    }

    #footer2016 .footer-col ul li a {
        color: #9aa0a6 !important;
        text-decoration: none !important;
        font-size: 14px !important;
    }

    #footer2016 .footer-col ul li a:hover {
        color: #fff !important;
    }

    #footer2016 .footer-bottom {
        text-align: center !important;
        padding: 16px 12px 0 !important;
        border-top: 1px solid #3c4043 !important;
    }

    #footer2016 .footer-bottom .copyright,
    #footer2016 .footer-bottom .copyright-info {
        float: none !important;
        display: block !important;
        margin: 4px 0 !important;
        text-align: center !important;
        color: #9aa0a6 !important;
        font-size: 13px !important;
    }

    #footer2016 .footer-bottom .icp {
        float: none !important;
        display: block !important;
        margin: 8px 0 0 !important;
    }
}

/* ============ 弹窗/模态框适配 ============ */
@media only screen and (max-width: 768px) {
    .modal-dialog,
    .popup,
    .dialog,
    .alert-box {
        width: 94% !important;
        max-width: 94% !important;
        margin: 12px auto !important;
        border-radius: var(--h5-radius-lg) !important;
        overflow: hidden !important;
    }

    .modal-content,
    .popup-content {
        padding: 20px !important;
    }

    .modal-header,
    .popup-header {
        padding: 16px 20px !important;
        border-bottom: 1px solid var(--h5-border-light) !important;
    }

    .modal-footer,
    .popup-footer {
        padding: 16px 20px !important;
        border-top: 1px solid var(--h5-border-light) !important;
    }
}

/* ============ 面包屑导航 ============ */
@media only screen and (max-width: 768px) {
    .bread-crumb,
    #SiteMapPath {
        padding: 10px 16px !important;
        font-size: 13px !important;
        color: var(--h5-text-hint) !important;
        background: var(--h5-bg) !important;
        border-bottom: 1px solid var(--h5-border-light) !important;
    }

    #SiteMapPath ul li {
        float: none !important;
        display: inline-block !important;
        padding: 0 4px !important;
        background: none !important;
        font-size: 13px !important;
    }
}

/* ============ 返回顶部按钮 ============ */
@media only screen and (max-width: 768px) {
    .back-top,
    #backTop,
    .back-to-top {
        right: 16px !important;
        bottom: 24px !important;
        width: 44px !important;
        height: 44px !important;
        line-height: 44px !important;
        font-size: 18px !important;
        border-radius: 50% !important;
        background: var(--h5-primary) !important;
        color: #fff !important;
        box-shadow: var(--h5-shadow-lg) !important;
        z-index: 999 !important;
        display: none !important;
    }

    .back-top.visible,
    #backTop.visible {
        display: block !important;
    }
}

/* ============ 滚动优化 ============ */
@media only screen and (max-width: 768px) {
    html {
        scroll-behavior: auto !important;
    }

    body {
        overscroll-behavior-y: contain !important;
    }

    ::-webkit-scrollbar {
        width: 0 !important;
        height: 0 !important;
        display: none !important;
    }
}

/* ============ 触摸手势优化 ============ */
@media only screen and (max-width: 768px) {
    .no-dbl-tap {
        touch-action: manipulation !important;
    }

    .no-context-menu {
        -webkit-touch-callout: none !important;
        -webkit-user-select: none !important;
        user-select: none !important;
    }

    /* 禁用hover效果，使用:active代替 */
    *:hover:not(:focus) {
        outline: none !important;
    }

    a:active,
    button:active {
        opacity: 0.7 !important;
    }
}

/* ============ 安全区域适配 (iPhone X+) ============ */
@supports (padding: max(0px)) {
    @media only screen and (max-width: 768px) {
        #header2016 {
            padding-top: max(0px, env(safe-area-inset-top)) !important;
        }

        #footer2016 {
            padding-bottom: max(16px, env(safe-area-inset-bottom)) !important;
        }

        .safe-area-bottom {
            padding-bottom: max(12px, env(safe-area-inset-bottom)) !important;
        }
    }
}

/* ============ 横屏适配 ============ */
@media only screen and (max-height: 500px) and (orientation: landscape) {
    #banner,
    .sec-banner {
        height: 120px !important;
    }

    #banner .slide-wrapper li,
    .sec-banner .slide-wrapper li {
        height: 120px !important;
    }

    #header2016 .header-nav-content {
        height: 48px !important;
        min-height: 48px !important;
    }
}

/* ============ 加载动画 ============ */
@keyframes h5-fade-in {
    from { opacity: 0; transform: translateY(10px); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes h5-slide-up {
    from { transform: translateY(100%); }
    to { transform: translateY(0); }
}

@media only screen and (max-width: 768px) {
    .fade-in {
        animation: h5-fade-in 0.3s ease-out;
    }
}
