/**
 * 首页版式协调优化
 * Home Layout Harmony Optimization
 * 
 * 设计目标：
 * 1. 统一各模块的标题字体大小和样式
 * 2. 统一各模块的间距和padding
 * 3. 实现背景明暗交替设计
 * 4. 优化视觉层次和节奏感
 * 
 * @package Corporate_Theme
 * @since 1.0.0
 */

/* ==========================================================================
   全局首页样式重置
   ========================================================================== */

.home-page {
    background: var(--bg-primary) !important;
}

/* ==========================================================================
   统一模块间距和padding
   ========================================================================== */

/* 所有首页section统一间距 */
.home-page section {
    padding: 5rem 0 !important;
}

/* Hero Section 保持特殊高度 */
.home-page .hero-section {
    padding: 8rem 0 !important;
}

/* ==========================================================================
   背景明暗交替设计
   ========================================================================== */

/* 白色背景模块 */
.home-page .company-intro,
.home-page .featured-products {
    background: var(--bg-primary) !important;
}

/* 浅灰背景模块 */
.home-page .business-areas,
.home-page .latest-news {
    background: var(--bg-secondary) !important;
}

/* ==========================================================================
   统一标题样式系统
   ========================================================================== */

/* 一级标题 - 所有section标题统一 */
.home-page .section-title {
    font-size: 2.25rem !important;
    font-weight: 700 !important;
    color: var(--text-primary) !important;
    margin-bottom: 1rem !important;
    line-height: 1.2 !important;
    letter-spacing: -0.5px !important;
}

/* 标题分割线统一 */
.home-page .section-divider {
    width: 80px !important;
    height: 4px !important;
    background: linear-gradient(
        to right,
        var(--primary-color),
        var(--primary-light)
    ) !important;
    margin: 1.5rem auto !important;
    border-radius: 2px !important;
}

/* 副标题/描述文字统一 */
.home-page .section-description {
    font-size: 1.0625rem !important;
    color: var(--text-secondary) !important;
    max-width: 700px !important;
    margin: 0 auto !important;
    line-height: 1.7 !important;
}

/* section-header 统一间距 */
.home-page .section-header {
    text-align: center !important;
    margin-bottom: 3.5rem !important;
}

/* ==========================================================================
   公司介绍模块优化
   ========================================================================== */

.home-page .company-intro {
    padding: 5rem 0 !important;
}

.home-page .company-intro .section-title {
    font-size: 2.25rem !important;
}

.home-page .intro-text {
    font-size: 1.0625rem !important;
    line-height: 1.8 !important;
    color: var(--text-secondary) !important;
}

.home-page .intro-text p {
    margin-bottom: 1.25rem !important;
}

/* 统计数字优化 */
.home-page .stat-number {
    font-size: 2.75rem !important;
    font-weight: 700 !important;
    color: var(--primary-color) !important;
    margin-bottom: 0.75rem !important;
    line-height: 1 !important;
}

.home-page .stat-label {
    font-size: 0.9375rem !important;
    color: var(--text-secondary) !important;
    font-weight: 500 !important;
}

/* ==========================================================================
   核心业务领域模块优化
   ========================================================================== */

.home-page .business-areas {
    padding: 5rem 0 !important;
}

.home-page .business-areas .section-title {
    font-size: 2.25rem !important;
}

.home-page .business-areas .section-description {
    font-size: 1.0625rem !important;
}

/* 卡片标题统一 */
.home-page .business-title {
    font-size: 1.375rem !important;
    font-weight: 700 !important;
    line-height: 1.3 !important;
}

.home-page .business-description {
    font-size: 0.9375rem !important;
    line-height: 1.7 !important;
    color: var(--text-secondary) !important;
}

/* ==========================================================================
   特色产品模块优化
   ========================================================================== */

.home-page .featured-products {
    padding: 5rem 0 !important;
}

.home-page .featured-products .section-title {
    font-size: 2.25rem !important;
}

.home-page .featured-products .section-description {
    font-size: 1.0625rem !important;
}

/* 产品卡片标题统一 */
.home-page .product-title {
    font-size: 1.125rem !important;
    font-weight: 600 !important;
    line-height: 1.4 !important;
    margin-bottom: 0.75rem !important;
}

.home-page .product-excerpt {
    font-size: 0.9375rem !important;
    line-height: 1.6 !important;
    color: var(--text-secondary) !important;
}

/* 产品网格优化 - 改为3列 */
.home-page .products-grid {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 2rem !important;
}

/* 产品卡片优化 */
.home-page .product-card {
    background: var(--bg-primary) !important;
    border: 1px solid var(--border-color) !important;
    border-radius: 12px !important;
    overflow: hidden !important;
    transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1) !important;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.06) !important;
}

.home-page .product-card:hover {
    transform: translateY(-8px) !important;
    box-shadow: 0 12px 32px rgba(25, 118, 210, 0.15) !important;
    border-color: var(--primary-color) !important;
}

/* 产品图片高度统一 */
.home-page .product-image {
    padding-top: 66.67% !important; /* 3:2 比例 */
}

/* ==========================================================================
   最新动态模块优化
   ========================================================================== */

.home-page .latest-news {
    padding: 5rem 0 !important;
}

.home-page .latest-news .section-title {
    font-size: 2.25rem !important;
}

.home-page .latest-news .section-description {
    font-size: 1.0625rem !important;
}

/* 新闻卡片标题统一 */
.home-page .news-title {
    font-size: 1.25rem !important;
    font-weight: 600 !important;
    line-height: 1.4 !important;
    margin-bottom: 0.75rem !important;
}

.home-page .news-excerpt {
    font-size: 0.9375rem !important;
    line-height: 1.6 !important;
    color: var(--text-secondary) !important;
}

/* 新闻卡片优化 */
.home-page .news-card {
    background: var(--bg-primary) !important;
    border: 1px solid var(--border-color) !important;
    border-radius: 12px !important;
    overflow: hidden !important;
    transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1) !important;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.06) !important;
}

.home-page .news-card:hover {
    transform: translateY(-8px) !important;
    box-shadow: 0 12px 32px rgba(25, 118, 210, 0.15) !important;
    border-color: var(--primary-color) !important;
}

/* 新闻图片高度统一 */
.home-page .news-image {
    padding-top: 60% !important; /* 5:3 比例 */
}

/* ==========================================================================
   统一按钮样式
   ========================================================================== */

/* 查看更多按钮统一 */
.home-page .section-footer {
    margin-top: 3.5rem !important;
    text-align: center !important;
}

.home-page .section-footer .btn {
    padding: 0.875rem 2rem !important;
    font-size: 1rem !important;
    font-weight: 600 !important;
    border-radius: 8px !important;
    transition: all 0.3s ease !important;
}

.home-page .section-footer .btn-primary {
    background: var(--primary-color) !important;
    color: var(--text-inverse) !important;
    border: 2px solid var(--primary-color) !important;
    box-shadow: 0 4px 12px rgba(25, 118, 210, 0.2) !important;
}

.home-page .section-footer .btn-primary:hover {
    background: var(--primary-dark, #1565c0) !important;
    border-color: var(--primary-dark, #1565c0) !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 6px 20px rgba(25, 118, 210, 0.3) !important;
}

.home-page .section-footer .btn-outline {
    background: transparent !important;
    color: var(--primary-color) !important;
    border: 2px solid var(--primary-color) !important;
}

.home-page .section-footer .btn-outline:hover {
    background: var(--primary-color) !important;
    color: var(--text-inverse) !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 6px 20px rgba(25, 118, 210, 0.3) !important;
}

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

/* 平板 */
@media (max-width: 1024px) {
    .home-page section {
        padding: 4rem 0 !important;
    }
    
    .home-page .hero-section {
        padding: 6rem 0 !important;
    }
    
    .home-page .section-title {
        font-size: 2rem !important;
    }
    
    .home-page .section-header {
        margin-bottom: 3rem !important;
    }
    
    /* 产品改为2列 */
    .home-page .products-grid {
        grid-template-columns: repeat(2, 1fr) !important;
    }
    
    /* 公司介绍改为单列 - iPad 端上下布局 */
    .home-page .intro-content {
        grid-template-columns: 1fr !important;
        gap: 2.5rem !important;
    }
}

/* 手机 */
@media (max-width: 768px) {
    .home-page section {
        padding: 3rem 0 !important;
    }
    
    .home-page .hero-section {
        padding: 5rem 0 !important;
    }
    
    .home-page .section-title {
        font-size: 1.75rem !important;
    }
    
    .home-page .section-description {
        font-size: 1rem !important;
    }
    
    .home-page .section-header {
        margin-bottom: 2.5rem !important;
    }
    
    /* 产品改为1列 */
    .home-page .products-grid {
        grid-template-columns: 1fr !important;
    }
    
    /* 新闻改为1列 */
    .home-page .news-grid {
        grid-template-columns: 1fr !important;
    }
    
    /* 公司介绍改为单列 */
    .home-page .intro-content {
        grid-template-columns: 1fr !important;
    }
}

/* 小手机 */
@media (max-width: 480px) {
    .home-page section {
        padding: 2.5rem 0 !important;
    }
    
    .home-page .hero-section {
        padding: 4rem 0 !important;
    }
    
    .home-page .section-title {
        font-size: 1.5rem !important;
    }
    
    .home-page .section-description {
        font-size: 0.9375rem !important;
    }
}

/* ==========================================================================
   视觉层次优化
   ========================================================================== */

/* 为白色背景模块添加微妙的顶部边框 */
.home-page .company-intro::before,
.home-page .featured-products::before {
    content: '' !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    height: 1px !important;
    background: linear-gradient(
        to right,
        transparent 0%,
        var(--border-color) 50%,
        transparent 100%
    ) !important;
}

.home-page .company-intro,
.home-page .featured-products {
    position: relative !important;
}

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

@media print {
    .home-page section {
        padding: 2rem 0 !important;
        page-break-inside: avoid !important;
    }
    
    .home-page .section-header {
        margin-bottom: 1.5rem !important;
    }
    
    .home-page .business-areas,
    .home-page .latest-news {
        background: var(--bg-primary) !important;
    }
}

/* ==========================================================================
   无障碍优化
   ========================================================================== */

/* 减少动画（用户偏好） */
@media (prefers-reduced-motion: reduce) {
    .home-page .product-card,
    .home-page .news-card,
    .home-page .section-footer .btn {
        transition: none !important;
    }
    
    .home-page .product-card:hover,
    .home-page .news-card:hover,
    .home-page .section-footer .btn:hover {
        transform: none !important;
    }
}

/* 高对比度模式 */
@media (prefers-contrast: high) {
    .home-page .section-divider {
        background: var(--primary-color) !important;
    }
    
    .home-page .product-card,
    .home-page .news-card {
        border-width: 2px !important;
    }
}
