/* --- 1. 基础重置 --- */
* { box-sizing: border-box; margin: 0; padding: 0; }
body { 
    font-family: "PingFang SC", "Microsoft YaHei", sans-serif; 
    background: #ffffff; /* 强制底色全白 */
    color: #222; /* 调深文字，提升白底上的可读性 */
    line-height: 1.6; 
    -webkit-font-smoothing: antialiased;
}
.container { max-width: 1240px; margin: 0 auto; padding: 0 40px; }
a { text-decoration: none; transition: 0.3s; }

/* 基础板块包装器：全白 */
.section-wrapper, .section, main { padding: 120px 0; background-color: #ffffff !important; width: 100%; }
/* 移除灰底类名 */
.bg-light, .bg-alt { background-color: #ffffff !important; }

/* --- 2. 顶部导航 (精修版) --- */
header { 
    position: fixed; top: 0; width: 100%; z-index: 1000; 
    background: rgba(255,255,255,0.98); backdrop-filter: blur(10px);
    border-bottom: 1px solid #f5f5f5; padding: 15px 0; 
}
.nav { display: flex; justify-content: space-between; align-items: center; }

/* 左侧 Logo 区 */
.logo { 
    font-weight: 600; color: #1a1a1a; 
    border-left: 3px solid #c6a300; 
    padding-left: 15px; 
    font-size: 1.15rem; 
    letter-spacing: 1px; 
}

/* 右侧联系区：去掉框，改用服务专线文字 */
.header-right {
    display: flex;
    align-items: center;
}

.hotline-text {
    font-size: 0.9rem;
    color: #c6a300; /* 哑金色文字 */
    letter-spacing: 1px;
    font-weight: 500;
    /* 加入一根浅色的分割线，增加精致感 */
    border-left: 1px solid #e0e0e0; 
    padding-left: 20px;
    margin-left: 20px;
    margin-right: 20px;
}

/* 兼容之前的 contact-btn 类名，万一您还没改 HTML，给它一个极简样式 */
.contact-btn { 
    color: #c6a300 !important; 
    font-size: 0.9rem; 
    font-weight: 500;
    border: none; /* 去掉框 */
    padding: 0;
}

/* --- 3. Hero 屏 --- */
.hero { height: 100vh; background: #1a1a1a url('../images/hero-bg.jpg') center/cover no-repeat; display: flex; align-items: center; justify-content: center; }
.slogan-box { padding: 40px 60px; background: rgba(0,0,0,0.25); border: 1px solid rgba(255,255,255,0.1); text-align: center; }
.slogan-text { color: #fff; font-size: 2.8rem; letter-spacing: 15px; font-weight: 300; margin: 0; text-shadow: 0 2px 10px rgba(0,0,0,0.3);}

/* =========================================
   第四板块：六大核心业务领域 (全量精修)
   特点：纯白底色、哑金定宽下划线、极简交互
   ========================================= */

/* 1. 业务板块容器 - 确保全白 */
.section.core-expertise {
    padding: 120px 0;
    background-color: #ffffff !important;
}

/* 2. 板块标题与副标题 */
.section-title {
    text-align: center;
    margin-bottom: 80px;
    font-size: 2rem;
    letter-spacing: 6px;
    color: #1a1a1a;
}
.section-title span {
    display: block;
    font-size: 0.85rem;
    color: #c6a300; /* 哑金副标题 */
    margin-bottom: 15px;
    font-weight: bold;
    letter-spacing: 4px;
}

/* 3. 六宫格网格布局 */
.grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr); /* 三列布局 */
    gap: 40px; /* 卡片间距 */
}

/* 4. 单个业务卡片样式 */
.card {
    padding: 60px 40px;
    background: #ffffff;
    border: 1px solid #f0f0f0; /* 平时只有极淡的边框 */
    transition: all 0.5s cubic-bezier(0.165, 0.84, 0.44, 1);
    display: flex;
    flex-direction: column;
}

/* 5. 卡片标题：核心金线逻辑 */
.card h3 {
    font-size: 1.3rem;
    color: #1a1a1a;
    margin-bottom: 35px; /* 给金线留出呼吸空间 */
    letter-spacing: 1px;
    position: relative;
    padding-bottom: 18px; /* 文字与线的距离 */
    font-weight: 600;
}

/* 关键：标题下方定宽 45px 金线 */
.card h3::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 45px;      /* 线条固定宽度，不随字数变 */
    height: 3px;      /* 线条厚度 */
    background: #c6a300; /* 哑光金 */
    transition: width 0.4s ease; /* 鼠标指上去时的过渡动效 */
}

/* 6. 卡片段落文字 - 纯净深灰 */
.card p {
    font-size: 0.95rem;
    color: #666;
    line-height: 1.8;
    letter-spacing: 0.5px;
    margin: 0;
}

/* 7. 鼠标悬停灵动交互 */
.card:hover {
    transform: translateY(-10px); /* 卡片上浮 */
    border-color: rgba(198, 163, 0, 0.3); /* 边框微微显出金边 */
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.05); /* 柔和阴影 */
}

/* 悬停时金线微调：增加一点点长度，体现灵动感 */
.card:hover h3::after {
    width: 65px; 
}

/* 8. 响应式适配：手机端变为一列 */
@media (max-width: 992px) {
    .grid {
        grid-template-columns: 1fr;
        gap: 20px;
    }
    .card {
        padding: 40px 30px;
    }
}

/* --- 5. 执业资质 (彻底去框化+关键词) --- */
.cert-focus-box { display: flex; align-items: center; gap: 70px; background: #ffffff; padding: 60px; border: none; } /* 彻底移除灰框和灰底 */
.cert-image { flex: 0 0 45%; }
.cert-image img { width: 100%; max-width: 480px; border: none; box-shadow: 0 10px 30px rgba(0,0,0,0.03); } /* 移除白色厚边框，只留极淡阴影 */
.cert-text { flex: 1; text-align: left; }
.cert-tag { color: #c6a300; font-weight: bold; font-size: 0.85rem; margin-bottom: 12px; display: block; }
.cert-divider { width: 4px; height: 45px; background: #c6a300; margin-bottom: 30px; }
.cert-detail-list { list-style: none; }
.cert-detail-list li { margin-bottom: 18px; color: #444; padding-left: 20px; position: relative; font-size: 1rem; }
.cert-detail-list li::before { content: ""; position: absolute; left: 0; top: 10px; width: 6px; height: 6px; background: #c6a300; border-radius: 50%; }

/* --- 6. 数字化体系 (01-03哑光金+图标悬停灵动+全色标签) --- */
.process-section { background: #ffffff; padding: 100px 0; position: relative; }
.process-grid { display: flex; gap: 30px; justify-content: space-between; max-width: 1200px; margin: 0 auto; }
.process-item {
    flex: 1; position: relative; padding: 60px 30px;
    background: #fff; border: 1px solid #f2f2f2; border-radius: 4px;
    transition: 0.4s; overflow: visible; 
}
.process-icon-box {
    position: absolute; top: 15px; right: 15px;
    width: 90px; height: 90px; z-index: 1;
    opacity: 0.12; pointer-events: none;
    transition: all 0.5s cubic-bezier(0.165, 0.84, 0.44, 1); /* 图标灵动过渡 */
}
.process-icon { width: 100%; height: 100%; object-fit: contain; transition: all 0.5s; }

/* 数字（01-03）：哑光金化 */
.process-num { 
    font-size: 3.5rem; font-weight: 900; color: rgba(198, 163, 0, 0.12); /* 哑光金 */
    position: absolute; top: 5px; left: 20px;
    font-family: 'Arial Black', sans-serif; z-index: 2;
}
.process-item h4 { position: relative; z-index: 10; font-size: 1.25rem; margin-bottom: 15px; color: #222; }
.process-item p { position: relative; z-index: 10; font-size: 0.95rem; color: #666; line-height: 1.8; }

/* 技术标签（清洗速度等）：全色块铺满 */
.tech-tag-group { position: relative; z-index: 10; margin-top: 25px; }
.tech-stat { 
    display: inline-block; font-size: 11px; 
    color: #ffffff !important; /* 白色字体 */
    background: #c6a300; /* 全色块铺满哑光金 */
    padding: 6px 14px; /* 增加内边距 */
    border-radius: 2px; /* 微圆角 */
    letter-spacing: 0.5px;
}

/* --- 数字化体系悬停效果：图标灵动 --- */
.process-item:hover {
    transform: translateY(-5px);
    box-shadow: 0 10px 30px rgba(0,0,0,0.05);
}
.process-item:hover .process-icon-box {
    opacity: 0.25; /* 增加透明度 */
}
.process-item:hover .process-icon {
    transform: scale(1.1) translate(-5%, -5%); /* 放大并微移 */
}
.process-item:hover .tech-stat {
    box-shadow: 0 4px 10px rgba(198, 163, 0, 0.2); /* 标签增加阴影 */
}

/* --- 7. 精英专家团队 --- */
/* --- 专家团队：精致收缩版 --- */
.expert-item { 
    display: flex; 
    gap: 60px;          /* 间距稍微收紧 */
    margin-bottom: 80px; 
    align-items: center; /* 垂直居中，比靠上对齐更稳重 */
}
.expert-item.reverse { flex-direction: row-reverse; }

.expert-photo { 
    flex: 0 0 280px;    /* 核心修改：宽度从350收缩至280 */
    height: 360px;      /* 高度同步收缩 */
    border-radius: 8px; /* 圆角增加亲和力 */
    overflow: hidden;
    box-shadow: 0 15px 35px rgba(0,0,0,0.1); /* 增加立体感，不显呆板 */
}
.expert-photo img { 
    width: 100%; 
    height: 100%; 
    object-fit: cover;  /* 确保照片不拉伸变形 */
}

.expert-text { flex: 1; }
.expert-tag { 
    color: #c6a300; 
    border: 1px solid #c6a300; 
    padding: 2px 10px; 
    font-size: 12px; 
    margin-bottom: 15px; 
    display: inline-block; 
}
.expert-bio { 
    border-left: 3px solid #c6a300; 
    padding-left: 25px; 
    margin-top: 25px; 
    color: #444; 
    line-height: 1.8;   /* 稍微压缩行高，让文字显得精干 */
    text-align: justify;
}
/* 第八板块：数字化专业内参 - 呼吸感优化版 */
/* 整个内参板块：增加上下空气感 */
.insight-section {
    padding: 80px 0;
    background-color: #ffffff;
}

/* 核心容器：控制内容不贴边，向中间聚拢 */
.insight-container {
    max-width: 1200px; /* 限制最大宽度，不让卡片满屏幕跑 */
    margin: 0 auto;    /* 居中对齐 */
    padding: 0 40px;   /* 给左右留出固定的呼吸空隙，防止贴边 */
}

/* 网格布局：紧致排列 */
.insight-grid {
    display: grid;
    /* 自动适应列数，保持每行卡片宽度合理 */
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 30px;        /* 缩小间距，让卡片之间更紧凑 */
    margin-top: 40px;
}

/* 卡片样式：调薄、去重 */
.insight-card {
    background: #ffffff;
    border: 1px solid #f0f0f0;
    transition: all 0.4s ease;
    display: flex;
    flex-direction: column;
}

.insight-thumb {
    height: 3px;
    background: #c6a300;
}

.insight-content {
    padding: 30px;
    flex-grow: 1;
    display: flex;
    flex-direction: column;
}

.insight-tag {
    font-size: 11px;
    color: #c6a300;
    margin-bottom: 15px;
}

.insight-content h4 {
    font-size: 1.1rem;
    color: #1a1a1a;
    margin-bottom: 12px;
    line-height: 1.4;
}

.insight-content p {
    font-size: 0.9rem;
    color: #777;
    line-height: 1.6;
    margin-bottom: 20px;
}

.insight-content::after {
    content: "READ REPORT →";
    font-size: 10px;
    font-weight: bold;
    color: #c6a300;
    margin-top: auto;
}

/* 悬停微动 */
.insight-card:hover {
    transform: translateY(-5px);
    border-color: #c6a300;
}

/* 移动端适配：保证手机不贴边 */
@media (max-width: 768px) {
    .insight-container { padding: 0 20px; }
    .insight-grid { grid-template-columns: 1fr; }
}
/* --- 9. 精致页脚 (沉底黑金精修版) --- */
/* --- 重新设计的商务版大底座 --- */
.main-footer {
    background-color: #1a1a1a; /* 深灰黑色，更具权威感 */
    color: rgba(255, 255, 255, 0.8);
    padding: 80px 0 30px 0; /* 增加上下留白，不再显得局促 */
    font-size: 14px;
    line-height: 1.6;
}

/* 页脚上部网格 */
.footer-top {
    display: grid;
    grid-template-columns: 1.5fr 1fr 1.5fr 1fr; /* 四列不等宽分布 */
    gap: 60px;
    margin-bottom: 60px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08); /* 淡淡的分割线 */
    padding-bottom: 50px;
}

.footer-col h4 {
    color: #fff;
    font-size: 16px;
    margin-bottom: 25px;
    font-weight: 600;
    position: relative;
}

/* 标题下方的小金线 */
.footer-col h4::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: -10px;
    width: 30px;
    height: 2px;
    background-color: #c6a300;
}

/* 品牌列 */
.footer-logo {
    color: #fff;
    font-size: 1.4rem;
    font-weight: 700;
    margin-bottom: 10px;
}
.footer-slogan {
    color: #c6a300; /* 哑金标语 */
    font-weight: bold;
    letter-spacing: 2px;
    margin-bottom: 20px;
}
.footer-desc {
    font-size: 13px;
    color: rgba(255, 255, 255, 0.5);
    text-align: justify;
}

/* 链接列 */
.links-col ul {
    list-style: none;
    padding: 0;
}
.links-col ul li {
    margin-bottom: 12px;
}
.links-col ul li a {
    color: rgba(255, 255, 255, 0.6);
    transition: 0.3s;
}
.links-col ul li a:hover {
    color: #c6a300;
    padding-left: 5px;
}

/* 联系列 */
.contact-item {
    margin-bottom: 15px;
}
.contact-item .label {
    display: block;
    font-size: 12px;
    color: rgba(255, 255, 255, 0.4);
}
.contact-item .value {
    color: #fff;
    font-size: 14px;
}
.contact-item .phone {
    font-size: 18px;
    color: #c6a300;
    font-weight: bold;
}

/* 二维码列 */
.qr-box {
    text-align: left;
}
.qr-box img {
    width: 100px;
    height: 100px;
    padding: 5px;
    background: #fff;
    border-radius: 4px;
    margin-bottom: 10px;
}
.qr-box p {
    font-size: 12px;
    color: rgba(255, 255, 255, 0.5);
}

/* 页脚底部版权区 */
.footer-bottom {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 12px;
    color: rgba(255, 255, 255, 0.3);
}
.footer-bottom a {
    color: rgba(255, 255, 255, 0.3);
}
.footer-bottom a:hover {
    color: #c6a300;
}
.footer-bottom .divider {
    margin: 0 10px;
}

/* 移动端适配 */
@media (max-width: 992px) {
    .footer-top {
        grid-template-columns: 1fr 1fr;
        gap: 40px;
    }
}
@media (max-width: 576px) {
    .footer-top {
        grid-template-columns: 1fr;
    }
    .footer-bottom {
        flex-direction: column;
        gap: 15px;
        text-align: center;
    }
}
/* --- 10. 响应式适配 --- */
@media (max-width: 992px) {
    .grid, .process-grid, .insight-grid, .cert-focus-box { grid-template-columns: 1fr; gap: 30px; }
    .expert-item, .expert-item.reverse { flex-direction: column; text-align: left; gap: 30px; }
    .expert-photo { width: 100%; max-width: 400px; height: 350px; }
    .expert-bio { border-left: none; padding-left: 0; padding-top: 20px; border-top: 3px solid #c6a300; }
    .footer-content { flex-direction: column; gap: 20px; text-align: center; }
    .logo { border-left: none; border-bottom: 2px solid #c6a300; padding-left: 0; padding-bottom: 5px; }
}
/* 悬浮组件容器 */
.floating-contact {
    position: fixed;
    right: 30px;
    bottom: 50px;
    z-index: 999;
    display: flex;
    flex-direction: column;
    gap: 15px;
}

/* 每一个功能节点 */
.contact-node {
    position: relative;
    width: 50px;
    height: 50px;
    cursor: pointer;
}

/* 图标圆形底座 */
.contact-icon {
    width: 100%;
    height: 100%;
    background-color: #ffffff;
    border: 1px solid #e0e0e0;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 4px 12px rgba(0,0,0,0.08);
    transition: all 0.3s ease;
}

.contact-icon span {
    font-size: 10px;
    color: #c6a300;
    font-weight: bold;
}

/* 悬停效果：背景变色，文字变白 */
.contact-node:hover .contact-icon {
    background-color: #c6a300;
    border-color: #c6a300;
    transform: translateY(-3px);
}

.contact-node:hover .contact-icon span {
    color: #ffffff;
}

/* 微信二维码弹出层 */
.contact-popup {
    position: absolute;
    right: 70px;
    bottom: 0;
    width: 160px;
    background: #ffffff;
    padding: 15px;
    border: 1px solid #eee;
    box-shadow: 0 10px 30px rgba(0,0,0,0.1);
    opacity: 0;
    visibility: hidden;
    transition: all 0.3s ease;
    text-align: center;
    border-radius: 4px;
}

.contact-popup img {
    width: 130px;
    height: 130px;
    margin-bottom: 10px;
}

.contact-popup p {
    font-size: 12px;
    color: #666;
    margin: 0;
}

/* 悬停显示弹出层 */
.contact-node:hover .contact-popup {
    opacity: 1;
    visibility: visible;
    right: 60px; /* 轻轻滑入效果 */
}

/* 特殊：手机端隐藏一部分，或者调整大小 */
@media (max-width: 768px) {
    .floating-contact {
        right: 15px;
        bottom: 30px;
    }
    .contact-node {
        width: 45px;
        height: 45px;
    }
}
/* --- 文章列表页专用样式 --- */
.archive-container {
    padding: 100px 0;
    max-width: 900px;
    margin: 0 auto;
    font-family: 'PingFang SC', sans-serif;
}

.archive-title {
    margin-bottom: 10px;
    color: #222;
    font-size: 28px;
    letter-spacing: 1px;
}

.gold-line {
    width: 60px;
    height: 4px;
    background: #c6a300;
    margin-bottom: 50px;
}

.archive-list {
    list-style: none;
    padding: 0;
}

/* 这样定义后，您以后复制 <li> 就变简单了 */
.archive-list li {
    border-bottom: 1px solid #eee;
    padding: 15px 0;
    display: flex;
    align-items: center;
}

.archive-list li .num {
    color: #c6a300;
    margin-right: 15px;
    font-weight: bold;
    font-size: 14px;
}

.archive-list li a {
    text-decoration: none;
    color: #444;
    font-size: 16px;
    transition: 0.3s;
}

.archive-list li a:hover {
    color: #c6a300;
}
/* --- 第三级：文章详情页样式 --- */
.article-page {
    max-width: 850px;
    margin: 80px auto;
    padding: 0 20px;
    font-family: "Microsoft YaHei", sans-serif;
    line-height: 1.8;
    color: #333;
}

.article-header h1 {
    font-size: 32px;
    color: #222;
    margin-bottom: 20px;
}

.article-body {
    font-size: 17px;
    text-align: justify;
}

.article-body h2 {
    color: #c6a300;
    border-left: 4px solid #c6a300;
    padding-left: 15px;
    margin: 40px 0 20px;
}

/* 返回上一级的链接样式 */
.back-link {
    display: inline-block;
    margin-top: 50px;
    padding-top: 20px;
    border-top: 1px solid #eee;
    width: 100%;
}

.back-link a {
    color: #c6a300;
    text-decoration: none;
    font-weight: bold;
}

.back-link a:hover {
    text-decoration: underline;
}
/* =============================================
   最终整合版：手机端全站自适应（直接替换末尾重复部分）
   ============================================= */
@media screen and (max-width: 768px) {
    /* 1. 全局容器缩减间距 */
    .container, .section { padding: 40px 15px !important; }

    /* 2. 证书与鉴证板块（解决您说的没变化问题） */
    .cert-focus-box { 
        display: block !important; 
        padding: 20px !important;
        text-align: center !important;
    }
    .cert-image { 
        width: 100% !important; 
        max-width: 320px; 
        margin: 0 auto 30px auto !important; 
        flex: none !important; /* 强制取消电脑端的比例 */
    }
    .cert-text { 
        width: 100% !important; 
        padding: 0 !important; 
        flex: none !important;
    }
    .cert-divider { margin: 20px auto !important; } /* 分割线居中 */
    .cert-detail-list { text-align: left; display: inline-block; }

    /* 3. 数字化体系（自研Python等） */
    .process-grid { display: block !important; }
    .process-item { 
        width: 100% !important; 
        border-right: none !important; 
        border-bottom: 1px dashed #d4af37; 
        margin-bottom: 20px; 
        padding: 40px 20px !important;
    }

    /* 4. 核心业务（六宫格）改单列 */
    .grid { grid-template-columns: 1fr !important; gap: 20px !important; }

    /* 5. 专家团队改上下结构 */
    .expert-item { flex-direction: column !important; gap: 30px !important; }
    .expert-item.reverse { flex-direction: column !important; }
    .expert-photo { width: 200px !important; height: 260px !important; margin: 0 auto !important; }
    .expert-bio { border-left: none !important; border-top: 3px solid #c6a300; padding: 20px 0 0 0 !important; }

    /* 6. 顶部标语缩小，防止溢出 */
    .slogan-text { font-size: 1.6rem !important; letter-spacing: 5px !important; padding: 0 10px; }
}