/* ==========================================================================
   固克复刻站 - 补充样式
   目标站 style.css 负责整体视觉与它自身结构的响应式；
   这里只补：PC 下拉菜单、内页横幅、内容栅格、详情页、分页、留言表单
   栅格策略：桌面 3 列 → 平板 2 列 → 手机 1 列（PC / 移动端同一套模板）
   ========================================================================== */

/* 2026-10-19 全站配色统一：主色定为科技蓝 #0796e5（原为复刻源站遗留红 #c31f28），
   深色配套沿用墨蓝 #1f2d3d / 深夜蓝 #101820；改主色只需动这里的 token */
:root {
    --kuk-main: #0796e5;
    --kuk-main-deep: #057ec2;
    --kuk-main-tint: #eef6fd;
    --kuk-text: #333;
    --kuk-gray: #888;
    --kuk-line: #e6e6e6;
}

body {
    color: var(--kuk-text);
}

/* 注意：**不要**在这里给正文图片加 max-width/height 覆盖。
   目标站正文图片带内联 width/height（如 style="width:1052px; height:391px"），
   目标站自己的 CSS 只写了 img{border:0}，图片按内联尺寸渲染。
   曾在此加过 `height: auto !important`，把内联 height 覆盖成按比例缩放，
   导致企业文化页图片 391px→357px、整页矮 44px。响应式由目标站 CSS 自己负责。 */

/* --------------------------------------------------------------------------
   PC 导航下拉
   -------------------------------------------------------------------------- */
#nav .nLi {
    position: relative;
}

#nav .nLi .kuk_sub {
    display: none;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    top: 100%;
    min-width: 168px;
    padding: 8px 0;
    margin: 0;
    list-style: none;
    background: #fff;
    box-shadow: 0 6px 18px rgba(0, 0, 0, .12);
    border-top: 2px solid var(--kuk-main);
    z-index: 999;
}

#nav .nLi:hover .kuk_sub {
    display: block;
}

#nav .nLi .kuk_sub li a {
    display: block;
    padding: 8px 18px;
    font-size: 14px;
    line-height: 1.4;
    color: #555;
    white-space: nowrap;
    transition: all .2s;
}

#nav .nLi .kuk_sub li a:hover {
    background: var(--kuk-main-tint);
    color: var(--kuk-main);
}

/* --------------------------------------------------------------------------
   内页横幅 + 面包屑
   -------------------------------------------------------------------------- */
.kuk_banner {
    background: linear-gradient(120deg, #2b2b2b 0%, #4a4a4a 60%, var(--kuk-main) 100%);
    color: #fff;
    padding: 56px 0;
    text-align: center;
}

.kuk_banner h1 {
    margin: 0;
    font-size: 32px;
    font-weight: 600;
    letter-spacing: 2px;
    color: #fff;
}

.kuk_banner p {
    margin: 10px 0 0;
    font-size: 14px;
    color: rgba(255, 255, 255, .75);
}

.kuk_crumb {
    max-width: 1200px;
    margin: 0 auto;
    padding: 16px 15px 0;
    font-size: 13px;
    color: var(--kuk-gray);
}

.kuk_crumb a {
    color: var(--kuk-gray);
}

.kuk_crumb a:hover {
    color: var(--kuk-main);
}

/* --------------------------------------------------------------------------
   列表容器
   -------------------------------------------------------------------------- */
/* 区块标题(首页各推荐区) */
.kuk_section_head {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 10px;
    margin-bottom: 24px;
    padding-bottom: 12px;
    border-bottom: 1px solid var(--kuk-line);
}

.kuk_section_head h2 {
    position: relative;
    margin: 0;
    padding-left: 14px;
    font-size: 24px;
    font-weight: 600;
    color: #333;
}

.kuk_section_head h2::before {
    content: "";
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 4px;
    height: 22px;
    background: var(--kuk-main);
    border-radius: 2px;
}

.kuk_section_head .kuk_more {
    font-size: 14px;
    color: var(--kuk-gray);
}

.kuk_section_head .kuk_more:hover {
    color: var(--kuk-main);
}

.kuk_wrap {
    max-width: 1200px;
    margin: 0 auto;
    padding: 26px 15px 60px;
}

/* 栏目筛选 */
.kuk_tabs {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    justify-content: center;
    margin-bottom: 28px;
}

.kuk_tabs a {
    display: inline-block;
    padding: 7px 18px;
    border: 1px solid var(--kuk-line);
    border-radius: 20px;
    font-size: 14px;
    color: #555;
    background: #fff;
    transition: all .2s;
}

.kuk_tabs a:hover,
.kuk_tabs a.active {
    background: var(--kuk-main);
    border-color: var(--kuk-main);
    color: #fff;
}

/* 卡片栅格：桌面 3 列 → 平板 2 列 → 手机 1 列 */
.kuk_grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
}

.kuk_card {
    display: block;
    background: #fff;
    border: 1px solid var(--kuk-line);
    overflow: hidden;
    transition: all .25s;
}

.kuk_card:hover {
    box-shadow: 0 10px 26px rgba(0, 0, 0, .1);
    transform: translateY(-3px);
}

.kuk_card_pic {
    display: block;
    width: 100%;
    height: 240px;
    overflow: hidden;
    background: #f5f5f5;
}

.kuk_card_pic img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform .4s;
}

.kuk_card:hover .kuk_card_pic img {
    transform: scale(1.05);
}

.kuk_card_txt {
    padding: 16px;
    text-align: center;
}

.kuk_card_txt h3 {
    margin: 0;
    font-size: 16px;
    font-weight: 500;
    color: var(--kuk-text);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.kuk_card_txt p {
    margin: 8px 0 0;
    font-size: 13px;
    color: var(--kuk-gray);
    height: 40px;
    overflow: hidden;
    line-height: 20px;
}

/* 新闻列表 */
.kuk_newslist {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 22px;
}

.kuk_newsitem {
    display: flex;
    gap: 16px;
    padding: 16px;
    background: #fff;
    border: 1px solid var(--kuk-line);
    transition: all .25s;
}

.kuk_newsitem:hover {
    box-shadow: 0 8px 20px rgba(0, 0, 0, .08);
}

.kuk_newsitem_pic {
    flex: 0 0 170px;
    width: 170px;
    height: 116px;
    overflow: hidden;
    background: #f5f5f5;
}

.kuk_newsitem_pic img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.kuk_newsitem_txt {
    flex: 1;
    min-width: 0;
}

.kuk_newsitem_txt h3 {
    margin: 0 0 8px;
    font-size: 16px;
    font-weight: 500;
    line-height: 1.5;
    max-height: 48px;
    overflow: hidden;
    color: var(--kuk-text);
}

.kuk_newsitem_txt h3 a:hover {
    color: var(--kuk-main);
}

.kuk_newsitem_txt .date {
    font-size: 13px;
    color: var(--kuk-gray);
}

.kuk_newsitem_txt p {
    margin: 8px 0 0;
    font-size: 13px;
    color: var(--kuk-gray);
    line-height: 20px;
    height: 40px;
    overflow: hidden;
}

/* 空状态 */
.kuk_empty {
    grid-column: 1 / -1;
    padding: 70px 0;
    text-align: center;
    color: var(--kuk-gray);
    font-size: 15px;
}

/* --------------------------------------------------------------------------
   内页 banner 响应式双图（2026-10-18 信息发布页起）
   ---------------------------------------------------------------------
   slideBox 的 li 内放两张图（bn-pc 桌面 3:1 / bn-mb 移动 3:2），
   按视口显隐；不要用 <picture>（inline 元素嵌 SuperSlide 的 li 会测宽为 0）。
   选择器必须带 .slideBox .bd 前缀提特异性——style.css 的
   .slideBox .bd img{display:block} 是 (0,2,1)，裸 .bn-mb(0,1,0) 会被压掉。 */
.slideBox .bd img.bn-mb { display: none; }
@media screen and (max-width: 620px) {
    .slideBox .bd img.bn-pc { display: none; }
    .slideBox .bd img.bn-mb { display: block; }
}

/* --------------------------------------------------------------------------
   侧栏分类导航当前项高亮（.product_left_nav 为 style.css 既有结构）
   ---------------------------------------------------------------------
   目标站 style.css 只定义了 a:hover，从未定义 .active——详情页侧栏
   (Base::leftNav 按当前内容重写的 class=" active ")此前是"隐身"的，
   点击二级菜单跳转后看不到停留指示。这里补上可见的 active 态：
   文字变蓝加粗 + 左侧蓝色指示条（指示条伸进 dd 的 padding 区，
   不挤动正文对齐）。案例详情页的 dt 级 active 同样命中。
   -------------------------------------------------------------------------- */
.product_left_nav dl dt a.active {
    color: var(--kuk-main-deep);
    font-weight: 600;
}

.product_left_nav dl dd a.active {
    position: relative;
    color: var(--kuk-main);
    font-weight: 600;
}

.product_left_nav dl dd a.active::before {
    content: "";
    position: absolute;
    left: -14px;
    top: 50%;
    transform: translateY(-50%);
    width: 3px;
    height: 14px;
    background: var(--kuk-main);
    border-radius: 2px;
}

/* --------------------------------------------------------------------------
   分页
   -------------------------------------------------------------------------- */
.kuk_pager {
    margin-top: 36px;
    text-align: center;
}

.kuk_pager .pagination {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    justify-content: center;
    margin: 0;
    padding: 0;
    list-style: none;
}

.kuk_pager .pagination li a,
.kuk_pager .pagination li span {
    display: block;
    min-width: 36px;
    padding: 7px 11px;
    border: 1px solid var(--kuk-line);
    border-radius: 3px;
    font-size: 14px;
    color: #555;
    background: #fff;
}

.kuk_pager .pagination li.active span,
.kuk_pager .pagination li a:hover {
    background: var(--kuk-main);
    border-color: var(--kuk-main);
    color: #fff;
}

/* --------------------------------------------------------------------------
   列表分页按钮（.kuk-pager，2026-10-18 起取代目标站 .digg 纯文本分页）
   由 Base::digg() 生成，产品/案例/搜索列表共用；居中展示
   -------------------------------------------------------------------------- */
.kuk-pager {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 8px;
    margin: 0 0 12px;
    padding-top: 44px;
    clear: both;
}

.kuk-pager-info {
    margin-right: 8px;
    font-size: 13px;
    color: var(--kuk-gray);
}

.kuk-pager-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 38px;
    height: 38px;
    padding: 0 14px;
    border: 1px solid var(--kuk-line);
    border-radius: 4px;
    background: #fff;
    font-size: 14px;
    color: #555;
    text-decoration: none;
    transition: all .2s;
}

a.kuk-pager-btn:hover {
    border-color: var(--kuk-main);
    color: var(--kuk-main);
}

.kuk-pager-btn.current {
    border-color: var(--kuk-main);
    background: var(--kuk-main);
    color: #fff;
    font-weight: 600;
}

.kuk-pager-btn.disabled {
    color: #bbb;
    background: #f7f7f8;
    border-color: #e8e8ea;
}

.kuk-pager-ellipsis {
    padding: 0 2px;
    color: #bbb;
    font-size: 14px;
}

@media screen and (max-width: 620px) {
    .kuk-pager { gap: 6px; padding-top: 32px; }
    .kuk-pager-info { width: 100%; margin: 0 0 2px; text-align: center; }
    .kuk-pager-btn { min-width: 34px; height: 34px; padding: 0 10px; font-size: 13px; }
}

/* --------------------------------------------------------------------------
   详情页
   -------------------------------------------------------------------------- */
.kuk_hero {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 36px;
    align-items: start;
    padding-bottom: 34px;
    margin-bottom: 32px;
    border-bottom: 1px solid var(--kuk-line);
}

.kuk_gallery_main {
    width: 100%;
    height: 430px;
    overflow: hidden;
    background: #f5f5f5;
    border: 1px solid var(--kuk-line);
}

.kuk_gallery_main img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.kuk_gallery_thumbs {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 10px;
}

.kuk_gallery_thumbs img {
    width: 74px;
    height: 74px;
    object-fit: cover;
    border: 2px solid transparent;
    cursor: pointer;
    background: #f5f5f5;
}

.kuk_gallery_thumbs img.active {
    border-color: var(--kuk-main);
}

.kuk_hero_info h1 {
    margin: 0 0 14px;
    font-size: 26px;
    font-weight: 600;
    line-height: 1.4;
}

.kuk_hero_info .kuk_summary {
    padding: 14px 16px;
    background: #fafafa;
    border-left: 3px solid var(--kuk-main);
    font-size: 14px;
    line-height: 1.9;
    color: #666;
    margin-bottom: 18px;
}

.kuk_hero_info .kuk_contact {
    font-size: 14px;
    line-height: 2;
    color: #666;
}

.kuk_hero_info .kuk_contact strong {
    color: var(--kuk-main);
}

.kuk_detail {
    font-size: 15px;
    line-height: 1.9;
    color: #444;
    word-break: break-word;
}

.kuk_detail table {
    max-width: 100%;
}

/* 新闻详情头部 */
.kuk_article_head {
    padding-bottom: 18px;
    margin-bottom: 24px;
    border-bottom: 1px solid var(--kuk-line);
    text-align: center;
}

.kuk_article_head h1 {
    margin: 0 0 12px;
    font-size: 24px;
    font-weight: 600;
    line-height: 1.5;
}

.kuk_article_head .kuk_meta {
    font-size: 13px;
    color: var(--kuk-gray);
}

/* 上下条 */
.kuk_related {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
    justify-content: space-between;
    margin-top: 40px;
    padding-top: 20px;
    border-top: 1px solid var(--kuk-line);
    font-size: 14px;
}

.kuk_related a {
    color: #555;
    max-width: 46%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.kuk_related a:hover {
    color: var(--kuk-main);
}

/* --------------------------------------------------------------------------
   留言表单
   -------------------------------------------------------------------------- */
.kuk_form {
    max-width: 720px;
    margin: 0 auto;
}

.kuk_form .form_row {
    display: flex;
    align-items: center;
    margin-bottom: 18px;
}

.kuk_form label {
    flex: 0 0 96px;
    font-size: 15px;
    color: #555;
}

.kuk_form label .req {
    color: var(--kuk-main);
}

.kuk_form input[type="text"],
.kuk_form input[type="email"],
.kuk_form input[type="tel"],
.kuk_form textarea {
    flex: 1;
    min-width: 0;
    padding: 10px 14px;
    border: 1px solid var(--kuk-line);
    border-radius: 3px;
    font-size: 14px;
    color: #333;
    outline: none;
    transition: border-color .2s;
}

.kuk_form input:focus,
.kuk_form textarea:focus {
    border-color: var(--kuk-main);
}

.kuk_form textarea {
    height: 150px;
    resize: vertical;
}

.kuk_form .form_btn {
    text-align: center;
    margin-top: 26px;
}

.kuk_form .form_btn button {
    min-width: 180px;
    padding: 12px 30px;
    border: none;
    border-radius: 3px;
    background: var(--kuk-main);
    color: #fff;
    font-size: 16px;
    cursor: pointer;
    transition: opacity .2s;
}

.kuk_form .form_btn button:hover {
    opacity: .88;
}

/* --------------------------------------------------------------------------
   响应式：与目标站断点(980 / 768 / 620)保持一致
   -------------------------------------------------------------------------- */
@media screen and (max-width: 1020px) {
    .kuk_grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 18px;
    }

    .kuk_newslist {
        grid-template-columns: 1fr;
    }

    .kuk_hero {
        grid-template-columns: 1fr;
        gap: 22px;
    }

    .kuk_gallery_main {
        height: 340px;
    }

    .kuk_banner {
        padding: 40px 0;
    }

    .kuk_banner h1 {
        font-size: 26px;
    }
}

@media screen and (max-width: 768px) {
    .kuk_wrap {
        padding: 18px 12px 40px;
    }

    .kuk_card_pic {
        height: 200px;
    }

    .kuk_hero_info h1 {
        font-size: 21px;
    }

    .kuk_article_head h1 {
        font-size: 19px;
    }

    .kuk_detail {
        font-size: 14px;
    }

    .kuk_form .form_row {
        display: block;
    }

    .kuk_form label {
        display: block;
        margin-bottom: 6px;
    }

    .kuk_form input,
    .kuk_form textarea {
        width: 100%;
    }

    .kuk_related a {
        max-width: 100%;
        white-space: normal;
    }
}

@media screen and (max-width: 620px) {
    .kuk_grid {
        grid-template-columns: 1fr;
    }

    .kuk_banner {
        padding: 30px 0;
    }

    .kuk_banner h1 {
        font-size: 21px;
    }

    .kuk_gallery_main {
        height: 260px;
    }

    .kuk_newsitem {
        display: block;
    }

    .kuk_newsitem_pic {
        width: 100%;
        height: 180px;
        margin-bottom: 12px;
    }

    .kuk_tabs {
        gap: 8px;
    }

    .kuk_tabs a {
        padding: 6px 14px;
        font-size: 13px;
    }
}

/* --------------------------------------------------------------------------
   顶部导航改为 7 项（客户新导航：首页/关于我们/产品中心/其他实例/信息发布/
   相关参数下载/联系我们）

   目标站原导航 4 项、间距 7rem(1148px 断点下 4rem)，7 项时会超出容器被压缩，
   中文逐字竖排换行。改为：
   - ≤1400px：header_dao 宽度固定 56%，margin 清零，间距由 .nav 的
     space-between 自动分配（越窄越紧凑，实测 1021px 下仍有 11px 间隙）
   - >1400px：header_dao 按内容收缩，用 5rem 固定间距提供项间隔
   nowrap 兜底：任何情况下菜单文字都不逐字竖排
   -------------------------------------------------------------------------- */
.nav .nLi {
    margin-left: 0;
    white-space: nowrap;
}

.nav .nLi h3 a p {
    white-space: nowrap;
}

@media screen and (min-width: 1401px) {
    .nav .nLi {
        margin-left: 5rem;
    }

    .nav .nLi:nth-child(1) {
        margin-left: 0;
    }
}

/* ==========================================================================
   首页主横幅文字浮层（明亮摄影风配图 + HTML 文字，替代旧版烧在图里的文字）
   配图：PC 2048x536 主体在右、左侧留白；移动端(≤620px) 1536x1024 主体居中。
   设计：平实的工业 B2B 排版——深墨蓝文字 + 细描边标签，无发光/无渐变字。
   作用域全部限定在首页 .banner 内，不影响内页同结构的深色 .slideBox 横幅。
   ========================================================================== */
.banner .slideBox .bd a {
    display: block;
    position: relative;
}

.banner .bn-cap {
    position: absolute;
    left: 7%;
    top: 50%;
    transform: translateY(-50%);
    max-width: 46%;
    z-index: 2;
    color: #1f2d3d;
    font-family: -apple-system, "Segoe UI", "PingFang SC", "Microsoft YaHei", sans-serif;
}

.banner .bn-kicker {
    font-size: clamp(12px, 0.78vw, 15px);
    letter-spacing: 0.16em;
    color: #0796e5;
    font-weight: 600;
    margin: 0 0 10px;
}

.banner .bn-title {
    font-size: clamp(22px, 2.1vw, 40px);
    font-weight: 700;
    line-height: 1.25;
    margin: 0 0 12px;
    color: #1f2d3d;
}

.banner .bn-sub {
    font-size: clamp(13px, 1vw, 19px);
    line-height: 1.5;
    color: #3d4e60;
    margin: 0 0 10px;
    font-weight: 500;
}

.banner .bn-desc {
    font-size: clamp(11px, 0.75vw, 14px);
    line-height: 1.7;
    color: #5b6b7b;
    margin: 0 0 16px;
    max-width: 34em;
}

.banner .bn-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.banner .bn-chips span {
    display: inline-block;
    border: 1px solid rgba(31, 45, 61, 0.28);
    border-radius: 2px;
    padding: 5px 14px;
    font-size: clamp(11px, 0.73vw, 14px);
    color: #1f2d3d;
    background: rgba(255, 255, 255, 0.45);
    line-height: 1.4;
    white-space: nowrap;
}

.banner .bn-stats {
    display: flex;
    flex-wrap: wrap;
    gap: 26px;
}

.banner .bn-stats span {
    display: flex;
    flex-direction: column;
    font-size: clamp(10px, 0.68vw, 13px);
    color: #5b6b7b;
    line-height: 1.5;
}

.banner .bn-stats b {
    font-size: clamp(16px, 1.25vw, 24px);
    color: #0796e5;
    font-weight: 700;
    line-height: 1.3;
}

/* 明亮配图上的翻页圆点：原近白点在浅色图上不可见，改为半透明墨色，激活用站内蓝 */
.banner .slideBox .hd ul li i {
    background: rgba(31, 45, 61, 0.32);
}

.banner .slideBox .hd ul li.on i {
    background: var(--kuk-main);
}

.banner .slideBox .hd ul li .vs-wave path {
    fill: rgba(31, 45, 61, 0.1);
    stroke: rgba(31, 45, 61, 0.1);
}

/* 平板：整体缩小一档 */
@media screen and (max-width: 1020px) {
    .banner .bn-cap {
        left: 5%;
        max-width: 56%;
    }

    .banner .bn-desc {
        display: none;
    }

    /* 原站 .hd 圆点 margin 0 35px：5 个点总宽 390px，超过 .hd(left:50%，
       收缩宽度≈视口一半)会换行掉出横幅被裁掉；≤1020px 起缩小间距保证单行 */
    .banner .slideBox .hd ul li {
        margin: 0 12px;
    }
}

/* 手机（同时切换为 3:2 竖版配图）：文字收紧放左上，主体在中下部不被遮挡 */
@media screen and (max-width: 620px) {
    .banner .bn-cap {
        top: 8%;
        left: 6%;
        transform: none;
        max-width: 84%;
    }

    .banner .bn-kicker {
        font-size: 10px;
        margin-bottom: 5px;
    }

    .banner .bn-title {
        font-size: 20px;
        margin-bottom: 6px;
    }

    .banner .bn-sub {
        font-size: 13px;
        margin-bottom: 9px;
    }

    .banner .bn-chips {
        gap: 6px;
    }

    .banner .bn-chips span {
        padding: 3px 10px;
        font-size: 11px;
        background: rgba(255, 255, 255, 0.62);
    }

    .banner .bn-stats {
        gap: 14px;
    }

    .banner .bn-stats b {
        font-size: 16px;
    }

    .banner .bn-stats span {
        font-size: 10px;
    }

    .banner .slideBox .hd ul li {
        margin: 0 10px;
    }
}

/* =====================================================================
   页脚「精密仪器刻度风」（class 前缀 ftr-，2026-10-18 设计）
   ---------------------------------------------------------------------
   - 首页/内页共用（模板 kuk/common/footer.html，外层为 div 而非 <footer>
     标签，避免 style.css 的 <footer> 移动端固定黑条规则命中）
   - 视觉对齐首页 hb- 体系：深夜蓝 #101820 底 + 科技蓝 #0796e5 点缀 +
     等宽编号 kicker；hover 亮蓝 #5ebdf2 并右移，与 hb-more 动效同语言
   - .ftr-scale 为温度刻度装饰线（纯 CSS，无图片）：刻度位置按
     -80~1500℃ 真实比例映射（500→36.7%、1000→68.4%），两端渐隐
   - 目标站移动端版权条(sj_copy)与固定黑 Tab 栏(footer_tag)已停用，
     body 的移动端底部留白随之归零
   ===================================================================== */
.ftr {
    background: #101820;
    color: rgba(255, 255, 255, .62);
    padding: 62px 0 0;
    font-family: "Helvetica Neue", Arial, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif;
}
.ftr a { text-decoration: none; color: inherit; transition: color .2s, transform .2s; }
.ftr h4 { margin: 0; font-weight: bold; }

.ftr-grid {
    display: grid;
    grid-template-columns: 1.5fr 1fr 1fr 1.2fr;
    gap: 48px;
    padding-bottom: 46px;
}

/* 2026-10-17 logo 改为无背景：白底牌子已移除，用全白剪影版
   (home/logo-footer.png) 直接浮在深色页脚上 */
.ftr-logo { display: inline-block; }
.ftr-logo img { display: block; height: 30px; width: auto; }
.ftr-slogan {
    margin-top: 18px;
    font-size: 13px;
    letter-spacing: 1.5px;
    color: rgba(255, 255, 255, .55);
}

/* ---- 温度刻度装饰线 ---- */
.ftr-scale {
    position: relative;
    height: 28px;
    margin-top: 24px;
    max-width: 340px;
}
/* 基线：两端渐隐 */
.ftr-scale::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 1px;
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .28) 10%, rgba(255, 255, 255, .28) 90%, transparent);
}
/* 小刻度：每 24px 一根，两端随基线渐隐 */
.ftr-scale::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 4px;
    background-image: repeating-linear-gradient(90deg, rgba(255, 255, 255, .22) 0 1px, transparent 1px 24px);
    -webkit-mask-image: linear-gradient(90deg, transparent, #000 10%, #000 90%, transparent);
    mask-image: linear-gradient(90deg, transparent, #000 10%, #000 90%, transparent);
}
/* 主刻度：4 根蓝色长刻度，位置按 -80/500/1000/1500℃ 比例 */
.ftr-scale i {
    position: absolute;
    top: 0;
    width: 1px;
    height: 8px;
    background: #0796e5;
}
.ftr-scale i:nth-child(1) { left: 0; }
.ftr-scale i:nth-child(2) { left: 36.7%; }
.ftr-scale i:nth-child(3) { left: 68.4%; }
.ftr-scale i:nth-child(4) { left: 100%; }
/* 刻度标注：等宽数字，仪器面板感 */
.ftr-scale span {
    position: absolute;
    top: 13px;
    font-family: Consolas, Monaco, "Courier New", monospace;
    font-size: 10px;
    letter-spacing: .5px;
    color: rgba(255, 255, 255, .42);
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}
.ftr-scale span:nth-child(5) { left: 0; }
.ftr-scale span:nth-child(6) { left: 36.7%; transform: translateX(-50%); }
.ftr-scale span:nth-child(7) { left: 68.4%; transform: translateX(-50%); }
.ftr-scale span:nth-child(8) { left: 100%; transform: translateX(-100%); }

.ftr-hotline { margin-top: 26px; }
.ftr-label {
    display: block;
    font-size: 12px;
    letter-spacing: 2px;
    color: rgba(255, 255, 255, .5);
    margin-bottom: 6px;
}
.ftr-tel {
    font-size: 26px;
    font-weight: bold;
    color: #fff;
    letter-spacing: 1px;
    font-variant-numeric: tabular-nums;
}
.ftr-tel:hover { color: #5ebdf2; }

/* ---- 分栏：编号 kicker + 链接 ---- */
.ftr-heading { font-size: 15px; color: #fff; margin-bottom: 18px; }
.ftr-num {
    display: inline-block;
    margin-right: 10px;
    font-family: Consolas, Monaco, "Courier New", monospace;
    font-size: 12px;
    font-weight: normal;
    letter-spacing: 1px;
    color: #0796e5;
    vertical-align: 1px;
}
.ftr-col a {
    display: block;
    font-size: 13.5px;
    line-height: 2.15;
    color: rgba(255, 255, 255, .62);
}
.ftr-col a:hover { color: #5ebdf2; transform: translateX(3px); }
.ftr-col .ftr-all { margin-top: 6px; color: #5ebdf2; }
.ftr-col .ftr-all:hover { color: #fff; }
.ftr-addr {
    margin: 0 0 14px;
    font-size: 13.5px;
    line-height: 1.9;
    color: rgba(255, 255, 255, .62);
}
.ftr .ftr-msg { color: #5ebdf2; }
.ftr .ftr-msg:hover { color: #fff; }

.ftr-bottom {
    border-top: 1px solid rgba(255, 255, 255, .12);
    padding: 22px 0 26px;
    display: flex;
    flex-wrap: wrap;
    gap: 6px 28px;
    justify-content: center;
    align-items: center;
    font-size: 12.5px;
    color: rgba(255, 255, 255, .58);
}
.ftr-bottom a:hover { color: #5ebdf2; }

@media screen and (max-width: 1020px) {
    /* 目标站在此断点隐藏 .footer 并依赖固定黑 Tab 栏(body 底部留白 75px)；
       新页脚响应式展示，黑 Tab 栏已停用，留白归零避免页尾悬空 */
    body { padding-bottom: 0; }
    .ftr { padding-top: 48px; }
    .ftr-grid { grid-template-columns: 1fr 1fr; gap: 34px 40px; }
    .ftr-brand { grid-column: 1 / -1; }
}

@media screen and (max-width: 768px) {
    .ftr-scale { max-width: 100%; }
}

@media screen and (max-width: 620px) {
    .ftr-grid { grid-template-columns: 1fr; gap: 30px; padding-bottom: 34px; }
    .ftr-brand { grid-column: auto; }
    .ftr-tel { font-size: 22px; }
    /* 刻度线简化为单段短蓝线（小屏放不下完整刻度尺） */
    .ftr-scale { height: 2px; max-width: none; }
    .ftr-scale::before { right: auto; width: 56px; background: #0796e5; }
    .ftr-scale::after,
    .ftr-scale i,
    .ftr-scale span { display: none; }
    .ftr-bottom { flex-direction: column; gap: 6px; text-align: center; }
}

/* 导航栏左侧 logo 放大：目标站 .h_logo 只给 17% 容器宽，原图 410×49 被压到
   1440 下 221×26px；放宽到 26% 后为 338×40px。1300 容器减去右侧导航实测
   868px 仍余 94px 间距，菜单项不会被挤压。 */
.h_logo { width: 26%; }

/* =====================================================================
   悬浮工具栏 2026-10-17 重新设计（class 前缀 tbar-）
   ---------------------------------------------------------------------
   - 取代目标站 .lxfx（固克红竖条），深色浮层 + 科技蓝 hover，图标为内联 SVG
   - 右侧悬浮、垂直居中、离边 16px 圆角浮卡；电话项 hover 向左弹出号码牌
   - 断点沿用原 .lxfx：≤1280px 隐藏（index.js 的旧 .lxfx 动画选择器已空转）
   ===================================================================== */
.tbar {
    position: fixed;
    right: 16px;
    top: 50%;
    transform: translateY(-50%);
    z-index: 8; /* 低于 .header_nav(9)：下拉卡片展开时不能被工具条切出缺口 */
    width: 64px;
    background: #1f2d3d;
    border-radius: 10px;
    box-shadow: 0 10px 30px rgba(15, 25, 40, .25);
}
.tbar-item {
    display: block;
    width: 100%;
    padding: 13px 0 11px;
    background: transparent;
    border: 0;
    cursor: pointer;
    position: relative;
    text-align: center;
    color: rgba(255, 255, 255, .82);
    text-decoration: none;
    font-family: inherit;
    transition: background .2s, color .2s;
}
.tbar-item + .tbar-item { border-top: 1px solid rgba(255, 255, 255, .1); }
.tbar-item:first-child { border-radius: 10px 10px 0 0; }
.tbar-item:last-child { border-radius: 0 0 10px 10px; }
.tbar-item svg {
    display: block;
    width: 22px;
    height: 22px;
    margin: 0 auto 5px;
}
.tbar-txt {
    display: block;
    font-size: 11px;
    letter-spacing: .5px;
}
.tbar-item:hover { background: #0796e5; color: #fff; }

/* 电话项 hover 向左弹出号码牌 */
.tbar-pop {
    position: absolute;
    right: calc(100% + 12px);
    top: 50%;
    transform: translateY(-50%) translateX(8px);
    background: #1f2d3d;
    color: #fff;
    font-size: 13px;
    letter-spacing: 1px;
    padding: 9px 16px;
    border-radius: 6px;
    white-space: nowrap;
    opacity: 0;
    visibility: hidden;
    transition: opacity .25s, transform .25s, visibility .25s;
    box-shadow: 0 6px 18px rgba(15, 25, 40, .28);
}
.tbar-pop::after {
    content: "";
    position: absolute;
    left: 100%;
    top: 50%;
    margin-top: -5px;
    border: 5px solid transparent;
    border-left-color: #1f2d3d;
}
.tbar-item:hover .tbar-pop {
    opacity: 1;
    visibility: visible;
    transform: translateY(-50%) translateX(0);
}

@media screen and (max-width: 1280px) {
    .tbar { display: none; }
}

/* 移动端头部同一张 logo 放大：原 .logo 只占 40% 宽，375 下仅 142×17px。
   加宽到 65% 并用 max-height 兜底，保证不超过 60px 高的头部条(等比缩放)；
   375 下盒宽 231px，仍在汉堡按钮(x≈340)左侧。 */
@media screen and (max-width: 1020px) {
    .logo { width: 65%; }
    .logo img { max-width: 100%; max-height: 48px; width: auto; height: auto; }
}

/* ============================================================================
   导航下拉二级菜单 · 重新设计
   ----------------------------------------------------------------------------
   原状(目标站同款)：.sub 是通栏 100% 宽的白色 fixed 面板 + 950px 居中内容 +
   左侧 40px 大字标题，一眼就是照搬。这里改成与页面容器对齐的「漂浮卡片」：
   .sub 保留 fixed/100% 宽(SuperSlide 按 opacity fade 显隐它)，只当透明托板，
   真正的面板画在 .nav_xiao 上。

   色板  墨蓝 #16222e · 科技蓝 #0796e5(与悬浮工具栏同色) · 淡蓝底 #eef6fd · 细线 #eef2f7
   签名  ① 面板顶部 3px 渐变描边 ② 左栏英文小标 + 竖分隔线
        ③ 链接 hover 时从左侧「生长」出来的蓝色短轨
   ========================================================================== */

/* --- 托板：去掉通栏白底与阴影，留出卡片悬浮所需的空隙 --- */
.nav .sub {
    background: transparent;
    box-shadow: none;
    padding: 14px 0 12px;
}

/* --- 卡片本体：与 .container 同宽(1300 / ≤1280 时 90%)，左右两栏 --- */
.nav_xiao {
    width: 1300px;
    max-width: calc(100% - 48px);
    margin: 0 auto;
    box-sizing: border-box;
    display: grid;
    grid-template-columns: 300px minmax(0, 1fr);
    gap: 34px;
    padding: 26px 28px;
    background: #fff;
    border: 1px solid #e7edf4;
    border-radius: 16px;
    box-shadow: 0 26px 60px -20px rgba(15, 30, 48, .38);
    position: relative;
    overflow: hidden;
}
@media screen and (max-width: 1280px) {
    .nav_xiao { width: 90%; }
}

/* 顶部渐变描边（面板签名之一） */
.nav_xiao::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 3px;
    background: linear-gradient(90deg, #0796e5 0%, #5ebdf2 48%, rgba(94, 189, 242, 0) 100%);
}

/* --- 左栏：章节标签 + 链接列表，右侧竖细线与内容分隔 --- */
.nav_xiao .sub_left,
.nav_xiao .xiao_six_l {
    float: none;
    width: auto;
    box-sizing: border-box;
    padding-right: 28px;
    border-right: 1px solid #eef2f7;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
}
.nav_xiao .sub_left::before,
.nav_xiao .xiao_six_l::before {
    content: "NAVIGATE";
    display: block;
    width: 100%;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .22em;
    color: #0796e5;
    margin-bottom: 10px;
}
.nav_xiao .sub_left {
    font-size: 22px;
    line-height: 1.35;
    font-weight: 600;
    color: #16222e;
    letter-spacing: .02em;
}
.nav_xiao .sub_left::after {
    content: "认识团队、文化与社会责任";
    display: block;
    width: 100%;
    margin-top: 14px;
    font-size: 13px;
    line-height: 1.8;
    font-weight: 400;
    letter-spacing: .02em;
    color: #7c8a99;
}
.nav_xiao .xiao_six_l::after {
    display: block;
    width: 100%;
    font-size: 22px;
    line-height: 1.35;
    font-weight: 600;
    color: #16222e;
    margin-bottom: 14px;
}
.nav_xiao .nav_qy::before { content: "PRODUCTS"; }
.nav_xiao .nav_qy::after  { content: "产品中心"; }
.nav_xiao .nav_jt::before { content: "CASES"; }
.nav_xiao .nav_jt::after  { content: "其他实例"; }

/* --- 左栏链接行：hover / 选中时淡蓝底 + 左侧生长的蓝色短轨 --- */
.nav_xiao .xiao_six_l a {
    position: relative;
    display: block;
    box-sizing: border-box;
    width: 100%;
    height: 42px;
    line-height: 42px;
    padding: 0 12px 0 16px;
    margin-bottom: 2px;
    font-size: 15px;
    color: #46545f;
    border-radius: 9px;
    transition: background .22s ease, color .22s ease;
}
.nav_xiao .xiao_six_l a::before {
    content: "";
    position: absolute;
    left: 6px;
    top: 50%;
    width: 3px;
    height: 0;
    margin-top: -8px;
    border-radius: 2px;
    background: #0796e5;
    transition: height .22s ease;
}
.nav_xiao .xiao_six_l a:hover,
.nav_xiao .xiao_six_l .osel {
    background: #eef6fd;
    color: #0796e5;
}
.nav_xiao .xiao_six_l a:hover::before,
.nav_xiao .xiao_six_l .osel::before {
    height: 16px;
}

/* 产品中心左栏只有「全部产品」一条，做成主按钮而不是列表项 */
.nav_xiao .xiao_six_l > a:only-child {
    margin-top: 8px;
    height: 40px;
    line-height: 40px;
    padding: 0 16px;
    text-align: center;
    font-weight: 600;
    color: #fff;
    background: #0796e5;
    border-radius: 999px;
}
.nav_xiao .xiao_six_l > a:only-child::before { display: none; }
.nav_xiao .xiao_six_l > a:only-child:hover { background: #0a76c9; color: #fff; }

/* --- 右栏：统一的图片卡网格（关于页 6 张 / 产品 6 张 / 实例按分组切换） --- */
.nav_xiao .sub_right {
    float: none;
    width: auto;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 16px;
    align-content: start;
}
.nav_xiao .sub_right dl {
    display: contents;
    width: auto;
    margin: 0;
    overflow: visible;
}
.nav_xiao .sub_right dt,
.nav_xiao .sub_right dd {
    float: none;
    width: auto;
    height: 152px;
    position: relative;
    overflow: hidden;
    border-radius: 12px;
    background: #eef2f7;
}
.nav_xiao .sub_right dl img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform .45s ease;
}
.nav_xiao .sub_right dt:hover img,
.nav_xiao .sub_right dd:hover img {
    transform: scale(1.06);
}

.nav_xiao .xiao_six_r {
    float: none;
    width: auto;
}
.nav_xiao .xiao_six_r > .xiao_li { width: 100%; }
.nav_xiao .xiao_two {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 16px;
    overflow: visible;
}
.nav_xiao .xiao_two li {
    float: none;
    width: auto;
    margin: 0;
    height: 152px;
    overflow: hidden;
    border-radius: 12px;
    /* 深色兜底：实例菜单里有几张图缺失的卡片，靠它保证白字可读 */
    background: #16222e;
}
.nav_xiao .xiao_two li img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform .45s ease;
}
/* 产品中心/其他实例下拉卡片：图片按 1.2:1 完整呈现，卡片高度随图片自适应，
   不再固定 152px 裁切 */
.nav_xiao .nav_qy_r .xiao_two li,
.nav_xiao .nav_jt_r .xiao_two li {
    height: auto;
}
.nav_xiao .nav_qy_r .xiao_two li img,
.nav_xiao .nav_jt_r .xiao_two li img {
    height: auto;
}
.nav_xiao .xiao_two li:hover img {
    transform: scale(1.06);
}

/* 实例菜单：初始只显示第一组，其余交给 index.js 的 hover 切换(inline style 优先) */
.nav_xiao .nav_jt_r > .xiao_li + .xiao_li { display: none; }

/* 实例菜单左侧只保留有内容的两个分组（安彩别墅焕新 / DIY改色漆）。
   第 3 项起是目标站遗留分类，本站没有对应面板，hover 出来是一片空白。 */
.nav_xiao .nav_jt > a:nth-child(n+3) { display: none; }

/* 图缺失时不渲染碎图标 */
.nav_xiao .sub img[src=""] { display: none; }

/* --- 卡片标题：图片底部深色渐变条，hover 时轻微下探 --- */
.nav_xiao .sub_title {
    box-sizing: border-box;
    height: auto;
    line-height: 1.5;
    padding: 30px 12px 11px;
    color: #fff;
    font-size: 14px;
    background: linear-gradient(180deg, rgba(16, 32, 48, 0) 0%, rgba(16, 32, 48, .85) 60%);
    transition: padding-bottom .3s ease;
}
.nav_xiao .sub_title h4 {
    margin: 0;
    font-size: 14px;
    font-weight: 600;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.nav_xiao dt:hover .sub_title,
.nav_xiao dd:hover .sub_title,
.nav_xiao .xiao_two li:hover .sub_title {
    padding-bottom: 16px;
}

/* --- 键盘可达性与减弱动效 --- */
.nav_xiao a:focus-visible {
    outline: 2px solid #0796e5;
    outline-offset: 2px;
}
@media (prefers-reduced-motion: reduce) {
    .nav_xiao * { transition: none !important; }
}

/* --- 导航条目 hover / 当前栏目：文字下方的蓝色短线，与面板描边呼应 --- */
.nav .nLi h3 a { display: block; }
.nav .nLi h3 a::after {
    content: "";
    position: absolute;
    left: 50%;
    bottom: 15px;
    width: 28px;
    height: 3px;
    border-radius: 2px;
    background: #0796e5;
    opacity: 0;
    transform: translateX(-50%) scaleX(.4);
    transition: opacity .2s ease, transform .25s ease;
}
.nav .nLi:hover h3 a::after,
.nav .nLi.active h3 a::after {
    opacity: 1;
    transform: translateX(-50%) scaleX(1);
}

/* ============================================================================
   内页 banner（1920x640 = 3:1 重新生成图）移动端适配
   ----------------------------------------------------------------------------
   桌面与平板保持 height:auto 完整呈现、不做任何裁切；只有当图片按宽度算下来
   不足 150px 高时（约 450px 以下的手机）才用 object-fit:cover 抬到 150px，
   被裁掉的只是生成图左右预留的空白边距，主体居中不受影响，也不会糊。
   ========================================================================== */
@media screen and (max-width: 1020px) {
    .ny_banner .slideBox .bd img {
        min-height: 150px;
        object-fit: cover;
        object-position: center;
    }
}

/* ============================================================================
   关于我们页(/about) banner 以下图文区（2026-10-18 重新设计）
   ----------------------------------------------------------------------------
   区块顺序：公司介绍(左文右图) → 信念横幅 → 关键参数 → 主营方向 → 产品卡片
   kuk 页面不加载 Bootstrap，栅格手写：桌面 3 列 → 平板 2 列 → 手机 1 列；
   断点与全站 style.css 一致(1020/768/620)。内容编排在 application/extra/kuk.php。
   ========================================================================== */

/* 小节标题：左侧红条 + 文案（与首页 .kuk_section_head 同一视觉语言） */
.ab-h {
    position: relative;
    margin: 0 0 22px;
    padding-left: 13px;
    font-size: 22px;
    font-weight: 600;
    line-height: 1.3;
    color: #333;
}

.ab-h::before {
    content: "";
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 4px;
    height: 20px;
    background: var(--kuk-main);
    border-radius: 2px;
}

/* --- 公司介绍：左文右图，窄屏上下堆叠 --- */
.ab-intro {
    display: flex;
    align-items: flex-start;
    gap: 42px;
    margin-bottom: 46px;
}

.ab-intro-text {
    flex: 1 1 56%;
    min-width: 0;
}

.ab-intro-text p {
    margin: 0 0 14px;
    font-size: 15px;
    line-height: 1.9;
    color: #555;
}

.ab-intro-pic {
    flex: 0 0 40%;
    min-width: 0;
}

.ab-intro-pic img {
    display: block;
    width: 100%;
    height: auto;
    box-shadow: 0 8px 24px rgba(0, 0, 0, .10);
}

/* --- 公司信念横幅：红底白字四宫格 --- */
.ab-beliefs {
    margin-bottom: 46px;
}

.ab-beliefs ul {
    display: flex;
    flex-wrap: wrap;
    margin: 0;
    padding: 24px 0;
    list-style: none;
    background: linear-gradient(115deg, var(--kuk-main) 0%, #0e5fa0 100%);
}

.ab-beliefs li {
    position: relative;
    flex: 1 1 25%;
    text-align: center;
    color: #fff;
    font-size: 26px;
    font-weight: 600;
    letter-spacing: 6px;
    text-indent: 6px; /* 抵消末字符的字距，保证视觉居中 */
}

.ab-beliefs li + li::before {
    content: "";
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 1px;
    height: 26px;
    background: rgba(255, 255, 255, .35);
}

/* --- 关键参数数字条 --- */
.ab-stats {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
    margin-bottom: 46px;
}

.ab-stat {
    padding: 24px 12px;
    text-align: center;
    background: #f4f8fb;
    border-top: 3px solid var(--kuk-main);
}

.ab-stat-num {
    font-size: 40px;
    font-weight: 700;
    line-height: 1.2;
    color: var(--kuk-main);
}

.ab-stat-num em {
    margin-left: 4px;
    font-size: 18px;
    font-style: normal;
}

.ab-stat-label {
    margin-top: 8px;
    font-size: 14px;
    color: var(--kuk-gray);
}

/* --- 主营方向：序号卡片栅格 --- */
.ab-sec {
    margin-bottom: 46px;
}

.ab-dirs {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 18px;
    margin: 0;
    padding: 0;
    list-style: none;
    counter-reset: abdir;
}

.ab-dirs li {
    counter-increment: abdir;
    position: relative;
    padding: 18px 18px 18px 60px;
    background: #fff;
    border: 1px solid var(--kuk-line);
    transition: box-shadow .25s, transform .25s, border-color .25s;
}

.ab-dirs li::before {
    content: counter(abdir, decimal-leading-zero);
    position: absolute;
    left: 18px;
    top: 17px;
    font-size: 22px;
    font-weight: 700;
    line-height: 1.3;
    color: var(--kuk-main);
}

.ab-dirs li:hover {
    border-color: #cfe7f8;
    box-shadow: 0 10px 26px rgba(0, 0, 0, .08);
    transform: translateY(-3px);
}

.ab-dirs h5 {
    margin: 0 0 6px;
    font-size: 16px;
    font-weight: 600;
    color: var(--kuk-text);
}

.ab-dirs p {
    margin: 0;
    font-size: 13px;
    line-height: 1.7;
    color: var(--kuk-gray);
}

/* --- 产品图文卡片：桌面 3 列 → 平板 2 列 → 手机 1 列 --- */
.ab-cards {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
}

.ab-card {
    display: flex;
    flex-direction: column;
    background: #fff;
    border: 1px solid var(--kuk-line);
    overflow: hidden;
    color: inherit;
    transition: box-shadow .25s, transform .25s;
}

.ab-card:hover {
    box-shadow: 0 10px 26px rgba(0, 0, 0, .1);
    transform: translateY(-3px);
    text-decoration: none;
}

.ab-card-pic {
    display: block;
    width: 100%;
    height: 210px;
    overflow: hidden;
    background: #f5f5f5;
}

.ab-card-pic img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform .4s;
}

.ab-card:hover .ab-card-pic img {
    transform: scale(1.05);
}

.ab-card-txt {
    display: block;
    flex: 1;
    padding: 16px;
    text-align: center;
}

.ab-card-txt strong {
    display: block;
    font-size: 16px;
    font-weight: 500;
    color: var(--kuk-text);
}

.ab-card-txt em {
    display: block;
    min-height: 42px;
    margin-top: 8px;
    font-size: 13px;
    font-style: normal;
    line-height: 1.6;
    color: var(--kuk-gray);
}

.ab-card-more {
    display: block;
    margin-top: 10px;
    font-size: 13px;
    font-style: normal;
    color: var(--kuk-main);
}

/* 末尾"更多产品"格：虚线占位，补齐 3+2+1 的网格 */
.ab-card-all {
    align-items: center;
    justify-content: center;
    padding: 30px 16px;
    text-align: center;
    background: #fafafa;
    border-style: dashed;
}

.ab-card-all strong {
    font-size: 18px;
    font-weight: 600;
    color: var(--kuk-text);
}

.ab-card-all i {
    margin-top: 10px;
    font-size: 13px;
    font-style: normal;
    color: var(--kuk-main);
}

/* --- 平板 --- */
@media screen and (max-width: 1020px) {
    .ab-intro {
        gap: 24px;
    }

    .ab-stat-num {
        font-size: 32px;
    }
}

/* --- 窄平板：介绍区改上下堆叠、主营方向 2 列 --- */
@media screen and (max-width: 768px) {
    .ab-intro {
        flex-direction: column;
        gap: 20px;
    }

    .ab-intro-text,
    .ab-intro-pic {
        flex: none;
        width: 100%;
    }

    .ab-dirs {
        grid-template-columns: repeat(2, 1fr);
    }

    .ab-cards {
        grid-template-columns: repeat(2, 1fr);
    }

    .ab-beliefs li {
        font-size: 22px;
    }
}

/* --- 手机：信念 2x2、参数纵排、卡片单列 --- */
@media screen and (max-width: 620px) {
    .ab-h {
        margin-bottom: 16px;
        font-size: 18px;
    }

    .ab-intro,
    .ab-beliefs,
    .ab-stats,
    .ab-sec {
        margin-bottom: 32px;
    }

    .ab-beliefs ul {
        padding: 0;
    }

    .ab-beliefs li {
        flex: 1 1 50%;
        padding: 16px 0;
        font-size: 20px;
    }

    /* 2x2：第 3 项是第二行行首，去掉它前面的竖线；二三行之间补横线 */
    .ab-beliefs li:nth-child(3)::before {
        display: none;
    }

    .ab-beliefs li:nth-child(n+3) {
        border-top: 1px solid rgba(255, 255, 255, .25);
    }

    .ab-stats {
        grid-template-columns: 1fr;
        gap: 12px;
    }

    .ab-stat-num {
        font-size: 30px;
    }

    .ab-dirs,
    .ab-cards {
        grid-template-columns: 1fr;
    }

    .ab-card-pic {
        height: 200px;
    }
}

/* --------------------------------------------------------------------------
   移动端抽屉菜单：产品中心二级菜单加缩略图（#hamburgermenu 样式在目标站
   style.css 中，此处只做增量覆盖，不动原文件）
   -------------------------------------------------------------------------- */
#hamburgermenu .menu_body a.mb_prod {
    display: flex;
    align-items: center;
    gap: 10px;
    height: auto;
    min-height: 56px;
    line-height: 1.35;
    padding: 8px 12px 8px 1em;
    box-sizing: border-box;
    white-space: normal;
}

#hamburgermenu .menu_body a.mb_prod img {
    width: 64px;
    height: 48px;
    flex: 0 0 64px;
    object-fit: cover;
    border-radius: 2px;
    background: rgba(255, 255, 255, .85);
}

/* --------------------------------------------------------------------------
   其他实例(/cases) 卡片网格 2026-10-19
   目标站 .ny_product_right ul li 是 float + 31.3% + nth-child(3n) 的写法，
   依赖「所有卡片等高」才能对齐；换成本地自建案例数据后（封面 4:3 与 1.2:1
   混排）卡片高度 302/327px 不一，导致错行、第 2/3 列贴边、行距 7~58px 乱跳。
   仅在 .ny-cases-page（列表模板根节点）作用域内改为等宽等高 grid：
   封面统一 4:3（object-fit: cover 裁切），卡片间距固定，不随内容挤压。
   -------------------------------------------------------------------------- */
.ny-cases-page .ny_product_right ul {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    column-gap: 3%;
    row-gap: 32px;
    margin-top: 50px;
}

.ny-cases-page .ny_product_right ul li {
    width: auto;
    float: none;
    margin: 0;
    min-width: 0; /* grid 轨道默认 minmax(auto,1fr)，nowrap 的 h3 会把列撑宽 */
}

.ny-cases-page .ny_product_pic {
    aspect-ratio: 4 / 3;
}

.ny-cases-page .ny_product_pic img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

@media screen and (max-width: 620px) {
    .ny-cases-page .ny_product_right ul {
        grid-template-columns: repeat(2, 1fr);
        column-gap: 4%;
        row-gap: 20px;
    }
}

/* --------------------------------------------------------------------------
   其他实例根页锚点 2026-10-19
   行业中间页删除、列表只保留有实拍封面的 6 张卡片后，行业锚点 id=cat-{栏目id}
   直接挂在该行业第一张卡片上（顶部下拉/移动端菜单/侧栏/详情页返回都指向它）。
   锚点跳转时留一点上边距，别贴死视口顶部。
   -------------------------------------------------------------------------- */
.ny-cases-page .ny_product_right ul li[id^="cat-"] {
    scroll-margin-top: 20px;
}

/* ============================================================================
   产品详情页重新设计（2026-10-19，作用域 .pd-*，容器为 .ny_product .container）
   ----------------------------------------------------------------------------
   不再沿用目标站「21% 侧栏 + #newsfoot 内联表格」结构，改为：
   面包屑 → 分类胶囊 tab → 全宽 hero(图集 | 决策区) → 产品特点 → 相关产品 → 上下条。
   复用既有词汇：.kuk_crumb .kuk_tabs .kuk_hero .kuk_gallery_* .kuk_summary
   .kuk_detail .kuk_related 与关于页实战过的 .ab-h/.ab-cards/.ab-card*。
   断点沿用 1020/768/620；不引 Bootstrap；不覆盖正文图片尺寸（坑1）。
   ========================================================================== */
.pd-detail {
    padding-top: 6px;
}

/* 目标站 .kuk_crumb 自带 max-width:1200 居中留白，在 1300 容器里会与
   下方 hero 错位——作用域内拉平，与容器同宽 */
.pd-detail .kuk_crumb {
    max-width: none;
    margin: 0;
    padding: 26px 0 0;
}

/* 分类胶囊 tab：老数据主栏目只有 2/3/4，无栏目的黑体系列落「全部产品」 */
.pd-detail .kuk_tabs {
    justify-content: flex-start;
    margin: 18px 0 26px;
}

/* hero 左栏（图集）最小宽度保护，防长图撑破 grid 轨道 */
.pd-gallery {
    min-width: 0;
}

.kuk_gallery_main {
    display: block;
}

.kuk_gallery_main a {
    display: block;
    width: 100%;
    height: 100%;
}

/* 型号 kicker：等宽字体（仪器/数据手册语感），与页脚刻度尺同族 */
.pd-kicker {
    font-family: Consolas, Monaco, "Courier New", monospace;
    font-size: 13px;
    font-weight: 600;
    letter-spacing: 1px;
    color: var(--kuk-main);
    margin-bottom: 8px;
}

/* 关键参数规格格：与关于页 .ab-stat 同一视觉语言（浅红底 + 3px 红顶边） */
.pd-specs {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 14px 18px;
    list-style: none;
    margin: 0 0 20px;
    padding: 16px 18px;
    background: #f4f8fb;
    border-top: 3px solid var(--kuk-main);
}

.pd-specs li {
    min-width: 0;
}

.pd-spec-label {
    display: block;
    font-size: 12px;
    color: var(--kuk-gray);
    margin-bottom: 4px;
}

.pd-spec-value {
    display: block;
    font-size: 15px;
    font-weight: 600;
    color: var(--kuk-text);
    font-variant-numeric: tabular-nums;
    word-break: break-word;
    line-height: 1.5;
}

/* 行动按钮：主按钮实心红，次按钮描边 */
.pd-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
}

.pd-btn {
    display: inline-block;
    padding: 11px 26px;
    font-size: 14px;
    text-align: center;
    color: #555;
    background: #fff;
    border: 1px solid var(--kuk-line);
    transition: all .2s;
}

.pd-btn:hover {
    color: var(--kuk-main);
    border-color: var(--kuk-main);
    text-decoration: none;
}

.pd-btn-primary {
    color: #fff;
    background: var(--kuk-main);
    border-color: var(--kuk-main);
}

.pd-btn-primary:hover {
    color: #fff;
    background: var(--kuk-main-deep);
    border-color: var(--kuk-main-deep);
}

/* 小节：正文与相关产品复用 .ab-h（红条标题）+ .kuk_detail（正文）+ .ab-cards */
.pd-sec {
    margin-bottom: 42px;
}

.pd-sec .ab-h {
    margin-bottom: 18px;
}

/* 相关产品小节头：红条标题 + 右侧「查看全部」（不再往网格里塞占位卡，
   4 张卡用 auto-fit 自适应列数，产品条数变化时不会出现半空行） */
.pd-sec-head {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 16px;
}

.pd-sec-head .ab-h {
    margin-bottom: 18px;
}

.pd-more {
    flex: 0 0 auto;
    margin-bottom: 18px;
    font-size: 14px;
    color: var(--kuk-gray);
}

.pd-more:hover {
    color: var(--kuk-main);
    text-decoration: none;
}

/* 相关产品固定取 4 条 → 桌面一行 4 张；断点 2×2 → 1 列。
   （试过 repeat(auto-fit,minmax())，空轨道会残留多余 gap，改回确定性列数） */
.pd-detail .ab-cards {
    grid-template-columns: repeat(4, 1fr);
}

@media screen and (max-width: 1020px) {
    .pd-detail .ab-cards {
        grid-template-columns: repeat(2, 1fr);
        gap: 18px;
    }
}

@media screen and (max-width: 620px) {
    .pd-detail .ab-cards {
        grid-template-columns: 1fr;
        gap: 16px;
    }
}

@media screen and (max-width: 1020px) {
    .kuk_hero {
        gap: 24px;
    }

    .kuk_gallery_main {
        height: 400px;
    }
}

@media screen and (max-width: 768px) {
    /* 平板竖屏起单列：图在上、决策区在下 */
    .kuk_hero {
        grid-template-columns: 1fr;
        gap: 22px;
    }

    .kuk_gallery_main {
        height: 360px;
    }

    .pd-sec {
        margin-bottom: 34px;
    }
}

@media screen and (max-width: 620px) {
    .kuk_gallery_main {
        height: 260px;
    }

    .kuk_gallery_thumbs img {
        width: 60px;
        height: 60px;
    }

    /* tab 转横向单行滚动（不换行撑高） */
    .pd-detail .kuk_tabs {
        flex-wrap: nowrap;
        justify-content: flex-start;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
        margin: 14px 0 20px;
    }

    .pd-detail .kuk_tabs::-webkit-scrollbar {
        display: none;
    }

    .pd-detail .kuk_tabs a {
        flex: 0 0 auto;
    }

    .kuk_hero_info h1 {
        font-size: 21px;
    }

    .pd-specs {
        padding: 14px 12px;
        gap: 12px 10px;
    }

    .pd-spec-label {
        font-size: 12px;
    }

    .pd-spec-value {
        font-size: 15px;
    }

    .pd-actions .pd-btn {
        flex: 1 1 auto;
    }
}

/* ============================================================================
   内页 banner 文案浮层（2026-10-19，作用域 .ny_banner；首页 .banner 另有一套深色字体系）
   ----------------------------------------------------------------------------
   结构：common/banner_cap.html 输出，位于 .slideBox 内、.bd 之外的兄弟节点，
   蒙版与文字均 pointer-events:none——不挡翻页圆点、不影响 SuperSlide 测宽。
   图片明暗各异，统一白字 + 左侧渐变蒙版保证对比度；断点 1020/620。
   ========================================================================== */
.ny_banner .bn-shade {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    z-index: 1;
    pointer-events: none;
    background: linear-gradient(90deg,
        rgba(15, 20, 28, .58) 0%,
        rgba(15, 20, 28, .34) 40%,
        rgba(15, 20, 28, 0) 72%);
}

/* 翻页圆点(.hd z-index:1)原会被同层蒙版盖住，内页范围内抬到浮层之上 */
.ny_banner .slideBox .hd {
    z-index: 3;
}

.ny_banner .bn-cap {
    position: absolute;
    left: 6.5%;
    top: 50%;
    transform: translateY(-50%);
    max-width: 48%;
    z-index: 2;
    pointer-events: none;
    color: #fff;
    font-family: -apple-system, "Segoe UI", "PingFang SC", "Microsoft YaHei", sans-serif;
}

.ny_banner .bn-kicker {
    margin: 0 0 10px;
    font-size: clamp(12px, 0.72vw, 14px);
    font-weight: 700;
    letter-spacing: 0.16em;
    /* 内页蓝语言的浅色版：深色蒙版上保持可读，与首页 banner 同族 */
    color: #7cc8f5;
}

.ny_banner .bn-title {
    margin: 0 0 10px;
    font-size: clamp(24px, 2.2vw, 42px);
    font-weight: 700;
    line-height: 1.25;
    color: #fff;
}

.ny_banner .bn-sub {
    margin: 0;
    font-size: clamp(13px, 1vw, 18px);
    font-weight: 500;
    line-height: 1.5;
    color: rgba(255, 255, 255, .9);
}

@media screen and (max-width: 1020px) {
    .ny_banner .bn-cap {
        left: 5%;
        max-width: 58%;
    }
}

@media screen and (max-width: 620px) {
    .ny_banner .bn-cap {
        left: 6%;
        max-width: 82%;
    }

    .ny_banner .bn-kicker {
        font-size: 10px;
        margin-bottom: 5px;
    }

    .ny_banner .bn-title {
        font-size: 20px;
        margin-bottom: 0;
    }

    /* 3:1 图在 390 宽只有 130px 高：藏副标题，给底部翻页圆点留位置 */
    .ny_banner .bn-sub {
        display: none;
    }
}

/* ============================================================================
   目标站 style.css 遗留红色覆盖层（2026-10-19 全站统一为科技蓝）
   ----------------------------------------------------------------------------
   style.css 是逐字复刻参考件保持不改；其中仍然可见的红色只剩以下几条，
   在 kuk.css（全站每页最后加载，同特异性后到者胜）逐条压掉。
   其余红规则（旧首页块/时间轴/旧页脚/.lxfx/放大镜详情块）对应 DOM 已停用。
   ========================================================================== */
/* 内页 banner 激活圆点（首页 .banner 的在上方，这里是同结构的内页版） */
.ny_banner .slideBox .hd ul li.on i {
    background: var(--kuk-main);
}

/* 列表页侧栏：红头条 → 墨蓝头条，红圆点 / hover 红字 → 蓝 */
.ny_product_left h5 {
    background: #1f2d3d;
}

.product_left_nav dl dt:after {
    background: var(--kuk-main);
}

.product_left_nav dl dd a:hover {
    color: var(--kuk-main);
}

/* 新闻列表「查看更多新闻」hover 红底 → 蓝底 */
.ny_news_more:hover {
    background: var(--kuk-main);
    color: #fff;
}

/* 留言/搜索页白卡标题的红字 → 蓝字 */
.about_top_xx h4 {
    color: var(--kuk-main);
}

/* 移动端抽屉：红底 → 墨蓝底（全站移动端最大的一块红） */
#hamburgermenu {
    background: #1f2d3d;
}

/* 列表页搜索框放大镜：目标站 p_search.png 是纯红切图，已重新上色为科技蓝；
   这里重申 background-image 并带版本号，避免旧红图被浏览器缓存 */
.p_search {
    background-image: url(../templates/gkjn/images/p_search.png?v=202610197);
}
