/*!
 * 智诚五八零 · 科技蓝主题（Tech Blue Theme）
 * ---------------------------------------------------------------------------
 * 全站统一的视觉体系：设计令牌 + 深空蓝底 + 科技蓝主色 + 玻璃拟态卡片 + 网格光效，
 * 并补齐各断点下的响应式规则（1200 / 992 / 768 / 576）。
 *
 * 用法：在页面 <body> 上加 class="tech-theme"，再引入本文件。
 * 作用域统一用 body.tech-theme 前缀，覆盖各模板里的内联样式（内联 <style> 特异性更低）。
 * 新增页面只要引这个文件就自动是科技蓝，不用改模板。
 */

/* ==========================================================================
   1. 设计令牌
   ========================================================================== */
:root {
    /* 底色：整体偏蓝，不用大面积接近黑的深色 */
    --zc-bg:          #0e2354;
    --zc-bg-soft:     #0c1f4a;
    --zc-bg-deep:     #08183c;
    --zc-bg-card:     rgba(24, 60, 130, 0.55);
    --zc-bg-card-2:   rgba(14, 40, 92, 0.72);

    /* 主色：科技蓝 */
    --zc-blue:        #2f7dff;
    --zc-blue-2:      #5aa2ff;
    --zc-blue-3:      #1a5fd6;
    --zc-cyan:        #35d6ff;
    --zc-grad:        linear-gradient(135deg, #2f7dff 0%, #35d6ff 100%);
    --zc-grad-soft:   linear-gradient(135deg, rgba(47,125,255,.22) 0%, rgba(53,214,255,.14) 100%);
    --zc-grad-deep:   linear-gradient(160deg, #0b2a68 0%, #10489f 55%, #0a2560 100%);

    /* 文字：跟蓝底保持足够反差 */
    --zc-text:        #f2f7ff;
    --zc-text-2:      #c2d6f7;
    --zc-text-3:      #a3bce6;

    /* 线与光 */
    --zc-line:        rgba(64, 150, 255, 0.22);
    --zc-line-2:      rgba(64, 150, 255, 0.45);
    --zc-glow:        0 0 24px rgba(47, 125, 255, 0.35);
    --zc-glow-cyan:   0 0 24px rgba(53, 214, 255, 0.28);
    --zc-shadow:      0 18px 50px rgba(3, 12, 35, 0.55);
    --zc-shadow-sm:   0 8px 24px rgba(3, 12, 35, 0.38);

    /* 形状与动效 */
    --zc-radius:      14px;
    --zc-radius-sm:   10px;
    --zc-radius-lg:   20px;
    --zc-ease:        cubic-bezier(.22, .61, .36, 1);
    --zc-t:           .28s var(--zc-ease);

    /* 栅格 */
    --zc-nav-h:       70px;
    --zc-pad:         40px;
    --zc-max:         1320px;
}

/* ==========================================================================
   2. 基础
   ========================================================================== */
body.tech-theme {
    background-color: var(--zc-bg);
    /* 网格底纹 + 三处光晕，全部作为背景层，不会盖住任何内容 */
    background-image:
        linear-gradient(rgba(64, 150, 255, .06) 1px, transparent 1px),
        linear-gradient(90deg, rgba(64, 150, 255, .06) 1px, transparent 1px),
        radial-gradient(1200px 560px at 10% -6%, rgba(47, 125, 255, .30), transparent 62%),
        radial-gradient(1000px 500px at 90% 2%, rgba(53, 214, 255, .20), transparent 62%),
        radial-gradient(1100px 640px at 50% 104%, rgba(26, 95, 214, .26), transparent 62%);
    background-size: 46px 46px, 46px 46px, auto, auto, auto;
    background-repeat: repeat, repeat, no-repeat, no-repeat, no-repeat;
    color: var(--zc-text);
    line-height: 1.7;
    -webkit-font-smoothing: antialiased;
    -webkit-text-size-adjust: 100%;
}

body.tech-theme ::selection,
body.tech-theme *::selection { background: rgba(47, 125, 255, .38); color: #fff; }

body.tech-theme img { max-width: 100%; height: auto; }

body.tech-theme a { transition: color var(--zc-t), opacity var(--zc-t); }

body.tech-theme :focus-visible {
    outline: 2px solid var(--zc-cyan);
    outline-offset: 3px;
    border-radius: 4px;
}

/* 科技蓝滚动条 */
body.tech-theme::-webkit-scrollbar { width: 10px; height: 10px; }
body.tech-theme::-webkit-scrollbar-track { background: #060e22; }
body.tech-theme::-webkit-scrollbar-thumb {
    background: linear-gradient(180deg, var(--zc-blue), var(--zc-blue-3));
    border-radius: 6px;
    border: 2px solid #060e22;
}
body.tech-theme::-webkit-scrollbar-thumb:hover { background: linear-gradient(180deg, var(--zc-cyan), var(--zc-blue)); }

/* ==========================================================================
   3. 导航（自定义 .navbar 与 Bootstrap .navbar-default 两套统一）
   ========================================================================== */
body.tech-theme .navbar,
body.tech-theme .navbar-default {
    background: rgba(6, 16, 38, .82) !important;
    backdrop-filter: saturate(160%) blur(16px);
    -webkit-backdrop-filter: saturate(160%) blur(16px);
    border-bottom: 1px solid var(--zc-line) !important;
    box-shadow: 0 10px 40px rgba(2, 10, 28, .55) !important;
    min-height: var(--zc-nav-h);
}

body.tech-theme .navbar::after,
body.tech-theme .navbar-default::after {
    content: "";
    position: absolute;
    left: 0; right: 0; bottom: -1px;
    height: 1px;
    background: linear-gradient(90deg, transparent, rgba(47,125,255,.85), rgba(53,214,255,.7), transparent);
}

body.tech-theme .logo,
body.tech-theme .navbar-brand .brand-text {
    color: var(--zc-cyan) !important;
    text-shadow: 0 0 18px rgba(53, 214, 255, .35);
}

body.tech-theme .nav-menu > a,
body.tech-theme .navbar-nav > li > a {
    position: relative;
    color: rgba(255, 255, 255, .9) !important;
    transition: color var(--zc-t);
}

body.tech-theme .nav-menu > a::after,
body.tech-theme .navbar-nav > li > a::after {
    content: "";
    position: absolute;
    left: 50%; bottom: 4px;
    width: 0; height: 2px;
    background: var(--zc-grad);
    border-radius: 2px;
    transform: translateX(-50%);
    transition: width var(--zc-t);
}

body.tech-theme .nav-menu > a:hover,
body.tech-theme .nav-menu > a:hover::after,
body.tech-theme .navbar-nav > li > a:hover,
body.tech-theme .navbar-nav > li > a:hover::after,
body.tech-theme .navbar-nav > .active > a {
    color: var(--zc-cyan) !important;
}

body.tech-theme .nav-menu > a:hover::after,
body.tech-theme .navbar-nav > li > a:hover::after { width: 62%; }

body.tech-theme .nav-dropdown-menu,
body.tech-theme .navbar-nav .dropdown-menu {
    background: rgba(8, 22, 50, .97) !important;
    border: 1px solid var(--zc-line) !important;
    border-radius: var(--zc-radius-sm);
    box-shadow: var(--zc-shadow) !important;
    backdrop-filter: blur(12px);
}

body.tech-theme .nav-dropdown-menu a,
body.tech-theme .navbar-nav .dropdown-menu > li > a {
    color: var(--zc-text-2) !important;
    border-radius: 6px;
    transition: background var(--zc-t), color var(--zc-t);
}

body.tech-theme .nav-dropdown-menu a:hover,
body.tech-theme .navbar-nav .dropdown-menu > li > a:hover {
    background: rgba(47, 125, 255, .16) !important;
    color: #fff !important;
}

body.tech-theme .nav-tel div,
body.tech-theme .nav-tel a {
    color: var(--zc-cyan) !important;
    text-shadow: 0 0 14px rgba(53, 214, 255, .3);
}

body.tech-theme .mobile-menu-btn,
body.tech-theme .navbar-toggle {
    color: var(--zc-cyan) !important;
    border: 1px solid var(--zc-line) !important;
    border-radius: 10px;
    background: rgba(47, 125, 255, .1) !important;
    width: 42px;
    height: 42px;
    line-height: 1;
    text-align: center;
}

body.tech-theme .navbar-toggle .icon-bar {
    background-color: var(--zc-cyan) !important;
    margin-left: auto;
    margin-right: auto;
}

/* 搜索框（Bootstrap 版导航里的站内搜索） */
body.tech-theme .navbar-form .form-search { position: relative; }
body.tech-theme .navbar-form .form-control {
    background: rgba(10, 26, 58, .8) !important;
    border: 1px solid var(--zc-line) !important;
    color: var(--zc-text) !important;
    border-radius: 999px;
    height: 38px;
    padding-left: 18px;
}
body.tech-theme .navbar-form .form-control::placeholder { color: var(--zc-text-3); }
body.tech-theme .navbar-form .form-control:focus {
    border-color: var(--zc-blue) !important;
    box-shadow: 0 0 0 3px rgba(47, 125, 255, .18) !important;
}
body.tech-theme .navbar-form .search-icon {
    color: var(--zc-cyan) !important;
}

/* ==========================================================================
   4. 页脚
   ========================================================================== */
body.tech-theme .footer-fourcol {
    background: var(--zc-grad-deep) !important;
    border-top: 1px solid var(--zc-line);
    position: relative;
}

body.tech-theme .footer-fourcol::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background-image:
        linear-gradient(rgba(64, 150, 255, .06) 1px, transparent 1px),
        linear-gradient(90deg, rgba(64, 150, 255, .06) 1px, transparent 1px);
    background-size: 40px 40px;
}

body.tech-theme .footer-inner { position: relative; }

body.tech-theme .footer-box {
    background: rgba(12, 30, 68, .55) !important;
    border: 1px solid var(--zc-line) !important;
    border-radius: var(--zc-radius) !important;
    transition: border-color var(--zc-t), transform var(--zc-t), box-shadow var(--zc-t);
}

body.tech-theme .footer-box:hover {
    border-color: var(--zc-line-2) !important;
    transform: translateY(-3px);
    box-shadow: 0 14px 34px rgba(3, 12, 35, .5);
}

body.tech-theme .footer-box h3,
body.tech-theme .footer-box h4 { color: var(--zc-cyan) !important; }

body.tech-theme .footer-box li,
body.tech-theme .footer-box p { color: var(--zc-text-2) !important; }

body.tech-theme .footer-copyright {
    color: rgba(255, 255, 255, .55) !important;
    border-top: 1px solid var(--zc-line) !important;
    position: relative;
}

/* Bootstrap 版页脚（common/layout.html） */
body.tech-theme #footer {
    background: var(--zc-grad-deep) !important;
    border-top: 1px solid var(--zc-line);
    color: var(--zc-text-2) !important;
    padding: 26px 0 !important;
}
body.tech-theme #footer a { color: var(--zc-text-2) !important; }
body.tech-theme #footer a:hover { color: var(--zc-cyan) !important; }
body.tech-theme #footer .footer-logo a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 42px; height: 42px;
    border-radius: 12px;
    background: var(--zc-grad);
    color: #fff !important;
    box-shadow: var(--zc-glow);
}
body.tech-theme #footer ul.list-inline li { margin-right: 14px; font-size: 13px; }

/* ==========================================================================
   5. 内容块 / 卡片
   ========================================================================== */
body.tech-theme .page-container { position: relative; }

body.tech-theme .list-item,
body.tech-theme .article-content,
body.tech-theme .panel,
body.tech-theme .panel-default {
    background: var(--zc-bg-card) !important;
    border: 1px solid var(--zc-line) !important;
    border-radius: var(--zc-radius) !important;
    color: var(--zc-text-2) !important;
    box-shadow: var(--zc-shadow-sm);
    backdrop-filter: blur(6px);
    transition: border-color var(--zc-t), transform var(--zc-t), box-shadow var(--zc-t);
}

body.tech-theme .list-item:hover {
    border-color: var(--zc-line-2) !important;
    transform: translateY(-4px);
    box-shadow: 0 16px 40px rgba(3, 12, 35, .55), 0 0 0 1px rgba(47, 125, 255, .18);
}

body.tech-theme .panel:hover {
    border-color: var(--zc-line-2) !important;
}

body.tech-theme .panel-heading {
    background: transparent !important;
    border-bottom: 1px solid var(--zc-line) !important;
    color: var(--zc-text) !important;
}

body.tech-theme .panel-title { color: var(--zc-text) !important; }

/* ==========================================================================
   6. 文字与标题
   ========================================================================== */
body.tech-theme .page-title,
body.tech-theme .section-title h2,
body.tech-theme .about-content h2,
body.tech-theme h1,
body.tech-theme h2 {
    color: var(--zc-text) !important;
    letter-spacing: .5px;
}

body.tech-theme .section-title h2,
body.tech-theme .about-content h2 {
    color: #5aa2ff !important;
    text-shadow: 0 0 22px rgba(47, 125, 255, .35);
}

body.tech-theme .section-title p,
body.tech-theme .about-sub { color: var(--zc-text-3) !important; }

body.tech-theme .article-content .content { color: var(--zc-text-2) !important; }
body.tech-theme .article-content .content a { color: var(--zc-cyan) !important; }
body.tech-theme .article-content .info,
body.tech-theme .breadcrumb-nav { color: var(--zc-text-3) !important; }
body.tech-theme .breadcrumb-nav a { color: var(--zc-blue-2) !important; }
body.tech-theme .breadcrumb-nav a:hover { color: var(--zc-cyan) !important; }

/* 通用：正文里被 FastAdmin 写成深色的文字，在深底上要提亮 */
body.tech-theme .main-content p,
body.tech-theme .main-content li { color: inherit; }

/* ==========================================================================
   7. 按钮
   ========================================================================== */
body.tech-theme .btn-blue,
body.tech-theme .btn-primary,
body.tech-theme .about-btn {
    background: var(--zc-grad) !important;
    color: #fff !important;
    border: none !important;
    border-radius: 999px !important;
    padding: 12px 30px !important;
    font-weight: 600;
    letter-spacing: .5px;
    box-shadow: 0 8px 24px rgba(47, 125, 255, .32);
    transition: transform var(--zc-t), box-shadow var(--zc-t), filter var(--zc-t);
}

body.tech-theme .btn-blue:hover,
body.tech-theme .btn-primary:hover,
body.tech-theme .about-btn:hover {
    color: #fff !important;
    transform: translateY(-2px);
    box-shadow: 0 12px 30px rgba(47, 125, 255, .48);
    filter: saturate(120%);
}

body.tech-theme .btn-outline,
body.tech-theme .btn-default {
    background: rgba(47, 125, 255, .1) !important;
    color: var(--zc-cyan) !important;
    border: 1px solid var(--zc-line-2) !important;
    border-radius: 999px !important;
    padding: 12px 30px !important;
    transition: background var(--zc-t), color var(--zc-t), transform var(--zc-t);
}

body.tech-theme .btn-outline:hover,
body.tech-theme .btn-default:hover {
    background: rgba(47, 125, 255, .24) !important;
    color: #fff !important;
    transform: translateY(-2px);
}

body.tech-theme .service-more { color: var(--zc-cyan) !important; }

/* ==========================================================================
   8. 表单 / 搜索 / 标签
   ========================================================================== */
body.tech-theme .form-control,
body.tech-theme input[type="text"],
body.tech-theme input[type="search"],
body.tech-theme input[type="tel"],
body.tech-theme input[type="email"],
body.tech-theme textarea,
body.tech-theme select {
    background: rgba(10, 26, 58, .75) !important;
    border: 1px solid var(--zc-line) !important;
    color: var(--zc-text) !important;
    border-radius: var(--zc-radius-sm) !important;
    transition: border-color var(--zc-t), box-shadow var(--zc-t);
}

body.tech-theme .form-control:focus,
body.tech-theme input:focus,
body.tech-theme textarea:focus,
body.tech-theme select:focus {
    border-color: var(--zc-blue) !important;
    box-shadow: 0 0 0 3px rgba(47, 125, 255, .18) !important;
    outline: none !important;
}

body.tech-theme label,
body.tech-theme .form-label { color: var(--zc-text-2) !important; }

body.tech-theme .btn-search,
body.tech-theme .search-btn {
    background: var(--zc-grad) !important;
    color: #fff !important;
    border: none !important;
    border-radius: var(--zc-radius-sm) !important;
}

body.tech-theme .tags a,
body.tech-theme .tag-item,
body.tech-theme .list-inline.tags li a {
    background: rgba(47, 125, 255, .12) !important;
    border: 1px solid var(--zc-line) !important;
    color: var(--zc-blue-2) !important;
    border-radius: 999px !important;
    padding: 4px 14px !important;
    display: inline-block;
}

body.tech-theme .tags a:hover { color: var(--zc-cyan) !important; border-color: var(--zc-line-2) !important; }

/* ==========================================================================
   9. 分页 / 表格 / 提示条
   ========================================================================== */
body.tech-theme .pagination a,
body.tech-theme .pagination span,
body.tech-theme .pagination > li > a,
body.tech-theme .pagination > li > span {
    background: rgba(17, 40, 90, .5) !important;
    border: 1px solid var(--zc-line) !important;
    color: var(--zc-blue-2) !important;
    border-radius: var(--zc-radius-sm) !important;
    transition: background var(--zc-t), color var(--zc-t), border-color var(--zc-t);
}

body.tech-theme .pagination a:hover,
body.tech-theme .pagination .active a,
body.tech-theme .pagination .active span,
body.tech-theme .pagination > .active > a {
    background: var(--zc-grad) !important;
    border-color: transparent !important;
    color: #fff !important;
    box-shadow: var(--zc-glow);
}

body.tech-theme table { color: var(--zc-text-2) !important; }
body.tech-theme table > thead > tr > th {
    background: rgba(47, 125, 255, .14) !important;
    color: var(--zc-cyan) !important;
    border-bottom: 1px solid var(--zc-line) !important;
}
body.tech-theme table > tbody > tr > td { border-top: 1px solid rgba(64, 150, 255, .12) !important; }

body.tech-theme .alert-info,
body.tech-theme .alert-success,
body.tech-theme .alert-warning {
    border-radius: var(--zc-radius-sm) !important;
    border: 1px solid var(--zc-line) !important;
}

/* ==========================================================================
   10. 浮动按钮 / 悬浮元素
   ========================================================================== */
body.tech-theme #floatbtn a,
body.tech-theme .floatbtn-item {
    background: rgba(8, 22, 50, .92) !important;
    border: 1px solid var(--zc-line) !important;
    color: var(--zc-cyan) !important;
    border-radius: 12px !important;
    transition: transform var(--zc-t), border-color var(--zc-t), box-shadow var(--zc-t);
}

body.tech-theme #floatbtn a:hover {
    transform: translateY(-3px);
    border-color: var(--zc-line-2) !important;
    box-shadow: var(--zc-glow);
}

/* ==========================================================================
   10.5 Bootstrap 外壳（common/layout.html：单页 / 搜索 / 标签 / 列表）
   ========================================================================== */
body.tech-theme.shell-bs .main-content {
    /* .skin-white 已经给 body 加了 80px 顶部留白来避开固定导航，这里不再叠加 */
    margin-bottom: -60px;
}

/* 吸底留白收窄 */
body.tech-theme.shell-bs .main-content:after { height: 140px; }
body.tech-theme.shell-bs footer { height: auto !important; }

body.tech-theme.shell-bs footer,
body.tech-theme.shell-bs #footer { background: var(--zc-grad-deep) !important; }

/* Bootstrap 导航：保留它原本的 60px 行高盒模型，只换颜色 */
body.tech-theme.shell-bs .navbar-default { min-height: 60px; }

body.tech-theme.shell-bs .navbar-default .navbar-brand {
    height: 60px;
    line-height: 27px;
    padding: 15px;
}

body.tech-theme.shell-bs .navbar-default .navbar-nav > li > a {
    height: 60px;
    line-height: 27px;
    padding: 15px;
}

body.tech-theme.shell-bs .navbar-collapse { border: 0 !important; }
body.tech-theme.shell-bs .navbar-default .navbar-collapse.in,
body.tech-theme.shell-bs .navbar-default .navbar-collapse.in .navbar-form {
    background: transparent;
}

body.tech-theme.shell-bs .container { position: relative; }

body.tech-theme.shell-bs .category-title {
    color: var(--zc-text) !important;
    font-size: 24px;
    border-bottom: 1px solid var(--zc-line);
    padding-bottom: 16px;
    margin-bottom: 22px;
}

body.tech-theme.shell-bs .category-title .more ol.breadcrumb { background: transparent; }

body.tech-theme.shell-bs .panel-body { color: var(--zc-text-2); }

body.tech-theme.shell-bs .article-item {
    padding: 20px 0;
    border-bottom: 1px solid rgba(64, 150, 255, .12);
}

body.tech-theme.shell-bs .article-item:last-child { border-bottom: 0; }

body.tech-theme.shell-bs .article-title a,
body.tech-theme.shell-bs .article-title {
    color: var(--zc-text) !important;
    font-weight: 600;
    transition: color var(--zc-t);
}

body.tech-theme.shell-bs .article-title a:hover { color: var(--zc-cyan) !important; }

body.tech-theme.shell-bs .article-intro { color: var(--zc-text-3) !important; }
body.tech-theme.shell-bs .article-tag,
body.tech-theme.shell-bs .article-tag span { color: var(--zc-text-3) !important; }

body.tech-theme.shell-bs .tag,
body.tech-theme.shell-bs .article-tag .tag {
    background: rgba(47, 125, 255, .14) !important;
    color: var(--zc-blue-2) !important;
    border-radius: 999px !important;
    padding: 3px 12px !important;
    display: inline-block;
    border: 1px solid var(--zc-line);
}

body.tech-theme.shell-bs .text-danger { color: #ff7a8a !important; }
body.tech-theme.shell-bs .category-order li a { color: var(--zc-text-2) !important; }
body.tech-theme.shell-bs .category-order li a.active { color: var(--zc-cyan) !important; }

/* ==========================================================================
   10.6 专题页（channel_xinxixitongjicheng 等原本没有断点的页面）
   ========================================================================== */
body.tech-theme .nav-wrap {
    background: rgba(6, 18, 44, .92) !important;
    backdrop-filter: blur(12px);
    border-bottom: 1px solid var(--zc-line);
}

body.tech-theme .nav-wrap a {
    color: rgba(255, 255, 255, .88) !important;
    transition: color var(--zc-t);
}

body.tech-theme .nav-wrap a:hover { color: var(--zc-cyan) !important; }

body.tech-theme .nav-wrap .dropdown-menu {
    background: rgba(8, 20, 68, .98) !important;
    border: 1px solid var(--zc-line);
    border-radius: 0 0 var(--zc-radius-sm) var(--zc-radius-sm);
    box-shadow: var(--zc-shadow);
}

body.tech-theme .nav-wrap .dropdown-menu a:hover {
    background: rgba(47, 125, 255, .18);
    color: #fff !important;
}

body.tech-theme .banner-box,
body.tech-theme .advantage-box {
    border-color: var(--zc-line-2) !important;
    background: linear-gradient(135deg, rgba(11, 34, 92, .92), rgba(5, 16, 54, .95)) !important;
    box-shadow: var(--zc-shadow);
}

body.tech-theme .adv-item::before { color: var(--zc-cyan) !important; }

body.tech-theme .footer {
    background: var(--zc-grad-deep) !important;
    border-top: 1px solid var(--zc-line);
}

body.tech-theme .footer-col {
    background: rgba(12, 30, 68, .5) !important;
    border-color: var(--zc-line) !important;
    transition: border-color var(--zc-t), transform var(--zc-t);
}

body.tech-theme .footer-col:hover {
    border-color: var(--zc-line-2) !important;
    transform: translateY(-3px);
}

body.tech-theme .footer-col h3 { color: var(--zc-cyan) !important; }

/* ==========================================================================
   10.7 AI 智能客服挂件（原本是浅色面板，和深色站点不搭）
   ========================================================================== */
body.tech-theme .zc-ai-panel {
    background: #0a1730 !important;
    border: 1px solid var(--zc-line) !important;
    box-shadow: 0 24px 70px rgba(2, 10, 28, .7) !important;
}

body.tech-theme .zc-ai-head {
    background: linear-gradient(135deg, #1b63d6 0%, #0aa6e8 100%) !important;
}

body.tech-theme .zc-ai-body {
    background: #081228 !important;
}

body.tech-theme .zc-ai-body::-webkit-scrollbar-thumb { background: rgba(120, 170, 255, .3); }

body.tech-theme .zc-ai-msg-bot .zc-ai-bubble {
    background: rgba(20, 46, 100, .85) !important;
    color: var(--zc-text) !important;
    border: 1px solid var(--zc-line) !important;
    box-shadow: none !important;
}

body.tech-theme .zc-ai-msg-user .zc-ai-bubble {
    background: linear-gradient(135deg, #2f7dff, #1a5fd6) !important;
    color: #fff !important;
}

body.tech-theme .zc-ai-chip {
    background: rgba(47, 125, 255, .12) !important;
    border-color: var(--zc-line-2) !important;
    color: var(--zc-blue-2) !important;
}

body.tech-theme .zc-ai-chip:hover {
    background: var(--zc-grad) !important;
    border-color: transparent !important;
    color: #fff !important;
}

body.tech-theme .zc-ai-foot {
    background: #0a1730 !important;
    border-top: 1px solid var(--zc-line) !important;
}

body.tech-theme .zc-ai-field {
    background: rgba(10, 26, 58, .85) !important;
    border-color: var(--zc-line) !important;
    color: var(--zc-text) !important;
}

body.tech-theme .zc-ai-field:focus {
    background: rgba(12, 32, 70, .95) !important;
    border-color: var(--zc-blue) !important;
}

body.tech-theme .zc-ai-tip { color: var(--zc-text-3) !important; }
body.tech-theme .zc-ai-tip a { color: var(--zc-cyan) !important; }

body.tech-theme .zc-ai-form {
    background: rgba(12, 30, 68, .6) !important;
    border-color: var(--zc-line) !important;
}

body.tech-theme .zc-ai-form-title { color: var(--zc-text) !important; }

body.tech-theme .zc-ai-select,
body.tech-theme .zc-ai-textarea {
    background: rgba(8, 22, 50, .9) !important;
    border-color: var(--zc-line) !important;
    color: var(--zc-text) !important;
}

body.tech-theme .zc-ai-select option { background: #0a1730; color: var(--zc-text); }

body.tech-theme .zc-ai-btn-ghost {
    background: transparent !important;
    border-color: var(--zc-line-2) !important;
    color: var(--zc-blue-2) !important;
}

body.tech-theme .zc-ai-quote-card {
    background: rgba(255, 159, 67, .1) !important;
    border-color: rgba(255, 159, 67, .35) !important;
    color: #ffd9b8 !important;
}

body.tech-theme .zc-ai-quote-card .zc-ai-quote-item { border-bottom-color: rgba(255, 159, 67, .28) !important; }
body.tech-theme .zc-ai-quote-card b { color: #ffab5e !important; }

/* ==========================================================================
   10.8 首页配色：背景去黑、字提亮，保证反差
   ========================================================================== */

/* ---- 背景层：从「深黑蓝」改成「科技蓝」，层次靠光晕而不是靠压暗 ---- */
body.tech-theme .banner-wrap {
    background:
        radial-gradient(circle at 50% 10%, rgba(72, 180, 255, .42) 0%, transparent 30%),
        radial-gradient(circle at 16% 76%, rgba(47, 125, 255, .24) 0%, transparent 36%),
        radial-gradient(circle at 84% 66%, rgba(53, 214, 255, .20) 0%, transparent 34%),
        linear-gradient(180deg, #08184a 0%, #0c3074 45%, #081a45 100%) !important;
}

body.tech-theme .about-section {
    background: linear-gradient(135deg, #123670 0%, #1257b8 50%, #0d2a63 100%) !important;
}

body.tech-theme .case-section,
body.tech-theme .news-wrap {
    background-color: #0e2c66 !important;
    /* 网格线提亮一档，蓝底上才看得出科技感 */
    background-image:
        linear-gradient(90deg, rgba(80, 160, 255, .14) 1px, transparent 1px),
        linear-gradient(rgba(80, 160, 255, .14) 1px, transparent 1px) !important;
    background-size: 24px 24px !important;
}

body.tech-theme .cta-banner {
    background: linear-gradient(135deg, #14429e 0%, #2f7dff 50%, #14429e 100%) !important;
}

body.tech-theme .client-section {
    background: linear-gradient(180deg, #0b2a68 0%, #123f96 100%) !important;
}

body.tech-theme .client-item {
    background: rgba(30, 76, 160, .5) !important;
    border-color: var(--zc-line) !important;
}

/* 卡片类：底色提亮一档，和蓝底拉开层次 */
body.tech-theme .data-item,
body.tech-theme .list-item {
    background-color: rgba(28, 72, 155, .45) !important;
}

body.tech-theme .service-card {
    background: linear-gradient(135deg, rgba(38, 92, 190, .62), rgba(20, 58, 132, .82)) !important;
}

body.tech-theme .news-card-item {
    background: rgba(24, 62, 135, .5) !important;
    border-color: var(--zc-line) !important;
}

/* ---- 文字层：把偏暗的灰蓝换成亮蓝，正文可读 ---- */
body.tech-theme .section-title p,
body.tech-theme .about-content .about-subtitle,
body.tech-theme .data-text { color: #c3d8f8 !important; }

body.tech-theme .service-card h3 { color: #e2edff !important; }
body.tech-theme .service-card p { color: #c6d9f7 !important; }

body.tech-theme .case-head p { color: #bcd2f4 !important; }
body.tech-theme .case-tag { color: #b3cbef !important; }

body.tech-theme .tab,
body.tech-theme .tabs .tab { color: #c0d5f5 !important; }
body.tech-theme .tab.active,
body.tech-theme .tabs .tab.active { color: #fff !important; }

body.tech-theme .big-desc { color: #d6e4fb !important; }
body.tech-theme .big-date { color: #b6cbee !important; }

body.tech-theme .sn-sub { color: #b6cbee !important; }
body.tech-theme .sn-date { color: #aac4ee !important; }

body.tech-theme .btn-outline { color: #8fd6ff !important; }
body.tech-theme .client-subtitle { color: #64c6ff !important; }

/* ---- 首页留言表单：原来是浅色区块，在深蓝站点里标题/标签会看不见 ---- */
body.tech-theme .form-section {
    background: linear-gradient(180deg, #123a86 0%, #0d2a63 100%) !important;
    border-top: 1px solid var(--zc-line);
}

body.tech-theme .form-section::before {
    background:
        radial-gradient(circle at 20% 30%, rgba(70, 150, 255, .20), transparent 45%),
        radial-gradient(circle at 80% 70%, rgba(53, 214, 255, .16), transparent 45%) !important;
}

body.tech-theme .form-container h2 { color: #fff !important; }
body.tech-theme .form-slogan { color: #c2dcff !important; }

body.tech-theme .benefit-item {
    background: rgba(255, 255, 255, .10) !important;
    border-color: rgba(150, 200, 255, .45) !important;
    color: #dcecff !important;
}

/* 表单卡片保留亮色，白底深字最清楚 */
body.tech-theme .form-card {
    background: rgba(255, 255, 255, .95) !important;
    border-color: rgba(255, 255, 255, .6) !important;
    box-shadow: 0 18px 50px rgba(4, 16, 44, .45) !important;
}

body.tech-theme .input-group label { color: #26324a !important; }
body.tech-theme .input-group input,
body.tech-theme .input-group textarea {
    background: #fff !important;
    border-color: #c2d4ee !important;
    color: #16203a !important;
    border-radius: 8px !important;
}
body.tech-theme .input-group input::placeholder,
body.tech-theme .input-group textarea::placeholder { color: #8ea0bd !important; }
body.tech-theme .input-group input:focus,
body.tech-theme .input-group textarea:focus {
    border-color: var(--zc-blue) !important;
    box-shadow: 0 0 0 3px rgba(47, 125, 255, .18) !important;
}

body.tech-theme .submit-btn {
    background: linear-gradient(90deg, #2f7dff, #1a5fd6) !important;
    box-shadow: 0 8px 22px rgba(47, 125, 255, .35);
}

/* ==========================================================================
   11. 响应式
   ========================================================================== */
/* Bootstrap 外壳：把 .skin-white 的 80px 顶部留白改成正好等于固定导航的高度 */
@media (min-width: 768px) {
    body.tech-theme.shell-bs { padding-top: 61px; }
}

@media (max-width: 767px) {
    body.tech-theme.shell-bs { padding-top: 58px; }
}

@media (max-width: 1200px) {
    body.tech-theme { --zc-max: 1140px; --zc-pad: 34px; }
    body.tech-theme .page-container { padding: 34px 18px; }
}

@media (max-width: 900px) {
    /* 手机端把咨询电话从导航里挪出来，做成左下角常驻拨号按钮
       （模板里原本是 display:none，移动端等于没有电话入口） */
    body.tech-theme .nav-tel {
        display: block !important;
        position: fixed !important;
        left: 14px;
        right: auto;
        bottom: 20px;
        z-index: 9990;
        margin: 0 !important;
        padding: 11px 18px !important;
        border-radius: 999px !important;
        background: var(--zc-grad) !important;
        border: 0 !important;
        box-shadow: 0 10px 26px rgba(47, 125, 255, .45);
        text-align: left !important;
        line-height: 1.2 !important;
    }

    body.tech-theme .nav-tel div { display: none !important; }

    body.tech-theme .nav-tel a {
        color: #fff !important;
        font-size: 17px !important;
        font-weight: 700;
        text-decoration: none !important;
        white-space: nowrap;
    }

    body.tech-theme .nav-tel a::before { content: "📞 "; }
}

@media (max-width: 992px) {
    body.tech-theme { --zc-nav-h: 62px; --zc-pad: 26px; }

    body.tech-theme .nav-menu,
    body.tech-theme .navbar-collapse {
        background: rgba(5, 14, 34, .985) !important;
        backdrop-filter: blur(18px);
    }

    body.tech-theme .page-container { padding: 26px 16px; }

    /* 卡片式布局：两列 */
    body.tech-theme .footer-inner { grid-template-columns: 1fr 1fr !important; }
    body.tech-theme .service-grid,
    body.tech-theme .stats-grid { grid-template-columns: repeat(2, 1fr) !important; }
    body.tech-theme .about-wrapper { grid-template-columns: 1fr !important; }
    body.tech-theme .about-image-wrap { margin: 0 auto 28px !important; }

    body.tech-theme .article-content { padding: 26px 22px !important; }
    body.tech-theme .article-content h1 { font-size: 24px !important; }
    body.tech-theme .page-title { font-size: 26px !important; }
    body.tech-theme .section-title h2,
    body.tech-theme .about-content h2 { font-size: 27px !important; }

    body.tech-theme.shell-bs .main-content { padding-top: 0; }

    /* 专题页：两栏转一栏，四栏页脚转两栏 */
    body.tech-theme .footer-container { grid-template-columns: 1fr 1fr !important; }
}

@media (max-width: 768px) {
    body.tech-theme { --zc-pad: 20px; }

    body.tech-theme .page-container { padding: 20px 14px; }

    body.tech-theme .service-grid,
    body.tech-theme .stats-grid,
    body.tech-theme .case-row,
    body.tech-theme .case-grid,
    body.tech-theme .news-grid,
    body.tech-theme .form-grid { grid-template-columns: 1fr !important; }

    body.tech-theme .footer-inner { grid-template-columns: 1fr !important; }

    body.tech-theme .about-section { padding: 52px 0 !important; }
    body.tech-theme .case-section { padding: 52px 0 !important; }
    body.tech-theme .client-section { padding: 52px 0 !important; }

    body.tech-theme .banner-text h1 { font-size: 28px !important; }
    body.tech-theme .cta-banner h2 { font-size: 26px !important; }
    body.tech-theme .cta-banner { padding: 52px 18px !important; }

    /* 触控目标不小于 44px */
    body.tech-theme .btn-blue,
    body.tech-theme .btn-outline,
    body.tech-theme .btn-primary,
    body.tech-theme .about-btn {
        padding: 13px 26px !important;
        min-height: 46px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
    }

    body.tech-theme .nav-menu > a,
    body.tech-theme .navbar-nav > li > a { min-height: 46px; }

    body.tech-theme .article-content { padding: 20px 16px !important; }
    body.tech-theme .article-content .content { font-size: 15px !important; }

    body.tech-theme .pagination { gap: 6px !important; }
    body.tech-theme .pagination a,
    body.tech-theme .pagination span { padding: 8px 12px !important; }

    /* Bootstrap 外壳：移动端收起菜单不再遮挡内容 */
    body.tech-theme.shell-bs .navbar-default { min-height: 54px; }
    body.tech-theme.shell-bs .navbar-default .navbar-brand {
        height: auto;
        line-height: 1.4;
        padding: 12px 15px;
    }
    body.tech-theme.shell-bs .navbar-default .navbar-nav > li > a {
        height: auto;
        line-height: 1.5;
        padding: 13px 15px;
    }
    body.tech-theme.shell-bs .category-title { font-size: 20px !important; }
    body.tech-theme.shell-bs .article-item { padding: 16px 0; }

    /* 专题页：导航改为可横向滚动，标题与栅格收紧 */
    body.tech-theme .nav-wrap {
        justify-content: flex-start !important;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
        padding: 10px 0 !important;
    }
    body.tech-theme .nav-wrap::-webkit-scrollbar { display: none; }
    body.tech-theme .nav-wrap a,
    body.tech-theme .nav-wrap .dropdown span {
        white-space: nowrap;
        font-size: 15px !important;
        padding: 0 14px !important;
    }

    body.tech-theme .banner-box,
    body.tech-theme .advantage-box { padding: 26px 18px !important; }
    body.tech-theme .banner-box h1 { font-size: 26px !important; }
    body.tech-theme .advantage-box h2 { font-size: 24px !important; }
    body.tech-theme .advantage-box .en-adv { margin-bottom: 26px !important; }
    body.tech-theme .adv-container { grid-template-columns: 1fr !important; gap: 18px !important; }
    body.tech-theme .footer-container { grid-template-columns: 1fr 1fr !important; gap: 14px !important; }
    body.tech-theme .footer-col { padding: 16px 14px !important; }
}

@media (max-width: 576px) {
    body.tech-theme { font-size: 15px; }

    body.tech-theme .page-container { padding: 16px 12px; }

    body.tech-theme .section { padding: 28px 14px !important; }

    body.tech-theme .case-section,
    body.tech-theme .client-section,
    body.tech-theme .about-section { padding: 40px 14px !important; }

    body.tech-theme .banner-text h1 { font-size: 24px !important; }
    body.tech-theme .banner-text p { font-size: 14px !important; }
    body.tech-theme .btn-group { display: flex; flex-direction: column; gap: 12px; }
    body.tech-theme .btn-group > a { width: 100%; }

    body.tech-theme .footer-box { padding: 20px 18px !important; }

    body.tech-theme .footer-container { grid-template-columns: 1fr !important; }

    body.tech-theme .pagination a,
    body.tech-theme .pagination span { padding: 7px 10px !important; font-size: 13px !important; }
}

/* ==========================================================================
   12. 无障碍：用户偏好减少动画时关掉动效
   ========================================================================== */
@media (prefers-reduced-motion: reduce) {
    body.tech-theme *,
    body.tech-theme *::before,
    body.tech-theme *::after {
        animation-duration: .001ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: .001ms !important;
        scroll-behavior: auto !important;
    }
}