/* ==== source: cookeryaki.css ==== */
/* cookeryaki consolidated CSS (cc-v1-fixes + cookeryaki-new) */
/* --- cc-v1-fixes.css --- */
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
img,video,iframe{max-width:100%;height:auto}
table{max-width:100%}
input,select,textarea{max-width:100%;box-sizing:border-box}
.container,.main,.wrap{max-width:100%}
@media(max-width:768px){body{overflow-x:hidden}.nav,.menu,.sub_menu{max-width:100%}}
/* V4: reduce the empty gap between the logo and desktop navigation. */
@media only screen and (min-width: 1171px) {
#site-menu {
right: 50px;
}
}
/* V8: responsive and legal-page fixes. */
.ck-legal-document h1{margin:0 0 8px;color:#26211e;font-size:clamp(34px,6vw,54px);line-height:1.1}
.ck-legal-document h2{margin:30px 0 9px;color:#332d2d;font-size:23px}
.ck-legal-document p{font-size:16px;line-height:1.75}
.ck-legal-actions a{display:inline-flex;min-height:40px;align-items:center;padding:8px 14px;border-radius:4px;background:#332d2d;color:#fff;text-decoration:none;box-sizing:border-box}
/* --- cookeryaki-new.css --- */
/* nav */
/* nav item */
#site-menu .main-menu > li > a {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
width: 100%;
padding: 8px 6px;
margin: 0;
line-height: 1.15;
text-align: center;
}
/* desktop nav */
@media (min-width: 992px) {
#site-menu { left: 215px; top: 0; bottom: 0; }
#site-menu .main-menu { float: none; display: flex !important; width: 100%; height: 100%; justify-content: space-between; align-items: stretch; }
#site-menu .main-menu > li { position: relative; float: none; flex: 1 1 0; display: flex; align-items: center; }
/* has-dropdown */
#site-menu .main-menu > li.has-mega,
#site-menu .main-menu > li.has-sub { align-items: stretch; }
}
/* nav text */
#site-menu .main-menu > li > a .nav-en { display: block; font-size: 15px; font-weight: 600; letter-spacing: .02em; }
#site-menu .main-menu > li > a .nav-zh { display: block; font-size: 13px; font-weight: 400; color: rgba(255, 255, 255, .6); margin-top: 10px; letter-spacing: .06em; }
#site-menu .main-menu > li.has-mega > a,
#site-menu .main-menu > li.has-sub > a { padding: 0 6px; }
#site-menu .main-menu > li.has-mega > a::before,
#site-menu .main-menu > li.has-sub > a::before {
content: '';
align-self: stretch;
flex: 1 1 0;
margin: 0 -6px;
background: #332d2d;
}
#site-menu .main-menu > li.has-mega > a::after,
#site-menu .main-menu > li.has-sub > a::after {
content: '';
align-self: stretch;
flex: 1 1 0;
margin: 0 -6px;
}
#site-menu .main-menu > li.has-mega > a .nav-en,
#site-menu .main-menu > li.has-sub > a .nav-en { align-self: stretch; padding: 8px 6px 5px; margin: 0 -6px; }
#site-menu .main-menu > li.has-mega > a .nav-zh,
#site-menu .main-menu > li.has-sub > a .nav-zh { align-self: stretch; padding: 5px 6px 8px; margin: 0 -6px; }
#site-menu .main-menu > li.has-mega.active > a,
#site-menu .main-menu > li.has-sub.active > a { background: transparent; }
#site-menu .main-menu > li.has-mega.active > a .nav-en,
#site-menu .main-menu > li.has-sub.active > a .nav-en { background: #fffae6; }
#site-menu .main-menu > li.has-mega.active > a .nav-zh,
#site-menu .main-menu > li.has-sub.active > a .nav-zh { background: #fffae6; }
#site-menu .main-menu > li:hover > a { background: #fffae6; }
#site-menu .main-menu > li:hover > a .nav-en { color: #332d2d; }
#site-menu .main-menu > li:hover > a .nav-zh { color: rgba(51, 45, 45, .7); }
#site-menu .main-menu > li.has-mega:hover > a,
#site-menu .main-menu > li.has-mega.cy-hover > a,
#site-menu .main-menu > li.has-sub:hover > a { background: transparent; }
#site-menu .main-menu > li.has-mega:hover > a .nav-en,
#site-menu .main-menu > li.has-mega.cy-hover > a .nav-en,
#site-menu .main-menu > li.has-sub:hover > a .nav-en { background: #fffae6; color: #332d2d; }
#site-menu .main-menu > li.has-mega:hover > a .nav-zh,
#site-menu .main-menu > li.has-mega.cy-hover > a .nav-zh,
#site-menu .main-menu > li.has-sub:hover > a .nav-zh { background: #fffae6; color: rgba(51, 45, 45, .7); }
#site-menu .main-menu > li.has-mega:hover > a::after,
#site-menu .main-menu > li.has-mega.cy-hover > a::after,
#site-menu .main-menu > li.has-sub:hover > a::after { background: #fffae6; }
/* active nav */
#site-menu .main-menu > li.active > a { color: #c9c1a0; }
#site-menu .main-menu > li.active > a .nav-zh { color: rgba(51, 45, 45, .7); }
#site-menu .main-menu > li:not(.has-mega):not(.has-sub) > a:after,
#site-menu .main-menu li > .sub-menu a:after { content: none !important; margin-left: 0 !important; }
/* dropdown */
#site-menu .main-menu > li > .sub-menu {
display: none;
position: absolute;
top: 100%;
left: 50%;
right: auto;
transform: translateX(-50%);
min-width: 0;
width: max-content;
background: #fffae6;
padding: 8px 0;
z-index: 999;
box-shadow: 0 6px 18px rgba(0, 0, 0, .15);
text-align: left;
}
#site-menu .main-menu > li:hover > .sub-menu {
display: block !important;
height: auto !important;
overflow: visible !important;
}
#site-menu .main-menu > li > .sub-menu a {
display: block;
padding: 19px 22px;
color: #332d2d;
font-size: 13px;
text-decoration: none;
white-space: nowrap;
}
#site-menu .main-menu > li > .sub-menu a:hover { color: #a14232; background: rgba(51, 45, 45, .06) !important; }
/* mobile menu */
#mobile-menu .dl-menu > li > a .nav-en,
#mobile-menu .dl-menu > li > a .nav-zh { float: none; display: inline; font-size: inherit; font-weight: inherit; color: inherit; }
#mobile-menu .dl-menu > li > a .nav-zh { color: rgba(255, 255, 255, .6); font-size: 11px; margin-left: 6px; }
/* faq categories */
.faq-cat-switch ul { list-style: none; margin: 0; padding: 0; }
.faq-cat-switch li { margin: 0 0 6px; }
.faq-cat-switch a {
display: block; padding: 8px 12px; border: 1px solid #e2e2e2; border-radius: 3px;
font-size: 13px; color: #333; text-decoration: none; transition: all .18s;
}
.faq-cat-switch a:hover { border-color: #332d2d; color: #332d2d; }
.faq-cat-switch li.active a { background: #f0efea; border-color: #d8d5cd; color: #332d2d; font-weight: 600; }
.faq-item .panel-body p.faq-summary { margin-bottom: 8px; }
.faq-item .faq-more {
display: inline-block; margin-top: 4px; font-size: 12.5px; font-weight: 600;
color: #a08c4a; text-decoration: none;
}
.faq-item .faq-more:hover { text-decoration: underline; }
/* ★ 常见问题列表（FAQ 分类页 + 产品落地页的 FAQ tab，2026-09-21）
规则：没写详情的 → 行尾「+」，点击就地展开概述；写了详情的 → 整行跳转 + 行尾 Read more。
版式：问题左对齐，行尾那一个（+ 或 Read more）右对齐。 */
.faq-item .faq-head {
display: flex; align-items: center; gap: 10px;
padding: 14px 16px; text-decoration: none; cursor: pointer;
color: #000;
}
.faq-item .faq-head .step { flex: 0 0 auto; font-size: 15px; color: #000; }
.faq-item .faq-head .panel-title { flex: 1 1 auto; min-width: 0; text-transform: none; }
/* 整行可点：鼠标放在这一行上，问题文字变色（有详情/无详情都一样） */
.faq-item .faq-head .faq-q { font-size: 15px; color: #000; transition: color .15s; }
.faq-item .faq-head:hover .faq-q { color: #a14232; }
.faq-item a.faq-head-link,
.faq-item a.faq-head-link:hover { text-decoration: none; }
.faq-item .faq-head .faq-more {
flex: 0 0 auto; margin: 0 0 0 auto; padding: 0; font-size: 14px;
font-weight: 700; color: #a14232; white-space: nowrap;
}
.faq-item a.faq-head-link:hover .faq-more { text-decoration: underline; }
.faq-item .faq-head .faq-toggle {
flex: 0 0 auto; margin: 0 0 0 auto; width: 30px; height: 30px; padding: 0;
display: inline-flex; align-items: center; justify-content: center;
border: 1px solid #dedbd4; border-radius: 50%; background: #fff;
font-size: 19px; font-weight: 700; line-height: 1; color: #332d2d; cursor: pointer;
transition: color .15s, background .15s, border-color .15s;
}
.faq-item .faq-head .faq-toggle:hover,
.faq-item.faq-open .faq-head .faq-toggle { color: #fff; background: #a14232; border-color: #a14232; }
/* 答案：14px 纯黑，浅暖灰底（原来 FAQ 分类页继承主题 checkout2 的 #eaeac6 偏深） */
.faq-item .faq-body {
border-top: 1px solid #eceae4;
background: #faf9f6;
color: #000;
font-size: 14px;
line-height: 1.8;
}
.faq-item .faq-body[hidden] { display: none; }
.pd-faq-title { font-size: 20px; font-weight: 700; color: #332d2d; margin: 6px 0 16px; }
.pd-faq-list .faq-item { margin-bottom: 10px; }
.pd-faq-list .faq-item:last-child { margin-bottom: 0; }
/* ★ 内嵌内容栏目（2026-09-22）：产品落地页那一栏 + 分类页「Everything we have on …」共用
分类页的 h2 直接复用页面顶部那套 .title2（深色条 + 底部 3px 细黑线），外观与上面的大标题一致；
内容一行 4 个，只显示图片 + 标题，图片统一 4:3 */
.cat-resources .ck-res-title2 { margin-top: 0; margin-bottom: 22px; }
.ck-res-sec { margin-bottom: 30px; }
.ck-res-sec:last-child { margin-bottom: 0; }
.ck-res-head {
display: flex; align-items: baseline; justify-content: space-between; gap: 14px;
margin: 0 0 12px; padding-bottom: 8px; border-bottom: 1px dashed #332d2d;
}
.ck-res-h {
font-size: 17px; font-weight: 700; color: #332d2d; line-height: 1.3;
margin: 0; text-transform: none;
}
.ck-res-more {
flex: 0 0 auto; font-size: 13px; color: #767676; text-decoration: none;
white-space: nowrap; transition: color .15s;
}
.ck-res-more:hover { color: #a14232; text-decoration: none; }
ul.ck-res-grid {
list-style: none; margin: 0; padding: 0;
display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 18px;
}
ul.ck-res-grid li.ck-res-card { list-style: none; margin: 0; padding: 0; min-width: 0; }
.ck-res-thumb { display: block; border-radius: 4px; overflow: hidden; background: #f2f1ee; }
/* 图片统一 4:3（宽度撑满列宽，高度按比例） */
.ck-res-thumb img {
width: 100%; height: auto; aspect-ratio: 4 / 3; object-fit: cover; display: block;
transition: opacity .2s;
}
.ck-res-card:hover .ck-res-thumb img { opacity: .88; }
.ck-res-t { margin: 8px 0 0; font-size: 14px; font-weight: 600; line-height: 1.45; }
.ck-res-t a { color: #332d2d; text-decoration: none; transition: color .15s; display: block; }
.ck-res-t a:hover { color: #a14232; }
/* 分类页里那一块：与上方编辑器图文留出间距 */
.cat-resources { margin: 26px 0 6px; }
@media (max-width: 991px) {
ul.ck-res-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
}
/* ==========================================================================
单页章节化排版（process / service / partners，2026-10-11 v5）
语言与全站一致：白底、块标题沿用 .pd-block-title（居中 + 2px 实线底边）、
卡片照 .product .entry-media 的 1px #e0ddd5 细边框；间距收紧。
图片规则：在图文分栏里高度跟随同栏文字（object-fit:cover 不裁形），
在画廊 / 单独使用时按比例（4:3、16:9）。
========================================================================== */
/* 主题对 .entry-content 内的 ul/ol 设了 disc/decimal + padding-left + margin，
优先级高于单类选择器，会把这里的列表变成带自动序号 —— 统一压掉。 */
.entry-content .ckp-stages, .entry-content .ckp-cards, .entry-content .ckp-points,
.entry-content .ckp-proc, .entry-content .ckp-timeline, .entry-content .ckp-list,
.entry-content .ckp-stagelist, .entry-content .ckp-certs {
list-style: none; padding-left: 0; margin: 0;
}
.entry-content .ckp-cards, .entry-content .ckp-gallery, .entry-content .ckp-list { margin-top: 20px; }
.ckp-sec { margin-top: 44px; }
.ckp-sec--first { margin-top: 30px; }
/* ---- 引语 / 章节引言 ---- */
.ckp-lede { max-width: 90%; margin: 24px auto 0; }
.ckp-lede p { font-size: 16px; line-height: 1.85; color: #57503f; margin: 0 0 14px; }
.ckp-lede p:last-child { margin-bottom: 0; }
/* ---- 图片 ---- */
.ckp-media, .ckp-ph, .ckp-visit { margin: 0; float: none; }
.ckp-media { position: relative; border: 1px solid #e8e4dc; border-radius: 4px; overflow: hidden; background: #faf9f6; }
.ckp-media img, .ckp-media video { display: block; width: 100%; height: 100%; object-fit: cover; }
.ckp-media--169 { aspect-ratio: 16 / 9; }
.ckp-media--43 { aspect-ratio: 4 / 3; }
.ckp-video { max-width: 720px; margin: 26px auto 0; }
.ckp-crop-l img { object-position: 0% 50%; }
.ckp-crop-c img { object-position: 50% 50%; }
.ckp-crop-r img { object-position: 100% 50%; }
/* ---- 图文分栏：图与同栏文字等高 ---- */
.ckp-split { display: grid; grid-template-columns: 5fr 6fr; gap: 26px; align-items: stretch; margin-top: 20px; }
.ckp-split--rev { grid-template-columns: 6fr 5fr; }
.ckp-split > .ckp-media, .ckp-split > .ckp-ph { position: relative; aspect-ratio: auto; min-height: 200px; }
.ckp-split > .ckp-media img, .ckp-split > .ckp-media video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
/* 图统一尺寸的变体：图片不再随同栏文字伸缩，同一组里几张图看起来一样大 */
.ckp-split--fixed { align-items: center; }
.ckp-split--fixed > .ckp-media, .ckp-split--fixed > .ckp-ph { aspect-ratio: 16 / 9; min-height: 0; }
/* 个别图（如车间总览 500x513）按自身比例显示、不裁切；图会更高，从而自然拉开与下方小标题的距离 */
.ckp-split > .ckp-media.ckp-media--auto { aspect-ratio: auto; }
.ckp-split > .ckp-media.ckp-media--auto img { position: static; width: 100%; height: auto; }
/* 车间总览图再缩 10%（原 520 宽 → 468）并居中 */
.ckp-split > .ckp-media.ckp-media--auto { max-width: 468px; margin-left: auto; margin-right: auto; }
/* ---- 卡片 ---- */
.ckp-cards { display: grid; gap: 14px; list-style: none; margin: 20px 0 0; padding: 0; }
.ckp-cards--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.ckp-cards--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.ckp-card { background: #fff; border: 1px solid #e6e2da; border-radius: 4px; padding: 18px 18px 17px; }
.ckp-card-no { display: block; font-size: 11.5px; font-weight: 700; letter-spacing: .08em; color: #a14232; margin-bottom: 7px; }
.ckp-card-title { font-size: 15px; font-weight: 700; color: #332d2d; line-height: 1.45; margin: 0 0 7px; }
.ckp-card-text { font-size: 13.8px; line-height: 1.7; color: #6b6357; margin: 0; }
/* ---- 编号要点列表（左图右文用） ---- */
.ckp-points { list-style: none; margin: 0; padding: 0; }
.ckp-points > li { position: relative; padding-left: 38px; }
.ckp-points > li + li { margin-top: 16px; }
.ckp-points .no { position: absolute; left: 0; top: 1px; width: 25px; height: 25px; border: 1px solid #e2ddd3; border-radius: 50%; color: #a8987f; font-size: 10.5px; font-weight: 700; display: flex; align-items: center; justify-content: center; }
.ckp-points .t { display: block; font-size: 14.8px; font-weight: 700; color: #332d2d; line-height: 1.45; margin-bottom: 4px; }
.ckp-points .d { margin: 0; font-size: 13.8px; line-height: 1.7; color: #6b6357; }
/* ---- 服务支持页：小标题前的数字圆圈改为小黑点（与经销商页 .ckp-list 一致，仅服务支持页用） ---- */
.ckp-points--dot > li { padding-left: 20px; }
.ckp-points--dot > li::before { content: ''; position: absolute; left: 0; top: 7px; width: 6px; height: 6px; border-radius: 50%; background: #d3cbbb; }
/* ---- 一行两个板块：要点条数少的节改两列卡片 ---- */
.ckp-pcards > li { background: #fff; border: 1px solid #e6e2da; border-radius: 4px; padding: 17px 17px 16px; }
.ckp-pcards .no { display: block; font-size: 11px; font-weight: 700; letter-spacing: .08em; color: #a14232; margin-bottom: 8px; }
.ckp-pcards .t { display: block; font-size: 14.5px; font-weight: 700; color: #332d2d; line-height: 1.45; margin-bottom: 6px; }
.ckp-pcards .d { margin: 0; font-size: 13.6px; line-height: 1.7; color: #6b6357; }
/* ---- 五阶段导航 ---- */
.ckp-stages > li { padding: 14px 12px; text-align: center; background: #faf9f6; }
.ckp-stages > li + li { border-left: 1px solid #e6e2da; }
.ckp-stages .no { display: block; font-size: 11.5px; font-weight: 700; letter-spacing: .08em; color: #a14232; margin-bottom: 5px; }
/* ---- 阶段 ---- */
.ckp-stage { margin-top: 38px; }
.ckp-h { display: flex; align-items: baseline; gap: 12px; margin: 0 0 18px; padding-bottom: 11px; border-bottom: 1px solid #efeae1; }
.ckp-h .no { flex: none; font-size: 20px; font-weight: 700; color: #cfc7b8; line-height: 1; letter-spacing: -.02em; }
.ckp-h-t { margin: 0; font-size: 17px; font-weight: 700; color: #332d2d; line-height: 1.4; }
.ckp-h-s { margin-left: 9px; font-size: 13.5px; font-weight: 400; color: #8a8172; }
.ckp-h + .ckp-split { margin-top: 0; }
.ckp-h--c { justify-content: center; text-align: center; }
/* ---- 一行两列：两个板块并排 ---- */
.ckp-pair { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 30px; margin-top: 38px; }
.ckp-pair:first-child { margin-top: 0; }
.ckp-pane { min-width: 0; }
.ckp-pane .ckp-h { margin-bottom: 16px; }
.ckp-pane .ckp-media, .ckp-pane .ckp-ph { aspect-ratio: 16 / 9; margin-bottom: 18px; max-width: 520px; }
/* ---- 竖排阶段导览（During Production 里图旁边的目录） ---- */
.ckp-stagelist { list-style: none; margin: 18px 0 0; padding: 0; }
.ckp-stagelist > li { position: relative; padding: 9px 0 9px 40px; border-top: 1px solid #f1ede5; font-size: 14.5px; font-weight: 600; color: #4a443c; }
.ckp-stagelist > li:last-child { border-bottom: 1px solid #f1ede5; }
.ckp-stagelist .no { position: absolute; left: 0; top: 10px; font-size: 11.5px; font-weight: 700; letter-spacing: .08em; color: #a14232; }
/* ---- 工序列表 ---- */
.ckp-proc { list-style: none; margin: 0; padding: 0; }
.ckp-proc > li { position: relative; padding-left: 38px; }
.ckp-proc > li + li { margin-top: 14px; }
.ckp-proc .no { position: absolute; left: 0; top: 1px; width: 25px; height: 25px; border: 1px solid #e6e2da; border-radius: 50%; background: #fff; color: #a8987f; font-size: 10.5px; font-weight: 700; display: flex; align-items: center; justify-content: center; }
.ckp-proc .t { display: block; font-size: 14.5px; font-weight: 700; color: #332d2d; line-height: 1.45; margin-bottom: 4px; }
.ckp-proc .d { margin: 0; font-size: 13.6px; line-height: 1.72; color: #6b6357; }
/* ---- 画廊 ---- */
.ckp-gallery { display: grid; gap: 14px; margin-top: 20px; }
.ckp-gallery--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.ckp-gallery--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
/* 整组限宽：两图并排 → 单张 ≈520 宽（原为铺满 1170 的 578）；三图 → 缩到 90%，列间距略放大去掉拥挤感 */
.ckp-gallery--2 { max-width: 95%; margin-left: auto; margin-right: auto; gap: 28px; }
.ckp-gallery--3 { max-width: 95%; margin-left: auto; margin-right: auto; gap: 28px; }
/* ---- 时间轴 ---- */
.ckp-timeline { list-style: none; margin: 0; padding: 0; }
.ckp-timeline > li { position: relative; padding: 0 0 20px 38px; }
.ckp-timeline > li:last-child { padding-bottom: 0; }
.ckp-timeline > li::before { content: ''; position: absolute; left: 12px; top: 27px; bottom: 1px; width: 1px; background: #e2dcd0; }
.ckp-timeline > li:last-child::before { display: none; }
.ckp-timeline .no { position: absolute; left: 0; top: 0; width: 25px; height: 25px; border-radius: 50%; background: #332d2d; color: #fff; font-size: 10.5px; font-weight: 700; display: flex; align-items: center; justify-content: center; }
.ckp-timeline .t { display: block; font-size: 14.8px; font-weight: 700; color: #332d2d; line-height: 1.45; margin-bottom: 4px; }
.ckp-timeline .d { margin: 0; font-size: 13.8px; line-height: 1.7; color: #6b6357; }
/* ---- 名录（密集两列） ---- */
.ckp-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 30px; list-style: none; margin: 20px 0 0; padding: 0; }
.ckp-list > li { position: relative; padding: 14px 0 14px 20px; border-top: 1px solid #f1ede5; }
.ckp-list > li::before { content: ''; position: absolute; left: 0; top: 22px; width: 6px; height: 6px; border-radius: 50%; background: #d3cbbb; }
.ckp-list > li.is-wide { grid-column: 1 / -1; }
.ckp-list .t { display: block; font-size: 14.5px; font-weight: 700; color: #332d2d; line-height: 1.5; margin: 0; }
.ckp-list .d { margin: 4px 0 0; font-size: 13.6px; line-height: 1.68; color: #6b6357; }
/* ---- 参观三图（图 + 小标题 + 地址） ---- */
.ckp-visit h4 { margin: 14px 0 6px; font-size: 14.5px; font-weight: 700; color: #332d2d; line-height: 1.45; }
.ckp-visit p { margin: 0; font-size: 13.5px; line-height: 1.7; color: #7a7266; }
/* 无边框图片：Before Production 的两张并排图 + 参观区的三张图（不加 1px 细边框） */
.ckp-gallery--2 .ckp-media,
.ckp-visit .ckp-media { border: 0; }
/* ---- 联系页 /contact.html：联系信息拆成两列卡片（内容化排版，不再是底部板块的左栏） ---- */
.ckp-cinfo, .entry-content .ckp-cinfo {
display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px;
list-style: none; margin: 24px 0 0; padding: 0;
}
.ckp-cinfo > li {
display: flex; align-items: flex-start; gap: 13px;
background: #fff; border: 1px solid #e6e2da; border-radius: 4px; padding: 17px 18px 16px;
}
.ckp-cinfo > li .round-icon { flex: 0 0 auto; margin-top: 1px; }
.ckp-cinfo-body { min-width: 0; }
.ckp-cinfo-t { font-size: 13px; font-weight: 700; letter-spacing: .04em; color: #8a8172; margin-bottom: 6px; }
.ckp-cinfo-d { font-size: 14.5px; line-height: 1.7; color: #1f1f1f; word-break: break-word; }
.ckp-cinfo-d--strong { font-weight: 700; }
.ckp-cinfo-d a { color: #1f1f1f; text-decoration: none; }
.ckp-cinfo-d a:hover { color: #a14232; }
/* 联系页第一个内容块离页面标题近一些（其余 .ckp-sec 仍 44px） */
.ckp-sec--first { margin-top: 26px; }
#frm-contact-us { scroll-margin-top: 90px; }
/* 询价表单卡片：整块包一层浅底细框，与内容块同一视觉语言 */
.pd-form-card {
background: #faf9f6; border: 1px solid #e8e4dc; border-radius: 4px;
padding: 26px 26px 22px; margin-top: 22px;
}
.pd-form-card .pd-form { max-width: none; }
.pd-form-card .pd-assurance { color: #8a8172; }
/* 联系页最后一块（正文里的地图图片）：与上方表单块拉开距离 */
.ckp-contact-map { margin-top: 52px; }
.ckp-contact-map img { display: block; margin: 0 auto; max-width: 100%; height: auto; }
/* ---- 配图位（图片未到位时的占位：裁切角标 + 编号 + 图标 + 主题 + 尺寸） ---- */
.ckp-ph {
position: relative; display: flex; align-items: center; justify-content: center;
aspect-ratio: 16 / 9; min-height: 190px; border-radius: 4px; overflow: hidden;
background: #fbfaf7;
background-image: repeating-linear-gradient(135deg, rgba(120,105,80,.035) 0 1px, transparent 1px 10px);
border: 1px dashed #ddd6c8;
}
.ckp-ph::before, .ckp-ph::after { content: ''; position: absolute; width: 14px; height: 14px; }
.ckp-ph::before { top: 10px; left: 10px; border-top: 1px solid #ded8cc; border-left: 1px solid #ded8cc; }
.ckp-ph::after { bottom: 10px; right: 10px; border-bottom: 1px solid #ded8cc; border-right: 1px solid #ded8cc; }
.ckp-ph-no {
position: absolute; top: 10px; left: 29px; padding: 2px 7px 2px 6px; border-radius: 3px;
background: #f0ece3; color: #93897a; font-size: 10px; font-weight: 700; letter-spacing: .1em;
}
.ckp-ph-inner { display: flex; flex-direction: column; align-items: center; gap: 10px; padding: 30px 34px; text-align: center; }
.ckp-ph-ic { width: 44px; height: 44px; color: #cbc2b1; display: block; }
.ckp-ph-label { font-size: 15px; font-weight: 700; color: #57503f; line-height: 1.55; }
.ckp-ph-size { font-size: 12px; color: #a89f8e; letter-spacing: .02em; }
/* ---- 单页宽幅图（about 的 800 宽横幅，按原始比例、限宽居中） ---- */
.ckp-figure--wide { max-width: 800px; margin: 26px auto; }
.ckp-figure--wide img { margin: 0 auto; }
/* ---- 证书网格（/certificates.html：18 张 172×240 竖版证书） ---- */
.ckp-certs { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 14px; list-style: none; margin: 26px 0 0; padding: 0; }
.ckp-certs li { border: 1px solid #e8e4dc; border-radius: 4px; overflow: hidden; background: #fff; transition: border-color .18s, box-shadow .18s; }
.ckp-certs li:hover { border-color: #cfc7b8; box-shadow: 0 4px 14px rgba(80, 70, 50, .10); }
.ckp-certs img { display: block; width: 100%; height: auto; }
/* 证书分组（/certificates.html）：3 列 + 限宽居中，单张 ≈177 宽（原图 172×240，接近 1:1 不虚） */
.entry-content .ckp-certs--3 {
grid-template-columns: repeat(3, minmax(0, 1fr));
max-width: 560px; margin-left: auto; margin-right: auto;
}
/* 证书分组区块：不写分类名，仅靠区块间距 + 一条极淡的分隔线区分三组
（区块与里面的网格同宽居中，分隔线才不会比网格宽出一截） */
.ckp-cert-group { max-width: 560px; margin-left: auto; margin-right: auto; }
.ckp-cert-group + .ckp-cert-group {
margin-top: 34px; padding-top: 34px; border-top: 1px solid #f0ece4;
}
/* ---- 窄屏 ---- */
@media (max-width: 900px) {
.ckp-sec { margin-top: 34px; }
.ckp-cards--2, .ckp-cards--3, .ckp-gallery--2, .ckp-gallery--3, .ckp-list, .ckp-pcards { grid-template-columns: 1fr; }
.ckp-gallery--2, .ckp-gallery--3 { max-width: 100%; }
.ckp-pair { grid-template-columns: 1fr; gap: 26px; }
.ckp-certs { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.entry-content .ckp-certs--3 { grid-template-columns: repeat(2, minmax(0, 1fr)); max-width: 100%; }
.ckp-cert-group + .ckp-cert-group { margin-top: 26px; padding-top: 26px; }
.ckp-figure--wide { margin: 20px auto; }
/* 注意：基础规则用了 .entry-content .ckp-cinfo（压主题 .entry-content ul 的 reset），
这里必须带上同样前缀，否则优先级不够、窄屏仍是两列并溢出 */
.ckp-cinfo, .entry-content .ckp-cinfo { grid-template-columns: 1fr; }
.pd-form-card { padding: 20px 16px 18px; }
.ckp-pane .ckp-h-t { font-size: 16px; }
.ckp-split, .ckp-split--rev { grid-template-columns: 1fr; gap: 18px; }
.ckp-split > .ckp-media, .ckp-split > .ckp-ph { min-height: 0; aspect-ratio: 16 / 9; }
.ckp-split--fixed > .ckp-media, .ckp-split--fixed > .ckp-ph { aspect-ratio: 16 / 9; }
.ckp-split > .ckp-media img, .ckp-split > .ckp-media video { position: static; width: 100%; height: 100%; }
.ckp-stages > li:nth-child(3) { border-left: 0; }
.ckp-stages > li:nth-child(n+3) { border-top: 1px solid #e6e2da; }
.ckp-h-t { font-size: 16px; }
}
@media (max-width: 767px) {
ul.ck-res-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.ck-res-head { align-items: flex-start; }
}
/* tag page */
.tag-hero h1 { color: #fff; margin: 0 0 8px; font-size: 30px; }
.tag-hero p { color: rgba(255, 255, 255, .78); margin: 0; }
.tag-accordion { margin: 0; }
.tag-accordion .acc-item { border: 1px solid #e6e6e6; border-radius: 3px; margin-bottom: 10px; background: #fff; overflow: hidden; }
.tag-accordion .acc-head {
display: block; position: relative; padding: 13px 44px 13px 16px; font-size: 15px; font-weight: 600;
color: #332d2d; text-decoration: none; background: #faf9f6; cursor: pointer;
}
.tag-accordion .acc-head:hover { background: #f3f1ea; }
.tag-accordion .acc-head .acc-count { display: inline-block; margin-left: 8px; font-size: 12px; font-weight: 400; color: #999; }
.tag-accordion .acc-head .acc-arrow {
position: absolute; right: 16px; top: 50%; margin-top: -7px; width: 0; height: 0;
border-left: 6px solid transparent; border-right: 6px solid transparent; border-bottom: 8px solid #8d8d8d; transition: transform .2s;
}
.tag-accordion .acc-item.open .acc-head .acc-arrow { border-bottom: 0; border-top: 8px solid #332d2d; }
.tag-accordion .acc-item.open .acc-head { background: #332d2d; color: #fff; }
.tag-accordion .acc-item.open .acc-head .acc-count { color: rgba(255, 255, 255, .7); }
.tag-accordion .acc-item.disabled .acc-head { color: #b9b9b9; cursor: not-allowed; background: #f7f7f7; }
.tag-accordion .acc-item.disabled .acc-head .acc-arrow { opacity: .35; }
.tag-accordion .acc-body { display: none; padding: 18px 16px 8px; }
.tag-accordion .acc-item.open .acc-body { display: block; }
.tag-accordion .acc-empty { color: #999; font-size: 13px; padding: 4px 0 10px; }
.tag-accordion ul.tpl-list { list-style: none; margin: 0; padding: 0; }
.tag-accordion ul.tpl-list li { display: flex; gap: 14px; padding: 14px 0; border-bottom: 1px dashed #e8e8e8; }
.tag-accordion ul.tpl-list li:last-child { border-bottom: 0; }
.tag-accordion ul.tpl-list .tpl-thumb { flex: 0 0 150px; }
.tag-accordion ul.tpl-list .tpl-thumb img { width: 150px; height: 105px; object-fit: cover; border-radius: 3px; }
.tag-accordion ul.tpl-list .tpl-info { flex: 1; }
.tag-accordion ul.tpl-list .tpl-info h5 { margin: 0 0 6px; font-size: 15px; line-height: 1.4; }
.tag-accordion ul.tpl-list .tpl-info h5 a { color: #332d2d; text-decoration: none; }
.tag-accordion ul.tpl-list .tpl-info h5 a:hover { color: #a08c4a; }
.tag-accordion ul.tpl-list .tpl-info p { margin: 0 0 6px; font-size: 13px; color: #767676; line-height: 1.7; }
.tag-accordion ul.tpl-list .tpl-info .tpl-date { font-size: 12px; color: #aaa; }
/* vr viewer */
.vr-viewer img { width: 100%; height: 100%; object-fit: contain; }
.vr-scene-nav li a { display: inline-block; padding: 6px 14px; border: 1px solid #dcdcdc; border-radius: 14px; font-size: 12.5px; color: #555; text-decoration: none; }
.vr-scene-nav li a:hover, .vr-scene-nav li.active a { border-color: #332d2d; color: #332d2d; background: #faf9f6; }
/* sections */
.cat-intro { font-size: 16px; line-height: 1.8;}
.cat-intro img { max-width: 100%; height: auto; }
.cat-intro-bottom { margin: 20px 15px; }
.cat-intro-bottom img { max-width: 100%; height: auto; }
.page-hero { position: relative; background: #332d2d center/cover no-repeat; color: #fff; padding: 56px 0; }
.page-hero h1 { color: #fff; margin: 0 0 8px; font-size: 30px; }
.page-hero p { color: rgba(255, 255, 255, .78); margin: 0; max-width: 780px; }
.tag-chips { margin: 0; padding: 0; list-style: none; }
.tag-chips li { display: inline-block; margin: 0 6px 6px 0; }
.tag-chips a { display: inline-block; padding: 4px 11px; border: 1px solid #dcdcdc; border-radius: 14px; font-size: 12px; color: #555; text-decoration: none; }
.tag-chips a:hover { border-color: #332d2d; color: #332d2d; }
/* 详情页标签折叠（FAQ / 案例 / 视频 / 新闻落地页）：只保留一行，末尾紧跟 More tags */
.tag-chips-more { display: none; }
.tag-chips-more > a { cursor: pointer; }
.tag-chips-more > a:hover { border-color: #a14232; color: #a14232; }
.empty-note { padding: 40px 0; text-align: center; color: #999; }
#site-header { margin-top: 0; }
.header-top { margin-bottom: 0; padding: 15px 0; }
/* header top */
.header-top-inner { display: flex; align-items: center; justify-content: space-between; }
.ht-left a { display: inline-flex; align-items: center; gap: 8px; color: #555; font-size: 18px; font-weight: 600; text-decoration: none; }
.ht-left a:hover { color: #a14232; }
.ht-mail-ico { display: inline-flex; align-items: center; color: #a14232; }
.ht-mail-ico svg { width: 18px; height: 18px; display: block; }
.ht-right { display: flex; align-items: center; gap: 12px; }
.ht-soc {
position: relative;
display: inline-flex;
align-items: center;
justify-content: center;
width: 28px;
height: 28px;
color: #777;
text-decoration: none;
border-radius: 50%;
transition: color .15s, background .15s;
}
.ht-soc svg { width: 16px; height: 16px; display: block; }
.ht-soc:hover { color: #a14232; background: #f3efe6; }
/* social icons */
.ht-soc::after {
content: attr(data-label);
position: absolute;
top: 100%;
left: 50%;
transform: translateX(-50%);
margin-top: 8px;
padding: 4px 10px;
background: #332d2d;
color: #fff;
font-size: 12px;
white-space: nowrap;
border-radius: 4px;
opacity: 0;
visibility: hidden;
pointer-events: none;
z-index: 1001;
transition: opacity .15s, visibility .15s;
}
.ht-soc:hover::after { opacity: 1; visibility: visible; }
.main-header-wrapper > .container { background: #332d2d; }
/* banner */
.banner,
.home-slider,
.hero-placeholder { width: 100%; max-width: 100%;padding:10px 0; }
.cy-banner { position: relative; overflow: hidden; border-radius: 8px; }
.cy-banner-view { position: relative; }
.cy-banner-slide { display: none; position: relative; }
.cy-banner-slide.cy-active { display: block; }
.cy-banner-link { display: block; }
.cy-banner-bg { display: block; width: 100%; height: 460px; object-fit: cover; }
.cy-banner-cap {
position: absolute; left: 0; top: 0; width: 100%; height: 100%;
display: flex; flex-direction: column; justify-content: center; align-items: center;
text-align: center; padding: 40px 60px; color: #fff;
background: linear-gradient(to bottom, rgba(0,0,0,.12), rgba(0,0,0,.5));
pointer-events: none;
}
.cy-banner-cap .cy-banner-btns { pointer-events: auto; }
.cy-banner-title {
font-size: 40px; font-weight: 700; margin: 0 0 14px; color: #fff;
text-shadow: 0 2px 14px rgba(0,0,0,.55); line-height: 1.2;
}
.cy-banner-sub {
font-size: 17px; max-width: 760px; margin: 0 0 24px; color: rgba(255,255,255,.94);
text-shadow: 0 1px 8px rgba(0,0,0,.5); line-height: 1.5;
}
.cy-banner-btns { display: flex; gap: 14px; justify-content: center; flex-wrap: wrap; }
.cy-banner-btns .btn {
background: #a14232; border: 1px solid #a14232; color: #fff;
padding: 12px 30px; font-size: 15px; border-radius: 30px; box-shadow: 0 4px 16px rgba(0,0,0,.25);
}
.cy-banner-btns .btn:hover { background: #8a382b; border-color: #8a382b; color: #fff; text-decoration: none; }
.cy-banner-dots {
position: absolute; left: 50%; bottom: 18px; transform: translateX(-50%);
display: flex; gap: 8px; z-index: 3;
}
.cy-dot {
width: 10px; height: 10px; border-radius: 50%; border: 0; padding: 0;
background: rgba(255,255,255,.45); cursor: pointer;
}
.cy-dot.cy-on { background: #fff; }
@media (max-width: 991px) {
.cy-banner-bg { height: 320px; }
.cy-banner-title { font-size: 26px; }
.cy-banner-sub { font-size: 14px; }
.cy-banner-cap { padding: 24px; }
}
.products-wrapper2 > .row { margin-left: -10px; margin-right: -10px; }
/* card image height */
.products-wrapper2 .product .entry-media img.thumb {
display: block;
width: 100%;
height: 168px;
object-fit: cover;
}
/* 手机端分类页：卡片通栏变宽后 168px 固定高会把 4:3 缩略图上下切掉，
改成按原比例显示，整张图完整可见 */
@media (max-width: 767px) {
.products-wrapper2 .product .entry-media img.thumb { height: auto; object-fit: contain; }
}
.page-footer .footer-copy { text-align: center; padding: 5px 0 5px; color: #666; }
.home-sec { padding: 56px 0; }
/* 区块之间一条极淡分隔线：滚动时块感更清楚（第一个区块前面是 banner，不受影响） */
.home-sec + .home-sec { border-top: 1px solid #f2eee7; }
.cy-sec-title { font-size: 30px; font-weight: 700; color: #332d2d; margin: 0 0 14px; line-height: 1.25; }
.cy-sec-title.center { text-align: center; }
.cy-sec-sub { font-size: 15px; color: #777; max-width: 760px; margin: 0 auto 36px; line-height: 1.6; }
.cy-sec-sub.center { text-align: center; }
/* factory */
.factory-row { display: flex; gap: 48px; align-items: center; }
.factory-row.no-img { display: block; }
.factory-media { flex: 0 0 46%; border-radius: 4px; overflow: hidden; }
.factory-media img { width: 100%; height: 340px; object-fit: cover; display: block; }
/* 工厂介绍可放视频：与图片同尺寸；悬停自动播放，带控制条（可调音量 / 暂停）。背景必须透明，
否则 object-fit:cover 的亚像素舍入会在右侧露 1px 黑边。 */
.factory-media video { width: 100%; height: 340px; object-fit: cover; display: block; background: transparent; outline: none; }
/* 后台编辑器正文里插入的视频（没有固定宽度约束）：跟随容器宽度，别溢出移动端。
编辑器常写入 width="800" 这种行内属性，max-width 会把它压回去。 */
.entry-content video, .single-body video, .entry-summary video, .vr-summary video,
.group-intro video, .cat-sub-intro video, .factory-text video, .cat-intro-body video {
max-width: 100%; height: auto;
}
/* 正文图片：每张图都单独包在 或
里，
这里再兜底一条，保证无论主题 reset 怎么设都能居中、且不溢出容器。 */
.entry-content p[style*="text-align:center"] img,
.entry-content p[align="center"] img,
.single-body p[style*="text-align:center"] img {
display: block; margin-left: auto; margin-right: auto; max-width: 100%; height: auto;
}
/* 单页正文（About / Team / Service / Process / Partners …）：
主题里这个容器没有字号，继承 body 的 14px，英文正文偏小。
.single-body 只在 pages/single.html 使用（全站 8 个单页），
新闻 / 产品 / 案例页走 .contp 或 .entry-content（不带 single-body），不受影响。 */
.entry-content.single-body { font-size: 16px; line-height: 1.8; }
.factory-body { flex: 1; }
.factory-text { color: #555; font-size: 15px; line-height: 1.8; margin: 0 0 22px; white-space: pre-line; }
.cy-btn { display: inline-block; background: #a14232; color: #fff; padding: 12px 30px; border-radius: 30px; font-size: 15px; text-decoration: none; }
.cy-btn:hover { background: #8a382b; color: #fff; text-decoration: none; }
/* products */
.prod-block { margin-bottom: 44px; }
.prod-block:last-child { margin-bottom: 0; }
.prod-block-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 20px; }
.cy-sub-title { font-size: 22px; font-weight: 700; color: #332d2d; margin: 0; }
.cy-link-btn { color: #a14232; font-size: 14px; text-decoration: none; font-weight: 500; }
.cy-link-btn:hover { text-decoration: underline; }
.prod-grid { display: grid; gap: 20px; }
.prod-grid-scene { grid-template-columns: repeat(4, 1fr); }
.prod-grid-shape { grid-template-columns: repeat(7, 1fr); }
.prod-card { display: flex; flex-direction: column; text-decoration: none; color: #333; min-width: 0; }
.prod-card img { width: 100%; height: 180px; object-fit: cover; border-radius: 4px; }
.prod-card .prod-name { font-size: 13.5px; color: #444; margin-top: 10px; text-align: center; line-height: 1.4; }
.prod-card:hover .prod-name { color: #a14232; }
.prod-card.ph { border: 1px dashed #ddd; border-radius: 4px; min-height: 180px; background: #fafaf8; }
.prod-grid-shape .prod-card img { height: 120px; }
.prod-grid-shape .prod-card.ph { min-height: 120px; }
/* services */
.svc-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 24px; }
.svc-item { text-align: center; padding: 28px 22px 26px; background: #fff; border: 1px solid #e6e2da; border-radius: 4px; }
.svc-icon { width: 72px; height: 72px; object-fit: contain; margin-bottom: 16px; }
.svc-title { font-size: 17px; font-weight: 600; color: #332d2d; margin: 0 0 10px; text-decoration: none; display: block; }
a.svc-title:hover { color: #a14232; }
.svc-desc { font-size: 13.5px; color: #777; line-height: 1.7; margin: 0; white-space: pre-line; }
/* testimonial：客户评价（左文字 + 右图片；2026-10-11 由一张整图改为真实 HTML，后台可增删多条） */
.tm-item { display: grid; grid-template-columns: 5fr 5fr; gap: 48px; align-items: center; }
.tm-item + .tm-item { margin-top: 46px; }
.tm-item--rev > .tm-text { order: 2; }
.tm-item--rev > .tm-media { order: 1; }
.tm-stars { display: flex; gap: 3px; margin-bottom: 18px; }
.tm-star { color: #e6a338; font-size: 21px; line-height: 1; }
.tm-quote { margin: 0; padding: 0; border: 0; font-size: 19px; line-height: 1.75; color: #1f1f1f; }
.tm-name { margin-top: 22px; font-size: 15px; font-weight: 700; color: #332d2d; }
.tm-loc { margin-top: 3px; font-size: 14px; color: #8a8172; }
.tm-media { margin: 0; }
.tm-media img { display: block; width: 100%; aspect-ratio: 22 / 15; object-fit: cover; border-radius: 4px; }
.tm-ph { aspect-ratio: 22 / 15; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 10px;
background: #fbfaf7; background-image: repeating-linear-gradient(135deg, rgba(120,105,80,.035) 0 1px, transparent 1px 10px);
border: 1px dashed #ddd6c8; border-radius: 4px; color: #93897a; }
.tm-ph-t { font-size: 14px; font-weight: 700; color: #6f675a; }
.tm-ph-s { font-size: 12px; color: #a89f8e; }
/* cases */
.cases-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; margin-bottom: 24px; }
.cases-grid:last-child { margin-bottom: 0; }
/* 第二排是厨房设计图纸（CAD 线稿），与上一排餐厅实拍照区分：拉开间距 + 淡线，图纸完整显示不裁切 */
.home-cases .cases-grid + .cases-grid { margin-top: 44px; padding-top: 44px; border-top: 1px solid #f2eee7; }
.home-cases .cases-grid + .cases-grid .case-card img {
height: 200px; object-fit: contain; background: #fff;
border: 1px solid #e8e4dc; border-radius: 4px;
}
.case-card img { height: 200px; }
.case-card.ph { min-height: 200px; }
/* team */
.team-img { width: 100%; height: auto; display: block; border-radius: 8px; }
/* dealer banner (经销商板块) */
.dealer-img { width: 100%; height: auto; display: block; border-radius: 8px; }
/* 区块大标题 h2.cy-sec-title 带链接时：颜色跟随标题、悬停珊瑚红 */
.cy-sec-title a { color: inherit; text-decoration: none; transition: color .15s ease; }
.cy-sec-title a:hover { color: #fa6f57; }
/* team / 服务网络：上图下（大标题+副标题），下面左图 + 右列表，悬停右侧小标题时左侧图片切换 */
.team-wrap { display: flex; gap: 48px; align-items: flex-start; }
.team-media { flex: 0 0 46%; position: relative; height: 420px; border-radius: 8px; overflow: hidden; background: #f2f1ee; }
.team-shot { position: absolute; left: 0; top: 0; width: 100%; height: 100%; object-fit: cover; display: block; opacity: 0; transition: opacity .28s ease; }
.team-shot.on { opacity: 1; }
.team-list { flex: 1; min-width: 0; }
.team-item { position: relative; border-left: 3px solid transparent; padding: 12px 16px; margin-bottom: 6px; border-radius: 0 6px 6px 0; transition: background .15s, border-color .15s; }
.team-item-link { display: block; text-decoration: none; color: inherit; }
.team-item-title { font-size: 18px; font-weight: 700; color: #332d2d; margin: 0 0 6px; transition: color .15s; }
.team-item-desc { font-size: 14px; color: #666; line-height: 1.7; margin: 0; }
.team-item.on { background: #f5f4ef; border-left-color: #a14232; }
.team-item.on .team-item-title { color: #a14232; }
.team-item:hover { background: #f5f4ef; }
.team-item:hover .team-item-title { color: #a14232; }
@media (max-width: 991px) {
.team-wrap { flex-direction: column; gap: 24px; }
.team-media { flex: 0 0 auto; width: 100%; height: 300px; }
.factory-row { flex-direction: column; gap: 24px; }
.factory-media { flex: 0 0 auto; }
/* 视频按 16:9 原比例铺满整个宽度：原先固定 340px 高，在手机上接近正方形，
部分机型/内置浏览器不裁切画面就露出上下黑边 */
.factory-media { background: #f5f4ef; }
.factory-media video { height: auto; aspect-ratio: 16 / 9; }
.prod-grid-scene { grid-template-columns: repeat(2, 1fr); }
.prod-grid-shape { grid-template-columns: repeat(3, 1fr); }
/* 形状共 7 个：手机只留 3×2 六个（隐藏第 7 个 Fan），图片按 4:3 原比例完整显示 */
.prod-grid-shape .prod-card:nth-child(7) { display: none; }
.prod-grid-shape .prod-card img { height: auto; }
.svc-grid { grid-template-columns: repeat(2, 1fr); }
.cases-grid { grid-template-columns: repeat(2, 1fr); }
}
.product .entry-main { background: transparent; color: #1f1f1f; padding: 10px 6px; }
.product .entry-main a:not(.btn) { color: #1f1f1f; }
.product .entry-main a:hover { color: #1f1f1f; }
/* image border */
.product .entry-media { border: 1px solid #e0ddd5; }
/* card title */
.product .entry-title3 {
min-height: 96px;
line-height: 1.4;
border-radius: 4px;
transition: background .15s;
display: flex;
align-items: center;
justify-content: center;
}
.product:hover .entry-title3 { background: #f0efea; }
.tag-cloud { display: flex; flex-wrap: wrap; gap: 8px; justify-content: center; }
.tag-cloud .btn { margin: 0; }
/* sidebar title link（悬停变主题珊瑚红，提示可点） */
.side-section-title a { color: inherit; text-decoration: none; transition: color .15s ease; }
.side-section-title a:hover { color: #fa6f57; }
/* unified page content top spacing */
/* ==========================================================================
13) 产品中心改版：主页分组 / 二级分类页 / 三级分类页 / 详情页
========================================================================== */
/* 产品详情页：淘宝式图片区（左侧竖排小图 + 右侧大图/视频，悬停切换） */
.pd-gallery { display: flex; gap: 14px; align-items: flex-start; }
.pd-thumbs { flex: 0 0 80px; display: flex; flex-direction: column; gap: 5px; }
.pd-thumb {
width: 75px; height: 75px; border: 1px solid #e0ddd5; border-radius: 4px;
overflow: hidden; cursor: pointer; box-sizing: border-box;
transition: border-color .15s;
}
.pd-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.pd-thumb.active { border: 2px solid #a14232; }
.pd-thumb-video { display: flex; align-items: center; justify-content: center; background: #332d2d; background-size: cover; background-position: center; }
.pd-thumb-video .pd-play { color: #fff; font-size: 20px; text-shadow: 0 1px 6px rgba(0,0,0,.55); }
.pd-stage { flex: 1; min-width: 0; }
.pd-view { display: none; }
.pd-view.active { display: block; }
.pd-view img { width: 100%; height: auto; display: block; border-radius: 4px; }
.pd-view video { width: 100%; height: auto; display: block; }
/* video: square frame with white bg (same footprint as the square product images),
video vertically centered with blank space above/below, never cropped */
.pd-view.pd-view-video { width: 100%; aspect-ratio: 1 / 1; background: #fff; border-radius: 4px; overflow: hidden; }
.pd-view.pd-view-video.active { display: flex; align-items: center; justify-content: center; }
.pd-view.pd-view-video video { max-height: 100%; object-fit: contain; }
.pd-view.pd-view-video .video-embed { width: 100%; }
/* 手机端：大图在上、缩略图在下（缩略图排成一行，固定 6 个位置等分整行；
有视频时视频缩略图仍在第一个）。只有一张图（无视频）时整行缩略图不显示。 */
@media (max-width: 767px) {
.pd-gallery { flex-direction: column; gap: 10px; }
.pd-stage { order: -1; }
.pd-thumbs { flex: 0 0 auto; width: 100%; flex-direction: row; gap: 6px; }
.pd-thumbs--single { display: none; }
.pd-thumb { flex: 0 0 calc((100% - 30px) / 6); width: auto; height: auto; aspect-ratio: 1 / 1; }
}
/* 产品详情页 tab：按钮加边框，激活加背景色 */
.pd-tabs { display: flex; gap: 10px; margin-bottom: 18px; }
.pd-tab {
display: inline-block; padding: 9px 22px; border: 1px solid #d8d5cd; border-radius: 4px;
color: #555; font-size: 15px; text-decoration: none; transition: all .15s;
}
.pd-tab:hover { color: #a14232; border-color: #a14232; text-decoration: none; }
.pd-tab.active { background: #332d2d; border-color: #332d2d; color: #fff; }
/* 手机端：4 个 tab 原来 434px 宽超出 360px 容器，被 flex 压窄后 "Use Cases" 折成两行、
第 4 个还溢出屏幕。缩小字号与内边距 + 不允许换行，一行放得下；极窄屏兜底可横向滑动 */
@media (max-width: 767px) {
.pd-tabs { gap: 6px; overflow-x: auto; scrollbar-width: none; -webkit-overflow-scrolling: touch; }
.pd-tabs::-webkit-scrollbar { display: none; }
.pd-tab { flex: 0 0 auto; padding: 7px 10px; font-size: 13px; line-height: 1.4; white-space: nowrap; }
}
/* ★ tab 内容区（Overview / Specification / FAQ 共用）：主题给的灰底 #f2f2f2 偏深、
灰字 #919191 也不适合正文 —— 换成很浅的暖灰底 + 正文黑字（2026-09-21） */
.tab-content { background: #faf9f6; color: #332d2d; line-height: 1.75; }
/* 产品中心主页：二级分类大标题 + 三级分类一排三个 */
.group-intro { font-size: 18px; line-height: 1.8; margin:15px; }
.product .entry-media .entry-ph { height: 168px; background: #f6f5f1; }
/* 分类页大标题下的编辑器图文内容 */
.cat-intro-body { font-size: 15px; line-height: 1.8; margin: 15px; }
.cat-intro-body img { max-width: 100%; height: auto; }
/* 分类页顶部介绍里的分段小标题（reset 会把 h3 变成正文大小，这里单独给样式） */
.cat-intro-body h3 { font-size: 18px; font-weight: 600; line-height: 1.5; color: #332d2d; margin: 22px 0 8px; }
.cat-intro-body h3:first-child { margin-top: 0; }
/* 二级分类页：三级分类卡片（每行 3 个；图在上，标题 + 介绍在下） */
.cat-sub-list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.cat-sub-item { display: flex; flex-direction: column; gap: 12px; align-items: flex-start; text-decoration: none; color: #333; padding: 14px; border: 1px solid #eee; border-radius: 8px; transition: border-color .15s, box-shadow .15s; }
.cat-sub-item:hover { border-color: #d8d5cd; box-shadow: 0 4px 14px rgba(0,0,0,.06); }
.cat-sub-img { flex: 0 0 auto; width: 100%; }
.cat-sub-img img { width: 100%; object-fit: cover; border-radius: 6px; display: block; }
.cat-sub-info { flex: 1; }
.cat-sub-info h3 { font-size: 17px; font-weight: 600; color: #332d2d; margin: 0 0 8px; text-align: center; }
.cat-sub-info p { font-size: 14px; color: #777; line-height: 1.7; margin: 0; }
.cat-sub-item:hover .cat-sub-info h3 { color: #a14232; }
/* 商用厨房设备三张卡（产品中心最下面）：只留图 + 标题，一行 3 个，图按原比例完整显示 */
/* 商用厨房设备三张卡（产品中心最下面）：一行 3 个，图按原比例完整显示，标题居中 */
.cat-sub-list--plain .cat-sub-item { padding: 12px; }
.cat-sub-list--plain .cat-sub-img img { height: auto; object-fit: contain; }
.cat-sub-list--plain .cat-sub-info { width: 100%; }
.cat-sub-list--plain .cat-sub-info h3 { margin-bottom: 0; text-align: center; }
/* 二级产品页里的第二块（铁板烧页 → 商用厨房设备）：与上一块留出分隔 */
.ckp-cat-block { margin-top: 46px; padding-top: 38px; border-top: 1px solid #e6e2da; }
.ckp-cat-block-h { margin-bottom: 6px; }
/* 应用版块：标题上方不画分隔线，只留间距 */
.ckp-cat-block--norule { margin-top: 40px; padding-top: 0; border-top: 0; }
/* 子分类卡片一行 4 个（铁板烧页主块） */
.cat-sub-list.cat-sub-list--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
/* 应用版块：一行两个，左图（垂直居中）右文；标题在概述上方 */
.ckp-app-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.ckp-app-item {
display: flex; gap: 16px; align-items: center; padding: 14px;
border: 1px solid #eee; border-radius: 8px; background: #fff;
text-decoration: none; color: #333; transition: border-color .15s, box-shadow .15s;
}
.ckp-app-item:hover { border-color: #d8d5cd; box-shadow: 0 4px 14px rgba(0, 0, 0, .06); }
.ckp-app-img { flex: 0 0 38%; width: 38%; }
.ckp-app-img img { width: 100%; display: block; border-radius: 6px; border: 1px solid #e0ddd5; }
.ckp-app-info { flex: 1 1 auto; min-width: 0; }
.ckp-app-info h3 { font-size: 17px; font-weight: 600; color: #332d2d; margin: 0 0 8px; line-height: 1.4; }
.ckp-app-item:hover .ckp-app-info h3 { color: #a14232; }
.ckp-app-text { font-size: 14px; line-height: 1.72; color: #6b6357; }
.ckp-app-text p { margin: 0 0 8px; }
.ckp-app-text p:last-child { margin-bottom: 0; }
@media (max-width: 991px) {
.cat-sub-list.cat-sub-list--4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.ckp-app-list { grid-template-columns: 1fr; }
}
@media (max-width: 575px) {
.cat-sub-list.cat-sub-list--4 { grid-template-columns: 1fr; }
.ckp-app-item { flex-direction: column; align-items: stretch; }
.ckp-app-img { flex: 0 0 auto; width: 100%; }
}
/* title2 大标题内的链接（产品中心主页大标题可点；悬停变主题珊瑚红） */
.title2 h1 { margin-bottom: 0; }
.title2 h1 a { color: #fff; text-decoration: none; transition: color .15s ease; }
.title2 h1 a:hover { color: #fa6f57; }
.title2 h2 a { color: #fff; text-decoration: none; transition: color .15s ease; }
.title2 h2 a:hover { color: #fa6f57; }
/* ★ 2026-09-19：页面标题改成「面包屑里的 h1」，原来内容区的 h1 全部降为 h2，
所以让 h2 完全沿用原 h1 的**实际生效**样式：
- 不加粗（主题 reset 的 font:inherit 生效 → 400，所以这里不写 font-weight）
- margin-bottom: 0（项目早先在下面把 .title2 h1 的 -20px 覆盖掉了，
抄主题的 -20px 会让 .title2 高度少 20px、底部那条细线被深色条盖住） */
.title2 h2 {
padding-top: 5px; font-size: 30px; line-height: 2em; color: #fff; background: #332d2d;
font-family: fantasy; text-align: center; margin-bottom: 0; text-transform: capitalize;
}
/* 面包屑行里的 h1：作为面包屑的「最后一项」，与其它项完全同款（同样的 ">" 分隔符、
浮动在同一行、15px、加粗），只是它是 h1 标签；h1 里的链接指向当前页自身。
链接样式沿用主题的 .bc a（#332d2d），所以和前面的面包屑项一模一样。 */
.bc > li.bc-h1-li { float: left; display: list-item; margin-left: 0.5em; color: #332d2d; }
.bc-h1 {
display: inline; margin: 0; padding: 0;
font-size: 15px; font-weight: 700; color: #332d2d; line-height: inherit;
}
.bc-h1 a { color: inherit; }
/* 案例 / 视频中心主页：每个二级分类一组 —— 描述、3 条内容、查看更多的浅灰长条 */
.group-intro img, .cat-sub-intro img { max-width: 100%; height: auto; }
/* ★ 主题 minified.css 的 reset 对 b/strong/i/em/sub/sup/h1-h6 等用了 `font: inherit`，
把加粗 / 斜体 / 标题字号全抹平了。这里在「富文本容器」内恢复，否则后台编辑器里
加粗、斜体、上下标、标题格式在前台一律不生效。 */
.group-intro b, .group-intro strong,
.cat-intro b, .cat-intro strong,
.cat-intro-bottom b, .cat-intro-bottom strong,
.cat-intro-body b, .cat-intro-body strong,
.cat-sub-intro b, .cat-sub-intro strong,
.entry-content b, .entry-content strong,
#product-description b, #product-description strong,
.vr-summary b, .vr-summary strong,
.entry-summary b, .entry-summary strong,
.faq-summary b, .faq-summary strong,
.factory-text b, .factory-text strong,
.team-item-desc b, .team-item-desc strong,
.svc-desc b, .svc-desc strong,
.ck-factory-text b, .ck-factory-text strong { font-weight: 700; }
.group-intro i, .group-intro em,
.cat-intro i, .cat-intro em,
.cat-intro-bottom i, .cat-intro-bottom em,
.cat-intro-body i, .cat-intro-body em,
.cat-sub-intro i, .cat-sub-intro em,
.entry-content i, .entry-content em,
#product-description i, #product-description em,
.vr-summary i, .vr-summary em,
.entry-summary i, .entry-summary em,
.faq-summary i, .faq-summary em { font-style: italic; }
.group-intro sub, .cat-intro sub, .cat-intro-body sub, .cat-sub-intro sub,
.entry-content sub, #product-description sub { font-size: 75%; line-height: 0; position: relative; bottom: -0.25em; }
.group-intro sup, .cat-intro sup, .cat-intro-body sup, .cat-sub-intro sup,
.entry-content sup, #product-description sup { font-size: 75%; line-height: 0; position: relative; top: -0.5em; }
.group-intro u, .cat-intro u, .cat-intro-body u, .cat-sub-intro u,
.entry-content u, #product-description u { text-decoration: underline; }
/* 编辑器里的标题（blocks 下拉）也要恢复字号，否则和正文一样大 */
.group-intro h2, .cat-intro h2, .cat-intro-body h2, .cat-sub-intro h2, .entry-content h2, #product-description h2 { font-size: 24px; font-weight: 700; color: #332d2d; margin: 20px 0 20px; line-height: 1.3; }
.group-intro h3, .cat-intro h3, .cat-intro-body h3, .cat-sub-intro h3, .entry-content h3, #product-description h3 { font-size: 20px; font-weight: 700; color: #332d2d; margin: 15px 0 15px; line-height: 1.3; }
.group-intro h4, .cat-intro h4, .cat-intro-body h4, .cat-sub-intro h4, .entry-content h4, #product-description h4 { font-size: 17px; font-weight: 700; color: #332d2d; margin: 14px 0 6px; line-height: 1.35; }
.group-intro ul, .cat-intro ul, .cat-intro-body ul, .cat-sub-intro ul, .entry-content ul, #product-description ul { list-style: disc; padding-left: 22px; margin: 10px 0; }
.group-intro ol, .cat-intro ol, .cat-intro-body ol, .cat-sub-intro ol, .entry-content ol, #product-description ol { list-style: decimal; padding-left: 22px; margin: 10px 0; }
.group-intro li, .cat-intro li, .cat-intro-body li, .cat-sub-intro li, .entry-content li, #product-description li { margin: 4px 0; }
.cat-sub-intro { font-size: 14px; color: #666; line-height: 1.7; }
.view-more-bar {
display: block; text-align: center; text-decoration: none;
background: #f0efec; color: #555; font-size: 15px;
padding: 15px 12px; margin: 0 0 20px; border-radius: 4px;
transition: background .15s ease, color .15s ease;
}
.view-more-bar .vm-more { font-weight: 600; }
.view-more-bar:hover { background: #e8e6e1; color: #555; text-decoration: none; }
.view-more-bar:hover .vm-more { color: #a14232; }
.products-wrapper2 .product.list-card.ph { border: 0; background: transparent; }
/* 首页「产品介绍」两段小标题：整行标题可点，颜色跟随标题、悬停变珊瑚红 */
.cy-sub-title a { color: inherit; text-decoration: none; transition: color .15s ease; }
.cy-sub-title a:hover { color: #fa6f57; }
@media (max-width: 991px) {
.cat-sub-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.cat-sub-item { flex-direction: column; align-items: flex-start; }
.cat-sub-img { flex: 0 0 auto; }
.cat-sub-img img { width: 100%; height: 140px; }
/* 商用厨房设备三张卡：手机端仍保持一行 3 个，图按原比例完整显示；
PC/平板 >991 保留概述，手机端隐藏概述只留图 + 标题 */
.cat-sub-list.cat-sub-list--plain { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.cat-sub-list--plain .cat-sub-item { padding: 6px; gap: 6px; }
.cat-sub-list--plain .cat-sub-img img { height: auto; }
.cat-sub-list--plain .cat-sub-info h3 { font-size: 13px; }
.cat-sub-list--plain .cat-sub-intro { display: none; }
}
/* ==========================================================================
14) 产品详情页：标题下前 5 个参数（每项 2 行 = 英文标签行 + 中文标签行）
主题的 .product-details .entry-content p 会把字压成 12px / #919191，
选择器权重必须提到 3 个 class 以上才能覆盖。
========================================================================== */
.qp-item { margin-bottom: 12px; }
.qp-item:last-child { margin-bottom: 0; }
.product-details .entry-content .qp-line {
margin: 0 0 3px; font-size: 14px; line-height: 1.55; color: #1f1f1f;
}
.product-details .entry-content .qp-line strong { font-weight: 700; }
/* ==========================================================================
15) 产品详情页 GET INFO 按钮区
.inline-li 全站仅此一处，所以只作用在这里。
老主题的 ol,ul{padding-left:1.25em}、.btn-default{margin-bottom:20px}、
.li-m-r-l>li{margin:0 5px} 都是全站工具类（首页按钮/标签云/分页都在用），
不能直接改，这里用更高权重局部覆盖。
========================================================================== */
.product-details .inline-li { padding-left: 0; }
.product-details .inline-li > li { margin: 10px 0; }
.product-details .inline-li .btn-default { margin-bottom: 0; }
/* ==========================================================================
16) 产品详情页底部：You May Like（复用列表卡片）+ Contact 询盘表单
========================================================================== */
.pd-block { margin-top: 48px; }
.pd-block-title {
font-size: 26px; font-weight: 700; color: #332d2d; line-height: 1.25;
margin: 0; padding-bottom: 12px; border-bottom: 2px solid #332d2d;text-align:center;
}
.pd-block .row { margin-top: 22px; }
/* 新闻详情：正文下方「Related News」10 条，两列文字链接 */
.ck-news-related-list {
list-style: none; margin: 20px 0 0; padding: 0;
display: grid; grid-template-columns: repeat(2, minmax(0, 1fr));
column-gap: 44px;
}
.ck-news-related-list li { margin: 0; border-bottom: 1px solid #eee9e2; }
.ck-news-related-list li a {
display: block; padding: 12px 0; font-size: 14.5px; line-height: 1.55;
color: #332d2d; text-decoration: none; transition: color .15s;
}
.ck-news-related-list li a:hover { color: #a14232; }
@media (max-width: 767px) {
.ck-news-related-list { grid-template-columns: 1fr; column-gap: 0; }
}
#pd-contact { scroll-margin-top: 90px; }
.pd-contact-sub { color: #555; font-size: 15px; line-height: 1.75; margin: 16px 0 22px; text-align:center; }
/* 左栏：联系方式（图标沿用主题 .round-icon 圆形样式） */
.pd-block .pd-contact-row { margin-top: 0; text-align: left; }
.pd-contact-info-title { font-size: 20px; font-weight: 700; color: #332d2d; margin: 0 0 20px; }
.pd-contact-list { list-style: none; margin: 0; padding: 0; }
.pd-contact-list li { display: flex; align-items: center; gap: 12px; margin-bottom: 16px; }
.pd-contact-list li:last-child { margin-bottom: 0; }
.pd-contact-list .round-icon { flex: 0 0 auto; }
.pd-ci-body { min-width: 0; }
.pd-ci-title { display: inline; font-size: 15px; font-weight: 700; color: #332d2d; margin-right: 5px; }
.pd-ci-text { display: inline; font-size: 15px; color: #1f1f1f; line-height: 1.7; word-break: break-word; }
.pd-ci-text a { color: #1f1f1f; text-decoration: none; }
.pd-ci-text a:hover { color: #a14232; }
/* 手机端：底部询价表单原来只有 15px 边距，输入框看着贴边；左右各加到 23px。
合作伙伴申请表单（/partners.html）同理，和询价表单保持一样的留白 */
@media (max-width: 767px) {
.pd-contact-row > .pd-contact-info,
.pd-contact-row > .pd-contact-form-col { padding-left: 23px; padding-right: 23px; }
.pd-partner-form { padding-left: 8px; padding-right: 8px; }
}
/* 右栏：询盘表单 */
.pd-form { max-width: 860px; }
.pd-form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 22px; }
.pd-field { margin-bottom: 16px; }
.pd-field-full { grid-column: 1 / -1; }
.pd-honey { display: none !important; }
.pd-assurance { margin: 12px 0 0; font-size: 13px; color: #777; line-height: 1.6; }
.pd-field label { display: block; font-size: 14px; font-weight: 700; color: #1f1f1f; margin-bottom: 7px; }
.pd-field .pd-req { color: #a14232; }
.pd-field input,
.pd-field textarea {
width: 100%; box-sizing: border-box; min-height: 44px;
padding: 10px 12px; border: 1px solid #e0ddd5; border-radius: 4px;
background: #fff; color: #1f1f1f; font-size: 15px; line-height: 1.4;
}
/* 合作伙伴申请表（/partners.html 底部）：业务类型下拉沿用输入框外观；整表居中 */
.pd-field select {
width: 100%; box-sizing: border-box; min-height: 44px;
padding: 10px 12px; border: 1px solid #e0ddd5; border-radius: 4px;
background: #fff; color: #1f1f1f; font-size: 15px; line-height: 1.4;
}
.pd-field select:focus { outline: 0; border-color: #332d2d; }
.pd-partner-form .pd-form { margin-left: auto; margin-right: auto; }
.pd-field textarea { min-height: 118px; resize: vertical; font-family: inherit; }
.pd-field input:focus,
.pd-field textarea:focus { outline: 0; border-color: #332d2d; }
.pd-submit {
min-width: 190px; min-height: 48px; padding: 0 30px;
border: 0; border-radius: 4px; background: #332d2d; color: #fffae6;
font-size: 16px; font-weight: 700; letter-spacing: .4px;
cursor: pointer; transition: background .15s;
}
.pd-submit:hover { background: #a14232; }
.pd-form-note { margin: 12px 0 0; font-size: 14px; color: #555; }
.pd-form-note a { color: #a14232; }
.ck-v8-status.is-error { color: #a14232; }
.ck-v8-success {
margin: 0; padding: 22px 24px; border: 1px solid #d8d5cd; border-radius: 4px;
background: #f6f5f1; color: #332d2d; font-size: 15px; line-height: 1.6;
}
@media (max-width: 767px) {
.pd-block { margin-top: 34px; }
.pd-block-title { font-size: 22px; }
.pd-form-grid { grid-template-columns: 1fr; gap: 0; }
.pd-submit { width: 100%; }
}
/* ==========================================================================
17) VR 实景（case_vr）：pannellum 全景 + 视角切换
========================================================================== */
.vr-title { font-size: 26px; font-weight: 700; color: #332d2d; line-height: 1.3; margin:16px 0 4px; }
.vr-hint { font-size: 15px; color: #777; line-height: 1.6; margin: 0 0 18px; }
.vr-hint-mobile { display: none; }
.vr-stage { position: relative; background: #1a1a1a; border-radius: 6px; overflow: hidden; }
#vr-pano { width: 100%; height: 70vh; min-height: 420px; }
.vr-stage:fullscreen { border-radius: 0; }
.vr-stage:fullscreen #vr-pano { height: 100vh; }
.vr-bar {
position: absolute; left: 0; right: 0; top: 0; z-index: 5;
display: flex; align-items: center; justify-content: space-between; gap: 12px;
padding: 10px 14px; background: rgba(20, 20, 20, .55);
}
.vr-view-name { color: #fff; font-size: 14px; font-weight: 700; }
.vr-modes { display: flex; gap: 8px; flex: 0 0 auto; }
.vr-mode {
border: 1px solid rgba(255, 255, 255, .45); background: rgba(255, 255, 255, .12);
color: #fff; font-size: 12.5px; line-height: 1; padding: 7px 13px;
border-radius: 3px; cursor: pointer; transition: background .15s, border-color .15s;
}
.vr-mode:hover, .vr-mode.active { background: #a14232; border-color: #a14232; }
.vr-tip {
position: absolute; left: 14px; bottom: 12px; z-index: 5;
color: rgba(255, 255, 255, .75); font-size: 12.5px; pointer-events: none;
}
.vr-watermark {
position: absolute; top: 66.667%; left: 50%; transform: translate(-50%, -50%);
width: min(220px, 34vw); height: auto; opacity: .3; z-index: 6;
pointer-events: none; user-select: none; -webkit-user-drag: none;
}
.vr-thumbs { display: flex; flex-wrap: wrap; gap: 8px; margin: 20px 0;justify-content:center; }
.vr-thumb {
border: 1px solid #d8d5cd; background: #fff; color: #555; cursor: pointer;
font-size: 13px; line-height: 1; padding: 8px 15px; border-radius: 3px;
transition: background .15s, border-color .15s, color .15s;
}
.vr-thumb:hover { border-color: #a14232; color: #a14232; }
.vr-thumb.active { background: #332d2d; border-color: #332d2d; color: #fff; }
.vr-block-title {
font-size: 20px; font-weight: 700; color: #332d2d; margin: 0 0 14px;
padding-bottom: 10px; border-bottom: 2px solid #332d2d;
}
.vr-params { width: 100%; border-collapse: collapse; margin: 0 0 26px; font-size: 14px; }
.vr-params th, .vr-params td { border: 1px solid #ece9e2; padding: 10px 12px; text-align: left; vertical-align: top; }
.vr-params th { width: 34%; background: #faf9f6; font-weight: 600; color: #1f1f1f; }
.vr-params td { color: #1f1f1f; }
.vr-param-zh { display: block; font-size: 12.5px; font-weight: 400; color: #999; margin-top: 3px; }
.vr-summary { font-size: 15px; color: #555; line-height: 1.9; margin: 0 0 18px; }
.vr-tags { margin: 0 0 16px; }
.vr-scene-list { list-style: none; margin: 0; padding: 0; }
.vr-scene-list li { margin-bottom: 12px; }
.vr-scene-list a { display: flex; align-items: center; gap: 12px; text-decoration: none; color: #1f1f1f; }
.vr-scene-list img { width: 100px; height: 64px; object-fit: cover; flex: 0 0 auto; border: 1px solid #e0ddd5; }
.vr-scene-list span { font-size: 14px; line-height: 1.5; }
.vr-scene-list a:hover span { color: #a14232; }
/* VR / 案例列表卡片上的参数标签 chips */
/* 列表卡片图片统一 168px 高（list.html 的案例/视频/VR + 落地页 You May Like） */
.product.list-card .entry-media img.thumb {
display: block; width: 100%; height: 168px; object-fit: cover;
}
/* 列表卡片等高，消除 float 错位（标题行数、chips 行数不同导致高度不一 → 一排3个下一排1个） */
.row.card-grid { display: flex; flex-wrap: wrap; }
.row.card-grid:before, .row.card-grid:after { content: none; display: none; }
.row.card-grid > .col-xs-12 { display: flex; }
.row.card-grid > .col-xs-12 > .product { width: 100%; display: flex; flex-direction: column; }
.vr-filter-bar b { color: #a14232; font-weight: 700; }
@media (max-width: 767px) {
.vr-title { font-size: 22px; }
.vr-hint-desktop { display: none; }
.vr-hint-mobile { display: block; }
#vr-pano { height: 55vh; min-height: 300px; }
.vr-bar { flex-direction: column; align-items: flex-start; gap: 8px; }
.vr-tip { display: none; }
.vr-block-title { font-size: 18px; }
}
/* --- accessibility helpers --- */
@media (prefers-reduced-motion: reduce) {
*, *::before, *::after {
animation-duration: .001ms !important;
animation-iteration-count: 1 !important;
transition-duration: .001ms !important;
scroll-behavior: auto !important;
}
}
/* --- product detail share bar --- */
.pd-share { margin-top: 14px; display: flex; align-items: center; flex-wrap: wrap; gap: 10px; }
.pd-share-label { font-size: 13px; color: #555; }
.pd-share-list { margin: 0; padding: 0; list-style: none; display: flex; align-items: center; gap: 7px; }
.pd-share-list > li { display: inline-block; }
.pd-share .round-icon { font-size: 15px; }
.pd-share .pd-ic { display: inline-flex; align-items: center; justify-content: center; line-height: 1 !important; }
.pd-share .pd-ic svg { width: 1em; height: 1em; display: block; }
.pd-share-note { display: none; font-size: 12px; color: #2e7d32; }
/* ==========================================================================
18) Mobile enhancements
Every rule below lives inside max-width:767px, so the desktop rendering is
byte-for-byte untouched. Fixes measured at 375px:
- header top bar was 574px wide inside a 360px row -> right side clipped
- hero caption was taller than the 320px band -> clipped top and bottom
- 28px social icons / 32px menu trigger / 21px text links = hard to tap
- 15px inputs make iOS Safari zoom the page in on focus
========================================================================== */
@media (max-width: 767px) {
/* stop iOS from inflating text in landscape */
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
/* keep content clear of the notch / rounded corners */
#page-wrapper {
padding-left: env(safe-area-inset-left, 0px);
padding-right: env(safe-area-inset-right, 0px);
}
/* --- header top bar ---
Was: email 266px + 8 social icons 308px = 574px in a 360px row, so most
of the icon row sat off-screen and was clipped by overflow:hidden.
Now: the two groups stack, the icon row spreads across the full width. */
.header-top { padding: 10px 0; }
.header-top-inner { flex-wrap: wrap; justify-content: center; row-gap: 8px; }
.ht-left a { font-size: 15px; gap: 6px; padding: 5px 0; }
.ht-mail-ico svg { width: 16px; height: 16px; }
.ht-right { width: 100%; flex-wrap: wrap; justify-content: space-between; gap: 4px; }
.ht-soc { width: 36px; height: 36px; }
.ht-soc svg { width: 17px; height: 17px; }
.ht-soc::after { display: none; } /* hover label: useless on touch */
/* --- hero banner ---
The caption is centred in a fixed-height band; at 375px the text was
taller than the band and got cut off at the top and bottom. Keeping the
band height as-is means the background photo is cropped exactly as
before; only the type is scaled down so the caption fits. */
.cy-banner-cap { padding: 20px 16px; }
.cy-banner-title { font-size: 21px; margin-bottom: 8px; }
.cy-banner-sub { font-size: 13px; margin-bottom: 14px; }
.cy-banner-btns { flex-direction: column; gap: 8px; }
.cy-banner-btns .btn { width: 100%; padding: 10px 16px; font-size: 14px; }
.cy-banner-dots { bottom: 12px; }
/* --- mobile menu trigger: 32px -> comfortable touch target --- */
.dl-trigger {
width: 44px; height: 44px; padding: 0;
display: inline-flex; align-items: center; justify-content: center;
}
.dl-trigger .round-icon { font-size: 24px; }
/* --- form controls: 15px makes iOS Safari zoom in when focused --- */
.pd-form input, .pd-form textarea, .pd-form select,
input[type="text"], input[type="email"], input[type="tel"],
input[type="search"], textarea, select { font-size: 16px; }
.pd-submit { min-height: 46px; }
/* --- tap targets --- */
/* the ">" separator sits on the floated
, so once the links got a
taller hit area it could break onto a line of its own; move it inside
the link instead so a crumb is never split from its separator. */
.bc > li { float: none; display: inline; margin-left: 0; }
.bc > li + li:before { content: none; }
.bc > li + li a::before { content: '> '; }
.breadcrumb a, .bc a { display: inline-block; padding: 6px 0; }
.cat-tree a { display: inline-block; padding: 5px 0; }
.cat-sub-list { grid-template-columns: 1fr; }
.side-section-content .btn-xs { padding: 6px 12px; font-size: 13px; }
.pd-share-list a {
display: inline-flex; align-items: center; justify-content: center;
width: 40px; height: 40px;
}
.pd-ci-text a, .side-section-title a { display: inline-block; padding: 5px 0; }
.cy-link-btn { display: inline-flex; align-items: center; min-height: 36px; }
.footer-links ul li { margin: 0 9px; }
.footer-links ul li a { display: inline-block; padding: 7px 0; font-size: 14px; }
}
/* ==========================================================================
19) Photos / Design Drawings 图片网格 + 大图弹窗
========================================================================== */
/* 瀑布流：grid + JS 算行跨度，按「从左到右」铺排。
不用 CSS columns —— 纵向填充会把数据里连续的同类设备照片连成一整列。 */
.photo-wall { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0 16px; grid-auto-rows: 6px; grid-auto-flow: row dense; align-items: start; }
.photo-item { margin: 0; }
.photo-tile { display: block; margin: 0 0 16px; border-radius: 6px; overflow: hidden; background: #f3f1ec; }
.photo-tile img { display: block; width: 100%; height: auto; }
/* 分批出现：轻微上浮 + 渐显，逐张错开 */
@keyframes ck-photo-in { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: none; } }
.photo-item.is-in { animation: ck-photo-in .5s cubic-bezier(.22,.61,.36,1) both; }
@media (prefers-reduced-motion: reduce) { .photo-item.is-in { animation: none; } }
/* 筛选未命中 / 尚未滚到（分批显示） */
[data-filter-item].tf-miss { display: none; }
.photo-item.is-pending { display: none; }
.photo-more-sentinel { height: 1px; margin: 0; }
.photo-filter-bar b { color: #a14232; font-weight: 700; }
/* 大图弹窗（photos 瀑布流 + 标签落地页 Photos 分组共用） */
.photo-lightbox { position: fixed; inset: 0; z-index: 9999; }
.photo-lightbox[hidden] { display: none; }
.pl-backdrop { position: absolute; inset: 0; background: rgba(0, 0, 0, .85); }
.pl-stage { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; }
.pl-img { max-width: 92vw; max-height: 82vh; border-radius: 4px; box-shadow: 0 10px 50px rgba(0, 0, 0, .5); }
.pl-close, .pl-prev, .pl-next {
position: absolute; border: 0; background: rgba(255, 255, 255, .16); color: #fff;
font-size: 26px; line-height: 1; width: 44px; height: 44px; border-radius: 50%;
cursor: pointer; z-index: 2; padding: 0;
}
.pl-close:hover, .pl-prev:hover, .pl-next:hover { background: rgba(255, 255, 255, .32); }
.pl-close { top: 16px; right: 16px; }
.pl-prev { left: 16px; top: 50%; transform: translateY(-50%); }
.pl-next { right: 16px; top: 50%; transform: translateY(-50%); }
.pl-prev[hidden], .pl-next[hidden] { display: none; }
.pl-bar {
position: absolute; left: 0; right: 0; bottom: 14px; text-align: center; color: #fff;
font-size: 13px; text-shadow: 0 1px 6px rgba(0, 0, 0, .6); padding: 0 64px;
}
.pl-title { font-weight: 600; margin-bottom: 2px; }
.pl-counter { opacity: .85; }
/* 标签落地页 Photos 分组缩略图 */
.tpl-list li.tpl-photo .tpl-thumb a { display: block; }
.tpl-list li.tpl-photo .tpl-thumb img { width: 100%; height: 140px; object-fit: cover; }
@media (max-width: 991px) { .photo-wall { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
/* 手机：两列小格，别一张占满一屏 */
@media (max-width: 575px) {
.photo-wall { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 10px; }
.photo-tile { margin: 0 0 10px; border-radius: 4px; }
.pl-prev, .pl-next { width: 38px; height: 38px; font-size: 20px; }
.pl-bar { font-size: 12px; padding: 0 44px; }
}
/* ==========================================================================
20) 侧栏分类树行悬停（产品中心 / 案例 / 视频列表 / 视频落地页 右栏共用）
这些侧栏的小项目都是 .sidebar 内的 ul.panel-body > li > a（产品侧栏多带一个
cat-tree-l2 类，视频落地页只有 panel-body），所以统一用 .sidebar 圈定范围；
FAQ 主内容区的 div.panel-body 不在 .sidebar 内，不会被误伤。
效果对齐导航「产品中心」下拉框的 .cy-prod-name：
整行灰底 #f5f4ef + 文字变红 #a14232 + 虚线底纹 1px dashed #d8d5cd
虚线用 ::after 绝对定位画，不占高度，悬停时不会把下面的行顶下去。
选择器权重 (0,3,2) 高于主题里的 .panel-body>li>a:hover (0,2,2)，直接覆盖。
========================================================================== */
.sidebar .panel-body > li {
position: relative;
transition: background .15s;
}
.sidebar .panel-body > li > a {
transition: color .15s;
}
.sidebar .panel-body > li:hover {
background: #f5f4ef;
}
.sidebar .panel-body > li:hover > a {
color: #a14232;
}
.sidebar .panel-body > li:hover::after {
content: "";
position: absolute;
left: 0;
right: 0;
bottom: 0;
border-bottom: 1px dashed #d8d5cd;
}
/* 整行可点击 + 行高 27 -> 30。
链接改为 block 撑满整行，鼠标落在行的任意位置都能点（原来是 inline，只有文字可点）。
只作用于桌面：移动端第 18 段里 .cat-tree a{display:inline-block;padding:5px 0}
的点击区不受影响。 */
@media (min-width: 768px) {
.sidebar .panel-body > li {
line-height: 30px;
}
.sidebar .panel-body > li > a {
display: block;
}
}
/* 移动端：面包屑的分隔符在 .bc > li::before 上会被关掉、改挂在链接的 a::before 上，
h1 那一项现在也带 ，所以会自动跟着走，只需清掉它多出来的左边距。 */
@media (max-width: 767px) {
/* h1 那一项在桌面是 float:left（块级），手机上会让「Home」独占一行；
这里连里面的链接一起改行内，面包屑就能整段自然折行（链接是 inline-block
时整块放不下会跳到下一行，才会出现单独的「Home」行） */
.bc > li.bc-h1-li { margin-left: 0; float: none; display: inline; }
.bc > li.bc-h1-li .bc-h1 a { display: inline; }
}
/* ==========================================================================
20) 右下角悬浮「Contact Us Now」+ 圆形联系头像（全站固定定位）
========================================================================== */
.fb-livechat-cta {
position: fixed;
right: 70px;
bottom: 92px;
z-index: 9998;
background: #332d2d;
color: #fff;
border-radius: 6px;
padding: 11px 16px;
font: 600 14px Arial, sans-serif;
box-shadow: 0 8px 24px rgba(0, 0, 0, .18);
text-decoration: none;
}
.fb-livechat-cta:hover,
.fb-livechat-cta:focus {
color: #fff;
text-decoration: none;
background: #4a3f3f;
}
.ck-livechat-avatar {
position: fixed;
right: 18px;
bottom: 92px;
z-index: 9999;
width: 44px;
height: 44px;
border-radius: 50%;
background: #2f3328 url('/images/cookeryaki-contact-avatar.png') center/36px auto no-repeat;
box-shadow: 0 8px 24px rgba(0, 0, 0, .2);
border: 2px solid #2f3328;
text-indent: -9999px;
overflow: hidden;
}
.ck-livechat-avatar:hover,
.ck-livechat-avatar:focus {
background-color: #3f493a;
outline: 0;
}
/* 回到顶部：白底描边胶囊 + ∧ + TOP，摆在圆形头像正上方（与头像同一条右边线）。
滚过一屏后才淡入 —— JS 见 partials/contact_cta.html 末尾；脚本没跑就不出现。 */
.ck-backtop {
position: fixed;
right: 18px;
bottom: 150px;
z-index: 9999;
display: inline-flex;
align-items: center;
justify-content: center;
gap: 5px;
height: 38px;
padding: 0 14px;
box-sizing: border-box;
border-radius: 19px;
background: #fff;
color: #332d2d;
border: 1px solid #dcd7cd;
box-shadow: 0 6px 18px rgba(0, 0, 0, .12);
font: 700 11px/1 Arial, sans-serif;
letter-spacing: .6px;
text-decoration: none;
cursor: pointer;
opacity: 0;
pointer-events: none;
transform: translateY(8px);
transition: opacity .28s ease, transform .28s ease,
background-color .18s ease, color .18s ease, border-color .18s ease;
}
.ck-backtop.on { opacity: 1; pointer-events: auto; transform: translateY(0); }
.ck-backtop:hover,
.ck-backtop:focus { background: #332d2d; color: #fff; border-color: #332d2d; text-decoration: none; }
@media (prefers-reduced-motion: reduce) {
.ck-backtop { transition: none; transform: none; }
}
@media (max-width: 767px) {
.fb-livechat-cta { right: 62px; bottom: 74px; font-size: 13px; padding: 10px 13px; }
.ck-livechat-avatar { right: 12px; bottom: 74px; width: 42px; height: 42px; background-size: 34px auto; }
.ck-backtop { right: 12px; bottom: 126px; height: 34px; padding: 0 12px; font-size: 10.5px; }
}
/* ==========================================================================
21) 列表页顶部「按标签筛选」条（客户案例 4 个分类主页：案例 / VR / Photos / 图纸）
========================================================================== */
.tag-filter-bar {
margin: 0 0 20px;
padding: 10px 14px;
background: #faf9f6;
border: 1px solid #e8e5dd;
border-radius: 6px;
}
.tf-row {
display: flex;
flex-wrap: wrap;
align-items: flex-start;
gap: 8px;
padding: 6px 0;
border-top: 1px dashed #e3e0d8;
}
.tf-row:first-child { border-top: 0; padding-top: 0; }
.tf-row:last-child { padding-bottom: 0; }
.tf-label {
flex: 0 0 150px;
font-size: 13px;
line-height: 28px;
color: #7a746c;
font-weight: 600;
}
.tf-tags { flex: 1 1 0; min-width: 0; display: flex; flex-wrap: wrap; gap: 8px; overflow: hidden; transition: max-height .28s ease; }
/* 标签超出「首个维度 3 行 / 其余 1 行」时出现的 More 箭头 */
.tf-toggle {
flex: 1 0 100%; border: 0; background: none; padding: 2px 2px 0; margin: 0;
font-size: 12px; line-height: 1.6; color: #a14232; text-align: right; cursor: pointer;
}
.tf-toggle:hover { text-decoration: underline; }
.tf-toggle[hidden] { display: none; }
/* 手机端整条筛选栏的折叠头（桌面不显示） */
.tf-togglebar { display: none; }
.tf-tb-btn {
flex: 1 1 auto; display: flex; align-items: center; justify-content: space-between;
border: 0; background: none; padding: 2px 0; margin: 0; cursor: pointer; text-align: left;
font-size: 14px; font-weight: 600; color: #332d2d;
}
.tf-tb-clear {
flex: 0 0 auto; border: 1px solid #e0dcd3; background: #fff; border-radius: 12px;
padding: 3px 10px; margin: 0; font-size: 12px; color: #a14232; cursor: pointer;
}
.tf-tb-clear[hidden] { display: none; }
.tf-caret {
display: inline-block; margin-left: 4px; vertical-align: 2px;
border-left: 4px solid transparent; border-right: 4px solid transparent; border-top: 5px solid currentColor;
transition: transform .2s ease;
}
.tf-toggle.is-open .tf-caret { transform: rotate(180deg); }
.tf-tag {
border: 1px solid #ddd8ce;
background: #fff;
color: #332d2d;
border-radius: 4px;
padding: 5px 11px;
font-size: 13px;
line-height: 1.2;
cursor: pointer;
transition: background .15s, border-color .15s, color .15s;
}
.tf-tag:hover { border-color: #332d2d; background: #f2f0ea; }
.tf-tag.active { background: #332d2d; border-color: #332d2d; color: #fff; }
.tf-status {
margin-top: 10px;
padding-top: 9px;
border-top: 1px dashed #e3e0d8;
font-size: 13px;
color: #7a746c;
}
.tf-status b { color: #a14232; }
.tf-clear {
margin-left: 10px;
border: 0;
background: none;
padding: 0;
color: #a14232;
font-size: 13px;
text-decoration: underline;
cursor: pointer;
}
.tf-empty { margin-top: 10px; font-size: 13px; color: #7a746c; }
@media (max-width: 767px) {
.tf-label { flex: 0 0 100%; line-height: 1.5; margin-bottom: 6px; }
/* 手机端：整条筛选栏收起，只留一行「Filter by tags」，点开才展开各维度 */
.tf-togglebar { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.tag-filter-bar { padding: 8px 12px; margin-bottom: 12px; }
.tag-filter-bar:not(.is-open) .tf-row { display: none; }
.tag-filter-bar:not(.is-open) .tf-status { display: none !important; }
.tag-filter-bar.is-open .tf-togglebar {
padding-bottom: 8px; margin-bottom: 4px; border-bottom: 1px dashed #e3e0d8;
}
/* 展开筛选时先收起右下角悬浮 CTA，免得压住标签和 More */
body.tf-panel-open .ck-livechat-avatar,
body.tf-panel-open .fb-livechat-cta { display: none; }
}
/* ==========================================================================
22) 满屏媒体弹层（Use Cases / 内嵌内容区块里的 VR 全景与视频）
========================================================================== */
.ck-media {
position: fixed;
inset: 0;
z-index: 210;
background: #0b0b0b;
}
.ck-media[hidden] { display: none; }
.ck-media-box { position: absolute; inset: 0; background: #000; overflow: hidden; }
.ck-media-stage { position: absolute; inset: 0; }
.ck-media-stage > div,
.ck-media-stage video,
.ck-media-stage iframe {
display: block;
width: 100%;
height: 100%;
border: 0;
background: #000;
}
.ck-media-msg { display: flex; align-items: center; justify-content: center; height: 100%; color: #cfcac2; font-size: 15px; }
.ck-media-title {
position: absolute;
top: 0; left: 0; right: 96px;
z-index: 3;
padding: 14px 18px;
background: linear-gradient(rgba(0,0,0,.66), rgba(0,0,0,0));
color: #fff;
font-size: 15px;
font-weight: 600;
line-height: 1.4;
pointer-events: none;
}
.ck-media-close {
position: absolute;
top: 10px; right: 12px;
z-index: 4;
width: 40px; height: 40px;
border: 0;
border-radius: 50%;
background: rgba(255,255,255,.16);
color: #fff;
font-size: 26px;
line-height: 1;
cursor: pointer;
}
.ck-media-close:hover { background: rgba(255,255,255,.32); }
.ck-media-bar {
position: absolute;
left: 0; right: 0; bottom: 0;
z-index: 3;
display: flex;
flex-wrap: wrap;
align-items: center;
gap: 8px;
padding: 12px 16px;
background: linear-gradient(rgba(0,0,0,0), rgba(0,0,0,.72));
}
.ck-media-bar:empty { display: none; }
.ck-media-bar button {
border: 0;
border-radius: 4px;
background: rgba(255,255,255,.16);
color: #fff;
font-size: 12px;
font-weight: 600;
padding: 7px 12px;
cursor: pointer;
}
.ck-media-bar button:hover { background: rgba(255,255,255,.3); }
.ck-media-bar button.on { background: #a14232; }
.ck-media-hint { margin-left: auto; color: rgba(255,255,255,.68); font-size: 12px; }
/* 卡片右下角的 360° / 播放角标 */
.ck-res-thumb { position: relative; }
.ck-res-badge {
position: absolute;
right: 8px; bottom: 8px;
min-width: 34px; height: 22px;
padding: 0 7px;
border-radius: 3px;
background: rgba(0,0,0,.62);
color: #fff;
font-size: 11px;
font-weight: 600;
line-height: 22px;
text-align: center;
pointer-events: none;
}
.ck-res-badge-play::before {
content: "";
display: inline-block;
width: 0; height: 0;
border-style: solid;
border-width: 6px 0 6px 10px;
border-color: transparent transparent transparent #fff;
vertical-align: -1px;
}
.ck-res-badge-play { padding: 0 9px; }
@media (max-width: 767px) {
.ck-media-title { font-size: 13px; padding: 10px 60px 10px 12px; right: 60px; }
.ck-media-bar { padding: 10px 12px; gap: 6px; }
.ck-media-bar button { font-size: 11px; padding: 6px 10px; }
.ck-media-hint { display: none; }
}
/* ---------- 新闻列表：左侧小图 + 右侧标题 + 概述（2026-10-10） ---------- */
.news-list { margin: 0; padding: 0; }
.news-item {
display: flex; gap: 20px; align-items: flex-start;
padding: 0 0 22px; margin-bottom: 22px; border-bottom: 1px solid #ece8e0;
}
.news-item:last-child { padding-bottom: 0; margin-bottom: 0; border-bottom: 0; }
.news-item-thumb {
flex: 0 0 173px; width: 173px; height: 115px; display: block;
border-radius: 4px; overflow: hidden; background: #f2f1ee;
}
.news-item-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.news-item-main { flex: 1; min-width: 0; }
.news-item-title { margin: 0 0 8px; font-size: 17px; font-weight: 600; line-height: 1.45; }
.news-item-title a { color: #332d2d; text-decoration: none; }
.news-item-title a:hover { color: #a14232; text-decoration: none; }
.news-item-desc {
margin: 0; color: #6b6459; font-size: 14px; line-height: 1.75;
display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
@media (max-width: 767px) {
.news-item { gap: 12px; padding-bottom: 16px; margin-bottom: 16px; }
.news-item-thumb { flex: 0 0 90px; width: 90px; height: 64px; }
.news-item-title { font-size: 15px; margin-bottom: 6px; }
.news-item-desc { font-size: 13px; line-height: 1.6; }
}
/* 客户评价：窄屏改上下排列（图片在文字下方，互换也还原） */
/* ===== 从内联 style 抽出的公共类（2026-10-12）=====
原先散落在 11 个模板里的 style="…" 全部搬到这里，以后改样式只改这一处。
★ 一律写成「元素 + 类」：内联样式原本的优先级最高，改成单类选择器会被
base.css 里 .contp p 这类「类 + 元素」规则压过（entry-summary 的 15px
曾被压成 14px），加上标签名后与本文件的后加载顺序配合即可等效。 */
.ck-mb22 { margin-bottom: 22px; }
.panel-title > a.ck-active,
.panel-default .panel-title > a.ck-active,
.sidebar-nav a.ck-active,
a.ck-active { font-weight: 700; }
div.ck-footer-band { background: #332d2d; }
span.tag-count { color: #aaa; }
.btn-round.is-active { background: #332d2d; color: #fff; border-color: #332d2d; }
/* 首页 banner 占位（没配 banner 图时显示） */
div.hero-placeholder { background: #332d2d; color: #fff; padding: 80px 0; text-align: center; }
div.hero-placeholder h1 { color: #fff; }
div.hero-placeholder .hero-sub { color: rgba(255, 255, 255, .8); max-width: 760px; margin: 12px auto 0; }
div.hero-placeholder .hero-actions { margin-top: 22px; }
div.hero-placeholder .hero-actions .btn + .btn { margin-left: 10px; }
/* 视频嵌入（16:9 自适应） */
div.video-embed { position: relative; padding-top: 56.25%; width: 100%; }
div.video-embed iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; border: 0; }
/* 产品参数表 */
div.table-container { width: 100%; overflow: auto; margin: 1.5em 0 1em; }
table.neirong-table tr { height: 2.5em; }
table.neirong-table td:first-child span { font-size: medium; font-family: Tahoma, Arial, sans-serif; font-weight: 600; padding-left: 5%; }
table.neirong-table td:last-child { text-align: center; }
table.neirong-table td:last-child span { font-size: medium; font-family: Tahoma, Arial, sans-serif; }
/* 文章 / 案例详情 */
p.entry-meta { color: #999; font-size: 12.5px; }
p.entry-summary { font-size: 15px; color: #555; line-height: 1.9; }
div.article-video { margin: 0 0 22px; }
div.article-video video { width: 100%; border-radius: 3px; }
table.case-info-table { width: 100%; border-collapse: collapse; margin: 0 0 22px; font-size: 14px; }
table.case-info-table td { padding: 9px 12px; border: 1px solid #eee; }
table.case-info-table td:first-child { width: 26%; background: #faf9f6; font-weight: 600; }
div.article-gallery { margin-top: 22px; }
div.article-gallery > [class*="col-"] { margin-bottom: 14px; }
div.article-gallery img { width: 100%; height: auto; border-radius: 3px; }
div.article-tags { margin-top: 24px; }
@media (max-width: 767px) {
.tm-item { grid-template-columns: 1fr; gap: 22px; }
.tm-item + .tm-item { margin-top: 34px; }
.tm-item--rev > .tm-text, .tm-item--rev > .tm-media { order: 0; }
.tm-quote { font-size: 16.5px; }
.tm-star { font-size: 18px; }
.tm-name { margin-top: 16px; }
}
/* ==== source: cy-flyout.css ==== */
.cy-flyout,
.cy-flyout * { box-sizing: border-box; }
.cy-flyout {
position: fixed;
display: none;
z-index: 1000;
background: #ffffff;
color: #333;
padding: 26px 30px;
border-radius: 0 0 10px 10px;
box-shadow: 0 14px 40px rgba(0, 0, 0, .16);
border-top: 2px solid #a14232;
text-align: left;
/* positioned by JS */
}
.cy-flyout.cy-open { display: flex; }
/* left col */
.cy-l2 {
flex: 0 0 150px;
min-width: 0;
border-right: 1px solid #eee;
padding-right: 22px;
display: flex;
flex-direction: column;
justify-content: center;
gap: 10px;
}
.cy-flyout .cy-l2-item {
position: relative;
display: flex;
align-items: center;
height: 100px;
padding: 8px 14px;
font-size: 14.5px;
font-weight: 500;
color: #333;
text-decoration: none;
border-radius: 6px;
line-height: 1.35;
white-space: normal;
word-break: normal;
overflow-wrap: break-word;
transition: background .15s, color .15s;
}
.cy-l2-item:hover,
.cy-l2-item.cy-active { background: #a14232; color: #fff; }
.cy-l2-item:hover::after,
.cy-l2-item.cy-active::after {
content: "";
position: absolute;
left: 100%;
top: 50%;
transform: translateY(-50%);
margin-left: 5px;
border: 5px solid transparent;
border-left-color: #a14232;
}
/* right cols */
.cy-main {
flex: 1 1 auto;
min-width: 0;
display: flex;
}
.cy-panel { display: none; width: 100%; }
.cy-panel.cy-active { display: flex; height: 470px; } /* fixed height */
/* middle col */
.cy-l3 {
flex: 0 0 25%;
border-right: 1px solid #eee;
padding: 0 20px;
display: flex;
flex-direction: column;
justify-content: center;
}
.cy-flyout .cy-l3-item {
display: flex;
align-items: center;
justify-content: center;
height: 70px;
padding: 0 12px;
font-size: 13.5px;
color: #555;
text-decoration: none;
border-radius: 6px;
line-height: 1.35;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
transition: background .15s, color .15s;
}
.cy-l3-item:hover,
.cy-l3-item.cy-active { background: #f0efea; color: #333; }
.cy-l3-item.cy-oem { color: #a14232; font-weight: 600; }
/* product col */
.cy-prods {
flex: 0 0 75%;
padding-left: 24px;
overflow: hidden;
}
.cy-prod-group { display: none; }
.cy-prod-group.cy-active {
display: flex;
flex-direction: column;
height: 100%;
}
.cy-prod-grid {
flex: 1;
display: grid;
grid-template-columns: repeat(3, minmax(0, 1fr));
grid-template-rows: repeat(2, 1fr);
gap: 26px 30px;
align-content: center;
}
.cy-flyout .cy-prod {
display: flex;
flex-direction: column;
justify-content: center;
gap: 16px;
text-align: center;
text-decoration: none;
color: #333;
min-width: 0;
}
.cy-prod img {
display: block;
width: 100%;
max-width: 100%;
height: 130px;
object-fit: cover;
border-radius: 6px;
}
.cy-flyout .cy-prod .cy-prod-name {
display: flex;
align-items: center;
justify-content: center;
text-align: center;
font-size: 13px;
color: #444;
line-height: 1.35;
border-bottom: 1px dashed #d8d5cd;
padding: 0 4px;
height: 40px;
overflow: hidden;
transition: background .15s;
}
.cy-prod:hover .cy-prod-name {
background: #f5f4ef;
color: #a14232;
}
.cy-flyout .cy-more {
display: block;
text-align: center;
background: #f5f4ef;
color: #a14232;
font-size: 13px;
font-weight: 500;
text-decoration: none;
padding: 12px 0;
border-radius: 6px;
line-height: 1.4;
transition: background .15s;
}
.cy-more:hover { background: #ebe8df; }
/* ==== OEM / 经销政策面板（产品中心飞出菜单第 3 列，2026-10-12）====
悬停出内容，点击左列标签仍跳 /partners.html。
可用面积实测：696 × 470（1440 视口）。 */
.cy-oem-panel {
display: flex;
flex-direction: column;
justify-content: space-between;
width: 100%;
height: 100%;
}
.cy-oem-t {
display: block;
margin: 0 0 8px;
font-size: 18px;
font-weight: 700;
color: #332d2d;
line-height: 1.3;
}
.cy-oem-head p {
margin: 0;
font-size: 13px;
line-height: 1.6;
color: #888;
max-width: 620px;
}
.cy-oem-cards {
display: grid;
grid-template-columns: repeat(3, minmax(0, 1fr));
gap: 14px;
}
.cy-oem-card {
border: 1px solid #e6e2da;
border-radius: 4px;
padding: 18px 17px 19px;
background: #fff;
}
.cy-oem-card i {
display: block;
font-size: 20px;
line-height: 1;
color: #a14232;
margin-bottom: 12px;
}
.cy-oem-ct {
display: block;
margin: 0 0 8px;
font-size: 14px;
font-weight: 700;
color: #332d2d;
line-height: 1.35;
}
.cy-oem-card p {
margin: 0;
font-size: 12.5px;
line-height: 1.65;
color: #777;
word-break: normal;
overflow-wrap: break-word;
}
.cy-oem-get-t {
margin: 0 0 10px;
font-size: 11.5px;
font-weight: 700;
letter-spacing: .7px;
text-transform: uppercase;
color: #a14232;
}
.cy-oem-get ul {
display: grid;
grid-template-columns: repeat(4, minmax(0, 1fr));
gap: 7px 20px;
margin: 0;
padding: 0;
list-style: none;
}
.cy-oem-get li {
position: relative;
padding-left: 12px;
font-size: 12px;
line-height: 1.55;
color: #777;
}
.cy-oem-get li::before {
content: "";
position: absolute;
left: 0;
top: 7px;
width: 4px;
height: 4px;
background: #c9c3b8;
border-radius: 50%;
}
.cy-oem-facts {
margin: 0;
font-size: 12px;
line-height: 1.5;
color: #9a948b;
}
.cy-oem-facts span + span::before {
content: "\00b7";
margin: 0 8px;
color: #c9c3b8;
}
/* CTA 按钮居中（不放右下角）——右下角有站点悬浮 .fb-livechat-cta，会压住 */
.cy-oem-cta {
display: flex;
align-items: center;
justify-content: center;
gap: 18px;
background: #332d2d;
border-radius: 4px;
padding: 12px 18px;
}
.cy-oem-cta a {
display: inline-flex;
align-items: center;
gap: 7px;
background: #a14232;
color: #fff;
font-size: 13px;
font-weight: 600;
padding: 9px 16px;
border-radius: 3px;
text-decoration: none;
}
.cy-oem-cta a i { font-size: 11px; }
.cy-oem-cta a:hover,
.cy-oem-cta a:focus { background: #8d3829; color: #fff; }
.cy-oem-cta > span { font-size: 12px; color: rgba(255, 255, 255, .72); }
/* 窄屏：主菜单仍可见（≥992px）但飞出容器降到 970px，面板仅 546px */
@media (max-width: 1199px) {
/* 三列 (.cy-l2 150px + .cy-l3 25% + .cy-prods 75%) 之和大于容器内容宽，
原本末列会越出飞出盒子 54px、白面板阴影线横穿内容 → 末列改弹性填充贴齐。
仅 ≤1199px 生效，≥1200px 宽度不变。 */
.cy-prods { flex: 1 1 auto; min-width: 0; }
.cy-oem-t { font-size: 16px; }
.cy-oem-head p { font-size: 12.5px; }
.cy-oem-cards { gap: 11px; }
.cy-oem-card { padding: 15px 14px 16px; }
.cy-oem-ct { font-size: 13px; }
.cy-oem-card p { font-size: 12px; }
.cy-oem-get ul { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px 16px; }
.cy-oem-facts { font-size: 11.5px; }
.cy-oem-cta { gap: 12px; }
.cy-oem-cta > span { display: none; }
}
/* ★ 飞出展开时把 header 提层到悬浮按钮（9998/9999）之上 ——
#site-header 本身是 z-index:21 的层叠上下文，不提层则飞出菜单压不住
.fb-livechat-cta / .ck-livechat-avatar，面板右下区域会被盖住。
只在展开期间生效，避免常开时压过 .photo-lightbox(9999)。 */
body.cy-mega-open #site-header { z-index: 10000; }
/* ==========================================================================
内容模板 · 排烟系统介绍（.ckp-exh-*）
产品页「概述」里的模板内容：净化原理 / 排烟口位置 / 排烟系统 三节。
用类选择器挂样式，标签用 div 以便后台富文本编辑器安全往返。
========================================================================== */
.ckp-exh { margin-top: 42px; }
.ckp-exh .ckp-exh-sec + .ckp-exh-sec { margin-top: 44px; }
.ckp-exh h3.ckp-exh-h {
font-size: 22px; font-weight: 700; color: #332d2d; line-height: 1.3;
margin: 0; padding-bottom: 10px; border-bottom: 2px solid #332d2d; text-align: center;
}
.ckp-exh p.ckp-exh-sub { font-size: 14px; color: #666; line-height: 1.7; margin: 12px 0 18px; text-align: center; }
.ckp-exh .ckp-exh-stack { display: grid; gap: 16px; }
.ckp-exh .ckp-exh-fig { margin: 0; }
.ckp-exh .ckp-exh-fig img { display: block; width: 100%; height: auto; border: 1px solid #e6e2da; border-radius: 4px; }
.ckp-exh .ckp-exh-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.ckp-exh .ckp-exh-cell { margin: 0; text-align: center; }
.ckp-exh .ckp-exh-cell img {
display: block; width: 80%; height: auto; margin: 0 auto;
}
.ckp-exh .ckp-exh-cell figcaption { font-size: 13px; color: #444; line-height: 1.55; margin-top: 8px; }
@media (max-width: 767px) {
.ckp-exh { margin-top: 30px; }
.ckp-exh .ckp-exh-sec + .ckp-exh-sec { margin-top: 32px; }
.ckp-exh h3.ckp-exh-h { font-size: 18px; padding-bottom: 8px; }
.ckp-exh p.ckp-exh-sub { font-size: 13px; margin: 10px 0 14px; }
.ckp-exh .ckp-exh-stack { gap: 10px; }
.ckp-exh .ckp-exh-grid { grid-template-columns: 1fr 1fr; gap: 10px; }
.ckp-exh .ckp-exh-cell figcaption { font-size: 12px; margin-top: 6px; }
}
/* ==========================================================================
首页滚动动效（.ck-anim）—— 内容进入视口时淡入上浮 + 同排错峰
① 只动 opacity / transform，不触发重排、不产生 CLS；
② 隐藏态由 JS 施加（见 admin/theme/pages/home.html 末尾）—— 脚本没跑 /
被打断时内容照常显示，绝不会白屏；
③ 播完即 unobserve，不常驻监听；JS 约 1 KB，无第三方库；
④ prefers-reduced-motion 时全部归零。
========================================================================== */
html.js-anim-on .ck-anim { opacity: 0; transform: translateY(18px); }
html.js-anim-on .ck-anim.ck-shown {
opacity: 1; transform: translateY(0);
transition: opacity .9s ease, transform .95s cubic-bezier(.16, .84, .34, 1);
}
@media (prefers-reduced-motion: reduce) {
html.js-anim-on .ck-anim { opacity: 1 !important; transform: none !important; transition: none !important; }
}
/* ==========================================================================
应用场景页 · 详情排版（.ckp-sc-*）
用于 /application-scenarios/ 8 个页面的「详情（富文本）」：
01 使用场所 = 3 列带边框卡片（大字类型 + 小字说明，悬停浅灰底）
02… 定制流程 = A-E，圆形图标 + 标题 + 说明
板前烤肉饭页另有：要点列表、对照表、两栏配图（占位）
① 类名统一 .ckp- 前缀，避开主题已占用的 .ck-（.ck-media）；
② 一律「两段式」选择器（.ckp-sc .ckp-sc-xxx），确保压过 base.css 里
.entry-content p / 表格等单类规则；
③ 图标用内联 SVG（data URI，描边取站点强调色 #a14232），不引外部字体。
========================================================================== */
.ckp-sc { margin: 0; }
.ckp-sc .ckp-sc-sec + .ckp-sc-sec { margin-top: 44px; }
.ckp-sc .ckp-sc-no {
display: block; text-align: center; font-size: 11.5px; font-weight: 700;
letter-spacing: .08em; color: #a14232; margin-bottom: 6px;
}
.ckp-sc h3.ckp-sc-h {
font-size: 22px; font-weight: 700; color: #332d2d; line-height: 1.3;
margin: 0; padding-bottom: 10px; border-bottom: 2px solid #332d2d; text-align: center;
}
.ckp-sc .ckp-sc-lead { font-size: 13.5px; color: #55504a; line-height: 1.75; margin: 18px 0 0; }
.ckp-sc .ckp-sc-sub { font-size: 15px; font-weight: 700; color: #332d2d; line-height: 1.45; margin: 26px 0 0; }
/* 01 使用场所：3 列卡片 */
.ckp-sc .ckp-sc-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; margin-top: 22px; }
.ckp-sc .ckp-sc-cell {
border: 1px solid #e6e2da; border-radius: 4px; background: #fff;
padding: 15px 15px 16px;
transition: background-color .2s ease, border-color .2s ease;
}
.ckp-sc .ckp-sc-cell:hover { background: #f5f4ef; border-color: #d8d5cd; }
.ckp-sc .ckp-sc-ct { font-size: 15px; font-weight: 700; color: #332d2d; line-height: 1.4; margin: 0; }
.ckp-sc .ckp-sc-cd { font-size: 12.5px; color: #6b6357; line-height: 1.62; margin: 7px 0 0; }
/* 定制流程 A-E */
.ckp-sc .ckp-sc-steps { display: grid; gap: 12px; margin-top: 22px; }
.ckp-sc .ckp-sc-step {
display: grid; grid-template-columns: 48px minmax(0, 1fr); column-gap: 15px; align-items: start;
border: 1px solid #e6e2da; border-radius: 4px; background: #fff; padding: 15px 16px;
transition: background-color .2s ease, border-color .2s ease;
}
.ckp-sc .ckp-sc-step:hover { background: #f5f4ef; border-color: #d8d5cd; }
.ckp-sc .ckp-sc-ico {
grid-row: 1 / span 2; display: block; width: 48px; height: 48px; overflow: hidden;
border: 1px solid #e6e2da; border-radius: 50%; background-color: #faf9f6;
background-repeat: no-repeat; background-position: center; background-size: 22px 22px;
font-size: 0; line-height: 1; color: transparent;
}
.ckp-sc .ckp-sc-st { font-size: 15px; font-weight: 700; color: #332d2d; line-height: 1.45; margin: 2px 0 0; }
.ckp-sc .ckp-sc-sd { font-size: 13.5px; color: #55504a; line-height: 1.75; margin: 6px 0 0; }
/* 图标：A 设计与出图 / B 生产制造 / C 包装发运 / D 安装调试 / E 售后与培训 */
.ckp-sc .ckp-sc-ico--a { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23a14232' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 20h9'/%3E%3Cpath d='M16.5 3.5a2.12 2.12 0 0 1 3 3L7 19l-4 1 1-4z'/%3E%3C/svg%3E"); }
.ckp-sc .ckp-sc-ico--b { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23a14232' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2.5 21h19'/%3E%3Cpath d='M5 21V9.6l4.8 3.1V9.6l4.8 3.1V9.6L19 15.5V21'/%3E%3C/svg%3E"); }
.ckp-sc .ckp-sc-ico--c { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23a14232' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 16V8a2 2 0 0 0-1-1.73l-7-4a2 2 0 0 0-2 0l-7 4A2 2 0 0 0 3 8v8a2 2 0 0 0 1 1.73l7 4a2 2 0 0 0 2 0l7-4A2 2 0 0 0 21 16z'/%3E%3Cpath d='M3.3 7 12 12l8.7-5'/%3E%3Cpath d='M12 22V12'/%3E%3C/svg%3E"); }
.ckp-sc .ckp-sc-ico--d { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23a14232' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M14.7 6.3a1 1 0 0 0 0 1.4l1.6 1.6a1 1 0 0 0 1.4 0l3.77-3.77a6 6 0 0 1-7.94 7.94l-6.91 6.91a2.12 2.12 0 0 1-3-3l6.91-6.91a6 6 0 0 1 7.94-7.94z'/%3E%3C/svg%3E"); }
.ckp-sc .ckp-sc-ico--e { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23a14232' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 22s8-4 8-10V5l-8-3-8 3v7c0 6 8 10 8 10z'/%3E%3Cpath d='m9 12 2 2 4-4'/%3E%3C/svg%3E"); }
/* 要点列表（板前烤肉饭：这档生意的来由 / 为什么成立） */
.ckp-sc .ckp-sc-list { margin: 16px 0 0; padding: 0; list-style: none; display: grid; gap: 9px; }
.ckp-sc .ckp-sc-list li { position: relative; padding-left: 17px; font-size: 13.5px; color: #55504a; line-height: 1.72; }
.ckp-sc .ckp-sc-list li::before {
content: ""; position: absolute; left: 2px; top: 8px; width: 6px; height: 6px;
border-radius: 50%; background: #a14232;
}
.ckp-sc .ckp-sc-list strong,
.ckp-sc .ckp-sc-tbl strong,
.ckp-sc .ckp-sc-sd strong { font-weight: 700; color: #332d2d; }
/* 对照表 */
.ckp-sc .ckp-sc-tbl { margin-top: 22px; overflow-x: auto; -webkit-overflow-scrolling: touch; }
.ckp-sc .ckp-sc-tbl table { width: 100%; border-collapse: collapse; font-size: 13px; }
.ckp-sc .ckp-sc-tbl th,
.ckp-sc .ckp-sc-tbl td { border: 1px solid #e6e2da; padding: 10px 13px; text-align: left; vertical-align: top; line-height: 1.65; }
.ckp-sc .ckp-sc-tbl th { background: #faf9f6; color: #332d2d; font-weight: 700; font-size: 12.5px; letter-spacing: .02em; }
.ckp-sc .ckp-sc-tbl td { color: #55504a; }
.ckp-sc .ckp-sc-tbl tbody tr:hover td { background: #f5f4ef; }
/* 两栏配图 */
.ckp-sc .ckp-sc-media { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin-top: 22px; }
.ckp-sc .ckp-sc-fig { margin: 0; }
.ckp-sc .ckp-sc-fig img { display: block; width: 100%; height: auto; border: 1px solid #e6e2da; border-radius: 4px; }
.ckp-sc .ckp-sc-fig figcaption { font-size: 12.5px; color: #6b6357; line-height: 1.6; margin-top: 8px; text-align: center; }
@media (max-width: 991px) {
.ckp-sc .ckp-sc-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 767px) {
.ckp-sc .ckp-sc-sec + .ckp-sc-sec { margin-top: 32px; }
.ckp-sc h3.ckp-sc-h { font-size: 18px; padding-bottom: 8px; }
.ckp-sc .ckp-sc-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin-top: 16px; }
.ckp-sc .ckp-sc-cell { padding: 12px 12px 13px; }
.ckp-sc .ckp-sc-ct { font-size: 13.5px; }
.ckp-sc .ckp-sc-cd { font-size: 12px; margin-top: 6px; }
.ckp-sc .ckp-sc-steps { gap: 10px; margin-top: 16px; }
.ckp-sc .ckp-sc-step { grid-template-columns: 40px minmax(0, 1fr); column-gap: 12px; padding: 13px; }
.ckp-sc .ckp-sc-ico { width: 40px; height: 40px; background-size: 19px 19px; }
.ckp-sc .ckp-sc-st { font-size: 14px; }
.ckp-sc .ckp-sc-sd { font-size: 13px; }
.ckp-sc .ckp-sc-sub { font-size: 14px; margin-top: 20px; }
.ckp-sc .ckp-sc-media { grid-template-columns: 1fr; gap: 10px; }
.ckp-sc .ckp-sc-tbl table { font-size: 12.5px; min-width: 620px; }
}
@media (max-width: 479px) {
.ckp-sc .ckp-sc-grid { grid-template-columns: minmax(0, 1fr); }
}
/* ==========================================================================
产品图示（.ckp-pg-*）
大师系列 / 常规系列 / 铜板烧 三类产品「详情（富文本）」里的 5 张大图展示：
第 1 行：俯视图 + 三维图 + 整机（含大理石台面） ← 3 张
第 2 行：主机尺寸 + 应用案例 ← 2 张，居中
① 两行的每张图**同宽**（= 整栏的 1/3）：第 2 行只有 2 张，所以整行限宽居中，
宽度算式 = 2 列 + 1 个 gap；
② 这些图自带白底或透明底，故**不加边框与底色**（与"示意图去掉底纹"的既有口径一致）；
③ 一律两段式选择器（.ckp-pg .ckp-pg-xxx），压过 base.css 里 .entry-content 的单类规则。
========================================================================== */
.ckp-pg { --ckp-pg-gap: 22px; margin: 0; }
.ckp-pg h2.ckp-pg-h {
font-size: 21px; font-weight: 700; color: #332d2d; line-height: 1.4;
margin: 0 0 26px; padding-bottom: 12px; border-bottom: 2px solid #332d2d; text-align: center;
}
.ckp-pg .ckp-pg-row { display: grid; gap: var(--ckp-pg-gap); }
.ckp-pg .ckp-pg-row--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.ckp-pg .ckp-pg-row--2 {
grid-template-columns: repeat(2, minmax(0, 1fr));
max-width: calc((100% - 2 * var(--ckp-pg-gap)) / 3 * 2 + var(--ckp-pg-gap));
margin-left: auto; margin-right: auto;
}
.ckp-pg .ckp-pg-row + .ckp-pg-row { margin-top: 28px; }
.ckp-pg .ckp-pg-fig { margin: 0; }
.ckp-pg .ckp-pg-fig img { display: block; width: 100%; height: auto; }
.ckp-pg .ckp-pg-fig figcaption {
margin-top: 12px; text-align: center; font-size: 13px; font-weight: 700;
color: #332d2d; line-height: 1.5;
}
@media (max-width: 767px) {
.ckp-pg { --ckp-pg-gap: 14px; }
.ckp-pg h2.ckp-pg-h { font-size: 17px; margin-bottom: 18px; padding-bottom: 10px; }
.ckp-pg .ckp-pg-row--3,
.ckp-pg .ckp-pg-row--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); max-width: 100%; }
.ckp-pg .ckp-pg-row + .ckp-pg-row { margin-top: 20px; }
.ckp-pg .ckp-pg-fig figcaption { font-size: 12px; margin-top: 8px; }
}
/* ==========================================================================
反扒站蜜罐链接（.ck-honeypot，见 admin/theme/base.html）
① 用「离屏 + 1px + opacity:0」隐藏，**故意不用 display:none** ——
很多扒站工具会跳过 display:none 的元素，留着反而白设；
② pointer-events:none 保证真人也点不到；rel=nofollow + robots Disallow 兜住搜索引擎。
========================================================================== */
.ck-honeypot {
position: absolute !important;
left: -9999px !important;
top: auto !important;
width: 1px;
height: 1px;
overflow: hidden;
opacity: 0;
pointer-events: none;
}
/* ==========================================================================
右侧栏 · 解决方案 Solutions（.ckp-sol-*）2026-10-16
全站右侧栏原来的「Tags 标签云」整块替换为应用场景图文导航：
标题 Solutions → 2 列网格（缩略图 + 标题）→ 末尾一个纯文字条目 Hibachi
① 图片按 16:10 显示，另有一套 280×175 的侧栏专用小图（/images/sidebar/*.jpg），
避免为 137px 宽的格子去拉 400×300~800×600 的原图；
② 模块整体一道 1px 细边框（与全站 1px #e6e2da 卡片语言一致）；
内容四周内缩 14px、列间距 12px，不顶满侧栏，看着透气；
③ 末尾 Hibachi 独占整行、文字居中、浅灰底（#f5f4ef）；
④ 一律两段式选择器（.ckp-sol .ckp-sol-xxx），压过 base.css 里
.side-section-content / .side-section-content a 的单类规则；
⑤ 产品中心（/products/ 及其分类页与落地页）仍走 partials/product_sidebar.html
的 Tags 块，不受这一段影响。
========================================================================== */
.ckp-sol.side-section {
border: 1px solid #e6e2da;
border-radius: 4px;
overflow: hidden;
}
.ckp-sol .ckp-sol-list {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 12px;
margin: 0;
padding: 14px;
list-style: none;
}
.ckp-sol .ckp-sol-item { margin: 0; }
.ckp-sol .ckp-sol-item > a {
display: block;
text-decoration: none;
color: #332d2d;
}
.ckp-sol .ckp-sol-item > a:hover { color: #332d2d; }
.ckp-sol .ckp-sol-pic {
display: block;
aspect-ratio: 16 / 10;
overflow: hidden;
border: 1px solid #e6e2da;
border-radius: 4px;
background: #faf9f6;
transition: border-color .15s ease;
}
.ckp-sol .ckp-sol-pic img {
display: block;
width: 100%;
height: 100%;
object-fit: cover;
}
.ckp-sol .ckp-sol-name {
display: block;
margin-top: 5px;
font-size: 12px;
line-height: 1.4;
transition: color .15s ease;
}
.ckp-sol .ckp-sol-item > a:hover .ckp-sol-pic { border-color: #a14232; }
.ckp-sol .ckp-sol-item > a:hover .ckp-sol-name { color: #a14232; }
.ckp-sol .ckp-sol-item--plain {
grid-column: 1 / -1;
display: flex;
align-items: center;
justify-content: center;
padding: 7px 0;
border-radius: 4px;
background: #f5f4ef;
transition: background-color .15s ease;
}
.ckp-sol .ckp-sol-item--plain:hover { background: #efece5; }
.ckp-sol .ckp-sol-item--plain > a {
font-size: 13px;
font-weight: 700;
}
@media (max-width: 767px) {
.ckp-sol .ckp-sol-list { gap: 12px; padding: 10px; }
.ckp-sol .ckp-sol-name { font-size: 12.5px; }
}
/* ==========================================================================
产品型号对比表（.ckp-pcmp-*）2026-10-16
同系列多个型号合并成一款产品后，在「详情」里用一张表做规格对比：
型号做列、参数做行。列少（≤5）时直接铺满，列多时容器横向滚动。
① 表头 / 行首用站点浅底（#f5f4ef / #faf9f6），边框 1px #e6e2da，圆角交给容器；
② 一律两段式选择器（.ckp-pcmp .ckp-pcmp-xxx 或 .ckp-pcmp td），压过 base.css 的表格规则。
========================================================================== */
.ckp-pcmp {
margin: 22px 0 0;
overflow-x: auto;
border: 1px solid #e6e2da;
border-radius: 4px;
}
.ckp-pcmp table {
width: 100%;
margin: 0;
border-collapse: collapse;
font-size: 14px;
}
.ckp-pcmp th,
.ckp-pcmp td {
border: 0;
border-bottom: 1px solid #e6e2da;
border-right: 1px solid #e6e2da;
padding: 9px 12px;
text-align: center;
vertical-align: middle;
color: #55504a;
}
.ckp-pcmp tr > *:last-child { border-right: 0; }
.ckp-pcmp tbody tr:last-child > * { border-bottom: 0; }
.ckp-pcmp thead th {
background: #f5f4ef;
font-weight: 700;
color: #332d2d;
white-space: nowrap;
}
.ckp-pcmp tbody th {
width: 26%;
min-width: 150px;
background: #faf9f6;
text-align: left;
font-weight: 700;
color: #332d2d;
}
.ckp-pcmp tbody th span {
display: block;
margin-top: 2px;
font-size: 12.5px;
font-weight: 400;
color: #6b6357;
}
.ckp-pcmp tbody tr:hover td { background: #faf9f6; }
@media (max-width: 767px) {
.ckp-pcmp { margin-top: 18px; }
.ckp-pcmp table { font-size: 12.5px; }
.ckp-pcmp th,
.ckp-pcmp td { padding: 7px 9px; }
.ckp-pcmp tbody th { width: auto; min-width: 118px; }
.ckp-pcmp tbody th span { font-size: 11.5px; }
}
/* ==========================================================================
定制产品图组（.ckp-cust-*）2026-10-16
披萨炉内容模板里的「Customized Product」：一行 4 张方形图 + 图注（PDF 原名）。
========================================================================== */
.ckp-cust {
display: grid;
grid-template-columns: repeat(4, minmax(0, 1fr));
gap: 14px;
margin: 22px 0 0;
}
.ckp-cust figure {
margin: 0;
text-align: center;
}
.ckp-cust img {
display: block;
width: 100%;
height: auto;
border: 1px solid #e6e2da;
border-radius: 4px;
background: #faf9f6;
}
.ckp-cust figcaption {
margin-top: 9px;
font-size: 13px;
line-height: 1.45;
color: #55504a;
}
@media (max-width: 1100px) {
.ckp-cust { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 767px) {
.ckp-cust { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.ckp-cust figcaption { font-size: 12px; margin-top: 7px; }
}
/* ==========================================================================
产品详情区 · 区块排版统一（2026-10-17）
目的：产品「详情」里的每个内容区块，不论属于哪个分类、内容里有没有手写
class（铁板烧的 .ckp-pg-h / .ckp-exh-h、披萨炉的裸 h2），外观一律统一。
排版完全由这一段控制，内容只管写 //
，不需要记 class。
作用域：#product-description（产品落地页「概述」页签），不影响站内其他区域。
① h2 = 区块标题：居中 + 2px 深色下划线（与铁板烧设备一致）
② h3 = 次级标题：左对齐 + 1px 浅下划线
③ 段落/列表：统一行高与间距
========================================================================== */
#product-description h2,
#product-description h3.ckp-exh-h {
font-size: 21px;
font-weight: 700;
color: #332d2d;
line-height: 1.4;
margin: 46px 0 24px;
padding-bottom: 12px;
border-bottom: 2px solid #332d2d;
text-align: center;
}
/* 首个区块的标题不留上间距（铁板烧 .ckp-pg-h 所在的 .ckp-pg 也走这条） */
#product-description > h2:first-child,
#product-description > div:first-child > h2:first-child,
#product-description > div:first-child > h3:first-child { margin-top: 0; }
/* 次级标题。注意铁板烧排烟区块的 .ckp-exh-h 虽然写在 h3 里，但它是区块标题，见上一条 */
#product-description h3:not(.ckp-exh-h) {
font-size: 17px;
font-weight: 700;
color: #332d2d;
line-height: 1.4;
margin: 28px 0 11px;
padding-bottom: 7px;
border-bottom: 1px solid #e6e2da;
text-align: left;
}
#product-description h4 {
font-size: 15px;
font-weight: 700;
color: #332d2d;
line-height: 1.4;
margin: 20px 0 8px;
}
#product-description p {
font-size: 15px;
line-height: 1.8;
color: #4a453f;
margin: 0 0 16px;
}
#product-description ul,
#product-description ol { margin: 0 0 16px; }
#product-description li { margin: 6px 0; line-height: 1.75; }
@media (max-width: 767px) {
#product-description h2,
#product-description h3.ckp-exh-h { font-size: 17px; margin: 32px 0 18px; padding-bottom: 10px; }
#product-description h3:not(.ckp-exh-h) { font-size: 15.5px; margin: 22px 0 9px; padding-bottom: 6px; }
#product-description h4 { font-size: 14px; margin: 16px 0 7px; }
#product-description p { font-size: 14.5px; line-height: 1.75; }
}
/* ===== 产品页展示图（品牌图 / 温度带图 / 案例图），一套规则复用 ===== */
.ckp-fish-hero,
.ckp-fish-band,
.ckp-fish-case {
position: relative;
margin: 0 0 20px;
overflow: hidden;
border-radius: 4px;
}
.ckp-fish-hero img,
.ckp-fish-band img,
.ckp-fish-case img {
display: block;
width: 100%;
height: auto;
}
/* 品牌图：右侧大色块（版式参考 zhimingshiye 烤鱼炉图），底色取自 112 的 #E7551A */
.ckp-fish-hero-cap {
position: absolute;
left: 34%;
right: 0;
top: 44%;
height: 26%;
display: flex;
flex-direction: column;
justify-content: center;
padding: 18px 18px 20px;
background: #E7551A;
color: #fff;
}
.ckp-fish-hero-cap span { display: block; }
.ckp-fish-brand {
font-size: 42px;
font-weight: 800;
letter-spacing: .5px;
line-height: 1.05;
}
.ckp-fish-slogan {
font-size: 17px;
font-weight: 600;
letter-spacing: .2px;
line-height: 1.25;
margin-top: 7px;
}
/* 大屏把第二行放大，填满色块右侧的空白 */
@media (min-width: 1201px) {
.ckp-fish-slogan { font-size: 21px; }
}
/* 温度带图：两行文字压在图片中部的橙红底带上（带宽 88.5%、带高 13.2%、带顶 42.7%） */
.ckp-fish-band-text {
position: absolute;
left: 0;
top: 42.7%;
width: 72.5%;
height: 13.2%;
display: flex;
flex-direction: column;
align-items: flex-end;
justify-content: center;
box-sizing: border-box;
padding: 0 3.5%;
color: #fff;
font-size: 30px;
font-weight: 800;
letter-spacing: .3px;
line-height: 1.2;
text-align: right;
}
.ckp-fish-band-text span { display: block; }
.ckp-fish-band-text span + span {
font-size: 26px;
font-weight: 700;
margin-top: 3px;
}
/* 案例图标题：放在图片上方 */
#product-description h3.ckp-fish-case-title {
font-size: 18px;
font-weight: 700;
color: #332d2d;
text-align: center;
line-height: 1.4;
margin: 30px 0 14px;
padding-bottom: 8px;
border-bottom: 2px solid #332d2d;
}
/* 产品简介：左侧产品大图占 1/3，右侧文字占 2/3 */
.ckp-fish-split {
display: grid;
grid-template-columns: 1fr 2fr;
gap: 26px;
align-items: center;
margin: 0 0 22px;
}
.ckp-fish-split-media img {
display: block;
width: 100%;
height: auto;
border-radius: 4px;
}
.ckp-fish-split-text p { margin: 0; }
@media (max-width: 767px) {
.ckp-fish-hero,
.ckp-fish-band,
.ckp-fish-case { margin-bottom: 16px; }
/* 手机端：色块改为整幅底条，保证英文长句不溢出 */
.ckp-fish-hero-cap {
left: 0;
right: 0;
top: auto;
bottom: 0;
height: auto;
padding: 10px 14px 12px;
}
.ckp-fish-brand { font-size: 20px; }
.ckp-fish-slogan { font-size: 12px; letter-spacing: 0; margin-top: 3px; }
.ckp-fish-band-text { font-size: 16px; letter-spacing: 0; }
.ckp-fish-band-text span + span { font-size: 14px; margin-top: 2px; }
.ckp-fish-split { grid-template-columns: 1fr; gap: 14px; }
.ckp-fish-split-media { max-width: 240px; margin: 0 auto; }
#product-description h3.ckp-fish-case-title { font-size: 16px; margin: 22px 0 10px; padding-bottom: 6px; }
}
/* ★ 2026-10-18：分类页「工厂介绍」两栏版块（左图占位 + 右文字）
目前用在 /hibachi-grill-table/；图片先用纯色块占位，后期换真图时把
.ck-factory-img 的 background 换成 background-image 即可，尺寸不用改。 */
.ck-factory {
display: flex; gap: 26px; align-items: stretch;
margin: 20px 0 26px; padding: 0;
}
.ck-factory-img {
/* 图片实际尺寸 308×347，按此比例定框，图片满框、不裁切、不变形、无留白 */
flex: 0 0 35%; width: 35%;
aspect-ratio: 308 / 347;
background: url(/images/factory/hibachi-factory.jpg) center / cover no-repeat;
border-radius: 8px;
}
.ck-factory-text {
flex: 1 1 auto; min-width: 0;
display: flex; flex-direction: column; justify-content: center;
}
.ck-factory-text p {
font-size: 15px; line-height: 1.9; color: #5f584d; margin: 0;
}
.ck-factory-text p + p { margin-top: 12px; }
@media (max-width: 767px) {
.ck-factory { flex-direction: column; gap: 16px; margin: 22px 0; }
.ck-factory-img { flex: 0 0 auto; width: 100%; }
}
/* 常规系列产品页：形状词做小标题，完整产品名做大标题 */
.product-details .entry-eyebrow {
margin: 0 0 4px;
font-size: 13px;
letter-spacing: .16em;
text-transform: uppercase;
color: #919191;
font-weight: 600;
}