/* ===== 创盟企服集团 qifujituan.com - 视觉增强层 (Enhancement) ===== */
/* 积木式叠加层：在 style.css 之后加载，仅改视觉不改结构 */
/* 配色对齐品牌蓝 #1a3c6e + 金色 #c8a45c，与 dizhituoguan.com 统一 */
/* 设计参考：cm12315.com Stripe Design System + dizhituoguan 深蓝金调 */

/* ========================================
   1. 配色系统覆盖 — 从科技蓝绿改为商务深蓝金
   ======================================== */

:root {
    /* 品牌主色：深蓝（商务、信任、稳重） */
    --primary: #1a3c6e;
    --primary-dark: #0d2b52;
    --primary-light: #2d5a9e;
    --primary-50: #f0f4fa;
    --primary-100: #d9e3f2;
    --primary-200: #b3c9e5;
    
    /* 强调色：金色（高端、活力、CTA） */
    --accent: #c8a45c;
    --accent-dark: #a8853f;
    --accent-light: #ddb878;
    
    /* 保持中性色不变 */
}

/* ========================================
   2. Hero 区域优化 — 深蓝金调，弱化计算器
   ======================================== */

.hero {
    background: linear-gradient(135deg, #0d2b52 0%, #1a3c6e 40%, #0a1f3e 70%, #152d4f 100%) !important;
}

.hero::before {
    background: radial-gradient(circle, rgba(200,164,92,0.12) 0%, transparent 70%) !important;
}

.hero::after {
    background: radial-gradient(circle, rgba(45,90,158,0.1) 0%, transparent 70%) !important;
}

.hero-bg {
    background-image:
        radial-gradient(circle at 20% 80%, rgba(200,164,92,0.06) 0%, transparent 50%),
        radial-gradient(circle at 80% 20%, rgba(45,90,158,0.08) 0%, transparent 50%) !important;
}

/* Hero 标题高亮色改为金色 */
.hero h1 .highlight {
    background: linear-gradient(135deg, #c8a45c, #ddb878) !important;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    background-clip: text !important;
}

/* Hero badge 改为金色调 */
.hero-badge {
    background: rgba(200,164,92,0.15) !important;
    border: 1px solid rgba(200,164,92,0.3) !important;
    color: #ddb878 !important;
}

.badge-dot {
    background: #c8a45c !important;
}

/* Hero 信任数字改金色 */
.hero-trust .trust-number {
    color: #c8a45c !important;
}

/* Hero 计算器卡片：半透明毛玻璃 */
.calculator-card {
    background: rgba(255,255,255,0.08) !important;
    backdrop-filter: blur(12px) !important;
    -webkit-backdrop-filter: blur(12px) !important;
    border: 1px solid rgba(255,255,255,0.12) !important;
    border-radius: 16px !important;
}

.calculator-card h3,
.calculator-card p {
    color: #fff !important;
}

.calculator-card label {
    color: rgba(255,255,255,0.7) !important;
}

.calculator-card select,
.calculator-card input {
    background: rgba(255,255,255,0.95) !important;
    border: 1px solid rgba(255,255,255,0.2) !important;
}

.calculator-note {
    color: rgba(255,255,255,0.5) !important;
}

/* Hero 按钮主色改深蓝 */
.hero .btn-primary {
    background: #c8a45c !important;
    color: #0d2b52 !important;
    border: none !important;
    font-weight: 600 !important;
}

.hero .btn-primary:hover {
    background: #ddb878 !important;
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(200,164,92,0.3);
}

.hero .btn-outline {
    border: 1.5px solid rgba(255,255,255,0.4) !important;
    color: #fff !important;
    background: transparent !important;
}

.hero .btn-outline:hover {
    background: rgba(255,255,255,0.1) !important;
    border-color: rgba(255,255,255,0.6) !important;
}

/* ========================================
   3. 导航栏优化 — 深蓝底+金色hover
   ======================================== */

.top-bar {
    background: #0d2b52 !important;
    color: rgba(255,255,255,0.8) !important;
}

.top-bar a, .top-bar span {
    color: rgba(255,255,255,0.8) !important;
}

.header, .main-header {
    background: rgba(255,255,255,0.95) !important;
    backdrop-filter: blur(8px) !important;
    -webkit-backdrop-filter: blur(8px) !important;
    box-shadow: 0 1px 3px rgba(13,43,82,0.08) !important;
}

.nav-link {
    color: #334155 !important;
    font-weight: 500 !important;
}

.nav-link:hover {
    color: #1a3c6e !important;
}

.nav-cta {
    background: #c8a45c !important;
    color: #0d2b52 !important;
    font-weight: 600 !important;
}

.nav-cta:hover {
    background: #ddb878 !important;
    box-shadow: 0 2px 8px rgba(200,164,92,0.3);
}

/* HOT 标签改金色 */
.hot-tag {
    background: #c8a45c !important;
    color: #0d2b52 !important;
}

/* ========================================
   4. Section 节奏 — 交替深浅背景制造呼吸感
   ======================================== */

/* 原始：hero(深)→adv(白)→services(灰)→why-us(白)→process(灰)→testi(白)→faq(灰)→news(白)→cta(深) */
/* 优化：把 why-us 和 testimonials 改为深色，制造3段呼吸节奏 */

/* advantages-bar：保持白→灰过渡 */
.advantages-bar {
    background: linear-gradient(180deg, #ffffff 0%, #f0f4fa 100%) !important;
    border-bottom: 1px solid #d9e3f2 !important;
}

.advantage-icon {
    color: #1a3c6e !important;
}

/* services-section：浅蓝灰底 */
.services-section {
    background: #f0f4fa !important;
}

/* why-us-section：深蓝渐变背景（制造节奏感） */
.why-us-section {
    background: linear-gradient(135deg, #0d2b52 0%, #1a3c6e 50%, #0a1f3e 100%) !important;
    color: #fff !important;
    position: relative;
    overflow: hidden;
}

.why-us-section::before {
    content: '';
    position: absolute;
    inset: 0;
    background-image:
        radial-gradient(circle at 20% 50%, rgba(200,164,92,0.08) 0%, transparent 50%),
        radial-gradient(circle at 80% 30%, rgba(45,90,158,0.1) 0%, transparent 40%);
    pointer-events: none;
}

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

.why-us-section .section-title {
    color: #fff !important;
}

.why-us-section .section-title::after {
    background: #c8a45c !important;
}

.why-us-section .section-header p {
    color: rgba(255,255,255,0.7) !important;
}

.why-us-section .section-tag {
    color: #c8a45c !important;
}

/* why-us 卡片：半透明毛玻璃 */
.why-us-card {
    background: rgba(255,255,255,0.06) !important;
    backdrop-filter: blur(8px) !important;
    -webkit-backdrop-filter: blur(8px) !important;
    border: 1px solid rgba(255,255,255,0.1) !important;
    border-radius: 12px !important;
    transition: all 0.3s ease !important;
}

.why-us-card:hover {
    background: rgba(255,255,255,0.1) !important;
    border-color: rgba(200,164,92,0.3) !important;
    transform: translateY(-4px);
}

.why-us-card h3 {
    color: #fff !important;
}

.why-us-card p {
    color: rgba(255,255,255,0.75) !important;
}

.why-us-number {
    color: #c8a45c !important;
}

/* process-section：浅蓝灰底 */
.process {
    background: #f0f4fa !important;
}

/* testimonials：深蓝渐变背景 */
.testimonials {
    background: linear-gradient(135deg, #0a1f3e 0%, #152d4f 50%, #0d2b52 100%) !important;
    color: #fff !important;
    position: relative;
    overflow: hidden;
}

.testimonials::before {
    content: '';
    position: absolute;
    inset: 0;
    background-image:
        radial-gradient(circle at 30% 60%, rgba(200,164,92,0.06) 0%, transparent 50%),
        radial-gradient(circle at 70% 40%, rgba(45,90,158,0.08) 0%, transparent 40%);
    pointer-events: none;
}

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

.testimonials .section-title {
    color: #fff !important;
}

.testimonials .section-title::after {
    background: #c8a45c !important;
}

.testimonials .section-header p {
    color: rgba(255,255,255,0.7) !important;
}

.testimonials .section-tag {
    color: #c8a45c !important;
}

/* testimonial-card：半透明毛玻璃 */
.testimonial-card {
    background: rgba(255,255,255,0.06) !important;
    backdrop-filter: blur(8px) !important;
    -webkit-backdrop-filter: blur(8px) !important;
    border: 1px solid rgba(255,255,255,0.1) !important;
    border-radius: 12px !important;
}

.testimonial-card .testimonial-content {
    color: rgba(255,255,255,0.9) !important;
}

.testimonial-card .testimonial-stars {
    color: #c8a45c !important;
}

.testimonial-card .author-avatar {
    background: #c8a45c !important;
    color: #0d2b52 !important;
}

.testimonial-card .author-info strong {
    color: #fff !important;
}

.testimonial-card .author-info span {
    color: rgba(255,255,255,0.6) !important;
}

/* faq-section：浅蓝灰底 */
.faq {
    background: #f0f4fa !important;
}

/* news-section：白底 */
.news {
    background: #fff !important;
}

/* ========================================
   5. 卡片层次优化 — 服务卡片+新闻卡片
   ======================================== */

/* service-card：增加默认阴影+hover金色边框 */
.service-card {
    background: #fff !important;
    border: 2px solid transparent !important;
    border-radius: 12px !important;
    box-shadow: 0 1px 3px rgba(13,43,82,0.06) !important;
    transition: all 0.3s ease !important;
}

.service-card:hover {
    transform: translateY(-6px) !important;
    box-shadow: 0 12px 24px rgba(13,43,82,0.12) !important;
    border-color: #c8a45c !important;
}

.service-card.featured {
    background: linear-gradient(135deg, #1a3c6e 0%, #0d2b52 100%) !important;
    color: #fff !important;
}

.service-card.featured h3,
.service-card.featured p {
    color: #fff !important;
}

/* section-title 下划线改金色 */
.section-title::after {
    background: #c8a45c !important;
}

/* section-tag 改金色 */
.section-tag {
    color: #c8a45c !important;
}

/* news-card 优化 */
.news-card {
    background: #fff !important;
    border: 1px solid #e5edf5 !important;
    border-radius: 12px !important;
    box-shadow: 0 1px 3px rgba(13,43,82,0.04) !important;
    transition: all 0.3s ease !important;
    overflow: hidden;
}

.news-card:hover {
    transform: translateY(-4px) !important;
    box-shadow: 0 8px 16px rgba(13,43,82,0.1) !important;
    border-color: #c8a45c !important;
}

/* 新闻摘要左对齐(修复居中可读性) */
.news-card-body p {
    text-align: left !important;
}

.news-card-body h3 {
    text-align: left !important;
}

.news-card-body h3 a {
    text-align: left !important;
}

/* 新闻meta左对齐 */
.news-meta {
    justify-content: space-between !important;
}

.news-meta .meta-left {
    text-align: left !important;
}

/* ========================================
   6. 按钮系统统一 — 深蓝+金色
   ======================================== */

.btn-primary {
    background: #1a3c6e !important;
    color: #fff !important;
    border: none !important;
    font-weight: 500 !important;
}

.btn-primary:hover {
    background: #0d2b52 !important;
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(13,43,82,0.2);
}

.btn-outline {
    border: 1.5px solid #1a3c6e !important;
    color: #1a3c6e !important;
    background: transparent !important;
}

.btn-outline:hover {
    background: #1a3c6e !important;
    color: #fff !important;
}

/* CTA section 按钮保持白色 */
.cta .btn-white {
    background: #c8a45c !important;
    color: #0d2b52 !important;
    border: none !important;
    font-weight: 600 !important;
}

.cta .btn-white:hover {
    background: #ddb878 !important;
}

.cta .btn-outline-white {
    border: 1.5px solid rgba(255,255,255,0.5) !important;
    color: #fff !important;
}

.cta .btn-outline-white:hover {
    background: rgba(255,255,255,0.1) !important;
    border-color: #fff !important;
}

/* ========================================
   7. CTA section — 深蓝金调
   ======================================== */

.cta {
    background: linear-gradient(135deg, #0d2b52 0%, #1a3c6e 50%, #0a1f3e 100%) !important;
}

.cta-title {
    color: #fff !important;
}

.cta-subtitle {
    color: rgba(255,255,255,0.8) !important;
}

/* ========================================
   8. 悬浮按钮 — 金色
   ======================================== */

.floating-cta {
    background: #c8a45c !important;
    color: #0d2b52 !important;
}

.floating-btn {
    background: #1a3c6e !important;
    color: #fff !important;
}

.floating-btn:hover {
    background: #0d2b52 !important;
}

/* ========================================
   9. Process 步骤优化 — 金色编号
   ======================================== */

.process-step .step-number {
    background: linear-gradient(135deg, #c8a45c, #a8853f) !important;
    color: #0d2b52 !important;
    box-shadow: 0 4px 12px rgba(200,164,92,0.3) !important;
}

/* ========================================
   10. 链接和文字强调色
   ======================================== */

a {
    color: #1a3c6e;
}

a:hover {
    color: #c8a45c;
}

/* dropdown-menu hover 改金色底 */
.dropdown-menu a:hover {
    background: #f0f4fa !important;
    color: #1a3c6e !important;
}

/* ========================================
   13. Trust Bar 数字背书样式 (新增)
   ======================================== */

.advantages-bar {
    background: linear-gradient(180deg, #0d2b52 0%, #152d4f 100%) !important;
    border-bottom: 1px solid rgba(200,164,92,0.15) !important;
    padding: 2rem 0 !important;
}

.advantages-grid {
    display: grid !important;
    grid-template-columns: repeat(5, 1fr) !important;
    gap: 1rem !important;
}

.advantage-item {
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
}

.advantage-icon {
    width: 44px !important;
    height: 44px !important;
    background: rgba(200,164,92,0.15) !important;
    border: 1px solid rgba(200,164,92,0.25) !important;
    border-radius: 10px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex-shrink: 0 !important;
    color: #c8a45c !important;
}

.advantage-icon svg {
    width: 22px !important;
    height: 22px !important;
}

.advantage-content {
    display: flex !important;
    flex-direction: column !important;
    gap: 2px !important;
}

.advantage-number {
    font-size: 1.1rem !important;
    font-weight: 700 !important;
    color: #c8a45c !important;
    line-height: 1.2 !important;
}

.advantage-label {
    font-size: 0.78rem !important;
    color: rgba(255,255,255,0.65) !important;
    line-height: 1.2 !important;
}

/* 移动端 Trust Bar 适配 */
@media (max-width: 768px) {
    .advantages-grid {
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 1.5rem !important;
    }
    
    .advantage-item {
        justify-content: center !important;
    }
}

/* ========================================
   14. Hero 计算器视觉增强
   ======================================== */

.calculator-card {
    background: rgba(255,255,255,0.06) !important;
    backdrop-filter: blur(16px) !important;
    -webkit-backdrop-filter: blur(16px) !important;
    border: 1px solid rgba(200,164,92,0.2) !important;
    border-radius: 16px !important;
    padding: 28px !important;
    box-shadow: 0 20px 60px rgba(0,0,0,0.3), 0 0 0 1px rgba(255,255,255,0.05) inset !important;
}

.calculator-card h3 {
    color: #c8a45c !important;
    font-size: 1.25rem !important;
    font-weight: 600 !important;
}

.calculator-card > p {
    color: rgba(255,255,255,0.55) !important;
    margin-bottom: 20px !important;
}

.calculator-card .btn-primary {
    background: linear-gradient(135deg, #c8a45c, #a8853f) !important;
    color: #0d2b52 !important;
    font-weight: 600 !important;
    padding: 14px !important;
    border: none !important;
    box-shadow: 0 4px 12px rgba(200,164,92,0.25) !important;
}

.calculator-card .btn-primary:hover {
    transform: translateY(-1px) !important;
    box-shadow: 0 6px 16px rgba(200,164,92,0.35) !important;
}

.calculator-note {
    color: rgba(255,255,255,0.4) !important;
    font-size: 0.78rem !important;
    margin-top: 12px !important;
    text-align: center !important;
}

/* ========================================
   15. section-header 视觉增强
   ======================================== */

.section-header {
    text-align: center !important;
    margin-bottom: 3rem !important;
}

.section-tag {
    display: inline-block !important;
    background: rgba(200,164,92,0.1) !important;
    color: #c8a45c !important;
    padding: 4px 16px !important;
    border-radius: 20px !important;
    font-size: 0.82rem !important;
    font-weight: 500 !important;
    margin-bottom: 12px !important;
}

.section-title {
    font-weight: 600 !important;
    letter-spacing: -0.02em !important;
}

.section-header p {
    color: #64748b !important;
    font-size: 0.95rem !important;
}

/* 深色section内的section-header */
.why-us-section .section-header p,
.testimonials .section-header p {
    color: rgba(255,255,255,0.65) !important;
}

/* ========================================
   16. 服务卡片图标金色化
   ======================================== */

.service-card .service-icon,
.service-card .card-icon {
    background: rgba(200,164,92,0.1) !important;
    color: #c8a45c !important;
}

/* featured服务卡片改深蓝渐变 */
.service-card.featured {
    background: linear-gradient(135deg, #1a3c6e 0%, #0d2b52 100%) !important;
}

.service-card.featured .service-icon {
    background: rgba(200,164,92,0.2) !important;
    color: #c8a45c !important;
}

/* ========================================
   17. footer 深蓝底
   ======================================== */

.main-footer {
    background: #0a1f3e !important;
}

.footer-bottom {
    background: #0d2b52 !important;
}

.footer-brand .logo-img {
    filter: brightness(0.9) !important;
}

.footer-links a:hover,
.footer-contact a:hover {
    color: #c8a45c !important;
}

.footer-cert {
    color: #c8a45c !important;
}

/* ========================================
   12. 平滑过渡 — 全局动画
   ======================================== */

* {
    transition: background-color 0.3s ease, border-color 0.3s ease, color 0.2s ease;
}

.calculator-card select,
.calculator-card input[type="tel"] {
    background: rgba(255,255,255,0.08) !important;
    border: 1px solid rgba(255,255,255,0.15) !important;
    border-radius: 8px !important;
    color: #fff !important;
    font-size: 0.9rem !important;
    padding: 11px 14px !important;
    -webkit-appearance: none !important;
    transition: all 0.2s ease !important;
}

.calculator-card select:focus,
.calculator-card input[type="tel"]:focus {
    background: rgba(255,255,255,0.12) !important;
    border-color: rgba(200,164,92,0.4) !important;
    outline: none !important;
}

/* select下拉选项用深色(浏览器原生下拉) */
.calculator-card select option {
    background: #0d2b52 !important;
    color: #fff !important;
}

/* placeholder文字加亮 */
.calculator-card input[type="tel"]::placeholder {
    color: rgba(255,255,255,0.4) !important;
}