/**
 * English Homepage - Company Intro Layout Optimization
 * 英文站点首页 - 公司介绍模块布局优化
 * 
 * 参照日本站点的布局风格：
 * - 左右两栏布局（文字 + 统计数据）
 * - 清晰的视觉层次
 * - 优雅的间距和排版
 * - 响应式设计
 */

/* ============================================================================
   英文站点首页 - Company Intro 模块
   ============================================================================ */

/* 主容器 */
body.lang-en .home-page .company-intro,
body.lang-en.home .company-intro {
    padding: 5rem 0 !important;
    background: #ffffff !important;
}

/* 标题区域 */
body.lang-en .home-page .company-intro .section-header,
body.lang-en.home .company-intro .section-header {
    text-align: center;
    margin-bottom: 3rem;
}

body.lang-en .home-page .company-intro .section-title,
body.lang-en.home .company-intro .section-title {
    font-size: 2.25rem !important;
    font-weight: 600 !important;
    letter-spacing: 0.02em;
    color: #1a1a1a !important;
    margin-bottom: 1rem;
}

body.lang-en .home-page .company-intro .section-divider,
body.lang-en.home .company-intro .section-divider {
    width: 60px;
    height: 4px;
    background: linear-gradient(90deg, #1565c0 0%, #1976d2 100%);
    margin: 0 auto;
    border-radius: 2px;
}

/* 内容区域 - 左右两栏布局 */
body.lang-en .home-page .company-intro .intro-content,
body.lang-en.home .company-intro .intro-content {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 4rem !important;
    align-items: center !important;
    margin-top: 3rem;
}

/* 左侧文字区域 */
body.lang-en .home-page .company-intro .intro-text,
body.lang-en.home .company-intro .intro-text {
    font-size: 1rem !important;
    line-height: 1.8 !important;
    color: #555 !important;
}

body.lang-en .home-page .company-intro .intro-text p,
body.lang-en.home .company-intro .intro-text p {
    margin-bottom: 1.5rem !important;
    letter-spacing: 0.01em;
}

body.lang-en .home-page .company-intro .intro-text .btn,
body.lang-en.home .company-intro .intro-text .btn {
    margin-top: 1.5rem !important;
    padding: 0.875rem 2rem !important;
    font-size: 1rem !important;
    font-weight: 600 !important;
    border-radius: 6px !important;
    transition: all 0.3s ease !important;
}

/* 右侧统计数据区域 */
body.lang-en .home-page .company-intro .intro-stats,
body.lang-en.home .company-intro .intro-stats {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 2rem !important;
}

body.lang-en .home-page .company-intro .stat-item,
body.lang-en.home .company-intro .stat-item {
    text-align: center !important;
    padding: 1.75rem 1.5rem !important;
    background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%) !important;
    border-radius: 12px !important;
    transition: all 0.3s ease !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05) !important;
}

body.lang-en .home-page .company-intro .stat-item:hover,
body.lang-en.home .company-intro .stat-item:hover {
    transform: translateY(-4px) !important;
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.1) !important;
}

body.lang-en .home-page .company-intro .stat-number,
body.lang-en.home .company-intro .stat-number {
    font-size: 2.75rem !important;
    font-weight: 700 !important;
    color: #1565c0 !important;
    line-height: 1.1 !important;
    margin-bottom: 0.5rem !important;
    display: block !important;
}

body.lang-en .home-page .company-intro .stat-label,
body.lang-en.home .company-intro .stat-label {
    font-size: 0.95rem !important;
    font-weight: 600 !important;
    color: #666 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.05em !important;
}

/* ============================================================================
   响应式设计
   ============================================================================ */

/* 平板端 (1024px 以下) */
@media (max-width: 1024px) {
    body.lang-en .home-page .company-intro .intro-content,
    body.lang-en.home .company-intro .intro-content {
        grid-template-columns: 1fr !important;
        gap: 3rem !important;
    }
    
    body.lang-en .home-page .company-intro .intro-stats,
    body.lang-en.home .company-intro .intro-stats {
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 1.5rem !important;
    }
}

/* 移动端 (768px 以下) */
@media (max-width: 768px) {
    body.lang-en .home-page .company-intro,
    body.lang-en.home .company-intro {
        padding: 3rem 0 !important;
    }
    
    body.lang-en .home-page .company-intro .section-title,
    body.lang-en.home .company-intro .section-title {
        font-size: 1.75rem !important;
    }
    
    body.lang-en .home-page .company-intro .intro-content,
    body.lang-en.home .company-intro .intro-content {
        gap: 2rem !important;
    }
    
    body.lang-en .home-page .company-intro .intro-stats,
    body.lang-en.home .company-intro .intro-stats {
        grid-template-columns: 1fr !important;
        gap: 1rem !important;
    }
    
    body.lang-en .home-page .company-intro .stat-item,
    body.lang-en.home .company-intro .stat-item {
        padding: 1.25rem !important;
    }
    
    body.lang-en .home-page .company-intro .stat-number,
    body.lang-en.home .company-intro .stat-number {
        font-size: 2.25rem !important;
    }
}

/* 小屏幕移动端 (480px 以下) */
@media (max-width: 480px) {
    body.lang-en .home-page .company-intro,
    body.lang-en.home .company-intro {
        padding: 2.5rem 0 !important;
    }
    
    body.lang-en .home-page .company-intro .section-title,
    body.lang-en.home .company-intro .section-title {
        font-size: 1.5rem !important;
    }
    
    body.lang-en .home-page .company-intro .intro-text,
    body.lang-en.home .company-intro .intro-text {
        font-size: 0.95rem !important;
    }
}