/* 国企网站高端大气背景样式 - 重新设计 */

/* 全局背景样式 */
body {
    background-color: #ffffff;
}

/* 英雄轮播区背景增强 */
.hero-section {
    position: relative;
}

.hero-section::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    /* 添加亮红色叠加层 */

    z-index: 1;
    pointer-events: none;
}

/* 德达介绍模块背景 - 高端商务风格 */
.about-section {
    background: #ffffff;
    position: relative;
    overflow: hidden;
}

.about-section::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(135deg, rgba(0, 102, 204, 0.05) 0%, rgba(0, 102, 204, 0.02) 100%);
    z-index: 0;
}

/* 添加右侧装饰图形 */
.about-section::after {
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    width: 50%;
    height: 100%;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100' height='100' viewBox='0 0 100 100'%3E%3Cpath fill='%230066cc' fill-opacity='0.03' d='M0 0h100v100H0z'/%3E%3Cpath fill='%230066cc' fill-opacity='0.05' d='M0 0h50v50H0z'/%3E%3Cpath fill='%230066cc' fill-opacity='0.05' d='M50 50h50v50H50z'/%3E%3C/svg%3E");
    opacity: 0.5;
    z-index: 0;
}

/* 底部数据展示容器样式优化 */
.bottom-stats-container {
    background: #f5f7fa;
    padding: 30px 0;
    margin-top: 40px;
    position: relative;
}

.bottom-stats-container::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, rgba(46, 125, 50, 0.05) 0%, rgba(46, 125, 50, 0.02) 100%);
    z-index: -1;
}

.stats-overlay {
    display: flex;
    justify-content: space-around;
    padding: 0 20px;
}

.stat-item-bottom {
    text-align: center;
    flex: 1;
    padding: 20px;
    transition: all 0.3s ease;
}

.stat-item-bottom:hover {
    transform: translateY(-5px);
}

.stat-number-bottom {
    color: #2e7d32;
    font-size: 42px;
    font-weight: 700;
    margin-bottom: 10px;
    display: block;
}

.stat-label-bottom {
    color: #333333;
    font-size: 16px;
    font-weight: 600;
    margin-bottom: 5px;
}

/* 行业地位展示样式 */
.industry-position {
    display: flex;
    justify-content: space-between;
    /* margin-top: 40px; */
    gap: 30px;
}

.position-item {
    flex: 1;
    background: #f5f7fa;
    padding: 30px;
    border-radius: 0;
    position: relative;
    overflow: hidden;
    transition: all 0.3s ease;
    border-top: 1px solid rgba(0, 0, 0, 0.05);
}

.position-title {
    color: #333;
    font-size: 18px;
    font-weight: 600;
    margin-bottom: 5px;
    text-align: center;
}

.position-subtitle {
    color: #2e7d32;
    font-size: 20px;
    font-weight: 700;
    margin-bottom: 15px;
    text-align: center;
}

.position-desc {
    color: #666;
    font-size: 14px;
    line-height: 1.6;
    text-align: center;
}

/* 招标采购信息模块背景 - 高端大气简约风格 */
.procurement-section {
    background: linear-gradient(120deg, #e2e8f0 0%, #cbd5e1 100%);
    position: relative;
    overflow: hidden;
    color: #333;
}

/* 添加简洁线条背景 */
.procurement-section::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-image: linear-gradient(0deg, rgba(0, 0, 0, 0.04) 1px, transparent 1px), 
                      linear-gradient(90deg, rgba(0, 0, 0, 0.04) 1px, transparent 1px);
    background-size: 50px 50px;
    z-index: 0;
}

/* 添加渐变叠加层 */
.procurement-section::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(135deg, 
                rgba(195, 13, 35, 0.05) 0%, 
                rgba(0, 102, 204, 0.07) 100%);
    z-index: 0;
}

/* 添加光效 */
.procurement-section .container::before {
    content: '';
    position: absolute;
    top: -150px;
    right: -150px;
    width: 400px;
    height: 400px;
    background: radial-gradient(circle, rgba(195, 13, 35, 0.08) 0%, transparent 70%);
    z-index: -1;
}

/* 添加底部装饰 */
.procurement-section .container::after {
    content: '';
    position: absolute;
    bottom: -100px;
    left: -100px;
    width: 300px;
    height: 300px;
    background: radial-gradient(circle, rgba(195, 13, 35, 0.05) 0%, transparent 70%);
    z-index: -1;
}

/* 图片展示区背景 */
.gallery-section {
    background: #ffffff;
    position: relative;
    overflow: hidden;
}

.gallery-section::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(135deg, rgba(0, 102, 204, 0.03) 0%, rgba(0, 102, 204, 0.01) 100%);
    z-index: 0;
}

/* 页脚模块背景 */
.footer-section {
    background: #1a365d;
    position: relative;
    overflow: hidden;
}

.footer-section::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-image: url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%23ffffff' fill-opacity='0.03'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
    z-index: 0;
}

/* 确保内容在背景上方显示 */
.container {
    position: relative;
    z-index: 2;
}

/* 修改文本颜色 */
.about-intro {
    color: #333333;
    font-size: 16px;
    line-height: 1.8;
    margin-bottom: 20px;
}

.about-highlight {
    color: #333333;
    font-size: 16px;
    line-height: 1.6;
    margin-bottom: 30px;
}

.about-highlight strong {
    color: #2e7d32;
    font-size: 24px;
    font-weight: 700;
}

.about-button {
    margin-bottom: 40px;
}

/* 修改按钮样式 */
.btn-more {
    display: inline-block;
    background: #ff6b35;
    color: #ffffff;
    padding: 8px 20px;
    border-radius: 4px;
    font-size: 14px;
    font-weight: 500;
    text-decoration: none;
    transition: all 0.3s ease;
}

.btn-more:hover {
    background: #e55a2b;
    transform: translateY(-2px);
    color: #fff;
}

/* 添加标题下划线 */
.section-title {
    position: relative;
    padding-bottom: 15px;
    margin-bottom: 30px;
    color: #333;
    font-size: 32px;
    font-weight: 700;
}

.section-title::after {
    content: '';
    position: absolute;
    bottom: 0;
    /* left: 0; */
    width: 60px;
    height: 3px;
    background: #2e7d32;
}

.section-subtitle {
    color: #666;
    font-size: 18px;
    font-weight: 400;
}

/* 添加右侧图片边框 */
.about-image-container {
    position: relative;
    padding: 20px;
    display: flex;
    justify-content: flex-end;
    align-items: center;
    height: 100%;
}

.about-promo-image {
    width: 100%;
    max-width: 700px;
    height: auto;
    border-radius: 8px;
    box-shadow: 0 15px 40px rgba(0, 0, 0, 0.15);
    transition: all 0.3s ease;
    object-fit: cover;
}

.about-image-container::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100px;
    height: 100px;
    border-top: 3px solid #2e7d32;
    border-left: 3px solid #2e7d32;
    opacity: 0.5;
    z-index: -1;
}

.about-image-container::after {
    content: '';
    position: absolute;
    bottom: 0;
    right: 0;
    width: 100px;
    height: 100px;
    border-bottom: 3px solid #2e7d32;
    border-right: 3px solid #2e7d32;
    opacity: 0.5;
    z-index: -1;
}

/* 播放按钮样式 */
.about-play-btn {
    width: 80px;
    height: 80px;
    background: rgba(0, 0, 0, 0.6);
    border-radius: 50%;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 10;
    transition: all 0.3s ease;
}

.about-play-btn::before {
    content: '';
    display: block;
    width: 0;
    height: 0;
    border-left: 30px solid #fff;
    border-top: 18px solid transparent;
    border-bottom: 18px solid transparent;
    margin-left: 8px;
}

.about-play-btn:hover {
    background: rgba(0, 0, 0, 0.8);
    transform: translate(-50%, -50%) scale(1.1);
    box-shadow: 0 0 30px rgba(255, 255, 255, 0.3);
}

/* 关于我们视频弹窗样式 */
.about-video-modal {
    display: none;
    position: fixed;
    z-index: 9999;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.85);
    justify-content: center;
    align-items: center;
}

.about-video-modal.show {
    display: flex;
}

.about-video-modal-content {
    width: 80%;
    max-width: 1000px;
    background: #000;
    border-radius: 8px;
    overflow: hidden;
    position: relative;
}

.about-video-modal-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 15px 20px;
    background: rgba(0, 0, 0, 0.8);
    color: #fff;
}

.about-video-modal-header h3 {
    margin: 0;
    font-size: 18px;
    font-weight: 500;
}

.about-video-close {
    font-size: 28px;
    color: #fff;
    cursor: pointer;
    transition: all 0.3s ease;
}

.about-video-close:hover {
    color: #ff6b35;
}

.about-video-container {
    padding: 0;
}

/* 响应式调整 */
@media (max-width: 992px) {
    .about-body {
        grid-template-columns: 1fr;
    }

    .industry-position {
        flex-direction: column;
    }

    .stats-overlay {
        flex-direction: column;
        gap: 20px;
    }

    .about-image-container::before,
    .about-image-container::after {
        width: 60px;
        height: 60px;
    }
}

/* 集团业务模块背景样式 - 新设计 */
.news-section {
    background: linear-gradient(135deg, #0d47a1 0%, #1976d2 50%, #42a5f5 100%);
    position: relative;
    overflow: hidden;
    padding: 80px 0;
    color: #fff;
    background-image: url('../images2/高速项目/滨德高速跨京台高速互通立交工程.jpg');
    background-size: cover;
    background-position: center;
}

.news-section::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(135deg, rgba(13, 71, 161, 0.85) 0%, rgba(25, 118, 210, 0.85) 50%, rgba(66, 165, 245, 0.85) 100%);
    z-index: 0;
}

.news-section .container {
    position: relative;
    z-index: 1;
}

/* 业务卡片容器 */
.business-cards-wrapper {
    display: flex;
    justify-content: space-between;
    margin-top: 60px;
    position: relative;
    z-index: 2;
}

/* 业务卡片样式 */
.business-card {
    flex: 1;
    position: relative;
    padding: 40px 30px;
    color: #fff;
    transition: all 0.3s ease;
    overflow: hidden;
    background-color: rgba(255, 255, 255, 0.1);
    border-right: 1px solid rgba(255, 255, 255, 0.1);
}

.business-card:last-child {
    border-right: none;
}

.business-card.active {
    background-color: #c30d23;
}

.business-card:hover {
    background-color: rgba(255, 255, 255, 0.2);
    transform: translateY(-5px);
}

.business-card.active:hover {
    background-color: #e61e37;
}

/* 业务卡片编号 */
.business-card-number {
    position: absolute;
    top: 10px;
    left: 10px;
    font-size: 120px;
    font-weight: 700;
    opacity: 0.15;
    color: #fff;
    line-height: 1;
    z-index: 0;
}

/* 业务卡片图标 */
.business-card-icon {
    position: relative;
    z-index: 1;
    margin-bottom: 20px;
    display: flex;
    align-items: center;
}

.business-icon {
    width: 40px;
    height: 40px;
    display: block;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
}

.road-icon {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23ffffff' viewBox='0 0 24 24'%3E%3Cpath d='M18.1,4.8C18,4.3,17.6,4,17.1,4H6.9C6.4,4,6,4.3,5.9,4.8L3.1,18.8C3,19.4,3.5,20,4.1,20c0.5,0,0.9-0.3,1-0.8L7.1,6h9.7 l2.1,13.2c0.1,0.5,0.5,0.8,1,0.8c0.6,0,1.1-0.6,1-1.2L18.1,4.8z M13,8v2h-2V8H13z M13,12v2h-2v-2H13z M13,16v2h-2v-2H13z'/%3E%3C/svg%3E");
}

.env-icon {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23ffffff' viewBox='0 0 24 24'%3E%3Cpath d='M12,3c-4.97,0-9,4.03-9,9s4.03,9,9,9s9-4.03,9-9S16.97,3,12,3z M12,19c-3.86,0-7-3.14-7-7s3.14-7,7-7s7,3.14,7,7 S15.86,19,12,19z M15,12c0,1.66-1.34,3-3,3s-3-1.34-3-3s1.34-3,3-3S15,10.34,15,12z'/%3E%3C/svg%3E");
}

.city-icon {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23ffffff' viewBox='0 0 24 24'%3E%3Cpath d='M15,11V5l-3-3L9,5v2H3v14h18V11H15z M7,19H5v-2h2V19z M7,15H5v-2h2V15z M7,11H5V9h2V11z M13,19h-2v-2h2V19z M13,15h-2v-2 h2V15z M13,11h-2V9h2V11z M13,7h-2V5h2V7z M19,19h-2v-2h2V19z M19,15h-2v-2h2V15z'/%3E%3C/svg%3E");
}

.finance-icon {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23ffffff' viewBox='0 0 24 24'%3E%3Cpath d='M11.8,10.9c-2.27-0.59-3-1.2-3-2.15c0-1.09,1.01-1.85,2.7-1.85c1.78,0,2.44,0.85,2.5,2.1h2.21 c-0.07-1.72-1.12-3.3-3.21-3.81V3h-3v2.16c-1.94,0.42-3.5,1.68-3.5,3.61c0,2.31,1.91,3.46,4.7,4.13c2.5,0.6,3,1.48,3,2.41 c0,0.69-0.49,1.79-2.7,1.79c-2.06,0-2.87-0.92-2.98-2.1H6.32c0.12,2.19,1.76,3.42,3.68,3.83V21h3v-2.15 c1.95-0.37,3.5-1.5,3.5-3.55C16.5,12.46,14.07,11.49,11.8,10.9z'/%3E%3C/svg%3E");
}

/* 业务卡片标题 */
.business-card-title {
    font-size: 20px;
    font-weight: 600;
    margin-bottom: 10px;
    position: relative;
    z-index: 1;
}

/* 业务卡片描述 */
.business-card-desc {
    font-size: 14px;
    line-height: 1.6;
    opacity: 0.8;
    position: relative;
    z-index: 1;
}

/* 标题样式 */
.news-section .section-title {
    color: #fff;
    font-size: 36px;
    font-weight: 700;
    margin-bottom: 15px;
    position: relative;
}

.news-section .section-subtitle {
    color: rgba(255, 255, 255, 0.8);
    font-size: 16px;
    font-weight: 400;
    max-width: 600px;
}

/* 响应式调整 */
@media (max-width: 992px) {
    .business-cards-wrapper {
        flex-wrap: wrap;
    }

    .business-card {
        flex: 0 0 50%;
        margin-bottom: 20px;
        border-right: none;
        border-bottom: 1px solid rgba(255, 255, 255, 0.1);
    }
}

@media (max-width: 576px) {
    .business-card {
        flex: 0 0 100%;
    }
}

/* 新闻中心模块样式 */
.news-center-section {
    background: #f5f7fa;
    padding: 80px 0;
    position: relative;
}

/* 新闻项目悬停效果 */
.news-item {
    transition: all 0.3s ease;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
}

.news-item:hover {
    transform: translateY(-3px);
    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.15);
}

/* 左侧大图悬停效果 */
.news-featured-img {
    transition: all 0.3s ease;
}

.news-featured-img:hover {
    box-shadow: 0 15px 40px rgba(0, 0, 0, 0.25);
}

/* 标签按钮悬停效果 */
.news-tab {
    transition: all 0.3s ease;
}

.news-tab:hover {
    transform: translateY(-2px);
}

.news-tab.active {
    transform: translateY(-2px);
}