/* ============================================================
   跃能官网 V6 · JA Spark 布局逻辑 + 真实产品图
   对齐 JA Spark 实测：暖白底 #F6F8F1 / 明显阴影 / 圆角 10-12px / 紧凑节奏
   ============================================================ */
:root{
  --brand:#00A5DD;
  --brand-d:#0C87B8;
  --link:#0A6E92;        /* 小字链接/标签专用（白底 5.6:1，达 WCAG AA） */
  --ink3:#434C54;        /* 暖白底(#F6F8F1)上的次要文字（4.9:1，达 AA） */
  --brand-l:#E8F7FD;
  --lime:#DADF00;
  --ink:#161A1D;
  --ink2:#4A545D;        /* 对比度 5.2:1，达 WCAG AA */
  --muted:#616B73;       /* 对比度 5.4:1（白底）/ 5.1:1（暖白底），达 AA */
  --white:#FFFFFF;
  --warm:#F6F8F1;        /* JA Spark 暖白 */
  --warm-2:#EEF2E9;
  --line:#E4E8DF;
  --dark:#1B2126;
  --r:12px; --rbtn:10px;
  --maxw:1170px;
  --ease:cubic-bezier(.22,1,.36,1);
  --font:"Inter","PingFang SC","Noto Sans SC","Microsoft YaHei",-apple-system,sans-serif;
  --shadow:0 7px 18px -6px rgba(22,26,29,.22);      /* JA Spark 实测影值 */
  --shadow-lg:0 14px 34px -12px rgba(22,26,29,.3);
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:var(--font);color:var(--ink);background:var(--white);line-height:1.65;-webkit-font-smoothing:antialiased;overflow-x:hidden}
a{color:inherit;text-decoration:none}
a:focus-visible,button:focus-visible{outline:2px solid var(--brand);outline-offset:3px;border-radius:4px}
.skip:focus{outline:2px solid var(--brand);outline-offset:2px}
h1,h2,h3,h4{letter-spacing:-.022em;line-height:1.18;font-weight:800}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 24px}
.skip{position:absolute;left:-999px}
.skip:focus{left:16px;top:16px;background:var(--brand);color:#fff;padding:10px 16px;border-radius:8px;z-index:99}

/* ---------- 顶栏 ---------- */
.topbar{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.95);backdrop-filter:blur(14px);border-bottom:1px solid var(--line);transition:box-shadow .3s;top:0}
.topbar.scrolled{box-shadow:var(--shadow)}
.topbar .wrap{display:flex;align-items:center;height:74px;gap:34px}
.logo{display:flex;align-items:center;gap:10px;font-weight:800;font-size:20px}
.logo .mk{width:34px;height:34px;border-radius:9px;background:var(--brand);display:grid;place-items:center;color:#fff;font-size:13px;font-weight:800}
.logo em{color:var(--link);font-style:normal}
nav.main{display:flex;gap:30px;font-size:15px;color:var(--ink2);font-weight:500}
nav.main a{position:relative;display:inline-flex;align-items:center;min-height:44px;padding:0 2px;transition:color .25s}
nav.main a::after{content:"";position:absolute;left:0;right:0;bottom:8px;height:2px;background:var(--brand);transform:scaleX(0);transform-origin:left;transition:transform .3s var(--ease)}
nav.main a:hover{color:var(--ink)}
nav.main a:hover::after{transform:scaleX(1)}
/* ---------- 顶部品牌蓝条（JA Spark 顶部色块）---------- */
.topstrip{background:#0F3D5C;color:#E8F1F6;font-size:13.5px;font-weight:600}
.topstrip .wrap{display:flex;align-items:center;justify-content:space-between;padding:8px 24px;gap:16px}
.topstrip .tl{display:flex;align-items:center;gap:16px;line-height:1.2}
.topstrip a{display:inline-flex;align-items:center;padding:0 2px;color:#E8F1F6;transition:color .2s;line-height:1.2}
.topstrip a:hover{color:#FFFFFF}
.topstrip .sep{color:rgba(255,255,255,.32)}
.topstrip .tr a,
#sp-top-bar .topstrip .tr a{color:#DADF00!important;font-weight:600}

.head-r{margin-left:auto;display:flex;align-items:center;gap:16px}
.lang{font-size:13.5px;color:var(--muted)}
.lang b{color:var(--ink)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:13px 26px;border-radius:var(--rbtn);font-weight:700;font-size:15px;transition:transform .25s var(--ease),background .25s,box-shadow .25s,border-color .25s,color .25s;border:1px solid transparent;cursor:pointer;white-space:nowrap;min-height:48px}
.btn:focus-visible{outline:2px solid var(--brand);outline-offset:2px}
.btn-primary{background:#0A7FA8;color:#fff}
/* Bootstrap / Helix 主题的 btn-primary 兜底（白字压在品牌蓝上只有 2.83:1） */
.btn-primary,.btn.btn-primary,button.btn-primary,
.com-content-article .btn-primary,.mod-finder .btn-primary{
  background:#0A7FA8!important;border-color:#0A7FA8!important;color:#fff!important;
}
.btn-primary:hover,.btn.btn-primary:hover,button.btn-primary:hover{
  background:#085F7E!important;border-color:#085F7E!important;color:#fff!important;
}
.btn-primary:hover{background:#085F7E;transform:translateY(-2px);box-shadow:0 14px 28px -14px rgba(10,111,141,.7)}
.btn-dark{background:var(--ink);color:#fff}
.btn-dark:hover{background:#2C343A;transform:translateY(-2px)}
.btn-outline{border-color:var(--line);background:#fff;color:var(--ink)}
.btn-outline:hover{border-color:var(--ink);transform:translateY(-2px)}
.menu-btn{display:none;width:46px;height:46px;border:1px solid var(--line);border-radius:9px;background:#fff;align-items:center;justify-content:center;cursor:pointer}

/* ---------- Hero ---------- */
.hero{background:linear-gradient(180deg,#fff 0%,var(--warm) 100%);padding:64px 0 72px}
.hero .wrap{display:grid;grid-template-columns:1.02fr .98fr;gap:52px;align-items:center}
.h-badge{display:inline-flex;align-items:center;gap:9px;font-size:13px;font-weight:700;color:var(--link);background:var(--brand-l);border-radius:999px;padding:8px 16px}
.h-badge i{width:7px;height:7px;border-radius:50%;background:var(--brand);display:inline-block}
.hero h1{font-size:clamp(34px,4.4vw,54px);margin:22px 0 0;max-width:14ch;letter-spacing:-.03em}
.hero h1 span{color:var(--link)}
.h-lead{margin-top:20px;font-size:clamp(16px,1.5vw,18px);color:var(--ink2);max-width:46ch}
.h-actions{margin-top:32px;display:flex;gap:14px;flex-wrap:wrap}
.h-note{margin-top:26px;display:flex;align-items:center;gap:22px;font-size:13.5px;color:var(--muted);flex-wrap:wrap}
.h-note b{color:var(--ink);font-weight:700}
/* 右侧真实产品图 */
.h-visual{position:relative}
.h-frame{border-radius:16px;overflow:hidden;box-shadow:var(--shadow-lg);background:#0E1A22;aspect-ratio:4/3;position:relative}
.h-frame img{width:100%;height:100%;object-fit:cover;display:block}
.h-float{position:absolute;left:-18px;bottom:22px;background:#fff;border-radius:12px;box-shadow:var(--shadow);padding:14px 18px;display:flex;align-items:center;gap:12px}
.h-float .n{font-size:26px;font-weight:800;color:var(--link);line-height:1}
.h-float .t{font-size:12px;color:var(--muted);line-height:1.35}

/* 入场 */
.rise{opacity:0;transform:translateY(24px);animation:rise .8s var(--ease) forwards}
.d1{animation-delay:.05s}.d2{animation-delay:.15s}.d3{animation-delay:.25s}.d4{animation-delay:.35s}
@keyframes rise{to{opacity:1;transform:none}}

/* ---------- 数据条 ---------- */
.trust{background:var(--white);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.trust .wrap{display:grid;grid-template-columns:repeat(4,1fr)}
.tcell{padding:34px 22px;text-align:center;border-right:1px solid var(--line)}
.tcell:last-child{border-right:0}
.tcell .n{font-size:clamp(28px,3.2vw,38px);font-weight:800;color:var(--link);letter-spacing:-.03em;line-height:1}
.tcell .n em{font-size:.45em;font-style:normal;color:var(--ink2);margin-left:2px}
.tcell .l{color:var(--ink2);font-size:14px;margin-top:9px}

/* ---------- section ---------- */
.sec{padding:76px 0}
.sec.warm{background:var(--warm)}
.sec-head{text-align:center;max-width:660px;margin:0 auto 44px}
.sec-head .k{display:inline-block;font-size:12.5px;font-weight:800;letter-spacing:.16em;text-transform:uppercase;color:var(--link)}
.sec-head h2{font-size:clamp(28px,3.4vw,40px);margin:12px 0 0}
.sec-head p{margin-top:14px;color:var(--ink2);font-size:16.5px}

/* ---------- 能力卡：明显阴影 ---------- */
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.card{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:30px 26px;box-shadow:var(--shadow);transition:transform .3s var(--ease),box-shadow .3s var(--ease),border-color .3s}
.card:hover{transform:translateY(-6px);box-shadow:var(--shadow-lg);border-color:transparent}
.card .ic{width:50px;height:50px;border-radius:12px;background:var(--brand-l);color:var(--link);display:grid;place-items:center;font-weight:800;font-size:17px;margin-bottom:20px}
.card h3{font-size:19px;margin-bottom:9px}
.card p{font-size:15px;color:var(--ink2)}
.card .big{margin-top:16px;font-size:28px;font-weight:800;color:var(--link)}
.card .big em{font-size:.5em;font-style:normal;color:var(--muted)}

/* ---------- 产品主推（真实产品图）---------- */
.feat{display:grid;grid-template-columns:.92fr 1.08fr;background:#fff;border:1px solid var(--line);border-radius:16px;overflow:hidden;box-shadow:var(--shadow-lg)}
.feat .vis{position:relative;background:linear-gradient(160deg,#F4F8FA,#E7F1F5);display:grid;place-items:center;padding:32px;min-height:400px}
.feat .vis img{width:100%;max-width:380px;height:auto;display:block;filter:drop-shadow(0 18px 30px rgba(22,26,29,.24))}
.feat .body{padding:48px 44px;display:flex;flex-direction:column;justify-content:center}
.tag{align-self:flex-start;font-size:12.5px;font-weight:800;color:var(--link);background:var(--brand-l);border-radius:7px;padding:7px 13px}
.feat h3{font-size:clamp(25px,2.8vw,33px);margin:16px 0 12px}
.feat .body>p{font-size:16px;color:var(--ink2);max-width:44ch}
.points{list-style:none;margin:22px 0 0;display:grid;gap:12px}
.points li{position:relative;padding-left:26px;font-size:15px;color:var(--ink2)}
.points li::before{content:"";position:absolute;left:0;top:9px;width:13px;height:7px;border-left:2px solid var(--brand);border-bottom:2px solid var(--brand);transform:rotate(-45deg)}
.feat-cta{display:flex;gap:14px;margin-top:30px;flex-wrap:wrap}

/* ---------- 产品线 ---------- */
.plgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.pl{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:26px;box-shadow:var(--shadow);transition:transform .28s var(--ease),box-shadow .28s var(--ease),border-color .28s}
.pl:hover{transform:translateY(-5px);border-color:var(--brand);box-shadow:var(--shadow-lg)}
.pl .no{font-size:12.5px;font-weight:800;color:var(--link);letter-spacing:.06em}
.pl h3{font-size:18px;margin:11px 0 7px}
.pl .ds{font-size:14px;color:var(--muted);line-height:1.55}
.pl .ct{margin-top:16px;font-size:14.5px;font-weight:700;color:var(--ink)}
.pl .ct em{color:var(--link);font-style:normal;font-size:1.5em;margin-right:2px}

/* ---------- 合作模式 ---------- */
.coop{display:grid;grid-template-columns:repeat(5,1fr);gap:18px}
.cstep{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:26px 20px;text-align:center;box-shadow:var(--shadow);transition:transform .28s var(--ease),box-shadow .28s var(--ease)}
.cstep:hover{transform:translateY(-5px);box-shadow:var(--shadow-lg)}
.cstep .i{width:42px;height:42px;border-radius:50%;background:#0A7FA8;color:#fff;font-weight:800;font-size:14px;display:grid;place-items:center;margin:0 auto 16px}
.cstep h3{font-size:16px;margin-bottom:8px}
.cstep p{font-size:13.5px;color:var(--ink2);line-height:1.55}

/* ---------- CTA（品牌绿·淡雅渐变）---------- */
.cta-band{background:linear-gradient(135deg,#F7FBEC 0%,#F0F7D8 45%,#E8F2C4 100%);padding:80px 0;position:relative;overflow:hidden;border-top:1px solid #E4ECCF}
.cta-band::after{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(640px 340px at 80% 10%,rgba(218,223,0,.14),transparent 72%)}
.cta-inner{position:relative;z-index:1}
.cta-band h2{color:var(--ink)}
.cta-band p{color:var(--ink2)}
.cta-inner{text-align:center;max-width:700px;margin:0 auto}
.cta-inner h2{font-size:clamp(28px,3.4vw,40px)}
.cta-inner p{margin-top:14px;color:var(--ink2);font-size:17px}
.cta-inner .h-actions{justify-content:center}

/* ---------- 页脚 ---------- */
footer{background:var(--dark);color:#98A2AB;padding:64px 0 34px;font-size:14.5px}
.fgrid{display:grid;grid-template-columns:1.7fr 1fr 1fr 1fr;gap:44px;padding-bottom:44px;border-bottom:1px solid rgba(255,255,255,.08)}
footer h3{color:#fff;font-size:14px;margin-bottom:18px;font-weight:700}
footer a{display:block;margin-bottom:11px;transition:color .2s}
footer a:hover{color:#fff}
.fcopy{padding-top:26px;display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;font-size:13px}

/* ---------- 揭示 ---------- */
html.js .reveal{opacity:0;transform:translateY(26px);transition:opacity .7s var(--ease),transform .7s var(--ease)}
html.js .reveal.in{opacity:1;transform:none}

/* ---------- 响应式：三档（iPad 横 / iPad 竖 / 手机）---------- */
/* 1024px 以下：平板横屏 -> 两列 */
@media(max-width:1024px){
  nav.main{display:none}
  .menu-btn{display:flex}
  .hero .wrap{grid-template-columns:1fr;gap:38px}
  .h-frame{aspect-ratio:16/9}
  .h-float{left:12px;bottom:12px}
  .cards,.plgrid{grid-template-columns:1fr 1fr}
  .coop{grid-template-columns:repeat(3,1fr)}
  .fgrid{grid-template-columns:1fr 1fr 1fr;gap:32px}
  .fgrid>div:first-child{grid-column:1 / -1}
}
/* 820px 以下：平板竖屏 */
@media(max-width:820px){
  .sec{padding:64px 0}
  .coop{grid-template-columns:1fr 1fr}
  .feat{grid-template-columns:.85fr 1.15fr}
}
/* 640px 以下：手机 -> 单列 */
@media(max-width:640px){
  .wrap{padding:0 20px}
  .sec{padding:52px 0}
  .hero{padding:40px 0 52px}
  .hero h1{font-size:clamp(28px,7.6vw,38px)}
  .h-frame{aspect-ratio:4/3}
  .trust .wrap{grid-template-columns:1fr 1fr}
  .tcell{border-bottom:1px solid var(--line);padding:26px 16px}
  .tcell:nth-child(2n){border-right:0}
  .feat{grid-template-columns:1fr}
  .feat .vis{min-height:250px;padding:24px}
  .feat .body{padding:30px 22px}
  .cards,.plgrid,.coop{grid-template-columns:1fr}
  .h-actions .btn{flex:1}
  .fgrid{grid-template-columns:1fr 1fr;gap:24px}
  .fgrid>div:first-child{grid-column:1 / -1}
  footer{font-size:14px}
  footer a{margin-bottom:9px;font-size:13.5px}
  footer h3{font-size:13.5px;margin-bottom:13px}
  .topstrip{font-size:12px}
  .topstrip .wrap{padding:6px 20px;flex-wrap:nowrap;justify-content:center;gap:8px;overflow:hidden}
  .topstrip .tl{gap:8px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .topstrip .tl .sep,.topstrip .tl a{display:none}
  .topstrip .tr{display:none}
  .sec-head{margin-bottom:32px}
}
/* 400px 以下：小屏手机 */
@media(max-width:400px){
  .trust .wrap{grid-template-columns:1fr}
  .tcell{border-right:0}
  .fgrid{grid-template-columns:1fr}
  .h-actions{flex-direction:column}
  .h-actions .btn{width:100%}
}
@media (prefers-reduced-motion: reduce){
  *{animation:none !important;transition:none !important}
  html.js .reveal{opacity:1;transform:none}
}

/* ---------- 页脚 LOGO（反白图）---------- */
footer .yn-foot-logo{height:52px;width:auto;display:block;margin-bottom:4px}
@media(max-width:640px){ footer .yn-foot-logo{height:44px} }

/* ---------- 顶部色条：突破容器铺满整宽 ---------- */
#sp-top1.sp-column, .sp-column:has(> .sp-module > .sp-module-content > .mod-custom > .topstrip){width:100%}
#sp-top1 .sp-module{display:block;width:100%}
#sp-top1 .sp-module-content,
#sp-top1 .mod-custom{width:100%}
.topstrip{
  width:100vw;
  max-width:100vw;
  margin-left:calc(50% - 50vw);
  margin-right:calc(50% - 50vw);
  box-sizing:border-box;
}

/* ---------- 顶部色条：强制整宽 + 覆盖 Helix 列宽 ---------- */
#sp-top1{width:100%!important;max-width:100%!important;flex:0 0 100%!important;}
#sp-top1 > .sp-column{width:100%!important;}
#sp-top1 .sp-module{display:block!important;width:100%!important;margin:0!important;}
#sp-top1 .sp-module-content,
#sp-top1 .mod-custom{width:100%!important;}
.topstrip{width:100%!important;max-width:100%!important;margin:0!important;padding:0!important;}
.topstrip .wrap{max-width:1170px;margin:0 auto;padding:8px 24px;}

/* ---------- 导航：橙色 -> 品牌蓝 ---------- */
#sp-menu .sp-menu-item > a,
#sp-menu .sp-menu-item > span.sp-menu-separator{color:#3C4650!important;transition:color .2s;}
#sp-menu .sp-menu-item > a:hover,
#sp-menu .sp-menu-item > span.sp-menu-separator:hover{color:#00A5DD!important;}
#sp-menu .sp-menu-item.active > a,
#sp-menu .sp-menu-item.current-item > a{color:#0A6E92!important;font-weight:600;}
#sp-menu .sp-dropdown-items .sp-menu-item > a{color:#3C4650!important;}
#sp-menu .sp-dropdown-items .sp-menu-item > a:hover{color:#00A5DD!important;}

/* ---------- 导航：强制普通项深灰 / 活跃项品牌蓝（高优先级）---------- */
#sp-menu .sp-megamenu-parent > li.sp-menu-item > a,
#sp-menu .sp-megamenu-parent > li.sp-menu-item > span.sp-menu-separator,
#sp-menu ul.sp-megamenu-parent li a{
  color:#3C4650!important;
  font-weight:500;
}
#sp-menu .sp-megamenu-parent > li.sp-menu-item > a:hover,
#sp-menu .sp-megamenu-parent > li.sp-menu-item > span.sp-menu-separator:hover{
  color:#0A6E92!important;
}
#sp-menu .sp-megamenu-parent > li.active > a,
#sp-menu .sp-megamenu-parent > li.current-item > a,
#sp-menu ul.sp-megamenu-parent li.active a,
#sp-menu ul.sp-megamenu-parent li.active > a{
  color:#0A6E92!important;
  font-weight:700!important;
}
/* 下拉菜单 */
#sp-menu .sp-dropdown .sp-menu-item > a{color:#3C4650!important;}
#sp-menu .sp-dropdown .sp-menu-item > a:hover{color:#00A5DD!important;}

/* ---------- 顶部条容器：去掉 Helix 原生深灰底，让 topstrip 铺满 ---------- */
#sp-top-bar{
  background:transparent!important;
  color:inherit!important;
  padding:0!important;
  height:auto!important;
  min-height:0!important;
}
#sp-top-bar > .container,
#sp-top-bar .container-inner,
#sp-top-bar .row{
  max-width:100%!important;
  width:100%!important;
  padding:0!important;
  margin:0!important;
}
#sp-top-bar #sp-top1{
  width:100%!important;
  max-width:100%!important;
  flex:0 0 100%!important;
  padding:0!important;
}
#sp-top-bar .sp-column{width:100%!important;padding:0!important;}
#sp-top-bar .sp-module,
#sp-top-bar .sp-module-content,
#sp-top-bar .mod-custom{width:100%!important;margin:0!important;padding:0!important;display:block!important;}
#sp-top-bar .topstrip{width:100%!important;margin:0!important;}
#sp-top-bar .topstrip .wrap{max-width:1170px;margin:0 auto;padding:8px 24px;}

/* ---------- 移动端 Offcanvas 菜单：橙色 -> 品牌配色 ---------- */
.offcanvas-menu .mod-menu li > a,
.offcanvas-menu .mod-menu li > span,
.offcanvas-menu ul.mod-menu > li > a,
.offcanvas-menu ul.mod-menu > li > span{
  color:#3C4650!important;
  font-weight:500;
}
.offcanvas-menu .mod-menu li > a:hover,
.offcanvas-menu ul.mod-menu > li > a:hover{color:#00A5DD!important;}
.offcanvas-menu .mod-menu li.active > a,
.offcanvas-menu .mod-menu li.current > a,
.offcanvas-menu ul.mod-menu > li.current > a,
.offcanvas-menu ul.mod-menu > li.active > a{
  color:#00A5DD!important;
  font-weight:700!important;
}
.offcanvas-menu .mod-menu li.active > a::before,
.offcanvas-menu .mod-menu li.current > a::before{background:#00A5DD!important;}
/* 关闭按钮 & 图标 */
.offcanvas-menu .close-offcanvas,
.offcanvas-menu .close-offcanvas i{color:#3C4650;}

/* ============================================================
   跃能官网 V7 · 内页层（产品列表 / 详情 / 关于 / 新闻 / 帮助）
   复用 V6 token（--brand / --ink2 / --warm / --shadow …）
   独立命名空间：yn- 前缀，避免与首页模块样式互相污染
   ============================================================ */

/* ---------- 通用 ---------- */
.yn-wrap{max-width:1170px;margin:0 auto;padding:0 24px}
.yn-crumb{display:flex;flex-wrap:wrap;align-items:center;gap:7px;font-size:13.5px;color:var(--muted);margin-bottom:18px}
.yn-crumb a{color:var(--muted);transition:color .2s}
.yn-crumb a:hover{color:var(--link)}
.yn-crumb span[aria-current]{color:var(--ink2);font-weight:600;max-width:60ch;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
/* 面包屑里的链接（含 Helix 主题 a 颜色覆盖）：统一用深蓝，白底 5.6:1 */
/* 面包屑链接：需要覆盖 Helix 主题对 a 的品牌色定义（更高权重 + !important） */
body .yn-crumb a,
body .yn-crumb a:link,
body .yn-crumb a:visited,
body .yn-crumb a:active{color:var(--ink2)!important;text-decoration:none}
body .yn-crumb a:hover,
body .yn-crumb a:focus,
body .yn-crumb a:focus-visible{color:var(--link)!important}

/* 内容区容器：Helix 组件区默认无背景，统一留白 */
#sp-component{padding:0 0 72px}
#sp-main{background:#fff}

/* 面包屑 + 组件之间的间距 */
.yn-cat,.yn-pdp,.yn-article{background:#fff}

/* ---------- 列表页页头 ---------- */
.yn-cat__head{background:linear-gradient(180deg,#fff 0%,var(--warm) 100%);border-bottom:1px solid var(--line);padding:46px 0 40px}
.yn-cat__title{font-size:clamp(28px,3.6vw,42px);margin:0;letter-spacing:-.03em;color:var(--ink)}
.yn-cat__desc{margin-top:14px;font-size:16px;color:var(--ink2);max-width:62ch}
.yn-cat__desc p{margin:0}
.yn-cat__count{margin-top:14px;font-size:13.5px;color:var(--muted)}
.yn-cat__count b{color:var(--link);font-size:15px}

/* ---------- 分类筛选胶囊 ---------- */
.yn-cat__filter{position:sticky;top:0;z-index:20;background:rgba(255,255,255,.94);backdrop-filter:blur(12px);border-bottom:1px solid var(--line)}
.yn-cat__filter .yn-wrap{display:flex;align-items:center;overflow-x:auto;scrollbar-width:none}
.yn-cat__filter .yn-wrap::-webkit-scrollbar{display:none}
.yn-chips{display:flex;gap:8px;list-style:none;margin:0;padding:12px 0;white-space:nowrap}
.yn-chip{display:inline-flex;align-items:center;min-height:38px;padding:0 16px;border-radius:999px;border:1px solid var(--line);background:#fff;color:var(--ink2);font-size:14px;font-weight:600;transition:border-color .2s,color .2s,background .2s}
.yn-chip:hover{border-color:var(--brand);color:var(--link)}
.yn-chip.is-active{background:#0A7FA8;border-color:#0A7FA8;color:#fff}

/* ---------- 产品网格 ---------- */
.yn-cat__body{padding:44px 0 0}
.yn-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:22px}
.yn-grid--news{grid-template-columns:repeat(3,1fr)}

/* ---------- 产品卡 ---------- */
.yn-pcard{display:flex;flex-direction:column;background:#fff;border:1px solid var(--line);border-radius:12px;overflow:hidden;box-shadow:0 2px 10px -6px rgba(22,26,29,.16);transition:transform .28s var(--ease),box-shadow .28s var(--ease),border-color .28s}
.yn-pcard:hover{transform:translateY(-5px);box-shadow:var(--shadow-lg);border-color:transparent}
.yn-pcard__media{position:relative;display:block;aspect-ratio:1/1;background:#fff;overflow:hidden;border-bottom:1px solid var(--line)}
.yn-pcard__media img{width:100%;height:100%;object-fit:contain;padding:14px;transition:transform .4s var(--ease);background:#fff}
.yn-pcard:hover .yn-pcard__media img{transform:scale(1.04)}
.yn-pcard__ph{position:absolute;inset:0;display:grid;place-items:center;background:linear-gradient(160deg,#F4F8FA,#E7F1F5)}
.yn-pcard__ph span{font-size:22px;font-weight:800;letter-spacing:.04em;color:#9DB4BF}
.yn-pcard__body{display:flex;flex-direction:column;flex:1;padding:20px 20px 22px}
.yn-pcard__model{align-self:flex-start;font-size:12px;font-weight:800;letter-spacing:.06em;color:var(--link);background:var(--brand-l);border-radius:6px;padding:5px 9px}
.yn-pcard__title{font-size:16.5px;line-height:1.45;margin:12px 0 0;font-weight:700;letter-spacing:-.01em}
.yn-pcard__title a{color:var(--ink);transition:color .2s}
.yn-pcard__title a:hover{color:var(--link)}
.yn-pcard__desc{margin-top:10px;font-size:13.8px;line-height:1.65;color:var(--ink2);display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.yn-pcard__more{margin-top:auto;padding-top:16px;font-size:13.5px;font-weight:700;color:var(--link);display:inline-flex;align-items:center;gap:7px}
.yn-pcard__more svg{transition:transform .25s var(--ease)}
.yn-pcard:hover .yn-pcard__more svg{transform:translateX(4px)}

/* 新闻卡：无图时更紧凑 */
.yn-pcard--news .yn-pcard__media{aspect-ratio:16/10}

/* ---------- 分页 ---------- */
.yn-pager{margin-top:44px;display:flex;justify-content:center}
.yn-pager .pagination{margin:0;display:flex;flex-wrap:wrap;gap:6px;list-style:none;padding:0}
.yn-pager .page-link{display:inline-flex;align-items:center;justify-content:center;min-width:40px;height:40px;padding:0 12px;border-radius:9px;border:1px solid var(--line);color:var(--ink2);font-size:14px;font-weight:600;background:#fff;transition:border-color .2s,color .2s,background .2s}
.yn-pager .page-link:hover{border-color:var(--brand);color:var(--link)}
.yn-pager .page-item.active .page-link{background:#0A7FA8;border-color:#0A7FA8;color:#fff}
.yn-pager .page-item.disabled .page-link{color:#B7C0C6;background:#FAFBFC}

.yn-empty{padding:64px 0;text-align:center;color:var(--muted)}

/* ---------- 产品详情 ---------- */
.yn-pdp{padding-top:0}
.yn-pdp__top{display:grid;grid-template-columns:1.02fr .98fr;gap:52px;align-items:start;padding-bottom:56px}
.yn-pdp__gallery{position:sticky;top:96px}
.yn-pdp__main{position:relative;aspect-ratio:1/1;border:1px solid var(--line);border-radius:16px;background:linear-gradient(160deg,#fff,#F7FAFB);display:grid;place-items:center;overflow:hidden}
.yn-pdp__main img{width:100%;height:100%;object-fit:contain;padding:26px}
.yn-pdp__ph{position:absolute;inset:0;display:grid;place-items:center;background:linear-gradient(160deg,#F4F8FA,#E7F1F5)}
.yn-pdp__ph span{font-size:38px;font-weight:800;letter-spacing:.04em;color:#9DB4BF}
.yn-pdp__thumbs{display:flex;gap:10px;margin-top:12px;flex-wrap:wrap}
.yn-thumb{width:74px;height:74px;padding:6px;border:1px solid var(--line);border-radius:10px;background:#fff;cursor:pointer;transition:border-color .2s,box-shadow .2s}
.yn-thumb img{width:100%;height:100%;object-fit:contain;display:block}
.yn-thumb:hover{border-color:var(--brand)}
.yn-thumb.is-active{border-color:var(--brand);box-shadow:0 0 0 2px rgba(0,165,221,.18)}

.yn-pdp__model{display:inline-block;font-size:12.5px;font-weight:800;letter-spacing:.08em;color:var(--link);background:var(--brand-l);border-radius:7px;padding:7px 12px}
.yn-pdp__title{font-size:clamp(26px,3.1vw,38px);margin:16px 0 0;letter-spacing:-.03em;line-height:1.22}
.yn-pdp__lead{margin-top:16px;font-size:16px;color:var(--ink2);line-height:1.75}
.yn-pdp__lead p{margin:0 0 8px}
.yn-pdp__lead img, .yn-pdp__lead video{max-width:100%;height:auto;border-radius:10px}
.yn-pdp__specs{margin:26px 0 0;border-top:1px solid var(--line)}
.yn-pdp__specs>div{display:grid;grid-template-columns:110px 1fr;gap:16px;padding:13px 0;border-bottom:1px solid var(--line)}
.yn-pdp__specs dt{font-size:13.5px;color:var(--ink3);font-weight:600;margin:0}
.yn-pdp__specs dd{margin:0;font-size:14.5px;color:var(--ink);line-height:1.65}
.yn-pdp__cta{display:flex;gap:12px;margin-top:30px;flex-wrap:wrap}
.yn-pdp__note{margin-top:16px;font-size:13px;color:var(--ink3)}

.yn-pdp__sections{display:grid;gap:18px;padding-bottom:20px}
.yn-pdp__sec{background:var(--warm);border:1px solid var(--line);border-radius:14px;padding:34px 36px}
.yn-pdp__sec h2{font-size:22px;margin:0 0 16px;letter-spacing:-.02em;position:relative;padding-left:16px}
.yn-pdp__sec h2::before{content:"";position:absolute;left:0;top:.32em;width:5px;height:1em;border-radius:3px;background:var(--brand)}
.yn-pdp__video{width:100%;max-width:860px;border-radius:12px;background:#000}

/* ---------- 富文本（yn-prose） ---------- */
.yn-prose{font-size:16px;line-height:1.85;color:var(--ink2)}
.yn-prose p{margin:0 0 14px}
.yn-prose ul,.yn-prose ol{margin:0 0 16px;padding-left:22px}
.yn-prose li{margin-bottom:8px}
.yn-prose img,.yn-prose video{max-width:100%;height:auto;border-radius:10px;margin:10px 0}
.yn-prose h2,.yn-prose h3{margin:26px 0 12px;color:var(--ink);letter-spacing:-.02em;line-height:1.3}
.yn-prose h2{font-size:24px}
.yn-prose h3{font-size:19px}
.yn-prose a{color:var(--link);text-decoration:underline;text-underline-offset:3px}
.yn-prose blockquote{margin:18px 0;padding:14px 20px;border-left:3px solid var(--brand);background:#fff;border-radius:0 10px 10px 0;color:var(--ink2)}
.yn-prose table{width:100%;border-collapse:collapse;margin:16px 0;font-size:14.5px}
.yn-prose th,.yn-prose td{border:1px solid var(--line);padding:10px 12px;text-align:left}
.yn-prose th{background:#fff;font-weight:700;color:var(--ink)}
.yn-prose code{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.92em;background:#fff;border:1px solid var(--line);border-radius:5px;padding:1px 6px;color:var(--ink)}

/* FAQ：把 div/section 里的“问: / 答:”排成问答样式 */
.yn-prose--faq section,.yn-prose--faq>div{margin-bottom:12px;background:#fff;border:1px solid var(--line);border-radius:10px;padding:14px 18px}
.yn-prose--faq code{background:none;border:0;padding:0;font-family:inherit;font-size:inherit;font-weight:700;color:var(--ink)}

/* ---------- 通用文章页 ---------- */
.yn-article{padding-top:0}
.yn-article__head{background:var(--warm);border-bottom:1px solid var(--line);padding:38px 0 34px;margin-bottom:36px}
.yn-article__head.has-img{background:linear-gradient(180deg,#fff,var(--warm))}
.yn-article__date{display:inline-block;font-size:13px;font-weight:700;color:var(--link);letter-spacing:.04em;margin-bottom:10px}
.yn-article__title{font-size:clamp(26px,3.2vw,38px);margin:0;letter-spacing:-.03em;line-height:1.25;max-width:24ch}
.yn-article__body{max-width:820px;margin:0 auto;padding-bottom:20px}
.yn-article__cover{margin:0 0 28px}
.yn-article__cover img{width:100%;height:auto;border-radius:14px;display:block}
.yn-article__foot{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-top:44px;padding-top:26px;border-top:1px solid var(--line)}

/* 文章页里 Helix 残留块（作者信息 / 评论 / 社交分享）收敛 */
.yn-article .author-info,.yn-article .article-author{display:none}

/* 组件区内的旧样式兜底（info block、fields 列表不再直接露出） */
#sp-component .fields-container{list-style:none;padding:0;margin:0}
#sp-component .field-entry .field-label-nickname{display:block;font-size:12px;font-weight:700;color:var(--link);margin-bottom:4px}

/* ---------- 响应式 ---------- */
@media (max-width:1024px){
  .yn-grid{grid-template-columns:repeat(3,1fr);gap:18px}
  .yn-grid--news{grid-template-columns:repeat(2,1fr)}
  .yn-pdp__top{grid-template-columns:1fr;gap:34px}
  .yn-pdp__gallery{position:static}
  .yn-pdp__main{aspect-ratio:4/3;max-height:520px}
}
@media (max-width:820px){
  .yn-cat__head{padding:34px 0 30px}
  .yn-grid{grid-template-columns:repeat(2,1fr)}
  .yn-pdp__sec{padding:26px 22px}
  .yn-article__body{padding:0 24px}
}
@media (max-width:640px){
  .yn-wrap{padding:0 20px}
  .yn-grid,.yn-grid--news{grid-template-columns:1fr 1fr;gap:12px}
  .yn-pcard__body{padding:14px 14px 16px}
  .yn-pcard__title{font-size:14.5px;margin-top:9px}
  .yn-pcard__desc{-webkit-line-clamp:2;font-size:13px}
  .yn-pcard__more{font-size:12.5px;padding-top:12px}
  .yn-pcard__media img{padding:10px}
  .yn-pdp{padding-top:24px}
  .yn-pdp__cta .btn{flex:1}
  .yn-article__title{max-width:none}
  .yn-article__foot .btn{flex:1}
}
@media (max-width:400px){
  .yn-grid,.yn-grid--news{grid-template-columns:1fr}
}

@media (prefers-reduced-motion: reduce){
  .yn-pcard,.yn-pcard__media img,.yn-chip,.yn-pager .page-link{transition:none !important}
}
/* ============================================================
   V7 · 分类页表格 -> 产品卡（default 布局兜底重排）
   说明：Joomla SEF 下 layout=blog 不生效时，用 CSS 把 <table> 重排成卡片。
   缩略图按文章逐条生成（见下方 yn-thumb-a<id> 规则）。
   ============================================================ */
.yn-tbl--cats{border-collapse:separate;border-spacing:0;width:100%}
.yn-tbl--cats thead{display:none}
.yn-tbl--cats tbody{display:grid;grid-template-columns:repeat(4,1fr);gap:22px}
.yn-tbl--cats tbody tr{display:flex;flex-direction:column;border:1px solid var(--line);border-radius:12px;background:#fff;overflow:hidden;box-shadow:0 2px 10px -6px rgba(22,26,29,.16);transition:transform .28s var(--ease),box-shadow .28s var(--ease),border-color .28s}
.yn-tbl--cats tbody tr:hover{transform:translateY(-5px);box-shadow:var(--shadow-lg);border-color:transparent}
.yn-tbl--cats tbody td,.yn-tbl--cats tbody th{border:0!important;padding:0!important;background:none!important}
.yn-tbl--cats tbody th.list-title{order:2;padding:18px 18px 6px!important;font-weight:700;font-size:16px;line-height:1.45}
.yn-tbl--cats tbody th.list-title::before{content:"";display:block;order:1;aspect-ratio:1/1;margin:-18px -18px 12px;background:#fff center/contain no-repeat;background-size:contain;border-bottom:1px solid var(--line)}
.yn-tbl--cats tbody th.list-title a{color:var(--ink);text-decoration:none}
.yn-tbl--cats tbody th.list-title a:hover{color:var(--link)}
.yn-tbl--cats tbody td.list-author{display:none}
.yn-tbl--cats tbody td.list-hits{order:3;padding:0 18px 18px!important;font-size:12.5px;color:var(--muted)}
.yn-tbl--cats tbody td.list-hits .badge{background:#F1F5F7!important;color:var(--muted)!important;font-weight:600;padding:4px 8px;border-radius:6px}
.yn-tbl--cats tbody td.list-hits .badge::after{content:" 次浏览"}
@media(max-width:1024px){.yn-tbl--cats tbody{grid-template-columns:repeat(3,1fr);gap:18px}}
@media(max-width:820px){.yn-tbl--cats tbody{grid-template-columns:repeat(2,1fr)}}
@media(max-width:400px){.yn-tbl--cats tbody{grid-template-columns:1fr}}

.yn-tbl--cats tbody tr:has(a[href$='/mx65-guide.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=95']) th.list-title::before{background-image:url('/images/products/mx65/2.jpg')}
.yn-tbl--cats tbody tr:has(a[href$='/yn1100-guide.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=96']) th.list-title::before{background-image:url('/images/products/yn1100/2.jpg')}
.yn-tbl--cats tbody tr:has(a[href$='/yn1200-guide.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=97']) th.list-title::before{background-image:url('/images/products/yn1200/2.jpg')}
.yn-tbl--cats tbody tr:has(a[href$='/yn4483-guide.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=98']) th.list-title::before{background-image:url('/images/products/yn4483/2.jpg')}
.yn-tbl--cats tbody tr:has(a[href$='/yn2100-guide.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=99']) th.list-title::before{background-image:url('/images/products/yn2100/2.jpg')}
.yn-tbl--cats tbody tr:has(a[href$='/yn1101-guide.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=100']) th.list-title::before{background-image:url('/images/products/yn1101/2.jpg')}
.yn-tbl--cats tbody tr:has(a[href$='/yn8100-guide.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=101']) th.list-title::before{background-image:url('/images/products/yn8100/2.jpg')}
.yn-tbl--cats tbody tr:has(a[href$='/yn8101-guide.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=102']) th.list-title::before{background-image:url('/images/products/yn8101/2.jpg')}
.yn-tbl--cats tbody tr:has(a[href$='/yn8102-guide.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=103']) th.list-title::before{background-image:url('/images/products/yn8102/2.jpg')}
.yn-tbl--cats tbody tr:has(a[href$='/yn81-bulk-guide.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=104']) th.list-title::before{background-image:url('/images/products/yn81-3/2.jpg')}
.yn-tbl--cats tbody tr:has(a[href$='/yn8103-guide.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=105']) th.list-title::before{background-image:url('/images/products/yn8103/2.jpg')}
.yn-tbl--cats tbody tr:has(a[href$='/yn100-guide.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=106']) th.list-title::before{background-image:url('/images/products/yn100/2.jpg')}
.yn-tbl--cats tbody tr:has(a[href$='/yn2101-guide.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=107']) th.list-title::before{background-image:url('/images/products/yn2101/2.jpg')}
.yn-tbl--cats tbody tr:has(a[href$='/yn1201-guide.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=108']) th.list-title::before{background-image:url('/images/products/yn1201/2.jpg')}
.yn-tbl--cats tbody tr:has(a[href$='/yn30-guide.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=109']) th.list-title::before{background-image:url('/images/products/yn30/2.jpg')}
.yn-tbl--cats tbody tr:has(a[href$='/yn8301-guide.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=110']) th.list-title::before{background-image:url('/images/products/yn8301/2.jpg')}
.yn-tbl--cats tbody tr:has(a[href$='/yn8302-guide.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=111']) th.list-title::before{background-image:url('/images/products/yn8302/2.jpg')}
.yn-tbl--cats tbody tr:has(a[href$='/yn8303-guide.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=112']) th.list-title::before{background-image:url('/images/products/yn8303/2.jpg')}
.yn-tbl--cats tbody tr:has(a[href$='/yn8200-guide.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=113']) th.list-title::before{background-image:url('/images/products/yn8200/2.jpg')}
.yn-tbl--cats tbody tr:has(a[href$='/yn8610-guide.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=114']) th.list-title::before{background-image:url('/images/products/yn8610/300-300.jpg')}
.yn-tbl--cats tbody tr:has(a[href$='/yn8620-guide.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=115']) th.list-title::before{background-image:url('/images/products/yn8620/2.jpg')}
.yn-tbl--cats tbody tr:has(a[href$='/yn8630-guide.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=116']) th.list-title::before{background-image:url('/images/products/yn8630/2.jpg')}
.yn-tbl--cats tbody tr:has(a[href$='/hm1073-guide.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=117']) th.list-title::before{background-image:url('/images/products/hn1073/2.jpg')}
.yn-tbl--cats tbody tr:has(a[href$='/hm20125-1-guide.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=118']) th.list-title::before{background-image:url('/images/products/hzllhm/2.jpg')}
.yn-tbl--cats tbody tr:has(a[href$='/hm20125-2-guide.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=119']) th.list-title::before{background-image:url('/images/products/ghthm/2.jpg')}
.yn-tbl--cats tbody tr:has(a[href$='/dlhm-guide.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=120']) th.list-title::before{background-image:url('/images/products/dlhm/2.jpg')}
.yn-tbl--cats tbody tr:has(a[href$='/xcmj-guide.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=121']) th.list-title::before{background-image:url('/images/products/xcmj/2.jpg')}
.yn-tbl--cats tbody tr:has(a[href$='/yn7-guide.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=122']) th.list-title::before{background-image:url('/images/products/yn7/2.jpg')}
.yn-tbl--cats tbody tr:has(a[href$='/yn8210-guide.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=123']) th.list-title::before{background-image:url('/images/products/yn8210/2.jpg')}
.yn-tbl--cats tbody tr:has(a[href$='/yn8201-guide.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=124']) th.list-title::before{background-image:url('/images/products/yn8201/2.jpg')}
.yn-tbl--cats tbody tr:has(a[href$='/yn8700-guide.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=125']) th.list-title::before{background-image:url('/images/products/yn8700/2.jpg')}
.yn-tbl--cats tbody tr:has(a[href$='/yn8701-guide.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=126']) th.list-title::before{background-image:url('/images/products/yn8701/2.jpg')}
.yn-tbl--cats tbody tr:has(a[href$='/yn9103-guide.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=127']) th.list-title::before{background-image:url('/images/products/yn9103/2.jpg')}
.yn-tbl--cats tbody tr:has(a[href$='/xcn-bulk-guide.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=128']) th.list-title::before{background-image:url('/images/products/xcn200/2.jpg')}
.yn-tbl--cats tbody tr:has(a[href$='/xcn150-bulk-guide.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=129']) th.list-title::before{background-image:url('/images/products/xcn150/2.jpg')}
.yn-tbl--cats tbody tr:has(a[href$='/xne01-guide.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=130']) th.list-title::before{background-image:url('/images/products/xne01/2.jpg')}
.yn-tbl--cats tbody tr:has(a[href$='/xne-bulk-guide.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=131']) th.list-title::before{background-image:url('/images/products/xne02/2.jpg')}
.yn-tbl--cats tbody tr:has(a[href$='/yn8600-guide.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=132']) th.list-title::before{background-image:url('/images/products/yn8600/1.jpg')}
.yn-tbl--cats tbody tr:has(a[href$='/yn8203-guide.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=133']) th.list-title::before{background-image:url('/images/products/yn8203/1.jpg')}
.yn-tbl--cats tbody tr:has(a[href$='/yn8205-guide.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=134']) th.list-title::before{background-image:url('/images/products/yn8205/1.jpg')}
.yn-tbl--cats tbody tr:has(a[href$='/yn8206-guide.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=135']) th.list-title::before{background-image:url('/images/products/yn8206/2.jpg')}
.yn-tbl--cats tbody tr:has(a[href$='/yn8207-guide.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=136']) th.list-title::before{background-image:url('/images/products/yn8207/2.jpg')}
.yn-tbl--cats tbody tr:has(a[href$='/ynsq-guide.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=137']) th.list-title::before{background-image:url('/images/products/ynsq/2.jpg')}
.yn-tbl--cats tbody tr:has(a[href$='/yn8202-guide.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=138']) th.list-title::before{background-image:url('/images/products/yn8202/2.jpg')}
.yn-tbl--cats tbody tr:has(a[href$='/yn8208-guide.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=139']) th.list-title::before{background-image:url('/images/products/yn8208/2.png')}
.yn-tbl--cats tbody tr:has(a[href$='/yn8209-guide.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=140']) th.list-title::before{background-image:url('/images/products/yn8209/2.png')}
.yn-tbl--cats tbody tr:has(a[href$='/yn9105-guide.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=141']) th.list-title::before{background-image:url('/images/products/yn9105/2.jpg')}
.yn-tbl--cats tbody tr:has(a[href$='/yn8211-guide.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=142']) th.list-title::before{background-image:url('/images/products/yn8211/300-300.jpg')}
.yn-tbl--cats tbody tr:has(a[href$='/yn8212-guide.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=143']) th.list-title::before{background-image:url('/images/products/yn8212/300.jpg')}
.yn-tbl--cats tbody tr:has(a[href$='/yn8203-bulk-guide.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=144']) th.list-title::before{background-image:url('/images/products/YN8203-D/8203300X300.png')}
.yn-tbl--cats tbody tr:has(a[href$='/yn8203x-guide.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=145']) th.list-title::before{background-image:url('/images/products/YN8203-D/300X300.png')}
.yn-tbl--cats tbody tr:has(a[href$='/yn8200-bulk-guide.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=146']) th.list-title::before{background-image:url('/images/products/YN8200-D/8200300X300.png')}
.yn-tbl--cats tbody tr:has(a[href$='/yn8200x-guide.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=147']) th.list-title::before{background-image:url('/images/products/YN8200-D/8200X300X300.png')}
.yn-tbl--cats tbody tr:has(a[href$='/yn8202x-guide.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=148']) th.list-title::before{background-image:url('/images/products/YN8202-D/8202300X300.png')}
.yn-tbl--cats tbody tr:has(a[href$='/yn8211-bulk-guide.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=149']) th.list-title::before{background-image:url('/images/products/YN8211-D/8211300X300.png')}
.yn-tbl--cats tbody tr:has(a[href$='/yn8211x-guide.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=150']) th.list-title::before{background-image:url('/images/products/YN8211-D/8211X300X300.png')}
.yn-tbl--cats tbody tr:has(a[href$='/yn8207-bulk-guide.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=151']) th.list-title::before{background-image:url('/images/products/YN8207-D/8207300X300.png')}
.yn-tbl--cats tbody tr:has(a[href$='/yn8207x-guide.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=152']) th.list-title::before{background-image:url('/images/products/YN8207-D/8207X300X300.png')}
.yn-tbl--cats tbody tr:has(a[href$='/yn8209-bulk-guide.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=153']) th.list-title::before{background-image:url('/images/products/YN8209-D/8209300X300.png')}
.yn-tbl--cats tbody tr:has(a[href$='/yn8209x-guide.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=154']) th.list-title::before{background-image:url('/images/products/YN8209-D/8029X300X300.png')}
.yn-tbl--cats tbody tr:has(a[href$='/yn8212-bulk-guide.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=155']) th.list-title::before{background-image:url('/images/products/YN8212-D/8211300X300.png')}
.yn-tbl--cats tbody tr:has(a[href$='/yn8212x-guide.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=156']) th.list-title::before{background-image:url('/images/products/YN8212-D/8211X300X300.png')}
.yn-tbl--cats tbody tr:has(a[href$='/yn8205-bulk-guide.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=157']) th.list-title::before{background-image:url('/images/products/YN8205-D/8205300X300.png')}
.yn-tbl--cats tbody tr:has(a[href$='/yn8205x-guide.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=158']) th.list-title::before{background-image:url('/images/products/YN8205-D/8205X300X300.png')}
.yn-tbl--cats tbody tr:has(a[href$='/yn160-guide.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=159']) th.list-title::before{background-image:url('/images/products/YN160/YN160300.jpg')}
.yn-tbl--cats tbody tr:has(a[href$='/yn8216-guide.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=160']) th.list-title::before{background-image:url('/images/products/YN8216/YN8216300.jpg')}
.yn-tbl--cats tbody tr:has(a[href$='/yn8219-guide.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=161']) th.list-title::before{background-image:url('/images/products/YN8219/YN8219300.jpg')}
.yn-tbl--cats tbody tr:has(a[href$='/yn8217-guide.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=162']) th.list-title::before{background-image:url('/images/products/YN8217/YN8217300.jpg')}
.yn-tbl--cats tbody tr:has(a[href$='/yn8219-bulk-guide.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=163']) th.list-title::before{background-image:url('/images/products/YN8219-D/YN8219-5l300.jpg')}
.yn-tbl--cats tbody tr:has(a[href$='/yn8217-bulk-guide.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=164']) th.list-title::before{background-image:url('/images/products/YN8217-D/YN8217-5l300.jpg')}
.yn-tbl--cats tbody tr:has(a[href$='/yn8220-guide.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=165']) th.list-title::before{background-image:url('/images/products/YN8220/300yn8220.jpg')}
.yn-tbl--cats tbody tr:has(a[href$='/yn8213-guide.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=166']) th.list-title::before{background-image:url('/images/products/YN8213/300.jpg')}
.yn-tbl--cats tbody tr:has(a[href$='/yn8215-guide.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=167']) th.list-title::before{background-image:url('/images/products/YN8215/300.jpg')}
.yn-tbl--cats tbody tr:has(a[href$='/yn8213-bulk-guide.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=168']) th.list-title::before{background-image:url('/images/products/YN8213-D/300yn8213.jpg')}
.yn-tbl--cats tbody tr:has(a[href$='/yn8213x-guide.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=169']) th.list-title::before{background-image:url('/images/products/YN8213-D/300yn8213x.jpg')}
.yn-tbl--cats tbody tr:has(a[href$='/yn8215-bulk-guide.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=170']) th.list-title::before{background-image:url('/images/products/YN8215-D/300yn8215.jpg')}
.yn-tbl--cats tbody tr:has(a[href$='/yn8215x-guide.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=171']) th.list-title::before{background-image:url('/images/products/YN8215-D/300yn8215X.jpg')}
.yn-tbl--cats tbody tr:has(a[href$='/yn8221-guide.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=172']) th.list-title::before{background-image:url('/images/products/YN8221/300.jpg')}
.yn-tbl--cats tbody tr:has(a[href$='/yn8222-guide.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=173']) th.list-title::before{background-image:url('/images/products/YN8222/300.jpg')}
.yn-tbl--cats tbody tr:has(a[href$='/yn9106-guide.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=174']) th.list-title::before{background-image:url('/images/products/YN9106/300.jpg')}
.yn-tbl--cats tbody tr:has(a[href$='/yn8229-guide.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=175']) th.list-title::before{background-image:url('/images/products/YN8229/300-300.jpg')}
.yn-tbl--cats tbody tr:has(a[href$='/yn8122燃油系统清洗剂（强力型）-guide.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=176']) th.list-title::before{background-image:url('/images/products/YN8122/yn8122-300-300.jpg')}
.yn-tbl--cats tbody tr:has(a[href$='/yn8230-guide.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=177']) th.list-title::before{background-image:url('/images/products/yn8230/YN8230-300-300.jpg')}
.yn-tbl--cats tbody tr:has(a[href$='/yn8235-bulk-guide.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=178']) th.list-title::before{background-image:url('/images/products/yn8235/yn8235-300-300.jpg')}
.yn-tbl--cats tbody tr:has(a[href$='/yn8231-guide.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=179']) th.list-title::before{background-image:url('/images/products/yn8231/YN8231-300-300.jpg')}
.yn-tbl--cats tbody tr:has(a[href$='/yn8232-guide.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=180']) th.list-title::before{background-image:url('/images/products/yn8232/YN8232-300-300.jpg')}
.yn-tbl--cats tbody tr:has(a[href$='/yn8218-guide.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=181']) th.list-title::before{background-image:url('/images/products/yn8218/YN8218-300-300.jpg')}
.yn-tbl--cats tbody tr:has(a[href$='/yn6800-guide.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=182']) th.list-title::before{background-image:url('/images/products/YN6800/300-300.jpg')}
.yn-tbl--cats tbody tr:has(a[href$='/yn6801-guide.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=183']) th.list-title::before{background-image:url('/images/products/YN6801/300-300.jpg')}
.yn-tbl--cats tbody tr:has(a[href$='/yn6802-guide.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=184']) th.list-title::before{background-image:url('/images/products/YN6802/300-300.jpg')}
.yn-tbl--cats tbody tr:has(a[href$='/yn跃能-织物清洁剂-yn6805-guide.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=185']) th.list-title::before{background-image:url('/images/products/YN6805/300-300.jpg')}
.yn-tbl--cats tbody tr:has(a[href$='/yn6806-guide.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=186']) th.list-title::before{background-image:url('/images/products/yn6806/yn6806-300-300.jpg')}
.yn-tbl--cats tbody tr:has(a[href$='/yn8237-guide.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=187']) th.list-title::before{background-image:url('/images/products/YN8237/yn8237-300-300.jpg')}
.yn-tbl--cats tbody tr:has(a[href$='/yn8238-guide.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=188']) th.list-title::before{background-image:url('/images/products/yn8238/yn8238-300-300.jpg')}
.yn-tbl--cats tbody tr:has(a[href$='/yn8236-guide.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=189']) th.list-title::before{background-image:url('/images/products/yn8236/yn8236-300-300.jpg')}
.yn-tbl--cats tbody tr:has(a[href$='/yn8242-guide.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=190']) th.list-title::before{background-image:url('/images/products/YN8242/yn8242-300-300.png')}
.yn-tbl--cats tbody tr:has(a[href$='/yn8225-bulk-guide.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=191']) th.list-title::before{background-image:url('/images/products/yn8225/yn8225-300-300.jpg')}
.yn-tbl--cats tbody tr:has(a[href$='/yn8245-guide.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=192']) th.list-title::before{background-image:url('/images/products/YN8245/yn8245-300-300.jpg')}
.yn-tbl--cats tbody tr:has(a[href$='/yn8246-guide.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=193']) th.list-title::before{background-image:url('/images/products/YN8246/yn8246-300-300.jpg')}
.yn-tbl--cats tbody tr:has(a[href$='/yn8239-guide.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=194']) th.list-title::before{background-image:url('/images/products/YN8239/yn8239-300-300.jpg')}
.yn-tbl--cats tbody tr:has(a[href$='/yn8240-guide.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=195']) th.list-title::before{background-image:url('/images/products/YN8240/yn8240-300-300.jpg')}
.yn-tbl--cats tbody tr:has(a[href$='/test.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=199']) th.list-title::before{background-image:url('/images/products/yn8201/2.jpg')}
.yn-tbl--cats tbody tr:has(a[href$='/xcn150.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=200']) th.list-title::before{background-image:url('/images/products/xcn150/2.jpg')}
.yn-tbl--cats tbody tr:has(a[href$='/yn8200.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=201']) th.list-title::before{background-image:url('/images/products/yn8200/2.jpg')}
.yn-tbl--cats tbody tr:has(a[href$='/yn1101.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=202']) th.list-title::before{background-image:url('/images/products/yn1101/2.jpg')}
.yn-tbl--cats tbody tr:has(a[href$='/yn1200.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=203']) th.list-title::before{background-image:url('/images/products/yn1200/2.jpg')}
.yn-tbl--cats tbody tr:has(a[href$='/yn8100.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=204']) th.list-title::before{background-image:url('/images/products/yn8100/2.jpg')}
.yn-tbl--cats tbody tr:has(a[href$='/yn8101.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=205']) th.list-title::before{background-image:url('/images/products/yn8101/2.jpg')}
.yn-tbl--cats tbody tr:has(a[href$='/yn8102.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=206']) th.list-title::before{background-image:url('/images/products/yn8102/2.jpg')}
.yn-tbl--cats tbody tr:has(a[href$='/yn81-3.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=207']) th.list-title::before{background-image:url('/images/products/yn81-3/2.jpg')}
.yn-tbl--cats tbody tr:has(a[href$='/yn8103.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=208']) th.list-title::before{background-image:url('/images/products/yn8103/2.jpg')}
.yn-tbl--cats tbody tr:has(a[href$='/yn100.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=209']) th.list-title::before{background-image:url('/images/products/yn100/2.jpg')}
.yn-tbl--cats tbody tr:has(a[href$='/yn8610.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=210']) th.list-title::before{background-image:url('/images/products/yn8610/300-300.jpg')}
.yn-tbl--cats tbody tr:has(a[href$='/yn8620.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=211']) th.list-title::before{background-image:url('/images/products/yn8620/2.jpg')}
.yn-tbl--cats tbody tr:has(a[href$='/yn8630.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=212']) th.list-title::before{background-image:url('/images/products/yn8630/2.jpg')}
.yn-tbl--cats tbody tr:has(a[href$='/yn2100.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=213']) th.list-title::before{background-image:url('/images/products/yn2100/2.jpg')}
.yn-tbl--cats tbody tr:has(a[href$='/yn30.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=214']) th.list-title::before{background-image:url('/images/products/yn30/2.jpg')}
.yn-tbl--cats tbody tr:has(a[href$='/yn8301.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=215']) th.list-title::before{background-image:url('/images/products/yn8301/2.jpg')}
.yn-tbl--cats tbody tr:has(a[href$='/yn8302.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=216']) th.list-title::before{background-image:url('/images/products/yn8302/2.jpg')}
.yn-tbl--cats tbody tr:has(a[href$='/yn8303.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=217']) th.list-title::before{background-image:url('/images/products/yn8303/2.jpg')}
.yn-tbl--cats tbody tr:has(a[href$='/hm1073.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=218']) th.list-title::before{background-image:url('/images/products/hn1073/2.jpg')}
.yn-tbl--cats tbody tr:has(a[href$='/yn8210.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=219']) th.list-title::before{background-image:url('/images/products/yn8210/2.jpg')}
.yn-tbl--cats tbody tr:has(a[href$='/yn7-2.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=220']) th.list-title::before{background-image:url('/images/products/yn7/2.jpg')}
.yn-tbl--cats tbody tr:has(a[href$='/yn4483.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=221']) th.list-title::before{background-image:url('/images/products/yn4483/2.jpg')}
.yn-tbl--cats tbody tr:has(a[href$='/yn8700.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=222']) th.list-title::before{background-image:url('/images/products/yn8700/2.jpg')}
.yn-tbl--cats tbody tr:has(a[href$='/yn8701.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=223']) th.list-title::before{background-image:url('/images/products/yn8701/2.jpg')}
.yn-tbl--cats tbody tr:has(a[href$='/xcmj-2.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=224']) th.list-title::before{background-image:url('/images/products/xcmj/2.jpg')}
.yn-tbl--cats tbody tr:has(a[href$='/xcn.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=227']) th.list-title::before{background-image:url('/images/products/xcn200/3.jpg')}
.yn-tbl--cats tbody tr:has(a[href$='/yn9103.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=228']) th.list-title::before{background-image:url('/images/products/yn9103/2.jpg')}
.yn-tbl--cats tbody tr:has(a[href$='/yn8600.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=230']) th.list-title::before{background-image:url('/images/products/yn8600/1.jpg')}
.yn-tbl--cats tbody tr:has(a[href$='/yn8203.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=231']) th.list-title::before{background-image:url('/images/products/yn8203/1.jpg')}
.yn-tbl--cats tbody tr:has(a[href$='/yn8205.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=232']) th.list-title::before{background-image:url('/images/products/yn8205/1.jpg')}
.yn-tbl--cats tbody tr:has(a[href$='/yn8206.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=233']) th.list-title::before{background-image:url('/images/products/yn8206/2.jpg')}
.yn-tbl--cats tbody tr:has(a[href$='/yn8207.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=234']) th.list-title::before{background-image:url('/images/products/yn8207/2.jpg')}
.yn-tbl--cats tbody tr:has(a[href$='/ynsq.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=235']) th.list-title::before{background-image:url('/images/products/ynsq/2.jpg')}
.yn-tbl--cats tbody tr:has(a[href$='/yn8202.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=236']) th.list-title::before{background-image:url('/images/products/yn8202/2.jpg')}
.yn-tbl--cats tbody tr:has(a[href$='/yn8208.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=237']) th.list-title::before{background-image:url('/images/products/yn8208/2.png')}
.yn-tbl--cats tbody tr:has(a[href$='/yn8209.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=238']) th.list-title::before{background-image:url('/images/products/yn8209/2.png')}
.yn-tbl--cats tbody tr:has(a[href$='/yn9105.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=239']) th.list-title::before{background-image:url('/images/products/yn9105/2.jpg')}
.yn-tbl--cats tbody tr:has(a[href$='/yn160.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=240']) th.list-title::before{background-image:url('/images/products/YN160/YN160300.jpg')}
.yn-tbl--cats tbody tr:has(a[href$='/yn8216.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=241']) th.list-title::before{background-image:url('/images/products/YN8216/YN8216300.jpg')}
.yn-tbl--cats tbody tr:has(a[href$='/yn8219.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=242']) th.list-title::before{background-image:url('/images/products/YN8219/YN8219300.jpg')}
.yn-tbl--cats tbody tr:has(a[href$='/yn8217.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=243']) th.list-title::before{background-image:url('/images/products/YN8217/YN8217300.jpg')}
.yn-tbl--cats tbody tr:has(a[href$='/yn8220.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=244']) th.list-title::before{background-image:url('/images/products/YN8220/300yn8220.jpg')}
.yn-tbl--cats tbody tr:has(a[href$='/yn8213.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=245']) th.list-title::before{background-image:url('/images/products/YN8213/300.jpg')}
.yn-tbl--cats tbody tr:has(a[href$='/yn8215.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=246']) th.list-title::before{background-image:url('/images/products/YN8215/300.jpg')}
.yn-tbl--cats tbody tr:has(a[href$='/yn8221.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=247']) th.list-title::before{background-image:url('/images/products/YN8221/300.jpg')}
.yn-tbl--cats tbody tr:has(a[href$='/yn8222.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=248']) th.list-title::before{background-image:url('/images/products/YN8222/300.jpg')}
.yn-tbl--cats tbody tr:has(a[href$='/yn9106.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=249']) th.list-title::before{background-image:url('/images/products/YN9106/300.jpg')}
.yn-tbl--cats tbody tr:has(a[href$='/yn8212.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=250']) th.list-title::before{background-image:url('/images/products/yn8212/300.jpg')}
.yn-tbl--cats tbody tr:has(a[href$='/yn8211.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=251']) th.list-title::before{background-image:url('/images/products/yn8211/300-300.jpg')}
.yn-tbl--cats tbody tr:has(a[href$='/yn8229.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=252']) th.list-title::before{background-image:url('/images/products/YN8229/300-300.jpg')}
.yn-tbl--cats tbody tr:has(a[href$='/yn8225.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=253']) th.list-title::before{background-image:url('/images/products/yn8225/yn8225-300-300.jpg')}
.yn-tbl--cats tbody tr:has(a[href$='/yn8122.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=254']) th.list-title::before{background-image:url('/images/products/YN8122/yn8122-300-300.jpg')}
.yn-tbl--cats tbody tr:has(a[href$='/yn8230.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=255']) th.list-title::before{background-image:url('/images/products/yn8230/YN8230-300-300.jpg')}
.yn-tbl--cats tbody tr:has(a[href$='/yn8231.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=257']) th.list-title::before{background-image:url('/images/products/yn8231/YN8231-300-300.jpg')}
.yn-tbl--cats tbody tr:has(a[href$='/yn8232.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=258']) th.list-title::before{background-image:url('/images/products/yn8232/YN8232-300-300.jpg')}
.yn-tbl--cats tbody tr:has(a[href$='/yn8218.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=259']) th.list-title::before{background-image:url('/images/products/yn8218/YN8218-300-300.jpg')}
.yn-tbl--cats tbody tr:has(a[href$='/yn6800.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=260']) th.list-title::before{background-image:url('/images/products/YN6800/300-300.jpg')}
.yn-tbl--cats tbody tr:has(a[href$='/yn6801.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=261']) th.list-title::before{background-image:url('/images/products/YN6801/300-300.jpg')}
.yn-tbl--cats tbody tr:has(a[href$='/yn6802.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=262']) th.list-title::before{background-image:url('/images/products/YN6802/300-300.jpg')}
.yn-tbl--cats tbody tr:has(a[href$='/yn6805.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=263']) th.list-title::before{background-image:url('/images/products/YN6805/300-300.jpg')}
.yn-tbl--cats tbody tr:has(a[href$='/yn6806.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=264']) th.list-title::before{background-image:url('/images/products/yn6806/yn6806-300-300.jpg')}
.yn-tbl--cats tbody tr:has(a[href$='/yn8237.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=265']) th.list-title::before{background-image:url('/images/products/YN8237/yn8237-300-300.jpg')}
.yn-tbl--cats tbody tr:has(a[href$='/yn8238.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=266']) th.list-title::before{background-image:url('/images/products/yn8238/yn8238-300-300.jpg')}
.yn-tbl--cats tbody tr:has(a[href$='/yn8236.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=267']) th.list-title::before{background-image:url('/images/products/yn8236/yn8236-300-300.jpg')}
.yn-tbl--cats tbody tr:has(a[href$='/yn8242.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=268']) th.list-title::before{background-image:url('/images/products/YN8242/yn8242-300-300.png')}
.yn-tbl--cats tbody tr:has(a[href$='/yn8245.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=269']) th.list-title::before{background-image:url('/images/products/YN8245/yn8245-300-300.jpg')}
.yn-tbl--cats tbody tr:has(a[href$='/yn8239.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=270']) th.list-title::before{background-image:url('/images/products/YN8239/yn8239-300-300.jpg')}
.yn-tbl--cats tbody tr:has(a[href$='/yn8240.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=271']) th.list-title::before{background-image:url('/images/products/YN8240/yn8240-300-300.jpg')}
.yn-tbl--cats tbody tr:has(a[href$='/yn8246.html']) th.list-title::before, .yn-tbl--cats tbody tr:has(a[href*='id=272']) th.list-title::before{background-image:url('/images/products/YN8246/yn8246-300-300.jpg')}

/* ============================================================
   跃能官网 V7 · 内页层（产品列表 / 详情 / 关于 / 新闻 / 帮助）
   复用 V6 token（--brand / --ink2 / --warm / --shadow …）
   独立命名空间：yn- 前缀，避免与首页模块样式互相污染
   ============================================================ */

/* ---------- 通用 ---------- */
.yn-wrap{max-width:1170px;margin:0 auto;padding:0 24px}
.yn-crumb{display:flex;flex-wrap:wrap;align-items:center;gap:7px;font-size:13.5px;color:var(--muted);margin-bottom:18px}
.yn-crumb a{color:var(--muted);transition:color .2s}
.yn-crumb a:hover{color:var(--brand-d)}
.yn-crumb span[aria-current]{color:var(--ink2);font-weight:600;max-width:60ch;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* 内容区容器：Helix 组件区默认无背景，统一留白 */
#sp-component{padding:0 0 72px}
#sp-main{background:#fff}

/* 面包屑 + 组件之间的间距 */
.yn-cat,.yn-pdp,.yn-article{background:#fff}

/* ---------- 列表页页头 ---------- */
.yn-cat__head{background:linear-gradient(180deg,#fff 0%,var(--warm) 100%);border-bottom:1px solid var(--line);padding:46px 0 40px}
.yn-cat__title{font-size:clamp(28px,3.6vw,42px);margin:0;letter-spacing:-.03em;color:var(--ink)}
.yn-cat__desc{margin-top:14px;font-size:16px;color:var(--ink2);max-width:62ch}
.yn-cat__desc p{margin:0}
.yn-cat__count{margin-top:14px;font-size:13.5px;color:var(--muted)}
.yn-cat__count b{color:var(--brand-d);font-size:15px}

/* ---------- 分类筛选胶囊 ---------- */
.yn-cat__filter{position:sticky;top:0;z-index:20;background:rgba(255,255,255,.94);backdrop-filter:blur(12px);border-bottom:1px solid var(--line)}
.yn-cat__filter .yn-wrap{display:flex;align-items:center;overflow-x:auto;scrollbar-width:none}
.yn-cat__filter .yn-wrap::-webkit-scrollbar{display:none}
.yn-chips{display:flex;gap:8px;list-style:none;margin:0;padding:12px 0;white-space:nowrap}
.yn-chip{display:inline-flex;align-items:center;min-height:38px;padding:0 16px;border-radius:999px;border:1px solid var(--line);background:#fff;color:var(--ink2);font-size:14px;font-weight:600;transition:border-color .2s,color .2s,background .2s}
.yn-chip:hover{border-color:var(--brand);color:var(--brand-d)}
.yn-chip.is-active{background:var(--brand);border-color:var(--brand);color:#fff}

/* ---------- 产品网格 ---------- */
.yn-cat__body{padding:44px 0 0}
.yn-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:22px}
.yn-grid--news{grid-template-columns:repeat(3,1fr)}

/* ---------- 产品卡 ---------- */
.yn-pcard{display:flex;flex-direction:column;background:#fff;border:1px solid var(--line);border-radius:12px;overflow:hidden;box-shadow:0 2px 10px -6px rgba(22,26,29,.16);transition:transform .28s var(--ease),box-shadow .28s var(--ease),border-color .28s}
.yn-pcard:hover{transform:translateY(-5px);box-shadow:var(--shadow-lg);border-color:transparent}
.yn-pcard__media{position:relative;display:block;aspect-ratio:1/1;background:#fff;overflow:hidden;border-bottom:1px solid var(--line)}
.yn-pcard__media img{width:100%;height:100%;object-fit:contain;padding:14px;transition:transform .4s var(--ease);background:#fff}
.yn-pcard:hover .yn-pcard__media img{transform:scale(1.04)}
.yn-pcard__ph{position:absolute;inset:0;display:grid;place-items:center;background:linear-gradient(160deg,#F4F8FA,#E7F1F5)}
.yn-pcard__ph span{font-size:22px;font-weight:800;letter-spacing:.04em;color:#9DB4BF}
.yn-pcard__body{display:flex;flex-direction:column;flex:1;padding:20px 20px 22px}
.yn-pcard__model{align-self:flex-start;font-size:12px;font-weight:800;letter-spacing:.06em;color:var(--brand-d);background:var(--brand-l);border-radius:6px;padding:5px 9px}
.yn-pcard__title{font-size:16.5px;line-height:1.45;margin:12px 0 0;font-weight:700;letter-spacing:-.01em}
.yn-pcard__title a{color:var(--ink);transition:color .2s}
.yn-pcard__title a:hover{color:var(--brand-d)}
.yn-pcard__desc{margin-top:10px;font-size:13.8px;line-height:1.65;color:var(--ink2);display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.yn-pcard__more{margin-top:auto;padding-top:16px;font-size:13.5px;font-weight:700;color:var(--brand-d);display:inline-flex;align-items:center;gap:7px}
.yn-pcard__more svg{transition:transform .25s var(--ease)}
.yn-pcard:hover .yn-pcard__more svg{transform:translateX(4px)}

/* 新闻卡：无图时更紧凑 */
.yn-pcard--news .yn-pcard__media{aspect-ratio:16/10}

/* ---------- 分页 ---------- */
.yn-pager{margin-top:44px;display:flex;justify-content:center}
.yn-pager .pagination{margin:0;display:flex;flex-wrap:wrap;gap:6px;list-style:none;padding:0}
.yn-pager .page-link{display:inline-flex;align-items:center;justify-content:center;min-width:40px;height:40px;padding:0 12px;border-radius:9px;border:1px solid var(--line);color:var(--ink2);font-size:14px;font-weight:600;background:#fff;transition:border-color .2s,color .2s,background .2s}
.yn-pager .page-link:hover{border-color:var(--brand);color:var(--brand-d)}
.yn-pager .page-item.active .page-link{background:var(--brand);border-color:var(--brand);color:#fff}
.yn-pager .page-item.disabled .page-link{color:#B7C0C6;background:#FAFBFC}

.yn-empty{padding:64px 0;text-align:center;color:var(--muted)}

/* ---------- 产品详情 ---------- */
.yn-pdp{padding-top:40px}
.yn-pdp__top{display:grid;grid-template-columns:1.02fr .98fr;gap:52px;align-items:start;padding-bottom:56px}
.yn-pdp__gallery{position:sticky;top:96px}
.yn-pdp__main{position:relative;aspect-ratio:1/1;border:1px solid var(--line);border-radius:16px;background:linear-gradient(160deg,#fff,#F7FAFB);display:grid;place-items:center;overflow:hidden}
.yn-pdp__main img{width:100%;height:100%;object-fit:contain;padding:26px}
.yn-pdp__ph{position:absolute;inset:0;display:grid;place-items:center;background:linear-gradient(160deg,#F4F8FA,#E7F1F5)}
.yn-pdp__ph span{font-size:38px;font-weight:800;letter-spacing:.04em;color:#9DB4BF}
.yn-pdp__thumbs{display:flex;gap:10px;margin-top:12px;flex-wrap:wrap}
.yn-thumb{width:74px;height:74px;padding:6px;border:1px solid var(--line);border-radius:10px;background:#fff;cursor:pointer;transition:border-color .2s,box-shadow .2s}
.yn-thumb img{width:100%;height:100%;object-fit:contain;display:block}
.yn-thumb:hover{border-color:var(--brand)}
.yn-thumb.is-active{border-color:var(--brand);box-shadow:0 0 0 2px rgba(0,165,221,.18)}

.yn-pdp__model{display:inline-block;font-size:12.5px;font-weight:800;letter-spacing:.08em;color:var(--brand-d);background:var(--brand-l);border-radius:7px;padding:7px 12px}
.yn-pdp__title{font-size:clamp(26px,3.1vw,38px);margin:16px 0 0;letter-spacing:-.03em;line-height:1.22}
.yn-pdp__lead{margin-top:16px;font-size:16px;color:var(--ink2);line-height:1.75}
.yn-pdp__lead p{margin:0 0 8px}
.yn-pdp__lead img, .yn-pdp__lead video{max-width:100%;height:auto;border-radius:10px}
.yn-pdp__specs{margin:26px 0 0;border-top:1px solid var(--line)}
.yn-pdp__specs>div{display:grid;grid-template-columns:110px 1fr;gap:16px;padding:13px 0;border-bottom:1px solid var(--line)}
.yn-pdp__specs dt{font-size:13.5px;color:var(--muted);font-weight:600;margin:0}
.yn-pdp__specs dd{margin:0;font-size:14.5px;color:var(--ink);line-height:1.65}
.yn-pdp__cta{display:flex;gap:12px;margin-top:30px;flex-wrap:wrap}
.yn-pdp__note{margin-top:16px;font-size:13px;color:var(--muted)}

.yn-pdp__sections{display:grid;gap:18px;padding-bottom:20px}
.yn-pdp__sec{background:var(--warm);border:1px solid var(--line);border-radius:14px;padding:34px 36px}
.yn-pdp__sec h2{font-size:22px;margin:0 0 16px;letter-spacing:-.02em;position:relative;padding-left:16px}
.yn-pdp__sec h2::before{content:"";position:absolute;left:0;top:.32em;width:5px;height:1em;border-radius:3px;background:var(--brand)}
.yn-pdp__video{width:100%;max-width:860px;border-radius:12px;background:#000}

/* ---------- 富文本（yn-prose） ---------- */
.yn-prose{font-size:16px;line-height:1.85;color:var(--ink2)}
.yn-prose p{margin:0 0 14px}
.yn-prose ul,.yn-prose ol{margin:0 0 16px;padding-left:22px}
.yn-prose li{margin-bottom:8px}
.yn-prose img,.yn-prose video{max-width:100%;height:auto;border-radius:10px;margin:10px 0}
.yn-prose h2,.yn-prose h3{margin:26px 0 12px;color:var(--ink);letter-spacing:-.02em;line-height:1.3}
.yn-prose h2{font-size:24px}
.yn-prose h3{font-size:19px}
.yn-prose a{color:var(--brand-d);text-decoration:underline;text-underline-offset:3px}
.yn-prose blockquote{margin:18px 0;padding:14px 20px;border-left:3px solid var(--brand);background:#fff;border-radius:0 10px 10px 0;color:var(--ink2)}
.yn-prose table{width:100%;border-collapse:collapse;margin:16px 0;font-size:14.5px}
.yn-prose th,.yn-prose td{border:1px solid var(--line);padding:10px 12px;text-align:left}
.yn-prose th{background:#fff;font-weight:700;color:var(--ink)}
.yn-prose code{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.92em;background:#fff;border:1px solid var(--line);border-radius:5px;padding:1px 6px;color:var(--ink)}

/* FAQ：把 div/section 里的“问: / 答:”排成问答样式 */
.yn-prose--faq section,.yn-prose--faq>div{margin-bottom:12px;background:#fff;border:1px solid var(--line);border-radius:10px;padding:14px 18px}
.yn-prose--faq code{background:none;border:0;padding:0;font-family:inherit;font-size:inherit;font-weight:700;color:var(--ink)}

/* ---------- 通用文章页 ---------- */
.yn-article{padding-top:40px}
.yn-article__head{background:var(--warm);border-bottom:1px solid var(--line);padding:38px 0 34px;margin-bottom:36px}
.yn-article__head.has-img{background:linear-gradient(180deg,#fff,var(--warm))}
.yn-article__date{display:inline-block;font-size:13px;font-weight:700;color:var(--brand-d);letter-spacing:.04em;margin-bottom:10px}
.yn-article__title{font-size:clamp(26px,3.2vw,38px);margin:0;letter-spacing:-.03em;line-height:1.25;max-width:24ch}
.yn-article__body{max-width:820px;margin:0 auto;padding-bottom:20px}
.yn-article__cover{margin:0 0 28px}
.yn-article__cover img{width:100%;height:auto;border-radius:14px;display:block}
.yn-article__foot{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-top:44px;padding-top:26px;border-top:1px solid var(--line)}

/* 文章页里 Helix 残留块（作者信息 / 评论 / 社交分享）收敛 */
.yn-article .author-info,.yn-article .article-author{display:none}

/* 组件区内的旧样式兜底（info block、fields 列表不再直接露出） */
#sp-component .fields-container{list-style:none;padding:0;margin:0}
#sp-component .field-entry .field-label-nickname{display:block;font-size:12px;font-weight:700;color:var(--brand-d);margin-bottom:4px}

/* ---------- 响应式 ---------- */
@media (max-width:1024px){
  .yn-grid{grid-template-columns:repeat(3,1fr);gap:18px}
  .yn-grid--news{grid-template-columns:repeat(2,1fr)}
  .yn-pdp__top{grid-template-columns:1fr;gap:34px}
  .yn-pdp__gallery{position:static}
  .yn-pdp__main{aspect-ratio:4/3;max-height:520px}
}
@media (max-width:820px){
  .yn-cat__head{padding:34px 0 30px}
  .yn-grid{grid-template-columns:repeat(2,1fr)}
  .yn-pdp__sec{padding:26px 22px}
  .yn-article__body{padding:0 24px}
}
@media (max-width:640px){
  .yn-wrap{padding:0 20px}
  .yn-grid,.yn-grid--news{grid-template-columns:1fr 1fr;gap:12px}
  .yn-pcard__body{padding:14px 14px 16px}
  .yn-pcard__title{font-size:14.5px;margin-top:9px}
  .yn-pcard__desc{-webkit-line-clamp:2;font-size:13px}
  .yn-pcard__more{font-size:12.5px;padding-top:12px}
  .yn-pcard__media img{padding:10px}
  .yn-pdp{padding-top:24px}
  .yn-pdp__cta .btn{flex:1}
  .yn-article__title{max-width:none}
  .yn-article__foot .btn{flex:1}
}
@media (max-width:400px){
  .yn-grid,.yn-grid--news{grid-template-columns:1fr}
}

@media (prefers-reduced-motion: reduce){
  .yn-pcard,.yn-pcard__media img,.yn-chip,.yn-pager .page-link{transition:none !important}
}
/* ============================================================
   V7.1 · 暖白专业（方向 B）· 产品卡与详情页层级重做
   目标：拉开"图 / 型号 / 名称 / 卖点 / 动作"的视觉权重，
        用暖白底 + 克制的品牌蓝，做出源头工厂的信任感。
   ============================================================ */

/* ---------- 分类页：页头收得更像一个"栏目刊头" ---------- */
.yn-cat__head{
  background:linear-gradient(180deg,#FBFAF6 0%,var(--warm) 100%);
  border-bottom:1px solid var(--line);
  padding:54px 0 46px;
}
.yn-cat__head .yn-crumb{margin-bottom:22px}
.yn-cat__title{
  font-size:clamp(30px,3.8vw,46px);
  font-weight:800;
  letter-spacing:-.035em;
  line-height:1.12;
}
.yn-cat__desc{
  margin-top:16px;
  font-size:16.5px;
  line-height:1.75;
  color:var(--ink2);
  max-width:56ch;
}
.yn-cat__count{
  margin-top:20px;
  display:inline-flex;
  align-items:center;
  gap:8px;
  font-size:13px;
  color:var(--muted);
  padding:6px 14px;
  border:1px solid var(--line);
  border-radius:999px;
  background:#fff;
}
.yn-cat__count b{color:var(--link);font-size:14px;font-weight:800}

/* ---------- 分类胶囊：更轻、更"标签感" ---------- */
.yn-cat__filter{background:rgba(251,250,246,.92);border-bottom:1px solid var(--line)}
.yn-chip{
  min-height:36px;
  padding:0 15px;
  font-size:13.5px;
  font-weight:600;
  border-color:#E0E5DA;
  background:transparent;
  color:var(--ink2);
}
.yn-chip:hover{border-color:var(--brand);background:#fff;color:var(--link)}
.yn-chip.is-active{background:var(--ink);border-color:var(--ink);color:#fff}
.yn-chip.is-active:hover{background:var(--ink);color:#fff}

/* ---------- 卡片网格：产品图更大，间距更松 ---------- */
.yn-cat__body{padding:52px 0 0;background:#fff}
.yn-grid{gap:26px}   /* 列数交给基线响应式规则，勿在此写死 */

/* ---------- 产品卡 B 版 ---------- */
.yn-pcard{
  border:1px solid #E8EBE4;
  border-radius:14px;
  background:#fff;
  box-shadow:none;
  transition:transform .3s var(--ease),box-shadow .3s var(--ease),border-color .3s;
}
.yn-pcard:hover{
  transform:translateY(-6px);
  border-color:#D6DCCF;
  box-shadow:0 18px 38px -18px rgba(22,26,29,.32);
}

/* 图片区：暖灰底 + 内缩产品图，像"展厅台面" */
.yn-pcard__media{
  aspect-ratio:1/1;
  background:linear-gradient(165deg,#FCFCFA 0%,#F3F5EE 100%);
  border-bottom:1px solid #EDF0E8;
}
.yn-pcard__media img{
  padding:22px;
  object-fit:contain;
  transition:transform .45s var(--ease);
}
.yn-pcard:hover .yn-pcard__media img{transform:scale(1.055)}
.yn-pcard__ph{background:linear-gradient(165deg,#FCFCFA,#F1F4EC)}
.yn-pcard__ph span{color:#C3CCC6;font-size:19px;letter-spacing:.08em}

.yn-pcard__body{padding:22px 22px 24px}

/* 型号：去掉色块，改成"字距感"的编号 */
.yn-pcard__model{
  background:none;
  padding:0;
  border-radius:0;
  font-size:11.5px;
  font-weight:800;
  letter-spacing:.13em;
  color:var(--link);
  text-transform:uppercase;
}

/* 名称：两行封顶，字重更沉 */
.yn-pcard__title{
  margin-top:10px;
  font-size:17px;
  font-weight:800;
  line-height:1.45;
  letter-spacing:-.015em;
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden;
  min-height:calc(1.45em * 2);
}

/* 卖点：三行，行高放宽，颜色压一档 */
.yn-pcard__desc{
  margin-top:12px;
  font-size:13.5px;
  line-height:1.72;
  color:#5D676F;
  -webkit-line-clamp:3;
}

/* 动作：细分割线 + 箭头右移 */
.yn-pcard__more{
  margin-top:18px;
  padding-top:15px;
  border-top:1px solid #EFF2EA;
  font-size:13px;
  font-weight:700;
  letter-spacing:.01em;
}

/* ---------- 详情页：主图与参数的分层 ---------- */
.yn-pdp{padding-top:36px}
.yn-pdp__top{gap:56px;padding-bottom:64px}
.yn-pdp__main{
  background:linear-gradient(165deg,#FCFCFA 0%,#F2F5ED 100%);
  border-color:#E8EBE4;
  border-radius:18px;
}
.yn-pdp__main img{padding:34px}
.yn-pdp__thumbs{margin-top:14px;gap:11px}
.yn-thumb{
  width:78px;height:78px;
  border-radius:11px;
  background:linear-gradient(165deg,#FCFCFA,#F3F5EE);
  border-color:#E8EBE4;
}
.yn-thumb.is-active{border-color:var(--ink);box-shadow:none}

.yn-pdp__model{
  background:none;padding:0;border-radius:0;
  font-size:12px;font-weight:800;letter-spacing:.14em;
  color:var(--link);text-transform:uppercase;
}
.yn-pdp__title{
  margin-top:14px;
  font-size:clamp(23px,2.5vw,31px);
  line-height:1.22;
  letter-spacing:-.035em;
}
.yn-pdp__lead{
  margin-top:18px;
  padding-left:16px;
  border-left:3px solid var(--brand);
  font-size:15.5px;
  line-height:1.8;
  color:var(--ink2);
}

/* 规格：去表格感，做成"参数对" —— 标签小字、值加粗 */
.yn-pdp__specs{
  margin-top:28px;
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
}
.yn-pdp__specs>div{
  grid-template-columns:96px 1fr;
  gap:18px;
  padding:14px 2px;
  border-bottom:1px solid #F0F2EB;
}
.yn-pdp__specs>div:last-child{border-bottom:0}
.yn-pdp__specs dt{font-size:12.5px;color:#8A939B;letter-spacing:.02em;font-weight:600}
.yn-pdp__specs dd{font-size:14.5px;color:var(--ink);font-weight:600;line-height:1.6}

.yn-pdp__cta{margin-top:32px;gap:12px}
.yn-pdp__cta .btn{min-height:50px}
.yn-pdp__note{margin-top:18px;font-size:12.5px;color:#8A939B;letter-spacing:.01em}

/* 分段内容：暖白卡 + 更清楚的标题 */
.yn-pdp__sections{gap:20px}
.yn-pdp__sec{background:#FBFAF6;border-color:#E8EBE4;border-radius:16px;padding:36px 38px}
.yn-pdp__sec h2{font-size:20px;margin-bottom:18px;padding-left:14px}
.yn-pdp__sec h2::before{width:4px;background:var(--brand);border-radius:2px}
.yn-pdp__sec .yn-prose{font-size:15.5px;line-height:1.85;color:#4E585F}

/* ---------- 响应式微调 ---------- */
@media(max-width:1024px){
  .yn-grid{grid-template-columns:repeat(3,1fr)!important;gap:20px}
  .yn-cat__head{padding:40px 0 34px}
  .yn-pdp__top{gap:36px}
}
@media(max-width:820px){
  .yn-grid{grid-template-columns:repeat(2,1fr)!important}
  .yn-pcard__body{padding:18px 18px 20px}
  .yn-pcard__title{font-size:16px;min-height:0}
  .yn-pdp__sec{padding:28px 24px}
}
@media(max-width:640px){
  .yn-grid,.yn-grid--news{grid-template-columns:repeat(2,1fr)!important;gap:14px}
  .yn-pcard{border-radius:12px}
  .yn-pcard__media img{padding:14px}
  .yn-pcard__body{padding:15px 15px 17px}
  .yn-pcard__model{font-size:10.5px;letter-spacing:.1em}
  .yn-pcard__title{font-size:14.5px;margin-top:8px}
  .yn-pcard__desc{font-size:12.8px;margin-top:9px;-webkit-line-clamp:2}
  .yn-pcard__more{margin-top:13px;padding-top:12px;font-size:12px}
  .yn-pdp__lead{padding-left:12px;font-size:15px}
  .yn-pdp__specs>div{grid-template-columns:84px 1fr;gap:12px}
}

@media (prefers-reduced-motion: reduce){
  .yn-pcard,.yn-pcard__media img{transition:none!important}
}


/* ---------- V7.6 · 详情页移动端加固（4/3 图 + 单列，防止被其他栅格规则挤压）---------- */
@media(max-width:1024px){
  .yn-pdp__top{grid-template-columns:1fr!important;gap:34px}
  .yn-pdp__gallery{position:static!important;width:100%}
  .yn-pdp__main{aspect-ratio:4/3!important;max-height:none!important;width:100%}
  .yn-pdp__main img{padding:18px!important}
  .yn-pdp__info{width:100%}
}
@media(max-width:820px){
  .yn-pdp__main{aspect-ratio:4/3!important}
  .yn-pdp__title{font-size:clamp(21px,5.6vw,26px)!important;line-height:1.32!important}
  .yn-pdp__lead{font-size:14.6px!important;line-height:1.72!important}
  .yn-pdp__specs>div{grid-template-columns:82px minmax(0,1fr)!important}
}
@media(max-width:640px){
  .yn-pdp{padding-top:18px!important}
  .yn-pdp__top{padding-bottom:28px!important;gap:22px!important}
  .yn-pdp__main{border-radius:12px!important}
  .yn-pdp__main img{padding:12px!important}
  .yn-pdp__thumbs{gap:8px!important;margin-top:10px!important}
  .yn-thumb{width:62px!important;height:62px!important}
  .yn-pdp__model{font-size:10.5px!important;letter-spacing:.12em!important}
  .yn-pdp__title{margin-top:10px!important}
  .yn-pdp__lead{margin-top:12px!important;padding-left:10px!important;border-left-width:2px!important}
  .yn-pdp__specs>div{padding:11px 0!important;gap:10px!important}
  .yn-pdp__specs dt{font-size:11.5px!important}
  .yn-pdp__specs dd{font-size:13.5px!important;line-height:1.6!important}
  .yn-pdp__cta{margin-top:20px!important;gap:10px!important}
  .yn-pdp__cta .btn{min-height:46px!important;font-size:14px!important}
  .yn-pdp__note{font-size:11.5px!important;margin-top:12px!important}
  .yn-pdp__sections{gap:12px!important}
  .yn-pdp__sec{padding:22px 16px!important;border-radius:12px!important}
  .yn-pdp__sec h2{font-size:17px!important;margin-bottom:12px!important;padding-left:12px!important}
  .yn-pdp__sec .yn-prose{font-size:14.5px!important;line-height:1.78!important}
  .yn-prose img{border-radius:8px!important;margin:8px 0!important}
}
/* ============================================================
   V7.2 · 联系我们（原生 com_contact 结构重排为暖白专业版）
   不依赖模板覆盖，只用 CSS 把原生 DOM 重新编排。
   ============================================================ */

/* ---------- 页面容器 ---------- */
.view-contact #sp-component{
  padding:0 0 80px;
  background:#fff;
}
.view-contact .com-contact{
  max-width:1170px;
  margin:0 auto;
  padding:0 24px;
}

/* ---------- 页头：标题 + 说明 ---------- */
.view-contact .com-contact > .page-header{
  background:linear-gradient(180deg,#FBFAF6 0%,var(--warm) 100%);
  border-bottom:1px solid var(--line);
  margin:0 -24px 44px;
  padding:52px 24px 44px;
}
.view-contact .com-contact > .page-header h1{
  font-size:clamp(30px,3.8vw,44px);
  font-weight:800;
  letter-spacing:-.035em;
  line-height:1.14;
  margin:0;
  max-width:1170px;
}
.view-contact .com-contact > .page-header .contact-name{
  display:block;
}
/* 标题下自动补一句引导语 */
.view-contact .com-contact > .page-header h1::after{
  content:"源头工厂 · 支持 OEM / ODM 贴牌与批量供货，欢迎来电或留言。";
  display:block;
  margin-top:16px;
  font-size:16px;
  font-weight:400;
  line-height:1.7;
  letter-spacing:0;
  color:var(--ink2);
  max-width:52ch;
}

/* ---------- 「联系人」小标题改造 ---------- */
.view-contact .com-contact > .row > h2,
.view-contact .com-contact > h2{
  font-size:13px;
  font-weight:800;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--link);
  margin:0 0 20px;
}

/* ---------- 联系信息：卡片化 ---------- */
.view-contact .com-contact > .row{
  display:block;
  margin:0 0 48px;
}
.view-contact .com-contact > .row > .col{
  width:100%;
  max-width:none;
}
.view-contact .contact-info{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:16px;
}

/* 每一个 d-flex 条目 -> 信息卡 */
.view-contact .contact-info > div{
  display:flex;
  align-items:flex-start;
  gap:14px;
  background:#FBFAF6;
  border:1px solid var(--line);
  border-radius:14px;
  padding:20px 22px;
  margin:0 !important;
  transition:border-color .25s var(--ease),box-shadow .25s var(--ease);
}
.view-contact .contact-info > div:hover{
  border-color:#DDE3D6;
  box-shadow:0 12px 26px -18px rgba(22,26,29,.3);
}

/* 图标圆底 */
.view-contact .contact-info > div > .me-2{
  flex:0 0 auto;
  width:38px;
  height:38px;
  border-radius:10px;
  background:var(--brand-l);
  color:var(--link);
  display:grid;
  place-items:center;
  font-size:15px;
}
.view-contact .contact-info > div > .me-2 > span:not(.visually-hidden){
  line-height:1;
}

/* 文字区 */
.view-contact .contact-info > div > div:last-child{
  min-width:0;
  font-size:14.5px;
  line-height:1.6;
  color:var(--ink);
  font-weight:600;
  word-break:break-word;
}
.view-contact .contact-info > div > div:last-child a{
  color:var(--link);
}
.view-contact .contact-info > div > div:last-child a:hover{
  text-decoration:underline;
  text-underline-offset:3px;
}

/* 地址多行（街道/省/邮编/国家）合成一块 */
.view-contact .contact-address > .d-flex > div:last-child{
  display:flex;
  flex-direction:column;
  gap:2px;
}
.view-contact .contact-address .contact-street{font-weight:700;}
.view-contact .contact-suburb,
.view-contact .contact-postcode,
.view-contact .contact-country{
  font-size:13px;
  font-weight:500;
  color:var(--muted);
}

/* ---------- 表单区 ---------- */
.view-contact .com-contact > h2 + .contact-form,
.view-contact .contact-form{
  margin-top:8px;
}
.view-contact .contact-form form{
  background:#FBFAF6;
  border:1px solid var(--line);
  border-radius:16px;
  padding:34px 36px 30px;
  margin:0;
}
.view-contact .contact-form fieldset{
  border:0;
  padding:0;
  margin:0;
}
.view-contact .contact-form legend{
  font-size:13px;
  font-weight:800;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:var(--link);
  margin-bottom:18px;
}
.view-contact .contact-form .control-group{
  margin-bottom:18px;
}
.view-contact .contact-form .control-label{
  display:block;
  font-size:13px;
  font-weight:700;
  color:var(--ink2);
  margin-bottom:7px;
}
.view-contact .contact-form .control-label .star,
.view-contact .contact-form .control-label .required{
  color:#C0392B;
}
.view-contact .contact-form .form-control,
.view-contact .contact-form input[type="text"],
.view-contact .contact-form input[type="email"],
.view-contact .contact-form input[type="tel"],
.view-contact .contact-form textarea,
.view-contact .contact-form select{
  width:100%;
  max-width:none;
  min-height:48px;
  padding:11px 14px;
  font-size:14.5px;
  color:var(--ink);
  background:#fff;
  border:1px solid #E0E5DA;
  border-radius:10px;
  transition:border-color .2s,box-shadow .2s;
}
.view-contact .contact-form textarea{
  min-height:140px;
  resize:vertical;
  line-height:1.7;
}
.view-contact .contact-form .form-control:focus,
.view-contact .contact-form input:focus,
.view-contact .contact-form textarea:focus{
  outline:none;
  border-color:var(--brand);
  box-shadow:0 0 0 3px rgba(0,165,221,.14);
}
.view-contact .contact-form .form-check{
  display:flex;
  align-items:center;
  gap:9px;
  font-size:14px;
  color:var(--ink2);
}

/* 提交按钮 */
.view-contact .contact-form .controls{
  margin-top:26px;
}
.view-contact .contact-form button.validate{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:50px;
  padding:0 30px;
  font-size:15px;
  font-weight:700;
  color:#fff;
  background:var(--brand);
  border:0;
  border-radius:10px;
  cursor:pointer;
  transition:background .22s,transform .22s,box-shadow .22s;
}
.view-contact .contact-form button.validate:hover{
  background:var(--brand-d);
  transform:translateY(-2px);
  box-shadow:0 14px 26px -14px rgba(0,165,221,.8);
}
.view-contact .contact-form button.validate:focus-visible{
  outline:2px solid var(--brand);
  outline-offset:3px;
}

/* ---------- 响应式 ---------- */
@media(max-width:1024px){
  .view-contact .contact-info{grid-template-columns:repeat(2,1fr);}
}
@media(max-width:820px){
  .view-contact .com-contact > .page-header{padding:38px 24px 32px;}
  .view-contact .contact-form form{padding:26px 22px 22px;}
}
@media(max-width:640px){
  .view-contact .com-contact{padding:0 20px;}
  .view-contact .com-contact > .page-header{margin:0 -20px 32px;padding:32px 20px 28px;}
  .view-contact .contact-info{grid-template-columns:1fr;gap:12px;}
  .view-contact .contact-info > div{padding:16px 18px;}
  .view-contact .contact-form form{padding:22px 18px 18px;border-radius:14px;}
  .view-contact .contact-form button.validate{width:100%;}
}

@media (prefers-reduced-motion: reduce){
  .view-contact .contact-info > div,
  .view-contact .contact-form button.validate{transition:none!important;}
}


/* ---------- 工厂位置地图（联系页底部）---------- */
.yn-contact__map{
  margin-top:56px;
  background:#FBFAF6;
  border-top:1px solid var(--line);
  padding:44px 0 56px;
}
.yn-contact__maphead{
  display:flex;
  align-items:baseline;
  justify-content:space-between;
  gap:16px;
  flex-wrap:wrap;
  margin-bottom:18px;
}
.yn-contact__maphead h2{margin:0}
.yn-contact__maplink{
  display:inline-flex;
  align-items:center;
  gap:7px;
  font-size:13.5px;
  font-weight:700;
  color:var(--link);
}
.yn-contact__maplink svg{transition:transform .25s var(--ease)}
.yn-contact__maplink:hover svg{transform:translateX(4px)}
.yn-contact__mapbox{
  position:relative;
  width:100%;
  aspect-ratio:16/9;
  border:1px solid var(--line);
  border-radius:14px;
  overflow:hidden;
  background:#EEF2E9;
}
.yn-contact__mapbox iframe{
  display:block;
  width:100% !important;
  height:100% !important;
  max-width:100%;
  border:0;
}

@media(max-width:820px){
  .yn-contact__map{margin-top:40px;padding:32px 0 40px}
  .yn-contact__mapbox{aspect-ratio:4/3;border-radius:12px}
}
@media(max-width:640px){
  .yn-contact__map{margin-top:32px;padding:26px 0 34px}
  .yn-contact__maphead{margin-bottom:14px}
  .yn-contact__mapbox{aspect-ratio:1/1}
}
/* ============================================================
   V7.3 · 联系我们（移动端修复：信息卡单列 + 图标与文字对齐）
   覆盖在 v7-contact.css 之后，专门修 640px 以下布局
   ============================================================ */

/* 手机上：信息卡一律单列、横向排布，图标固定在左上 */
@media (max-width: 640px){
  .view-contact #sp-component{padding-bottom:56px;}
  .view-contact .com-contact{padding:0 18px;}

  .view-contact .contact-info{
    display:flex !important;
    flex-direction:column;
    gap:12px;
  }

  /* 每条信息卡：图标 36px + 文字自适应，禁止被挤成竖条 */
  .view-contact .contact-info > div{
    display:grid !important;
    grid-template-columns:36px minmax(0,1fr);
    align-items:start;
    gap:12px;
    padding:15px 16px;
    width:100%;
    box-sizing:border-box;
  }

  .view-contact .contact-info > div > .me-2{
    width:36px !important;
    height:36px !important;
    margin:0 !important;
    flex:0 0 36px;
  }

  .view-contact .contact-info > div > div:last-child{
    min-width:0;
    width:auto;
    word-break:break-word;
    overflow-wrap:anywhere;
    font-size:14px;
    line-height:1.62;
  }

  /* 地址块内部：街道换行，省市邮编合并成一行浅灰 */
  .view-contact .contact-address > .d-flex > div:last-child{
    display:block;
  }
  .view-contact .contact-street{
    display:block;
    font-weight:700;
    margin-bottom:3px;
  }
  .view-contact .contact-suburb,
  .view-contact .contact-postcode,
  .view-contact .contact-country{
    display:inline;
    font-size:12.5px;
    color:var(--muted);
  }
  .view-contact .contact-suburb::after,
  .view-contact .contact-postcode::after{content:" ";}

  /* 电话/邮箱：允许折行但不撑破卡片 */
  .view-contact .contact-telephone,
  .view-contact .contact-emailto,
  .view-contact .contact-webpage{
    overflow-wrap:anywhere;
  }

  /* 表单在手机上的间距 */
  .view-contact .contact-form form{padding:20px 16px 18px;}
  .view-contact .contact-form .control-group{margin-bottom:15px;}
  .view-contact .contact-form .form-control,
  .view-contact .contact-form input,
  .view-contact .contact-form textarea{
    font-size:16px; /* 防止 iOS 聚焦自动放大 */
  }
}

/* 极窄屏（≤400px）进一步压缩 */
@media (max-width: 400px){
  .view-contact .com-contact{padding:0 14px;}
  .view-contact .contact-info > div{
    grid-template-columns:32px minmax(0,1fr);
    gap:10px;
    padding:13px 14px;
  }
  .view-contact .contact-info > div > .me-2{
    width:32px !important;
    height:32px !important;
  }
}
/* ============================================================
   V7.4 · 帮助中心首页（只保留搜索 + 占位模块，不展示产品列表）
   扫码用户直达，不需要长列表。
   ============================================================ */

/* 隐藏原生卡片网格与分页（仅帮助中心：itemid-174）*/
body.view-category.itemid-174 .yn-cat--help .yn-grid,
body.view-category.itemid-174 .yn-cat--help .yn-pager,
body.view-category.itemid-174 .yn-cat--help .yn-cat__count{display:none !important;}

/* 页头：居中、留白更大 */
body.view-category.itemid-174 .yn-cat--help .yn-cat__head{
  text-align:center;
  padding:64px 0 40px;
  background:linear-gradient(180deg,#FBFAF6 0%,var(--warm) 100%);
}
body.view-category.itemid-174 .yn-cat--help .yn-crumb{
  justify-content:center;
  margin-bottom:18px;
}
body.view-category.itemid-174 .yn-cat--help .yn-cat__title{
  font-size:clamp(28px,3.4vw,40px);
  margin:0 auto;
}
body.view-category.itemid-174 .yn-cat--help .yn-cat__desc{
  margin:14px auto 0;
  max-width:44ch;
  text-align:center;
  font-size:15.5px;
}

/* 搜索区 */
body.view-category.itemid-174 .yn-help{
  max-width:720px;
  margin:0 auto;
  padding:0 24px 72px;
}
body.view-category.itemid-174 .yn-help__searchBox{
  position:relative;
  margin-top:-6px;
}
body.view-category.itemid-174 .yn-help__form{
  display:flex;
  gap:10px;
  align-items:stretch;
}
body.view-category.itemid-174 .yn-help__inputWrap{
  position:relative;
  flex:1;
  min-width:0;
}
body.view-category.itemid-174 .yn-help__input{
  width:100%;
  height:52px;
  padding:0 14px 0 44px;
  font-size:15.5px;
  line-height:52px;
  color:var(--ink);
  background:#fff;
  border:1px solid #DDE3D6;
  border-radius:10px;
  transition:border-color .2s,box-shadow .2s;
  -webkit-appearance:none;
}
body.view-category.itemid-174 .yn-help__input::placeholder{color:#9AA4AC;}
body.view-category.itemid-174 .yn-help__input:focus{
  outline:none;
  border-color:var(--brand);
  box-shadow:0 0 0 4px rgba(0,165,221,.14);
}
body.view-category.itemid-174 .yn-help__icon{
  position:absolute;
  left:15px;
  top:50%;
  transform:translateY(-50%);
  color:#9AA4AC;
  pointer-events:none;
  display:flex;
}
body.view-category.itemid-174 .yn-help__btn{
  height:52px;
  padding:0 26px;
  border-radius:10px;
  font-size:15px;
  font-weight:700;
  color:#fff;
  background:#0A7FA8;
  border:0;
  border-radius:12px;
  cursor:pointer;
  white-space:nowrap;
  transition:background .2s,transform .2s;
}
body.view-category.itemid-174 .yn-help__btn:hover{background:#085F7E;transform:translateY(-1px);}
body.view-category.itemid-174 .yn-help__hint{
  margin-top:14px;
  font-size:13px;
  color:var(--muted);
  text-align:center;
}
body.view-category.itemid-174 .yn-help__hint b{color:var(--ink2);}

/* 候选下拉 */
body.view-category.itemid-174 .yn-help__list{
  position:absolute;
  z-index:30;
  left:0;
  right:0;
  top:calc(100% + 6px);
  margin:0;
  padding:6px;
  list-style:none;
  background:#fff;
  border:1px solid var(--line);
  border-radius:10px;
  box-shadow:0 14px 30px -18px rgba(22,26,29,.35);
  max-height:320px;
  overflow:auto;
  display:none;
}
body.view-category.itemid-174 .yn-help__list.is-open{display:block;}
body.view-category.itemid-174 .yn-help__list li{margin:0;}
body.view-category.itemid-174 .yn-help__list a,
body.view-category.itemid-174 .yn-help__list button{
  display:flex;
  flex-direction:column;
  gap:2px;
  width:100%;
  padding:11px 12px;
  border:0;
  border-radius:8px;
  background:none;
  text-align:left;
  cursor:pointer;
  font:inherit;
}
body.view-category.itemid-174 .yn-help__list a:hover,
body.view-category.itemid-174 .yn-help__list button:hover,
body.view-category.itemid-174 .yn-help__list .is-active{background:var(--warm);}
body.view-category.itemid-174 .yn-help__list b{
  font-size:13px;
  font-weight:800;
  letter-spacing:.06em;
  color:var(--link);
}
body.view-category.itemid-174 .yn-help__list span{
  font-size:13.5px;
  color:var(--ink2);
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
body.view-category.itemid-174 .yn-help__empty{
  padding:12px;
  font-size:13.5px;
  color:var(--muted);
}

/* 预留模块区（后续加内容） */
body.view-category.itemid-174 .yn-help__blocks{
  margin-top:56px;
  display:grid;
  gap:16px;
  grid-template-columns:repeat(2,1fr);
}
body.view-category.itemid-174 .yn-help__block{
  background:#FBFAF6;
  border:1px solid var(--line);
  border-radius:14px;
  padding:26px 24px;
}
body.view-category.itemid-174 .yn-help__block h3{
  font-size:16px;
  margin:0 0 8px;
  letter-spacing:-.01em;
}
body.view-category.itemid-174 .yn-help__block p{
  font-size:14px;
  line-height:1.7;
  color:var(--ink2);
  margin:0;
}
body.view-category.itemid-174 .yn-help__block a{
  display:inline-flex;
  align-items:center;
  gap:6px;
  margin-top:14px;
  font-size:13.5px;
  font-weight:700;
  color:var(--link);
}

/* ---------- 手机端 ---------- */
@media(max-width:640px){
  body.view-category.itemid-174 .yn-cat--help .yn-cat__head{padding:40px 20px 28px;}
  body.view-category.itemid-174 .yn-help{padding:0 18px 56px;}
  body.view-category.itemid-174 .yn-help__form{flex-direction:column;gap:10px;}
  body.view-category.itemid-174 .yn-help__input{height:52px;font-size:16px;}
  body.view-category.itemid-174 .yn-help__btn{height:50px;width:100%;}
  body.view-category.itemid-174 .yn-help__blocks{grid-template-columns:1fr;margin-top:40px;}
  body.view-category.itemid-174 .yn-help__list{max-height:260px;}
}
/* ============================================================
   V8.1 / V8.7 · 页面壳隐藏
   这些页面的主体全部由 mod_custom 模块承载，组件区（空分类壳）需隐藏
   · itemid-106 = 产品首页（模块 167），菜单指向空分类 79
   · itemid-107 = 新闻首页（模块 168），菜单指向分类 8（无直接文章）
   ============================================================ */

body.itemid-106 #sp-component,
body.itemid-107 #sp-component{display:none!important}

body.itemid-106 #sp-section-1,
body.itemid-107 #sp-section-1{display:none!important}

body.itemid-106 #sp-page-builder,
body.itemid-107 #sp-page-builder{padding-top:0;margin-top:0}

body.itemid-106 .yn-pagebuilder-row .sp-module,
body.itemid-107 .yn-pagebuilder-row .sp-module{margin:0}

body.itemid-106 .yn-pagebuilder-row .sp-module-content > .mod-custom,
body.itemid-107 .yn-pagebuilder-row .sp-module-content > .mod-custom{padding:0;margin:0}

/* 组件区已隐藏，但其 h1 仍在 DOM → 保证页面只有一个 h1（GEO/SEO） */
body.itemid-106 .yn-cat__title,
body.itemid-107 .yn-cat__title{
  font-size:0!important;line-height:0!important;margin:0!important;
  height:0!important;overflow:hidden!important;
}

/* 首页（itemid-101）：组件区渲染的是空的 blog-featured 容器，
   高度 72px 造成页头与 Hero 之间出现白条 → 一并隐藏 */
body.itemid-101 #sp-section-1{display:none!important}
body.itemid-101 #sp-component{display:none!important}
body.itemid-101 #sp-page-builder{padding-top:0;margin-top:0}
/* ============================================================
   V8.2 · 全站收口（impeccable: Harden）
   审计来源：playwright 9 页 × 2 断点 DOM 度量
   ============================================================ */

/* ---------- 2. 面包屑触控目标：视觉不变，热区补到 40px ---------- */
.yn-crumb{align-items:center}
.yn-crumb a{
  display:inline-flex;align-items:center;
  min-height:40px;margin-top:-9px;margin-bottom:-9px;
}

/* ---------- 3. 移动端抽屉关闭按钮 25×26 → 44×44 ---------- */
.offcanvas-menu .close-offcanvas{
  display:inline-flex;align-items:center;justify-content:center;
  width:44px;height:44px;
  margin:0;padding:0;
  cursor:pointer;
}
.offcanvas-menu .close-offcanvas i{font-size:22px;line-height:1}

/* ---------- 4. 统一焦点态（键盘可见，不与鼠标 hover 冲突） ---------- */
a:focus-visible,button:focus-visible,
input[type=submit]:focus-visible,
.yn-prod a:focus-visible{
  outline:2px solid var(--brand);
  outline-offset:3px;
  border-radius:6px;
}

/* ---------- 5. 移动端表单控件：iOS 聚焦不缩放（<16px 会放大页面） ---------- */
@media (max-width:640px){
  .yn-help .yn-help__input,
  .yn-cform input,
  .yn-cform textarea,
  .yn-cform select,
  input[type=search],input[type=text],input[type=email],input[type=tel],textarea{
    font-size:16px!important;
  }
}

/* ---------- 6. 减少动效 ---------- */
@media (prefers-reduced-motion:reduce){
  .yn-help .yn-help__btn{transition:none}
  .yn-help .yn-help__btn:hover{transform:none}
}

/* ============================================================
   V8.3 · 联系页修复
   （1）表单网格：模板输出 .yn-cform__grid，但此前无任何网格规则 → 纵向堆叠
   （2）地图：m.amap.com/navi 嵌入需 KEY，改为不依赖 KEY 的位置卡
   ============================================================ */

/* ---------- 1. 表单网格 ---------- */
.yn-cform__grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:18px 22px;
}
.yn-cform__grid > .control-group{min-width:0;margin:0}
/* 全宽字段：内容/留言/多行/验证码/隐藏 */
.yn-cform__grid > .control-group:has(textarea),
.yn-cform__grid > .control-group.field-spacer,
.yn-cform__grid > .control-group:only-child{grid-column:1/-1}
.yn-cform__grid > .control-group.field-spacer{display:none}
.yn-cform__grid textarea{min-height:150px;width:100%}
.yn-cform__grid .form-control,
.yn-cform__grid input[type="text"],
.yn-cform__grid input[type="email"],
.yn-cform__grid input[type="tel"]{width:100%;max-width:none}

/* 兜底：不支持 :has() 的浏览器，让"内容"字段占满一行 */
@supports not (selector(:has(*))){
  .yn-cform__grid > .control-group{grid-column:span 1}
}

/* 操作区 */
.yn-cform__actions{
  display:flex;align-items:center;gap:14px;
  margin-top:24px;
  padding-top:20px;
  border-top:1px solid var(--line);
}
.yn-cform__actions .btn{
  min-height:48px;padding:0 30px;border-radius:10px;
  font-size:15px;font-weight:700;
}

@media (max-width:820px){
  .yn-cform__grid{grid-template-columns:1fr;gap:14px}
  .yn-cform__actions .btn{width:100%}
  .view-contact .contact-form form{padding:24px 20px 20px}
}

/* ---------- 2. 地图：去掉需要 KEY 的 iframe，改静态位置卡 ---------- */
.yn-contact__mapbox{
  position:relative;
  display:flex;flex-direction:column;justify-content:flex-end;
  gap:10px;
  aspect-ratio:auto!important;
  min-height:210px;
  padding:28px 30px;
  border:1px solid var(--line);
  border-radius:16px;
  background:
    radial-gradient(700px 240px at 82% 0%,rgba(0,165,221,.10),transparent 62%),
    linear-gradient(135deg,#FBFAF6 0%,#EEF2E9 100%);
  overflow:hidden;
}
.yn-contact__mapbox iframe{
  display:none!important;   /* 不再加载需要 KEY 的嵌入地图 */
}
.yn-contact__mapbox::before{
  content:"";
  position:absolute;inset:0;
  background-image:
    linear-gradient(rgba(22,26,29,.055) 1px,transparent 1px),
    linear-gradient(90deg,rgba(22,26,29,.055) 1px,transparent 1px);
  background-size:34px 34px;
  mask-image:radial-gradient(circle at 30% 40%,#000 0%,transparent 72%);
  -webkit-mask-image:radial-gradient(circle at 30% 40%,#000 0%,transparent 72%);
  pointer-events:none;
}
.yn-contact__mapbox::after{
  content:"";
  position:absolute;left:56%;top:34%;
  width:16px;height:16px;border-radius:50% 50% 50% 0;
  background:var(--brand);
  transform:rotate(-45deg);
  box-shadow:0 0 0 8px rgba(0,165,221,.16),0 10px 18px -8px rgba(0,165,221,.9);
}
.yn-contact__mapaddr{
  position:relative;z-index:2;
  max-width:30ch;
  font-size:16px;font-weight:700;line-height:1.6;color:var(--ink);
}
.yn-contact__mapmeta{
  position:relative;z-index:2;
  font-size:13.5px;color:var(--ink2);
}
.yn-contact__mapcta{
  position:relative;z-index:2;
  display:inline-flex;align-items:center;gap:8px;
  align-self:flex-start;
  min-height:44px;padding:0 20px;
  border-radius:999px;
  background:var(--ink);color:#fff;
  font-size:14px;font-weight:700;
  transition:background .2s,transform .2s;
}
.yn-contact__mapcta:hover{background:#2B333A;transform:translateY(-1px)}
@media (max-width:640px){
  .yn-contact__mapbox{min-height:230px;padding:22px 20px}
  .yn-contact__mapaddr{font-size:15px}
}

/* ============================================================
   V8.9 · 页头搜索（模块 170 / mod_finder / 位置 head-search）
   ------------------------------------------------------------
   桌面端：与 logo、菜单同处页头右侧
   移动端：隐藏，避免 col-lg-2 在 <992px 退化为整行并溢出
   ============================================================ */

#sp-head-search{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  padding-top:0;
  padding-bottom:0;
}
#sp-head-search .sp-column{width:100%}
#sp-head-search .sp-module{margin:0;width:100%}

#sp-head-search .mod-finder input[type="search"],
#sp-head-search .mod-finder input[type="text"]{
  width:100%;
  height:38px;
  padding:0 14px;
  font-size:13.5px;
  color:var(--ink);
  background:#fff;
  border:1px solid var(--line);
  border-radius:999px;
  transition:border-color .2s,box-shadow .2s;
}
#sp-head-search .mod-finder input:focus{
  outline:none;
  border-color:var(--brand);
  box-shadow:0 0 0 3px rgba(0,165,221,.14);
}
#sp-head-search .mod-finder .btn,
#sp-head-search .mod-finder button{
  height:38px;
  padding:0 16px;
  border:0;
  border-radius:999px;
  background:var(--brand);
  color:#fff;
  font-size:13.5px;
  font-weight:700;
  cursor:pointer;
}
#sp-head-search .mod-finder .btn:hover,
#sp-head-search .mod-finder button:hover{background:var(--brand-d)}

/* 自动补全下拉层级 */
#sp-head-search .awesomplete{width:100%}
#sp-head-search .awesomplete > ul{z-index:60}

@media (max-width:991.98px){
  #sp-head-search{display:none!important}
}

/* ============================================================
   V9.0 · 页头搜索定位
   head-search 是布局器里的一行，位于 <main> 内、组件区之外。
   组件区有内容时它会被推到页面底部 → 改用绝对定位固定到页头右侧。
   ============================================================ */

.yn-headsearch-row{
  position: absolute;
  top: 0;
  right: 0;
  width: auto;
  margin: 0;
  padding: 0;
  background: transparent;
  pointer-events: none;      /* 空白区不挡点击 */
  z-index: 45;
}
.yn-headsearch-row .sp-column{width: auto}
.yn-headsearch-row #sp-head-search,
.yn-headsearch-row .sp-module{
  width: 240px;
  pointer-events: auto;
}

/* 桌面端：嵌在导航条最右端，与导航垂直居中
   导航条实测：header 顶部 38，高 70 → 中线 73
   右侧留出容器边距，搜索框宽度 210，不压住最后一项菜单 */
@media (min-width: 992px){
  /* 给导航右侧留出搜索框的空间，菜单整体左移不重叠 */
  #sp-menu .sp-column{
    padding-right: 232px;
  }
  .yn-headsearch-row{
    position: fixed;
    top: 73px;
    transform: translateY(-50%);
    right: max(24px, calc((100vw - 1170px) / 2));
    margin: 0;
  }
}

/* 移动端：整行隐藏（已有 #sp-head-search 规则兜底） */
@media (max-width: 991.98px){
  .yn-headsearch-row{display: none !important;}
}
/* ============================================================
   V8.6 · 新闻首页（菜单 107 / 模块 168）
   暖白专业语言，与产品首页 V8 同一套 token
   ============================================================ */

.yn-news{background:#fff}
.yn-news .yn-wrap{max-width:1170px;margin:0 auto;padding:0 24px}

/* ---------- 英雄位 ---------- */
.yn-news__hero{
  background:
    radial-gradient(900px 420px at 85% -12%,rgba(0,165,221,.09),transparent 62%),
    linear-gradient(180deg,#FCFDF9 0%,var(--warm) 100%);
  border-bottom:1px solid var(--line);
  padding:58px 0 60px;
}
.yn-news__herogrid{
  display:grid;grid-template-columns:1fr 1.05fr;gap:48px;align-items:center;
}
.yn-news__k{
  display:inline-block;font-size:12px;font-weight:800;letter-spacing:.18em;
  text-transform:uppercase;color:var(--link);
}
.yn-news__h1{
  font-size:clamp(32px,4vw,50px);font-weight:800;letter-spacing:-.038em;
  line-height:1.1;margin:14px 0 0;
}
.yn-news__lead{
  margin:16px 0 0;font-size:16.5px;line-height:1.75;color:var(--ink2);max-width:44ch;
}
.yn-news__cats{display:flex;gap:12px;flex-wrap:wrap;margin-top:26px}
.yn-news__cat{
  display:flex;flex-direction:column;gap:3px;
  min-width:140px;padding:14px 18px;
  background:#fff;border:1px solid var(--line);border-radius:12px;
  transition:border-color .22s,transform .22s,box-shadow .22s;
}
.yn-news__cat:hover{border-color:var(--brand);transform:translateY(-2px);box-shadow:0 14px 26px -18px rgba(22,26,29,.4)}
.yn-news__cat b{font-size:15.5px;color:var(--ink);letter-spacing:-.01em}
.yn-news__cat span{font-size:12.5px;color:var(--muted)}

/* 头条卡 */
.yn-news__feature{
  display:flex;flex-direction:column;gap:10px;
  padding:30px 32px;
  background:#fff;border:1px solid var(--line);border-radius:18px;
  box-shadow:0 28px 54px -34px rgba(22,26,29,.45);
  transition:transform .28s var(--ease),box-shadow .28s var(--ease),border-color .28s;
}
.yn-news__feature:hover{transform:translateY(-4px);border-color:var(--brand);box-shadow:0 34px 62px -34px rgba(22,26,29,.5)}
.yn-news__featurek{
  align-self:flex-start;
  font-size:11.5px;font-weight:800;letter-spacing:.06em;
  color:var(--link);background:var(--brand-l);
  border-radius:6px;padding:5px 9px;
}
.yn-news__featuret{
  font-size:clamp(21px,2.3vw,27px);font-weight:800;letter-spacing:-.03em;
  line-height:1.32;color:var(--ink);
}
.yn-news__featured{font-size:14.5px;line-height:1.72;color:var(--ink2)}
.yn-news__featurem{margin-top:4px;font-size:13px;font-weight:700;color:var(--link)}

/* ---------- 双列列表 ---------- */
.yn-news__sec{padding:68px 24px 0}
.yn-news__cols{display:grid;grid-template-columns:1fr 1fr;gap:52px}
.yn-news__h2{font-size:clamp(21px,2.2vw,26px);margin:0;letter-spacing:-.03em}
.yn-news__hint{margin:8px 0 18px;font-size:14px;color:var(--muted)}
.yn-news__list{display:flex;flex-direction:column;border-top:1px solid var(--line)}
.yn-nw-card{
  display:flex;flex-direction:column;gap:5px;
  padding:16px 0;border-bottom:1px solid var(--line);
  transition:padding-left .22s,background .22s;
}
.yn-nw-card:hover{padding-left:10px;background:#FCFDF9}
.yn-nw-card__date{font-size:12px;font-weight:700;color:var(--muted);letter-spacing:.02em}
.yn-nw-card__t{
  font-size:15.5px;font-weight:700;line-height:1.5;color:var(--ink);
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
}
.yn-nw-card--guide:hover .yn-nw-card__t{color:var(--link)}
.yn-news__more{
  display:inline-block;margin-top:20px;
  font-size:13.5px;font-weight:800;color:var(--link);
}
.yn-news__more:hover{text-decoration:underline;text-underline-offset:4px}

/* ---------- CTA ---------- */
.yn-news__cta{margin-top:72px;background:var(--dark,#1B2126);padding:52px 0 56px;color:#fff}
.yn-news__ctagrid{display:flex;align-items:center;justify-content:space-between;gap:32px;flex-wrap:wrap}
.yn-news__cta h2{margin:0;font-size:clamp(21px,2.4vw,28px);letter-spacing:-.03em;color:#fff}
.yn-news__cta p{margin:10px 0 0;font-size:14.5px;color:rgba(255,255,255,.76)}
.yn-news__btn{
  display:inline-flex;align-items:center;justify-content:center;
  min-height:48px;padding:0 28px;border-radius:10px;
  background:#fff;color:var(--ink);font-size:15px;font-weight:700;
  transition:transform .22s,background .22s;
}
.yn-news__btn:hover{transform:translateY(-2px);background:#F1F3EC}

/* ---------- 焦点态 ---------- */
.yn-news a:focus-visible{outline:2px solid var(--brand);outline-offset:3px;border-radius:8px}

/* ---------- 响应式 ---------- */
@media (max-width:900px){
  .yn-news__herogrid{grid-template-columns:1fr;gap:32px}
  .yn-news__feature{padding:24px 24px}
  .yn-news__cols{grid-template-columns:1fr;gap:44px}
}
@media (max-width:640px){
  .yn-news .yn-wrap{padding:0 18px}
  .yn-news__hero{padding:40px 0 44px}
  .yn-news__h1{font-size:30px}
  .yn-news__lead{font-size:15.5px}
  .yn-news__cats{gap:10px}
  .yn-news__cat{flex:1 1 100%;min-width:0}
  .yn-news__featuret{font-size:20px}
  .yn-news__sec{padding:44px 18px 0}
  .yn-news__cta{margin-top:52px;padding:40px 0 44px}
  .yn-news__ctagrid{gap:22px}
  .yn-news__btn{width:100%}
}
@media (prefers-reduced-motion:reduce){
  .yn-news__cat,.yn-news__feature,.yn-nw-card,.yn-news__btn{transition:none!important}
  .yn-news__cat:hover,.yn-news__feature:hover,.yn-news__btn:hover{transform:none!important}
}
/* ============================================================
   V8.1 · /products.html 清掉组件区（菜单 106 指向的空分类 79）
   页面内容全部由模块 167 承载，这里只隐藏重复的分类外壳
   ============================================================ */
body.itemid-106 #sp-component{display:none!important}
body.itemid-106 #sp-section-1{display:none!important}
body.itemid-106 #sp-page-builder{padding-top:0;margin-top:0}
body.itemid-106 .yn-pagebuilder-row .sp-module{margin:0}
body.itemid-106 .yn-pagebuilder-row .sp-module-content > .mod-custom{padding:0;margin:0}
/* ============================================================
   V8 · 产品首页（/products.html）
   只作用于 .yn-prod（菜单 106 专属模块 167）
   设计读：B2B 洗美源头工厂的产品总览页 → 中文经销商 + 车主 DIY
   语言：暖白专业（老板已确认 B 方向），品牌蓝为唯一强调色
   ============================================================ */

.yn-prod{
  --yp-line:#E6E8E1;
  --yp-line-2:#D8DCD2;
  --yp-tint:#F4F6EF;
  --yp-tint-2:#ECEFE5;
  --yp-deep:#1A2228;
  background:#fff;
  color:var(--ink);
}

/* ---------- 通用 ---------- */
.yn-prod .yn-wrap{max-width:1170px;margin:0 auto;padding:0 24px}
.yn-prod__k{
  display:inline-flex;align-items:center;gap:9px;
  font-size:13px;font-weight:700;letter-spacing:.02em;color:var(--ink2);
  background:#fff;border:1px solid var(--yp-line);border-radius:999px;
  padding:7px 15px 7px 12px;
}
.yn-prod__k::before{
  content:"";width:7px;height:7px;border-radius:50%;background:var(--brand);
  box-shadow:0 0 0 3px rgba(0,165,221,.14);
}
.yn-prod__ac{display:block;color:var(--link)}

/* ---------- 1 · 英雄位 ---------- */
.yn-prod__hero{
  background:
    radial-gradient(900px 420px at 82% -10%,rgba(0,165,221,.10),transparent 60%),
    linear-gradient(180deg,#FCFDF9 0%,var(--yp-tint) 100%);
  border-bottom:1px solid var(--yp-line);
  padding:60px 0 64px;
}
.yn-prod__herogrid{
  display:grid;
  grid-template-columns:1.02fr .98fr;
  gap:56px;
  align-items:center;
}
.yn-prod__herocol{min-width:0}
.yn-prod__h1{
  font-size:clamp(34px,4.2vw,54px);
  font-weight:800;
  letter-spacing:-.038em;
  line-height:1.1;
  margin:18px 0 0;
  max-width:15ch;
}
.yn-prod__lead{
  margin:18px 0 0;
  font-size:16.5px;
  line-height:1.75;
  color:var(--ink2);
  max-width:46ch;
}
.yn-prod__cf{display:flex;flex-wrap:wrap;align-items:center;gap:20px;margin-top:30px}
.yn-prod__btn{
  display:inline-flex;align-items:center;justify-content:center;
  min-height:48px;padding:0 26px;border-radius:10px;
  background:var(--ink);color:#fff;
  font-size:15px;font-weight:700;letter-spacing:.01em;
  transition:background .22s var(--ease),transform .22s var(--ease),box-shadow .22s var(--ease);
}
.yn-prod__btn:hover{background:#2B333A;transform:translateY(-2px);box-shadow:0 16px 30px -18px rgba(22,26,29,.65)}
.yn-prod__btn:active{transform:translateY(0)}
.yn-prod__btn--light{background:#fff;color:var(--ink)}
.yn-prod__btn--light:hover{background:#F1F3EC;box-shadow:0 16px 30px -18px rgba(0,0,0,.35)}
.yn-prod__link{
  display:inline-flex;align-items:center;gap:6px;
  font-size:14.5px;font-weight:700;color:var(--ink);
  border-bottom:1px solid var(--yp-line-2);padding-bottom:2px;
  transition:color .2s,border-color .2s;
}
.yn-prod__link:hover{color:var(--link);border-color:var(--brand)}
.yn-prod__link--light{color:#fff;border-color:rgba(255,255,255,.4)}
.yn-prod__link--light:hover{color:#fff;border-color:#fff}

/* 英雄位产品拼贴（真实产品图，白底） */
.yn-prod__heroart{
  position:relative;
  height:396px;
}
.yn-ha{
  position:absolute;
  display:flex;flex-direction:column;
  background:#fff;
  border:1px solid var(--yp-line);
  border-radius:16px;
  padding:12px 12px 0;
  box-shadow:0 26px 50px -30px rgba(22,26,29,.42);
  overflow:hidden;
}
.yn-ha img{
  flex:1;min-height:0;width:100%;
  object-fit:contain;
  display:block;
}
.yn-ha__cap{
  display:flex;flex-direction:column;gap:1px;
  padding:10px 4px 12px;
  font-size:12px;font-weight:800;letter-spacing:.05em;color:var(--ink);
  border-top:1px solid var(--yp-line);
  margin-top:10px;
}
.yn-ha__cap em{font-style:normal;font-weight:600;letter-spacing:0;font-size:12.5px;color:var(--ink2)}
.yn-ha--main{
  left:0;top:34px;width:56%;height:330px;
  z-index:2;
}
.yn-ha--a{
  right:0;top:0;width:41%;height:186px;
  z-index:3;transform:rotate(1.6deg);
}
.yn-ha--b{
  right:6%;bottom:0;width:39%;height:176px;
  z-index:3;transform:rotate(-1.4deg);
}
.yn-ha--a .yn-ha__cap,
.yn-ha--b .yn-ha__cap{padding-bottom:10px;font-size:11.5px}
.yn-ha__flag{
  position:absolute;left:-14px;bottom:6px;z-index:4;
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  width:86px;height:86px;border-radius:50%;
  background:var(--brand);color:#fff;
  box-shadow:0 18px 30px -18px rgba(0,165,221,.9);
}
.yn-ha__flag b{font-size:23px;font-weight:800;line-height:1;letter-spacing:-.02em}
.yn-ha__flag span{font-size:11px;font-weight:700;margin-top:4px;opacity:.92}

/* ---------- 2 · 信任条 ---------- */
.yn-prod__trust{background:#fff;border-bottom:1px solid var(--yp-line)}
.yn-prod__trustgrid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
}
.yn-tr{
  display:flex;flex-direction:column;gap:6px;
  padding:26px 26px 26px 0;
  position:relative;
}
.yn-tr + .yn-tr{padding-left:26px;border-left:1px solid var(--yp-line)}
.yn-tr b{font-size:17px;font-weight:800;letter-spacing:-.01em;color:var(--ink)}
.yn-tr span{font-size:13.5px;line-height:1.6;color:var(--ink2)}

/* ---------- 3 · 目录 ---------- */
.yn-prod__sec{padding:76px 24px 0}
.yn-prod__sechead{margin-bottom:28px}
.yn-prod__sechead h2{
  font-size:clamp(24px,2.6vw,32px);
  letter-spacing:-.03em;
  margin:0;
  font-weight:800;
}
.yn-prod__sechead p{margin:10px 0 0;font-size:15px;color:var(--ink2);max-width:62ch}
.yn-prod__sechead--row{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;flex-wrap:wrap}
.yn-prod__more{font-size:14px;font-weight:700;color:var(--link);white-space:nowrap}
.yn-prod__more:hover{text-decoration:underline;text-underline-offset:4px}

.yn-plines{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:14px;
}
.yn-pline{
  position:relative;
  display:flex;flex-direction:column;
  min-height:196px;
  padding:20px 20px 18px;
  background:var(--yp-tint);
  border:1px solid var(--yp-line);
  border-radius:14px;
  overflow:hidden;
  transition:border-color .25s var(--ease),transform .25s var(--ease),box-shadow .25s var(--ease),background .25s;
}
.yn-pline:hover{
  background:#fff;
  border-color:var(--yp-line-2);
  transform:translateY(-4px);
  box-shadow:0 22px 40px -26px rgba(22,26,29,.42);
}
.yn-pline__n{
  font-size:12px;font-weight:800;letter-spacing:.06em;
  color:var(--link);
}
.yn-pline__t{
  margin-top:8px;
  font-size:17px;font-weight:800;letter-spacing:-.02em;line-height:1.35;
  color:var(--ink);
  position:relative;z-index:2;
}
.yn-pline__d{
  margin-top:8px;
  font-size:13px;line-height:1.6;color:var(--ink2);
  max-width:22ch;
  position:relative;z-index:2;
}
.yn-pline__i{
  position:absolute;right:-12px;bottom:-12px;
  width:104px;height:104px;object-fit:contain;
  opacity:.92;
  transition:transform .35s var(--ease);
}
.yn-pline:hover .yn-pline__i{transform:translate(-3px,-4px) scale(1.04)}
.yn-pline__go{
  margin-top:auto;padding-top:14px;
  font-size:12.5px;font-weight:800;color:var(--link);
  position:relative;z-index:2;
}
/* 两条主线放大 */
.yn-pline--lg{
  grid-column:span 2;
  min-height:214px;
  background:linear-gradient(135deg,#fff 0%,var(--yp-tint-2) 100%);
}
.yn-pline--lg .yn-pline__t{font-size:21px}
.yn-pline--lg .yn-pline__d{max-width:26ch}
.yn-pline--lg .yn-pline__i{width:150px;height:150px;right:8px;bottom:6px;opacity:1}

/* ---------- 4 · 场景 ---------- */
.yn-prod__scenes{
  margin-top:76px;
  padding:64px 0 68px;
  background:var(--yp-tint);
  border-top:1px solid var(--yp-line);
  border-bottom:1px solid var(--yp-line);
}
.yn-scenes{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:0;
  border-top:1px solid var(--yp-line-2);
}
.yn-scene{
  padding:24px 24px 6px 0;
  display:flex;flex-direction:column;
}
.yn-scene + .yn-scene{padding-left:24px;border-left:1px solid var(--yp-line-2)}
.yn-scene h3{font-size:17px;margin:0;letter-spacing:-.015em}
.yn-scene p{margin:10px 0 16px;font-size:13.8px;line-height:1.7;color:var(--ink2)}
.yn-scene a{
  margin-top:auto;
  font-size:13px;font-weight:800;color:var(--link);
  align-self:flex-start;
}
.yn-scene a:hover{text-decoration:underline;text-underline-offset:4px}

/* ---------- 5 · 主推产品 ---------- */
.yn-pfeat{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:18px;
}
.yn-pf{
  display:flex;flex-direction:column;
  background:#fff;
  border:1px solid var(--yp-line);
  border-radius:14px;
  overflow:hidden;
  transition:transform .28s var(--ease),box-shadow .28s var(--ease),border-color .28s;
}
.yn-pf:hover{
  transform:translateY(-4px);
  border-color:var(--yp-line-2);
  box-shadow:0 22px 40px -26px rgba(22,26,29,.42);
}
.yn-pf__img{
  display:block;
  aspect-ratio:1/1;
  background:#fff;
  border-bottom:1px solid var(--yp-line);
}
.yn-pf__img img{
  width:100%;height:100%;
  object-fit:contain;
  padding:20px;
  display:block;
  transition:transform .4s var(--ease);
}
.yn-pf:hover .yn-pf__img img{transform:scale(1.05)}
.yn-pf__body{
  display:flex;flex-direction:column;
  padding:14px 16px 16px;
}
.yn-pf__line{font-size:11.5px;font-weight:800;letter-spacing:.04em;color:var(--muted)}
.yn-pf__t{
  margin-top:6px;
  font-size:14px;font-weight:700;line-height:1.5;
  color:var(--ink);
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
  min-height:2.9em;
}
.yn-pf__m{
  margin-top:10px;
  align-self:flex-start;
  font-size:11.5px;font-weight:800;letter-spacing:.05em;
  color:var(--link);
  background:var(--brand-l);
  border-radius:6px;padding:4px 8px;
}

/* ---------- 6 · 合作方式 ---------- */
.yn-prod__how{padding:76px 0 0}
.yn-steps{
  list-style:none;
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:0;
  counter-reset:ynstep;
  border-top:2px solid var(--ink);
}
.yn-steps li{
  counter-increment:ynstep;
  padding:22px 26px 6px 0;
  display:flex;flex-direction:column;gap:4px;
  position:relative;
}
.yn-steps li + li{padding-left:26px}
.yn-steps li::before{
  content:counter(ynstep,decimal-leading-zero);
  font-size:12px;font-weight:800;letter-spacing:.08em;color:var(--link);
  margin-bottom:8px;
}
.yn-steps b{font-size:16.5px;letter-spacing:-.015em}
.yn-steps span{font-size:13.5px;line-height:1.65;color:var(--ink2)}

/* ---------- 7 · CTA ---------- */
.yn-prod__cta{
  margin-top:80px;
  background:var(--yp-deep);
  padding:60px 0 64px;
  color:#fff;
}
.yn-prod__ctagrid{
  display:flex;align-items:center;justify-content:space-between;
  gap:36px;flex-wrap:wrap;
}
.yn-prod__cta h2{
  font-size:clamp(23px,2.6vw,32px);
  margin:0;letter-spacing:-.03em;color:#fff;
}
.yn-prod__cta p{margin:12px 0 0;font-size:15px;line-height:1.7;color:rgba(255,255,255,.78);max-width:52ch}
.yn-prod__cfa{display:flex;align-items:center;gap:22px;flex-wrap:wrap}

/* ---------- 焦点态 ---------- */
.yn-prod a:focus-visible{
  outline:2px solid var(--brand);
  outline-offset:3px;
  border-radius:8px;
}

/* ============================================================
   响应式
   ============================================================ */
@media (max-width:1100px){
  .yn-prod__herogrid{gap:36px}
  .yn-plines{grid-template-columns:repeat(3,1fr)!important}
  .yn-pline--lg{grid-column:span 3!important;min-height:190px}
  .yn-pline--lg .yn-pline__i{width:150px;height:150px}
  .yn-pfeat{grid-template-columns:repeat(3,1fr)!important}
  .yn-prod__trustgrid{grid-template-columns:repeat(2,1fr)}
  .yn-tr:nth-child(3){border-left:0;padding-left:0}
  .yn-tr:nth-child(n+3){border-top:1px solid var(--yp-line)}
  .yn-scenes{grid-template-columns:repeat(2,1fr)}
  .yn-scene:nth-child(3){border-left:0;padding-left:0}
  .yn-scene:nth-child(n+3){border-top:1px solid var(--yp-line-2);margin-top:22px;padding-top:22px}
  .yn-steps{grid-template-columns:repeat(2,1fr)}
  .yn-steps li:nth-child(3){padding-left:0}
  .yn-steps li:nth-child(n+3){border-top:1px solid var(--yp-line);margin-top:18px}
}

@media (max-width:900px){
  .yn-prod__herogrid{grid-template-columns:1fr;gap:40px}
  .yn-prod__heroart{
    height:auto;
    display:grid;
    grid-template-columns:1.25fr 1fr;
    grid-template-rows:auto auto;
    gap:12px;
    padding-bottom:20px;
  }
  .yn-ha{position:static;width:auto;height:auto;transform:none;padding:10px 10px 0}
  .yn-ha img{aspect-ratio:1/1;flex:none;padding:6px}
  .yn-ha--main{grid-row:span 2;height:100%}
  .yn-ha--main img{aspect-ratio:auto;flex:1}
  .yn-ha--a,.yn-ha--b{transform:none}
  .yn-ha__flag{left:8px;bottom:4px;width:66px;height:66px}
  .yn-ha__flag b{font-size:19px}
  .yn-ha__flag span{font-size:10px}
  .yn-prod__h1{max-width:none}
}

@media (max-width:820px){
  .yn-prod__hero{padding:44px 0 48px}
  .yn-prod__sec{padding:56px 20px 0}
  .yn-prod__scenes{margin-top:56px;padding:48px 0 52px}
  .yn-prod__how{padding-top:56px}
  .yn-prod__cta{margin-top:60px;padding:48px 0 52px}
  .yn-plines{grid-template-columns:repeat(2,1fr)!important}
  .yn-pline--lg{grid-column:span 2!important}
  .yn-pfeat{grid-template-columns:repeat(2,1fr)!important}
  .yn-pline__i{width:88px;height:88px}
  .yn-pline--lg .yn-pline__i{width:120px;height:120px}
}

@media (max-width:640px){
  .yn-prod .yn-wrap{padding:0 18px}
  .yn-prod__hero{padding:36px 0 40px}
  .yn-prod__h1{font-size:32px;letter-spacing:-.03em}
  .yn-prod__lead{font-size:15.5px}
  .yn-prod__cf{gap:16px;margin-top:24px}
  .yn-prod__btn{width:100%}
  .yn-prod__heroart{grid-template-columns:1.2fr 1fr;gap:10px}
  .yn-ha__cap{font-size:10.5px;padding:8px 2px 10px}
  .yn-ha__cap em{font-size:11px}
  .yn-tr{padding:18px 14px 18px 0}
  .yn-tr + .yn-tr{padding-left:14px}
  .yn-tr b{font-size:15px}
  .yn-tr span{font-size:12.5px}
  .yn-prod__sec{padding:44px 18px 0}
  .yn-prod__sechead{margin-bottom:20px}
  .yn-plines{gap:10px!important}
  .yn-pline{min-height:168px;padding:16px 16px 14px}
  .yn-pline__t{font-size:15px}
  .yn-pline__d{font-size:12px;max-width:18ch}
  .yn-pline--lg{min-height:176px}
  .yn-pline--lg .yn-pline__t{font-size:18px}
  .yn-pline--lg .yn-pline__d{max-width:20ch}
  .yn-pline__i{width:72px;height:72px;right:-8px;bottom:-8px}
  .yn-pline--lg .yn-pline__i{width:96px;height:96px;right:0;bottom:0}
  .yn-scenes{grid-template-columns:1fr;border-top:0}
  .yn-scene{padding:18px 0!important;border-left:0!important}
  .yn-scene + .yn-scene{border-top:1px solid var(--yp-line-2);margin-top:0;padding-top:18px!important}
  .yn-pfeat{gap:12px!important}
  .yn-pf__img img{padding:14px}
  .yn-pf__body{padding:12px 13px 14px}
  .yn-pf__t{font-size:13px}
  .yn-steps{grid-template-columns:1fr}
  .yn-steps li{padding:16px 0!important;border-top:1px solid var(--yp-line)}
  .yn-steps li:first-child{border-top:0}
  .yn-steps li + li{padding-left:0!important}
  .yn-prod__ctagrid{gap:24px}
  .yn-prod__cfa{gap:16px;width:100%}
  .yn-prod__cta .yn-prod__btn{width:100%}
}

@media (prefers-reduced-motion:reduce){
  .yn-pline,.yn-pf,.yn-pf__img img,.yn-pline__i,.yn-prod__btn,.yn-ha{
    transition:none!important;
  }
  .yn-pline:hover,.yn-pf:hover,.yn-prod__btn:hover{transform:none!important}
}
/* ============================================================
   V9.1 · 联系我们（重构版式）
   左：联系信息卡  右：在线留言表单  底：工厂位置
   与产品首页 / 新闻首页同一套暖白 token
   ============================================================ */

.yn-contact{
  --c-line:#E6E8E1;
  --c-tint:#F4F6EF;
  background:#fff;
}

/* ---------- 页头 ---------- */
.yn-contact__head{
  background:
    radial-gradient(900px 420px at 82% -10%,rgba(0,165,221,.09),transparent 62%),
    linear-gradient(180deg,#FCFDF9 0%,var(--warm) 100%);
  border-bottom:1px solid var(--c-line);
  padding:48px 0 46px;
  /* 通栏：抵消外层 .sp-column / .row 的边距，与其他页头对齐 */
  margin-left:calc(50% - 50vw);
  margin-right:calc(50% - 50vw);
  width:100vw;
}
.yn-contact__head .yn-wrap{max-width:1170px;margin:0 auto;padding:0 24px}
.yn-contact__title{
  font-size:clamp(30px,3.8vw,46px);
  font-weight:800;letter-spacing:-.035em;line-height:1.12;
  margin:14px 0 0;
}
.yn-contact__lead{
  margin:14px 0 0;font-size:16px;line-height:1.75;
  color:var(--ink2);max-width:52ch;
}

/* ---------- 主体双栏 ---------- */
.yn-contact__main{
  max-width:1170px;margin:0 auto;padding:0 24px;
  display:grid;
  grid-template-columns:380px minmax(0,1fr);
  gap:44px;
  align-items:start;
  padding-top:56px;
  padding-bottom:8px;
}

/* ---------- 左侧信息卡 ---------- */
.yn-contact__side{
  background:var(--c-tint);
  border:1px solid var(--c-line);
  border-radius:18px;
  padding:28px 26px 22px;
  position:sticky;
  top:96px;
}
.yn-contact__h2{
  font-size:19px;font-weight:800;letter-spacing:-.02em;
  margin:0 0 18px;
}
.yn-cinfo{
  display:grid;
  grid-template-columns:30px 1fr;
  grid-template-areas:"ic k" ". v";
  gap:2px 0;
  padding:13px 0;
  border-top:1px solid var(--c-line);
  transition:background .2s;
}
.yn-cinfo:first-of-type{border-top:0;padding-top:0}
.yn-cinfo__ic{
  grid-area:ic;
  display:flex;align-items:center;justify-content:center;
  width:24px;height:24px;border-radius:7px;
  background:#fff;border:1px solid var(--c-line);
  color:var(--link);
}
.yn-cinfo__ic svg{width:14px;height:14px}
.yn-cinfo__k{
  grid-area:k;
  font-size:12px;font-weight:700;letter-spacing:.04em;
  color:var(--muted);
  align-self:center;
}
.yn-cinfo__v{
  grid-area:v;
  font-size:14px;line-height:1.6;
  color:var(--ink);
  word-break:break-word;
}
a.yn-cinfo:hover .yn-cinfo__v{color:var(--link)}
a.yn-cinfo:hover .yn-cinfo__ic{border-color:var(--brand)}

/* 地址块：文字更长，给足行距 */
.yn-cinfo--addr .yn-cinfo__v{font-weight:600}

/* 工作时间：非链接 */
.yn-contact__hours{
  display:grid;
  grid-template-columns:30px 1fr;
  grid-template-areas:"ic k" ". v";
  gap:2px 0;
  margin-top:6px;padding-top:14px;
  border-top:1px solid var(--c-line);
}
.yn-contact__hours .yn-cinfo__k{grid-area:k;font-size:12px;font-weight:700;color:var(--muted)}
.yn-contact__hours .yn-cinfo__v{grid-area:v;font-size:14px;color:var(--ink)}

/* ---------- 右侧表单 ---------- */
.yn-contact__formwrap{min-width:0}
.yn-contact__hint{
  margin:-10px 0 18px;
  font-size:14px;color:var(--ink2);
}
.yn-contact__formwrap .contact-form form{
  background:#fff;
  border:1px solid var(--c-line);
  border-radius:18px;
  padding:28px 30px 26px;
  margin:0;
}
.yn-contact__formwrap fieldset{border:0;padding:0;margin:0}
.yn-cform__grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:18px 20px;
}
.yn-cform__grid > .control-group{min-width:0;margin:0}
.yn-cform__grid > .control-group:has(textarea){grid-column:1/-1}
.yn-cform__grid > .control-group.field-spacer{display:none}
.yn-cform__grid .control-label,
.yn-contact__formwrap .control-label{
  display:block;
  font-size:13px;font-weight:700;color:var(--ink2);
  margin-bottom:7px;
}
.yn-contact__formwrap .form-control,
.yn-cform__grid input,
.yn-cform__grid textarea,
.yn-cform__grid select{
  width:100%;max-width:none;
  min-height:48px;
  padding:11px 14px;
  font-size:14.5px;
  color:var(--ink);
  background:#fff;
  border:1px solid #E0E5DA;
  border-radius:10px;
  transition:border-color .2s,box-shadow .2s;
}
.yn-cform__grid textarea{min-height:150px;resize:vertical;line-height:1.7}
.yn-cform__grid .form-control:focus,
.yn-cform__grid input:focus,
.yn-cform__grid textarea:focus{
  outline:none;
  border-color:var(--brand);
  box-shadow:0 0 0 3px rgba(0,165,221,.14);
}
.yn-cform__actions{
  display:flex;align-items:center;gap:14px;
  margin-top:22px;padding-top:20px;
  border-top:1px solid var(--c-line);
}
.yn-cform__actions .btn{
  min-height:48px;padding:0 30px;border-radius:10px;
  font-size:15px;font-weight:700;
  background:#0A7FA8;border:0;color:#fff;cursor:pointer;
  transition:background .2s,transform .2s;
}
.yn-cform__actions .btn:hover{background:#085F7E;transform:translateY(-2px)}
.yn-cform__actions .btn:focus-visible{outline:2px solid var(--brand);outline-offset:3px}

/* 验证码 */
.yn-contact__formwrap .zcaptcha{display:flex;align-items:center;gap:10px}
.yn-contact__formwrap .zmax_captcha_image img{height:48px;border-radius:8px;border:1px solid var(--c-line)}

/* ---------- 底部地图卡 ---------- */
.yn-contact__map{
  margin-top:56px;
  background:var(--c-tint);
  border-top:1px solid var(--c-line);
  padding:44px 0 52px;
}
.yn-contact__map .yn-wrap{max-width:1170px;margin:0 auto;padding:0 24px}
.yn-contact__maphead{
  display:flex;align-items:flex-end;justify-content:space-between;
  gap:20px;margin-bottom:20px;
}
.yn-contact__maphead h2{margin:0}
.yn-contact__maplink{
  display:inline-flex;align-items:center;gap:7px;
  font-size:13.5px;font-weight:700;color:var(--link);
  white-space:nowrap;
}
.yn-contact__maplink:hover{text-decoration:underline;text-underline-offset:4px}
.yn-contact__maplink svg{transition:transform .25s var(--ease)}
.yn-contact__maplink:hover svg{transform:translateX(4px)}

.yn-contact__mapbox{
  position:relative;
  display:flex;flex-direction:column;justify-content:flex-end;
  gap:10px;
  min-height:230px;
  padding:30px 32px;
  border:1px solid var(--c-line);
  border-radius:18px;
  background:
    radial-gradient(700px 240px at 82% 0%,rgba(0,165,221,.10),transparent 62%),
    linear-gradient(135deg,#FFFDF9 0%,#EEF2E9 100%);
  overflow:hidden;
}
.yn-contact__mapbox iframe{display:none!important}
.yn-contact__mapbox::before{
  content:"";
  position:absolute;inset:0;
  background-image:
    linear-gradient(rgba(22,26,29,.055) 1px,transparent 1px),
    linear-gradient(90deg,rgba(22,26,29,.055) 1px,transparent 1px);
  background-size:34px 34px;
  mask-image:radial-gradient(circle at 30% 40%,#000 0%,transparent 72%);
  -webkit-mask-image:radial-gradient(circle at 30% 40%,#000 0%,transparent 72%);
  pointer-events:none;
}
.yn-contact__mapbox::after{
  content:"";
  position:absolute;left:58%;top:32%;
  width:16px;height:16px;border-radius:50% 50% 50% 0;
  background:var(--brand);
  transform:rotate(-45deg);
  box-shadow:0 0 0 8px rgba(0,165,221,.16),0 10px 18px -8px rgba(0,165,221,.9);
}
.yn-contact__mapaddr{
  position:relative;z-index:2;
  max-width:32ch;
  font-size:17px;font-weight:700;line-height:1.6;color:var(--ink);
}
.yn-contact__mapmeta{
  position:relative;z-index:2;
  font-size:13.5px;color:var(--ink2);
}
.yn-contact__mapcta{
  position:relative;z-index:2;
  display:inline-flex;align-items:center;gap:8px;
  align-self:flex-start;
  min-height:44px;padding:0 20px;
  border-radius:999px;
  background:var(--ink);color:#fff;
  font-size:14px;font-weight:700;
  transition:background .2s,transform .2s;
}
.yn-contact__mapcta:hover{background:#2B333A;transform:translateY(-1px)}

/* ---------- 响应式 ---------- */
@media (max-width:1024px){
  .yn-contact__main{grid-template-columns:1fr;gap:32px;padding-top:40px}
  .yn-contact__side{position:static}
}
@media (max-width:820px){
  .yn-contact__head{padding:36px 0 34px}
  .yn-contact__main{padding:0 20px;padding-top:32px}
  .yn-contact__formwrap .contact-form form{padding:22px 20px 20px}
  .yn-cform__grid{grid-template-columns:1fr;gap:14px}
  .yn-contact__map{padding:34px 0 40px}
  .yn-contact__mapbox{min-height:210px;padding:24px}
}
@media (max-width:640px){
  .yn-contact__head .yn-wrap{padding:0 18px}
  .yn-contact__main{padding:0 18px;padding-top:28px}
  .yn-contact__side{padding:22px 20px 18px;border-radius:14px}
  .yn-contact__title{font-size:28px}
  .yn-contact__lead{font-size:15px}
  .yn-cform__actions .btn{width:100%}
  .yn-contact__map .yn-wrap{padding:0 18px}
  .yn-contact__mapaddr{font-size:15px}
  .yn-contact__maphead{flex-direction:column;align-items:flex-start;gap:8px}
}
@media (prefers-reduced-motion:reduce){
  .yn-cinfo,.yn-contact__mapcta,.yn-cform__actions .btn{transition:none!important}
  .yn-cform__actions .btn:hover,.yn-contact__mapcta:hover{transform:none!important}
}
/* ============================================================
   V8.3 · 帮助搜索框在非帮助页的样式缺陷
   搜索框由 custom.js 注入所有分类页；其布局/按钮样式原先限域
   body.view-category.itemid-174，其余页面按钮退化（36×30 / 94px 高）。
   ============================================================ */
.yn-help .yn-help__searchBox{max-width:760px;margin:0 auto}
.yn-help .yn-help__form{display:flex!important;align-items:center!important;gap:10px!important}
.yn-help .yn-help__inputWrap{position:relative;flex:1 1 auto;min-width:0}
.yn-help .yn-help__btn{
  flex:0 0 auto!important;
  display:inline-flex!important;align-items:center!important;justify-content:center!important;
  align-self:center!important;
  height:52px!important;min-height:52px!important;max-height:52px!important;
  padding:0 26px!important;
  border:0!important;border-radius:12px!important;
  background:var(--brand)!important;color:#fff!important;
  font-size:15px!important;font-weight:700!important;line-height:1!important;
  font-family:inherit!important;
  cursor:pointer;white-space:nowrap;overflow:hidden;
  transition:background .2s;
}
.yn-help .yn-help__btn:hover{background:var(--brand-d)!important}
.yn-help .yn-help__btn:focus-visible{outline:2px solid var(--ink);outline-offset:2px}
.yn-help .yn-help__hint{font-size:13px;color:var(--muted);line-height:1.7}
/* 注入块的标题降级为 P（避免 h1→h3 跳级），保留视觉层级 */
.yn-help .yn-help__bt{margin:0 0 8px;font-size:17px;font-weight:800;line-height:1.35;letter-spacing:-.015em;color:var(--ink)}
.yn-help .yn-help__input{height:52px!important}
@media (max-width:640px){
  .yn-help .yn-help__form{flex-direction:column;align-items:stretch!important}
  .yn-help .yn-help__btn{width:100%!important}
}
@media (prefers-reduced-motion:reduce){
  .yn-help .yn-help__btn{transition:none}
}

/* 卡片标题由 h3 改为 p（列表页 h1 后无 h2，h3 属跳级）；保持原有字号/字重/间距 */
.yn-pcard__title{
  font-size:16.5px;
  line-height:1.45;
  margin:12px 0 0;
  font-weight:700;
  letter-spacing:-.01em;
  color:var(--ink);
}
.yn-pcard__title a{color:inherit}
.yn-pcard__title a:hover{color:var(--brand-d)}
@media (max-width:640px){ .yn-pcard__title{font-size:15px} }
/* 帮助页导航块标题（h3 仍在原生页脚/侧栏区出现）→ 统一视觉，不改变语义 */

/* 页脚栏目标题由 h3 降为 p（页脚不应产生 h1→h3 跳级），保留原视觉 */
.yn-footer-inner .yn-fcol__t,
.yn-footer-inner .fgrid h3{
  margin:0 0 12px;
  font-size:13px;
  font-weight:800;
  letter-spacing:.08em;
  color:rgba(255,255,255,.62);
  text-transform:uppercase;
}
.yn-footer-inner .fgrid a{display:block;padding:5px 0;font-size:13.5px}
/* ============================================================
   V9 · 导航与页脚深度美化（2026-10-18）
   范围：桌面导航 / 下拉菜单 / 移动端抽屉 / 页脚排版
   原则：只覆盖样式，不改 Helix 结构；触控目标 ≥44px
   ============================================================ */

/* ---------- 首页/内页共用：页头基础 ---------- */
#sp-header{
  background:#fff!important;
  box-shadow:0 1px 0 rgba(16,32,44,.07);
  transition:box-shadow .25s ease;
  min-height:72px;
}
#sp-header .container-inner{min-height:72px;display:flex;align-items:center}
#sp-header .row{align-items:center;width:100%;min-height:72px}

/* 粘性头（Helix sticky 开启后生效） */
.sticky-header #sp-header,
#sp-header.sticky-active{
  box-shadow:0 6px 24px -12px rgba(16,32,44,.28);
}

/* Logo 尺寸与留白 */
#sp-logo .logo{display:flex;align-items:center}
#sp-logo .logo-image{height:36px;width:auto;display:block}
#sp-logo .sp-column{align-items:center}
@media (max-width:640px){
  #sp-logo .logo-image{height:30px}
  #sp-header,#sp-header .container-inner,#sp-header .row{min-height:62px}
}

/* ---------- 桌面导航 ---------- */
#sp-menu .sp-megamenu-parent{gap:2px}
#sp-menu .sp-megamenu-parent > li.sp-menu-item > a,
#sp-menu .sp-megamenu-parent > li.sp-menu-item > span.sp-menu-separator{
  position:relative;
  display:inline-flex;
  align-items:center;
  height:44px;
  padding:0 15px;
  margin:0;
  font-size:15px;
  font-weight:500;
  letter-spacing:.01em;
  color:#33414E!important;
  background:transparent;
  transition:color .18s ease;
}
/* 下划线：从左展开 */
#sp-menu .sp-megamenu-parent > li.sp-menu-item > a::after,
#sp-menu .sp-megamenu-parent > li.sp-menu-item > span.sp-menu-separator::after{
  content:"";
  position:absolute;
  left:15px;right:15px;bottom:10px;
  height:2px;
  border-radius:2px;
  background:var(--brand);
  transform:scaleX(0);
  transform-origin:left center;
  transition:transform .26s cubic-bezier(.3,.8,.3,1);
}
#sp-menu .sp-megamenu-parent > li.sp-menu-item > a:hover,
#sp-menu .sp-megamenu-parent > li.sp-menu-item > span.sp-menu-separator:hover{
  color:#0A6E92!important;
}
#sp-menu .sp-megamenu-parent > li.sp-menu-item > a:hover::after,
#sp-menu .sp-megamenu-parent > li.sp-menu-item > span.sp-menu-separator:hover::after,
#sp-menu .sp-megamenu-parent > li.active > a::after,
#sp-menu .sp-megamenu-parent > li.current-item > a::after{
  transform:scaleX(1);
}
#sp-menu .sp-megamenu-parent > li.active > a,
#sp-menu .sp-megamenu-parent > li.current-item > a{
  color:#0A6E92!important;
  font-weight:600!important;
}
/* 移除 Helix 默认高亮底 */
#sp-menu .sp-megamenu-parent > li.sp-menu-item.active > a,
#sp-menu .sp-megamenu-parent > li.sp-menu-item.current-item > a,
#sp-menu .sp-megamenu-parent > li:hover > a{background:transparent!important}

/* ---------- 下拉菜单 ---------- */
#sp-menu .sp-dropdown{
  border:0;
  border-radius:12px;
  overflow:hidden;
  box-shadow:0 18px 44px -18px rgba(16,32,44,.32),0 2px 8px rgba(16,32,44,.06);
  padding:6px 0;
  margin-top:8px;
  background:#fff;
}
#sp-menu .sp-dropdown-inner{padding:0}
#sp-menu .sp-dropdown-items .sp-menu-item > a{
  display:block;
  padding:10px 18px;
  font-size:14.5px;
  line-height:1.45;
  color:#3C4650!important;
  border-radius:8px;
  margin:1px 6px;
  transition:background .16s ease,color .16s ease,padding-left .16s ease;
}
#sp-menu .sp-dropdown-items .sp-menu-item > a:hover{
  background:rgba(0,165,221,.07);
  color:#0A6E92!important;
  padding-left:22px;
}
/* 二级下拉 */
#sp-menu .sp-dropdown-sub{margin-top:0;border-radius:10px}

/* ---------- 移动端：汉堡按钮 ---------- */
#offcanvas-toggler,
.offcanvas-toggler,
.offcanvas-toggler-secondary{
  display:inline-flex!important;
  align-items:center;
  justify-content:center;
  width:44px!important;
  height:44px!important;
  min-width:44px;
  border-radius:10px;
  padding:0;
  margin-left:6px;
}
#offcanvas-toggler:hover,
.offcanvas-toggler:hover{background:rgba(0,165,221,.08)}
#offcanvas-toggler .burger-icon span,
.offcanvas-toggler .burger-icon span{
  display:block;
  width:20px;
  height:2px;
  margin:3px auto;
  border-radius:2px;
  background:#33414E;
  transition:background .2s;
}
#offcanvas-toggler:hover .burger-icon span{background:#0A6E92}

/* ---------- 移动端抽屉面板 ---------- */
.offcanvas-menu{
  background:#fff;
  box-shadow:-24px 0 60px -24px rgba(16,32,44,.35);
}
.offcanvas-menu .offcanvas-inner{padding:0 4px 28px}
/* 顶部品牌条 */
.offcanvas-menu > .d-flex:first-child{
  padding:14px 16px!important;
  border-bottom:1px solid rgba(16,32,44,.08);
  background:linear-gradient(180deg,#F7FAFB 0%,#fff 100%);
}
.offcanvas-menu .close-offcanvas{
  display:inline-flex!important;
  align-items:center;
  justify-content:center;
  width:44px!important;
  height:44px!important;
  border-radius:10px;
  color:#33414E;
}
.offcanvas-menu .close-offcanvas:hover{background:rgba(0,165,221,.08);color:#0A6E92}
.offcanvas-menu .close-offcanvas .burger-icon span{
  display:block;width:18px;height:2px;margin:3px auto;border-radius:2px;background:currentColor;
}
/* 一级项 */
.offcanvas-menu .mod-menu > li{margin:0;padding:0}
.offcanvas-menu .mod-menu > li > a,
.offcanvas-menu .mod-menu > li > span{
  display:flex;
  align-items:center;
  min-height:48px;
  padding:12px 14px;
  margin:0 6px;
  border-radius:10px;
  font-size:16px;
  font-weight:600;
  color:#2B3843!important;
  transition:background .16s,color .16s;
}
.offcanvas-menu .mod-menu > li > a:hover,
.offcanvas-menu .mod-menu > li > span:hover{
  background:rgba(0,165,221,.07);
  color:#0A6E92!important;
}
/* 当前页 */
.offcanvas-menu .mod-menu > li.current > a,
.offcanvas-menu .mod-menu > li.active > a{
  color:#0A6E92!important;
  font-weight:700!important;
  background:rgba(0,165,221,.08);
  box-shadow:inset 3px 0 0 var(--brand);
}
/* 二级列表：缩进 + 细线 */
.offcanvas-menu .mod-menu__sub{
  margin:2px 6px 8px 20px;
  padding:2px 0 2px 12px;
  border-left:1px solid rgba(16,32,44,.12);
}
.offcanvas-menu .mod-menu__sub > li > a,
.offcanvas-menu .mod-menu__sub > li > span{
  display:block;
  min-height:42px;
  padding:10px 10px;
  border-radius:8px;
  font-size:14.5px;
  font-weight:500;
  color:#4A5763!important;
}
.offcanvas-menu .mod-menu__sub > li > a:hover{
  background:rgba(0,165,221,.06);
  color:#0A6E92!important;
}
/* 分组标题 */
.offcanvas-menu .menu-divider > span{
  font-size:12.5px;
  font-weight:800;
  letter-spacing:.08em;
  color:#8A959F!important;
  text-transform:uppercase;
}

/* ---------- 页脚 ---------- */
footer#sp-footer{
  background:linear-gradient(180deg,#0E2431 0%,#0A1B25 100%)!important;
  color:#9AA8B3;
  padding:62px 0 26px;
  font-size:14.5px;
  margin-top:0;
}
footer#sp-footer .container,
footer#sp-footer .container-inner{max-width:1170px;padding-left:24px;padding-right:24px}

.yn-footer-inner{display:block}
.yn-footer-inner .fgrid{
  display:grid;
  grid-template-columns:2fr 1.1fr 1.1fr 1.1fr;
  gap:48px;
  padding-bottom:40px;
  border-bottom:1px solid rgba(255,255,255,.09);
  align-items:start;
}
.yn-footer-inner .yn-foot-logo{
  height:46px;width:auto;display:block;margin-bottom:6px;
}
.yn-footer-inner .fgrid > div:first-child p{
  color:#8FA0AC;
  line-height:1.75;
  font-size:13.8px;
  max-width:36ch;
}
/* 栏目标题 + 品牌蓝短线 */
.yn-footer-inner .yn-fcol__t{
  display:block;
  margin:0 0 18px;
  padding-bottom:10px;
  position:relative;
  font-size:13px;
  font-weight:800;
  letter-spacing:.1em;
  color:#F2F6F8!important;
  text-transform:none;
}
.yn-footer-inner .yn-fcol__t::after{
  content:"";
  position:absolute;
  left:0;bottom:0;
  width:22px;height:2px;border-radius:2px;
  background:var(--brand);
}
/* 页脚链接 */
.yn-footer-inner .fgrid a{
  display:block;
  padding:7px 0;
  margin:0;
  font-size:13.8px;
  line-height:1.5;
  color:#9AA8B3!important;
  text-decoration:none;
  transition:color .18s ease,transform .18s ease;
  will-change:transform;
}
.yn-footer-inner .fgrid a:hover{
  color:#fff!important;
  transform:translateX(4px);
}
.yn-footer-inner .fgrid a:focus-visible{
  outline:2px solid var(--brand);
  outline-offset:3px;
  border-radius:4px;
}
/* 底部版权条 */
.yn-footer-inner .fcopy{
  padding-top:22px;
  display:flex;
  justify-content:space-between;
  align-items:center;
  flex-wrap:wrap;
  gap:10px 20px;
  font-size:12.8px;
  color:#78868F;
  line-height:1.6;
}
.yn-footer-inner .fcopy a{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:2px 0;
  color:#78868F!important;
  transition:color .18s;
}
.yn-footer-inner .fcopy a:hover{color:#C4D0D8!important}
.yn-footer-inner .fcopy .fsep{opacity:.35;margin:0 2px}

/* ---------- 响应式 ---------- */
@media (max-width:1024px){
  .yn-footer-inner .fgrid{grid-template-columns:1fr 1fr 1fr;gap:36px}
  .yn-footer-inner .fgrid > div:first-child{grid-column:1 / -1}
}
@media (max-width:768px){
  .yn-footer-inner .fgrid{grid-template-columns:1fr 1fr;gap:28px}
  footer#sp-footer{padding:48px 0 22px}
}
@media (max-width:560px){
  .yn-footer-inner .fgrid{grid-template-columns:1fr;gap:26px}
  .yn-footer-inner .fcopy{flex-direction:column;align-items:flex-start;gap:8px}
  #sp-menu .sp-megamenu-parent{display:none!important}
}
/* 大屏：导航项间距略增 */
@media (min-width:1200px){
  #sp-menu .sp-megamenu-parent > li.sp-menu-item > a,
  #sp-menu .sp-megamenu-parent > li.sp-menu-item > span.sp-menu-separator{padding:0 17px;font-size:15.5px}
  #sp-menu .sp-megamenu-parent > li.sp-menu-item > a::after,
  #sp-menu .sp-megamenu-parent > li.sp-menu-item > span.sp-menu-separator::after{left:17px;right:17px}
}

/* ---------- 无障碍：减少动效 ---------- */
@media (prefers-reduced-motion:reduce){
  #sp-menu .sp-megamenu-parent > li.sp-menu-item > a::after,
  #sp-menu .sp-megamenu-parent > li.sp-menu-item > span.sp-menu-separator::after,
  .yn-footer-inner .fgrid a,
  #sp-header{transition:none!important}
  .yn-footer-inner .fgrid a:hover{transform:none}
}

/* ============================================================
   V9.1 · 流水线审计修复（2026-10-18）
   1) 页脚链接 35px → 43/48px（触控目标）
   2) 顶栏链接 16px → 32px（可点）
   3) 抽屉关闭态移出视口，避免横向溢出误报
   ============================================================ */

/* 1) 页脚链接增高 */
.yn-footer-inner .fgrid a{
  padding:11px 0;
  min-height:43px;
  display:flex;
  align-items:center;
}
.yn-footer-inner .fcopy a{
  min-height:32px;
  display:inline-flex;
  align-items:center;
  padding:4px 0;
}
@media (max-width:560px){
  .yn-footer-inner .fgrid a{padding:13px 0;min-height:48px}
}

/* 2) 顶部品牌条链接：补足点击高度 */
.topstrip a{
  display:inline-flex;
  align-items:center;
  min-height:32px;
  padding:0 2px;
}
.topstrip .tl{display:flex;flex-wrap:wrap;align-items:center;gap:2px}
.topstrip .tr{display:flex;align-items:center}
.topstrip .sep{opacity:.45;margin:0 8px;display:inline-flex;align-items:center;min-height:32px}

/* 3) 移动端抽屉：关闭态移出视口（不改 Helix 动效，仅在未展开时归位） */
.offcanvas-menu:not(.offcanvas-menu-active):not(.open){
  left:100%!important;
}
@media (max-width:1200px){
  .offcanvas-menu:not(.offcanvas-menu-active):not(.open){
    left:100%!important;
    visibility:hidden;
  }
}