/* Custom Pages Frontend Styles - Luxury Minimal Theme */

/* ========================================
   Font System - 中文字体适配
   思源黑体为主，支持多平台
   ======================================== */
:root {
    /* Font Stacks */
    --font-sans: 'Source Han Sans SC', 'PingFang SC', 'Microsoft YaHei', 'Hiragino Sans GB', 'WenQuanYi Micro Hei', sans-serif;
    --font-serif: 'Source Han Serif SC', 'Noto Serif SC', 'STSong', 'SimSun', Georgia, serif;
    --font-mono: 'JetBrains Mono', 'Source Code Pro', 'Consolas', monospace;
    
    /* Font Weights */
    --font-weight-light: 300;
    --font-weight-regular: 400;
    --font-weight-medium: 500;
    --font-weight-semibold: 600;
    --font-weight-bold: 700;
    
    /* Font Sizes - 中文适配 */
    --text-xs: 0.75rem;      /* 12px - 小字/标签 */
    --text-sm: 0.875rem;     /* 14px - 辅助文字 */
    --text-base: 1rem;        /* 16px - 正文（中文最佳阅读字号） */
    --text-lg: 1.125rem;     /* 18px - 卡片标题 */
    --text-xl: 1.25rem;      /* 20px - 区块标题 */
    --text-2xl: 1.5rem;      /* 24px - 移动端H1 */
    --text-3xl: 1.875rem;    /* 30px - 桌面端H2 */
    --text-4xl: 2.25rem;     /* 36px - 桌面端H1 */
    --text-5xl: 3rem;        /* 48px - Hero标题（谨慎使用） */
    
    /* Letter Spacing - 中文字间距优化 */
    --letter-spacing-tight: -0.02em;   /* 收紧 - 用于大标题 */
    --letter-spacing-normal: 0;         /* 正常 - 正文 */
    --letter-spacing-wide: 0.05em;     /* 加宽 - 按钮/标签 */
    --letter-spacing-widest: 0.1em;    /* 最宽 - 装饰文字 */
    
    /* Line Height - 中文行高 */
    --leading-tight: 1.1;    /* 标题 */
    --leading-normal: 1.6;   /* 正文 */
    --leading-relaxed: 1.8;  /* 长文/说明 */
}

/* ========================================
   Color System - 奢雅极简配色方案
   深海蓝背景 + 奢雅金点缀
   ======================================== */
:root {
    /* Primary Colors - 奢雅金 */
    --cp-gold: #C9A962;
    --cp-gold-light: #E8D5A3;
    --cp-gold-dark: #A68B3D;
    
    /* Background Colors - 深海蓝系列 */
    --cp-navy: #0A1628;
    --cp-navy-light: #152238;
    --cp-navy-lighter: #1E3A5F;
    
    /* Text Colors */
    --cp-ivory: #FAFAF8;
    --cp-stone: #9CA3AF;
    --cp-charcoal: #374151;
    --cp-text-dark: #0A1628;
    
    /* Legacy compatibility */
    --cp-primary: var(--cp-gold);
    --cp-primary-dark: var(--cp-gold-dark);
    --cp-primary-light: var(--cp-gold-light);
    --cp-text-primary: var(--cp-ivory);
    --cp-text-secondary: var(--cp-stone);
    --cp-text-muted: var(--cp-stone);
    --cp-text-light: var(--cp-ivory);
    --cp-bg-light: var(--cp-navy-light);
    --cp-bg-white: var(--cp-navy-light);
    --cp-bg-dark: var(--cp-navy);
    
    /* Shadows - 奢雅风格阴影 */
    --cp-shadow-sm: 0 2px 10px rgba(0, 0, 0, 0.3);
    --cp-shadow-md: 0 4px 20px rgba(0, 0, 0, 0.4);
    --cp-shadow-lg: 0 8px 30px rgba(0, 0, 0, 0.5);
    --cp-shadow-gold: 0 4px 20px rgba(201, 169, 98, 0.3);
    
    /* Transitions */
    --cp-transition: 0.3s ease;
    --cp-transition-slow: 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    
    /* Gradients */
    --cp-gradient-gold: linear-gradient(135deg, #C9A962 0%, #A68B3D 100%);
    --cp-gradient-navy: linear-gradient(180deg, #0A1628 0%, #152238 100%);
    --cp-gradient-glass: linear-gradient(135deg, rgba(255,255,255,0.1) 0%, rgba(255,255,255,0.05) 100%);
}


/* Module Section Title - Override Theme Styles */
.real-content h3,
.module-section h3,
.section-title {
    font-size: 2.4em !important;
}


/* Base Styles */
.custom-pages-container {
    font-family: var(--font-sans);
    font-weight: var(--font-weight-regular);
    line-height: var(--leading-normal);
    color: var(--cp-text-primary);
    background-color: var(--cp-navy);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
}

.custom-pages-geo-summary {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    clip-path: inset(50%) !important;
    white-space: nowrap !important;
    border: 0 !important;
}

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

.btn {
    display: inline-block;
    padding: 12px 24px;
    border-radius: 0;
    text-decoration: none;
    font-weight: var(--font-weight-medium);
    font-size: var(--text-sm);
    transition: all 0.3s ease;
    cursor: pointer;
    border: none;
    outline: none;
    letter-spacing: var(--letter-spacing-wide);
    text-transform: uppercase;
    font-family: var(--font-sans);
}

.btn-primary {
    background: var(--cp-gradient-gold);
    color: var(--cp-navy);
    position: relative;
    overflow: hidden;
}

.btn-primary::before {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,0.3), transparent);
    transition: left 0.5s ease;
}

.btn-primary:hover::before {
    left: 100%;
}

.btn-primary:hover {
    transform: translateY(-2px);
    box-shadow: var(--cp-shadow-gold);
}

.btn-outline {
    background-color: transparent;
    color: var(--cp-gold);
    border: 1px solid var(--cp-gold);
}

.btn-outline:hover {
    background-color: var(--cp-gold);
    color: var(--cp-navy);
}

/* Brand Intro Module - Modern Slider */
.brand-intro-module {
    position: relative;
    min-height: 100vh;
    background: var(--cp-bg-dark);
}

.overview-slides {
    position: relative;
    height: 980px;
    min-height: 600px;
    overflow: hidden;
}

.overview-slides-heading {
    position: relative;
    z-index: 3;
    padding-top: 48px;
    color: var(--cp-text-light);
    text-align: center;
}

.overview-slides-heading h3 {
    margin: 0;
    color: inherit;
}

.slides-container {
    position: relative;
    width: 100%;
    height: 980px;
}

.slide {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 980px;
    opacity: 0;
    visibility: hidden;
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: opacity 1s ease-in-out, visibility 1s ease-in-out;
}

/* 激活的幻灯片显示 */
.slides-container .slide.active {
    opacity: 1;
    visibility: visible;
}

/* 移动端：完整显示图片，不裁剪 */
@media (max-width: 768px) {
    .slide {
        background-size: contain !important;
        background-position: center center !important;
    }
}

/* Slide Image with Ken Burns Effect */
.slide-image {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 980px;
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    transform: scale(1);
    animation: kenBurns 20s ease-in-out infinite alternate;
}

/* 移动端：完整显示图片 */
@media (max-width: 768px) {
    .slide-image {
        background-size: contain !important;
        background-position: center center !important;
        animation: none !important;
    }
}

@keyframes kenBurns {
    0% {
        transform: scale(1) translate(0, 0);
    }
    100% {
        transform: scale(1.1) translate(-2%, -1%);
    }
}

/* Gradient Overlay - elegant dark to transparent */
.slide-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(
        135deg,
        rgba(0, 0, 0, 0.7) 0%,
        rgba(0, 0, 0, 0.4) 30%,
        rgba(0, 0, 0, 0.2) 60%,
        rgba(0, 0, 0, 0.5) 100%
    );
    z-index: 1;
}

/* Slide Content - floating, no box */
.slide.active {
    opacity: 1;
    visibility: visible;
    z-index: 1;
}

.slide-content-wrapper {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 980px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding-top: 0;
    z-index: 2;
    background: rgba(0, 0, 0, 0.3);
}

.slide-content {
    position: relative;
    z-index: 2;
    text-align: center;
    color: var(--cp-text-light);
    max-width: 900px;
    width: 100%;
    padding: 40px clamp(20px, 5vw, 60px);
}

@media (min-width: 769px) {
    .custom-pages-container .slide-content {
        transform: translateY(-80px);
    }
}

/* Animate text elements on slide active */
.slide.active .slide-content h2 {
    animation: slideUp 0.8s ease-out 0.2s both;
}

.slide.active .slide-content .subtitle {
    animation: slideUp 0.8s ease-out 0.4s both;
}

.slide.active .slide-content .description {
    animation: slideUp 0.8s ease-out 0.6s both;
}

.slide.active .slide-content .slide-cta {
    animation: slideUp 0.8s ease-out 0.8s both;
}

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

/* Subtitle - 中文副标题 */
.slide-content .subtitle {
    font-size: clamp(var(--text-sm), 1.5vw, var(--text-xl));
    margin-bottom: clamp(16px, 2.5vw, 28px);
    font-weight: var(--font-weight-semibold);
    letter-spacing: var(--letter-spacing-wide);
    text-transform: uppercase;
    color: var(--cp-gold-light);
    text-shadow: 0 2px 15px rgba(0, 0, 0, 0.6);
    font-family: var(--font-sans);
}

/* Main Title - 中文主标题 */
.slide-content h2 {
    text-align: center;
    font-size: 2.25rem;
    margin-bottom: 48px;
    color: var(--cp-text-primary);
}

/* Desktop slide title - 中文桌面端标题 */
@media (min-width: 992px) {
    .slide-content h2,
    .real-content .slide-content h2 {
        font-size: 2.5rem !important;
        font-weight: normal !important;
    }
}

/* Description - 中文描述文字 */
.slide-content .description {
    font-size: clamp(var(--text-sm), 1.8vw, var(--text-lg));
    margin-bottom: clamp(28px, 5vw, 48px);
    line-height: var(--leading-relaxed);
    max-width: min(700px, 90%);
    margin-left: auto;
    margin-right: auto;
    color: var(--cp-stone);
    text-shadow: 0 3px 20px rgba(0, 0, 0, 0.6);
    font-weight: var(--font-weight-regular);
    font-family: var(--font-sans);
}

/* CTA Button - larger and more prominent */
.slide-cta {
    display: inline-flex;
    gap: clamp(12px, 2vw, 24px);
    flex-wrap: wrap;
    justify-content: center;
}

.slide-cta .btn {
    padding: clamp(10px, 1.4vw, 14px) clamp(20px, 2.8vw, 34px);
    font-size: clamp(0.75rem, 1.25vw, 1rem);
    font-weight: 600;
    letter-spacing: 1px;
    border-radius: 50px;
    text-transform: uppercase;
    transition: all 0.4s cubic-bezier(0.25, 0.8, 0.25, 1);
}

.slide-cta .btn-primary {
    background: #d4af37;
    color: white;
    box-shadow: 0 4px 12px rgba(212, 175, 55, 0.4);
}

.slide-cta .btn-primary:hover {
    transform: translateY(-3px) scale(1.02);
    box-shadow: 0 6px 20px rgba(212, 175, 55, 0.5);
}

.slide-cta .btn-outline {
    background: rgba(0, 0, 0, 0.6);
    border: 2px solid rgba(255, 255, 255, 0.6);
    color: white;
    backdrop-filter: blur(10px);
}

.slide-cta .btn-outline:hover {
    background: rgba(255, 255, 255, 0.15);
    border-color: white;
    transform: translateY(-3px);
}

/* Slide Navigation Dots - 隐藏状态 */
.slide-nav {
    position: absolute;
    bottom: 40px;
    left: 50%;
    transform: translateX(-50%);
    display: none; /* 隐藏小圆点导航 */
    gap: 12px;
    z-index: 10;
}

.slide-dot {
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.4);
    cursor: pointer;
    transition: all 0.3s ease;
    border: 2px solid transparent;
}

.slide-dot:hover {
    background: rgba(255, 255, 255, 0.7);
}

.slide-dot.active {
    background: white;
    transform: scale(1.2);
    border-color: rgba(255, 255, 255, 0.5);
    box-shadow: 0 0 20px rgba(255, 255, 255, 0.5);
}

/* Progress Bar */
.slide-progress {
    display: none;
    position: absolute;
    bottom: 0;
    left: 0;
    height: 4px;
    background: var(--cp-primary);
    z-index: 10;
    animation: progress linear forwards;
}

@keyframes progress {
    from {
        width: 0%;
    }
    to {
        width: 100%;
    }
}

/* No content state */
.no-content {
    padding: 80px 20px;
    text-align: center;
    background: var(--cp-bg-light);
    min-height: 400px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.no-content p {
    font-size: 1.25rem;
    color: var(--cp-text-secondary);
}

.core-competitiveness {
    padding: 80px 0;
    background: var(--cp-navy);
}

.core-competitiveness h3 {
    text-align: center;
    font-size: 2.5rem;
    margin-bottom: 48px;
    color: var(--cp-text-primary);
}

.core-competitiveness h3::after {
    content: '';
    display: block;
    width: 60px;
    height: 2px;
    background: var(--cp-gold);
    margin: 24px auto 0;
}

.competitiveness-grid {
    display: flex;
    gap: 24px;
}

.competitiveness-grid > * {
    flex: 1;
    min-width: 280px;
}

.competitiveness-item {
    background: var(--cp-gradient-glass);
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    padding: 32px;
    border-radius: 0;
    text-align: center;
    transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    border: none;
}

.competitiveness-item:hover {
    transform: translateY(-8px);
    background: linear-gradient(135deg, rgba(201, 169, 98, 0.15) 0%, rgba(201, 169, 98, 0.05) 100%);
}

.competitiveness-item .icon {
    font-size: 2.5rem;
    margin-bottom: 16px;
    color: var(--cp-gold);
}

.competitiveness-item h4 {
    font-size: 1.125rem;
    margin-bottom: 12px;
    color: var(--cp-ivory);
    font-weight: 500;
    letter-spacing: -0.01em;
}

.competitiveness-item p {
    color: var(--cp-stone);
    margin-bottom: 16px;
    line-height: 1.7;
    font-size: 0.875rem;  /* 14px */
}

.competitiveness-item .learn-more {
    color: var(--cp-gold);
    text-decoration: none;
    font-weight: 500;
    font-size: 0.875rem;
    transition: all 0.3s ease;
    letter-spacing: 0.05em;
    text-transform: uppercase;
}

.competitiveness-item .learn-more:hover {
    color: var(--cp-gold-light);
    text-decoration: none;
}

/* Core Advantages Module - 奢雅深色背景 */
.core-advantages-module {
    padding: 80px 0;
    background: var(--cp-navy-light);
}

.competitor-comparison {
    margin-bottom: 60px;
}

/* 竞品对比优势区块 */
.core-advantages-module .competitor-comparison h3 {
    text-align: center;
    font-size: 2.25rem;
    margin-bottom: 48px;
    color: var(--cp-text-primary);
}

.core-advantages-module .competitor-comparison h3::after {
    content: '';
    display: block;
    width: 60px;
    height: 2px;
    background: var(--cp-gold);
    margin: 24px auto 0;
}

/* Comparison Table - New Layout */
.comparison-table-wrapper {
    background: var(--cp-gradient-glass);
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    border-radius: 0;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, 0.1);
}

.comparison-table-new {
    width: 100%;
    border-collapse: collapse;
}

.comparison-table-new thead {
    background: rgba(201, 169, 98, 0.15);
}

.comparison-table-new th {
    padding: 18px 20px;
    color: var(--cp-ivory);
    font-weight: 500;
    font-size: 0.9375rem;
    text-align: center;
    border: none;
    letter-spacing: 0.05em;
    text-transform: uppercase;
}

.comparison-table-new th.dimension-header {
    text-align: center;
    min-width: 140px;
    background: rgba(0, 0, 0, 0.3);
}

.comparison-table-new th.our-brand-header {
    background: rgba(201, 169, 98, 0.2);
    min-width: 180px;
}

.comparison-table-new th.competitor-header {
    background: rgba(0, 0, 0, 0.15);
    min-width: 150px;
}

.comparison-table-new tbody tr {
    transition: background 0.3s ease;
}

.comparison-table-new tbody tr:hover {
    background: rgba(201, 169, 98, 0.08);
}

.comparison-table-new tbody tr:not(:last-child) {
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

.comparison-table-new td {
    padding: 20px;
    vertical-align: middle;
    border: none;
}

.comparison-table-new td.dimension-cell {
    background: rgba(0, 0, 0, 0.1);
    font-weight: 500;
    color: var(--cp-ivory);
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    min-height: 80px;
}

.dimension-cell .dimension-icon {
    font-size: 1.25rem;
    color: var(--cp-gold);
}

.dimension-cell .dimension-text {
    font-size: 0.9375rem;
}

.comparison-table-new td.our-advantage-cell {
    text-align: center;
    background: rgba(201, 169, 98, 0.05);
}

.our-advantage-cell .advantage-text {
    color: var(--cp-gold);
    font-weight: 600;
    font-size: 0.875rem;  /* 14px */
}

.comparison-table-new td.competitor-weakness-cell {
    text-align: center;
    background: rgba(0, 0, 0, 0.05);
}

.competitor-weakness-cell .weakness-text {
    color: var(--cp-stone);
    font-size: 0.875rem;  /* 14px */
}

.competitor-weakness-cell .no-data {
    color: var(--cp-charcoal);
    font-size: 1.25rem;
}

/* Old Table Styles - Keep for backwards compatibility */
.comparison-table {
    background: var(--cp-bg-white);
    border-radius: 12px;
    overflow: hidden;
    box-shadow: var(--cp-shadow-md);
}

.comparison-table table {
    width: 100%;
    border-collapse: collapse;
}

.comparison-table th,
.comparison-table td {
    padding: 16px;
    text-align: center;
    border-bottom: 1px solid rgba(0, 0, 0, 0.08);
}

.comparison-table th {
    background: var(--cp-bg-light);
    font-weight: 600;
    color: var(--cp-text-primary);
}

.comparison-table tr:last-child td {
    border-bottom: none;
}

.comparison-table .our-company {
    color: var(--cp-primary);
    font-weight: bold;
}

.advantage-highlights {
    padding: 32px;
    background: var(--cp-gradient-glass);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    border-radius: 0;
    margin-top: 24px;
    border: 1px solid rgba(255, 255, 255, 0.1);
}

.advantage-highlights h4 {
    color: var(--cp-gold);
    margin-bottom: 16px;
    font-weight: 500;
    letter-spacing: -0.01em;
}

.advantage-highlights ul {
    list-style: none;
    padding: 0;
}

.advantage-highlights li {
    padding: 10px 0;
    position: relative;
    padding-left: 24px;
    color: var(--cp-stone);
    font-size: 0.9375rem;
}

.advantage-highlights li:before {
    content: "✓";
    position: absolute;
    left: 0;
    color: var(--cp-gold);
    font-weight: 500;
}

.expert-team {
    margin-top: 150px;
}

/* 专家团队 */
.core-advantages-module .expert-team h3 {
    text-align: center;
    font-size: 2.25rem;
    margin-bottom: 48px;
    color: var(--cp-text-primary);
}

.team-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 32px;
}

.team-member {
    background: #ffffff;
    border-radius: 12px;
    padding: 24px;
    text-align: center;
    border: none;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
    transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    cursor: pointer;
}

.team-member:hover {
    transform: translateY(-8px);
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
}

.member-avatar {
    margin-bottom: 16px;
    width: 100px;
    height: 100px;
    margin-left: auto;
    margin-right: auto;
    position: relative;
    border-radius: 50%;
    overflow: hidden;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex-shrink: 0 !important;
}

.avatar-placeholder {
    width: 100px;
    height: 100px;
    border-radius: 50%;
    background: var(--cp-gradient-gold);
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto;
    overflow: hidden;
}

.avatar-placeholder span {
    color: var(--cp-navy);
    font-size: 2.5rem;
    font-weight: 500;
}

.team-member img,
.custom-pages-container .team-member img,
.core-advantages-module .expert-team .team-member img,
.team-member .member-avatar img,
.custom-pages-container .team-member .member-avatar img {
    width: 100% !important;
    height: 100% !important;
    max-width: 100% !important;
    max-height: 100% !important;
    min-width: 100% !important;
    min-height: 100% !important;
    border-radius: 50% !important;
    object-fit: cover !important;
    object-position: center center !important;
    margin: 0 !important;
    padding: 0 !important;
    display: block !important;
    box-sizing: border-box !important;
    flex-shrink: 0 !important;
    aspect-ratio: 1 !important;
}

.member-info h4 {
    font-size: 1.125rem;
    margin-bottom: 8px;
    color: #1a1a2e;
    font-weight: 600;
}

.member-info .position {
    color: #4a5568;
    font-weight: 500;
    margin-bottom: 4px;
}

.member-info .experience {
    color: var(--cp-text-secondary);
    font-size: 0.875rem;
    margin-bottom: 12px;
}

.member-info .description {
    color: var(--cp-text-secondary);
    font-size: 0.875rem;
}

/* Products Module */
.products-module {
    padding: 80px 0;
    background: var(--cp-navy);
}

.pricing-plans {
    margin-bottom: 150px;
    padding: 80px 0;
    background: linear-gradient(135deg, #1a1a2e 0%, #16213e 50%, #1a1a2e 100%);
    position: relative;
    overflow: hidden;
}

.pricing-plans::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: radial-gradient(circle at 20% 50%, rgba(255, 215, 0, 0.08) 0%, transparent 50%),
                radial-gradient(circle at 80% 50%, rgba(255, 215, 0, 0.05) 0%, transparent 40%);
    pointer-events: none;
}

.pricing-plans h3 {
    text-align: center;
    font-size: 2.75rem;
    margin-bottom: 60px;
    color: #fff;
    font-weight: 700;
    position: relative;
    z-index: 1;
    text-shadow: 0 2px 10px rgba(0, 0, 0, 0.3);
}

.pricing-plans h3::after {
    content: '';
    position: absolute;
    bottom: -20px;
    left: 50%;
    transform: translateX(-50%);
    width: 100px;
    height: 4px;
    background: linear-gradient(90deg, transparent, var(--cp-gold), transparent);
    border-radius: 2px;
}

.plans-container {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(340px, 1fr));
    gap: 40px;
    margin-bottom: 32px;
    max-width: 1300px;
    margin-left: auto;
    margin-right: auto;
    padding: 0 30px;
    position: relative;
    z-index: 1;
}

.plans-container.columns-2 {
    grid-template-columns: repeat(auto-fit, minmax(400px, 1fr));
    max-width: 1000px;
}

.plans-container.columns-3 {
    grid-template-columns: repeat(auto-fit, minmax(340px, 1fr));
    max-width: 1300px;
}

.plans-container.columns-4 {
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    max-width: 1500px;
}

.plan {
    background: rgba(255, 255, 255, 0.06);
    backdrop-filter: blur(30px);
    -webkit-backdrop-filter: blur(30px);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 24px;
    padding: 45px 35px;
    text-align: center;
    transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    position: relative;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.2);
    overflow: visible;
}

.plan::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 2px;
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.3), transparent);
    border-radius: 24px 24px 0 0;
}

.plan:hover {
    transform: translateY(-12px);
    border-color: rgba(255, 215, 0, 0.4);
    box-shadow: 0 25px 50px rgba(0, 0, 0, 0.35);
}

.plan.recommended {
    border-color: var(--cp-gold);
    border-width: 3px;
    position: relative;
    transform: scale(1.03);
    background: linear-gradient(135deg, rgba(255, 215, 0, 0.15) 0%, rgba(255, 215, 0, 0.08) 50%, rgba(255, 215, 0, 0.15) 100%);
    box-shadow: 0 0 40px rgba(255, 215, 0, 0.25), 0 15px 40px rgba(0, 0, 0, 0.3);
}

.plan.recommended::before {
    content: '推荐';
    position: absolute;
    top: -20px;
    left: 50%;
    transform: translateX(-50%);
    background: linear-gradient(135deg, #1e88e5 0%, #1565c0 100%);
    color: #fff;
    padding: 10px 30px;
    border-radius: 20px;
    font-size: 0.9rem;
    font-weight: 600;
    letter-spacing: 1px;
    text-transform: uppercase;
    box-shadow: 0 4px 15px rgba(30, 136, 229, 0.4);
    border: 1px solid rgba(255, 255, 255, 0.3);
    display: flex;
    align-items: center;
    justify-content: center;
    height: auto;
    line-height: 1;
    z-index: 1000;
}

.plan.recommended::after {
    content: '';
    position: absolute;
    top: -1px;
    left: -1px;
    right: -1px;
    bottom: -1px;
    border-radius: 24px;
    background: linear-gradient(45deg, transparent 30%, rgba(255, 215, 0, 0.3), transparent 70%);
    background-size: 200% 200%;
    animation: shimmer 3s ease-in-out infinite;
    pointer-events: none;
}

@keyframes pulse-glow {
    0%, 100% {
        box-shadow: 0 4px 15px rgba(30, 136, 229, 0.3);
        transform: translateX(-50%) translateY(-50%) scale(1);
    }
    50% {
        box-shadow: 0 8px 25px rgba(30, 136, 229, 0.5);
        transform: translateX(-50%) translateY(-50%) scale(1.02);
    }
}

@keyframes shimmer {
    0% {
        background-position: 200% 0;
    }
    100% {
        background-position: -200% 0;
    }
}

.plan.recommended:hover {
    transform: scale(1.03) translateY(-12px);
    box-shadow: 0 0 60px rgba(255, 215, 0, 0.35), 0 30px 60px rgba(0, 0, 0, 0.4);
}

.plan-header {
    margin-bottom: 15px;
    padding-bottom: 12px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

.plan-header h4 {
    font-size: 1.5rem;
    margin-bottom: 10px;
    color: #fff;
    font-weight: 600;
    letter-spacing: 0.5px;
}

.plan-description {
    font-size: 0.9rem;
    color: rgba(255, 255, 255, 0.7);
    margin-bottom: 8px;
    line-height: 1.4;
}

.price {
    font-size: 3rem;
    font-weight: 700;
    color: var(--cp-gold);
    position: relative;
}

.price .amount {
    font-size: 3.5rem;
    font-weight: 800;
    background: linear-gradient(135deg, var(--cp-gold), #ffd700);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

.price .period {
    font-size: 1rem;
    color: rgba(255, 255, 255, 0.6);
    margin-left: 6px;
    font-weight: 400;
}

.features {
    list-style: none;
    padding: 0;
    margin-bottom: 15px;
}

.features li {
    padding: 6px 0;
    color: rgba(255, 255, 255, 0.8);
    font-size: 0.9rem;
    transition: all 0.3s ease;
    display: flex;
    align-items: center;
}

.features li:hover {
    color: var(--cp-gold);
    padding-left: 8px;
}

.features li:before {
    content: "✓";
    color: var(--cp-gold);
    margin-right: 12px;
    font-size: 1.1rem;
    font-weight: 600;
    width: 20px;
    height: 20px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: rgba(255, 215, 0, 0.1);
    border-radius: 50%;
}

.plan-actions {
    display: flex;
    flex-direction: column;
    gap: 15px;
    align-items: center;
    margin-top: 15%;
    padding: 0;
}

.plan-actions .btn {
    width: 100%;
    max-width: 100%;
    padding: 11.2px 30px;
    font-size: 1rem;
    font-weight: 600;
    border-radius: 0;
    transition: all 0.3s ease;
    text-transform: uppercase;
    letter-spacing: 1px;
}

.plan-actions .btn-primary {
    background: linear-gradient(135deg, var(--cp-gold), #d4a574);
    border: none;
    color: #1a1a2e;
    box-shadow: 0 4px 15px rgba(255, 215, 0, 0.3);
}

.plan-actions .btn-primary:hover {
    background: linear-gradient(135deg, #ffd700, var(--cp-gold));
    transform: translateY(-2px);
    box-shadow: 0 8px 25px rgba(255, 215, 0, 0.4);
}

.refund-policy {
    text-align: center;
    color: inherit;
    font-size: 0.875rem;
}

.scenarios {
    margin-top: 150px;
}

.scenarios h3 {
    text-align: center;
    font-size: 2.25rem;
    margin-bottom: 48px;
    color: var(--cp-text-primary);
}

.scenario-tabs {
    display: flex;
    justify-content: center;
    margin-bottom: 32px;
    flex-wrap: wrap;
}

.tab-btn {
    padding: 12px 24px;
    margin: 0 8px 16px 0;
    border: none;
    background: var(--cp-bg-light);
    border-radius: 8px;
    cursor: pointer;
    transition: all 0.3s ease;
    font-weight: 500;
    color: var(--cp-ivory);
}

.tab-btn.active {
    background: #ffffff;
    color: var(--cp-text-dark);
}

.scenario-panel {
    display: none;
    background: var(--cp-bg-white);
    padding: 32px;
    border-radius: 12px;
    box-shadow: 0 4px 20px rgba(201, 169, 98, 0.1);
    display: none;
    grid-template-columns: 1fr 2fr;
    gap: 32px;
}

.scenario-panel.active {
    display: grid;
}

.scenario-left {
    padding-right: 16px;
    border-right: 1px solid rgba(255, 255, 255, 0.1);
}

.scenario-right {
    padding-left: 16px;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
}

.scenario-header {
    margin-bottom: 24px;
}

.scenario-header h5 {
    font-size: 1.25rem;
    margin-bottom: 8px;
    color: inherit;
}

.pain-point {
    color: inherit;
    font-style: italic;
}

.solution-steps {
    margin-bottom: 24px;
}

.step {
    display: flex;
    align-items: center;
    margin-bottom: 4px;
    padding: 6px 8px;
    background: transparent;
    border-radius: 4px;
}

.step-text {
    font-size: 0.875rem;
    line-height: 1.4;
}

.step-number {
    width: 16.8px;
    height: 16.8px;
    background: var(--cp-primary);
    color: var(--cp-text-light);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.7rem;
    font-weight: bold;
    margin-right: 12px;
}

.scenario-right .result {
    background: rgba(201, 169, 98, 0.08);
    padding: 24px;
    border-radius: 12px;
    height: fit-content;
}

.scenario-right .result h5 {
    color: var(--cp-primary);
    font-size: 1.125rem;
    margin-bottom: 16px;
    font-weight: 600;
}

.scenario-right .result p {
    color: inherit;
    line-height: 1.8;
}

/* Testimonials Module */
.testimonials-module {
    padding: 80px 0;
    background: var(--cp-bg-light);
}

.case-studies h3,
.faq-section h3 {
    text-align: center;
    font-size: 2.25rem;
    margin-bottom: 48px;
    color: var(--cp-text-primary);
}

/* 成功案例与FAQ之间的间距 */
.case-studies {
    margin-bottom: 150px;
}

.studies-filter {
    display: flex;
    gap: 16px;
    margin-bottom: 32px;
    justify-content: center;
    flex-wrap: wrap;
}

.studies-filter select,
.studies-filter input {
    padding: 12px 16px;
    border: 1px solid rgba(0, 0, 0, 0.15);
    border-radius: 8px;
    font-size: 1rem;
}

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

.study-card {
    background: var(--cp-bg-white);
    border-radius: 12px;
    overflow: hidden;
    box-shadow: var(--cp-shadow-md);
    transition: transform 0.3s ease;
    position: relative;
    height: 380px;
    min-height: 380px;
}

.study-card:hover {
    transform: translateY(-8px);
}

.study-image {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
}

.study-image img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    object-position: center center !important;
    display: block !important;
}

.study-content {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 1;
    padding: 20px 16px 16px;
    display: flex;
    flex-direction: column;
    background: linear-gradient(to top, rgba(0, 0, 0, 0.75) 0%, rgba(0, 0, 0, 0.3) 60%, transparent 100%);
    color: #ffffff;
}

.study-content h4 {
    font-size: 1.1rem;
    margin-bottom: 4px;
    color: #ffffff;
    line-height: 1.3;
}

.study-content h4 a,
.study-content h4 a:visited,
.study-content h4 a:hover,
.study-content h4 a:focus {
    color: #ffffff !important;
    text-decoration: none;
}

.study-content .industry {
    color: rgba(255, 255, 255, 0.85);
    font-size: 0.85rem;
    margin-bottom: 0;
    line-height: 1.3;
}

/* 案例描述 - 前端隐藏，仅提供给搜索引擎索引 */
.study-content .problem {
    display: none;
}

.study-content .result {
    color: #ffffff;
    font-weight: 500;
    margin-bottom: 16px;
}

.study-content .view-details {
    color: #ffffff;
    text-decoration: none;
    font-weight: 500;
    display: inline-block;
    padding: 8px 16px;
    background: rgba(255, 255, 255, 0.2);
    border-radius: 6px;
    border: 1px solid rgba(255, 255, 255, 0.3);
    margin-top: 8px;
}

.view-details:hover {
    text-decoration: underline;
}

.faq-container {
    width: 100%;
    max-width: none;
    margin: 0;
    padding: 0;
}

.faq-two-columns {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(400px, 1fr));
    gap: 20px;
    width: 100%;
}

.faq-two-columns .faq-column {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.faq-item {
    background: rgba(255, 255, 255, 0.04);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    border-radius: 12px;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, 0.06);
    transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

.faq-item:hover {
    background: rgba(255, 255, 255, 0.08);
    border-color: rgba(201, 169, 98, 0.2);
    transform: translateY(-2px);
}

.faq-item.expanded {
    background: rgba(255, 255, 255, 0.06);
    border-color: rgba(201, 169, 98, 0.3);
}

.faq-item.expanded .faq-answer {
    display: block;
}

.faq-question {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 20px 24px;
    cursor: pointer;
    background: linear-gradient(135deg, rgba(201, 169, 98, 0.1) 0%, rgba(201, 169, 98, 0.02) 100%);
    border-bottom: 1px solid rgba(255, 255, 255, 0.04);
}

.faq-question h4 {
    margin: 0;
    font-size: 1rem;
    color: var(--cp-ivory);
    font-weight: 500;
    letter-spacing: -0.01em;
    flex: 1;
    line-height: 1.5;
}

.toggle-icon {
    font-size: 1rem;
    color: var(--cp-gold);
    transition: all 0.3s ease;
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: rgba(201, 169, 98, 0.15);
    margin-left: 16px;
    flex-shrink: 0;
}

.faq-item:hover .toggle-icon {
    background: rgba(201, 169, 98, 0.25);
}

.faq-item.expanded .toggle-icon {
    transform: rotate(45deg);
    background: var(--cp-gold);
    color: var(--cp-navy);
}

.faq-answer {
    padding: 0 24px;
    overflow: hidden;
    display: none;
}

.faq-item.expanded .faq-answer {
    padding: 20px 24px 24px;
    display: block;
}

.faq-answer p {
    margin: 0;
    color: var(--cp-stone);
    line-height: 1.7;
    font-size: 0.875rem;  /* 14px */
}

.custom-pages-content-faq {
    margin: 48px auto 0;
    max-width: 860px;
    color: inherit;
}

.custom-pages-content-faq__title {
    margin: 0 0 22px;
    color: inherit;
    font-size: 1.25rem !important;
    line-height: 1.3;
    letter-spacing: 0;
}

.custom-pages-content-faq__list {
    display: grid;
    gap: 8px;
}

.custom-pages-content-faq__item {
    border: 0;
    border-radius: 8px;
    background: rgba(255, 255, 255, 0.04);
    overflow: hidden;
}

.custom-pages-content-faq__question {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    width: 100%;
    min-height: 36px;
    padding: 9px 18px;
    border: 0;
    background: rgba(15, 23, 42, 0.04);
    color: inherit;
    cursor: pointer;
    font: inherit;
    font-weight: 600;
    line-height: 1.5;
    text-align: left;
}

.custom-pages-content-faq__question:hover,
.custom-pages-content-faq__question:focus {
    background: rgba(15, 23, 42, 0.07);
}

.custom-pages-content-faq__question:focus-visible {
    outline: 2px solid currentColor;
    outline-offset: -2px;
}

.custom-pages-content-faq__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    border: 1px solid rgba(128, 128, 128, 0.3);
    flex: 0 0 auto;
    font-weight: 700;
    line-height: 1;
}

.custom-pages-content-faq__answer {
    padding: 0 18px 12px;
    color: inherit;
    line-height: 1.75;
}

.custom-pages-content-faq__answer p {
    margin: 0 0 0.8em;
}

.custom-pages-content-faq__answer p:last-child {
    margin-bottom: 0;
}

.custom-pages-content-faq--boxed .custom-pages-content-faq__item {
    background: #fff;
    border: 0;
    box-shadow: none;
    color: #1f2937;
}

.custom-pages-content-faq--boxed .custom-pages-content-faq__item.is-expanded {
    border: 0;
}

.custom-pages-content-faq--minimal .custom-pages-content-faq__item {
    border: 0;
    border-radius: 0;
    background: transparent;
}

.custom-pages-content-faq--minimal .custom-pages-content-faq__question {
    padding-left: 18px;
    padding-right: 18px;
}

.custom-pages-content-faq--minimal .custom-pages-content-faq__answer {
    padding-left: 0;
    padding-right: 0;
}

.custom-pages-style-theme-adaptive .custom-pages-content-faq,
.custom-pages-content-faq--theme-adaptive {
    color: inherit;
}

/* About Module */
.about-module {
    padding: 80px 0;
    background: var(--cp-bg-white);
}

.resource-center {
    margin-bottom: 150px;
}

.latest-news {
    margin-top: 150px;
    margin-bottom: 150px;
}

.resource-center h3,
.latest-news h3,
.contact-section h3 {
    text-align: center;
    font-size: 2.25rem;
    margin-bottom: 48px;
    color: inherit;
}

.resources-list {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
    margin: 0;
    padding: 0;
}

.resource-item {
    padding: 0;
    text-align: left;
}

.resource-title {
    font-size: 1rem;
    line-height: 1.6;
    color: var(--cp-text-primary);
    text-decoration: none;
    transition: color 0.3s ease;
    font-weight: 400;
    padding-left: 28px;
    position: relative;
}

.resource-title::before {
    content: '📄';
    font-size: 1rem;
    position: absolute;
    left: 0;
    top: 0;
    line-height: 1.6;
    vertical-align: middle;
}

.resource-title:hover {
    color: var(--cp-gold);
}

.resource-title:hover::before {
    transform: scale(1.1);
}

.date {
    color: inherit;
    font-size: 0.75rem;
}

.download-btn {
    display: inline-flex;
    align-items: center;
    padding: 8px 16px;
    background: var(--cp-primary);
    color: var(--cp-text-light);
    text-decoration: none;
    border-radius: 6px;
    font-size: 0.875rem;
    transition: background 0.3s ease;
}

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

.news-list {
    display: grid;
    gap: 24px;
}

.news-item {
    display: flex;
    background: var(--cp-bg-light);
    border-radius: 8px;
    overflow: hidden;
}

.news-date {
    background: var(--cp-primary);
    color: var(--cp-text-light);
    padding: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 80px;
    font-weight: bold;
}

.news-content {
    padding: 24px;
    flex-grow: 1;
}

.news-content h4 {
    font-size: 1.125rem;
    margin-bottom: 8px;
    color: inherit;
}

.news-summary {
    color: inherit;
    font-size: 0.875rem;
}

/* Latest News Grid - similar to case studies */
.news-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 32px;
}

.news-card {
    background: var(--cp-bg-white);
    border-radius: 12px;
    overflow: hidden;
    box-shadow: var(--cp-shadow-md);
    transition: transform 0.3s ease;
    position: relative;
}

.news-card:hover {
    transform: translateY(-8px);
}

.news-image {
    width: 100%;
    height: 380px;
    overflow: hidden;
}

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

.news-placeholder {
    width: 100%;
    height: 100%;
    background: var(--cp-bg-light);
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--cp-text-secondary);
}

.news-card .news-content {
    padding: 20px;
}

.news-card .news-content h4 {
    margin: 0;
    font-size: 1rem;
    font-weight: 500;
}

.news-card .news-content h4 a {
    color: var(--cp-text-primary);
    text-decoration: none;
    transition: color 0.3s ease;
}

.news-card .news-content h4 a:hover {
    color: var(--cp-primary);
}

.contact-info {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 48px;
}

.contact-left {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.contact-left h3 {
    text-align: left;
    margin-bottom: 0;
}

.contact-image {
    border-radius: 8px;
    overflow: hidden;
}

.contact-image img {
    width: 100%;
    height: 380px;
    display: block;
    object-fit: cover;
}

.contact-details {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 4px;
}

.contact-row {
    display: flex;
    gap: 24px;
    align-items: center;
}

.contact-item {
    display: flex;
    align-items: center;
    padding: 4px 0;
    background: transparent;
    border-radius: 0;
    line-height: 1.2;
}

.contact-item.company-name {
    font-size: 1.25rem;
    font-weight: 600;
    color: var(--cp-primary);
    background: transparent;
    padding-left: 0;
    line-height: 1.4;
}

.label {
    font-weight: 500;
    color: var(--cp-text-primary);
    margin-right: 8px;
}

.value {
    color: var(--cp-text-secondary);
}

.contact-form {
    /* 无底色 - 简约风格 */
    background: transparent;
    padding: 8px 0;
    padding-left: 40px;
    border-radius: 0;
}

.contact-form h4 {
    margin-bottom: 32px;
    color: var(--cp-text-primary);
    font-size: 1.35rem;
}

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

.form-group input,
.form-group textarea {
    width: 100%;
    padding: 16px 20px;
    border: 1px solid rgba(0, 0, 0, 0.12);
    border-radius: 10px;
    font-size: 1.05rem;
    background: #ffffff;
    transition: border-color 0.3s ease, box-shadow 0.3s ease;
}

.form-group input:focus,
.form-group textarea:focus {
    outline: none;
    border-color: var(--cp-primary);
    box-shadow: 0 0 0 3px rgba(0, 115, 170, 0.08);
}

.form-group textarea {
    min-height: 310px;
    resize: vertical;
    width: 100% !important;
    max-width: 100%;
    box-sizing: border-box;
}

.contact-form .btn-primary {
    background: linear-gradient(135deg, #C9A962 0%, #A68B3D 100%) !important;
    color: #1a1a2e !important;
    border: none !important;
    padding: 14px 48px !important;
    font-weight: 600 !important;
    text-align: center !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    position: relative !important;
    overflow: hidden !important;
}

.contact-form .btn-primary::before {
    content: '' !important;
    position: absolute !important;
    top: 0 !important;
    left: -100% !important;
    width: 100% !important;
    height: 100% !important;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,0.3), transparent) !important;
    transition: left 0.5s ease !important;
}

.contact-form .btn-primary:hover {
    background: linear-gradient(135deg, #D4B56A 0%, #B89A47 100%) !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 4px 12px rgba(201, 169, 98, 0.3) !important;
}

.contact-form .btn-primary:hover::before {
    left: 100% !important;
}

/* Mobile "Read More" functionality */
.custom-pages-container .more-content {
    display: block;
}

.custom-pages-container .read-more-btn {
    display: none;
    text-align: center;
    padding: 30px 0;
    background: var(--cp-navy);
}

.custom-pages-container .read-more-btn button {
    background: linear-gradient(135deg, #C9A962 0%, #A68B3D 100%);
    color: #1a1a2e;
    border: none;
    padding: 14px 48px;
    font-weight: 600;
    border-radius: 4px;
    cursor: pointer;
    transition: all 0.3s ease;
}

.custom-pages-container .read-more-btn button:hover {
    background: linear-gradient(135deg, #D4B56A 0%, #B89A47 100%);
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(201, 169, 98, 0.3);
}

/* Responsive Design */
@media (max-width: 1024px) {
    .brand-intro-module {
        min-height: 70vh;
    }
    
    .overview-slides {
        height: 70vh;
        min-height: 500px;
    }
}

@media (max-width: 768px) {
    /* 基础容器重置 */
    * {
        box-sizing: border-box !important;
    }
    
    html, body {
        overflow-x: hidden !important;
        width: 100% !important;
        max-width: 100% !important;
    }
    
    .custom-pages-container,
    .custom-pages-container * {
        box-sizing: border-box !important;
        max-width: 100% !important;
        overflow-x: hidden !important;
    }
    
    .container {
        padding: 0 16px !important;
        margin: 0 auto !important;
        max-width: 100% !important;
        width: 100% !important;
        position: relative !important;
        left: auto !important;
        right: auto !important;
    }

    .brand-intro-module {
        min-height: auto;
        background: var(--cp-bg-dark);
        width: 100% !important;
        max-width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
        position: relative !important;
        left: 0 !important;
        right: 0 !important;
    }
    
    .overview-slides {
        height: 220px !important;
        min-height: 220px;
        max-height: 220px !important;
        overflow: hidden;
        width: 100% !important;
        max-width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
    }
    
    .slides-container {
        height: 220px !important;
        min-height: 220px;
        max-height: 220px !important;
        width: 100% !important;
        max-width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
    }
    
    .slide {
        height: 220px !important;
        min-height: 220px;
        max-height: 220px !important;
        padding: 0;
        position: absolute;
    }
    
    .slide-image {
        height: 100% !important;
        min-height: 100%;
        max-height: 100% !important;
        position: absolute;
        top: 0;
        left: 0;
        background-size: cover !important;
        background-position: center center !important;
    }
    
    .slide-overlay {
        height: 100% !important;
        min-height: 100%;
        max-height: 100% !important;
    }

    /* 移动端激活的幻灯片 */
    .slide.active {
        opacity: 1 !important;
        visibility: visible !important;
        z-index: 1 !important;
    }
    
    /* 移动端激活的幻灯片内容显示 */
    @media (max-width: 768px) {
        .overview-slides .slides-container .slide.active .slide-content-wrapper {
            display: flex !important;
            opacity: 1 !important;
            visibility: visible !important;
            transform: translateY(0) !important;
            z-index: 9999 !important;
        }
        
        .overview-slides .slides-container .slide.active .slide-content,
        .overview-slides .slides-container .slide.active .slide-content h2,
        .overview-slides .slides-container .slide.active .slide-content .subtitle,
        .overview-slides .slides-container .slide.active .slide-content .description {
            display: block !important;
            opacity: 1 !important;
            visibility: visible !important;
            transform: translateY(0) !important;
            z-index: 9999 !important;
        }
        
        .overview-slides .slides-container .slide.active .slide-cta {
            display: flex !important;
            opacity: 1 !important;
            visibility: visible !important;
            transform: translateY(0) !important;
            z-index: 9999 !important;
        }
        
        .overview-slides .slides-container .slide.active .slide-cta .btn {
            display: inline-flex !important;
            opacity: 1 !important;
            visibility: visible !important;
            transform: translateY(0) !important;
            z-index: 9999 !important;
        }
    }

    /* 幻灯片内容 - 移动端覆盖在图片上 */
    .slide-content-wrapper {
        position: absolute !important;
        top: 0 !important;
        left: 0 !important;
        right: 0 !important;
        bottom: 0 !important;
        width: 100% !important;
        height: 100% !important;
        max-width: 100% !important;
        padding: 10px 15px !important;
        margin: 0 !important;
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        justify-content: center !important;
        z-index: 9999 !important;
        background: rgba(0, 0, 0, 0.5) !important;
        opacity: 1 !important;
        visibility: visible !important;
        pointer-events: auto !important;
        transform: none !important;
        box-sizing: border-box !important;
    }
    
    /* 减少幻灯片内容区域的内边距 */
    .slide-content {
        padding: 0 !important;
        margin: 0 auto !important;
        max-width: 100% !important;
        width: auto !important;
        min-width: auto !important;
        text-align: center !important;
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        justify-content: center !important;
        opacity: 1 !important;
        visibility: visible !important;
        transform: none !important;
        left: auto !important;
        right: auto !important;
    }

    /* 幻灯片标题 - 移动端缩小 */
    .slide-content h2 {
        font-size: 1.4rem !important;
        margin-bottom: 2px;
        line-height: 1.2;
        color: white !important;
        text-shadow: 0 2px 10px rgba(0, 0, 0, 0.8);
        opacity: 1 !important;
        visibility: visible !important;
        transform: translateY(0) !important;
        text-align: center !important;
        margin-left: auto !important;
        margin-right: auto !important;
    }

    .slide-content .subtitle {
        font-size: 0.8rem !important;
        margin-bottom: 2px;
        letter-spacing: 1px;
        color: #E8D5A3 !important;
        text-shadow: 0 2px 10px rgba(0, 0, 0, 0.8);
        opacity: 1 !important;
        visibility: visible !important;
        transform: translateY(0) !important;
        text-align: center !important;
        margin-left: auto !important;
        margin-right: auto !important;
    }

    .slide-content .description {
        font-size: 0.7rem !important;
        margin-bottom: 6px;
        line-height: 1.3;
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        overflow: hidden;
        color: rgba(255, 255, 255, 0.9) !important;
        text-shadow: 0 2px 10px rgba(0, 0, 0, 0.8);
        opacity: 1 !important;
        visibility: visible !important;
        transform: translateY(0) !important;
    }
    
    /* 按钮区域 - 修复溢出问题 */
    .slide-cta {
        width: 100% !important;
        max-width: 100% !important;
        flex-direction: row !important;
        flex-wrap: wrap !important;
        gap: 8px !important;
        justify-content: center !important;
        align-items: center !important;
        opacity: 1 !important;
        visibility: visible !important;
        transform: translateY(0) !important;
        margin-top: 8px !important;
        padding: 0 5px !important;
        box-sizing: border-box !important;
        animation: none !important;
        position: relative !important;
        overflow: visible !important;
        background: transparent !important;
    }
    
    .slide-cta .btn {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        padding: 6px 10px !important;
        font-size: 0.65rem !important;
        font-weight: 600 !important;
        opacity: 1 !important;
        visibility: visible !important;
        white-space: nowrap !important;
        max-width: calc(50% - 4px) !important;
        min-width: auto !important;
        animation: none !important;
        border-radius: 4px !important;
        box-sizing: border-box !important;
        transform: none !important;
        position: relative !important;
        z-index: 10000 !important;
    }
    
    /* 禁用移动端幻灯片内容动画，防止视觉上的"两层"效果 */
    .slide.active .slide-content h2,
    .slide.active .slide-content .subtitle,
    .slide.active .slide-content .description,
    .slide.active .slide-content .slide-cta,
    .slide.active .slide-content .slide-cta .btn {
        animation: none !important;
        animation-delay: 0s !important;
        transition: none !important;
    }

    /* 模块标题 - 移动端 (1.4rem) - 最高优先级覆盖主题样式 */
    body .custom-pages-container .core-competitiveness h3,
    body .custom-pages-container .competitor-comparison h3,
    body .custom-pages-container .expert-team h3,
    body .custom-pages-container .pricing-plans h3,
    body .custom-pages-container .scenarios h3,
    body .custom-pages-container .case-studies h3,
    body .custom-pages-container .faq-section h3,
    body .custom-pages-container .resource-center h3,
    body .custom-pages-container .latest-news h3,
    body .custom-pages-container .contact-section h3,
    body .custom-pages-container h3 {
        font-size: 1.4rem !important;
    }

    .slide-nav {
        bottom: 5px;
        gap: 5px;
    }
    
    .slide-dot {
        width: 6px;
        height: 6px;
    }
    
    .slide-cta .btn {
        width: 100px !important;
        max-width: 100px !important;
        min-width: 100px !important;
    }
}

@media (max-width: 768px) {
    /* 幻灯片按钮统一宽度 */
    .slide-cta .btn {
        width: 100px !important;
        max-width: 100px !important;
        min-width: 100px !important;
    }
    
    /* 文本溢出与换行处理 */
    .custom-pages-container h1,
    .custom-pages-container h2,
    .custom-pages-container h3,
    .custom-pages-container h4,
    .custom-pages-container h5,
    .custom-pages-container h6,
    .custom-pages-container p,
    .custom-pages-container span,
    .custom-pages-container a {
        word-break: break-word !important;
        overflow-wrap: break-word !important;
        hyphens: auto !important;
        white-space: normal !important;
    }
    
    /* 单行文本截断 */
    .custom-pages-container .ellipsis {
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        white-space: nowrap !important;
    }
    
    /* Flex容器修复 */
    .custom-pages-container .flex,
    .custom-pages-container .row,
    .custom-pages-container .flex-row {
        flex-wrap: wrap !important;
        overflow-x: hidden !important;
    }
    
    /* Flex子项修复 */
    .custom-pages-container .flex > *,
    .custom-pages-container .row > *,
    .custom-pages-container .flex-row > * {
        min-width: 0 !important;
        max-width: 100% !important;
    }
    
    /* 按钮和交互元素 */
    .custom-pages-container .btn,
    .custom-pages-container button,
    .custom-pages-container input,
    .custom-pages-container textarea,
    .custom-pages-container select {
        max-width: 100% !important;
        width: 100% !important;
        box-sizing: border-box !important;
    }
    
    /* 图片和媒体 */
    .custom-pages-container img,
    .custom-pages-container video,
    .custom-pages-container iframe {
        max-width: 100% !important;
        height: auto !important;
        width: 100% !important;
    }
    
    /* 网格布局 */
    .competitiveness-grid,
    .team-grid,
    .plans-container,
    .studies-grid,
    .resources-list {
        grid-template-columns: 1fr !important;
        gap: 16px !important;
    }

    .contact-info {
        grid-template-columns: 1fr;
        gap: 32px;
    }

    .news-item {
        flex-direction: column;
    }

    .news-date {
        min-width: auto;
        padding: 16px;
    }

    .comparison-table {
        overflow-x: auto;
    }

    .scenario-tabs {
        flex-direction: column;
        align-items: center;
    }

    .tab-btn {
        margin: 0 0 8px 0;
    }

    /* Comparison Table Mobile - Horizontal Scroll */
    .comparison-table-wrapper {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    .comparison-table-new {
        min-width: 600px;
    }

    .comparison-table-new th,
    .comparison-table-new td {
        padding: 14px 12px;
        font-size: 0.875rem;
    }

    .comparison-table-new th.dimension-header,
    .comparison-table-new td.dimension-cell {
        min-width: 100px;
    }

    .comparison-table-new th.our-brand-header,
    .comparison-table-new th.competitor-header {
        min-width: 120px;
    }

    /* Mobile: Hide additional content by default */
    .custom-pages-container .more-content {
        display: none !important;
    }

    .custom-pages-container .more-content.show {
        display: block !important;
    }

    .custom-pages-container .read-more-btn {
        display: block !important;
        padding: 20px 0;
    }
    
    .custom-pages-container .read-more-btn button {
        padding: 9px 24px !important;
        font-size: inherit !important;
        width: auto !important;
        max-width: 60% !important;
        margin: 0 auto !important;
        display: block !important;
    }
    
    /* Mobile: Expert Team Avatar - Ensure perfect circle */
    .team-member img,
    .custom-pages-container .team-member img,
    .core-advantages-module .expert-team .team-member img {
        width: 120px !important;
        height: 120px !important;
        max-width: 120px !important;
        max-height: 120px !important;
        min-width: 120px !important;
        min-height: 120px !important;
        border-radius: 50% !important;
        object-fit: cover !important;
        object-position: center center !important;
        margin: 0 !important;
        padding: 0 !important;
        display: block !important;
        box-sizing: border-box !important;
        flex-shrink: 0 !important;
        aspect-ratio: 1 !important;
    }
    
    /* 产品服务卡片修复 */
    .plans-container {
        max-width: 100% !important;
        padding: 0 !important;
        margin: 0 !important;
    }
    
    .plans-container .plan {
        padding: 16px !important;
        margin: 0 !important;
        max-width: 100% !important;
        width: 100% !important;
        border-radius: 12px !important;
        min-height: auto !important;
        background: var(--cp-bg-white) !important;
        box-shadow: var(--cp-shadow-md) !important;
    }
    
    .plans-container .plan h4 {
        font-size: 1.1rem !important;
        margin-bottom: 8px !important;
        color: inherit !important;
    }
    
    .plans-container .plan .price {
        font-size: 1.5rem !important;
    }
    
    .plans-container .plan .period {
        font-size: 0.85rem !important;
    }
    
    .plans-container .plan .features {
        padding-left: 16px !important;
    }
    
    .plans-container .plan .features li {
        font-size: 0.85rem !important;
        line-height: 1.5 !important;
    }
    
    .plans-container .plan .price .amount {
        color: var(--cp-gold) !important;
    }
    
    .plans-container .plan .price .period {
        color: inherit !important;
    }
    
    .plans-container .plan .plan-description {
        color: inherit !important;
        opacity: 0.8 !important;
    }
    
    .plans-container .plan .features li {
        color: inherit !important;
    }
    
    .plans-container .plan.recommended {
        border: 1px solid rgba(0, 0, 0, 0.1) !important;
        transform: none !important;
    }
    
    .plans-container .plan.recommended::before {
        content: none !important;
    }
    
    .plans-container .plan.recommended::after {
        content: none !important;
    }
    
    .plans-container .plan::before {
        content: none !important;
    }
    
    .pricing-plans::before {
        display: none !important;
    }
    
    .pricing-plans h3::after {
        display: none !important;
    }
    
    .plan-actions {
        padding-top: 16px !important;
    }
    
    .plan-actions .btn {
        width: 100px !important;
        max-width: 100px !important;
        min-width: 100px !important;
        padding: 10px 16px !important;
        font-size: 0.85rem !important;
    }
    
    /* 联系我们模块修复 */
    .contact-section {
        padding: 24px 0 !important;
    }
    
    .contact-section h3 {
        font-size: 1.4rem !important;
        margin-bottom: 20px !important;
    }
    
    .contact-info {
        grid-template-columns: 1fr !important;
        gap: 24px !important;
    }
    
    .contact-left {
        gap: 16px !important;
    }
    
    .contact-details {
        gap: 12px !important;
    }

    .contact-row {
        flex-direction: column !important;
        align-items: stretch !important;
        gap: 8px !important;
        width: 100% !important;
    }
    
    .contact-details .contact-item:not(.company-name) {
        display: grid !important;
        grid-template-columns: max-content minmax(0, 1fr) !important;
        align-items: start !important;
        column-gap: 8px !important;
        width: 100% !important;
        flex-wrap: nowrap !important;
        gap: 0 !important;
    }
    
    .contact-item .label {
        font-size: 0.85rem !important;
        min-width: 0 !important;
        margin-right: 0 !important;
        white-space: nowrap !important;
    }
    
    .contact-item .value {
        font-size: 0.85rem !important;
        min-width: 0 !important;
        overflow-wrap: anywhere !important;
        word-break: normal !important;
    }
    
    .contact-item::after,
    .contact-item .label::after,
    .contact-item .value::after {
        content: none !important;
        display: none !important;
        border-left: none !important;
    }
    
    .contact-image {
        max-width: 100% !important;
        width: 100% !important;
    }
    
    .contact-image img {
        max-width: 100% !important;
        width: 100% !important;
        height: auto !important;
    }
    
    .contact-form {
        padding: 0 !important;
        padding-left: 0 !important;
    }
    
    .contact-form h4 {
        font-size: 1rem !important;
        margin-bottom: 16px !important;
    }
    
    .contact-form .form-group {
        margin-bottom: 12px !important;
    }
    
    .contact-form input,
    .contact-form textarea {
        width: 100% !important;
        max-width: 100% !important;
        padding: 10px !important;
        font-size: 0.85rem !important;
        box-sizing: border-box !important;
    }
    
    .contact-form .btn-primary {
        width: 100px !important;
        max-width: 100px !important;
        min-width: 100px !important;
        margin: 0 auto !important;
        display: flex !important;
        justify-content: center !important;
        align-items: center !important;
        text-align: center !important;
        padding: 12px 0 !important;
        box-sizing: border-box !important;
    }
    
    /* 资源中心修复 */
    .resource-center {
        padding: 24px 0 !important;
    }
    
    .resource-center h3 {
        font-size: 1.4rem !important;
        margin-bottom: 20px !important;
    }
    
    .resources-list {
        gap: 12px !important;
    }
    
    .resource-item {
        padding: 16px !important;
    }
    
    .resource-info h4 {
        font-size: 0.95rem !important;
        margin-bottom: 6px !important;
    }
    
    .resource-info .category {
        font-size: 0.75rem !important;
    }
    
    .resource-info .summary {
        font-size: 0.8rem !important;
        line-height: 1.4 !important;
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        overflow: hidden;
    }
    
    .resource-actions {
        padding-left: 16px !important;
    }
    
    .download-btn {
        padding: 6px 12px !important;
        font-size: 0.75rem !important;
    }
    
    /* FAQ模块修复 */
    .faq-container {
        padding: 24px 0 !important;
    }
    
    .faq-container h3 {
        font-size: 1.4rem !important;
        margin-bottom: 20px !important;
    }
    
    .faq-two-columns {
        grid-template-columns: 1fr !important;
        gap: 12px !important;
    }
    
    .faq-item {
        padding: 0 !important;
    }
    
    .faq-question {
        padding: 16px !important;
        font-size: 0.85rem !important;
    }
    
    .faq-answer {
        padding: 0 16px 16px !important;
        font-size: 0.8rem !important;
        line-height: 1.5 !important;
    }
    
    /* 最新资讯修复 */
    .latest-news {
        padding: 24px 0 !important;
    }
    
    .latest-news h3 {
        font-size: 1.4rem !important;
        margin-bottom: 20px !important;
    }
    
    .news-grid {
        grid-template-columns: 1fr !important;
        gap: 16px !important;
    }
    
    .news-card {
        min-height: auto !important;
        height: auto !important;
    }
    
    .news-image {
        height: 180px !important;
    }
    
    .news-content {
        padding: 16px !important;
    }
    
    .news-content h4 {
        font-size: 0.95rem !important;
        margin-bottom: 6px !important;
    }
    
    /* 成功案例修复 - 与最新资讯样式一致 */
    .case-studies {
        padding: 24px 0 !important;
    }
    
    .case-studies h3 {
        font-size: 1.4rem !important;
        margin-bottom: 20px !important;
    }
    
    .studies-grid {
        grid-template-columns: 1fr !important;
        gap: 16px !important;
    }
    
    .study-card {
        height: 380px !important;
        min-height: 380px !important;
        position: relative !important;
    }
    
    .study-image {
        position: absolute !important;
        top: 0 !important;
        left: 0 !important;
        width: 100% !important;
        height: 100% !important;
        overflow: hidden !important;
    }
    
    .study-image img {
        width: 100% !important;
        height: 100% !important;
        object-fit: cover !important;
    }
    
    .study-content {
        position: absolute !important;
        bottom: 0 !important;
        left: 0 !important;
        right: 0 !important;
        padding: 20px 16px 16px !important;
        background: linear-gradient(to top, rgba(0, 0, 0, 0.75) 0%, rgba(0, 0, 0, 0.3) 60%, transparent 100%) !important;
        color: #ffffff !important;
        z-index: 1 !important;
    }
    
    .study-content h4 {
        font-size: 0.95rem !important;
        margin-bottom: 6px !important;
        color: #ffffff !important;
    }
    
    /* 应用场景修复 */
    .scenarios-module {
        padding: 24px 0 !important;
    }
    
    .scenarios-module h3 {
        font-size: 1.4rem !important;
        margin-bottom: 20px !important;
    }
    
    .scenario-tabs {
        gap: 8px !important;
        margin-bottom: 16px !important;
    }
    
    .tab-btn {
        padding: 8px 12px !important;
        font-size: 0.75rem !important;
    }
    
    .scenario-content {
        padding: 16px !important;
    }
    
    .scenario-content h4 {
        font-size: 0.95rem !important;
        margin-bottom: 8px !important;
    }
    
    .scenario-content .description {
        font-size: 0.8rem !important;
        line-height: 1.5 !important;
    }
    
    .scenario-content .steps {
        padding-left: 16px !important;
        gap: 8px !important;
    }
    
    .scenario-content .steps li {
        font-size: 0.8rem !important;
    }
    
    .scenario-content .result {
        font-size: 0.85rem !important;
        margin-top: 12px !important;
        padding: 12px !important;
    }
    
    /* 核心竞争力修复 */
    .core-advantages-module {
        padding: 24px 0 !important;
    }
    
    .core-advantages-module h3 {
        font-size: 1.4rem !important;
        margin-bottom: 20px !important;
    }
    
    .competitiveness-grid {
        gap: 16px !important;
    }
    
    .competitiveness-card {
        padding: 16px !important;
    }
    
    .competitiveness-card h4 {
        font-size: 0.95rem !important;
        margin-bottom: 8px !important;
    }
    
    .competitiveness-card p {
        font-size: 0.8rem !important;
        line-height: 1.5 !important;
    }
    
    /* 专家团队修复 */
    .expert-team {
        padding: 24px 0 !important;
    }
    
    .expert-team h3 {
        font-size: 1.4rem !important;
        margin-bottom: 20px !important;
    }
    
    .team-grid {
        gap: 20px !important;
    }
    
    .team-member {
        text-align: center !important;
    }
    
    .team-member h4 {
        font-size: 0.95rem !important;
        margin-bottom: 4px !important;
    }
    
    .team-member .title {
        font-size: 0.8rem !important;
    }
    
    .team-member p {
        font-size: 0.75rem !important;
        line-height: 1.4 !important;
        margin-top: 8px !important;
    }
    
    .avatar-placeholder {
        width: 120px !important;
        height: 120px !important;
        max-width: 120px !important;
        max-height: 120px !important;
        min-width: 120px !important;
        min-height: 120px !important;
        border-radius: 50% !important;
        margin: 0 !important;
        padding: 0 !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        flex-shrink: 0 !important;
        aspect-ratio: 1 !important;
    }
}

@media (max-width: 480px) {
    .overview-slides {
        height: 50vh;
        min-height: 30px;
    }
    
    .slide-cta {
        flex-direction: column;
        gap: 12px;
    }
    
    .slide-cta .btn {
        width: 100px !important;
        max-width: 100px !important;
        min-width: 100px !important;
        text-align: center;
        padding: 6px 10px;
        font-size: 0.65rem;
        }
    
    .slide-nav {
        bottom: 16px;
    }

    .competitiveness,
    .expert-team,
    .pricing-plans,
    .scenarios,
    .case-studies,
    .faq-section,
    .resource-center,
    .latest-news,
    .contact-section {
        padding: 40px 0;
    }

    .competitiveness h3,
    .expert-team h3,
    .pricing-plans h3,
    .scenarios h3,
    .case-studies h3,
    .faq-section h3,
    .resource-center h3,
    .latest-news h3,
    .contact-section h3 {
        font-size: 1.5rem;
        margin-bottom: 24px;
    }

    .btn {
        padding: 12px 20px;
        font-size: 0.875rem;
    }

    .resource-item {
        flex-direction: column;
        gap: 16px;
    }

    /* FAQ mobile: single column */
    .faq-two-columns {
        flex-direction: column;
    }

    /* Resources mobile: 1 column */
    .resources-list {
        grid-template-columns: 1fr;
        gap: 20px;
    }
}

/* ========================================
   Responsive Breakpoints System
   移动端优先，6个断点全覆盖
   ======================================== */

/* X-Small (xs) - 手机竖屏 */
@media (max-width: 480px) {
    :root {
        --text-xs: 0.7rem;
        --text-sm: 0.8rem;
        --text-base: 0.9375rem;
        --text-lg: 1rem;
        --text-xl: 1.125rem;
        --text-2xl: 1.375rem;
    }
    
    .container {
        padding: 0 var(--space-sm);
    }
    
    .btn {
        padding: 10px 16px;
        font-size: var(--text-xs);
    }
    
    .slide-content h2 {
        font-size: var(--text-2xl) !important;
        line-height: 1.15;
    }
    
    .slide-content .subtitle {
        font-size: var(--text-sm) !important;
    }
    
    .slide-content .description {
        font-size: var(--text-sm) !important;
        line-height: var(--leading-relaxed);
    }
    
    .core-competitiveness,
    .core-advantages-module,
    .products-module,
    .testimonials-module,
    .about-module {
        padding: 32px 0;
    }
    
    .competitiveness-grid,
    .team-grid,
    .plans-container,
    .studies-grid,
    .resources-list {
        flex-direction: column;
        gap: 16px;
    }
    
    .competitiveness-item,
    .team-member,
    .plan {
        padding: 20px;
    }
    
    .contact-info {
        grid-template-columns: 1fr;
        gap: 24px;
    }
    
    .contact-form {
        padding-left: 0;
    }
    
    .faq-two-columns {
        flex-direction: column;
    }
    
    .scenario-panel {
        grid-template-columns: 1fr;
        gap: 24px;
    }
    
    .scenario-left {
        padding-right: 0;
        border-right: none;
        border-bottom: 1px solid rgba(255, 255, 255, 0.1);
        padding-bottom: 24px;
    }
    
    .scenario-right {
        padding-left: 0;
    }
    
    li::after,
    .features li::after,
    .advantage-highlights li::after,
    .contact-item::after,
    .contact-item .label::after,
    .contact-item .value::after,
    .core-competitiveness li::after,
    .competitiveness-item::after,
    .scenario-item::after,
    .case-item::after,
    .news-item::after,
    .resource-item::after {
        content: none !important;
        display: none !important;
        border-left: none !important;
        border-right: none !important;
        background: none !important;
        width: 0 !important;
        height: 0 !important;
    }
    
    .features li,
    .advantage-highlights li,
    .core-competitiveness li,
    .scenario-content li {
        border-right: none !important;
        border-left: none !important;
    }
}

/* Small (sm) - 手机横屏 */
@media (min-width: 481px) and (max-width: 640px) {
    :root {
        --text-xs: 0.75rem;
        --text-sm: 0.875rem;
        --text-base: 1rem;
        --text-lg: 1.125rem;
        --text-xl: 1.25rem;
        --text-2xl: 1.5rem;
    }
    
    .container {
        padding: 0 var(--space-md);
    }
    
    .slide-content h2 {
        font-size: var(--text-3xl) !important;
    }
    
    .competitiveness-grid {
        flex-wrap: wrap;
    }
    
    .team-grid,
    .plans-container {
        grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
        gap: 20px;
    }
}

/* Medium (md) - 平板竖屏 */
@media (min-width: 641px) and (max-width: 768px) {
    .container {
        padding: 0 var(--space-lg);
    }
    
    .slide-content h2 {
        font-size: clamp(var(--text-3xl), 4vw, var(--text-4xl)) !important;
    }
    
    .competitiveness-grid {
        flex-wrap: wrap;
    }
    
    .team-grid,
    .plans-container {
        grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
        gap: 24px;
    }
    
    .contact-info {
        grid-template-columns: 1fr 1fr;
        gap: 32px;
    }
    
    .faq-two-columns {
        flex-direction: row;
    }

    /* Resources tablet: 2 columns */
    .resources-list {
        grid-template-columns: repeat(2, 1fr);
        gap: 24px;
    }
}

/* Large (lg) - 平板横屏 / 小屏笔记本 */
@media (min-width: 769px) and (max-width: 1024px) {
    .container {
        max-width: 900px;
        padding: 0 var(--space-lg);
    }
    
    .slide-content h2 {
        font-size: var(--text-4xl) !important;
    }
    
    .plans-container {
        grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    }
}

/* Extra Large (xl) - 标准桌面 */
@media (min-width: 1025px) and (max-width: 1280px) {
    .container {
        max-width: 1100px;
    }
    
    .slide-content h2 {
        font-size: var(--text-5xl) !important;
    }
}

/* Extra Extra Large (2xl) - 大屏显示器 */
@media (min-width: 1281px) {
    .container {
        max-width: 1400px;
    }
    
    .slide-content h2 {
        font-size: clamp(var(--text-4xl), 4.5vw, var(--text-5xl)) !important;
    }
    
    .competitiveness-grid {
        flex-wrap: wrap;
    }
    
    .team-grid {
        grid-template-columns: repeat(4, 1fr);
    }
    
    .plans-container {
        grid-template-columns: repeat(3, 1fr);
    }

    /* Resources desktop: 3 columns */
    .resources-list {
        grid-template-columns: repeat(3, 1fr);
        gap: 32px;
    }
}

/* ========================================
   Touch Device Optimizations
   ======================================== */
@media (hover: none) {
    .competitiveness-item:hover,
    .team-member:hover,
    .plan:hover,
    .study-card:hover {
        transform: none;
    }
    
    .btn-primary:hover,
    .btn-outline:hover {
        transform: none;
    }
}

/* ========================================
   High DPI Display Support
   ======================================== */
@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
    .slide-content {
        text-shadow: 0 2px 10px rgba(0, 0, 0, 0.8);
    }
}

/* ========================================
   Scroll Animation Classes
   ======================================== */
.animate-scroll {
    opacity: 0;
    transform: translateY(30px);
    transition: all 0.6s cubic-bezier(0.4, 0, 0.2, 1);
}

.animate-scroll.animated {
    opacity: 1;
    transform: translateY(0);
}

.animate-scroll-delay-1 {
    transition-delay: 0.1s;
}

.animate-scroll-delay-2 {
    transition-delay: 0.2s;
}

.animate-scroll-delay-3 {
    transition-delay: 0.3s;
}

.animate-scroll-delay-4 {
    transition-delay: 0.4s;
}

/* Fade In Animation */
.animate-fade-in {
    opacity: 0;
    transition: opacity 0.8s ease-out;
}

.animate-fade-in.animated {
    opacity: 1;
}

/* Scale In Animation */
.animate-scale-in {
    opacity: 0;
    transform: scale(0.95);
    transition: all 0.5s cubic-bezier(0.4, 0, 0.2, 1);
}

.animate-scale-in.animated {
    opacity: 1;
    transform: scale(1);
}

/* Slide In From Left */
.animate-slide-left {
    opacity: 0;
    transform: translateX(-30px);
    transition: all 0.6s cubic-bezier(0.4, 0, 0.2, 1);
}

.animate-slide-left.animated {
    opacity: 1;
    transform: translateX(0);
}

/* Slide In From Right */
.animate-slide-right {
    opacity: 0;
    transform: translateX(30px);
    transition: all 0.6s cubic-bezier(0.4, 0, 0.2, 1);
}

.animate-slide-right.animated {
    opacity: 1;
    transform: translateX(0);
}

/* ========================================
   Particle Background Styles
   ======================================== */
.particle-container {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
    z-index: 0;
    overflow: hidden;
}

.particle {
    position: absolute;
    width: 2px;
    height: 2px;
    background: rgba(201, 169, 98, 0.4);
    border-radius: 50%;
    animation: float-particle 15s ease-in-out infinite;
}

@keyframes float-particle {
    0%, 100% {
        transform: translateY(0) translateX(0) scale(1);
        opacity: 0.4;
    }
    25% {
        transform: translateY(-50px) translateX(20px) scale(1.2);
        opacity: 0.6;
    }
    50% {
        transform: translateY(-100px) translateX(-10px) scale(0.8);
        opacity: 0.3;
    }
    75% {
        transform: translateY(-50px) translateX(-20px) scale(1.1);
        opacity: 0.5;
    }
}

/* ========================================
   Glow Effects
   ======================================== */
.glow-gold {
    box-shadow: 0 0 20px rgba(201, 169, 98, 0.3),
                0 0 40px rgba(201, 169, 98, 0.1),
                0 0 60px rgba(201, 169, 98, 0.05);
}

.glow-gold-intense {
    box-shadow: 0 0 30px rgba(201, 169, 98, 0.4),
                0 0 60px rgba(201, 169, 98, 0.2),
                0 0 90px rgba(201, 169, 98, 0.1);
}

/* ========================================
   Custom Cursor
   ======================================== */


/* ========================================
   Gradient Text Effect
   ======================================== */
.gradient-text-gold {
    background: linear-gradient(90deg, #C9A962, #E8D5A3, #C9A962, #A68B3D);
    background-size: 300% 100%;
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    animation: gradient-flow 8s ease infinite;
}

@keyframes gradient-flow {
    0% { background-position: 0% 50%; }
    50% { background-position: 100% 50%; }
    100% { background-position: 0% 50%; }
}

/* ========================================
   Decorative Divider
   ======================================== */
.divider-gold {
    position: relative;
    height: 1px;
    background: linear-gradient(90deg, transparent, var(--cp-gold), transparent);
    margin: var(--space-2xl) 0;
}

.divider-gold::before,
.divider-gold::after {
    content: '';
    position: absolute;
    top: 50%;
    width: 16px;
    height: 16px;
    border: 1px solid var(--cp-gold);
    border-radius: 50%;
    transform: translateY(-50%);
}

.divider-gold::before {
    left: -24px;
}

.divider-gold::after {
    right: -24px;
}

/* ========================================
   Number Counter Animation
   ======================================== */
.counter-number {
    display: inline-block;
    font-variant-numeric: tabular-nums;
}

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

.counter-number.animating {
    animation: count-up 0.5s ease-out;
}

/* ========================================
   Smooth Scrollbar
   ======================================== */
.custom-pages-container {
    scrollbar-color: var(--cp-gold) var(--cp-navy);
    scrollbar-width: thin;
}

.custom-pages-container::-webkit-scrollbar,
.custom-pages-container *::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}

.custom-pages-container::-webkit-scrollbar-track,
.custom-pages-container *::-webkit-scrollbar-track {
    background: var(--cp-navy);
}

.custom-pages-container::-webkit-scrollbar-thumb,
.custom-pages-container *::-webkit-scrollbar-thumb {
    background: var(--cp-gold);
    border-radius: 0;
}

.custom-pages-container::-webkit-scrollbar-thumb:hover,
.custom-pages-container *::-webkit-scrollbar-thumb:hover {
    background: var(--cp-gold-light);
}

/* ========================================
   Scroll Progress Bar
   ======================================== */
.scroll-progress-bar {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 3px;
    background: rgba(201, 169, 98, 0.1);
    z-index: 9999;
    pointer-events: none;
}

.scroll-progress-fill {
    height: 100%;
    background: var(--cp-gradient-gold);
    width: 0%;
    transition: width 0.1s ease-out;
}



/* ========================================
   Pricing Toggle
   ======================================== */
.pricing-toggle {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 16px;
    margin-bottom: 40px;
}

.pricing-toggle .toggle-label {
    font-size: var(--text-sm);
    color: var(--cp-stone);
    transition: color 0.3s ease;
}

.pricing-toggle .toggle-label.active {
    color: var(--cp-gold);
}

.pricing-toggle .toggle-btn {
    width: 60px;
    height: 30px;
    background: var(--cp-navy-lighter);
    border-radius: 15px;
    position: relative;
    cursor: pointer;
    transition: background 0.3s ease;
}

.pricing-toggle .toggle-btn::after {
    content: '';
    position: absolute;
    width: 24px;
    height: 24px;
    background: var(--cp-gold);
    border-radius: 50%;
    top: 3px;
    left: 3px;
    transition: transform 0.3s ease;
}

.pricing-toggle.yearly .toggle-btn::after {
    transform: translateX(30px);
}

.pricing-toggle.yearly .toggle-btn {
    background: rgba(201, 169, 98, 0.3);
}

.plan-price.price-changed {
    animation: price-flash 0.3s ease;
}

@keyframes price-flash {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.5; }
}

/* ========================================
   Testimonials Carousel
   ======================================== */
.testimonials-carousel {
    position: relative;
    overflow: hidden;
}

.testimonial-item {
    opacity: 0;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    transition: opacity 0.5s ease;
}

.testimonial-item.active {
    opacity: 1;
    position: relative;
}

.carousel-controls {
    display: flex;
    justify-content: center;
    gap: 16px;
    margin-top: 32px;
}

.carousel-prev,
.carousel-next {
    width: 48px;
    height: 48px;
    background: transparent;
    border: 1px solid var(--cp-gold);
    color: var(--cp-gold);
    border-radius: 50%;
    cursor: pointer;
    transition: all 0.3s ease;
    display: flex;
    align-items: center;
    justify-content: center;
}

.carousel-prev:hover,
.carousel-next:hover {
    background: var(--cp-gold);
    color: var(--cp-navy);
}

/* ========================================
   Form Validation Styles
   ======================================== */
.form-group input.error,
.form-group textarea.error,
.form-group select.error {
    border-color: #dc3545;
    background-color: rgba(220, 53, 69, 0.05);
}

.form-group input.error:focus,
.form-group textarea.error:focus,
.form-group select.error:focus {
    box-shadow: 0 0 0 3px rgba(220, 53, 69, 0.2);
}

.error-message {
    color: #dc3545;
    font-size: var(--text-xs);
    margin-top: 4px;
    display: none;
}

.form-group input.error + .error-message,
.form-group textarea.error + .error-message {
    display: block;
}

/* ========================================
   Loading States
   ======================================== */
.loading {
    position: relative;
    pointer-events: none;
}

.loading::after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    width: 20px;
    height: 20px;
    margin: -10px 0 0 -10px;
    border: 2px solid var(--cp-gold);
    border-top-color: transparent;
    border-radius: 50%;
    animation: spin 0.8s linear infinite;
}

@keyframes spin {
    to { transform: rotate(360deg); }
}

/* ========================================
   Success/Error Messages
   ======================================== */
.message {
    padding: 16px 20px;
    border-radius: 0;
    margin-bottom: 24px;
    font-size: var(--text-sm);
}

.message-success {
    background: rgba(40, 167, 69, 0.1);
    border: 1px solid rgba(40, 167, 69, 0.3);
    color: #28a745;
}

.message-error {
    background: rgba(220, 53, 69, 0.1);
    border: 1px solid rgba(220, 53, 69, 0.3);
    color: #dc3545;
}

/* ========================================
   Tooltip Styles
   ======================================== */
[data-tooltip] {
    position: relative;
    cursor: help;
}

[data-tooltip]::before {
    content: attr(data-tooltip);
    position: absolute;
    bottom: 100%;
    left: 50%;
    transform: translateX(-50%) translateY(-8px);
    padding: 8px 12px;
    background: var(--cp-navy-light);
    color: var(--cp-ivory);
    font-size: var(--text-xs);
    white-space: nowrap;
    border-radius: 0;
    opacity: 0;
    visibility: hidden;
    transition: all 0.3s ease;
    z-index: 100;
}

[data-tooltip]:hover::before {
    opacity: 1;
    visibility: visible;
    transform: translateX(-50%) translateY(0);
}

/* ========================================
   Image Hover Effects
   ======================================== */
.img-hover-zoom {
    overflow: hidden;
}

.img-hover-zoom img {
    transition: transform 0.5s ease;
}

.img-hover-zoom:hover img {
    transform: scale(1.05);
}

.img-hover-overlay {
    position: relative;
    overflow: hidden;
}

.img-hover-overlay::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(10, 22, 40, 0.5);
    opacity: 0;
    transition: opacity 0.3s ease;
}

.img-hover-overlay:hover::after {
    opacity: 1;
}

/* ========================================
   Card Hover Lift Effect
   ======================================== */
.card-hover-lift {
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.card-hover-lift:hover {
    transform: translateY(-8px);
    box-shadow: var(--cp-shadow-lg);
}

/* ========================================
   Button Ripple Effect
   ======================================== */
.btn-ripple {
    position: relative;
    overflow: hidden;
}

.btn-ripple::after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    width: 0;
    height: 0;
    background: rgba(255, 255, 255, 0.3);
    border-radius: 50%;
    transform: translate(-50%, -50%);
    transition: width 0.6s ease, height 0.6s ease;
}

.btn-ripple:active::after {
    width: 300px;
    height: 300px;
}

/* ========================================
   Skeleton Loading
   ======================================== */
.skeleton {
    background: linear-gradient(90deg, var(--cp-navy-light) 25%, var(--cp-navy-lighter) 50%, var(--cp-navy-light) 75%);
    background-size: 200% 100%;
    animation: skeleton-loading 1.5s ease-in-out infinite;
    border-radius: 4px;
}

@keyframes skeleton-loading {
    0% { background-position: 200% 0; }
    100% { background-position: -200% 0; }
}

/* ========================================
   Focus Visible Styles (Accessibility)
   ======================================== */
*:focus-visible {
    outline: 2px solid var(--cp-gold);
    outline-offset: 2px;
}

button:focus-visible,
a:focus-visible,
input:focus-visible,
textarea:focus-visible,
select:focus-visible {
    outline: 2px solid var(--cp-gold);
    outline-offset: 2px;
}

/* ========================================
   Print Styles
   ======================================== */
@media print {
    .custom-pages-container {
        background: white !important;
        color: black !important;
    }
    
    .scroll-progress-bar,
    .particle-container {
        display: none !important;
    }
    
    .slide {
        page-break-inside: avoid;
    }
}

/* ========================================
   Admin About Page Layout
   ======================================== */
.about-admin {
    max-width: 1200px;
    margin: 0 auto;
}

/* ========================================
   Style Variants - Minimal Tech Mode
   ======================================== */

/* Minimal Tech Style - Remove blue backgrounds */
.custom-pages-style-minimal-tech .overview-slides--style-dimensional,
.custom-pages-style-minimal-tech .overview-slides--style-accordion,
.custom-pages-style-minimal-tech .overview-slides--style-focus-gallery {
    background: transparent !important;
}

.custom-pages-style-minimal-tech .products-module {
    background: transparent !important;
    padding: 0 !important;
}

.custom-pages-style-minimal-tech .pricing-plans {
    background: transparent !important;
}

.custom-pages-style-minimal-tech .pricing-plans::before {
    display: none !important;
}



/* ========================================
   Style Variants - Theme Adaptive Mode
   ======================================== */

/* Theme Adaptive Style - Follow WordPress Theme */
.custom-pages-style-theme-adaptive {
    --cp-navy: inherit;
    --cp-navy-light: inherit;
    --cp-navy-lighter: inherit;
    --cp-gold: inherit;
    --cp-gold-light: inherit;
    --cp-stone: inherit;
    --cp-white: #ffffff;
    --cp-dark: inherit;
    --cp-text-primary: #ffffff;
    --cp-text-secondary: #ffffff;
    
    font-family: inherit;
    color: inherit;
}

/* Theme Adaptive - Hero/Slides */
.custom-pages-style-theme-adaptive .overview-slides,
.custom-pages-style-theme-adaptive .slide {
    background: transparent !important;
}

.custom-pages-style-theme-adaptive .slide-content {
    background: transparent !important;
    color: #ffffff !important;
    border: none !important;
    box-shadow: none !important;
}

/* Theme Adaptive - Force white text on slides */
.custom-pages-container.custom-pages-style-theme-adaptive .slide-content h2,
.custom-pages-container.custom-pages-style-theme-adaptive .slide-content .subtitle,
.custom-pages-container.custom-pages-style-theme-adaptive .slide-content .description {
    color: #ffffff !important;
    text-shadow: 0 2px 10px rgba(0, 0, 0, 0.9) !important;
    z-index: 9999 !important;
    position: relative !important;
    opacity: 1 !important;
    visibility: visible !important;
}

/* Extra specificity for slide title - ensure it's white */
.custom-pages-container.custom-pages-style-theme-adaptive .overview-slides .slides-container .slide.active .slide-content-wrapper .slide-content h2 {
    color: #ffffff !important;
    text-shadow: 0 2px 15px rgba(0, 0, 0, 0.95) !important;
}

/* Theme Adaptive - Mobile Slide Content Fix */
@media (max-width: 768px) {
    .custom-pages-container.custom-pages-style-theme-adaptive .slide-content h2,
    .custom-pages-container.custom-pages-style-theme-adaptive .slide-content .subtitle,
    .custom-pages-container.custom-pages-style-theme-adaptive .slide-content .description {
        color: #ffffff !important;
        text-shadow: 0 2px 10px rgba(0, 0, 0, 0.9) !important;
    }

    .custom-pages-container.custom-pages-style-theme-adaptive .slide-cta .btn {
        color: #ffffff !important;
    }

    /* 移除所有主题自适应样式中的装饰性伪元素 */
    .custom-pages-style-theme-adaptive .plan.recommended::before,
    .custom-pages-style-theme-adaptive .plan.recommended::after,
    .custom-pages-style-theme-adaptive .plan::before,
    .custom-pages-style-theme-adaptive .plan::after,
    .custom-pages-style-theme-adaptive .pricing-plans::before,
    .custom-pages-style-theme-adaptive .pricing-plans::after,
    .custom-pages-style-theme-adaptive h3::after,
    .custom-pages-style-theme-adaptive h4::after,
    .custom-pages-style-theme-adaptive .label::after,
    .custom-pages-style-theme-adaptive .value::after {
        content: none !important;
        display: none !important;
    }

    /* 移除所有装饰性边框 */
    .custom-pages-style-theme-adaptive .plan.recommended {
        border: 1px solid rgba(0, 0, 0, 0.1) !important;
        transform: none !important;
    }

    /* 移除渐变背景 */
    .custom-pages-style-theme-adaptive .plan {
        background: #ffffff !important;
    }

    .custom-pages-style-theme-adaptive .pricing-plans {
        background: transparent !important;
    }
}

/* Theme Adaptive - Core Advantages */
.custom-pages-style-theme-adaptive .brand-intro-module,
.custom-pages-style-theme-adaptive .core-advantages-module {
    background: transparent !important;
    padding: 0 !important;
}

.custom-pages-style-theme-adaptive .competitiveness-item {
    background: transparent !important;
    border: none !important;
    padding: 16px !important;
}

.custom-pages-style-theme-adaptive .competitiveness-item:hover {
    background: rgba(0,0,0,0.05) !important;
}

.custom-pages-style-theme-adaptive .competitiveness-item-title {
    color: inherit !important;
}

.custom-pages-style-theme-adaptive .competitiveness-item-desc {
    color: inherit !important;
}

/* Theme Adaptive - Comparison Table */
.custom-pages-style-theme-adaptive .comparison-section {
    background: transparent !important;
    padding: 0 !important;
}

.custom-pages-style-theme-adaptive .comparison-table-new {
    border-color: currentColor !important;
    opacity: 0.5;
}

.custom-pages-style-theme-adaptive .comparison-table-new th,
.custom-pages-style-theme-adaptive .comparison-table-new td {
    border-color: currentColor !important;
    color: inherit !important;
    background: transparent !important;
}

.custom-pages-style-theme-adaptive .comparison-table-new th.our-brand-header {
    background: #007cba !important;
    color: white !important;
}

.custom-pages-style-theme-adaptive .comparison-table-new th.competitor-header {
    background: #6c757d !important;
    color: white !important;
}

/* Theme Adaptive - Expert Team */
.custom-pages-style-theme-adaptive .expert-team-section {
    background: transparent !important;
    padding: 0 !important;
}

.custom-pages-style-theme-adaptive .team-member-card {
    background: transparent !important;
    border: none !important;
    padding: 16px !important;
    color: inherit !important;
}

.custom-pages-style-theme-adaptive .team-member-name {
    color: inherit !important;
}

.custom-pages-style-theme-adaptive .team-member-title {
    color: inherit !important;
}

.custom-pages-style-theme-adaptive .team-member-desc {
    color: inherit !important;
}

/* Theme Adaptive - Products/Services */
.custom-pages-style-theme-adaptive .products-module {
    background: transparent !important;
    padding: 0 !important;
}

.custom-pages-style-theme-adaptive .product-item {
    background: transparent !important;
    border: none !important;
    padding: 16px !important;
}

.custom-pages-style-theme-adaptive .product-title {
    color: inherit !important;
}

.custom-pages-style-theme-adaptive .product-desc {
    color: inherit !important;
}

/* Theme Adaptive - Case Studies */
.custom-pages-style-theme-adaptive .testimonials-section {
    background: transparent !important;
    padding: 0 !important;
}

.custom-pages-style-theme-adaptive .studies-grid {
    gap: 24px !important;
}

.custom-pages-style-theme-adaptive .study-card {
    background: transparent !important;
    border: none !important;
    padding: 16px !important;
}

.custom-pages-style-theme-adaptive .study-content h4,
.custom-pages-style-theme-adaptive .study-content h4 a,
.custom-pages-style-theme-adaptive .study-content h4 a:visited,
.custom-pages-style-theme-adaptive .study-content h4 a:hover,
.custom-pages-style-theme-adaptive .study-content h4 a:focus,
.custom-pages-style-theme-adaptive .study-title {
    color: #ffffff !important;
    text-decoration: none;
}

/* Theme Adaptive - About/Contact */
.custom-pages-style-theme-adaptive .about-module {
    background: transparent !important;
    padding: 0 !important;
}

.custom-pages-style-theme-adaptive .resource-item {
    color: inherit !important;
}

.custom-pages-style-theme-adaptive .contact-section {
    background: transparent !important;
    padding: 0 !important;
}

.custom-pages-style-theme-adaptive .contact-info-item {
    color: inherit !important;
}

.custom-pages-style-theme-adaptive .contact-form input,
.custom-pages-style-theme-adaptive .contact-form textarea {
    border-color: currentColor !important;
    background: transparent !important;
    color: inherit !important;
}

.custom-pages-style-theme-adaptive .contact-form .btn-primary {
    background: #007cba !important;
    color: white !important;
    border: none !important;
}

.custom-pages-style-theme-adaptive .contact-form .btn-primary:hover {
    background: #006ba1 !important;
}

/* Theme Adaptive - Read More Button */
.custom-pages-style-theme-adaptive .read-more-btn {
    background: transparent !important;
    padding: 20px 0 !important;
}

.custom-pages-style-theme-adaptive .read-more-btn button {
    background: #007cba !important;
    color: white !important;
}

.custom-pages-style-theme-adaptive .read-more-btn button:hover {
    background: #006ba1 !important;
}

/* Theme Adaptive - Headings */
.custom-pages-style-theme-adaptive h2,
.custom-pages-style-theme-adaptive h3,
.custom-pages-style-theme-adaptive h4 {
    color: inherit !important;
}

/* Theme Adaptive - Remove extra backgrounds and shadows */
.custom-pages-style-theme-adaptive .section-title::before,
.custom-pages-style-theme-adaptive .section-title::after {
    display: none !important;
}

.custom-pages-style-theme-adaptive .section-subtitle {
    color: inherit !important;
}

.custom-pages-style-theme-adaptive .section-description {
    color: inherit !important;
}

/* Theme Adaptive - Products Module Cards */
.custom-pages-style-theme-adaptive .pricing-card,
.custom-pages-style-theme-adaptive .scenario-card {
    background: transparent !important;
    border: none !important;
}

.custom-pages-style-theme-adaptive .pricing-card.recommended {
    border: 2px solid #007cba !important;
    background: rgba(0, 124, 186, 0.05) !important;
}

/* Theme Adaptive - Pricing Plans */
.custom-pages-style-theme-adaptive .pricing-plans-section {
    background: transparent !important;
    padding: 0 !important;
}

/* Theme Adaptive - Scenarios Section */
.custom-pages-style-theme-adaptive .scenarios-section {
    background: transparent !important;
    padding: 0 !important;
}

/* Theme Adaptive - Resource Center */
.custom-pages-style-theme-adaptive .resource-center {
    background: transparent !important;
}

/* Theme Adaptive - Latest News */
.custom-pages-style-theme-adaptive .latest-news-section {
    background: transparent !important;
}

/* Theme Adaptive - FAQ Section */
.custom-pages-style-theme-adaptive .faq-section {
    background: transparent !important;
}

/* Theme Adaptive - Remove any remaining dark backgrounds */
.custom-pages-style-theme-adaptive .dark-bg,
.custom-pages-style-theme-adaptive .navy-bg,
.custom-pages-style-theme-adaptive .section-bg-dark {
    background: transparent !important;
}

/* Theme Adaptive - Pricing Card Elements */
.custom-pages-style-theme-adaptive .pricing-card-header,
.custom-pages-style-theme-adaptive .pricing-card-body,
.custom-pages-style-theme-adaptive .pricing-card-footer {
    background: transparent !important;
}

.custom-pages-style-theme-adaptive .pricing-card-price {
    color: inherit !important;
}

.custom-pages-style-theme-adaptive .pricing-card-features li {
    color: inherit !important;
}

/* Theme Adaptive - Custom Pages Container */
.custom-pages-style-theme-adaptive {
    background: transparent !important;
}

/* Theme Adaptive - Remove all navy/dark backgrounds comprehensively */
.custom-pages-style-theme-adaptive .testimonials-module,
.custom-pages-style-theme-adaptive .brand-intro-module,
.custom-pages-style-theme-adaptive .core-advantages-module,
.custom-pages-style-theme-adaptive .products-module,
.custom-pages-style-theme-adaptive .about-module,
.custom-pages-style-theme-adaptive .comparison-section,
.custom-pages-style-theme-adaptive .expert-team-section {
    background: transparent !important;
    padding: 20px 0 !important;
}

/* Theme Adaptive - Remove specific dark backgrounds */
.custom-pages-style-theme-adaptive [style*="background-color: #0A1628"],
.custom-pages-style-theme-adaptive [style*="background-color: #152238"],
.custom-pages-style-theme-adaptive [style*="background-color: #1E3A5F"],
.custom-pages-style-theme-adaptive [style*="background: var(--cp-navy)"],
.custom-pages-style-theme-adaptive [style*="background: var(--cp-navy-light)"],
.custom-pages-style-theme-adaptive [style*="background: var(--cp-navy-lighter)"] {
    background: transparent !important;
}

/* Theme Adaptive - Override CSS variables for all child elements */
.custom-pages-style-theme-adaptive * {
    --cp-navy: transparent !important;
    --cp-navy-light: transparent !important;
    --cp-navy-lighter: transparent !important;
    --cp-bg-light: transparent !important;
    --cp-bg-white: transparent !important;
    --cp-bg-dark: transparent !important;
}

/* ========================================
   Theme Adaptive - Color Contrast Rules
   Ensure readable text on any background
   ======================================== */

/* Default text color - inherit from theme (usually dark on light backgrounds) */
.custom-pages-style-theme-adaptive {
    color: inherit !important;
}

.custom-pages-style-theme-adaptive *:not(button):not(a):not(.btn):not(.button) {
    color: inherit !important;
}

/* Light text on dark backgrounds */
.custom-pages-style-theme-adaptive .btn-primary,
.custom-pages-style-theme-adaptive .btn-outline,
.custom-pages-style-theme-adaptive button,
.custom-pages-style-theme-adaptive input[type="submit"],
.custom-pages-style-theme-adaptive .read-more-btn button {
    color: #ffffff !important;
}

/* Dark text on light backgrounds (for badges, highlights) */
.custom-pages-style-theme-adaptive .badge,
.custom-pages-style-theme-adaptive .tag,
.custom-pages-style-theme-adaptive .label,
.custom-pages-style-theme-adaptive .price-tag {
    color: #333333 !important;
}

/* Headings - ensure they stand out */
.custom-pages-style-theme-adaptive h1,
.custom-pages-style-theme-adaptive h2,
.custom-pages-style-theme-adaptive h3,
.custom-pages-style-theme-adaptive h4,
.custom-pages-style-theme-adaptive h5,
.custom-pages-style-theme-adaptive h6 {
    color: #1a1a1a !important;
}

/* Links - ensure they are distinguishable */
.custom-pages-style-theme-adaptive a {
    color: #007cba !important;
}

.custom-pages-style-theme-adaptive a:hover {
    color: #006ba1 !important;
}

/* Lists and icons */
.custom-pages-style-theme-adaptive ul li,
.custom-pages-style-theme-adaptive ol li {
    color: inherit !important;
}

.custom-pages-style-theme-adaptive .fa,
.custom-pages-style-theme-adaptive .icon {
    color: inherit !important;
}

/* Input fields - ensure text is readable */
.custom-pages-style-theme-adaptive input,
.custom-pages-style-theme-adaptive textarea {
    color: #333333 !important;
}

/* ========================================
   Theme Adaptive - Border & Divider Rules
   Light backgrounds get dark borders, dark backgrounds get light borders
   ======================================== */

/* Dark borders on light backgrounds */
.custom-pages-style-theme-adaptive .competitiveness-item,
.custom-pages-style-theme-adaptive .team-member-card,
.custom-pages-style-theme-adaptive .product-item,
.custom-pages-style-theme-adaptive .study-card,
.custom-pages-style-theme-adaptive .pricing-card,
.custom-pages-style-theme-adaptive .scenario-card {
    border: 1px solid #ddd !important;
}

.custom-pages-style-theme-adaptive .competitiveness-item:hover,
.custom-pages-style-theme-adaptive .team-member-card:hover,
.custom-pages-style-theme-adaptive .product-item:hover,
.custom-pages-style-theme-adaptive .study-card:hover,
.custom-pages-style-theme-adaptive .pricing-card:hover {
    border-color: #007cba !important;
}

/* Dividers and separators */
.custom-pages-style-theme-adaptive .divider,
.custom-pages-style-theme-adaptive .separator,
.custom-pages-style-theme-adaptive hr {
    border-color: #ddd !important;
    background-color: #ddd !important;
}

/* Light borders on dark backgrounds (buttons) */
.custom-pages-style-theme-adaptive .btn-outline {
    border-color: rgba(255, 255, 255, 0.5) !important;
    color: #ffffff !important;
}

.custom-pages-style-theme-adaptive .btn-outline:hover {
    border-color: #ffffff !important;
}

/* Icons on buttons */
.custom-pages-style-theme-adaptive .btn-primary .fa,
.custom-pages-style-theme-adaptive .btn-primary .icon,
.custom-pages-style-theme-adaptive button .fa,
.custom-pages-style-theme-adaptive button .icon {
    color: #ffffff !important;
}

/* Input field borders */
.custom-pages-style-theme-adaptive input,
.custom-pages-style-theme-adaptive textarea {
    border-color: #ccc !important;
}

.custom-pages-style-theme-adaptive input:focus,
.custom-pages-style-theme-adaptive textarea:focus {
    border-color: #007cba !important;
}

/* Card shadows for depth */
.custom-pages-style-theme-adaptive .competitiveness-item,
.custom-pages-style-theme-adaptive .team-member-card,
.custom-pages-style-theme-adaptive .product-item,
.custom-pages-style-theme-adaptive .study-card {
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1) !important;
}

/* Active states */
.custom-pages-style-theme-adaptive .pricing-card.recommended {
    border-color: #007cba !important;
    box-shadow: 0 0 0 3px rgba(0, 124, 186, 0.1) !important;
}

/* Featured highlights */
.custom-pages-style-theme-adaptive .featured,
.custom-pages-style-theme-adaptive .highlight {
    background: rgba(0, 124, 186, 0.1) !important;
    border-left: 4px solid #007cba !important;
}

/* Progress bars */
.custom-pages-style-theme-adaptive .progress-bar {
    background: #007cba !important;
}

/* Timeline elements */
.custom-pages-style-theme-adaptive .timeline-item::before {
    background: #007cba !important;
    border-color: #ffffff !important;
}

.custom-pages-style-theme-adaptive .timeline-item::after {
    background: #007cba !important;
}

/* ========================================
   Theme Adaptive - Comparison Table Styles
   Use light color blocks for better visibility
   ======================================== */

/* Comparison table container */
.custom-pages-style-theme-adaptive .comparison-table-new {
    border: 1px solid #e0e0e0 !important;
    border-collapse: separate !important;
    border-spacing: 0 !important;
    width: 100% !important;
}

/* Table header */
.custom-pages-style-theme-adaptive .comparison-table-new th {
    border: 1px solid #e0e0e0 !important;
    padding: 16px !important;
    text-align: center !important;
    font-weight: 600 !important;
}

/* First column (dimension) */
.custom-pages-style-theme-adaptive .comparison-table-new th:first-child,
.custom-pages-style-theme-adaptive .comparison-table-new td:first-child {
    background: #f8f9fa !important;
    border-right: 2px solid #dee2e6 !important;
    font-weight: 600 !important;
}

/* Our brand column - blue highlight */
.custom-pages-style-theme-adaptive .comparison-table-new th.our-brand-header {
    background: #007cba !important;
    color: #ffffff !important;
}

.custom-pages-style-theme-adaptive .comparison-table-new .our-brand-column {
    background: rgba(0, 124, 186, 0.08) !important;
}

/* Competitor columns */
.custom-pages-style-theme-adaptive .comparison-table-new th.competitor-header {
    background: #6c757d !important;
    color: #ffffff !important;
}

.custom-pages-style-theme-adaptive .comparison-table-new .competitor-column {
    background: #f8f9fa !important;
}

/* Alternating row backgrounds for readability */
.custom-pages-style-theme-adaptive .comparison-table-new tbody tr:nth-child(even) td:first-child {
    background: #ffffff !important;
}

.custom-pages-style-theme-adaptive .comparison-table-new tbody tr:nth-child(even) .our-brand-column {
    background: rgba(0, 124, 186, 0.05) !important;
}

.custom-pages-style-theme-adaptive .comparison-table-new tbody tr:nth-child(even) .competitor-column {
    background: #ffffff !important;
}

/* Table cells */
.custom-pages-style-theme-adaptive .comparison-table-new td {
    border: 1px solid #e0e0e0 !important;
    padding: 16px !important;
    vertical-align: middle !important;
}

/* Hover effect */
.custom-pages-style-theme-adaptive .comparison-table-new tbody tr:hover td {
    background: rgba(0, 124, 186, 0.1) !important;
}

/* Table caption/title */
.custom-pages-style-theme-adaptive .comparison-table-new caption {
    font-size: 1.25rem !important;
    font-weight: 600 !important;
    margin-bottom: 16px !important;
    color: #1a1a1a !important;
}

/* Header row text - set to black with highest specificity */
.custom-pages-style-theme-adaptive .comparison-table-new thead tr th,
.custom-pages-style-theme-adaptive .comparison-table-new thead tr th.dimension-header,
.custom-pages-style-theme-adaptive .comparison-table-new thead tr th.competitor-header {
    color: #000000 !important;
    text-shadow: none !important;
}

/* Keep white text on dark blue header (our brand) for readability */
.custom-pages-style-theme-adaptive .comparison-table-new thead tr th.our-brand-header {
    color: #ffffff !important;
}

/* Ensure table header cells have black text - even higher specificity */
.custom-pages-style-theme-adaptive .comparison-table-wrapper .comparison-table-new thead tr th {
    color: #000000 !important;
}

.custom-pages-style-theme-adaptive .comparison-table-wrapper .comparison-table-new thead tr th.our-brand-header {
    color: #ffffff !important;
}

/* ========================================
   Theme Adaptive - Scenarios Module
   Apply dark text colors
   ======================================== */

/* Scenario tabs */
.custom-pages-style-theme-adaptive .scenario-tabs .tab-btn {
    color: #333333 !important;
    background: #f5f5f5 !important;
    border-color: #ddd !important;
}

.custom-pages-style-theme-adaptive .scenario-tabs .tab-btn.active {
    color: #ffffff !important;
    background: #007cba !important;
    border-color: #007cba !important;
}

/* Scenario panel */
.custom-pages-style-theme-adaptive .scenario-panel {
    background: #ffffff !important;
    border: 1px solid #e0e0e0 !important;
}

/* Scenario header */
.custom-pages-style-theme-adaptive .scenario-header h5 {
    color: #1a1a1a !important;
}

.custom-pages-style-theme-adaptive .scenario-header .pain-point {
    color: #666666 !important;
}

/* Solution steps */
.custom-pages-style-theme-adaptive .solution-steps .step {
    color: #333333 !important;
}

.custom-pages-style-theme-adaptive .solution-steps .step-number {
    background: #007cba !important;
    color: #ffffff !important;
}

.custom-pages-style-theme-adaptive .solution-steps .step-text {
    color: #333333 !important;
}

/* Right panel - Expected result */
.custom-pages-style-theme-adaptive .scenario-right .result {
    background: rgba(0, 124, 186, 0.08) !important;
}

.custom-pages-style-theme-adaptive .scenario-right .result h5 {
    color: #007cba !important;
}

.custom-pages-style-theme-adaptive .scenario-right .result p {
    color: #333333 !important;
}

/* Scenario left border */
.custom-pages-style-theme-adaptive .scenario-left {
    border-right-color: #e0e0e0 !important;
}

/* ========================================
   Theme Adaptive - Products Module
   Add light background color to cards
   ======================================== */

/* Pricing plans container */
.custom-pages-style-theme-adaptive .pricing-plans {
    background: transparent !important;
}

/* Remove ::before overlay background */
.custom-pages-style-theme-adaptive .pricing-plans::before {
    display: none !important;
}

/* Individual plan cards */
.custom-pages-style-theme-adaptive .pricing-plans .plan {
    background: rgba(255, 255, 255, 0.06) !important;
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
    border-radius: 24px !important;
    backdrop-filter: blur(30px) !important;
}

/* Recommended plan highlight */
.custom-pages-style-theme-adaptive .pricing-plans .plan.recommended {
    background: linear-gradient(135deg, rgba(255, 215, 0, 0.15) 0%, rgba(255, 215, 0, 0.08) 50%, rgba(255, 215, 0, 0.15) 100%) !important;
    border-color: #C9A962 !important;
    border-width: 3px !important;
    box-shadow: 0 0 40px rgba(255, 215, 0, 0.25) !important;
}

/* Plan header */
.custom-pages-style-theme-adaptive .plan .plan-header {
    background: transparent !important;
    border-bottom: 1px solid #e0e0e0 !important;
}

.custom-pages-style-theme-adaptive .plan .plan-header h4 {
    color: #ffffff !important;
}

.custom-pages-style-theme-adaptive .plan .plan-header .price .amount {
    color: #C9A962 !important;
}

.custom-pages-style-theme-adaptive .plan .plan-header .price .period {
    color: rgba(255, 255, 255, 0.7) !important;
}

/* Plan features list */
.custom-pages-style-theme-adaptive .plan .features {
    color: rgba(255, 255, 255, 0.9) !important;
}

.custom-pages-style-theme-adaptive .plan .features li {
    color: rgba(255, 255, 255, 0.9) !important;
}

/* Plan actions */
.custom-pages-style-theme-adaptive .plan .plan-actions {
    border-top: 1px solid rgba(255, 255, 255, 0.1) !important;
}

/* Refund policy */
.custom-pages-style-theme-adaptive .refund-policy {
    color: rgba(255, 255, 255, 0.6) !important;
}

/* Remove horizontal lines in plan cards */
.custom-pages-style-theme-adaptive .plan .plan-header,
.custom-pages-style-theme-adaptive .plan .plan-actions,
.custom-pages-style-theme-adaptive .plan .features li {
    border-bottom: none !important;
    border-top: none !important;
    border-left: none !important;
    border-right: none !important;
}

/* Remove any horizontal dividers */
.custom-pages-style-theme-adaptive .plan hr,
.custom-pages-style-theme-adaptive .plan .divider {
    display: none !important;
}

/* Recommended badge - set text to white */
.custom-pages-style-theme-adaptive .plan.recommended .recommended-badge,
.custom-pages-style-theme-adaptive .plan.recommended .badge,
.custom-pages-style-theme-adaptive .plan .recommended-badge,
.custom-pages-style-theme-adaptive .plan .badge {
    color: #ffffff !important;
    background: #007cba !important;
    border-color: #007cba !important;
}

/* Recommended badge using ::before pseudo-element */
.custom-pages-style-theme-adaptive .plan.recommended::before {
    content: "推荐" !important;
    color: #ffffff !important;
    background: #007cba !important;
    border-color: #007cba !important;
    text-shadow: none !important;
}

/* ========================================
   Theme Adaptive - Expert Team Avatar Fix
   ======================================== */

/* Fix avatar container */
.custom-pages-style-theme-adaptive .team-member .member-avatar {
    width: 120px !important;
    height: 120px !important;
    border-radius: 50% !important;
    overflow: hidden !important;
    margin-left: auto !important;
    margin-right: auto !important;
    margin-bottom: 16px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

/* Fix avatar image */
.custom-pages-style-theme-adaptive .team-member .member-avatar img {
    width: 100% !important;
    height: 100% !important;
    border-radius: 50% !important;
    object-fit: cover !important;
    object-position: center center !important;
}



/* Fix avatar placeholder */
.custom-pages-style-theme-adaptive .team-member .member-avatar .avatar-placeholder {
    width: 100% !important;
    height: 100% !important;
    border-radius: 50% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    background: #e0e0e0 !important;
    color: #666666 !important;
    font-size: 1.5rem !important;
}

/* ========================================
   Case Studies - Image Link Styles
   ======================================== */

/* Study card image link wrapper */
.study-card .study-card-link {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
    cursor: pointer;
}

/* Hover effect on image */
.study-card:hover .study-image img {
    opacity: 0.85;
}

/* Footer spacing */
.footer-spacing {
    height: 150px;
}

.contact-form-message {
    margin: 12px 0 0;
    font-size: 14px;
    line-height: 1.5;
}

.contact-form-message.success {
    color: #198754;
}

.contact-form-message.error {
    color: #dc3545;
}

/* ========================================
   Desktop Overview Slide Image Styles
   ======================================== */
@media (min-width: 769px) {
    .custom-pages-container .overview-slides--style-dimensional {
        height: 820px;
        min-height: 820px;
        overflow: visible;
        display: flex;
        align-items: center;
        justify-content: center;
        padding: 0 !important;
        background: transparent !important;
    }

    .custom-pages-container .overview-slides--style-dimensional .slides-container {
        position: relative;
        width: min(88vw, 1440px);
        height: clamp(560px, 50vw, 720px);
        margin: 0 auto;
        overflow: visible;
    }

    .custom-pages-container .overview-slides--style-dimensional .slides-container::after {
        content: '';
        position: absolute;
        left: 11%;
        right: 11%;
        bottom: -30px;
        height: 36px;
        border-radius: 50%;
        background: radial-gradient(ellipse at center, rgba(15, 23, 42, 0.34) 0%, rgba(15, 23, 42, 0) 70%);
        pointer-events: none;
        z-index: 0;
    }

    .custom-pages-container .overview-slides--style-dimensional .slide {
        width: 100%;
        height: 100%;
        overflow: hidden;
        border: 1px solid rgba(15, 23, 42, 0.16);
        border-radius: 2px;
        box-shadow: 0 34px 32px rgba(15, 23, 42, 0.32);
        background: #111;
    }

    .custom-pages-container .overview-slides--style-dimensional .slide-image,
    .custom-pages-container .overview-slides--style-dimensional .slide-content-wrapper {
        height: 100%;
    }

    .custom-pages-container .overview-slides--style-dimensional .slide-image {
        animation: none;
    }

    .custom-pages-container .overview-slides--style-accordion {
        height: 820px;
        min-height: 820px;
        overflow: hidden;
        display: flex;
        align-items: center;
        justify-content: center;
        padding: 0 !important;
        background: transparent !important;
    }

    .custom-pages-container .overview-slides--style-accordion .slides-container {
        display: flex;
        gap: 12px;
        width: min(88vw, 1440px);
        height: clamp(560px, 50vw, 720px);
        margin: 0 auto;
        overflow: hidden;
    }

    .custom-pages-container .overview-slides--style-accordion .slide {
        position: relative;
        inset: auto;
        display: block;
        flex: 1 1 0;
        width: auto;
        height: 100%;
        min-width: 0;
        opacity: 1 !important;
        visibility: visible !important;
        overflow: hidden;
        border-radius: 18px;
        background: #111;
        transition: flex 0.8s ease, filter 0.8s ease, opacity 0.8s ease;
    }

    .custom-pages-container .overview-slides--style-accordion .slide.active {
        flex: 4 1 0;
        z-index: 2;
    }

    .custom-pages-container .overview-slides--style-accordion .slide-image,
    .custom-pages-container .overview-slides--style-accordion .slide-overlay,
    .custom-pages-container .overview-slides--style-accordion .slide-content-wrapper {
        height: 100%;
    }

    .custom-pages-container .overview-slides--style-accordion .slide-image {
        animation: none;
        filter: saturate(0.86) brightness(0.72);
        transition: filter 0.8s ease, transform 0.8s ease;
    }

    .custom-pages-container .overview-slides--style-accordion .slide.active .slide-image {
        filter: saturate(1) brightness(1);
        transform: scale(1.03);
    }

    .custom-pages-container .overview-slides--style-accordion .slide:not(.active) .slide-content-wrapper {
        opacity: 0 !important;
        visibility: hidden !important;
        pointer-events: none;
    }

    .custom-pages-container .overview-slides--style-accordion .slide:not(.active) .slide-overlay {
        background: rgba(0, 0, 0, 0.48);
    }

    .custom-pages-container .overview-slides--style-focus-gallery {
        height: 820px;
        min-height: 820px;
        overflow: hidden;
        display: flex;
        align-items: center;
        justify-content: center;
        padding: 0 !important;
        background: transparent !important;
    }

    .custom-pages-container .overview-slides--style-focus-gallery .slides-container {
        --cp-focus-offset: min(35vw, 540px);
        position: relative;
        width: min(88vw, 1440px);
        height: clamp(560px, 50vw, 720px);
        margin: 0 auto;
        overflow: visible;
        perspective: 1400px;
    }

    .custom-pages-container .overview-slides--style-focus-gallery .slide {
        top: 50%;
        left: 50%;
        width: min(74vw, 1120px);
        height: 100%;
        overflow: hidden;
        border: 1px solid rgba(255, 255, 255, 0.14);
        border-radius: 18px;
        background: #111;
        box-shadow: 0 34px 74px rgba(15, 23, 42, 0.36);
        opacity: 0;
        visibility: hidden;
        pointer-events: none;
        transform: translate(-50%, -50%) scale(0.84);
        transition: transform 0.8s ease, opacity 0.8s ease, filter 0.8s ease, visibility 0.8s ease, box-shadow 0.8s ease;
    }

    .custom-pages-container .overview-slides--style-focus-gallery .slide.active {
        z-index: 3;
        opacity: 1 !important;
        visibility: visible !important;
        pointer-events: auto;
        transform: translate(-50%, -50%) scale(1);
    }

    .custom-pages-container .overview-slides--style-focus-gallery .slide.prev,
    .custom-pages-container .overview-slides--style-focus-gallery .slide.next {
        z-index: 2;
        width: min(38vw, 540px);
        opacity: 0.46 !important;
        visibility: visible !important;
        pointer-events: auto;
        filter: saturate(0.86) brightness(0.74);
        box-shadow: 0 22px 48px rgba(15, 23, 42, 0.24);
    }

    .custom-pages-container .overview-slides--style-focus-gallery .slide.prev {
        transform: translate(calc(-50% - var(--cp-focus-offset)), -50%) scale(0.86) rotateY(8deg);
    }

    .custom-pages-container .overview-slides--style-focus-gallery .slide.next {
        transform: translate(calc(-50% + var(--cp-focus-offset)), -50%) scale(0.86) rotateY(-8deg);
    }

    .custom-pages-container .overview-slides--style-focus-gallery .slide-image,
    .custom-pages-container .overview-slides--style-focus-gallery .slide-overlay,
    .custom-pages-container .overview-slides--style-focus-gallery .slide-content-wrapper {
        height: 100%;
    }

    .custom-pages-container .overview-slides--style-focus-gallery .slide-image {
        animation: none;
        transition: transform 0.8s ease, filter 0.8s ease;
    }

    .custom-pages-container .overview-slides--style-focus-gallery .slide.active .slide-image {
        transform: scale(1.02);
    }

    .custom-pages-container .overview-slides--style-focus-gallery .slide.prev .slide-content-wrapper,
    .custom-pages-container .overview-slides--style-focus-gallery .slide.next .slide-content-wrapper {
        opacity: 0 !important;
        visibility: hidden !important;
        pointer-events: none;
    }

    .custom-pages-container .overview-slides--style-focus-gallery .slide.prev .slide-overlay,
    .custom-pages-container .overview-slides--style-focus-gallery .slide.next .slide-overlay {
        background: rgba(0, 0, 0, 0.5);
    }
}

/* ========================================
   Unified Front-End Section Spacing
   ======================================== */
.custom-pages-container {
    --cp-section-gap: 120px;
    --cp-section-heading-gap: 48px;
}

.custom-pages-container::after {
    content: '';
    display: block;
    height: var(--cp-section-gap);
}

.custom-pages-container .core-advantages-module,
.custom-pages-container .products-module,
.custom-pages-container .testimonials-module,
.custom-pages-container .about-module,
.custom-pages-container.custom-pages-style-theme-adaptive .core-advantages-module,
.custom-pages-container.custom-pages-style-theme-adaptive .products-module,
.custom-pages-container.custom-pages-style-theme-adaptive .testimonials-module,
.custom-pages-container.custom-pages-style-theme-adaptive .about-module {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}

.custom-pages-container .cp-home-section {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    padding-top: var(--cp-section-gap) !important;
    padding-bottom: 0 !important;
    clear: both;
}

.custom-pages-container .overview-slides.cp-home-section {
    padding-top: 0 !important;
    background: transparent !important;
}

@media (min-width: 769px) {
    .custom-pages-container .overview-slides.cp-home-section {
        height: 820px !important;
        min-height: 820px !important;
        background: transparent !important;
    }

    .custom-pages-container .overview-slides.cp-home-section .slides-container,
    .custom-pages-container .overview-slides.cp-home-section .slide,
    .custom-pages-container .overview-slides.cp-home-section .slide-image,
    .custom-pages-container .overview-slides.cp-home-section .slide-content-wrapper {
        height: 820px;
    }

    .custom-pages-container .overview-slides.cp-home-section.overview-slides--style-dimensional {
        padding: 0 !important;
    }

    .custom-pages-container .overview-slides.cp-home-section.overview-slides--style-dimensional .slides-container,
    .custom-pages-container .overview-slides.cp-home-section.overview-slides--style-accordion .slides-container,
    .custom-pages-container .overview-slides.cp-home-section.overview-slides--style-focus-gallery .slides-container {
        height: min(720px, calc(100% - 80px));
    }

    .custom-pages-container .overview-slides.cp-home-section.overview-slides--style-dimensional .slide,
    .custom-pages-container .overview-slides.cp-home-section.overview-slides--style-dimensional .slide-image,
    .custom-pages-container .overview-slides.cp-home-section.overview-slides--style-dimensional .slide-content-wrapper,
    .custom-pages-container .overview-slides.cp-home-section.overview-slides--style-accordion .slide,
    .custom-pages-container .overview-slides.cp-home-section.overview-slides--style-accordion .slide-image,
    .custom-pages-container .overview-slides.cp-home-section.overview-slides--style-accordion .slide-content-wrapper,
    .custom-pages-container .overview-slides.cp-home-section.overview-slides--style-focus-gallery .slide,
    .custom-pages-container .overview-slides.cp-home-section.overview-slides--style-focus-gallery .slide-image,
    .custom-pages-container .overview-slides.cp-home-section.overview-slides--style-focus-gallery .slide-content-wrapper {
        height: 100%;
    }

    .custom-pages-container .overview-slides.cp-home-section.overview-slides--style-accordion,
    .custom-pages-container .overview-slides.cp-home-section.overview-slides--style-focus-gallery {
        padding: 0 !important;
    }
}

.custom-pages-container .overview-slides--video {
    overflow: hidden;
    background: transparent !important;
}

.custom-pages-container .overview-slides--video .slide-video-background {
    position: absolute;
    inset: 0;
    z-index: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    pointer-events: none;
}

.custom-pages-container .overview-slides--video .slide {
    background: transparent !important;
}

.custom-pages-container .overview-slides--video .slide-image {
    display: none !important;
}

@media (min-width: 769px) {
    .custom-pages-container .overview-slides.cp-home-section.overview-slides--video {
        display: block !important;
        height: 820px !important;
        min-height: 820px !important;
        padding: 0 !important;
        overflow: hidden !important;
    }

    .custom-pages-container .overview-slides.cp-home-section.overview-slides--video .slides-container {
        display: block !important;
        width: 100% !important;
        max-width: none !important;
        height: 820px !important;
        margin: 0 !important;
        overflow: hidden !important;
        perspective: none !important;
        background: #111;
    }

    .custom-pages-container .overview-slides.cp-home-section.overview-slides--video .slides-container::after {
        display: none !important;
    }

    .custom-pages-container .overview-slides.cp-home-section.overview-slides--video .slide {
        position: absolute !important;
        inset: 0 auto auto 0 !important;
        display: flex !important;
        flex: none !important;
        width: 100% !important;
        min-width: 100% !important;
        height: 820px !important;
        border: 0 !important;
        border-radius: 0 !important;
        box-shadow: none !important;
        filter: none !important;
        opacity: 0 !important;
        visibility: hidden !important;
        pointer-events: none !important;
        transform: none !important;
        transition: opacity 1s ease-in-out, visibility 1s ease-in-out !important;
    }

    .custom-pages-container .overview-slides.cp-home-section.overview-slides--video .slide.active {
        z-index: 2 !important;
        opacity: 1 !important;
        visibility: visible !important;
        pointer-events: auto !important;
    }

    .custom-pages-container .overview-slides.cp-home-section.overview-slides--video .slide.prev,
    .custom-pages-container .overview-slides.cp-home-section.overview-slides--video .slide.next {
        z-index: 1 !important;
        opacity: 0 !important;
        visibility: hidden !important;
        pointer-events: none !important;
        transform: none !important;
    }

    .custom-pages-container .overview-slides.cp-home-section.overview-slides--video .slide-overlay,
    .custom-pages-container .overview-slides.cp-home-section.overview-slides--video .slide-content-wrapper {
        height: 100% !important;
    }
}

.custom-pages-container .cp-home-section-title {
    margin-top: 0 !important;
    margin-bottom: var(--cp-section-heading-gap) !important;
}

.custom-pages-container .footer-spacing {
    height: 0 !important;
}

@media (max-width: 1024px) {
    .custom-pages-container {
        --cp-section-gap: 88px;
        --cp-section-heading-gap: 36px;
    }
}

/* ========================================
   Mobile Decorative Line Fix
   ======================================== */
@media (max-width: 768px) {
    .custom-pages-container {
        --cp-section-gap: 64px;
        --cp-section-heading-gap: 28px;
    }

    /*
     * Several desktop decorative pseudo-elements become narrow vertical gold
     * bars on mobile after the global overflow/width constraints are applied.
     * Keep real content markers such as feature check icons, but remove
     * headings/card divider ornaments that do not fit narrow layouts.
     */
    .custom-pages-container .slide-content h1::before,
    .custom-pages-container .slide-content h1::after,
    .custom-pages-container .slide-content h2::before,
    .custom-pages-container .slide-content h2::after,
    .custom-pages-container .slide-content .subtitle::before,
    .custom-pages-container .slide-content .subtitle::after,
    .custom-pages-container .core-competitiveness h3::before,
    .custom-pages-container .core-competitiveness h3::after,
    .custom-pages-container .competitor-comparison h3::before,
    .custom-pages-container .competitor-comparison h3::after,
    .custom-pages-container .expert-team h3::before,
    .custom-pages-container .expert-team h3::after,
    .custom-pages-container .pricing-plans h3::before,
    .custom-pages-container .pricing-plans h3::after,
    .custom-pages-container .scenarios h3::before,
    .custom-pages-container .scenarios h3::after,
    .custom-pages-container .case-studies h3::before,
    .custom-pages-container .case-studies h3::after,
    .custom-pages-container .faq-section h3::before,
    .custom-pages-container .faq-section h3::after,
    .custom-pages-container .resource-center h3::before,
    .custom-pages-container .resource-center h3::after,
    .custom-pages-container .latest-news h3::before,
    .custom-pages-container .latest-news h3::after,
    .custom-pages-container .contact-section h3::before,
    .custom-pages-container .contact-section h3::after,
    .custom-pages-container .section-title::before,
    .custom-pages-container .section-title::after,
    .custom-pages-container .plan-header h4::before,
    .custom-pages-container .plan-header h4::after,
    .custom-pages-container .scenario-header h5::before,
    .custom-pages-container .scenario-header h5::after,
    .custom-pages-container .scenario-right .result h5::before,
    .custom-pages-container .scenario-right .result h5::after,
    .custom-pages-container .competitiveness-item h4::before,
    .custom-pages-container .competitiveness-item h4::after,
    .custom-pages-container .team-member h4::before,
    .custom-pages-container .team-member h4::after,
    .custom-pages-container .study-content h4::before,
    .custom-pages-container .study-content h4::after,
    .custom-pages-container .news-content h4::before,
    .custom-pages-container .news-content h4::after,
    .custom-pages-container .contact-form h4::before,
    .custom-pages-container .contact-form h4::after,
    .custom-pages-container .pricing-plans::before,
    .custom-pages-container .pricing-plans::after,
    .custom-pages-container .plan::before,
    .custom-pages-container .plan::after,
    .custom-pages-container .plan.recommended::before,
    .custom-pages-container .plan.recommended::after,
    .custom-pages-container .plan-header::before,
    .custom-pages-container .plan-header::after,
    .custom-pages-container .plan-actions::before,
    .custom-pages-container .plan-actions::after,
    .custom-pages-container .features li::after,
    .custom-pages-container .advantage-highlights li::after,
    .custom-pages-container .solution-steps .step::before,
    .custom-pages-container .solution-steps .step::after,
    .custom-pages-container .step-text::before,
    .custom-pages-container .step-text::after,
    .custom-pages-container .competitiveness-item::before,
    .custom-pages-container .competitiveness-item::after,
    .custom-pages-container .study-card::before,
    .custom-pages-container .study-card::after,
    .custom-pages-container .news-card::before,
    .custom-pages-container .news-card::after,
    .custom-pages-container .resource-item::before,
    .custom-pages-container .resource-item::after,
    .custom-pages-container .contact-item::before,
    .custom-pages-container .contact-item::after,
    .custom-pages-container .divider-gold::before,
    .custom-pages-container .divider-gold::after,
    .custom-pages-style-theme-adaptive .plan.recommended::before,
    .custom-pages-style-theme-adaptive .plan.recommended::after {
        content: none !important;
        display: none !important;
        width: 0 !important;
        height: 0 !important;
        min-width: 0 !important;
        min-height: 0 !important;
        max-width: 0 !important;
        max-height: 0 !important;
        padding: 0 !important;
        margin: 0 !important;
        border: 0 !important;
        background: none !important;
        box-shadow: none !important;
        transform: none !important;
    }

    .custom-pages-container,
    .custom-pages-container * {
        scrollbar-width: none !important;
        -ms-overflow-style: none !important;
    }

    .custom-pages-container::-webkit-scrollbar,
    .custom-pages-container *::-webkit-scrollbar {
        display: none !important;
        width: 0 !important;
        height: 0 !important;
    }

    .custom-pages-container .features li::before,
    .custom-pages-container .advantage-highlights li::before {
        flex: 0 0 auto !important;
        position: static !important;
        left: auto !important;
        right: auto !important;
        width: 20px !important;
        min-width: 20px !important;
        max-width: 20px !important;
        height: 20px !important;
        min-height: 20px !important;
        max-height: 20px !important;
        margin: 0 10px 0 0 !important;
    }

    /* Mobile products: center the feature list as a group. */
    .custom-pages-container .pricing-plans .plans-container .plan {
        padding-left: 8px !important;
        padding-right: 8px !important;
    }

    .custom-pages-container .pricing-plans .plans-container .plan .features {
        width: fit-content !important;
        max-width: 100% !important;
        padding-left: 0 !important;
        margin-left: auto !important;
        margin-right: auto !important;
        text-align: left !important;
    }

    .custom-pages-container .pricing-plans .plans-container .plan .features li {
        display: grid !important;
        grid-template-columns: 20px minmax(0, 1fr) !important;
        column-gap: 8px !important;
        align-items: start !important;
        justify-content: start !important;
        width: fit-content !important;
        max-width: 100% !important;
        padding: 6px 0 !important;
        text-align: left !important;
        line-height: 1.45 !important;
    }

    .custom-pages-container .pricing-plans .plans-container .plan .features li::before {
        grid-column: 1 !important;
        margin: 0 !important;
    }
}