/* ========================================
   同鑫科技官网 - 样式表
   ======================================== */

/* CSS变量定义 */
:root {
    --primary-color: rgb(0, 160, 234);
    --primary-dark: #0088cc;
    --primary-light: #e6f7ff;
    --secondary-color: #ff6b35;
    --text-color: #333333;
    --text-light: #666666;
    --text-muted: #999999;
    --bg-color: #ffffff;
    --bg-light: rgb(230, 247, 255);
    --bg-gray: rgb(230, 247, 255);
    --border-color: #e8e8e8;
    --shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
    --shadow-hover: 0 8px 25px rgba(0, 0, 0, 0.12);
    --transition: all 0.3s ease;
    --font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei', 'Helvetica Neue', Helvetica, Arial, sans-serif;
}

/* 基础重置 */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
}

body {
    font-family: var(--font-family);
    font-size: 14px;
    line-height: 1.6;
    color: var(--text-color);
    background-color: var(--bg-color);
}

a {
    text-decoration: none;
    color: inherit;
    transition: var(--transition);
}

a:hover {
    color: var(--primary-color);
}

ul, ol {
    list-style: none;
}

img {
    max-width: 100%;
    height: auto;
    display: block;
}

.container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
}

/* ========================================
   顶部导航栏
   ======================================== */
.header {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 1000;
    background: var(--bg-color);
    box-shadow: 0 1px 10px rgba(0, 0, 0, 0.08);
    height: 70px;
}

.header-container {
    width: 100%;
    max-width: 1920px;
    margin: 0 auto;
    padding: 0 30px;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    box-sizing: border-box;
}

.logo a {
    display: flex;
    align-items: center;
    font-size: 26px;
    font-weight: bold;
}

.logo-en {
    color: var(--primary-color);
    font-style: italic;
    font-weight: 700;
    letter-spacing: -1px;
}

.logo-cn {
    color: var(--primary-color);
    margin-left: 8px;
    font-style: normal;
}

.main-nav {
    flex: 1;
    display: flex;
    justify-content: flex-end;
}

.nav-list {
    display: flex;
    align-items: center;
    gap: 2px;
    padding-right: 40px;
}

.nav-item a {
    display: block;
    padding: 10px 14px;
    font-size: 15px;
    font-weight: 500;
    color: var(--text-color);
    transition: var(--transition);
    position: relative;
}

.nav-item a:hover,
.nav-item.active a {
    color: var(--primary-color);
}

.header-right {
    display: flex;
    align-items: center;
    gap: 20px;
}

.search-btn {
    cursor: pointer;
    font-size: 16px;
    color: var(--text-light);
    transition: var(--transition);
}

.search-btn:hover {
    color: var(--primary-color);
}

.phone-number {
    display: flex;
    align-items: center;
    gap: 8px;
    color: var(--primary-color);
    font-size: 20px;
    font-weight: 500;
}

.phone-number i {
    font-size: 18px;
}

.btn-demo {
    display: inline-block;
    padding: 10px 24px;
    background: var(--primary-color);
    color: white !important;
    border-radius: 20px;
    font-size: 14px;
    transition: var(--transition);
    text-decoration: none;
}

.btn-demo:hover {
    background: var(--primary-dark);
    color: white !important;
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0, 160, 234, 0.4);
}

/* ---- 用户中心入口图标 ---- */
.user-entry {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    transition: background .2s, transform .2s;
    flex-shrink: 0;
}

.user-entry:hover {
    background: rgba(0, 160, 234, 0.1);
    transform: scale(1.08);
}

.user-entry-icon {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    object-fit: cover;
    display: block;
}

.btn-demo:active {
    background: var(--primary-dark);
    color: white !important;
    transform: translateY(0);
    box-shadow: 0 2px 6px rgba(0, 160, 234, 0.3);
}

.header-icons {
    display: flex;
    gap: 15px;
    font-size: 18px;
    color: var(--text-light);
}

.header-icons i {
    cursor: pointer;
    transition: var(--transition);
}

.header-icons i:hover {
    color: var(--primary-color);
}

/* ========================================
   Banner轮播区
   ======================================== */
.banner {
    margin-top: 70px;
    position: relative;
    width: 100vw;
    aspect-ratio: 1920 / 860;
    height: auto;
    max-height: calc(100vh - 70px);
    margin-left: calc(50% - 50vw);
    overflow: hidden;
}

.banner-slider {
    position: relative;
    height: 100%;
}

.banner-item {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #f3f8fc;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.8s ease, visibility 0.8s ease;
}

.banner-item.active {
    opacity: 1;
    visibility: visible;
}

.banner-image {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center center;
    display: block;
}

.banner-bg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.banner-bg.bg-1 {
    background: linear-gradient(135deg, #e8f4fc 0%, #d4ebf7 30%, #c5e4f5 60%, #b8dff3 100%);
}

.banner-bg.bg-2 {
    background: linear-gradient(135deg, #e0f2fc 0%, #cce9f8 30%, #b8e0f5 60%, #a5d7f2 100%);
}

.banner-bg.bg-3 {
    background: linear-gradient(135deg, #e5f5fd 0%, #d0ecf9 30%, #bce3f6 60%, #a8daf3 100%);
}

.banner-bg::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-image: 
        linear-gradient(rgba(0, 160, 233, 0.03) 1px, transparent 1px),
        linear-gradient(90deg, rgba(0, 160, 233, 0.03) 1px, transparent 1px);
    background-size: 50px 50px;
}

.banner-content {
    position: relative;
    z-index: 2;
    max-width: 1200px;
    margin: 0 auto;
    padding: 140px 50px;
    text-align: left;
}

.banner-title {
    font-size: 52px;
    font-weight: bold;
    color: var(--text-color);
    margin-bottom: 20px;
    animation: fadeInUp 0.8s ease;
}

.banner-subtitle {
    font-size: 46px;
    font-weight: bold;
    color: var(--primary-color);
    margin-bottom: 25px;
    animation: fadeInUp 0.8s ease 0.2s both;
}

.banner-desc {
    font-size: 18px;
    color: var(--text-light);
    animation: fadeInUp 0.8s ease 0.4s both;
}

.banner-decoration {
    position: absolute;
    top: 0;
    right: 0;
    width: 60%;
    height: 100%;
    pointer-events: none;
}

.banner-dots {
    position: absolute;
    bottom: 40px;
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    gap: 10px;
    z-index: 10;
}

.dot {
    width: 30px;
    height: 4px;
    border-radius: 2px;
    background: rgba(0, 160, 233, 0.3);
    cursor: pointer;
    transition: var(--transition);
}

.dot.active {
    background: var(--primary-color);
    width: 50px;
}

@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translateY(30px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* ========================================
   数据统计区
   ======================================== */
.stats {
    padding: 50px 0;
    background: var(--bg-color);
    border-bottom: 1px solid var(--border-color);
}

.stats-list {
    display: flex;
    align-items: center;
}

.stats-item {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 16px;
    flex: 1 1 0;
    position: relative;
}

.stats-item:not(:last-child)::after {
    content: '';
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 1px;
    height: 40px;
    background: #e0e0e0;
}

.stats-icon {
    width: 44px;
    height: 44px;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}

.stats-icon img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.stats-info {
    text-align: left;
}

.stats-num {
    display: flex;
    align-items: flex-start;
    line-height: 1;
}

.stats-num .num {
    font-size: 24px;
    font-weight: 700;
    color: var(--text-color);
    line-height: 1;
}

.stats-num .suffix {
    font-size: 13px;
    font-weight: 700;
    color: var(--text-color);
    line-height: 1;
    margin-left: 1px;
}

.stats-label {
    font-size: 14px;
    color: var(--text-light);
    margin-top: 8px;
    white-space: nowrap;
}

/* ========================================
   通用区块样式
   ======================================== */
.section-header {
    text-align: center;
    margin-bottom: 50px;
}

.section-title {
    font-size: 32px;
    font-weight: bold;
    color: var(--text-color);
    margin-bottom: 15px;
}

.section-desc {
    font-size: 15px;
    color: var(--text-light);
    max-width: 700px;
    margin: 0 auto;
    line-height: 1.8;
}

/* ========================================
   价值主张区
   ======================================== */
.value {
    padding: 80px 0;
    background: rgb(245, 252, 255);
}

.value-cards {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
    margin-bottom: 40px;
}

.value-card {
    text-align: center;
    padding: 50px 35px;
    background: transparent;
    border-radius: 0;
    box-shadow: none;
    border: 1px solid transparent;
    transition: var(--transition);
}

.value-card:hover {
    transform: translateY(-6px);
    border-color: rgba(0, 160, 233, 0.25);
    box-shadow: 0 10px 26px rgba(0, 160, 233, 0.16);
    background: rgba(255, 255, 255, 0.7);
}


.value-icon-image {
    width: 110px;
    height: auto;
    display: block;
    margin: 0 auto;
}

.icon-circle {
    width: 100px;
    height: 100px;
    margin: 0 auto;
    background: linear-gradient(135deg, var(--primary-light) 0%, #d4edff 100%);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
}

.icon-circle::before {
    content: '';
    position: absolute;
    top: -10px;
    left: -10px;
    right: -10px;
    bottom: -10px;
    border-radius: 50%;
    background: linear-gradient(135deg, rgba(0, 160, 233, 0.1) 0%, rgba(0, 160, 233, 0.05) 100%);
    z-index: -1;
}

.icon-circle i {
    font-size: 36px;
    color: var(--primary-color);
}

.value-title {
    font-size: 20px;
    font-weight: bold;
    color: var(--text-color);
    margin-bottom: 15px;
}

.value-desc {
    font-size: 14px;
    color: var(--text-light);
    line-height: 1.8;
}

.value-action {
    text-align: center;
}

.btn-primary {
    display: inline-block;
    padding: 14px 45px;
    background: var(--primary-color);
    color: white !important;
    border-radius: 25px;
    font-size: 16px;
    transition: var(--transition);
    border: none;
    cursor: pointer;
}

.btn-primary:hover {
    background: var(--primary-dark);
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(0, 160, 233, 0.4);
}

.btn-outline {
    display: inline-block;
    padding: 14px 45px;
    background: transparent;
    color: var(--primary-color) !important;
    border: 2px solid var(--primary-color);
    border-radius: 25px;
    font-size: 16px;
    transition: var(--transition);
}

.btn-outline:hover {
    background: var(--primary-color);
    color: white !important;
}

/* ========================================
   产品功能模块
   ======================================== */
.product {
    padding: 80px 0;
    background: var(--bg-color);
}

.product-tabs {
    margin-top: 40px;
}

.tab-nav {
    display: flex;
    justify-content: center;
    gap: 0;
    margin-bottom: 40px;
}

.tab-btn {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 15px 40px 18px;
    background: transparent;
    border-radius: 0;
    cursor: pointer;
    transition: var(--transition);
    min-width: 120px;
    position: relative;
    margin-bottom: -2px;
    border-bottom: 2px solid transparent;
}

.tab-btn i {
    font-size: 26px;
    color: var(--text-muted);
    margin-bottom: 10px;
    transition: var(--transition);
}

.tab-icon-image {
    width: 52px;
    height: 52px;
    margin-bottom: 12px;
    object-fit: contain;
    transition: var(--transition);
}

.tab-btn span {
    font-size: 14px;
    color: var(--text-light);
    transition: var(--transition);
}

.tab-btn:hover,
.tab-btn.active {
    background: transparent;
    border-bottom-color: var(--primary-color);
}

.tab-btn:hover i,
.tab-btn.active i {
    color: var(--primary-color);
}

.tab-btn:hover span,
.tab-btn.active span {
    color: var(--primary-color);
    font-weight: 600;
}

.tab-btn:hover .tab-icon-image,
.tab-btn.active .tab-icon-image {
    transform: scale(1.06);
}

.tab-content {
    /*background: var(--bg-gray);*/
    border-radius: 15px;
    padding: 50px;
}

.tab-panel {
    display: none;
}

.tab-panel.active {
    display: flex;
    align-items: center;
    gap: 60px;
    animation: fadeIn 0.5s ease;
}

@keyframes fadeIn {
    from { opacity: 0; }
    to { opacity: 1; }
}

.panel-text {
    flex: 1;
}

.panel-text h3 {
    font-size: 24px;
    color: var(--text-color);
    margin-bottom: 20px;
}

.panel-text p {
    font-size: 15px;
    color: var(--text-light);
    line-height: 1.9;
    margin-bottom: 30px;
}

.panel-btns {
    display: flex;
    gap: 20px;
}

.panel-btns .btn-primary,
.panel-btns .btn-outline {
    padding: 12px 35px;
    font-size: 14px;
}

.panel-img {
    flex: 1;
    text-align: center;
}

.panel-img img {
    max-width: 100%;
    border-radius: 10px;
    box-shadow: var(--shadow);
}

/* ========================================
   行业解决方案
   ======================================== */
/* ========================================
   行业解决方案 - 圆形导航样式
   ======================================== */
.solution {
    padding: 80px 0;
    background: var(--bg-gray);
}

/* 主容器：左侧内容 + 右侧图片，右侧圆形导航绝对叠加 */
.solution-circle-box {
    position: relative;
    min-height: 700px;
    border-radius: 20px;
    overflow: hidden;
    display: flex;
    flex-direction: row;
    background-image: url('../images/solution/panel_solution.png');
    background-size: cover;
    background-position: center center;
    margin-top: 40px;
}

/* 左侧内容区 */
.solution-circle-left {
    width: 75%;
    padding: 5% 3% 4% 3%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    position: relative;
    z-index: 10;
}

/* 行业标题+描述 */
.solution-circle-info {
    width: 75%;
}

.solution-circle-title {
    font-size: 36px;
    color: #fff;
    line-height: 1.2;
    margin-bottom: 12px;
}

.solution-circle-desc {
    font-size: 18px;
    color: #fff;
    line-height: 1.6;
    min-height: 50px;
    margin-bottom: 16px;
}

.solution-circle-btn {
    display: inline-block;
    padding: 7px 20px;
    border-radius: 20px;
    background: #fff;
    color: var(--primary-color);
    font-size: 14px;
    cursor: pointer;
    transition: var(--transition);
}

.solution-circle-btn:hover {
    background: var(--primary-color);
    color: #fff;
}

/* 功能卡片网格 */
.solution-cards-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 0;
    margin-top: 36px;
    flex: 1;
    width: 70%;
}

.sol-card {
    width: calc(50% - 10px);
    margin-right: 10px;
    margin-bottom: 10px;
    padding: 10px 12px;
    border-radius: 8px;
    border: 0.8px solid rgba(255, 255, 255, 0.8);
    background-color: rgba(154, 180, 255, 0.4);
    display: flex;
    flex-direction: column;
    transition: var(--transition);
}

.sol-card:hover {
    background-color: rgba(154, 180, 255, 0.6);
}

.sol-card h4 {
    font-size: 16px;
    color: #fff;
    line-height: 1.4;
    margin-bottom: 5px;
}

.sol-card p {
    font-size: 12px;
    color: rgba(255, 255, 255, 0.9);
    line-height: 1.5;
    flex: 1;
    margin-bottom: 8px;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.sol-card-link {
    display: inline-block;
    padding: 5px 16px;
    border-radius: 15px;
    border: 1px solid rgba(255, 255, 255, 0.8);
    background-color: rgba(154, 180, 255, 0.4);
    color: #fff;
    font-size: 13px;
    align-self: flex-start;
    transition: var(--transition);
}

.sol-card-link:hover {
    background: rgba(255, 255, 255, 0.3);
    color: #fff;
}

/* 底部客户logo */
.solution-circle-logos {
    display: flex;
    align-items: center;
    gap: 20px;
    padding: 20px 0 10px;
    border-top: 0.5px solid rgba(255, 255, 255, 0.6);
    margin-top: 30px;
    width: 90%;
    overflow: hidden;
}

.solution-circle-logos img {
    height: 46px;
    width: auto;
    object-fit: contain;
    /*filter: brightness(0) invert(1);*/
    opacity: 0.85;
}

/* 右侧图片区 */
.solution-circle-right {
    width: 25%;
    border-radius: 0 20px 20px 0;
    background: #333435;
    overflow: hidden;
    display: flex;
    align-items: stretch;
}

.solution-right-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center top;
    display: block;
}

/* 圆形同心圆导航：居中在左右区域交界处 */
.solution-circle-nav {
    position: absolute;
    top: 5%;
    bottom: 5%;
    /* 左侧75%，右侧25%，交界点在75%处，导航宽度360px，向左偏移一半 */
    left: calc(75% - 180px);
    width: 360px;
    z-index: 50;
    pointer-events: none;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* 正方形容器，用于撑开同心圆 */
.sol-circle-wrap {
    position: relative;
    width: 340px;
    aspect-ratio: 1 / 1;
}

/* 同心圆层 */
.sol-circle {
    position: absolute;
    border-radius: 50%;
    border: 1px solid rgba(255, 255, 255, 0.7);
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.sol-circle-outer {
    width: 100%;
    height: 100%;
    pointer-events: none;
}

.sol-circle-mid {
    width: 66.6%;
    height: 66.6%;
    pointer-events: none;
}

.sol-circle-inner {
    width: 50%;
    height: 50%;
    background-color: rgba(30, 144, 255, 0.2);
    display: flex;
    align-items: center;
    justify-content: center;
    pointer-events: none;
}

/* 中心箭头按钮 */
.sol-circle-center {
    width: 60%;
    height: 60%;
    border-radius: 50%;
    border: 1px solid rgba(255, 255, 255, 0.8);
    background: rgba(94, 96, 97, 0.3);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    pointer-events: all;
    transition: var(--transition);
    gap: 4px;
}

.sol-circle-center:hover {
    background: rgba(0, 160, 234, 0.5);
}

.sol-circle-center i {
    color: #fff;
    font-size: 14px;
    font-weight: bold;
    display: block;
    line-height: 1;
    padding: 4px 10px;
    border-radius: 4px;
    transition: var(--transition);
    pointer-events: all;
    cursor: pointer;
}

.sol-circle-center i:hover {
    background: rgba(255, 255, 255, 0.2);
}

/* 行业tab列表，沿圆弧右侧分布 */
.sol-tab-list {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    list-style: none;
    pointer-events: none;
}

.sol-tab-item {
    position: absolute;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-end;
    height: 20px;
    cursor: pointer;
    pointer-events: all;
}

/* 各tab项的定位（沿右侧圆弧均匀分布） */
.sol-tab-item:nth-child(1) { right: 65%; top: 2px; }
.sol-tab-item:nth-child(2) { right: 87%; top: 15.8%; }
.sol-tab-item:nth-child(3) { right: 95%; top: 31.6%; }
.sol-tab-item:nth-child(4) { right: 97.5%; top: 49%; }
.sol-tab-item:nth-child(5) { right: 95%; top: 64%; }
.sol-tab-item:nth-child(6) { right: 86%; top: 79%; }
.sol-tab-item:nth-child(7) { right: 65%; bottom: 4px; }

.sol-tab-item span {
    font-size: 13px;
    color: rgba(255, 255, 255, 0.7);
    line-height: 20px;
    white-space: nowrap;
    transition: color 0.3s, font-size 0.3s;
    text-decoration: none;
}

.sol-tab-item:hover span,
.sol-tab-item.active span {
    color: #fff;
    font-size: 15px;
}

.sol-tab-dot {
    width: 16px;
    height: 16px;
    border-radius: 50%;
    border: 1px solid rgba(255, 255, 255, 0.8);
    margin-left: 10px;
    background: var(--primary-color);
    flex-shrink: 0;
    transition: var(--transition);
}

.sol-tab-item.active .sol-tab-dot {
    background: #fff;
}

/* 移动端tab切换（默认隐藏，小屏显示） */
.solution-mobile-tabs {
    display: none;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 16px;
    justify-content: center;
}

.sol-mobile-tab {
    padding: 8px 18px;
    border-radius: 20px;
    background: rgba(255, 255, 255, 0.15);
    border: 1px solid rgba(0, 160, 234, 0.4);
    color: var(--text-light);
    font-size: 13px;
    cursor: pointer;
    transition: var(--transition);
}

.sol-mobile-tab.active,
.sol-mobile-tab:hover {
    background: var(--primary-color);
    color: #fff;
    border-color: var(--primary-color);
}

/* 旧样式兼容保留（导航菜单中用到） */
.link-more {
    color: var(--primary-color);
    font-size: 14px;
    display: inline-flex;
    align-items: center;
    gap: 5px;
}

.link-more i {
    font-size: 12px;
    transition: var(--transition);
}

.link-more:hover i {
    transform: translateX(5px);
}

.feature-card {
    background: var(--bg-gray);
    border-radius: 12px;
    padding: 25px;
    transition: var(--transition);
}

.feature-card:hover {
    transform: translateY(-5px);
    box-shadow: var(--shadow);
}

.feature-icon {
    width: 50px;
    height: 50px;
    margin-bottom: 15px;
    background: var(--primary-light);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.feature-icon i {
    font-size: 20px;
    color: var(--primary-color);
}

.feature-card h4 {
    font-size: 16px;
    color: var(--text-color);
    margin-bottom: 10px;
}

.feature-card p {
    font-size: 13px;
    color: var(--text-light);
    line-height: 1.7;
    margin-bottom: 12px;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.feature-card a {
    color: var(--primary-color);
    font-size: 13px;
}

/* ========================================
   客户案例区
   ======================================== */
.cases {
    padding: 80px 0;
    background: var(--bg-color);
    overflow: hidden;
}

.cases .container {
    width: 100%;
    max-width: 1200px;
    min-width: 0;
}

.cases-slider {
    position: relative;
    margin: 0 0 40px;
    padding: 0 52px;
    max-width: 100%;
    min-width: 0;
}

.cases-slider-inner {
    overflow: hidden;
    padding: 20px 4px;
    margin: 0;
    max-width: 100%;
    min-width: 0;
}

.cases-nav {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    z-index: 10;
    width: 44px;
    height: 44px;
    border-radius: 50%;
    border: none;
    background: #fff;
    box-shadow: 0 2px 12px rgba(0,0,0,0.15);
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--text-color);
    font-size: 16px;
    transition: var(--transition);
}

.cases-nav:hover {
    background: var(--primary-color);
    color: #fff;
    box-shadow: 0 4px 16px rgba(0,160,234,0.3);
}

.cases-nav-prev {
    left: 8px;
}

.cases-nav-next {
    right: 8px;
}

.cases-track {
    display: flex;
    gap: 25px;
    transition: transform 0.4s ease;
    min-width: 0;
}

.case-card {
    flex: 0 0 calc(33.333% - 17px);
    max-width: 100%;
    min-width: 0;
    background: var(--bg-color);
    border-radius: 12px;
    overflow: hidden;
    box-shadow: var(--shadow);
    transition: var(--transition);
    cursor: pointer;
}

.case-card:hover {
    box-shadow: var(--shadow-hover);
    transform: translateY(-4px);
}

.case-card-inner {
    border-radius: 12px;
    overflow: hidden;
}

.case-bg {
    position: relative;
    width: 100%;
    height: 220px;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    display: flex;
    align-items: center;
    justify-content: center;
}

.case-bg::after {
    content: '';
    position: absolute;
    inset: 0;
    background: rgba(0,0,0,0.25);
    border-radius: 0;
}

.case-logo-wrap {
    position: relative;
    z-index: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
}

.case-logo-wrap img {
    height: 64px;
    max-width: 180px;
    object-fit: contain;
    background: rgba(255,255,255,0.92);
    border-radius: 10px;
    padding: 8px 16px;
    box-shadow: 0 4px 16px rgba(0,0,0,0.18);
}

.case-content {
    padding: 16px 24px 24px;
}

.case-content h4 {
    font-size: 17px;
    font-weight: 600;
    color: var(--text-color);
    margin-bottom: 10px;
    overflow-wrap: anywhere;
    word-break: break-word;
}

.case-content p {
    font-size: 13px;
    color: var(--text-light);
    line-height: 1.7;
    margin-bottom: 16px;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    overflow-wrap: anywhere;
    word-break: break-word;
    min-height: 66px;
}

.cases-action {
    text-align: center;
}

/* ========================================
   留言咨询区
   ======================================== */
.contact {
    padding: 80px 0;
    background: var(--bg-gray);
}

.contact .container {
    padding-left: 20px;
    padding-right: 20px;
    max-width: 1200px;
}

.contact-wrapper {
    display: flex;
    gap: 60px;
    align-items: flex-start;
}

.contact-info {
    flex: 1 1 auto;
    max-width: none;
    min-width: 400px;
    padding-left: 0;
}

.contact-info h2 {
    font-size: 28px;
    color: var(--text-color);
    margin-bottom: 10px;
}

.contact-en {
    font-size: 13px;
    color: var(--text-muted);
    margin-bottom: 35px;
    letter-spacing: 1px;
}

.contact-list {
    margin-top: 30px;
}

.contact-item {
    margin-bottom: 5px;
    font-size: 15px;
    display: block;
    line-height: 1.8;
}

.contact-item .label {
    color: var(--text-light);
    display: inline;
}

.contact-item .value {
    color: var(--text-color);
    font-weight: 500;
    display: inline;
}

.contact-form {
    flex: 1;
    background: var(--bg-color);
    padding: 40px;
    border-radius: 15px;
    box-shadow: var(--shadow);
}

.form-group {
    margin-bottom: 20px;
}

.form-row {
    display: flex;
    gap: 20px;
    margin-bottom: 20px;
}

.form-row input {
    flex: 1;
}

.contact-form input,
.contact-form textarea {
    width: 100%;
    padding: 14px 18px;
    border: 1px solid var(--border-color);
    border-radius: 8px;
    font-size: 14px;
    font-family: inherit;
    transition: var(--transition);
}

.contact-form input:focus,
.contact-form textarea:focus {
    outline: none;
    border-color: var(--primary-color);
}

.contact-form textarea {
    height: 120px;
    resize: none;
}

.btn-submit {
    width: 100%;
    padding: 14px;
    background: var(--primary-color);
    color: white;
    border: none;
    border-radius: 8px;
    font-size: 16px;
    cursor: pointer;
    transition: var(--transition);
}

.btn-submit:hover {
    background: var(--primary-dark);
}

/* ========================================
   底部Footer
   ======================================== */
.footer {
    background: #333435;
    color: #a8b5c4;
    padding-top: 50px;
}

.footer-main {
    display: flex;
    gap: 60px;
    padding-bottom: 40px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

.footer-links {
    flex: 1;
    display: flex;
    gap: 50px;
}

.footer-col h4 {
    color: white;
    font-size: 15px;
    margin-bottom: 20px;
}

.footer-col ul li {
    margin-bottom: 12px;
}

.footer-col ul li a {
    font-size: 13px;
    color: #a8b5c4;
    transition: var(--transition);
}

.footer-col ul li a:hover {
    color: white;
}

.footer-qrcode {
    text-align: center;
}

.footer-qrcode h4 {
    color: white;
    font-size: 15px;
    margin-bottom: 15px;
}

.qrcode-img {
    width: 120px;
    height: 120px;
    background: white;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.qrcode-img img {
    width: 100px;
    height: 100px;
}

.footer-bottom {
    padding: 20px 0;
    text-align: center;
    font-size: 13px;
}

.footer-bottom p {
    margin-bottom: 5px;
}

.footer-bottom a {
    color: #a8b5c4;
    margin: 0 10px;
}

.footer-bottom a:hover {
    color: white;
}

/* ========================================
   左侧边栏
   ======================================== */
.sidebar-left {
    position: fixed;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    z-index: 999;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.sidebar-item-left {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 12px 16px;
    background: rgba(0, 0, 0, 0.75);
    color: #fff;
    border-radius: 0 25px 25px 0;
    cursor: pointer;
    transition: all 0.3s ease;
    font-size: 13px;
    white-space: nowrap;
    position: relative;
}

.sidebar-item-left:hover {
    background: var(--primary-color);
    padding-right: 20px;
}

.sidebar-item-left i {
    font-size: 16px;
    width: 20px;
    text-align: center;
}

.sidebar-item-left span {
    font-size: 13px;
}

/* 快捷问题下拉 */
.sidebar-item-left.question-wrap {
    position: relative;
}

.question-dropdown {
    display: none;
    position: absolute;
    left: 100%;
    top: 0;
    background: rgba(0, 0, 0, 0.85);
    border-radius: 8px;
    padding: 8px 0;
    min-width: 180px;
    margin-left: 5px;
}

.sidebar-item-left.question-wrap:hover .question-dropdown {
    display: block;
}

.question-item {
    padding: 10px 15px;
    font-size: 13px;
    color: #fff;
    cursor: pointer;
    transition: all 0.3s ease;
    white-space: nowrap;
}

.question-item:hover {
    background: rgba(255, 255, 255, 0.1);
    color: var(--primary-color);
}

/* ========================================
   右侧边栏
   ======================================== */
.sidebar-right {
    position: fixed;
    right: 12px;
    top: 50%;
    transform: translateY(-50%);
    z-index: 999;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

/* 三项整体容器 */
.sidebar-group {
    display: flex;
    flex-direction: column;
    border-radius: 66px;
    overflow: hidden;
    border: 1px solid var(--border-color);
    box-shadow: 0 6px 22px rgba(64, 130, 210, 0.12);
}

.sidebar-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 18px 14px;
    background: #fff;
    cursor: pointer;
    min-width: 72px;
}

/* 容器内相邻项之间的分割线 */
.sidebar-group .sidebar-item + .sidebar-item {
    border-top: 1px solid var(--border-color);
}

.sidebar-item:hover {
    background: #fff;
    color: inherit;
}

.sidebar-item i {
    font-size: 20px;
    color: var(--primary-color);
    margin-bottom: 5px;
    transition: var(--transition);
}

.sidebar-item:hover i {
    color: var(--primary-color);
}

.sidebar-icon {
    width: 32px;
    height: 32px;
    object-fit: contain;
    margin-bottom: 6px;
}

.sidebar-item span {
    font-size: 12px;
    color: var(--text-light);
}

.sidebar-item:hover span {
    color: var(--text-light);
}

/* 回到顶部 —— 单独圆形按钮 */
#topBtn {
    width: 52px;
    height: 52px;
    min-width: 52px;
    padding: 0;
    border-radius: 50%;
    border: 1px solid var(--border-color);
    background: #fff;
    box-shadow: 0 6px 22px rgba(64, 130, 210, 0.12);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    align-self: center;
}

#topBtn:hover {
    background: #fff;
}

#topBtn .sidebar-icon {
    margin-bottom: 0;
}

button.sidebar-item {
    border: none;
    font: inherit;
    color: inherit;
}

/* ========================================
   在线客服弹窗
   ======================================== */
.chat-widget {
    position: fixed;
    inset: 0;
    z-index: 2000;
    display: none;
    background: #e8e8e8;
}

.chat-widget.is-open {
    display: block;
}

body.chat-widget-open {
    overflow: hidden;
}

.chat-widget-close {
    position: absolute;
    top: 20px;
    right: 24px;
    z-index: 2;
    width: 32px;
    height: 32px;
    border: none;
    background: #c5c5c5;
    color: #fff;
    font-size: 22px;
    line-height: 1;
    cursor: pointer;
    border-radius: 50%;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.12);
}

.chat-widget-close:hover {
    background: #b0b0b0;
    color: #fff;
}

.chat-widget-frame {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    border: 0;
    background: #e8e8e8;
}

/* ========================================
   留言弹窗
   ======================================== */
.message-modal {
    position: fixed;
    left: 20px;
    bottom: 20px;
    width: 280px;
    background: white;
    border-radius: 12px;
    box-shadow: 0 5px 30px rgba(0, 0, 0, 0.15);
    z-index: 998;
    overflow: hidden;
}

.modal-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 15px 20px;
    background: linear-gradient(135deg, #9b7dd4 0%, #8b6fc4 100%);
    color: white;
}

.modal-header i {
    cursor: pointer;
}

.modal-body {
    padding: 20px;
}

.modal-phone {
    font-size: 14px;
    color: var(--text-color);
    margin-bottom: 5px;
}

.modal-desc {
    font-size: 12px;
    color: var(--text-muted);
    margin-bottom: 15px;
}

.modal-form textarea {
    width: 100%;
    height: 80px;
    padding: 10px;
    border: 1px dashed var(--border-color);
    border-radius: 6px;
    font-size: 13px;
    resize: none;
    margin-bottom: 10px;
}

.modal-form input {
    width: 100%;
    padding: 10px;
    border: 1px dashed var(--border-color);
    border-radius: 6px;
    font-size: 13px;
    margin-bottom: 10px;
}

.modal-form button {
    width: 100%;
    padding: 10px;
    background: linear-gradient(135deg, #9b7dd4 0%, #8b6fc4 100%);
    color: white;
    border: none;
    border-radius: 6px;
    font-size: 14px;
    cursor: pointer;
    transition: var(--transition);
}

.modal-form button:hover {
    opacity: 0.9;
}

/* ========================================
   响应式设计
   ======================================== */
@media (max-width: 1200px) {
    .nav-item a {
        padding: 10px 12px;
        font-size: 14px;
    }
    
    .stats-list {
        flex-wrap: wrap;
        justify-content: center;
        gap: 30px;
    }
    
    .stats-item {
        flex: 0 0 calc(33.33% - 20px);
        justify-content: center;
    }
    
    .stats-item::after {
        display: none;
    }
    
    /* 荣誉资质响应式 - 小屏桌面/平板横屏 */
    .honor-featured {
        flex: 0 0 340px;
    }
}

@media (max-width: 992px) {
    .header-container {
        padding: 0 15px;
    }
    
    .main-nav {
        display: none;
    }
    
    .banner-title {
        font-size: 36px;
    }
    
    .banner-subtitle {
        font-size: 32px;
    }
    
    .value-cards {
        grid-template-columns: 1fr;
    }
    
    .tab-nav {
        flex-wrap: wrap;
    }
    
    .tab-panel.active {
        flex-direction: column;
    }
    
    /* 行业解决方案响应式 - 平板 */
    .solution-circle-box {
        min-height: 480px;
    }

    .solution-circle-left {
        width: 75%;
    }

    .solution-circle-right {
        width: 25%;
    }

    .solution-circle-info {
        width: 75%;
    }

    .solution-circle-title {
        font-size: 28px;
    }

    .solution-circle-desc {
        font-size: 15px;
    }

    .sol-card h4 {
        font-size: 15px;
    }

    .solution-circle-nav {
        width: 280px;
        left: calc(75% - 140px);
    }

    .sol-circle-wrap {
        width: 260px;
    }

    .sol-tab-item span {
        font-size: 12px;
    }

    .cases-slider {
        margin: 0 0 40px;
        padding: 0 44px;
    }

    .cases-nav-prev {
        left: 0;
    }

    .cases-nav-next {
        right: 0;
    }

    .case-card {
        flex: 0 0 calc(50% - 13px);
    }
    
    .contact-wrapper {
        flex-direction: column;
    }
    
    .footer-main {
        flex-direction: column;
    }
    
    .footer-links {
        flex-wrap: wrap;
    }
    
    .sidebar-left,
    .sidebar-right {
        display: none;
    }
}

@media (max-width: 768px) {
    .banner {
        height: auto;
        max-height: none;
    }
    
    .banner-content {
        padding: 80px 20px;
    }
    
    .banner-title {
        font-size: 28px;
    }
    
    .banner-subtitle {
        font-size: 24px;
    }
    
    .section-title {
        font-size: 24px;
    }
    
    .stats-item {
        flex: 0 0 calc(50% - 15px);
    }
    
    .stats-item::after {
        display: none;
    }
    
    .cases-slider {
        margin: 0 0 28px;
        padding: 0 36px;
    }

    .case-card {
        flex: 0 0 100%;
        max-width: 100%;
    }

    .case-bg {
        height: 180px;
    }

    .case-content {
        padding: 14px 16px 18px;
    }

    .cases-nav-prev {
        left: 0;
    }

    .cases-nav-next {
        right: 0;
    }
    
    .footer-col {
        flex: 0 0 calc(50% - 25px);
    }

    /* 行业解决方案响应式 - 手机 */
    .solution-mobile-tabs {
        display: flex;
    }

    .solution-circle-box {
        flex-direction: column;
        min-height: auto;
        background-size: cover;
        border-radius: 12px;
    }

    .solution-circle-left {
        width: 100%;
        padding: 24px 20px 16px;
    }

    .solution-circle-info {
        width: 100%;
    }

    .solution-circle-title {
        font-size: 22px;
    }

    .solution-circle-desc {
        font-size: 14px;
    }

    .solution-cards-grid {
        flex-direction: row;
        width: 100%;
    }

    .sol-card {
        width: calc(50% - 8px);
        margin-right: 8px;
    }

    .solution-circle-right {
        width: 100%;
        height: 160px;
        border-radius: 0 0 12px 12px;
    }

    .solution-right-img {
        object-position: center 20%;
    }

    /* 移动端隐藏圆形导航 */
    .solution-circle-nav {
        display: none;
    }

    .solution-circle-logos {
        gap: 12px;
        flex-wrap: wrap;
        width: 100%;
    }

    .solution-circle-logos img {
        height: 36px;
    }
}


/* ========================================
   导航下拉菜单样式
   ======================================== */

/* 普通下拉菜单 */
.nav-item.has-dropdown {
    position: relative;
}

.nav-item.has-dropdown > a::after {
    display: none;
}

.nav-item.has-dropdown:hover > a::after {
    display: none;
}

.dropdown-menu {
    position: absolute;
    top: 100%;
    left: 50%;
    transform: translateX(-50%);
    min-width: 140px;
    background: #fff;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
    border-radius: 8px;
    padding: 10px 0;
    opacity: 0;
    visibility: hidden;
    transition: all 0.3s ease;
    z-index: 1001;
}

.nav-item.has-dropdown:hover .dropdown-menu {
    opacity: 1;
    visibility: visible;
}

.dropdown-menu li {
    padding: 0;
}

.dropdown-menu li a {
    display: block;
    padding: 10px 20px;
    color: var(--text-color);
    font-size: 14px;
    white-space: nowrap;
    transition: all 0.3s ease;
}

.dropdown-menu li a:hover {
    background: var(--primary-light);
    color: var(--primary-color);
}

/* Mega Menu 大型下拉菜单 */
.nav-item.has-mega-menu {
    position: static;
}

.nav-item.has-mega-menu > a::after {
    display: none;
}

.nav-item.has-mega-menu:hover > a::after {
    display: none;
}

.mega-menu {
    position: absolute;
    top: 70px;
    left: 0;
    right: 0;
    background: #fff;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
    opacity: 0;
    visibility: hidden;
    transition: all 0.3s ease;
    z-index: 1001;
}

.nav-item.has-mega-menu:hover .mega-menu {
    opacity: 1;
    visibility: visible;
}

.mega-menu-inner {
    max-width: 1200px;
    margin: 0 auto;
    padding: 30px 40px;
    display: flex;
    gap: 40px;
}

.mega-col {
    min-width: 150px;
}

.mega-col-wide {
    flex: 1;
}

.mega-title {
    font-size: 16px;
    font-weight: 600;
    color: var(--primary-color);
    margin-bottom: 15px;
    padding-bottom: 10px;
    border-bottom: 1px solid var(--border-color);
}

.mega-links {
    list-style: none;
    padding: 0;
    margin: 0;
}

.mega-links li {
    margin-bottom: 8px;
}

.mega-links li a {
    display: flex;
    align-items: center;
    padding: 8px 12px;
    color: var(--text-color);
    font-size: 14px;
    border-radius: 6px;
    transition: all 0.3s ease;
}

.mega-links li a:hover {
    background: var(--primary-light);
    color: var(--primary-color);
}

.mega-links li a .link-icon {
    display: inline-block;
    width: 8px;
    height: 8px;
    background: var(--primary-color);
    border-radius: 5px;
    margin-right: 10px;
    opacity: 0.6;
}

.mega-grid {
    display: flex;
    gap: 30px;
}

.mega-grid .mega-links {
    flex: 1;
}

/* 解决方案网格样式 */
.solution-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 12px;
    margin-bottom: 20px;
}

.solution-item {
    display: block;
    overflow: hidden;
    padding: 14px 16px;
    background: transparent;
    border-radius: 8px;
    transition: background 0.3s, transform 0.3s;
    text-decoration: none;
}

.solution-item:hover {
    background: rgba(0, 174, 236, 0.06);
    transform: translateY(-2px);
}

.solution-item i {
    float: left;
    font-size: 16px;
    color: #fff;
    width: 36px;
    height: 36px;
    line-height: 36px;
    text-align: center;
    background: var(--primary-color);
    clip-path: polygon(25% 0%, 75% 0%, 100% 50%, 75% 100%, 25% 100%, 0% 50%);
    border-radius: 0;
    margin-right: 14px;
    transform: rotate(90deg);
    flex-shrink: unset;
    display: block;
}
.solution-item i::before {
    transform: rotate(-90deg);
    display: block;
}
.solution-item .solution-icon {
    float: left;
    width: 36px;
    height: 36px;
    margin-right: 14px;
}
.solution-item div {
    overflow: hidden;
}

.solution-item h5 {
    font-size: 14px;
    font-weight: 600;
    color: #222;
}

.solution-item p {
    font-size: 12px;
    color: #999;
    line-height: 1.4;
}

/* Mega Menu CTA */
.mega-cta {
    margin-top: 20px;
    padding: 15px;
    background: linear-gradient(135deg, var(--primary-light), #fff);
    border-radius: 8px;
}

.mega-cta p {
    font-size: 13px;
    color: var(--text-light);
    margin-bottom: 8px;
}

.mega-cta .cta-link {
    display: inline-flex;
    align-items: center;
    font-size: 14px;
    font-weight: 600;
    color: var(--primary-color);
}

.mega-cta .cta-link i {
    margin-left: 5px;
    font-size: 12px;
    transition: transform 0.3s ease;
}

.mega-cta .cta-link:hover i {
    transform: translateX(3px);
}

/* 产品服务 Mega Menu 特殊样式 */
.product-mega .mega-menu-inner {
    padding: 25px 40px;
}

.product-mega .mega-col:first-child {
    min-width: 120px;
    border-right: 1px solid var(--border-color);
    padding-right: 30px;
}

.product-mega .mega-col:last-child {
    min-width: 160px;
    border-left: 1px solid var(--border-color);
    padding-left: 30px;
}

/* 解决方案 Mega Menu 特殊样式 */
.solution-mega .mega-menu-inner {
    padding: 25px 40px;
}

.solution-mega .mega-col:first-child {
    min-width: 180px;
    border-right: 1px solid var(--border-color);
    padding-right: 30px;
}

/* 响应式调整 */
@media (max-width: 1200px) {
    .solution-grid {
        grid-template-columns: repeat(1, 1fr);
    }
}

@media (max-width: 992px) {
    .mega-menu {
        display: none;
    }
    
    .dropdown-menu {
        display: none;
    }
}


/* ========================================
   更新：左侧边栏样式
   ======================================== */
.sidebar-question-wrap {
    position: relative;
    margin-bottom: 10px;
}

.question-toggle {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 15px;
    background: rgba(0, 0, 0, 0.75);
    border-radius: 0 20px 20px 0;
    cursor: pointer;
    transition: all 0.3s ease;
}

.question-toggle i {
    color: #fff;
    font-size: 16px;
}

.question-preview {
    color: #fff;
    font-size: 13px;
    white-space: nowrap;
    max-width: 150px;
    overflow: hidden;
    text-overflow: ellipsis;
}

.question-list {
    display: none;
    position: absolute;
    left: 0;
    top: 100%;
    background: rgba(0, 0, 0, 0.85);
    border-radius: 0 8px 8px 0;
    padding: 8px 0;
    min-width: 200px;
    margin-top: 5px;
}

.question-toggle:hover + .question-list,
.question-list:hover {
    display: block;
}

.question-item {
    padding: 10px 15px;
    font-size: 13px;
    color: #fff;
    cursor: pointer;
    transition: all 0.3s ease;
    white-space: nowrap;
}

.question-item:hover {
    background: rgba(255, 255, 255, 0.1);
    color: var(--primary-color);
}

/* ========================================
   更新：留言弹窗样式
   ======================================== */
.message-panel {
    position: fixed;
    left: 20px;
    bottom: 20px;
    width: 220px;
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 5px 30px rgba(0, 0, 0, 0.15);
    z-index: 998;
    overflow: hidden;
    transition: all 0.3s ease;
}

.message-panel .message-body {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.3s ease;
}

.message-panel.expanded .message-body {
    max-height: 500px;
}

.message-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 12px 15px;
    background: linear-gradient(135deg, #9b7dd4 0%, #8b6fc4 100%);
    color: #fff;
    cursor: pointer;
}

.message-header span {
    font-size: 14px;
    font-weight: 500;
}

.message-header i {
    font-size: 14px;
    transition: transform 0.3s ease;
}

.message-panel.expanded .message-header i {
    transform: rotate(180deg);
}

.message-body {
    padding: 0;
}

.message-panel.expanded .message-body {
    padding: 15px;
}

.message-phone {
    font-size: 13px;
    color: var(--text-color);
    font-weight: 500;
    margin-bottom: 5px;
}

.message-desc {
    font-size: 12px;
    color: var(--text-muted);
    margin-bottom: 12px;
}

.message-form textarea {
    width: 100%;
    height: 70px;
    padding: 10px;
    border: 1px dashed #e0d4f0;
    border-radius: 6px;
    font-size: 12px;
    resize: none;
    margin-bottom: 8px;
    background: #faf8fd;
}

.message-form textarea:focus {
    outline: none;
    border-color: #9b7dd4;
}

.message-form .form-row {
    display: flex;
    align-items: center;
    border: 1px dashed #e0d4f0;
    border-radius: 6px;
    margin-bottom: 8px;
    background: #faf8fd;
    overflow: hidden;
}

.message-form .form-row label {
    padding: 8px 10px;
    color: #9b7dd4;
    font-size: 12px;
}

.message-form .form-row input {
    flex: 1;
    padding: 8px 10px 8px 0;
    border: none;
    font-size: 12px;
    background: transparent;
}

.message-form .form-row input:focus {
    outline: none;
}

.message-form button {
    width: 100%;
    padding: 10px;
    background: linear-gradient(135deg, #9b7dd4 0%, #8b6fc4 100%);
    color: #fff;
    border: none;
    border-radius: 6px;
    font-size: 13px;
    cursor: pointer;
    transition: all 0.3s ease;
}

.message-form button:hover {
    opacity: 0.9;
    transform: translateY(-1px);
}

/* Logo图片样式 */
.logo-img {
    height: 36px;
    width: auto;
}

/* 解决方案三级菜单样式 */
.solution-categories {
    min-width: 200px;
    border-right: 1px solid #eee;
    padding-right: 0 !important;
}

.category-list {
    list-style: none;
    padding: 0;
    margin: 0;
}

.category-item {
    margin-bottom: 4px;
}

.category-item > a {
    display: block;
    padding: 10px 12px;
    color: #333;
    font-size: 14px;
    transition: all 0.3s;
    border-left: 3px solid transparent;
    border-radius: 0 4px 4px 0;
}

.category-item:hover > a,
.category-item.active > a {
    color: var(--primary-color);
    background: rgba(0, 174, 236, 0.08);
    border-left-color: var(--primary-color);
    font-weight: 600;
}

.solution-content {
    flex: 1;
    padding-left: 20px !important;
}

.solution-panel {
    display: none;
}

.solution-panel.active {
    display: block;
}

.solution-mega .mega-menu-inner {
    display: flex;
    align-items: flex-start;
}

.solution-mega .mega-cta {
    margin-top: 20px;
    padding-top: 15px;
    border-top: 1px solid #eee;
}

/* ========================================
   更新后的Footer样式 - 完全复刻原网站
   ======================================== */
.footer {
    background: #333435;
    color: #fff;
    padding: 50px 0 0;
}

.footer-main {
    display: flex;
    gap: 40px;
    padding-bottom: 40px;
    border-bottom: 1px solid rgba(255,255,255,0.1);
    background-image: url('../images/bg_bottom.png');
    background-repeat: no-repeat;
    background-position: left 5px;
    background-size: auto;
}

.footer-info {
    min-width: 280px;
}

.footer-logo {
    margin-bottom: 20px;
    background: transparent;
}

.logo-img-footer {
    height: 40px;
    width: auto;
    /* 不使用filter，直接显示原始logo颜色 */
}

.footer-contact {
    margin-bottom: 15px;
}

.footer-contact p {
    color: #fff;
    font-size: 14px;
    margin-bottom: 10px;
    display: flex;
    align-items: center;
    gap: 10px;
}

.footer-contact i {
    color: var(--primary-color);
    width: 16px;
}

.footer-address {
    margin-bottom: 20px;
}

.footer-address p {
    color: #aaa;
    font-size: 13px;
    line-height: 1.8;
}

.footer-links-box {
    margin-bottom: 20px;
}

.footer-select {
    width: 100%;
    padding: 10px 15px;
    background: rgba(255,255,255,0.1);
    border: 1px solid rgba(255,255,255,0.2);
    color: #fff;
    font-size: 14px;
    border-radius: 4px;
    cursor: pointer;
}

.footer-select option {
    background: #2d3e50;
    color: #fff;
}

.footer-qrcode {
    text-align: left;
}

.footer-qrcode img {
    width: 100px;
    height: 100px;
    background: #fff;
    padding: 5px;
    border-radius: 4px;
    margin-bottom: 10px;
}

.footer-qrcode p {
    color: #aaa;
    font-size: 13px;
}

.footer-col {
    min-width: 120px;
}

.footer-col h4 {
    color: #fff;
    font-size: 16px;
    font-weight: 500;
    margin-bottom: 20px;
    padding-bottom: 10px;
    border-bottom: 2px solid var(--primary-color);
    display: inline-block;
}

.footer-col ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

.footer-col ul li {
    margin-bottom: 12px;
}

.footer-col ul li a {
    color: #aaa;
    font-size: 14px;
    transition: all 0.3s;
}

.footer-col ul li a:hover {
    color: var(--primary-color);
}

.footer-col ul li a.highlight {
    color: var(--primary-color);
}

/* 解决方案列双列布局 */
.footer-col-solution {
    min-width: 300px;
}

.footer-solution-grid {
    display: flex;
    gap: 30px;
}

.solution-left,
.solution-right {
    flex: 1;
}

.solution-left ul li,
.solution-right ul li {
    margin-bottom: 12px;
}

.solution-left ul li.solution-tab {
    cursor: pointer;
}

.solution-left ul li.solution-tab.active > a {
    color: #fff;
    font-weight: 600;
}

.solution-panel {
    display: none;
}

.solution-panel.active {
    display: block;
}

.footer-bottom {
    padding: 20px 0;
    text-align: center;
}

.footer-bottom p {
    color: #888;
    font-size: 13px;
    margin-bottom: 5px;
}

.footer-bottom a {
    color: #888;
    margin: 0 10px;
}

.footer-bottom a:hover {
    color: var(--primary-color);
}

@media (max-width: 992px) {
    .footer-main {
        flex-wrap: wrap;
    }
    
    .footer-info {
        width: 100%;
        margin-bottom: 30px;
    }
    
    .footer-col {
        width: calc(50% - 20px);
    }
    
    .footer-col-solution {
        width: 100%;
    }
}


/* ========================================
   修复解决方案下拉菜单样式 - 去掉空白区域
   ======================================== */

/* 解决方案 Mega Menu 重新定位 */
.nav-item.has-mega-menu {
    position: relative;
}

.solution-mega.mega-menu {
    position: absolute;
    top: 100%;
    left: 50%;
    transform: translateX(-50%);
    right: auto;
    min-width: 780px;
    padding: 0;
}

.solution-mega .mega-menu-inner {
    padding: 20px 25px;
    gap: 20px;
}

/* 左侧分类列表 */
.solution-categories {
    min-width: 180px !important;
    padding-right: 20px !important;
    border-right: 1px solid #eee;
}

.category-list {
    list-style: none;
    padding: 0;
    margin: 0;
}

.category-item {
    margin-bottom: 4px;
}

.category-item a {
    display: block;
    padding: 10px 12px;
    color: #333;
    font-size: 14px;
    border-left: 3px solid transparent;
    border-radius: 0 4px 4px 0;
    transition: all 0.3s;
}

.category-item:hover a,
.category-item.active a {
    color: var(--primary-color);
    background: rgba(0, 174, 236, 0.08);
    border-left-color: var(--primary-color);
    font-weight: 600;
}

/* 右侧解决方案内容 */
.solution-content {
    flex: 1;
    min-width: 560px !important;
}

.solution-panel {
    display: none;
}

.solution-panel.active {
    display: block;
}

.solution-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 12px;
}

.solution-item {
    display: block;
    overflow: hidden;
    padding: 14px 16px;
    background: transparent;
    border-radius: 8px;
    transition: background 0.3s, transform 0.3s;
    text-decoration: none;
}

.solution-item:hover {
    background: rgba(0, 174, 236, 0.06);
    transform: translateY(-2px);
}

.solution-item .sol-icon {
    flex-shrink: 0;
    width: 48px;
    height: 48px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--primary-color);
    clip-path: polygon(25% 0%, 75% 0%, 100% 50%, 75% 100%, 25% 100%, 0% 50%);
    border-radius: 0;
}

.solution-item .sol-icon i {
    font-size: 20px;
    color: #fff;
    width: auto;
    height: auto;
    background: none;
    clip-path: none;
    border-radius: 0;
    display: block;
}

.solution-item i {
    float: left;
    font-size: 16px;
    color: #fff;
    width: 36px;
    height: 36px;
    line-height: 36px;
    text-align: center;
    display: block;
    background: var(--primary-color);
    clip-path: polygon(25% 0%, 75% 0%, 100% 50%, 75% 100%, 25% 100%, 0% 50%);
    border-radius: 0;
    margin-right: 14px;
    transform: rotate(90deg);
    flex-shrink: unset;
}
.solution-item i::before {
    transform: rotate(-90deg);
    display: block;
}
.solution-item .solution-icon {
    float: left;
    width: 36px;
    height: 36px;
    margin-right: 14px;
}
.solution-item div {
    overflow: hidden;
}

.solution-item h5 {
    font-size: 14px;
    color: #222;
    font-weight: 600;
}

.solution-item p {
    font-size: 12px;
    color: #999;
    margin: 0;
    line-height: 1.4;
}

/* 定制按钮 */
.solution-categories .mega-cta {
    margin-top: 20px;
    padding: 15px;
    background: rgba(0, 174, 236, 0.08);
    border-radius: 8px;
}

.solution-categories .mega-cta p {
    font-size: 13px;
    color: #666;
    margin: 0 0 8px;
}

.solution-categories .cta-link {
    color: var(--primary-color);
    font-size: 14px;
    font-weight: 500;
}

/* 产品服务 Mega Menu 也需要调整 */
.product-mega.mega-menu {
    position: absolute;
    top: 100%;
    left: 50%;
    transform: translateX(-50%);
    right: auto;
    min-width: 800px;
}

.product-mega .mega-menu-inner {
    padding: 20px 25px;
    gap: 25px;
}

.mega-title {
    font-size: 14px;
    color: var(--primary-color);
    font-weight: 500;
    margin-bottom: 15px;
    padding-bottom: 10px;
    border-bottom: 2px solid var(--primary-color);
}

.mega-links {
    list-style: none;
    padding: 0;
    margin: 0;
}

.mega-links li {
    margin-bottom: 10px;
}

.mega-links li a {
    color: #555;
    font-size: 14px;
    display: flex;
    align-items: center;
    gap: 8px;
    transition: all 0.3s;
}

.mega-links li a:hover {
    color: var(--primary-color);
}

.mega-grid {
    display: flex;
    gap: 40px;
}

.mega-col-wide {
    flex: 1;
}

.mega-cta {
    margin-top: 20px;
    padding-top: 15px;
    border-top: 1px solid #eee;
}

.mega-cta p {
    font-size: 13px;
    color: #888;
    margin-bottom: 8px;
}

.cta-link {
    color: var(--primary-color);
    font-size: 14px;
    font-weight: 500;
    display: inline-flex;
    align-items: center;
    gap: 5px;
}

.cta-link:hover {
    color: var(--primary-dark);
}


/* 修复留言咨询区和footer之间的间隙 */
.contact {
    margin-bottom: 0 !important;
    padding-bottom: 60px !important;
}

.footer {
    margin-top: 0 !important;
}

/* 修复footer-info区域的白色背景问题 */
.footer-info {
    background: transparent !important;
}

.footer-logo {
    background: transparent !important;
    padding: 0 !important;
    margin: 0 0 20px 0 !important;
}

.logo-img-footer {
    background: transparent !important;
    max-height: 40px;
    width: auto;
}


/* 修复解决方案下拉菜单对齐问题 */
.nav-item.has-mega-menu .solution-mega.mega-menu {
    left: 0 !important;
    transform: none !important;
    right: auto !important;
}

/* 修复三级导航上方空白 - 去掉padding-top */
.solution-content {
    padding-top: 0 !important;
}

.solution-panel {
    padding-top: 0 !important;
    margin-top: 0 !important;
}

.solution-grid {
    margin-top: 0 !important;
    padding-top: 0 !important;
}

/* 让三级导航与二级导航"行业解决方案"齐平 */
.solution-mega .mega-menu-inner {
    padding-top: 15px !important;
    align-items: flex-start !important;
}

.solution-categories {
    padding-top: 0 !important;
}

.solution-content {
    margin-top: 0 !important;
}

/* 确保分类列表和内容区域顶部对齐 */
.category-list {
    margin-top: 0 !important;
    padding-top: 0 !important;
}

.category-item:first-child {
    margin-top: 0 !important;
}


/* 修复产品服务下拉菜单对齐问题 - 与"产品服务"导航项左对齐 */
.nav-item.has-mega-menu .product-mega.mega-menu {
    left: 0 !important;
    transform: none !important;
    right: auto !important;
}


/* ========================================
   修复：联系区域排版优化
   ======================================== */
.contact-info {
    flex: 0 0 400px;
    max-width: 400px;
}

.contact-list {
    margin-top: 20px;
}


/* ========================================
   修复：联系区域排版问题（强制覆盖）
   ======================================== */
section.contact .contact-wrapper {
    display: flex !important;
    flex-direction: row !important;
    gap: 60px !important;
    align-items: flex-start !important;
}

section.contact .contact-info {
    flex: 0 0 auto !important;
    max-width: none !important;
    min-width: auto !important;
    width: 600px !important;
    overflow: visible !important;
}

section.contact .contact-info h2 {
    font-size: 28px !important;
    font-weight: 600 !important;
    color: #333 !important;
    margin-bottom: 10px !important;
    line-height: 1.4 !important;
    white-space: normal !important;
}

section.contact .contact-en {
    font-size: 12px !important;
    color: #999 !important;
    text-transform: uppercase !important;
    letter-spacing: 1px !important;
    margin-bottom: 30px !important;
}

section.contact .contact-list {
    margin-top: 20px !important;
}

section.contact ul.contact-list-new {
    list-style: none !important;
    padding: 0 !important;
    margin: 30px 0 0 0 !important;
}

section.contact ul.contact-list-new li {
    margin-bottom: 16px !important;
    font-size: 15px !important;
    line-height: 1.8 !important;
    color: #333 !important;
    display: block !important;
}

section.contact p.contact-item {
    display: block !important;
    margin: 0 0 16px 0 !important;
    padding: 0 !important;
    font-size: 15px !important;
    line-height: 1.8 !important;
    color: #333 !important;
    white-space: nowrap !important;
}

section.contact p.contact-item span.label {
    color: #666 !important;
    font-weight: normal !important;
    display: inline !important;
}

section.contact p.contact-item span.value {
    color: #333 !important;
    font-weight: 500 !important;
    display: inline !important;
}

section.contact .contact-form {
    flex: 1 !important;
    max-width: none !important;
    background: #fff !important;
    padding: 35px !important;
    border-radius: 12px !important;
    box-shadow: 0 5px 30px rgba(0, 0, 0, 0.08) !important;
}

/* 响应式调整 */
@media (max-width: 992px) {
    section.contact .contact-wrapper {
        flex-direction: column !important;
        gap: 40px !important;
    }
    
    section.contact .contact-info {
        flex: 1 !important;
        max-width: 100% !important;
        min-width: auto !important;
    }
    
    section.contact .contact-info h2 {
        font-size: 24px !important;
    }
}

/* ========================================
   修复：在contact区域隐藏左侧侧边栏
   ======================================== */
section.contact {
    position: relative;
    z-index: 1;
}

section.contact .contact-info {
    position: relative;
    z-index: 10;
}

/* 当滚动到contact区域时，隐藏左侧侧边栏 */
.sidebar-left {
    z-index: 5;
}

/* ========================================
   简化版联系区域样式
   ======================================== */
.contact-simple {
    padding: 60px 0;
    background: linear-gradient(to right, #83d2f7, #d0f0ff);
    background-image: url('../images/bg_fill_in_requirements.png'), linear-gradient(to right, #83d2f7, #d0f0ff);
    background-size: cover, cover;
    background-position: center, center;
    background-repeat: no-repeat, no-repeat;
    text-align: center;
}

.contact-simple .container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
}

.contact-simple .contact-title {
    font-size: 26px;
    font-weight: 600;
    color: #1a3a5c;
    margin-bottom: 8px;
}

.contact-simple .contact-subtitle {
    font-size: 13px;
    color: #4a7fa5;
    letter-spacing: 1px;
    margin-bottom: 30px;
}

.contact-form-simple {
    background: transparent;
}

.form-row-simple {
    display: flex;
    flex-wrap: nowrap;
    gap: 10px;
    align-items: stretch;
    justify-content: center;
    max-width: 1100px;
    margin: 0 auto;
}

.form-row-simple input {
    flex: 1 1 160px;
    min-width: 0;
    max-width: 220px;
    padding: 12px 16px;
    border: 1px solid rgba(255, 255, 255, 0.8);
    border-radius: 4px;
    font-size: 14px;
    background: rgba(255, 255, 255, 0.85);
    color: #333;
    outline: none;
    transition: border-color 0.2s, background 0.2s;
    box-sizing: border-box;
}

.form-row-simple input::placeholder {
    color: #999;
}

.form-row-simple input:focus {
    border-color: var(--primary-color);
    background: #fff;
}

.contact-form-simple .btn-submit {
    flex: 0 0 120px;
    width: 120px;
    padding: 12px 0;
    background: var(--primary-color);
    color: white;
    border: none;
    border-radius: 4px;
    font-size: 15px;
    font-weight: 500;
    cursor: pointer;
    white-space: nowrap;
    transition: var(--transition);
}

.contact-form-simple .btn-submit:hover {
    background: var(--primary-dark);
}

.contact-form-simple .btn-submit:disabled {
    opacity: 0.7;
    cursor: not-allowed;
}

.message-captcha-row {
    display: flex;
    align-items: stretch;
    gap: 8px;
    flex: 1 1 180px;
    min-width: 0;
    max-width: 240px;
}

.message-captcha-row input {
    flex: 1;
    min-width: 0;
    max-width: none;
}

.message-captcha-img {
    flex-shrink: 0;
    width: 96px;
    height: 42px;
    border-radius: 4px;
    cursor: pointer;
    object-fit: contain;
    display: block;
    background: rgba(255, 255, 255, 0.85);
}

@media (max-width: 768px) {
    .form-row-simple {
        flex-wrap: wrap;
    }
    .form-row-simple input {
        flex: 1 1 calc(50% - 6px);
        max-width: 100%;
    }
    .message-captcha-row {
        flex: 1 1 100%;
        max-width: 100%;
    }
    .contact-form-simple .btn-submit {
        width: 100%;
        flex: 1 1 100%;
    }
}

/* ========================================
   移动端导航栏样式
   ======================================== */

/* 移动端汉堡菜单按钮 */
.mobile-menu-btn {
    display: none;
    flex-direction: column;
    justify-content: space-between;
    width: 24px;
    height: 18px;
    cursor: pointer;
    z-index: 1001;
}

.mobile-menu-btn span {
    display: block;
    width: 100%;
    height: 2px;
    background-color: var(--text-color);
    transition: var(--transition);
}

.mobile-menu-btn.active span:nth-child(1) {
    transform: rotate(45deg) translate(5px, 5px);
}

.mobile-menu-btn.active span:nth-child(2) {
    opacity: 0;
}

.mobile-menu-btn.active span:nth-child(3) {
    transform: rotate(-45deg) translate(5px, -5px);
}

/* 移动端样式 */
@media (max-width: 992px) {
    /* 显示汉堡菜单按钮 */
    .mobile-menu-btn {
        display: flex;
        position: absolute;
        left: 20px;
        top: 50%;
        transform: translateY(-50%);
    }
    
    /* Logo居中 */
    .header-container {
        justify-content: center;
        position: relative;
    }
    
    .logo {
        position: absolute;
        left: 50%;
        transform: translateX(-50%);
    }
    
    /* 隐藏桌面端导航 */
    .main-nav {
        display: none;
        position: fixed;
        top: 70px;
        left: 0;
        right: 0;
        bottom: 0;
        background: white;
        z-index: 999;
        overflow-y: auto;
        padding: 20px;
    }
    
    .main-nav.active {
        display: block;
    }
    
    .nav-list {
        flex-direction: column;
        align-items: stretch;
        gap: 0;
    }
    
    .nav-item {
        border-bottom: 1px solid var(--border-color);
    }
    
    .nav-item a {
        padding: 15px 0;
        display: block;
    }
    
    /* 隐藏电话和预约演示按钮 */
    .header-right {
        display: none;
    }
    
    /* 隐藏下拉菜单 */
    .mega-menu,
    .dropdown-menu {
        display: none !important;
    }
    
    /* 移动端下拉菜单样式 */
    .nav-item.has-mega-menu > a::after,
    .nav-item.has-dropdown > a::after {
        content: '\f107';
        font-family: 'Font Awesome 6 Free';
        font-weight: 900;
        margin-left: 8px;
        transition: var(--transition);
    }
    
    .nav-item.has-mega-menu.open > a::after,
    .nav-item.has-dropdown.open > a::after {
        transform: rotate(180deg);
    }
}

@media (max-width: 768px) {
    .header {
        height: 60px;
    }
    
    .mobile-menu-btn {
        left: 15px;
    }
    
    .logo-img {
        height: 32px;
    }
    
    .main-nav {
        top: 60px;
    }
}

/* ========================================
   新闻资讯列表样式
   ======================================== */

.news-list-section {
    padding: 80px 0;
}

.news-list {
    margin: 0 auto;
}

.news-item-link {
    display: block;
    margin-bottom: 30px;
    text-decoration: none;
    color: inherit;
}

.news-item {
    display: flex;
    gap: 30px;
    background: white;
    border-radius: 12px;
    padding: 30px;
    transition: var(--transition);
}

.news-item-link:hover .news-item {
    box-shadow: var(--shadow-hover);
    transform: translateY(-4px);
}

/* 日期显示 */
.news-date {
    flex-shrink: 0;
    width: 80px;
    text-align: center;
}

.date-number {
    font-size: 48px;
    font-weight: bold;
    color: var(--primary-color);
    line-height: 1;
    margin-bottom: 5px;
}

.date-month {
    font-size: 14px;
    color: var(--text-muted);
}

/* 新闻图片 */
.news-image {
    flex-shrink: 0;
    width: 300px;
    height: 180px;
    overflow: hidden;
    border-radius: 8px;
}

.news-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: var(--transition);
}

.news-item-link:hover .news-image img {
    transform: scale(1.05);
}

/* 新闻内容 */
.news-content {
    flex: 1;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.news-title {
    font-size: 22px;
    font-weight: 600;
    color: var(--text-color);
    margin-bottom: 15px;
    line-height: 1.4;
    transition: var(--transition);
}

.news-item-link:hover .news-title {
    color: var(--primary-color);
}

.news-summary {
    font-size: 15px;
    color: var(--text-light);
    line-height: 1.8;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* 响应式设计 */
@media (max-width: 992px) {
    .news-list-section {
        padding: 60px 0;
    }
    
    .news-item {
        gap: 20px;
        padding: 25px;
    }
    
    .news-image {
        width: 250px;
        height: 150px;
    }
    
    .news-title {
        font-size: 20px;
    }
}

@media (max-width: 768px) {
    .news-list-section {
        padding: 40px 0;
    }
    
    .news-item-link {
        margin-bottom: 20px;
    }
    
    .news-item {
        flex-direction: column;
        gap: 20px;
        padding: 20px;
    }
    
    .news-date {
        width: 100%;
        text-align: left;
        display: flex;
        align-items: center;
        gap: 15px;
    }
    
    .date-number {
        font-size: 36px;
    }
    
    .date-month {
        font-size: 13px;
    }
    
    .news-image {
        width: 100%;
        height: 220px;
    }
    
    .news-title {
        font-size: 18px;
        margin-bottom: 12px;
    }
    
    .news-summary {
        font-size: 14px;
    }
}

@media (max-width: 480px) {
    .news-item {
        padding: 15px;
    }
    
    .news-date {
        gap: 10px;
    }
    
    .date-number {
        font-size: 32px;
    }
    
    .news-image {
        height: 180px;
    }
    
    .news-title {
        font-size: 16px;
    }
    
    .news-summary {
        font-size: 13px;
        line-height: 1.6;
    }
}

/* ========================================
   新闻列表和详情页
   ======================================== */

/* 栏目导航 */
.catalog-nav {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 10px;
    margin-top: 30px;
    flex-wrap: wrap;
}

.catalog-nav-item {
    padding: 10px 24px;
    border-radius: 25px;
    font-size: 15px;
    color: var(--text-color);
    background: #fff;
    transition: var(--transition);
    border: 2px solid #e8e8e8;
    font-weight: 500;
}

.catalog-nav-item:hover {
    background: var(--primary-color);
    color: #fff;
    border-color: var(--primary-color);
}

.catalog-nav-item.active {
    background: var(--primary-color);
    color: #fff;
    border-color: var(--primary-color);
}

/* Banner基础样式：默认纯色背景，模板可动态设置 background-image */
.org-intro-banner {
    padding: 180px 0 140px;
    background-color: rgb(230, 247, 255);
    background-image: none;
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    margin-top: 0;
}

.org-intro-banner .intro-content {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 80px;
    max-width: 1400px;
    margin: 0 auto;
}

.org-intro-banner .intro-left {
    flex: 0 0 45%;
    min-width: 0;
}

.org-intro-banner .intro-left h1 {
    font-size: 42px;
    color: #1a1a1a;
    margin-bottom: 28px;
    font-weight: 600;
    line-height: 1.3;
}

.org-intro-banner .intro-left p {
    font-size: 17px;
    color: #555;
    line-height: 2;
    margin-bottom: 36px;
    text-align: justify;
}

.org-intro-banner .intro-right {
    flex: 0 0 50%;
    min-width: 0;
}

.org-intro-banner .intro-right img {
    width: 100%;
    height: auto;
    border-radius: 16px;
    box-shadow: 0 25px 70px rgba(0, 0, 0, 0.15);
    transition: transform 0.3s ease;
}

.org-intro-banner .intro-right img:hover {
    transform: scale(1.02);
}

/* 商务服务介绍区域 - 无边框无阴影样式 */
.business-service-intro .intro-right img {
    border-radius: 0;
    box-shadow: none;
}

.business-service-intro .intro-right img:hover {
    transform: none;
}

/* 新闻详情页横幅 */
.news-detail-banner .intro-content {
    display: flex;
    align-items: center;
    gap: 40px;
}

.news-detail-banner .intro-left {
    flex: 0 0 65%;
    max-width: 95%;
}

.news-detail-banner .intro-right {
    flex: 0 0 30%;
    max-width: 30%;
}

.news-detail-banner .intro-right img {
    width: 100%;
    height: auto;
    border-radius: 8px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
}

.news-detail-info {
    display: flex;
    align-items: center;
    gap: 30px;
    margin-top: 20px;
}

.news-detail-info .info-item {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 15px;
    color: var(--text-light);
}

.news-detail-info .info-item i {
    color: var(--primary-color);
    font-size: 16px;
}

/* 新闻详情内容区域 */
.news-detail-content {
    padding: 60px 0;
    background: var(--bg-color);
}

.news-detail-content .container {
    max-width: 1400px;
    width: 100%;
    padding: 0 32px;
    box-sizing: border-box;
}

.news-detail-layout {
    display: flex;
    gap: 30px;
    align-items: flex-start;
}

.news-detail-main {
    flex: 1 1 auto;
    min-width: 0;
    background: #fff;
    padding: 40px;
    border-radius: 8px;
    box-shadow: var(--shadow);
}

.news-detail-content .content-wrapper {
    background: #fff;
    padding: 40px;
    border-radius: 8px;
    box-shadow: var(--shadow);
}

.news-detail-body {
    font-size: 16px;
    line-height: 1.8;
    color: var(--text-color);
}

.news-detail-body h1,
.news-detail-body h2,
.news-detail-body h3,
.news-detail-body h4,
.news-detail-body h5,
.news-detail-body h6 {
    margin-top: 30px;
    margin-bottom: 15px;
    font-weight: 600;
    line-height: 1.4;
}

.news-detail-body h1 {
    font-size: 28px;
}

.news-detail-body h2 {
    font-size: 24px;
}

.news-detail-body h3 {
    font-size: 20px;
}

.news-detail-body p {
    margin-bottom: 15px;
}

.news-detail-body img {
    margin: 20px 0;
    border-radius: 4px;
    max-width: 100%;
    height: auto;
}

.news-detail-body ul,
.news-detail-body ol {
    margin: 15px 0;
    padding-left: 25px;
}

.news-detail-body ul li,
.news-detail-body ol li {
    list-style: disc;
    margin-bottom: 8px;
}

.news-detail-body ol li {
    list-style: decimal;
}

.news-detail-body blockquote {
    margin: 20px 0;
    padding: 15px 20px;
    background: var(--bg-gray);
    border-left: 4px solid var(--primary-color);
    font-style: italic;
    color: var(--text-light);
}

.news-detail-body table {
    width: 100%;
    margin: 20px 0;
    border-collapse: collapse;
}

.news-detail-body table th,
.news-detail-body table td {
    padding: 12px;
    border: 1px solid var(--border-color);
    text-align: left;
}

.news-detail-body table th {
    background: var(--bg-gray);
    font-weight: 600;
}

.news-detail-body pre {
    margin: 20px 0;
    padding: 15px;
    background: #f6f8fa;
    border-radius: 4px;
    overflow-x: auto;
}

.news-detail-body code {
    font-family: 'Courier New', monospace;
    font-size: 14px;
}

/* 移动端响应式 */
@media (max-width: 992px) {
    .org-intro-banner {
        padding: 150px 0 100px;
    }
    
    .org-intro-banner .intro-content {
        flex-direction: column;
        gap: 50px;
        max-width: 700px;
    }
    
    .org-intro-banner .intro-left,
    .org-intro-banner .intro-right {
        flex: 0 0 100%;
        max-width: 100%;
    }
    
    .org-intro-banner .intro-left {
        text-align: center;
    }
    
    .org-intro-banner .intro-left h1 {
        font-size: 38px;
    }
    
    .news-detail-banner .intro-left {
        flex: 0 0 60%;
        max-width: 60%;
    }
    
    .news-detail-banner .intro-right {
        flex: 0 0 35%;
        max-width: 35%;
    }
    
    .news-detail-content .content-wrapper,
    .news-detail-main {
        padding: 30px;
    }

    .news-detail-layout {
        flex-direction: column;
    }
}

@media (max-width: 768px) {
    /* 移动端全局约束 - 防止内容溢出 */
    body {
        overflow-x: hidden;
        max-width: 100vw;
    }
    
    /* 确保container不会超出 */
    .news-detail-content .container,
    .news-detail-content .content-wrapper,
    .news-detail-main {
        max-width: 100vw !important;
        padding-left: 15px !important;
        padding-right: 15px !important;
        overflow-x: hidden !important;
        box-sizing: border-box !important;
    }
    
    .news-detail-content,
    .news-detail-content *:not(br):not(hr) {
        max-width: 100% !important;
        overflow-x: hidden !important;
        box-sizing: border-box !important;
    }
    
    .news-detail-body,
    .news-detail-body * {
        word-wrap: break-word !important;
        word-break: break-word !important;
        overflow-wrap: break-word !important;
    }
    
    .news-detail-body img,
    .news-detail-body video,
    .news-detail-body iframe,
    .news-detail-body embed,
    .news-detail-body object {
        max-width: 100% !important;
        width: 100% !important;
        height: auto !important;
    }
    
    /* 确保表格不会溢出 */
    .news-detail-body table {
        display: block !important;
        overflow-x: auto !important;
        max-width: 100% !important;
    }
    
    /* 栏目导航响应式 */
    .catalog-nav {
        margin-top: 25px;
        gap: 8px;
        justify-content: flex-start;
        overflow-x: auto;
        overflow-y: hidden;
        flex-wrap: nowrap;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
    }
    
    .catalog-nav::-webkit-scrollbar {
        display: none;
    }
    
    .catalog-nav-item {
        padding: 8px 18px;
        font-size: 14px;
        white-space: nowrap;
        flex-shrink: 0;
    }
    
    .org-intro-banner {
        padding: 130px 0 80px;
    }
    
    .org-intro-banner .intro-content {
        gap: 40px;
    }
    
    .org-intro-banner .intro-left h1 {
        font-size: 32px;
        margin-bottom: 20px;
    }
    
    .org-intro-banner .intro-left p {
        font-size: 15px;
        line-height: 1.8;
        margin-bottom: 28px;
    }
    
    .news-detail-banner .intro-content {
        flex-direction: column;
        gap: 30px;
    }
    
    .news-detail-banner .intro-left,
    .news-detail-banner .intro-right {
        flex: 0 0 100%;
        max-width: 100%;
    }
    
    .news-detail-info {
        flex-direction: column;
        align-items: flex-start;
        gap: 15px;
    }
    
    .news-detail-content {
        padding: 40px 0;
    }
    
    .news-detail-content .content-wrapper,
    .news-detail-main {
        padding: 25px 20px;
    }
    
    .news-detail-body {
        font-size: 15px;
    }
    
    .news-detail-body h1 {
        font-size: 24px;
    }
    
    .news-detail-body h2 {
        font-size: 20px;
    }
    
    .news-detail-body h3 {
        font-size: 18px;
    }
}

@media (max-width: 576px) {
    .org-intro-banner {
        padding: 110px 0 60px;
    }
    
    .org-intro-banner .intro-left h1 {
        font-size: 28px;
    }
    
    .org-intro-banner .intro-left p {
        font-size: 14px;
    }
    
    /* 荣誉资质小屏优化 */
    .honor-section {
        padding: 50px 0;
    }
    
    .honor-section .section-title {
        font-size: 24px;
        margin-bottom: 30px;
    }
    
    /* 生态联盟内容区小屏优化 */
    .ecology-content-section {
        padding: 40px 0;
    }
    
    .ecology-text-content p {
        font-size: 14px;
        line-height: 1.8;
        margin-bottom: 20px;
    }
    
    .ecology-image {
        padding: 15px;
    }
}

@media (max-width: 480px) {
    .catalog-nav {
        margin-top: 20px;
    }
    
    .catalog-nav-item {
        padding: 7px 16px;
        font-size: 13px;
    }
    
    .news-detail-content .content-wrapper,
    .news-detail-main {
        padding: 20px 15px;
    }
    
    .news-detail-body {
        font-size: 14px;
    }
    
    /* 荣誉资质超小屏优化 */
    .honor-section {
        padding: 40px 0;
    }

    .honor-section .section-title {
        font-size: 22px;
        margin-bottom: 25px;
    }

    .honor-featured-image {
        min-height: 220px;
        padding: 16px;
    }

    .htl-year {
        width: 50px;
        font-size: 12px;
    }

    .honor-timeline-line {
        left: 60px;
    }

    .htl-text {
        font-size: 13px;
    }

    /* 生态联盟内容区超小屏优化 */
    .ecology-content-section {
        padding: 30px 0;
    }
    
    .ecology-text-content {
        margin-bottom: 25px;
    }
    
    .ecology-text-content p {
        font-size: 13px;
        line-height: 1.8;
        margin-bottom: 18px;
        text-indent: 2em;
    }
    
    .ecology-image {
        padding: 12px;
    }
}

/* Download Page Styles */
.download-section {
    padding: 60px 0;
}

.download-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 30px;
}

.download-card-link {
    text-decoration: none;
    color: inherit;
}

.download-card {
    background: #fff;
    border-radius: 10px;
    padding: 30px;
    display: flex;
    align-items: center;
    gap: 20px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
    transition: transform 0.3s, box-shadow 0.3s;
    cursor: pointer;
}

.download-card-link:hover .download-card {
    transform: translateY(-5px);
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.12);
}

.download-card .file-icon {
    flex-shrink: 0;
    width: 70px;
    height: 70px;
    background: var(--primary-color);
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 32px;
    color: #fff;
}

.download-card .file-info {
    flex: 1;
    min-width: 0;
}

.download-card .file-info h3 {
    margin: 0 0 12px 0;
    font-size: 18px;
    font-weight: 600;
    color: #333;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.download-card .file-meta {
    display: flex;
    align-items: center;
    gap: 20px;
    font-size: 14px;
    color: #999;
}

.download-card .file-meta i {
    margin-right: 5px;
}

.download-card .download-btn {
    flex-shrink: 0;
    padding: 12px 30px;
    background: var(--primary-color);
    color: #fff;
    border-radius: 25px;
    font-weight: 600;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    transition: transform 0.2s, box-shadow 0.2s;
}

.download-card-link:hover .download-btn {
    transform: scale(1.05);
    box-shadow: 0 4px 12px rgba(0, 160, 234, 0.4);
}

@media (max-width: 768px) {
    .download-grid {
        grid-template-columns: 1fr;
    }
    
    .download-card {
        flex-direction: column;
        text-align: center;
    }
    
    .download-card .file-info h3 {
        white-space: normal;
    }
}

/* ========================================
   公司介绍页面样式
   ======================================== */

/* 公司介绍内容区 */
.company-intro-section {
    padding: 80px 0;
    background: #fff;
}

/* ========================================
   发展历程区域样式
   ======================================== */
.history-section {
    padding: 80px 0;
    background: rgb(242, 251, 255);
}

.history-section .section-title {
    text-align: center;
    font-size: 36px;
    font-weight: 600;
    color: #333;
    margin-bottom: 60px;
}

.history-timeline-wrap {
    position: relative;
    max-width: 960px;
    margin: 0 auto;
    padding-right: 72px;
}

/* 时间轴容器 */
.history-section .timeline {
    position: relative;
    max-width: none;
    margin: 0;
    padding-left: 28px;
}

/* 背景大号年份水印 */
.timeline-watermark {
    position: absolute;
    right: 40px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 160px;
    font-weight: 700;
    line-height: 1;
    color: rgba(0, 160, 234, 0.08);
    pointer-events: none;
    user-select: none;
    z-index: 0;
    letter-spacing: -4px;
    transition: opacity 0.3s ease;
}

/* 时间轴垂直线 */
.history-section .timeline::before {
    content: '';
    position: absolute;
    left: 5px;
    top: 10px;
    bottom: 10px;
    width: 2px;
    background: rgba(0, 160, 234, 0.25);
}

/* 时间轴项目 */
.history-section .timeline-item {
    position: relative;
    z-index: 1;
    margin-bottom: 36px;
    display: flex;
    align-items: flex-start;
    gap: 28px;
    cursor: pointer;
    transition: color 0.25s ease;
}

.history-section .timeline-item:last-child {
    margin-bottom: 0;
}

/* 时间轴圆点 */
.history-section .timeline-item::before {
    content: '';
    position: absolute;
    left: -28px;
    top: 8px;
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: var(--primary-color);
    border: none;
    box-shadow: none;
    z-index: 2;
}

/* 年份 */
.history-section .timeline-year {
    flex-shrink: 0;
    font-size: 18px;
    font-weight: 600;
    color: #333;
    min-width: 72px;
    line-height: 1.5;
    transition: color 0.25s ease;
}

/* 内容：去卡片，纯文本 */
.history-section .timeline-content {
    flex: 1;
    background: transparent;
    padding: 0;
    border-radius: 0;
    border-left: none;
    box-shadow: none;
    transform: none;
    transition: color 0.25s ease;
}

.history-section .timeline-content:hover {
    background: transparent;
    box-shadow: none;
    transform: none;
}

.history-section .timeline-content p {
    margin: 0;
    font-size: 15px;
    color: #666;
    line-height: 1.7;
    transition: color 0.25s ease;
}

/* 激活态：年份与描述同为蓝色 */
.history-section .timeline-item.active .timeline-year,
.history-section .timeline-item.active .timeline-content p {
    color: var(--primary-color);
}

.history-section .timeline-item:hover:not(.active) .timeline-year {
    color: var(--primary-color);
}

/* 右侧上下切换按钮 */
.timeline-nav {
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    display: flex;
    flex-direction: column;
    gap: 14px;
    z-index: 2;
}

.timeline-nav-btn {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    border: 1.5px solid rgba(0, 160, 234, 0.45);
    background: transparent;
    color: var(--primary-color);
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    padding: 0;
    transition: background 0.2s ease, border-color 0.2s ease, color 0.2s ease;
}

.timeline-nav-btn:hover {
    background: var(--primary-color);
    border-color: var(--primary-color);
    color: #fff;
}

.timeline-nav-btn:disabled {
    opacity: 0.35;
    cursor: not-allowed;
}

.timeline-nav-btn:disabled:hover {
    background: transparent;
    border-color: rgba(0, 160, 234, 0.45);
    color: var(--primary-color);
}

/* ========================================
   企业文化区域样式
   ======================================== */
.culture-section {
    padding: 80px 0;
    background: #FFFFFF;
}

.culture-section .section-title {
    text-align: center;
    font-size: 36px;
    font-weight: 600;
    color: #333;
    margin-bottom: 60px;
}

/* 文化卡片容器 */
.culture-cards {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 24px;
}

/* 单个文化卡片 */
.culture-card {
    position: relative;
    background: #fff;
    border-radius: 12px;
    padding: 28px 24px 36px;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.06);
    transition: var(--transition);
    overflow: hidden;
}

.culture-card::before {
    content: '';
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 48px;
    height: 4px;
    background: var(--primary-color);
    border-radius: 0 0 4px 4px;
}

.culture-card:hover {
    transform: translateY(-6px);
    box-shadow: 0 10px 28px rgba(0, 160, 234, 0.12);
}

/* 卡片头部：中文左、英文右 */
.culture-card .card-header {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    gap: 12px;
    padding: 0;
    border-top: none;
    background: transparent;
    margin-bottom: 16px;
}

.culture-card .card-title-cn {
    font-size: 20px;
    font-weight: 700;
    color: #222;
    margin: 0;
    flex-shrink: 0;
}

.culture-card .card-title-en {
    font-size: 12px;
    color: var(--primary-color);
    font-weight: 600;
    letter-spacing: 0.5px;
    margin: 0;
    text-align: right;
    line-height: 1.3;
}

/* 卡片内容 */
.culture-card .card-body {
    position: relative;
    z-index: 1;
    padding: 0;
}

.culture-card .card-body p {
    margin: 0;
    font-size: 14px;
    color: #666;
    line-height: 1.8;
}

/* 右下角大号序号水印 */
.culture-card .card-number {
    position: absolute;
    right: 16px;
    bottom: 4px;
    font-size: 56px;
    font-weight: 700;
    line-height: 1;
    color: rgba(0, 160, 234, 0.12);
    pointer-events: none;
    user-select: none;
    z-index: 0;
}

/* ========================================
   荣誉资质区域样式
   ======================================== */
.honor-section {
    padding: 80px 0;
    background: rgb(242, 251, 255);
}

.honor-section .section-title {
    text-align: center;
    font-size: 36px;
    font-weight: 600;
    color: #333;
    margin-bottom: 60px;
}

/* 荣誉资质 - 时间轴布局 */
.honor-timeline-layout {
    display: flex;
    gap: 60px;
    align-items: flex-start;
}

/* 左侧大图展示 */
.honor-featured {
    flex: 0 0 380px;
    position: sticky;
    top: 100px;
}

.honor-featured-image {
    background: linear-gradient(135deg, #eef6ff 0%, #dceeff 100%);
    border-radius: 16px;
    padding: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 460px;
    box-shadow: 0 6px 30px rgba(24, 144, 255, 0.1);
    overflow: hidden;
}

.honor-featured-image img {
    width: 100%;
    max-height: 400px;
    object-fit: contain;
    transition: opacity 0.35s ease, transform 0.35s ease;
}

.honor-featured-image img.switching {
    opacity: 0;
    transform: scale(0.95);
}

.honor-featured-label {
    margin-top: 18px;
    text-align: center;
    font-size: 15px;
    font-weight: 500;
    color: #555;
    line-height: 1.6;
    transition: color 0.3s;
}

/* 右侧时间轴 */
.honor-timeline {
    flex: 1;
    position: relative;
    padding-left: 10px;
}

.honor-timeline-line {
    position: absolute;
    left: 76px;
    top: 16px;
    bottom: 16px;
    width: 2px;
    background: linear-gradient(to bottom, #d0e8ff, #c8e0ff, #d0e8ff);
    border-radius: 2px;
}

.honor-timeline-item {
    display: flex;
    align-items: center;
    gap: 0;
    padding: 18px 0;
    cursor: pointer;
    position: relative;
    transition: background 0.2s;
}

.honor-timeline-item:hover {
    background: rgba(24, 144, 255, 0.03);
    border-radius: 8px;
}

.htl-year {
    width: 66px;
    font-size: 14px;
    color: #aaa;
    font-weight: 400;
    text-align: right;
    flex-shrink: 0;
    transition: color 0.3s, font-size 0.2s, font-weight 0.2s;
    padding-right: 2px;
}

.htl-dot-wrap {
    width: 44px;
    display: flex;
    justify-content: center;
    flex-shrink: 0;
    position: relative;
    z-index: 1;
}

.htl-dot {
    display: block;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: #c8d8ea;
    border: 2px solid #fff;
    box-shadow: 0 0 0 2px #c8d8ea;
    transition: all 0.3s;
}

.htl-text {
    font-size: 15px;
    color: #666;
    font-weight: 400;
    transition: color 0.3s, font-size 0.2s, font-weight 0.2s;
    line-height: 1.5;
}

/* 激活状态 */
.honor-timeline-item.active .htl-year {
    color: #1890ff;
    font-weight: 600;
    font-size: 15px;
}

.honor-timeline-item.active .htl-dot {
    width: 14px;
    height: 14px;
    background: #1890ff;
    border: 2px solid #fff;
    box-shadow: 0 0 0 3px rgba(24, 144, 255, 0.25);
}

.honor-timeline-item.active .htl-text {
    color: #1890ff;
    font-weight: 600;
    font-size: 16px;
}

/* 悬停高亮 */
.honor-timeline-item:not(.active):hover .htl-year {
    color: #40a9ff;
}

.honor-timeline-item:not(.active):hover .htl-dot {
    background: #40a9ff;
    box-shadow: 0 0 0 3px rgba(64, 169, 255, 0.2);
}

.honor-timeline-item:not(.active):hover .htl-text {
    color: #40a9ff;
}

/* ========================================
   生态联盟内容区域样式
   ======================================== */
.ecology-content-section {
    padding: 80px 0;
    background: #ffffff;
}

.ecology-content-section .container {
    max-width: 1200px;
    margin: 0 auto;
}

/* 文字内容区 */
.ecology-text-content {
    margin-bottom: 60px;
}

.ecology-text-content p {
    font-size: 16px;
    line-height: 2;
    color: #555;
    margin-bottom: 30px;
    text-align: justify;
    text-indent: 2em;
}

.ecology-text-content p:last-child {
    margin-bottom: 0;
}

/* 图片区域 */
.ecology-image {
    text-align: center;
    background: white;
    padding: 40px;
    border-radius: 12px;
    box-shadow: 0 2px 20px rgba(0, 0, 0, 0.08);
}

.ecology-image img {
    width: 100%;
    max-width: 100%;
    height: auto;
    border-radius: 8px;
}

/* ========================================
   创始人区域样式
   ======================================== */
.founder-section {
    padding: 80px 0;
    background: #FFFFFF;
}

.founder-section .section-title {
    text-align: center;
    font-size: 36px;
    font-weight: 600;
    color: #333;
    margin-bottom: 60px;
}

.founder-content {
    display: flex;
    gap: 0;
    align-items: stretch;
    max-width: 1200px;
    margin: 0 auto;
    overflow: hidden;
    background: #f5f5f5;
}

/* 创始人照片 */
.founder-photo {
    flex: 0 0 42%;
    max-width: 480px;
    background: #1a1a1a;
    border-radius: 0;
    overflow: hidden;
    box-shadow: none;
    display: flex;
    align-items: flex-end;
}

.founder-photo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center top;
    display: block;
}

/* 创始人信息 */
.founder-info {
    flex: 1;
    background: #f5f5f5;
    padding: 48px 56px 48px 48px;
    border-radius: 0;
    box-shadow: none;
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.founder-watermark {
    position: absolute;
    top: 28px;
    right: 36px;
    height: 36px;
    width: auto;
    opacity: 0.28;
    filter: none;
    pointer-events: none;
}

.founder-name {
    font-size: 26px;
    font-weight: 700;
    color: #222;
    margin: 0 0 20px;
    padding: 0;
    border-bottom: none;
}

.founder-titles {
    margin-bottom: 0;
    padding-bottom: 22px;
    border-bottom: 1px solid #333;
}

.founder-titles p {
    font-size: 15px;
    color: #333;
    line-height: 1.9;
    margin: 0;
}

.founder-bio {
    margin-top: 22px;
}

.founder-bio p {
    font-size: 15px;
    color: #444;
    line-height: 2;
    margin: 0 0 14px;
    text-align: justify;
}

.founder-bio p:last-child {
    margin-bottom: 0;
}

.company-intro-section .intro-wrapper {
    display: flex;
    gap: 60px;
    align-items: flex-start;
}

/* 左侧：视频和数据 */
.company-intro-section .intro-left {
    flex: 1;
    max-width: 500px;
}

/* 视频播放器 */
.company-intro-section .video-container {
    margin-bottom: 40px;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
    position: relative;
    background: #f0f0f0;
}

.company-intro-section .video-container video {
    width: 100%;
    display: block;
}

/* 视频封面 - 未播放时显示 */
.company-intro-section .video-poster {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    cursor: pointer;
    z-index: 1;
    transition: opacity 0.3s ease;
}

/* 默认封面（当图片不存在时） */
.company-intro-section .video-poster-default {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(135deg, #f5f7fa 0%, #e8eef5 100%);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1;
    cursor: pointer;
    transition: opacity 0.3s ease;
}

.company-intro-section .video-container.playing .video-poster-default {
    opacity: 0;
    pointer-events: none;
}

.company-intro-section .video-poster-default .poster-logo {
    max-width: 60%;
    max-height: 60%;
    width: auto;
    height: auto;
    object-fit: contain;
}

.company-intro-section .video-container.playing .video-poster {
    opacity: 0;
    pointer-events: none;
}

/* 播放按钮覆盖层 */
.company-intro-section .video-play-overlay {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(0, 0, 0, 0.3);
    cursor: pointer;
    z-index: 2;
    transition: background 0.3s ease;
}

.company-intro-section .video-container.playing .video-play-overlay {
    display: none;
}

.company-intro-section .video-play-overlay:hover {
    background: rgba(0, 0, 0, 0.4);
}

.company-intro-section .play-button {
    width: 80px;
    height: 80px;
    background: rgba(255, 255, 255, 0.95);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3);
    transition: all 0.3s ease;
}

.company-intro-section .video-play-overlay:hover .play-button {
    transform: scale(1.1);
    background: rgba(255, 255, 255, 1);
}

.company-intro-section .play-button i {
    font-size: 32px;
    color: var(--primary-color);
    margin-left: 5px;
}

/* 数据展示网格 */
.company-intro-section .stats-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;
}

.company-intro-section .stat-item {
    background: white;
    padding: 30px 20px;
    border-radius: 8px;
    text-align: center;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05);
    transition: var(--transition);
}

.company-intro-section .stat-item:hover {
    transform: translateY(-3px);
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
}

.company-intro-section .stat-item .stat-number {
    font-size: 32px;
    font-weight: bold;
    color: #0088cc;
    margin-bottom: 8px;
}

.company-intro-section .stat-item .stat-label {
    color: #666;
    font-size: 14px;
}

/* 右侧：公司介绍文字 */
.company-intro-section .intro-right {
    flex: 1.5;
}

.company-intro-section .intro-text {
    color: #333;
    line-height: 2;
    font-size: 16px;
}

.company-intro-section .intro-text p {
    margin-bottom: 24px;
    text-indent: 2em;
}

.company-intro-section .intro-text p:last-child {
    margin-bottom: 0;
}

/* 响应式设计 */
@media (max-width: 992px) {
    .company-intro-section .intro-wrapper {
        flex-direction: column;
        gap: 40px;
    }
    
    .company-intro-section .intro-left {
        max-width: 100%;
    }
    
    .company-intro-section .intro-right {
        flex: 1;
    }
    
    /* 创始人区域响应式 */
    .founder-content {
        flex-direction: column;
    }
    
    .founder-photo {
        flex: 0 0 auto;
        max-width: 100%;
        width: 100%;
        aspect-ratio: 4 / 3;
    }
    
    .founder-info {
        padding: 36px 32px;
    }
    
    /* 发展历程响应式 */
    .history-timeline-wrap {
        padding-right: 60px;
    }

    .timeline-watermark {
        font-size: 120px;
        right: 20px;
    }

    .history-section .timeline {
        padding-left: 24px;
    }
    
    .history-section .timeline-item::before {
        left: -24px;
    }
    
    /* 企业文化响应式 */
    .culture-cards {
        grid-template-columns: repeat(2, 1fr);
        gap: 20px;
    }
    
    /* 荣誉资质响应式 - 平板 */
    .honor-timeline-layout {
        gap: 36px;
    }

    .honor-featured {
        flex: 0 0 300px;
    }

    .honor-featured-image {
        min-height: 360px;
        padding: 24px;
    }
    
    /* 生态联盟内容区响应式 */
    .ecology-content-section {
        padding: 60px 0;
    }
    
    .ecology-text-content {
        margin-bottom: 40px;
    }
    
    .ecology-image {
        padding: 30px;
    }
}

@media (max-width: 768px) {
    .company-intro-section {
        padding: 60px 0;
    }
    
    .company-intro-section .intro-wrapper {
        gap: 30px;
    }
    
    .company-intro-section .stats-grid {
        gap: 15px;
    }
    
    .company-intro-section .stat-item {
        padding: 25px 15px;
    }
    
    .company-intro-section .stat-item .stat-number {
        font-size: 28px;
    }
    
    .company-intro-section .intro-text {
        font-size: 15px;
        line-height: 1.8;
    }
    
    .company-intro-section .intro-text p {
        margin-bottom: 20px;
    }
    
    /* 移动端视频播放按钮调整 */
    .company-intro-section .play-button {
        width: 60px;
        height: 60px;
    }
    
    .company-intro-section .play-button i {
        font-size: 24px;
    }
    
    .company-intro-section .video-poster-default .poster-logo {
        max-width: 70%;
        max-height: 70%;
    }
    
    /* 发展历程移动端样式 */
    .history-section {
        padding: 60px 0;
    }
    
    .history-section .section-title {
        font-size: 28px;
        margin-bottom: 40px;
    }

    .history-timeline-wrap {
        padding-right: 0;
    }

    .timeline-nav {
        display: none;
    }

    .timeline-watermark {
        font-size: 80px;
        right: 0;
        opacity: 0.7;
    }
    
    .history-section .timeline {
        padding-left: 22px;
    }
    
    .history-section .timeline::before {
        left: 4px;
    }
    
    .history-section .timeline-item {
        flex-direction: column;
        gap: 6px;
        margin-bottom: 28px;
    }
    
    .history-section .timeline-item::before {
        left: -22px;
        top: 6px;
        width: 10px;
        height: 10px;
    }
    
    .history-section .timeline-year {
        font-size: 16px;
        min-width: auto;
    }
    
    .history-section .timeline-content p {
        font-size: 14px;
        line-height: 1.7;
    }
    
    /* 企业文化移动端样式 */
    .culture-section {
        padding: 60px 0;
    }
    
    .culture-section .section-title {
        font-size: 28px;
        margin-bottom: 40px;
    }
    
    .culture-cards {
        grid-template-columns: 1fr;
        gap: 20px;
    }
    
    .culture-card {
        padding: 24px 20px 32px;
    }
    
    .culture-card .card-title-cn {
        font-size: 18px;
    }
    
    .culture-card .card-title-en {
        font-size: 11px;
    }
    
    .culture-card .card-body p {
        font-size: 14px;
    }
    
    .culture-card .card-number {
        font-size: 48px;
    }
    
    /* 荣誉资质移动端样式 */
    .honor-section {
        padding: 60px 0;
    }

    .honor-section .section-title {
        font-size: 28px;
        margin-bottom: 40px;
    }

    .honor-timeline-layout {
        flex-direction: column;
        gap: 30px;
    }

    .honor-featured {
        flex: none;
        width: 100%;
        position: static;
    }

    .honor-featured-image {
        min-height: 280px;
        padding: 20px;
    }

    .honor-timeline-line {
        left: 68px;
    }

    .htl-year {
        width: 58px;
        font-size: 13px;
    }

    .htl-text {
        font-size: 14px;
    }
    
    /* 生态联盟内容区移动端样式 */
    .ecology-content-section {
        padding: 50px 0;
    }
    
    .ecology-text-content {
        margin-bottom: 30px;
    }
    
    .ecology-text-content p {
        font-size: 15px;
        line-height: 1.9;
        margin-bottom: 25px;
    }
    
    .ecology-image {
        padding: 20px;
    }
    
    /* 创始人区域移动端样式 */
    .founder-section {
        padding: 60px 0;
    }
    
    .founder-section .section-title {
        font-size: 28px;
        margin-bottom: 40px;
    }
    
    .founder-photo {
        aspect-ratio: 3 / 4;
        max-height: 420px;
    }
    
    .founder-info {
        padding: 28px 20px;
    }
    
    .founder-watermark {
        height: 24px;
        top: 18px;
        right: 16px;
    }
    
    .founder-name {
        font-size: 20px;
        margin-bottom: 16px;
    }
    
    .founder-titles {
        padding-bottom: 16px;
    }
    
    .founder-titles p {
        font-size: 14px;
        line-height: 1.8;
    }
    
    .founder-bio {
        margin-top: 16px;
    }
    
    .founder-bio p {
        font-size: 14px;
        line-height: 1.9;
        margin-bottom: 12px;
    }
}

/* ========================================
   专业化实施团队
   ======================================== */
.professional-team-section {
    padding: 80px 0;
}

/* 高效的实施交付流程 - 上下布局 */
.implementation-process-section {
    padding: 80px 0;
    background: rgb(230, 247, 255);
}

.implementation-process-section .process-header {
    text-align: center;
    max-width: 960px;
    margin: 0 auto 48px;
}

.implementation-process-section .process-header h2 {
    font-size: 36px;
    font-weight: 700;
    color: #222;
    line-height: 1.4;
    margin: 0 0 24px;
}

.implementation-process-section .process-header p {
    font-size: 15px;
    color: #666;
    line-height: 2;
    margin: 0;
    text-align: center;
}

.implementation-process-section .process-diagram {
    max-width: 1200px;
    margin: 0 auto;
}

.implementation-process-section .process-diagram img {
    width: 100%;
    height: auto;
    display: block;
    border-radius: 0;
    box-shadow: none;
}

@media (max-width: 768px) {
    .implementation-process-section {
        padding: 60px 0;
    }

    .implementation-process-section .process-header {
        margin-bottom: 32px;
    }

    .implementation-process-section .process-header h2 {
        font-size: 26px;
        margin-bottom: 16px;
    }

    .implementation-process-section .process-header p {
        font-size: 14px;
        line-height: 1.8;
        text-align: left;
    }
}

/* ========================================
   完善的售后服务体系
   ======================================== */
.service-system-section {
    padding: 80px 0;
    background: var(--bg-color);
}

.service-system-section .section-title {
    text-align: center;
    margin-bottom: 60px;
}

.service-system-section .section-title h2 {
    font-size: 36px;
    color: var(--text-color);
    font-weight: 600;
    margin-bottom: 15px;
}

.service-system-section .section-title p {
    font-size: 16px;
    color: var(--text-light);
}

/* Service Cards - 展开式卡片 */
.service-cards-container {
    display: flex;
    gap: 20px;
    align-items: stretch;
    height: 400px;
}

.service-card {
    position: relative;
    flex: 1;
    display: flex;
    flex-direction: column;
    height: 400px;
    border-radius: 16px;
    overflow: hidden;
    cursor: pointer;
    transition: flex 0.6s cubic-bezier(0.4, 0, 0.2, 1);
    background: #fff;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08);
    min-width: 0;
}

.service-card.active {
    flex: 3;
}

.card-bg {
    position: absolute;
    inset: 0;
    background-size: cover;
    background-position: center;
    opacity: 0;
    transition: opacity 0.5s ease;
}

.service-card.active .card-bg {
    opacity: 1;
}

.card-overlay {
    position: absolute;
    inset: 0;
    background: rgba(15, 25, 45, 0.62);
    opacity: 0;
    transition: opacity 0.5s ease;
}

.service-card.active .card-overlay {
    opacity: 1;
}

/* 简洁视图（未激活状态） */
.card-simple {
    position: relative;
    z-index: 1;
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 45px 20px;
    box-sizing: border-box;
}

.service-card.active .card-simple {
    display: none;
}

.card-simple .card-icon {
    margin-bottom: 20px;
}

.card-simple .card-icon img {
    width: 68px;
    height: 68px;
    object-fit: contain;
}

.card-simple h3 {
    font-size: 17px;
    font-weight: 600;
    color: var(--text-color);
    margin-bottom: 16px;
    line-height: 1.6;
}

.card-simple .card-number {
    font-size: 26px;
    font-weight: 700;
    color: var(--primary-color);
}

/* 展开视图（激活状态） */
.card-full {
    display: none;
    position: relative;
    z-index: 1;
    flex: 1;
    padding: 50px 40px;
    box-sizing: border-box;
    align-items: center;
}

.service-card.active .card-full {
    display: flex;
}

.card-left {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-self: stretch;
    min-width: 180px;
    flex-shrink: 0;
    padding: 10px 0;
}

.card-left-top .card-icon img {
    width: 62px;
    height: 62px;
    object-fit: contain;
}

.card-left-bottom h3 {
    font-size: 18px;
    font-weight: 600;
    color: #fff;
    margin-bottom: 12px;
    line-height: 1.6;
}

.card-left-bottom .card-number {
    font-size: 26px;
    font-weight: 700;
    color: var(--primary-color);
}

.card-vdivider {
    width: 1px;
    align-self: stretch;
    background: rgba(255, 255, 255, 0.3);
    margin: 10px 40px;
    flex-shrink: 0;
}

.card-detail {
    flex: 1;
}

.card-detail h4 {
    font-size: 18px;
    font-weight: 600;
    margin-bottom: 25px;
    color: #fff;
}

.card-detail p {
    font-size: 15px;
    line-height: 2;
    margin-bottom: 15px;
    color: rgba(255, 255, 255, 0.9);
}

@keyframes fadeIn {
    from {
        opacity: 0;
        transform: translateY(10px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* 响应式布局 */
@media (max-width: 992px) {
    .service-cards-container {
        flex-direction: column;
        height: auto;
        gap: 16px;
    }

    .service-card {
        flex: none;
        height: 90px;
        border-radius: 12px;
    }

    .service-card.active {
        height: 320px;
    }

    .card-full {
        padding: 35px 30px;
    }

    .card-left {
        min-width: 140px;
    }

    .card-vdivider {
        margin: 10px 25px;
    }
}

@media (max-width: 768px) {
    .service-system-section {
        padding: 60px 0;
    }

    .service-system-section .section-title h2 {
        font-size: 28px;
    }

    .card-full {
        padding: 30px 20px;
        flex-direction: column;
        align-items: flex-start;
    }

    .card-left {
        flex-direction: row;
        align-self: auto;
        align-items: center;
        padding: 0;
        margin-bottom: 20px;
        gap: 20px;
        width: 100%;
    }

    .card-left-bottom h3 {
        font-size: 16px;
        margin-bottom: 6px;
    }

    .card-vdivider {
        width: 100%;
        height: 1px;
        margin: 0 0 20px;
    }

    .card-detail h4 {
        font-size: 16px;
        margin-bottom: 15px;
    }

    .card-detail p {
        font-size: 14px;
        line-height: 1.8;
    }
}

.professional-team-section .section-title {
    text-align: center;
    margin-bottom: 60px;
}

.professional-team-section .section-title h2 {
    font-size: 36px;
    color: var(--text-color);
    font-weight: 600;
    margin-bottom: 15px;
}

.professional-team-section .team-features-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 28px;
    max-width: 1200px;
    margin: 0 auto;
}

.professional-team-section .feature-card {
    background: #fff;
    padding: 28px 32px;
    border-radius: 12px;
    border: 1px solid rgba(0, 160, 234, 0.28);
    box-shadow: 0 4px 18px rgba(0, 160, 234, 0.08);
    transition: var(--transition);
}

.professional-team-section .feature-card:hover {
    transform: translateY(-4px);
    border-color: rgba(0, 160, 234, 0.5);
    box-shadow: 0 8px 28px rgba(0, 160, 234, 0.14);
}

.professional-team-section .feature-header {
    display: flex;
    align-items: center;
    gap: 14px;
    margin-bottom: 16px;
}

.professional-team-section .feature-icon {
    width: 40px;
    height: 40px;
    flex-shrink: 0;
    background: none;
    border-radius: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 0;
}

.professional-team-section .feature-icon img {
    width: 40px;
    height: 40px;
    object-fit: contain;
    display: block;
}

.professional-team-section .feature-card h3 {
    font-size: 18px;
    color: #333;
    font-weight: 700;
    margin: 0;
    line-height: 1.45;
}

.professional-team-section .feature-card p {
    font-size: 14px;
    color: #666;
    line-height: 1.9;
    margin: 0;
}

/* 响应式布局 */
@media (max-width: 768px) {
    .professional-team-section {
        padding: 60px 0;
    }
    
    .professional-team-section .section-title h2 {
        font-size: 28px;
    }
    
    .professional-team-section .team-features-grid {
        grid-template-columns: 1fr;
        gap: 20px;
    }
    
    .professional-team-section .feature-card {
        padding: 24px 20px;
    }

    .professional-team-section .feature-header {
        gap: 12px;
        margin-bottom: 14px;
    }

    .professional-team-section .feature-icon,
    .professional-team-section .feature-icon img {
        width: 36px;
        height: 36px;
    }
    
    .professional-team-section .feature-card h3 {
        font-size: 16px;
    }
    
    .professional-team-section .feature-card p {
        font-size: 14px;
    }
}

/* ========================================
   加盟代理页面样式
   ======================================== */

/* 人力资源管理新趋势 */
.hr-trend-section {
    padding: 80px 0;
    background: #f5f8fb;
}

.hr-trend-section .section-header {
    text-align: center;
    margin-bottom: 60px;
}

.hr-trend-section .section-header h2 {
    font-size: 36px;
    font-weight: 600;
    color: #333;
    margin-bottom: 15px;
}

.hr-trend-section .section-header p {
    font-size: 16px;
    color: #666;
}

.trend-cards {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
}

.hr-trend-section .trend-card {
    display: flex;
    align-items: flex-start;
    gap: 18px;
    background: #fff;
    padding: 28px 24px;
    border-radius: 12px;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.06);
    transition: var(--transition);
}

.hr-trend-section .trend-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 8px 24px rgba(0, 160, 234, 0.12);
}

.hr-trend-section .trend-icon {
    width: 56px;
    height: 56px;
    flex-shrink: 0;
    background: none;
    border-radius: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 0;
}

.hr-trend-section .trend-icon img {
    width: 56px;
    height: 56px;
    object-fit: contain;
    display: block;
}

.hr-trend-section .trend-body {
    flex: 1;
    min-width: 0;
}

.hr-trend-section .trend-card h3 {
    font-size: 18px;
    font-weight: 700;
    color: #222;
    margin: 0 0 10px;
    line-height: 1.4;
}

.hr-trend-section .trend-card p {
    font-size: 14px;
    color: #666;
    line-height: 1.8;
    margin: 0;
}

/* 选择，成就更好的未来 */
.choose-section {
    padding: 80px 0;
    background: #f0f7fc;
}

.choose-section .section-header {
    text-align: center;
    margin-bottom: 60px;
}

.choose-cards {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 40px 32px;
}

.choose-section .choose-card {
    text-align: center;
    transition: var(--transition);
    padding: 0 8px;
}

.choose-section .choose-card:hover {
    transform: translateY(-4px);
}

.choose-section .choose-icon {
    width: 72px;
    height: 72px;
    background: none;
    border-radius: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 22px;
    transition: var(--transition);
}

.choose-section .choose-card:hover .choose-icon {
    transform: translateY(-2px);
}

.choose-section .choose-icon img {
    width: 72px;
    height: 72px;
    object-fit: contain;
    display: block;
}

.choose-section .choose-card h3 {
    font-size: 18px;
    font-weight: 700;
    color: #222;
    margin: 0 0 14px;
    line-height: 1.4;
}

.choose-section .choose-card p {
    font-size: 14px;
    color: #666;
    line-height: 1.9;
    margin: 0;
}

/* 同鑫支持政策 */
.support-section {
    padding: 80px 0;
    background: #fff;
}

.support-section .section-header {
    text-align: center;
    margin-bottom: 60px;
}

.support-cards {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 40px 32px;
}

.support-section .support-card {
    background: transparent;
    padding: 0 8px;
    border-radius: 0;
    text-align: center;
    box-shadow: none;
    transition: var(--transition);
}

.support-section .support-card:hover {
    transform: translateY(-4px);
    box-shadow: none;
}

.support-section .support-icon {
    width: 72px;
    height: 72px;
    background: none;
    border-radius: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 22px;
}

.support-section .support-icon img {
    width: 72px;
    height: 72px;
    object-fit: contain;
    display: block;
}

.support-section .support-card h3 {
    font-size: 18px;
    font-weight: 700;
    color: #222;
    margin: 0 0 14px;
    line-height: 1.4;
}

.support-section .support-card > p,
.support-section .support-list {
    font-size: 14px;
    color: #666;
    line-height: 1.9;
    margin: 0;
}

.support-section .support-list {
    display: inline-block;
    text-align: left;
    max-width: 100%;
}

.support-section .support-list p {
    margin: 0 0 4px;
    font-size: 14px;
    color: #666;
    line-height: 1.9;
}

.support-section .support-list p:last-child {
    margin-bottom: 0;
}

/* 开放，灵活匹配合作模式 */
.cooperation-section {
    padding: 80px 0;
    background: #f0f7fc;
}

.cooperation-section .section-header {
    text-align: center;
    margin-bottom: 60px;
}

.cooperation-cards {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 40px 48px;
    align-items: start;
}

.cooperation-section .cooperation-card {
    text-align: left;
    transition: var(--transition);
    padding: 0;
}

.cooperation-section .cooperation-card:hover {
    transform: translateY(-4px);
}

.cooperation-section .cooperation-icon {
    width: 56px;
    height: 56px;
    background: none;
    border-radius: 0;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    margin: 0 0 20px;
    transition: var(--transition);
}

.cooperation-section .cooperation-card:hover .cooperation-icon {
    transform: translateY(-2px);
}

.cooperation-section .cooperation-icon img {
    width: 56px;
    height: 56px;
    object-fit: contain;
    display: block;
}

.cooperation-section .cooperation-card h3 {
    font-size: 20px;
    font-weight: 700;
    color: #222;
    margin: 0 0 14px;
    line-height: 1.4;
}

.cooperation-section .cooperation-card p {
    font-size: 14px;
    color: #666;
    line-height: 1.9;
    margin: 0;
}

/* 代理加盟 */
.agency-section {
    padding: 80px 0;
    background: #fff;
}

.agency-intro {
    text-align: center;
    margin-bottom: 50px;
}

.agency-intro p {
    font-size: 15px;
    color: #666;
    line-height: 1.8;
    max-width: 900px;
    margin: 0 auto;
}

.agency-process {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 20px;
    margin-bottom: 40px;
    flex-wrap: wrap;
}

.process-step {
    flex: 1;
    max-width: 150px;
    text-align: center;
}

.process-step > div {
    background: #fff;
    padding: 20px;
    border-radius: 8px;
    border: 2px solid var(--primary-color);
    transition: var(--transition);
}

.process-step:hover > div {
    transform: scale(1.05);
    box-shadow: 0 4px 15px rgba(0, 160, 234, 0.3);
}

.process-step p {
    font-size: 16px;
    color: var(--primary-color);
    font-weight: 600;
    margin: 0;
}

.process-arrow {
    flex: 0 0 40px;
    text-align: center;
}

.process-arrow i {
    font-size: 24px;
    color: var(--primary-color);
}

.agency-cta {
    text-align: center;
}

.agency-cta .btn-primary {
    display: inline-block;
    padding: 15px 50px;
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--primary-dark) 100%);
    color: #fff;
    font-size: 18px;
    font-weight: 600;
    border-radius: 50px;
    text-decoration: none;
    transition: all 0.3s;
    border: none;
    cursor: pointer;
}

.agency-cta .btn-primary:hover {
    transform: translateY(-3px);
    box-shadow: 0 8px 25px rgba(0, 160, 234, 0.4);
}

/* 加盟代理页面响应式 */
@media (max-width: 992px) {
    .trend-cards {
        grid-template-columns: 1fr;
        gap: 25px;
    }
    
    .choose-cards {
        grid-template-columns: repeat(2, 1fr);
        gap: 36px 24px;
    }

    .choose-section .choose-icon,
    .choose-section .choose-icon img {
        width: 64px;
        height: 64px;
    }
    
    .support-cards {
        grid-template-columns: repeat(2, 1fr);
        gap: 36px 24px;
    }

    .support-section .support-icon,
    .support-section .support-icon img {
        width: 64px;
        height: 64px;
    }
    
    .cooperation-cards {
        grid-template-columns: 1fr;
        gap: 36px;
    }

    .cooperation-section .cooperation-icon,
    .cooperation-section .cooperation-icon img {
        width: 48px;
        height: 48px;
    }
    
    .agency-process {
        flex-direction: column;
        gap: 15px;
    }
    
    .process-step {
        max-width: 100%;
    }
    
    .process-arrow {
        transform: rotate(90deg);
    }
}

@media (max-width: 768px) {
    .hr-trend-section,
    .choose-section,
    .support-section,
    .cooperation-section,
    .agency-section {
        padding: 60px 0;
    }
    
    .hr-trend-section .section-header h2,
    .choose-section .section-header h2,
    .support-section .section-header h2,
    .cooperation-section .section-header h2,
    .agency-section .section-header h2 {
        font-size: 28px;
    }
    
    .choose-cards,
    .support-cards {
        grid-template-columns: 1fr;
        gap: 32px;
    }

    .support-section .support-icon,
    .support-section .support-icon img {
        width: 60px;
        height: 60px;
        margin-bottom: 16px;
    }

    .support-section .support-card h3 {
        font-size: 17px;
        margin-bottom: 10px;
    }

    .support-section .support-card > p,
    .support-section .support-list p {
        font-size: 13px;
    }

    .choose-section .choose-icon,
    .choose-section .choose-icon img {
        width: 60px;
        height: 60px;
        margin-bottom: 16px;
    }

    .choose-section .choose-card h3 {
        font-size: 17px;
        margin-bottom: 10px;
    }

    .choose-section .choose-card p {
        font-size: 13px;
    }
    
    .hr-trend-section .trend-card {
        padding: 24px 18px;
    }

    .hr-trend-section .trend-icon,
    .hr-trend-section .trend-icon img {
        width: 48px;
        height: 48px;
    }
    
    .hr-trend-section .trend-card h3,
    .choose-card h3,
    .support-card h3,
    .cooperation-section .cooperation-card h3 {
        font-size: 18px;
    }

    .cooperation-section .cooperation-card h3 {
        margin-bottom: 10px;
    }

    .cooperation-section .cooperation-card p {
        font-size: 13px;
    }
    
    .agency-intro p {
        font-size: 14px;
    }
    
    .agency-cta .btn-primary {
        padding: 12px 40px;
        font-size: 16px;
    }
}

/* ========================================
   社区交流页面
   ======================================== */
.community-content {
    background: var(--bg-color);
    padding: 60px 0;
}

.community-content .container {
    max-width: 1200px;
    margin: 0 auto;
}

/* 导航标签 */
.community-tabs {
    background: var(--bg-color);
    border-radius: 8px;
    padding: 20px;
    margin-bottom: 30px;
    box-shadow: var(--shadow);
}

.community-tabs ul {
    display: flex;
    gap: 40px;
    list-style: none;
    padding: 0;
    margin: 0;
    border-bottom: 1px solid var(--border-color);
    padding-bottom: 15px;
}

.community-tabs ul li a {
    color: var(--text-light);
    font-size: 16px;
    text-decoration: none;
    transition: var(--transition);
}

.community-tabs ul li a:hover {
    color: var(--primary-color);
}

.community-tabs ul li a.active {
    color: var(--primary-color);
    font-weight: 500;
    border-bottom: 2px solid var(--primary-color);
    padding-bottom: 13px;
}

/* 帖子列表 */
.community-posts {
    /* 帖子容器 */
}

.post-item {
    background: var(--bg-color);
    border-radius: 8px;
    padding: 30px;
    margin-bottom: 20px;
    box-shadow: var(--shadow);
    transition: var(--transition);
}

.post-item:hover {
    box-shadow: var(--shadow-hover);
}

.post-item h3 {
    font-size: 20px;
    color: var(--text-color);
    margin-bottom: 20px;
    font-weight: 500;
}

.post-item p {
    color: var(--text-light);
    line-height: 1.8;
    margin-bottom: 30px;
}

/* 评论框 */
.comment-box {
    display: flex;
    align-items: center;
    gap: 15px;
    padding-top: 20px;
    border-top: 1px solid var(--bg-light);
}

.user-avatar {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: var(--primary-color);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.user-avatar svg {
    width: 24px;
    height: 24px;
    fill: #fff;
}

.comment-box input[type="text"] {
    flex: 1;
    height: 40px;
    border: 1px solid var(--border-color);
    border-radius: 4px;
    padding: 0 15px;
    font-size: 14px;
    color: var(--text-light);
    transition: var(--transition);
}

.comment-box input[type="text"]:focus {
    outline: none;
    border-color: var(--primary-color);
}

.comment-box input[type="text"]::placeholder {
    color: var(--text-muted);
}

.comment-box button {
    height: 40px;
    padding: 0 30px;
    background: var(--primary-color);
    color: #fff;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    font-size: 14px;
    transition: var(--transition);
}

.comment-box button:hover {
    background: var(--primary-dark);
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0, 160, 234, 0.4);
}

.comment-box button:active {
    transform: translateY(0);
}

/* 响应式设计 */
@media (max-width: 768px) {
    .community-content {
        padding: 40px 0;
    }
    
    .community-tabs {
        padding: 15px;
        margin-bottom: 20px;
    }
    
    .community-tabs ul {
        gap: 20px;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }
    
    .post-item {
        padding: 20px;
        margin-bottom: 15px;
    }
    
    .post-item h3 {
        font-size: 18px;
        margin-bottom: 15px;
    }
    
    .post-item p {
        margin-bottom: 20px;
    }
    
    .comment-box {
        flex-wrap: wrap;
        gap: 10px;
    }
    
    .comment-box input[type="text"] {
        flex: 1;
        min-width: 200px;
    }
    
    .comment-box button {
        width: 100%;
    }
}

/* 产品价值部分 */
.product-value {
    padding: 80px 0;
    background: #f8f9fa;
}

.value-header {
    text-align: center;
    margin-bottom: 60px;
}

.value-header h2 {
    font-size: 36px;
    font-weight: 600;
    color: #333;
    margin-bottom: 20px;
}

.value-subtitle {
    font-size: 16px;
    color: #666;
    line-height: 1.8;
    max-width: 1000px;
    margin: 0 auto;
}

.value-diagram {
    text-align: center;
    margin-top: 40px;
}

.value-diagram img {
    max-width: 100%;
    height: auto;
    display: inline-block;
}

@media (max-width: 768px) {
    .value-header h2 {
        font-size: 28px;
    }
    
    .value-subtitle {
        font-size: 14px;
    }
    
    .product-value {
        padding: 40px 0;
    }
}

/* 核心功能点部分 */
.core-functions {
    padding: 80px 0;
    background: #f5f8fa;
}

.core-header {
    text-align: center;
    margin-bottom: 50px;
}

.core-header h2 {
    font-size: 36px;
    font-weight: 600;
    color: #333;
}

.functions-tabs {
    display: flex;
    justify-content: center;
    gap: 10px;
    margin-bottom: 50px;
    flex-wrap: wrap;
}

.function-tab {
    padding: 12px 30px;
    background: white;
    border: 1px solid #e0e0e0;
    border-radius: 30px;
    cursor: pointer;
    font-size: 16px;
    color: #666;
    transition: all 0.3s ease;
}

.function-tab:hover {
    border-color: #00a6ff;
    color: #00a6ff;
}

.function-tab.active {
    background: linear-gradient(135deg, #00a6ff 0%, #0086ff 100%);
    color: white;
    border-color: #00a6ff;
    font-weight: 500;
}

.core-functions .tab-content {
    display: none;
    background: white;
    padding: 50px;
    border-radius: 16px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.06);
    flex-wrap: wrap;
    gap: 40px;
}

.core-functions .tab-content.active {
    display: flex;
}

.features-list {
    flex: 0 0 45%;
    display: flex;
    flex-direction: column;
    gap: 0;
}

.features-images {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 25px;
    min-width: 300px;
}

.features-images img {
    width: 100%;
    height: auto;
    border-radius: 12px;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.08);
    transition: all 0.3s ease;
}

.features-images img:hover {
    transform: translateY(-3px);
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.12);
}

.features-list .view-more-btn {
    margin-top: 10px;
    width:50%;
    text-align: center;
}

.tab-layout {
    display: flex;
    gap: 40px;
    align-items: flex-start;
    max-width: 1400px;
    margin: 0 auto;
}

.tab-left {
    flex: 0 0 42%;
    background: white;
    padding: 50px 45px;
    border-radius: 16px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.06);
}

.feature-item {
    margin-bottom: 35px;
}

.feature-item:last-of-type {
    margin-bottom: 30px;
}

.feature-item h4 {
    font-size: 18px;
    font-weight: 600;
    color: #333;
    margin: 0 0 12px 0;
    line-height: 1.4;
}

.feature-item p {
    font-size: 15px;
    color: #666;
    line-height: 1.8;
    margin: 0;
}

.feature-icon {
    flex-shrink: 0;
    width: 65px;
    height: auto;
    min-height: 65px;
    background: linear-gradient(135deg, #00b8ff 0%, #0090ff 100%);
    border-radius: 35px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    padding: 18px 0;
    box-shadow: 0 2px 8px rgba(0, 166, 255, 0.2);
}

.feature-icon span {
    font-size: 15px;
    font-weight: 500;
    line-height: 1.8;
    letter-spacing: 0;
    writing-mode: vertical-rl;
    text-orientation: upright;
}

.feature-content p {
    font-size: 15px;
    color: #666;
    line-height: 1.8;
    margin: 0;
}

.view-more-btn {
    display: inline-block;
    padding: 14px 40px;
    background: linear-gradient(135deg, #00a6ff 0%, #0086ff 100%);
    color: white;
    border-radius: 30px;
    text-decoration: none;
    font-size: 16px;
    margin-top: 10px;
    transition: all 0.3s ease;
    font-weight: 500;
}

.view-more-btn:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 16px rgba(0, 166, 255, 0.35);
}

.tab-right {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 25px;
}

.tab-right img {
    width: 100%;
    height: auto;
    border-radius: 12px;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.08);
    transition: all 0.3s ease;
}

.tab-right img:hover {
    transform: translateY(-3px);
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.12);
}

@media (max-width: 1200px) {
    .tab-layout {
        flex-direction: column;
        gap: 40px;
    }
    
    .tab-left {
        flex: 1;
        width: 100%;
    }
    
    .tab-right {
        width: 100%;
    }
    
    .core-functions .tab-content {
        flex-direction: column;
        padding: 40px;
    }
    
    .features-list {
        flex: 1;
        width: 100%;
    }
    
    .features-images {
        width: 100%;
    }
}

@media (max-width: 768px) {
    .core-functions {
        padding: 40px 0;
    }
    
    .core-header h2 {
        font-size: 26px;
    }
    
    .functions-tabs {
        gap: 8px;
        margin-bottom: 30px;
    }
    
    .function-tab {
        padding: 10px 18px;
        font-size: 14px;
    }
    
    .tab-left {
        padding: 35px 25px;
    }
    
    .core-functions .tab-content {
        padding: 30px 20px;
    }
    
    .feature-item {
        margin-bottom: 30px;
    }
    
    .feature-item h4 {
        font-size: 16px;
        margin-bottom: 10px;
    }
    
    .feature-item p {
        font-size: 14px;
    }
    
    .feature-icon {
        width: 55px;
        min-height: 55px;
        border-radius: 28px;
        padding: 15px 0;
    }
    
    .feature-icon span {
        font-size: 14px;
    }
    
    .feature-content p {
        font-size: 14px;
    }
    
    .view-more-btn {
        padding: 12px 35px;
        font-size: 15px;
    }
    
    .tab-right {
        gap: 20px;
    }
    
    .features-images {
        gap: 20px;
    }
}

/* ===== 客户Logo滚动区（Swiper 跑马灯） ===== */
.clients-marquee {
    padding: 60px 0;
    background: rgb(230, 247, 255);
}

.clients-marquee .swiper {
    margin-bottom: 20px;
    overflow: hidden;
}

.clients-marquee .swiper:last-child {
    margin-bottom: 0;
}

.clients-marquee .swiper-wrapper {
    transition-timing-function: linear !important;
    align-items: center;
}

.clients-marquee .swiper-slide {
    width: auto !important;
}

.clients-marquee .logo-item {
    width: 160px;
    height: 72px;
    background: #fff;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 12px 20px;
    box-shadow: 0 2px 8px rgba(0,0,0,0.06);
    transition: box-shadow 0.2s;
}

.clients-marquee .logo-item:hover {
    box-shadow: 0 4px 16px rgba(0,0,0,0.12);
}

.clients-marquee .logo-item img {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
    display: block;
}

@media (max-width: 768px) {
    .clients-marquee {
        padding: 40px 0;
    }
    .clients-marquee .logo-item {
        width: 110px;
        height: 52px;
        padding: 8px 12px;
    }
    .clients-marquee .swiper {
        margin-bottom: 12px;
    }
}

/* ===== 为什么选择同鑫 ===== */
.why-us {
    padding: 80px 0;
    background: #fff;
}

.why-us-list {
    display: flex;
    gap: 12px;
    height: 280px;
    margin-top: 48px;
}

.why-us-item {
    position: relative;
    flex: 1;
    border-radius: 16px;
    overflow: hidden;
    cursor: pointer;
    transition: flex 0.5s cubic-bezier(0.4, 0, 0.2, 1);
    min-width: 0;
    background: #deeeff;
    border: 2px solid transparent;
    box-sizing: border-box;
}

.why-us-item.active {
    flex: 3.2;
    border-color: #fff;
    box-shadow: 0 8px 32px rgba(22,119,255,0.25);
}

/* 蓝色渐变背景层（展开时显示） */
.why-us-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(145deg, #1677ff 0%, #36a3ff 100%);
    opacity: 0;
    transition: opacity 0.4s ease;
}

.why-us-item.active .why-us-overlay {
    opacity: 1;
}

/* 背景图片层 —— 右下角，收缩时宽50%，展开时宽100% */
.why-us-bg {
    position: absolute;
    bottom: 0;
    right: 0;
    width: 150%;
    height: 150%;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: right bottom;
    transition: width 0.5s cubic-bezier(0.4, 0, 0.2, 1),
                height 0.5s cubic-bezier(0.4, 0, 0.2, 1),
                opacity 0.4s ease;
    opacity: 0.85;
    z-index: 2;
}

.why-us-item.active .why-us-bg {
    opacity: 1;
}

/* 文字内容层 —— 在图片下面，左上角 */
.why-us-content {
    position: absolute;
    inset: 0;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    padding: 26px 22px;
    z-index: 3;
}

.why-us-title {
    font-size: 15px;
    font-weight: 700;
    color: #1a2e4a;
    margin: 0;
    white-space: nowrap;
    transition: color 0.3s ease, font-size 0.3s ease;
}

.why-us-item.active .why-us-title {
    color: #fff;
    font-size: 20px;
    margin-bottom: 14px;
}

.why-us-desc {
    font-size: 13px;
    line-height: 1.85;
    color: rgba(255,255,255,0.95);
    margin: 0;
    max-height: 0;
    overflow: hidden;
    opacity: 0;
    transition: max-height 0.45s cubic-bezier(0.4, 0, 0.2, 1),
                opacity 0.3s ease 0.12s;
}

.why-us-item.active .why-us-desc {
    max-height: 200px;
    opacity: 1;
}

@media (max-width: 900px) {
    .why-us-list {
        flex-direction: column;
        height: auto;
    }
    .why-us-item {
        height: 72px;
        flex: none;
        transition: height 0.5s cubic-bezier(0.4, 0, 0.2, 1);
    }
    .why-us-item.active {
        flex: none;
    }
    .why-us-bg {
        width: 100%;
        height: 60%;
    }
}

/* ========== 热门资讯区 ========== */
.news-section {
    padding: 64px 0 56px;
    background: #fff;
}

.news-section .section-header {
    text-align: center;
    margin-bottom: 40px;
}

.news-section .section-title {
    font-size: 26px;
    font-weight: 700;
    color: #1a2340;
    margin: 0 0 8px;
    letter-spacing: 1px;
    position: relative;
    display: inline-block;
}

.news-section .section-title::after {
    content: '';
    display: block;
    width: 40px;
    height: 3px;
    background: #1677ff;
    border-radius: 2px;
    margin: 10px auto 0;
}

.news-section .section-subtitle {
    font-size: 14px;
    color: #9aa5be;
    margin: 14px 0 0;
}

.news-section .container {
    width: 100%;
    max-width: 1200px;
    overflow: hidden;
}

.news-section .news-layout {
    display: flex;
    gap: 0;
    align-items: stretch;
    width: 100%;
    max-width: 100%;
    min-width: 0;
    background: #fff;
    border: 1px solid #eef0f5;
    overflow: hidden;
}

.news-section .news-cover {
    flex: 0 0 520px;
    max-width: 520px;
    min-width: 0;
    overflow: hidden;
    position: relative;
}

.news-section .news-cover-link {
    display: block;
    height: 100%;
    line-height: 0;
}

.news-section .news-cover-img {
    width: 100%;
    height: 100%;
    min-height: 320px;
    max-width: 100%;
    object-fit: cover;
    display: block;
    transition: transform 0.45s ease;
}

.news-section .news-cover:hover .news-cover-img {
    transform: scale(1.04);
}

.news-section .news-list {
    flex: 1 1 auto;
    min-width: 0;
    max-width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding: 0;
    margin: 0;
}

.news-section .news-item {
    display: block;
    width: 100%;
    max-width: 100%;
    min-width: 0;
    gap: 0;
    padding: 20px 32px;
    border-radius: 0;
    border-bottom: 1px solid #f0f2f7;
    background: transparent;
    box-shadow: none;
    transform: none;
    transition: background 0.18s;
}

.news-section .news-item:last-child {
    border-bottom: none;
}

.news-section .news-item:hover {
    background: #f7f9ff;
    box-shadow: none;
    transform: none;
}

.news-section .news-item-link {
    display: block;
    width: 100%;
    max-width: 100%;
    min-width: 0;
    margin-bottom: 0;
    text-decoration: none;
    color: inherit;
}

.news-section .news-item-title {
    font-size: 15px;
    font-weight: 600;
    color: #1a2340;
    margin: 0 0 8px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    overflow-wrap: anywhere;
    word-break: break-word;
    transition: color 0.2s;
    line-height: 1.5;
}

.news-section .news-item-link:hover .news-item-title {
    color: #1677ff;
}

.news-section .news-item-summary {
    font-size: 13px;
    color: #8a96b0;
    margin: 0;
    line-height: 1.8;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    overflow-wrap: anywhere;
    word-break: break-word;
}

.news-section .news-more {
    text-align: center;
    margin-top: 32px;
}

.news-section .btn-news-more {
    display: inline-block;
    padding: 9px 34px;
    border: 1.5px solid #1677ff;
    border-radius: 22px;
    color: #1677ff;
    font-size: 14px;
    text-decoration: none;
    transition: background 0.2s, color 0.2s;
    letter-spacing: 0.5px;
}

.news-section .btn-news-more:hover {
    background: #1677ff;
    color: #fff;
}

@media (max-width: 960px) {
    .news-section {
        padding: 48px 0 40px;
    }

    .news-section .news-layout {
        flex-direction: column;
    }

    .news-section .news-cover {
        flex: 0 0 auto;
        width: 100%;
        max-width: 100%;
        max-height: 200px;
    }

    .news-section .news-cover-img {
        min-height: 0;
        height: 200px;
        width: 100%;
    }

    .news-section .news-item {
        padding: 14px 16px;
        flex-direction: unset;
    }

    .news-section .news-item-title {
        white-space: normal;
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        text-overflow: ellipsis;
    }
}

@media (max-width: 480px) {
    .news-section .news-cover {
        max-height: 160px;
    }

    .news-section .news-cover-img {
        height: 160px;
    }

    .news-section .news-item {
        padding: 12px 14px;
    }

    .news-section .news-item-title {
        font-size: 14px;
    }
}

/* =============================================
   登录 / 注册 页面样式
   ============================================= */
.auth-body {
    margin: 0;
    padding: 0;
    min-height: 100vh;
    background: #f0f4f8;
    display: flex;
    align-items: stretch;
}

.auth-page {
    display: flex;
    width: 100%;
    min-height: 100vh;
}

/* 左侧品牌区 */
.auth-brand {
    flex: 0 0 45%;
    background: linear-gradient(145deg, var(--primary-color) 0%, var(--primary-dark) 60%, #005fa3 100%);
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    overflow: hidden;
}

.auth-brand::before {
    content: '';
    position: absolute;
    inset: 0;
    background: url('../images/banner-bg.svg') center/cover no-repeat;
    opacity: 0.08;
}

.auth-brand-inner {
    position: relative;
    z-index: 1;
    padding: 48px 56px;
    color: #fff;
    max-width: 440px;
}

.auth-logo {
    display: inline-block;
    margin-bottom: 40px;
}

.auth-logo img {
    height: 44px;
    width: auto;
}

.auth-brand-title {
    font-size: 28px;
    font-weight: 700;
    line-height: 1.4;
    margin: 0 0 12px;
    letter-spacing: 0.5px;
}

.auth-brand-desc {
    font-size: 15px;
    opacity: 0.85;
    margin: 0 0 36px;
}

.auth-brand-features {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.auth-brand-features li {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 15px;
    opacity: 0.9;
}

.auth-brand-features li i {
    color: #7de8ff;
    font-size: 16px;
    flex-shrink: 0;
}

/* 右侧表单区 */
.auth-form-wrap {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 40px 24px;
    overflow-y: auto;
}

.auth-card {
    width: 100%;
    max-width: 460px;
    background: #fff;
    border-radius: 16px;
    box-shadow: 0 8px 40px rgba(0, 0, 0, 0.1);
    padding: 40px 40px 32px;
}

.auth-card-header {
    margin-bottom: 28px;
}

.auth-title {
    font-size: 26px;
    font-weight: 700;
    color: #1a2332;
    margin: 0 0 6px;
}

.auth-subtitle {
    font-size: 14px;
    color: #8a9ab0;
    margin: 0;
}

/* 登录方式标签 */
.auth-tabs {
    display: flex;
    gap: 0;
    margin-bottom: 24px;
    border-bottom: 2px solid #eef1f5;
}

.auth-tab {
    flex: 1;
    background: none;
    border: none;
    padding: 10px 0;
    font-size: 15px;
    font-weight: 500;
    color: #8a9ab0;
    cursor: pointer;
    position: relative;
    transition: color 0.2s;
}

.auth-tab::after {
    content: '';
    position: absolute;
    bottom: -2px;
    left: 0;
    right: 0;
    height: 2px;
    background: var(--primary-color);
    transform: scaleX(0);
    transition: transform 0.25s;
}

.auth-tab.active {
    color: var(--primary-color);
}

.auth-tab.active::after {
    transform: scaleX(1);
}

/* 表单内容显隐 */
.auth-tab-content {
    display: none;
}

.auth-tab-content.active {
    display: block;
}

/* 表单通用 */
.auth-form {
    display: flex;
    flex-direction: column;
    gap: 0;
}

.form-group {
    margin-bottom: 18px;
}

.form-label {
    display: block;
    font-size: 13px;
    font-weight: 500;
    color: #3d4d63;
    margin-bottom: 7px;
}

.form-label .required {
    color: #e53e3e;
    margin-left: 2px;
}

.form-input-wrap {
    position: relative;
    display: flex;
    align-items: center;
}

.form-icon {
    position: absolute;
    left: 14px;
    color: #b0bec5;
    font-size: 15px;
    pointer-events: none;
}

.form-input {
    width: 100%;
    height: 44px;
    border: 1.5px solid #e2e8f0;
    border-radius: 8px;
    padding: 0 42px;
    font-size: 14px;
    color: #1a2332;
    background: #fafbfc;
    transition: border-color 0.2s, box-shadow 0.2s;
    box-sizing: border-box;
    outline: none;
}

.form-input:focus {
    border-color: var(--primary-color);
    box-shadow: 0 0 0 3px rgba(0, 160, 234, 0.12);
    background: #fff;
}

.form-input::placeholder {
    color: #b0bec5;
}

.form-eye-btn {
    position: absolute;
    right: 12px;
    background: none;
    border: none;
    color: #b0bec5;
    cursor: pointer;
    padding: 4px;
    display: flex;
    align-items: center;
    font-size: 15px;
    transition: color 0.2s;
}

.form-eye-btn:hover {
    color: var(--primary-color);
}

/* 带按钮的输入框 */
.form-input-with-btn .form-input {
    padding-right: 120px;
}

.btn-send-code {
    position: absolute;
    right: 2px;
    height: 36px;
    padding: 0 14px;
    background: var(--primary-color);
    color: #fff;
    border: none;
    border-radius: 6px;
    font-size: 13px;
    cursor: pointer;
    white-space: nowrap;
    transition: background 0.2s;
}

.btn-send-code:hover {
    background: var(--primary-dark);
}

.btn-send-code:disabled {
    background: #b0bec5;
    cursor: not-allowed;
}

/* 记住我 / 忘记密码 */
.form-options {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 20px;
    font-size: 13px;
}

.form-remember {
    display: flex;
    align-items: center;
    gap: 6px;
    color: #5a6a80;
    cursor: pointer;
}

.form-remember input[type="checkbox"] {
    accent-color: var(--primary-color);
    cursor: pointer;
}

.form-link {
    color: #8a9ab0;
    text-decoration: none;
    font-size: 13px;
    transition: color 0.2s;
}

.form-link:hover {
    color: var(--primary-color);
}

.form-link-primary {
    color: var(--primary-color);
    text-decoration: none;
    font-weight: 500;
    transition: color 0.2s;
}

.form-link-primary:hover {
    color: var(--primary-dark);
    text-decoration: underline;
}

/* 主按钮 */
.btn-auth {
    display: block;
    width: 100%;
    height: 46px;
    background: var(--primary-color);
    color: #fff;
    border: none;
    border-radius: 8px;
    font-size: 16px;
    font-weight: 600;
    cursor: pointer;
    letter-spacing: 2px;
    transition: background 0.2s, transform 0.1s, box-shadow 0.2s;
    box-shadow: 0 4px 12px rgba(0, 160, 234, 0.3);
    text-decoration: none;
    text-align: center;
    line-height: 46px;
}

.btn-auth:hover {
    background: var(--primary-dark);
    box-shadow: 0 6px 18px rgba(0, 160, 234, 0.4);
}

.btn-auth:active {
    transform: translateY(1px);
}

.btn-auth-outline {
    display: inline-block;
    height: 46px;
    padding: 0 32px;
    border: 2px solid var(--primary-color);
    color: var(--primary-color);
    background: none;
    border-radius: 8px;
    font-size: 15px;
    font-weight: 500;
    cursor: pointer;
    text-decoration: none;
    text-align: center;
    line-height: 42px;
    transition: all 0.2s;
}

.btn-auth-outline:hover {
    background: var(--primary-light);
}

/* 底部跳转链接 */
.auth-footer-links {
    text-align: center;
    margin-top: 20px;
    font-size: 14px;
    color: #8a9ab0;
}

/* 提示框 */
.auth-alert {
    padding: 10px 14px;
    border-radius: 6px;
    font-size: 13px;
    margin-bottom: 16px;
    line-height: 1.5;
}

.auth-alert-error {
    background: #fff2f0;
    border: 1px solid #ffccc7;
    color: #cf1322;
}

.auth-alert-success {
    background: #f6ffed;
    border: 1px solid #b7eb8f;
    color: #389e0d;
}

/* 版权信息 */
.auth-copyright {
    margin-top: 24px;
    font-size: 12px;
    color: #b0bec5;
    text-align: center;
}

.auth-copyright a {
    color: #b0bec5;
    text-decoration: none;
}

.auth-copyright a:hover {
    color: var(--primary-color);
}

/* 注册步骤指示器 */
.register-steps {
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 28px;
    gap: 0;
}

.register-step {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 6px;
}

.step-circle {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    border: 2px solid #d4dde6;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    font-weight: 600;
    color: #b0bec5;
    background: #fff;
    transition: all 0.3s;
}

.register-step.active .step-circle {
    border-color: var(--primary-color);
    background: var(--primary-color);
    color: #fff;
}

.register-step.done .step-circle {
    border-color: var(--primary-color);
    background: var(--primary-light);
    color: var(--primary-color);
}

.step-label {
    font-size: 12px;
    color: #b0bec5;
    white-space: nowrap;
}

.register-step.active .step-label,
.register-step.done .step-label {
    color: var(--primary-color);
}

.step-line {
    flex: 1;
    height: 2px;
    background: #e2e8f0;
    margin: 0 12px;
    margin-bottom: 22px;
    min-width: 60px;
}

/* 注册面板显隐 */
.register-panel {
    display: none;
}

.register-panel.active {
    display: block;
}

/* 同意协议 */
.form-agree {
    margin-bottom: 20px;
    font-size: 13px;
    color: #5a6a80;
}

.form-agree label {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    cursor: pointer;
    line-height: 1.5;
}

.form-agree input[type="checkbox"] {
    margin-top: 2px;
    accent-color: var(--primary-color);
    flex-shrink: 0;
    cursor: pointer;
}

/* 密码强度 */
.password-strength {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-top: 8px;
}

.strength-bars {
    display: flex;
    gap: 4px;
}

.strength-bars .bar {
    width: 36px;
    height: 4px;
    border-radius: 2px;
    background: #e2e8f0;
    transition: background 0.3s;
}

.strength-bars .bar.active.level-1 {
    background: #e53e3e;
}

.strength-bars .bar.active.level-2 {
    background: #ed8936;
}

.strength-bars .bar.active.level-3 {
    background: #38a169;
}

.strength-label {
    font-size: 12px;
    color: #b0bec5;
}

/* 注册成功 */
.register-success {
    text-align: center;
    padding: 20px 0 10px;
}

.success-icon {
    font-size: 64px;
    color: #38a169;
    margin-bottom: 20px;
    animation: successPop 0.5s cubic-bezier(0.34, 1.56, 0.64, 1);
}

@keyframes successPop {
    from { transform: scale(0); opacity: 0; }
    to   { transform: scale(1); opacity: 1; }
}

.success-title {
    font-size: 24px;
    font-weight: 700;
    color: #1a2332;
    margin: 0 0 12px;
}

.success-desc {
    font-size: 14px;
    color: #8a9ab0;
    line-height: 1.6;
    margin: 0 0 32px;
}

.success-actions {
    display: flex;
    gap: 16px;
    justify-content: center;
}

.success-actions .btn-auth {
    width: auto;
    padding: 0 32px;
    display: inline-block;
}

/* 响应式 */
@media (max-width: 900px) {
    .auth-brand {
        display: none;
    }

    .auth-form-wrap {
        padding: 32px 20px;
    }
}

@media (max-width: 480px) {
    .auth-card {
        padding: 28px 20px 24px;
        border-radius: 12px;
    }

    .auth-title {
        font-size: 22px;
    }

    .form-input-with-btn .form-input {
        padding-right: 110px;
    }

    .btn-send-code {
        padding: 0 10px;
        font-size: 12px;
    }

    .success-actions {
        flex-direction: column;
    }

    .success-actions .btn-auth,
    .success-actions .btn-auth-outline {
        width: 100%;
    }
}

/* ========================================
   预约演示页面
   ======================================== */
.yuyue-section {
    min-height: calc(100vh - 80px);
    padding: 80px 0 100px;
    background: #cde8f8 url('../images/yuyue/bg.png') center/cover no-repeat;
    display: flex;
    align-items: center;
}

.yuyue-wrapper {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 80px;
    max-width: 1100px;
    margin: 0 auto;
}

.yuyue-info {
    flex: 1;
    max-width: 420px;
}

.yuyue-title {
    font-size: 22px;
    font-weight: 700;
    color: #1a2332;
    line-height: 1.45;
    margin-bottom: 28px;
}

.yuyue-benefits {
    list-style: none;
    margin: 0 0 40px;
    padding: 0;
}

.yuyue-benefits li {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 16px;
    font-size: 16px;
    color: #333;
    line-height: 1.5;
}

.yuyue-benefit-icon {
    width: 22px;
    height: 22px;
    object-fit: contain;
    flex-shrink: 0;
}

.yuyue-contact-label {
    font-size: 16px;
    color: #333;
    margin-bottom: 14px;
}

.yuyue-phone {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 24px;
    color: var(--primary-color);
    font-size: 28px;
    font-weight: 600;
    letter-spacing: 0.5px;
}

.yuyue-phone:hover {
    color: var(--primary-dark);
}

.yuyue-phone-icon {
    width: 26px;
    height: 26px;
    object-fit: contain;
}

.yuyue-qrcode {
    margin-top: 8px;
}

.yuyue-qrcode img {
    width: 140px;
    height: 140px;
    display: block;
    background: #fff;
    border-radius: 4px;
}

.yuyue-form-card {
    flex: 0 0 420px;
    width: 420px;
    background: #fff;
    border-radius: 16px;
    padding: 36px 40px 40px;
    box-shadow: 0 12px 40px rgba(80, 140, 200, 0.15);
}

.yuyue-form-title {
    font-size: 24px;
    font-weight: 700;
    color: #1a2332;
    text-align: center;
    margin-bottom: 8px;
}

.yuyue-form-desc {
    font-size: 13px;
    color: #999;
    text-align: center;
    margin-bottom: 28px;
}

.yuyue-field {
    margin-bottom: 16px;
}

.yuyue-field input {
    width: 100%;
    height: 46px;
    padding: 0 16px;
    border: 1px solid #e0e6ed;
    border-radius: 6px;
    font-size: 14px;
    color: #333;
    background: #fff;
    outline: none;
    transition: border-color 0.2s;
    box-sizing: border-box;
}

.yuyue-field input::placeholder {
    color: #b0b8c4;
}

.yuyue-field input:focus {
    border-color: var(--primary-color);
}

.yuyue-captcha-row {
    display: flex;
    align-items: center;
    gap: 12px;
}

.yuyue-captcha-row input {
    flex: 1;
    min-width: 0;
}

.yuyue-captcha-img {
    flex-shrink: 0;
    width: 120px;
    height: 42px;
    border-radius: 4px;
    cursor: pointer;
    object-fit: contain;
    display: block;
}

.yuyue-submit {
    display: block;
    width: 200px;
    height: 46px;
    margin: 28px auto 0;
    background: var(--primary-color);
    color: #fff;
    border: none;
    border-radius: 23px;
    font-size: 16px;
    font-weight: 500;
    cursor: pointer;
    transition: background 0.2s, transform 0.15s;
}

.yuyue-submit:hover {
    background: var(--primary-dark);
}

.yuyue-submit:active {
    transform: scale(0.98);
}

@media (max-width: 992px) {
    .yuyue-section {
        padding: 48px 0 60px;
        min-height: auto;
    }

    .yuyue-wrapper {
        flex-direction: column;
        gap: 40px;
        align-items: stretch;
    }

    .yuyue-info {
        max-width: 100%;
        text-align: center;
    }

    .yuyue-title {
        font-size: 22px;
    }

    .yuyue-benefits {
        display: inline-block;
        text-align: left;
        margin-left: auto;
        margin-right: auto;
    }

    .yuyue-phone {
        justify-content: center;
        font-size: 24px;
    }

    .yuyue-qrcode {
        display: flex;
        justify-content: center;
    }

    .yuyue-form-card {
        flex: none;
        width: 100%;
        max-width: 420px;
        margin: 0 auto;
        padding: 28px 24px 32px;
    }
}

@media (max-width: 480px) {
    .yuyue-title {
        font-size: 20px;
    }

    .yuyue-benefits li {
        font-size: 15px;
    }

    .yuyue-form-title {
        font-size: 20px;
    }

    .yuyue-captcha-row {
        flex-wrap: wrap;
    }

    .yuyue-captcha-img {
        width: 100%;
        height: 44px;
    }

    .yuyue-submit {
        width: 100%;
    }
}