/* ==========================================================================
   超级兼容性样式表 - 支持所有浏览器和操作系统
   支持: IE6+, Chrome 1+, Firefox 1+, Safari 3+, Opera 9+, Edge All
   操作系统: Windows XP+, macOS 10.4+, Linux, iOS, Android, Windows Mobile
   ========================================================================== */

/* ========== 基础重置和兼容性修复 ========== */

/* 通用重置 - 兼容所有浏览器 */
* {
    margin: 0;
    padding: 0;
    /* IE6/7 盒模型修复 */
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -ms-box-sizing: border-box;
    -o-box-sizing: border-box;
    box-sizing: border-box;
    /* IE6 双边距bug修复 */
    *display: inline;
    *zoom: 1;
}

/* IE6/7 HTML5元素支持 */
article, aside, details, figcaption, figure, footer, header, hgroup, main, nav, section, summary {
    display: block;
    /* IE6/7 */
    *display: inline;
    *zoom: 1;
}

/* 字体渲染优化 - 全平台 */
body {
    font-family: 'Noto Sans SC', 'Microsoft YaHei', '微软雅黑', 'SimSun', '宋体', Arial, sans-serif;
    line-height: 1.6;
    color: #333;
    background-color: #f8f9fa;
    
    /* Windows 字体渲染优化 */
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    font-smooth: always;
    -webkit-text-stroke: 0.01em transparent;
    
    /* 移动端字体大小调整 */
    -webkit-text-size-adjust: 100%;
    -ms-text-size-adjust: 100%;
    text-size-adjust: 100%;
    
    /* IE6/7 最小高度 */
    min-height: 100%;
    *height: 100%;
    
    /* 防止水平滚动条 */
    overflow-x: hidden;
    word-wrap: break-word;
}

/* IE6 PNG透明度修复 */
.png-fix {
    behavior: url(iepngfix.htc);
}

/* ========== 容器和布局兼容性 ========== */

.container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
    
    /* IE6/7 居中对齐 */
    *text-align: center;
    
    /* 清除浮动 */
    *zoom: 1;
}

.container:before,
.container:after {
    content: "";
    display: table;
}

.container:after {
    clear: both;
}

/* ========== 导航栏超级兼容性 ========== */

.navbar {
    background-color: #222864;
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 1000;
    min-height: 60px;
    
    /* IE6 固定定位模拟 */
    *position: absolute;
    *top: expression(eval(document.documentElement.scrollTop));
    
    /* 防止闪烁 */
    -webkit-backface-visibility: hidden;
    -moz-backface-visibility: hidden;
    backface-visibility: hidden;
}

.nav-container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
    position: relative;
    
    /* Flexbox 完整兼容 */
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    
    /* IE6/7 降级方案 */
    *display: block;
    *zoom: 1;
    
    /* 对齐方式 */
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

/* IE6/7 导航容器降级 */
.ie6 .nav-container,
.ie7 .nav-container {
    height: 60px;
    line-height: 60px;
}

.nav-logo {
    /* Flexbox 兼容 */
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    
    /* IE6/7 降级 */
    *display: inline;
    *zoom: 1;
    *vertical-align: middle;
}

.logo-img {
    height: 24px;
    width: auto;
    vertical-align: middle;
    display: block;
    
    /* IE6/7 图片修复 */
    *display: inline;
    *zoom: 1;
    
    /* IE6 PNG修复 */
    filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod=scale);
}

.nav-menu {
    /* Flexbox 兼容 */
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    
    list-style: none;
    
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -moz-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    
    -webkit-box-pack: end;
    -webkit-justify-content: flex-end;
    -moz-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    
    /* IE6/7 降级 */
    *float: right;
    *display: inline;
    *zoom: 1;
}

.nav-menu li {
    margin: 0 1rem;
    
    /* IE6/7 */
    *display: inline;
    *zoom: 1;
    *margin: 0 8px;
}

.nav-menu a {
    color: white;
    text-decoration: none;
    font-weight: 400;
    font-size: 0.9rem;
    
    /* 过渡效果兼容 */
    -webkit-transition: color 0.3s ease;
    -moz-transition: color 0.3s ease;
    -ms-transition: color 0.3s ease;
    -o-transition: color 0.3s ease;
    transition: color 0.3s ease;
    
    /* IE6/7 */
    *zoom: 1;
}

.nav-menu a:hover {
    color: #a8b3d9;
    
    /* IE6 hover修复 */
    *color: #a8b3d9;
}

/* ========== 按钮超级兼容性 ========== */

.login-btn,
.btn-primary,
.btn-secondary,
.wechat-btn,
.shidu-btn,
.huace-btn,
.service-btn {
    display: inline-block;
    padding: 12px 24px;
    border-radius: 10px;
    font-weight: 600;
    border: none;
    text-decoration: none;
    cursor: pointer;
    text-align: center;
    vertical-align: middle;
    
    /* 过渡效果完整兼容 */
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -ms-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
    
    /* Transform 兼容 */
    -webkit-transform: translateZ(0);
    -moz-transform: translateZ(0);
    -ms-transform: translateZ(0);
    -o-transform: translateZ(0);
    transform: translateZ(0);
    
    /* 硬件加速 */
    -webkit-backface-visibility: hidden;
    -moz-backface-visibility: hidden;
    backface-visibility: hidden;
    will-change: transform;
    
    /* IE6/7 */
    *display: inline;
    *zoom: 1;
    *cursor: hand;
    
    /* 防止选中 */
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

.login-btn {
    background-color: #e74c3c;
    color: white !important;
    
    /* 渐变兼容 */
    background: #e74c3c;
    background: -webkit-gradient(linear, left top, left bottom, from(#e74c3c), to(#c0392b));
    background: -webkit-linear-gradient(top, #e74c3c, #c0392b);
    background: -moz-linear-gradient(top, #e74c3c, #c0392b);
    background: -ms-linear-gradient(top, #e74c3c, #c0392b);
    background: -o-linear-gradient(top, #e74c3c, #c0392b);
    background: linear-gradient(to bottom, #e74c3c, #c0392b);
    
    /* IE6-9 渐变滤镜 */
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#e74c3c', endColorstr='#c0392b', GradientType=0);
    -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr='#e74c3c', endColorstr='#c0392b', GradientType=0)";
}

.login-btn:hover,
.btn-primary:hover,
.btn-secondary:hover {
    /* Transform 悬停效果 */
    -webkit-transform: translateY(-2px);
    -moz-transform: translateY(-2px);
    -ms-transform: translateY(-2px);
    -o-transform: translateY(-2px);
    transform: translateY(-2px);
    
    /* 阴影效果 */
    -webkit-box-shadow: 0 5px 15px rgba(231, 76, 60, 0.4);
    -moz-box-shadow: 0 5px 15px rgba(231, 76, 60, 0.4);
    box-shadow: 0 5px 15px rgba(231, 76, 60, 0.4);
    
    /* IE6/7 阴影模拟 */
    *filter: progid:DXImageTransform.Microsoft.Shadow(color=#666666, Direction=135, Strength=3);
}



/* ========== 响应式设计超级兼容 ========== */

/* ===== 按钮兼容性 ===== */
.btn {
    display: inline-block !important;
    padding: 12px 24px !important;
    border-radius: 10px !important;
    text-decoration: none !important;
    font-weight: 600 !important;
    font-size: 1rem !important;
    cursor: pointer !important;
    border: none !important;
    
    /* 过渡效果兼容性 */
    -webkit-transition: all 0.3s ease !important;
    -moz-transition: all 0.3s ease !important;
    -o-transition: all 0.3s ease !important;
    transition: all 0.3s ease !important;
    
    /* 防止文本选择 */
    -webkit-user-select: none !important;
    -moz-user-select: none !important;
    -ms-user-select: none !important;
    user-select: none !important;
}

.btn:hover {
    text-decoration: none !important;
    
    /* Transform 兼容性 */
    -webkit-transform: translateY(-2px) !important;
    -moz-transform: translateY(-2px) !important;
    -ms-transform: translateY(-2px) !important;
    -o-transform: translateY(-2px) !important;
    transform: translateY(-2px) !important;
}

/* 微信公众号按钮 */
.wechat-btn {
    background: #27ae60 !important;
    background: -webkit-linear-gradient(135deg, #27ae60, #2ecc71) !important;
    background: -moz-linear-gradient(135deg, #27ae60, #2ecc71) !important;
    background: -o-linear-gradient(135deg, #27ae60, #2ecc71) !important;
    background: linear-gradient(135deg, #27ae60, #2ecc71) !important;
    color: white !important;
    
    /* IE 滤镜降级 */
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff27ae60', endColorstr='#ff2ecc71')\9;
}

.wechat-btn:hover {
    color: white !important;
    -webkit-box-shadow: 0 5px 15px rgba(39, 174, 96, 0.4) !important;
    -moz-box-shadow: 0 5px 15px rgba(39, 174, 96, 0.4) !important;
    box-shadow: 0 5px 15px rgba(39, 174, 96, 0.4) !important;
}

/* 十度同学按钮 */
.shidu-btn {
    background: #667eea !important;
    background: -webkit-linear-gradient(135deg, #667eea, #764ba2) !important;
    background: -moz-linear-gradient(135deg, #667eea, #764ba2) !important;
    background: -o-linear-gradient(135deg, #667eea, #764ba2) !important;
    background: linear-gradient(135deg, #667eea, #764ba2) !important;
    color: white !important;
    
    /* IE 滤镜降级 */
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff667eea', endColorstr='#ff764ba2')\9;
}

.shidu-btn:hover {
    color: white !important;
    -webkit-box-shadow: 0 5px 15px rgba(118, 75, 162, 0.4) !important;
    -moz-box-shadow: 0 5px 15px rgba(118, 75, 162, 0.4) !important;
    box-shadow: 0 5px 15px rgba(118, 75, 162, 0.4) !important;
}

/* 画册按钮 */
.huace-btn {
    background: #ff6b6b !important;
    background: -webkit-linear-gradient(135deg, #ff6b6b, #ee5a24) !important;
    background: -moz-linear-gradient(135deg, #ff6b6b, #ee5a24) !important;
    background: -o-linear-gradient(135deg, #ff6b6b, #ee5a24) !important;
    background: linear-gradient(135deg, #ff6b6b, #ee5a24) !important;
    color: white !important;
    
    /* IE 滤镜降级 */
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffff6b6b', endColorstr='#ffee5a24')\9;
}

.huace-btn:hover {
    color: white !important;
    -webkit-box-shadow: 0 5px 15px rgba(238, 90, 36, 0.4) !important;
    -moz-box-shadow: 0 5px 15px rgba(238, 90, 36, 0.4) !important;
    box-shadow: 0 5px 15px rgba(238, 90, 36, 0.4) !important;
}

/* 在线客服按钮 */
.service-btn {
    background: #3498db !important;
    background: -webkit-linear-gradient(135deg, #3498db, #2980b9) !important;
    background: -moz-linear-gradient(135deg, #3498db, #2980b9) !important;
    background: -o-linear-gradient(135deg, #3498db, #2980b9) !important;
    background: linear-gradient(135deg, #3498db, #2980b9) !important;
    color: white !important;
    
    /* IE 滤镜降级 */
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff3498db', endColorstr='#ff2980b9')\9;
}

.service-btn:hover {
    color: white !important;
    -webkit-box-shadow: 0 5px 15px rgba(52, 152, 219, 0.4) !important;
    -moz-box-shadow: 0 5px 15px rgba(52, 152, 219, 0.4) !important;
    box-shadow: 0 5px 15px rgba(52, 152, 219, 0.4) !important;
}

/* ===== 导航栏兼容性 ===== */
.navbar {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    z-index: 1000 !important;
    background: rgba(34, 40, 100, 0.95) !important;
    
    /* IE 滤镜降级 */
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f2222864', endColorstr='#f2222864')\9;
    
    /* 模糊效果兼容性 */
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
}

.nav-container {
    /* Flexbox 兼容性 */
    display: -webkit-box !important;
    display: -webkit-flex !important;
    display: -moz-box !important;
    display: -ms-flexbox !important;
    display: flex !important;
    
    -webkit-box-align: center !important;
    -webkit-align-items: center !important;
    -moz-box-align: center !important;
    -ms-flex-align: center !important;
    align-items: center !important;
    
    -webkit-box-pack: justify !important;
    -webkit-justify-content: space-between !important;
    -moz-box-pack: justify !important;
    -ms-flex-pack: justify !important;
    justify-content: space-between !important;
    
    padding: 0 2rem !important;
    min-height: 60px !important;
}

.nav-logo {
    /* Flexbox 兼容性 */
    display: -webkit-box !important;
    display: -webkit-flex !important;
    display: -moz-box !important;
    display: -ms-flexbox !important;
    display: flex !important;
    
    -webkit-box-align: center !important;
    -webkit-align-items: center !important;
    -moz-box-align: center !important;
    -ms-flex-align: center !important;
    align-items: center !important;
    
    text-decoration: none !important;
    color: white !important;
}

.logo-img {
    height: 24px !important;
    width: auto !important;
    margin-right: 10px !important;
}

.nav-menu {
    /* Flexbox 兼容性 */
    display: -webkit-box !important;
    display: -webkit-flex !important;
    display: -moz-box !important;
    display: -ms-flexbox !important;
    display: flex !important;
    
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
    gap: 2rem !important;
}

.nav-menu li {
    margin: 0 !important;
}

.nav-menu a {
    color: white !important;
    text-decoration: none !important;
    font-weight: 500 !important;
    
    /* 过渡效果兼容性 */
    -webkit-transition: color 0.3s ease !important;
    -moz-transition: color 0.3s ease !important;
    -o-transition: color 0.3s ease !important;
    transition: color 0.3s ease !important;
}

.nav-menu a:hover {
    color: #a8b3d9 !important;
    text-decoration: none !important;
}

/* 汉堡菜单兼容性 */
.hamburger {
    display: none !important;
    
    /* Flexbox 兼容性 */
    -webkit-flex-direction: column !important;
    -moz-flex-direction: column !important;
    -ms-flex-direction: column !important;
    flex-direction: column !important;
    
    cursor: pointer !important;
}

.hamburger span {
    width: 25px !important;
    height: 3px !important;
    background-color: white !important;
    margin: 3px 0 !important;
    
    /* 过渡效果兼容性 */
    -webkit-transition: 0.3s !important;
    -moz-transition: 0.3s !important;
    -o-transition: 0.3s !important;
    transition: 0.3s !important;
}

.hamburger.active span:nth-child(1) {
    /* Transform 兼容性 */
    -webkit-transform: rotate(-45deg) translate(-5px, 6px) !important;
    -moz-transform: rotate(-45deg) translate(-5px, 6px) !important;
    -ms-transform: rotate(-45deg) translate(-5px, 6px) !important;
    -o-transform: rotate(-45deg) translate(-5px, 6px) !important;
    transform: rotate(-45deg) translate(-5px, 6px) !important;
}

.hamburger.active span:nth-child(2) {
    opacity: 0 !important;
}

.hamburger.active span:nth-child(3) {
    /* Transform 兼容性 */
    -webkit-transform: rotate(45deg) translate(-5px, -6px) !important;
    -moz-transform: rotate(45deg) translate(-5px, -6px) !important;
    -ms-transform: rotate(45deg) translate(-5px, -6px) !important;
    -o-transform: rotate(45deg) translate(-5px, -6px) !important;
    transform: rotate(45deg) translate(-5px, -6px) !important;
}

/* 标准媒体查询 */
@media screen and (max-width: 768px) {
     .container {
        padding: 0 1rem !important;
    }
    
    /* 移动端导航 */
    .hamburger {
        display: -webkit-box !important;
        display: -webkit-flex !important;
        display: -moz-box !important;
        display: -ms-flexbox !important;
        display: flex !important;
    }
    
    .nav-menu {
        position: fixed !important;
        top: 60px !important;
        left: -100% !important;
        width: 100% !important;
        height: calc(100vh - 60px) !important;
        background: rgba(34, 40, 100, 0.98) !important;
        
        /* Flexbox 兼容性 */
        -webkit-flex-direction: column !important;
        -moz-flex-direction: column !important;
        -ms-flex-direction: column !important;
        flex-direction: column !important;
        
        -webkit-box-align: center !important;
        -webkit-align-items: center !important;
        -moz-box-align: center !important;
        -ms-flex-align: center !important;
        align-items: center !important;
        
        -webkit-box-pack: start !important;
        -webkit-justify-content: flex-start !important;
        -moz-box-pack: start !important;
        -ms-flex-pack: start !important;
        justify-content: flex-start !important;
        
        padding-top: 2rem !important;
        gap: 1.5rem !important;
        
        /* 过渡效果兼容性 */
        -webkit-transition: left 0.3s ease !important;
        -moz-transition: left 0.3s ease !important;
        -o-transition: left 0.3s ease !important;
        transition: left 0.3s ease !important;
        
        /* IE6/7 */
        *float: none;
        *text-align: center;
    }
    
    .nav-menu.active {
        left: 0 !important;
    }
    
    .nav-menu li {
        margin: 0 !important;
    }
    
    .nav-menu a {
        font-size: 1.2rem !important;
        padding: 1rem !important;
    }
}

/* IE6/7/8 媒体查询模拟 */
.ie6 .sidebar,
.ie7 .sidebar,
.ie8 .sidebar {
    display: none;
}

/* ========== 高DPI显示优化 ========== */

@media (-webkit-min-device-pixel-ratio: 1.25),
       (min-resolution: 120dpi),
       (min-resolution: 1.25dppx) {
    body {
        -webkit-font-smoothing: subpixel-antialiased;
    }
    
    .logo-img {
        image-rendering: -webkit-optimize-contrast;
        image-rendering: crisp-edges;
    }
}

/* ========== 滚动条样式兼容 ========== */

/* Webkit 浏览器 */
::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}

::-webkit-scrollbar-track {
    background: #f1f1f1;
    border-radius: 4px;
}

::-webkit-scrollbar-thumb {
    background: #c1c1c1;
    border-radius: 4px;
}

::-webkit-scrollbar-thumb:hover {
    background: #a8a8a8;
}

/* Firefox */
* {
    scrollbar-width: thin;
    scrollbar-color: #c1c1c1 #f1f1f1;
}

/* IE */
body {
    scrollbar-face-color: #c1c1c1;
    scrollbar-track-color: #f1f1f1;
    scrollbar-arrow-color: #666;
    scrollbar-shadow-color: #dfdfdf;
}

/* ========== 打印样式 ========== */

@media print {
     .navbar {
         display: none !important;
     }
     
     body {
        background: white !important;
        color: black !important;
        font-size: 12pt;
    }
    
    a {
        color: black !important;
        text-decoration: underline !important;
    }
}

/* ========== 无障碍支持 ========== */

@media (prefers-reduced-motion: reduce) {
    * {
        -webkit-animation-duration: 0.01ms !important;
        animation-duration: 0.01ms !important;
        -webkit-animation-iteration-count: 1 !important;
        animation-iteration-count: 1 !important;
        -webkit-transition-duration: 0.01ms !important;
        transition-duration: 0.01ms !important;
    }
}

/* 高对比度模式 */
@media (prefers-contrast: high) {
    .navbar {
        background-color: #000 !important;
        border: 2px solid #fff;
    }
    
    .login-btn {
        background-color: #000 !important;
        color: #fff !important;
        border: 2px solid #fff;
    }
}

/* ========== 特殊浏览器修复 ========== */

/* IE6 专用修复 */
.ie6 * {
    zoom: 1;
}

.ie6 .navbar {
    position: absolute;
    top: expression(eval(document.documentElement.scrollTop));
}

/* IE7 专用修复 */
.ie7 .nav-container {
    *display: inline-block;
    *zoom: 1;
}

/* IE8 专用修复 */
.ie8 .sidebar {
    filter: progid:DXImageTransform.Microsoft.Alpha(opacity=95);
}

/* Safari 3 修复 */
@media screen and (-webkit-min-device-pixel-ratio: 0) {
    .login-btn {
        -webkit-appearance: none;
    }
}

/* Opera 9 修复 */
@media all and (-webkit-min-device-pixel-ratio: 10000), not all and (-webkit-min-device-pixel-ratio: 0) {
    .nav-menu {
        display: table;
    }
    
    .nav-menu li {
        display: table-cell;
        vertical-align: middle;
    }
}

/* ========== 移动端特殊优化 ========== */

/* iOS Safari */
@supports (-webkit-touch-callout: none) {
    .login-btn {
        -webkit-touch-callout: none;
        -webkit-tap-highlight-color: transparent;
    }
}

/* Android 浏览器 */
@media screen and (-webkit-device-pixel-ratio: 1) {
    .navbar {
        -webkit-transform: translateZ(0);
        transform: translateZ(0);
    }
}

/* Windows Phone */
@media screen and (max-device-width: 480px) and (orientation: portrait) {
    .container {
        padding: 0 5px;
    }
}

/* ========== 性能优化 ========== */

/* GPU 加速 */
.navbar,
.login-btn {
    -webkit-transform: translateZ(0);
    -moz-transform: translateZ(0);
    -ms-transform: translateZ(0);
    -o-transform: translateZ(0);
    transform: translateZ(0);
    
    -webkit-backface-visibility: hidden;
    -moz-backface-visibility: hidden;
    backface-visibility: hidden;
    
    -webkit-perspective: 1000;
    -moz-perspective: 1000;
    -ms-perspective: 1000;
    perspective: 1000;
}

/* ========== 调试辅助 ========== */

/* 开发模式边框 */
.debug * {
    outline: 1px solid red;
}

.debug .container {
    outline: 2px solid blue;
}

.debug .navbar {
    outline: 2px solid green;
}

/* 浏览器检测类 */
html.ie6 { }
html.ie7 { }
html.ie8 { }
html.ie9 { }
html.chrome { }
html.firefox { }
html.safari { }
html.opera { }

/* ========== 结束 ========== */