/* ============================================
嘉品仪器 s.jp17.com - 主样式表 v2.0
设计规范：专业工业蓝 + 洁净白 + 强调橙
优化：紧凑布局、统一卡片、mega menu、等高网格
============================================ */
:root {
--primary: #A67C52;
--primary-light: #8A6540;
--primary-dark: #3E342E;
--accent: #B85C38;
--accent-light: #D4764E;
--bg: #f8fafc;
--bg-white: #ffffff;
--bg-light: #f1f5f9;
--text: #1e293b;
--text-light: #64748b;
--text-lighter: #94a3b8;
--border: #e2e8f0;
--border-light: #f1f5f9;
--success: #16a34a;
--danger: #dc2626;
--radius: 12px;
--radius-sm: 8px;
--shadow: 0 2px 8px rgba(0,0,0,.05);
--shadow-lg: 0 8px 24px rgba(0,0,0,.1);
--transition: all .2s ease;
--max-width: 1400px;
--header-h: 64px;
}
/* Reset */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;overflow-x:clip}
body{font-family:'PingFang SC','Microsoft YaHei','Helvetica Neue',sans-serif;font-size:15px;line-height:1.65;color:var(--text);background:var(--bg);overflow-x:clip}
a{color:var(--primary-light);text-decoration:none;transition:var(--transition)}
a:hover{color:var(--primary-dark)}
img{max-width:100%;height:auto;display:block}
ul,ol{list-style:none}
.container{max-width:var(--max-width);margin:0 auto;padding:0 20px}
/* Top Bar */
.top-bar{background:var(--primary-dark);color:#fff;font-size:12px;padding:5px 0}
.top-bar .container{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap}
.top-bar a{color:var(--accent-light);margin:0 4px}
.top-bar a:hover{color:#fff}
.top-bar .header-member-links .auth-link{
background:rgba(255,255,255,.15);
color:#fff;
padding:2px 10px;
border-radius:4px;
font-weight:700;
margin:0 2px;
border:1px solid rgba(255,255,255,.25);
transition:all .2s
}
.top-bar .header-member-links .auth-link:hover{
background:#fff;
color:var(--primary);
border-color:#fff;
box-shadow:0 2px 8px rgba(0,0,0,.15)
}
/* #1045 顶栏管理员快捷按钮：编辑/删除 与「管理」开关同风格（只在产品页超管可见） */
.top-bar .admin-edit-btn{
display:inline-flex;align-items:center;gap:2px;
background:rgba(255,255,255,.15);color:#fff;
padding:2px 10px;border-radius:4px;margin:0 2px;
border:1px solid rgba(255,255,255,.25);
font-size:12px;line-height:1.7;font-weight:700;
cursor:pointer;text-decoration:none;transition:all .2s
}
.top-bar .admin-edit-btn:hover{background:#fff;color:var(--primary);border-color:#fff}
.header-phone small{opacity:.7;font-size:11px}
/* Header */
.site-header{background:var(--bg-white);box-shadow:0 1px 3px rgba(0,0,0,.06);position:sticky;top:0;z-index:100}
.header-main{display:flex;align-items:center;justify-content:space-between;height:var(--header-h);gap:16px}
.header-actions{display:flex;align-items:center;gap:10px;flex-shrink:0}
.logo{display:flex;flex-direction:row;align-items:center;gap:10px;line-height:1.15;color:var(--primary)!important}
.logo strong{font-size:20px;font-weight:700;letter-spacing:.5px}
.logo small{font-size:10px;color:var(--text-light);letter-spacing:1.5px;text-transform:uppercase}
/* Navigation */
.main-nav{flex:1;display:flex;justify-content:center;position:relative}
.nav-list{display:flex;align-items:center;gap:0;border:2px solid var(--primary);border-radius:6px;background:#fff}
.nav-list > li{position:relative}
.nav-list > li:not(:last-child){border-right:1px solid var(--primary)}
.nav-list > li > a{display:block;padding:9px 11px;font-size:14px;font-weight:700;color:var(--primary);font-family:"Microsoft YaHei","PingFang SC",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;transition:var(--transition);white-space:nowrap} /* 2026-09-12 格宽 16→11px，全站搜索/工作台拉回容器内 */
.nav-list > li:first-child > a{border-top-left-radius:4px;border-bottom-left-radius:4px}
.nav-list > li:last-child > a{border-top-right-radius:4px;border-bottom-right-radius:4px}
.nav-list > li > a:hover,
.nav-list > li > a:focus{background:#e6f4ff;color:#8A6540}
.nav-list > li:hover > a{background:#e6f4ff;color:#8A6540}
.nav-list > li > a.active{background:var(--primary);color:#fff}
.nav-list > li:hover > a.active{background:#e6f4ff !important;color:#8A6540 !important}
.nav-toggle{display:none;background:none;border:none;font-size:24px;cursor:pointer;color:var(--text);padding:8px}
/* 移动端专用元素（如抽屉底部操作区）默认在 PC 隐藏，移动端断点内覆盖显示 */
.only-mobile,.m-drawer-actions{display:none}
/* Mega Menu */
.has-submenu{position:relative}
.has-submenu > a::after{content:' ▾';font-size:9px}
.submenu{display:none;position:absolute;top:100%;left:50%;transform:translateX(-50%);background:var(--bg-white);min-width:200px;box-shadow:var(--shadow-lg);border-radius:var(--radius-sm);padding:8px 0;z-index:200;border:1px solid var(--border)}
.has-submenu:hover .submenu{display:block}
.submenu li a{display:block;padding:9px 18px;font-size:13px;color:var(--text);white-space:nowrap}
.submenu li a:hover{background:var(--bg-light);color:var(--primary-light)}
/* Mega submenu for industry */
.submenu.mega{min-width:880px;padding:16px}
.submenu.mega .mega-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:8px 20px}
.submenu.mega .mega-group h4{font-size:12px;text-transform:uppercase;color:var(--accent);margin-bottom:4px;padding-bottom:4px;border-bottom:1px solid var(--border-light);letter-spacing:1px}
.submenu.mega .mega-group a{display:block;padding:5px 0;font-size:13px;color:var(--text)}
.submenu.mega .mega-group a:hover{color:var(--primary-light)}
/* Buttons */
.btn{display:inline-block;padding:10px 24px;border-radius:var(--radius-sm);font-size:14px;font-weight:600;text-align:center;cursor:pointer;transition:var(--transition);border:none}
.btn-primary{background:linear-gradient(135deg,#8A6540,#5F4527);color:#fff}
.btn-primary:hover{transform:translateY(-1px);box-shadow:0 4px 16px rgba(138,101,64,.4);color:#fff}
.btn-accent{background:linear-gradient(135deg,var(--accent),#9C4A28);color:#fff}
.btn-accent:hover{transform:translateY(-1px);box-shadow:0 4px 16px rgba(184,92,56,.4);color:#fff}
.btn-outline{border:2px solid var(--primary-light);color:var(--primary-light);background:transparent}
/* 移动端专属按钮：桌面强制隐藏（.btn 会覆盖 .only-mobile 的 display:none，需更高优先级） */
.btn.only-mobile{display:none}
.btn-outline:hover{background:var(--primary-light);color:#fff}
.btn-sm{padding:6px 16px;font-size:13px}
.btn-header-search{background:linear-gradient(135deg,#f0b429,#c98a00);color:#fff;box-shadow:0 2px 8px rgba(212,160,23,.35)}
.btn-header-search:hover{transform:translateY(-1px);box-shadow:0 4px 14px rgba(212,160,23,.5);color:#fff}
/* Page Header - compact */
.page-header{background:linear-gradient(135deg,var(--primary),var(--primary-dark));color:#fff;padding:40px 0;text-align:center;position:relative}
.page-header::after{content:'';position:absolute;bottom:0;left:0;right:0;height:3px;background:linear-gradient(90deg,var(--accent),var(--primary-light),var(--accent))}
.page-header h1{font-size:30px;font-weight:700;margin-bottom:8px}
.page-header p{font-size:15px;opacity:.9;max-width:700px;margin:0 auto}
.page-header-subtitle{font-size:17px;font-weight:600;opacity:.96;max-width:760px;margin:0 auto 4px;letter-spacing:.5px}
/* Breadcrumb */
.breadcrumb{background:var(--bg-white);border-bottom:1px solid var(--border-light);padding:0;font-size:13px;color:var(--text-light)}
.breadcrumb .container{padding-top:8px;padding-bottom:8px}
.breadcrumb ol{display:flex;flex-wrap:wrap;gap:2px}
.breadcrumb li::after{content:'/';margin:0 6px;color:var(--text-lighter)}
.breadcrumb li:last-child::after{display:none}
.breadcrumb a{color:var(--primary-light)}
/* Hero Section - compact */
.hero{background:linear-gradient(135deg,var(--primary),var(--primary-dark));color:#fff;padding:60px 0 50px;position:relative;overflow:hidden}
.hero::before{content:'';position:absolute;inset:0;background:url("data:image/svg+xml,%3Csvg width='60' height='60' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M30 5v50M5 30h50' stroke='rgba(255,255,255,.03)' stroke-width='1'/%3E%3C/svg%3E")}
.hero .container{position:relative;z-index:1}
.hero-content{max-width:700px}
.hero h1{font-size:38px;font-weight:800;line-height:1.3;margin-bottom:16px}
.hero h1 span{color:var(--accent-light)}
.hero p{font-size:16px;opacity:.9;margin-bottom:24px;line-height:1.6}
.hero-cta{display:flex;gap:12px;flex-wrap:wrap}
.hero-stats{display:flex;gap:36px;margin-top:30px}
.hero-stats div{text-align:center}
.hero-stats strong{display:block;font-size:28px;font-weight:800;color:var(--accent-light)}
.hero-stats span{font-size:12px;opacity:.8}
/* Section */
.section{padding:50px 0}
.section + .section{border-top:1px solid var(--border-light)}
.section-title{text-align:center;margin-bottom:36px}
.section-title h2{font-size:26px;color:var(--primary);margin-bottom:8px}
.section-title p{color:var(--text-light);font-size:15px;max-width:600px;margin:0 auto}
/* Cards Grid */
.cards-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(340px,1fr));gap:20px}
.card{background:var(--bg-white);border-radius:var(--radius);box-shadow:var(--shadow);overflow:hidden;transition:var(--transition);border:1px solid var(--border-light);height:100%}
.card:hover{transform:translateY(-2px);box-shadow:var(--shadow-lg)}
.card-img{height:180px;overflow:hidden;background:var(--bg-light);display:flex;align-items:center;justify-content:center}
.card-img img{width:100%;height:100%;object-fit:cover}
.card-body{padding:20px;display:flex;flex-direction:column}
.card h3{font-size:16px;color:var(--primary);margin-bottom:8px;line-height:1.4}
.card h3 a{color:inherit}
.card p{font-size:13px;color:var(--text-light);line-height:1.6;flex:1}
.card-meta{display:flex;gap:16px;font-size:12px;color:var(--text-lighter);margin-top:10px;padding-top:10px;border-top:1px solid var(--border-light)}
.card-tag{display:inline-block;background:#F3ECDD;color:var(--primary-light);font-size:11px;padding:2px 8px;border-radius:10px;margin-bottom:6px}
.card-cat{display:inline-block;background:#fef3c7;color:#7C4226;font-size:11px;padding:2px 8px;border-radius:10px;margin-bottom:6px}
/* Industry cards */
.industry-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:16px}
.industry-card{background:var(--bg-white);border-radius:var(--radius);padding:24px 20px;box-shadow:var(--shadow);text-align:center;transition:var(--transition);border-top:3px solid transparent;height:100%}
.industry-card:hover{transform:translateY(-2px);box-shadow:var(--shadow-lg);border-top-color:var(--primary-light)}
.industry-card .icon{font-size:32px;margin-bottom:10px}
.industry-card h3{font-size:16px;color:var(--primary);margin-bottom:8px}
.industry-card p{font-size:13px;color:var(--text-light);line-height:1.5}
.industry-card .more{display:inline-block;margin-top:8px;color:var(--primary-light);font-weight:600;font-size:13px}
.industry-tag{display:inline-block;background:var(--bg-light);font-size:11px;padding:2px 8px;border-radius:10px;color:var(--text-light);margin-bottom:6px}
/* Solutions Cards - distinct style */
.solutions-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:20px}
.solution-card{background:var(--bg-white);border-radius:var(--radius);padding:24px;box-shadow:var(--shadow);transition:var(--transition);border-left:4px solid transparent;height:100%;display:flex;flex-direction:column}
.solution-card:hover{transform:translateY(-2px);box-shadow:var(--shadow-lg);border-left-color:var(--accent)}
.solution-card .icon{font-size:28px;margin-bottom:8px}
.solution-card h3{font-size:16px;color:var(--primary);margin-bottom:8px;line-height:1.4}
.solution-card p{font-size:13px;color:var(--text-light);line-height:1.5;flex:1}
.solution-card .more{display:inline-block;margin-top:10px;color:var(--accent);font-weight:600;font-size:13px}
/* Industry Group Section */
.industry-group{margin-bottom:36px}
.industry-group h3{font-size:18px;color:var(--primary);margin-bottom:12px;padding:8px 16px;background:linear-gradient(90deg,var(--bg-light),transparent);border-radius:6px;display:flex;align-items:center;gap:8px}
.industry-group h3 .count{font-size:12px;background:var(--primary-light);color:#fff;padding:1px 8px;border-radius:10px;font-weight:400}
/* Article page */
.article-content{max-width:800px;margin:0 auto;padding:30px 0}
.article-header{margin-bottom:28px}
.article-header h1{font-size:28px;color:var(--primary);line-height:1.4;margin-bottom:12px}
.article-meta{display:flex;gap:16px;color:var(--text-light);font-size:12px;flex-wrap:wrap}
.article-body{font-size:15px;line-height:1.85;color:var(--text)}
.article-body h2{font-size:22px;color:var(--primary);margin:28px 0 12px;padding-left:12px;border-left:4px solid var(--primary-light)}
.article-body h3{font-size:17px;color:var(--primary-light);margin:20px 0 10px}
.article-body p{margin-bottom:14px}
.article-body ul,.article-body ol{margin-bottom:14px;padding-left:24px}
.article-body li{margin-bottom:6px;list-style:disc}
.article-body ol li{list-style:decimal}
.article-body strong{color:var(--primary-dark)}
.article-body .key-label{display:inline-block;background:rgba(184,92,56,.1);color:#9a6b1f;padding:2px 8px;border-radius:4px;font-size:13px;margin-right:4px}
.article-body .standard{display:inline-block;background:rgba(13,45,78,.08);color:var(--primary-dark);padding:1px 6px;border-radius:4px;font-size:13px;font-weight:600;margin:0 2px;white-space:nowrap}
.article-body p+h2,.article-body p+h3{margin-top:32px}
.article-body h2+h3{margin-top:14px}
.article-body table{width:100%;border-collapse:collapse;margin:14px 0;font-size:13px}
.article-body th{background:var(--primary-light);color:#fff;padding:8px 10px;text-align:left}
.article-body td{padding:8px 10px;border-bottom:1px solid var(--border)}
.article-body tr:nth-child(even){background:var(--bg-light)}
.article-body img{max-width:100%;height:auto;border-radius:8px;margin:10px 0}
.article-body a{color:var(--primary-light);text-decoration:none;border-bottom:1px dashed var(--border)}
.article-body a:hover{color:var(--primary);border-bottom-color:var(--primary)}
.article-body h4{font-size:16px;color:var(--primary-dark);margin:16px 0 8px}
.article-body h5{font-size:15px;color:var(--primary-dark);margin:14px 0 6px}
.article-body h6{font-size:14px;color:var(--text);margin:12px 0 6px;font-weight:600}
.article-body sup{font-size:11px;vertical-align:super;color:var(--primary-light)}
.article-body sub{font-size:11px;vertical-align:sub}
.article-body blockquote{margin:16px 0;padding:14px 20px;background:var(--bg-light);border-left:4px solid var(--accent);border-radius:0 8px 8px 0;font-size:14px;color:var(--text-light)}
.article-body blockquote p{margin:0 0 8px}
.article-body blockquote p:last-child{margin:0}
.article-body blockquote footer{color:var(--text-light);font-size:13px;margin-top:6px}
.article-body details{border:1px solid var(--border);border-radius:8px;padding:12px 16px;margin:10px 0;background:var(--bg-white)}
.article-body details+details{margin-top:8px}
.article-body summary{font-weight:700;color:var(--primary-dark);cursor:pointer;font-size:15px}
.article-body details[open] summary{margin-bottom:8px}
.article-body hr{border:none;border-top:1px solid var(--border);margin:20px 0}
.article-body div{margin:0}
.article-body ol ol,.article-body ul ul,.article-body ol ul,.article-body ul ol{margin:6px 0 6px 20px}
.article-body strong em,.article-body em strong{font-style:italic;font-weight:700}
.article-body pre{background:#1e293b;color:#e2e8f0;padding:14px 18px;border-radius:8px;overflow-x:auto;font-size:13px;line-height:1.6;margin:14px 0}
.article-body code{background:var(--bg-light);color:var(--primary-dark);padding:2px 6px;border-radius:4px;font-size:13px;font-family:'Courier New',monospace}
.article-body pre code{background:none;color:inherit;padding:0}
.article-body figure{margin:16px 0;text-align:center}
.article-body figcaption{font-size:13px;color:var(--text-light);margin-top:6px}
.article-cta{background:linear-gradient(135deg,var(--primary-light),var(--primary));color:#fff;padding:20px 24px;border-radius:var(--radius);margin-top:28px;text-align:center}
.article-cta strong{display:block;font-size:16px;margin-bottom:6px;color:#fff}
.article-cta a{color:var(--accent-light);font-weight:700}
/* Solution detail reading frame */
.solution-article.article-content{max-width:none;padding:30px 0}
.reading-frame{background:var(--bg-white);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow);padding:32px 56px;max-width:960px;margin:0 auto}
.reading-frame .article-body{font-size:16px;line-height:1.85;color:var(--text)}
.solution-article .engagement-section,.solution-article .article-cta{max-width:960px;margin-left:auto;margin-right:auto}
/* Solution meta bar (仿云平台：方案分类 / 方案摘要 / 适用场景) */
.sol-meta-bar{display:flex;flex-direction:column;gap:14px;grid-column:1/-1;max-width:960px;margin:0 auto 22px;padding:0 56px;box-sizing:border-box}
.sol-meta-row{display:flex;align-items:center;gap:12px;padding:14px 18px;border-radius:10px;border-left:4px solid;background:var(--bg-white);box-shadow:var(--shadow)}
.sol-meta-row.sol-meta-cat{background:#fff7ed;border-left-color:#fb923c}
.sol-meta-row.sol-meta-sum{background:#f5f3ff;border-left-color:#a855f7}
.sol-meta-row.sol-meta-scope{background:#F6F1E5;border-left-color:#B99168}
.sol-meta-label{flex-shrink:0;font-size:15px;font-weight:700;color:var(--primary);letter-spacing:1px;min-width:80px}
.sol-meta-chips{display:flex;flex-wrap:wrap;gap:8px;flex:1;min-width:0}
.sol-meta-chip{display:inline-block;padding:5px 14px;border-radius:16px;font-size:13px;line-height:1.4;color:#475569;background:#f1f5f9;border:1px solid #e2e8f0;transition:all .15s ease;text-decoration:none}
.sol-meta-chip:hover{background:#e2e8f0;color:#1e293b;border-color:#cbd5e1}
.sol-cat-chip{background:#fff7ed;color:#9a3412;border-color:#fed7aa}
.sol-cat-chip:hover{background:#ffedd5;color:#7c2d12;border-color:#fdba74}
.sol-sum-chip{background:#f5f3ff;color:#6b21a8;border-color:#e9d5ff}
.sol-sum-chip:hover{background:#ede9fe;color:#581c87;border-color:#d8b4fe}
.sol-scope-chip{background:#F6F1E5;color:#1e40af;border-color:#bfdbfe}
.sol-scope-empty{color:#94a3b8;font-style:italic}
.sol-meta-tip{font-size:12px;color:#94a3b8;margin-left:8px;white-space:nowrap}
/* 适用场景：按 6 大分组渲染行业 chip 网格（复用产品管理行业池） */
.sol-scope-grid{display:flex;flex-direction:column;gap:10px;flex:1;min-width:0}
.sol-scope-group{background:#f8fafc;border-radius:8px;padding:10px 12px;border:1px solid #e2e8f0}
.sol-scope-group-head{display:flex;align-items:center;gap:8px;font-size:13px;font-weight:700;color:var(--primary);margin-bottom:8px}
.sol-scope-dot{width:10px;height:10px;border-radius:50%;flex-shrink:0}
.sol-scope-group-name{flex:1}
.sol-scope-group-count{font-size:11px;color:#64748b;font-weight:400}
.sol-scope-group .sol-meta-chips{gap:6px}
.sol-scope-group .sol-scope-chip{font-size:12px;padding:4px 10px}
/* 方案列表页内嵌详情：蓝色紧凑信息框 + 正文区 */
.sol-detail-inline{animation:solFadeIn .25s ease}
@keyframes solFadeIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.sol-detail-header{display:flex;flex-direction:column;gap:10px;margin-bottom:18px}
.sol-detail-back{display:inline-flex;align-items:center;gap:6px;width:fit-content;color:#64748b;font-size:13px;text-decoration:none;padding:4px 0;transition:color .15s}
.sol-detail-back:hover{color:#8C6D4F}
.sol-detail-title{font-size:22px;font-weight:700;color:#8C6D4F;line-height:1.35;margin:0}
.sol-meta-compact{background:#F6F1E5;border:1px solid #bfdbfe;border-radius:10px;padding:16px 18px;margin-bottom:22px;display:flex;flex-direction:column;gap:12px}
.sol-meta-c{display:flex;align-items:flex-start;gap:12px}
.sol-meta-c-label{flex-shrink:0;font-size:14px;font-weight:700;color:#1e40af;letter-spacing:.5px;min-width:70px;padding-top:4px}
.sol-meta-c-chips{display:flex;flex-wrap:wrap;gap:8px;flex:1;min-width:0}
.sol-meta-c-chip{display:inline-block;padding:4px 12px;border-radius:16px;font-size:13px;line-height:1.5;text-decoration:none;background:#fff;color:#334155;border:1px solid #cbd5e1;transition:all .15s ease}
.sol-meta-c-chip:hover{background:#F8F4EC;color:#1e40af;border-color:#DCC9A9}
.sol-meta-c-cat-chip{background:#fff7ed;color:#9a3412;border-color:#fed7aa}
.sol-meta-c-cat-chip:hover{background:#ffedd5;color:#7c2d12;border-color:#fdba74}
.sol-meta-c-sum-chip{background:#f5f3ff;color:#6b21a8;border-color:#e9d5ff}
.sol-meta-c-sum-chip:hover{background:#ede9fe;color:#581c87;border-color:#d8b4fe}
.sol-meta-c-scope-chip{background:#fff;color:#1e40af;border-color:#DCC9A9}
.sol-meta-c-scope-chip:hover{background:#F8F4EC;border-color:#C8A86A}
.sol-detail-reading{background:#fff;border:1px solid #e2e8f0;border-radius:10px;padding:28px 32px;box-shadow:0 1px 3px rgba(0,0,0,.04)}
.sol-detail-reading .article-body{font-size:15px;line-height:1.85;color:#334155}
.sol-detail-reading .article-cta{margin:28px 0 0}
.sol-detail-reading .engagement-section{max-width:none;margin-top:28px}
@media(max-width:768px){
.sol-detail-title{font-size:18px}
.sol-meta-compact{padding:14px}
.sol-meta-c{flex-direction:column;gap:8px}
.sol-meta-c-label{min-width:auto;padding-top:0}
.sol-detail-reading{padding:18px 20px}
.sol-detail-reading .article-body{font-size:14px}
}
/* Sidebar */
.with-sidebar{display:grid;grid-template-columns:1fr 280px;gap:30px;align-items:start}
.sidebar{position:sticky;top:calc(var(--header-h) + 16px)}
.sidebar-widget{background:var(--bg-white);border-radius:var(--radius);padding:20px;box-shadow:var(--shadow);margin-bottom:20px}
.sidebar-widget h4{font-size:15px;color:var(--primary);margin-bottom:14px;padding-bottom:8px;border-bottom:2px solid var(--border)}
.sidebar-widget ul li{margin-bottom:8px;font-size:13px}
.sidebar-widget ul li a{color:var(--text)}
.sidebar-widget ul li a:hover{color:var(--primary-light)}
/* Pagination */
.pagination{display:flex;justify-content:center;gap:6px;margin-top:32px;flex-wrap:wrap}
.pagination a,.pagination span,.pagination .page-item{padding:7px 14px;border-radius:6px;font-size:13px;border:1px solid var(--border);display:inline-block}
.pagination a,.pagination .page-item{color:var(--primary-light)}
.pagination a:hover,.pagination .page-item:hover{background:var(--bg-light)}
.pagination .current,.pagination .page-item.active{background:var(--primary-light);color:#fff;border-color:var(--primary-light)}
.pagination .page-ellipsis{padding:7px 8px;font-size:13px;color:var(--text-lighter)}
/* Contact Page */
.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:30px}
.contact-info{background:var(--bg-white);padding:28px;border-radius:var(--radius);box-shadow:var(--shadow)}
.contact-info h3{color:var(--primary);margin-bottom:14px;font-size:18px}
.contact-info p{margin-bottom:10px;font-size:14px}
.contact-form{background:var(--bg-white);padding:28px;border-radius:var(--radius);box-shadow:var(--shadow)}
.form-group{margin-bottom:16px}
.form-group label{display:block;font-size:13px;font-weight:600;color:var(--text);margin-bottom:4px}
.form-group input,.form-group textarea,.form-group select{width:100%;padding:10px 12px;border:2px solid var(--border);border-radius:6px;font-size:14px;font-family:inherit;transition:var(--transition)}
.form-group input:focus,.form-group textarea:focus,.form-group select:focus{outline:none;border-color:var(--primary-light)}
/* Search */
.search-box{display:flex;gap:8px;margin-bottom:20px}
.search-box input{flex:1;padding:10px 12px;border:2px solid var(--border);border-radius:6px;font-size:14px}
/* CTA Banner */
.cta-banner{background:linear-gradient(135deg,var(--primary-light),var(--primary-dark));color:#fff;padding:40px 0;text-align:center;border-radius:var(--radius);margin:30px 0}
.cta-banner h2{font-size:24px;margin-bottom:8px}
.cta-banner p{font-size:15px;opacity:.9;margin-bottom:20px}
.cta-banner .btn{background:var(--accent);color:var(--primary-dark)}
/* Footer */
.site-footer{background:var(--primary-dark);color:#fff;padding:36px 0 16px;margin-top:40px}
.footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr 1.5fr;gap:22px;margin-bottom:0}
.footer-bottom{text-align:center;padding-top:10px;border-top:1px solid rgba(255,255,255,.1);font-size:12px;opacity:.7}
.footer-tagline{font-size:12.5px;margin-top:6px}
/* Footer Contact Blocks */
.footer-contact .contact-block{margin-bottom:12px;padding-bottom:10px;border-bottom:1px dashed rgba(255,255,255,.1)}
.footer-contact .contact-block:last-of-type{border-bottom:none}
.footer-contact .contact-title{font-weight:600;color:#fff;margin:0 0 2px;font-size:13px}
.footer-contact .contact-hotline{font-size:18px;font-weight:700;margin:2px 0 4px}
.footer-contact .contact-hotline a{color:#D4764E;text-decoration:none}
.footer-contact .contact-hotline a:hover{text-decoration:underline}
.footer-contact .contact-person{margin:3px 0;font-size:13px}
.footer-contact .contact-person a{color:#D4764E;text-decoration:none}
.footer-contact p{margin:1px 0;font-size:12px;color:rgba(255,255,255,.8);line-height:1.4}
.footer-contact p a{color:#DCC9A9;text-decoration:none}
.footer-contact p a:hover{text-decoration:underline}
.footer-cert{margin-top:8px;font-size:12px;color:rgba(255,255,255,.65)}
.header-phone a:hover{text-decoration:underline}
/* ===== Product Library ===== */
.search-bar{margin:20px 0}
.search-form{display:flex;gap:8px;max-width:500px}
.search-input{flex:1;padding:10px 14px;border:2px solid var(--border);border-radius:6px;font-size:14px;outline:none;transition:border-color .2s}
.search-input:focus{border-color:var(--primary-light)}
.btn-search{padding:10px 20px;background:var(--primary-light);color:#fff;border:none;border-radius:6px;cursor:pointer;font-size:14px;white-space:nowrap}
.btn-search:hover{background:var(--primary)}
/* Category Tabs */
.category-tabs{display:flex;flex-wrap:wrap;gap:6px;margin:16px 0;padding:12px 14px;background:var(--bg-white);border-radius:var(--radius);border:1px solid var(--border-light)}
.cat-tab-group{position:relative}
.cat-tab{display:inline-block;padding:6px 14px;border-radius:16px;font-size:13px;color:var(--text-light);background:var(--bg-light);border:1px solid transparent;text-decoration:none;transition:all .15s}
.cat-tab:hover,.cat-tab.active{background:var(--primary-light);color:#fff}
.sub-indicator{font-size:9px;margin-left:3px}
.cat-submenu{display:none;position:absolute;top:100%;left:0;z-index:100;background:#fff;border:1px solid var(--border);border-radius:6px;box-shadow:0 4px 12px rgba(0,0,0,.08);min-width:140px;padding:6px 0;margin-top:4px}
.cat-tab-group:hover .cat-submenu{display:block}
.cat-subitem{display:block;padding:7px 14px;font-size:12px;color:var(--text);text-decoration:none;white-space:nowrap}
.cat-subitem:hover{background:#f0f4ff;color:var(--primary-light)}
/* Results Info */
.results-info{padding:8px 0;font-size:13px;color:var(--text-light)}
/* Product Grid - main listing */
.product-grid-main{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:16px;margin:16px 0}
.product-card-main{background:var(--bg-white);border:1px solid var(--border-light);border-radius:var(--radius);overflow:hidden;transition:var(--transition);display:flex;flex-direction:column;height:100%}
.product-card-main:hover{transform:translateY(-2px);box-shadow:var(--shadow-lg);border-color:var(--border)}
.product-card-link{display:flex;flex-direction:column;height:100%;color:inherit;text-decoration:none}
.product-img-wrap{height:180px;display:flex;align-items:center;justify-content:center;background:var(--bg-light);overflow:hidden;padding:12px}
.product-img-wrap img{max-width:100%;max-height:100%;object-fit:contain}
.no-image{font-size:48px;color:var(--text-lighter)}
.product-info{padding:14px 16px;flex:1;display:flex;flex-direction:column}
.product-info h3{font-size:15px;color:var(--text);margin-bottom:6px;line-height:1.4;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.product-model,.product-brand{font-size:12px;color:var(--text-light);margin-bottom:2px}
.product-cat{font-size:11px;color:var(--text-lighter);margin-bottom:4px}
.product-specs-preview{font-size:12px;color:var(--text-light);line-height:1.5;flex:1;overflow:hidden;max-height:60px}
.product-price-action{display:flex;justify-content:space-between;align-items:center;margin-top:10px;padding-top:10px;border-top:1px solid var(--border-light)}
.price-label{font-size:14px;font-weight:700;color:var(--danger)}
.btn-detail{font-size:12px;color:var(--primary-light);font-weight:600}
.empty-state{grid-column:1/-1;text-align:center;padding:60px 20px;color:var(--text-light)}
/* Product detail page */
.product-detail-page{padding:20px 0 40px}
.product-detail-header{margin-bottom:24px;background:var(--bg-white);border-radius:var(--radius);padding:24px;box-shadow:var(--shadow)}
/* 产品图库：独立通栏（原左侧图库） */
.pd-gallery-section{background:var(--bg-white);border-radius:var(--radius);padding:20px 24px 24px;box-shadow:var(--shadow);margin-bottom:24px}
.pd-gallery-section .gallery-main{min-height:360px;display:flex;align-items:center;justify-content:center;background:#fff;border-radius:10px;overflow:hidden}
.pd-gallery-section .gallery-main img{max-width:100%;max-height:520px;object-fit:contain}
.pd-gallery-section.single-image .gallery-main img{margin:0 auto}
.pd-gallery-section .gallery-thumbs{display:flex;gap:10px;flex-wrap:wrap;justify-content:center;margin-top:16px}
.pd-gallery-section .gallery-thumb{width:72px;height:72px;object-fit:contain;border:2px solid #e2e8f0;border-radius:8px;cursor:pointer;background:#fff;padding:3px;transition:border-color .15s,box-shadow .15s}
.pd-gallery-section .gallery-thumb:hover{border-color:#94a3b8}
.pd-gallery-section .gallery-thumb.active{border-color:#8A6540;box-shadow:0 0 0 2px rgba(138,101,64,.15)}
/* 兼容旧类名 */
.product-detail-img{display:flex;align-items:center;justify-content:center;background:var(--bg-light);border-radius:8px;min-height:300px;overflow:hidden}
.product-detail-img img{max-width:100%;max-height:320px;object-fit:contain}
.product-detail-img.product-gallery{flex-direction:column;justify-content:flex-start;background:transparent;min-height:0;overflow:visible;padding:0;gap:12px}
.product-detail-img.product-gallery .gallery-main{width:100%;min-height:300px;display:flex;align-items:center;justify-content:center;background:#fff;border-radius:8px;overflow:hidden}
.product-detail-img.product-gallery .gallery-main img{max-width:100%;max-height:340px;object-fit:contain}
.product-detail-img.product-gallery .gallery-thumbs{display:flex;gap:8px;flex-wrap:wrap;justify-content:center;width:100%}
.product-detail-img.product-gallery .gallery-thumb{width:64px;height:64px;object-fit:contain;border:2px solid #e2e8f0;border-radius:6px;cursor:pointer;background:#fff;padding:2px;transition:border-color .15s,box-shadow .15s}
.product-detail-img.product-gallery .gallery-thumb:hover{border-color:#94a3b8}
.product-detail-img.product-gallery .gallery-thumb.active{border-color:#8A6540;box-shadow:0 0 0 2px rgba(138,101,64,.15)}
/* 产品资料（规格书/说明书）全宽区块，评论上方 */
.product-docs-section{margin:24px 0;padding:0;border-radius:14px}
.product-docs{margin:0;padding:20px 24px;background:#fffbeb;border:1px solid #fde68a;border-radius:14px}
.product-docs-title{font-size:16px;font-weight:700;color:#7C4226;margin-bottom:14px}
.docs-btn-row{display:flex;gap:10px;flex-wrap:wrap}
.docs-expand-btn{display:inline-flex;align-items:center;gap:8px;padding:10px 18px;border-radius:10px;font-size:14px;font-weight:600;cursor:pointer;border:1px solid;transition:all .18s;font-family:inherit}
.docs-btn-spec{background:#fff;border-color:#B85C38;color:#7C4226}
.docs-btn-spec:hover,.docs-btn-spec.active{background:#7C4226;border-color:#7C4226;color:#fff}
.docs-btn-manual{background:#fff;border-color:#38bdf8;color:#0369a1}
.docs-btn-manual:hover,.docs-btn-manual.active{background:#0369a1;border-color:#0369a1;color:#fff}
.docs-btn-ebook{background:#fff;border-color:#8b5cf6;color:#6d28d9}
.docs-btn-ebook:hover,.docs-btn-ebook.active{background:#6d28d9;border-color:#6d28d9;color:#fff}
/* 产品资料说明行（默认不自动加载提示，#948） */
.docs-note{margin-top:10px;font-size:12px;color:#a16207;background:#fef9c3;border:1px dashed #fde68a;border-radius:8px;padding:7px 12px;line-height:1.6}
.docs-note a{color:#7C4226;font-weight:600}
/* 产品手册面板权限徽标 */
.docs-ebook-perm{font-size:11px;color:#6d28d9;background:#f5f3ff;border:1px solid #ddd6fe;border-radius:10px;padding:2px 8px;white-space:nowrap;flex-shrink:0}
/* 产品手册无权限锁定占位（不输出任何真实文件 URL，#948） */
.docs-ebook-locked{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;padding:34px 18px;background:#f8fafc;border:1px dashed #cbd5e1;border-radius:10px;cursor:pointer;text-align:center}
.docs-ebook-locked-icon{font-size:34px;line-height:1}
.docs-ebook-locked-text{font-size:14px;font-weight:600;color:#475569}
.docs-ebook-locked-sub{font-size:12px;color:#94a3b8}
.docs-panel-item.locked .docs-ebook-head{display:none}
.docs-panel-item.locked .docs-ebook-locked{background:#fffef5;border-color:#fde68a}
.docs-btn-icon{font-size:16px}
.docs-btn-badge{min-width:20px;height:20px;padding:0 6px;border-radius:10px;background:rgba(0,0,0,.08);font-size:11px;display:inline-flex;align-items:center;justify-content:center}
.docs-btn-spec.active .docs-btn-badge,.docs-btn-manual.active .docs-btn-badge,.docs-btn-ebook.active .docs-btn-badge{background:rgba(255,255,255,.22);color:#fff}
.docs-panel{display:none;margin-top:12px;border-top:1px dashed #fde68a;padding-top:12px}
.docs-panel.open{display:block;animation:docsFadeIn .25s ease}
@keyframes docsFadeIn{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:none}}
.docs-panel-item{border:1px solid #fde68a;background:#fff;border-radius:10px;margin-bottom:10px;overflow:hidden}
.docs-panel-item:last-child{margin-bottom:0}
.docs-panel-head{display:flex;align-items:center;gap:10px;padding:8px 12px;background:#fdf9ec;flex-wrap:wrap}
.docs-panel-name{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:13px;color:#1e293b;font-weight:600}
.docs-size{font-size:11px;color:#94a3b8;flex-shrink:0}
.docs-dl-btn{display:inline-flex;align-items:center;gap:4px;padding:4px 12px;border-radius:6px;font-size:12px;font-weight:600;text-decoration:none;background:#8A6540;color:#fff;flex-shrink:0;transition:background .15s}
.docs-dl-btn:hover{background:#235a91;color:#fff}
.docs-viewer{width:100%}
/* 云展产品手册（在线电子书）iframe */
.docs-ebook-wrap{background:#fff;border-radius:10px;overflow:hidden}
.docs-ebook-head{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:8px 12px;background:#f5f3ff}
.docs-ebook-fullscreen{font-size:13px;color:#8A6540;text-decoration:none;padding:4px 10px;border:1px solid #8A6540;border-radius:6px;background:#fff;white-space:nowrap}
.docs-ebook-fullscreen:hover{background:#8A6540;color:#fff}
.docs-ebook-body{background:#1e293b;padding:10px}
.docs-ebook-frame{width:100%;height:640px;border:0;background:#fff;border-radius:6px;display:block}
@media (max-width:768px){
.docs-ebook-frame{height:480px}
}
.docs-ebook-download-only{padding:30px 20px;text-align:center;background:#f8fafc;border-radius:6px}
.docs-ebook-download-only p{margin:0 0 16px;color:#475569;font-size:14px}
.docs-dl-btn-large{display:inline-flex;align-items:center;gap:6px;padding:12px 28px;border-radius:8px;font-size:15px;font-weight:600;text-decoration:none;background:#8A6540;color:#fff;transition:background .15s}
.docs-dl-btn-large:hover{background:#235a91;color:#fff}
.docs-panel-item.locked .flipbook-wrap{display:none}
.docs-panel-item.locked .docs-viewer{display:flex;align-items:center;justify-content:center;min-height:90px;background:#f8fafc;cursor:pointer;text-align:center}
.docs-panel-item.locked .docs-viewer::before{content:attr(data-hint);font-size:13px;color:#64748b;background:#fff;border:1px dashed #cbd5e1;border-radius:8px;padding:12px 20px}
.docs-panel-item.locked .docs-dl-btn{background:#cbd5e1;color:#fff;pointer-events:none}
/* 2026-09-08 #1100 多文档单阅览窗：下拉选文档，仅显示当前选中项 */
.docs-doc-picker{display:flex;align-items:center;gap:8px;margin:0 0 10px;flex-wrap:wrap}
.docs-doc-picker label{font-size:12.5px;color:#64748b;font-weight:700;white-space:nowrap}
.docs-doc-select{flex:1;min-width:260px;max-width:560px;font-size:13px;padding:7px 10px;border:1px solid #e2e8f0;border-radius:8px;background:#fff;color:#1e293b;cursor:pointer}
.docs-doc-select:focus{outline:none;border-color:#8A6540}
.docs-panel.docs-multi .docs-panel-item{display:none}
.docs-panel.docs-multi .docs-panel-item.cur{display:block}
/* 2026-09-08 #1102 首页三区块手机端独立显隐（DIY visible_m=0 时区块带 hb-m-hide） */
@media(max-width:768px){.hb-m-hide{display:none!important}}
/* 翻页电子书查看器 */
.flipbook-wrap{position:relative;background:#e9e9ec;border-radius:0 0 10px 10px;overflow:hidden}
.flipbook-loading{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);z-index:10;color:#64748b;font-size:14px;display:flex;align-items:center;gap:8px}
.flipbook-spinner{display:inline-block;width:18px;height:18px;border:2.5px solid #cbd5e1;border-top-color:#8A6540;border-radius:50%;animation:flipbookSpin .8s linear infinite}
@keyframes flipbookSpin{to{transform:rotate(360deg)}}
.flipbook-stage{position:relative;min-height:420px;padding:20px;display:flex;justify-content:center;align-items:flex-start;perspective:2000px;overflow:hidden;cursor:grab}
.flipbook-pages{position:relative;width:100%;max-width:760px;margin:0 auto;min-height:200px}
.flipbook-page{position:relative;width:100%;margin:0 auto;background:#fff;box-shadow:0 2px 16px rgba(0,0,0,.18);border-radius:3px;overflow:hidden;transition:transform .5s cubic-bezier(.4,0,.2,1),opacity .5s ease}
.flipbook-page.active{z-index:2}
.flipbook-page.leaving{position:absolute;top:0;left:0;width:100%;z-index:1}
.flipbook-page.enter-from-right{transform:translateX(60%) rotateY(12deg);opacity:0}
.flipbook-page.enter-from-left{transform:translateX(-60%) rotateY(-12deg);opacity:0}
.flipbook-page.leave-left{animation:fbLeaveLeft .5s cubic-bezier(.4,0,.2,1) forwards}
.flipbook-page.leave-right{animation:fbLeaveRight .5s cubic-bezier(.4,0,.2,1) forwards}
@keyframes fbLeaveLeft{to{transform:translateX(-60%) rotateY(-12deg);opacity:0}}
@keyframes fbLeaveRight{to{transform:translateX(60%) rotateY(12deg);opacity:0}}
/* 纵向翻页（滚轮/↑↓键）：新页从底/顶部滑入，旧页上移/下移退场 */
.flipbook-page.enter-from-bottom{transform:translateY(40%);opacity:0}
.flipbook-page.enter-from-top{transform:translateY(-40%);opacity:0}
.flipbook-page.leave-top{animation:fbLeaveTop .5s cubic-bezier(.4,0,.2,1) forwards}
.flipbook-page.leave-bottom{animation:fbLeaveBottom .5s cubic-bezier(.4,0,.2,1) forwards}
@keyframes fbLeaveTop{to{transform:translateY(-40%);opacity:0}}
@keyframes fbLeaveBottom{to{transform:translateY(40%);opacity:0}}
.flipbook-canvas-wrap{display:flex;justify-content:center;align-items:flex-start}
.flipbook-canvas-wrap canvas,.flipbook-canvas-wrap img{max-width:100%;height:auto;display:block}
/* 工具条 */
.flipbook-toolbar{display:flex;align-items:center;justify-content:center;gap:6px;padding:7px 12px;background:#1e293b}
.flipbook-toolbar button{background:#334155;color:#fff;border:0;border-radius:6px;padding:5px 12px;font-size:15px;cursor:pointer;transition:background .15s;min-width:34px;line-height:1.4}
.flipbook-toolbar button:hover:not(:disabled){background:#8A6540}
.flipbook-toolbar button:disabled{opacity:.35;cursor:not-allowed}
.flipbook-toolbar button.flipbook-fullscreen.active{background:#8A6540;color:#fff}
.flipbook-page-info{color:#cbd5e1;font-size:13px;min-width:56px;text-align:center}
.flipbook-zoom-label{color:#cbd5e1;font-size:12px;min-width:42px;text-align:center}
.flipbook-divider{width:1px;height:18px;background:#475569;margin:0 3px}
.flipbook-hint{color:#94a3b8;font-size:12px;margin-left:8px;white-space:nowrap}
/* 全屏阅读：优先原生 Fullscreen API，内嵌 iframe 不支持时回退 CSS 固定定位全屏
布局要点：wrap 改 flex column，toolbar order:-1 提到最前吸顶（sticky 在 overflow 祖先内失效，故不用 sticky）；
stage flex:1 占满剩余视口并居中，页面限高可滚动 —— 放大后超出的页面可滚查看，不再被 overflow:hidden 裁切 */
.flipbook-wrap.flipbook-fs-fallback{position:fixed;inset:0;z-index:9999;border-radius:0;overflow:hidden;background:#e9e9ec;display:flex;flex-direction:column}
.flipbook-wrap.flipbook-fs-fallback .flipbook-toolbar{order:-1;flex-shrink:0;z-index:20}
.flipbook-wrap.flipbook-fs-fallback .flipbook-stage{min-height:0;flex:1;overflow-y:auto;align-items:flex-start}
.flipbook-wrap.flipbook-fs-fallback .flipbook-pages{max-width:900px;max-height:calc(100vh - 96px);overflow:auto}
.flipbook-wrap:fullscreen{background:#e9e9ec;display:flex;flex-direction:column}
.flipbook-wrap:-webkit-full-screen{background:#e9e9ec;width:100%;height:100%;display:flex;flex-direction:column}
.flipbook-wrap:fullscreen .flipbook-toolbar,.flipbook-wrap:-webkit-full-screen .flipbook-toolbar{order:-1;flex-shrink:0;z-index:20}
.flipbook-wrap:fullscreen .flipbook-stage,.flipbook-wrap:-webkit-full-screen .flipbook-stage{min-height:0;flex:1;overflow-y:auto;align-items:flex-start}
.flipbook-wrap:fullscreen .flipbook-pages,.flipbook-wrap:-webkit-full-screen .flipbook-pages{max-width:900px;max-height:calc(100vh - 96px);overflow:auto}
/* 移动端左右翻页大箭头：默认隐藏，≤768px 显示 */
.flipbook-arrow{display:none;position:absolute;top:50%;transform:translateY(-50%);z-index:10;width:44px;height:72px;align-items:center;justify-content:center;background:rgba(0,0,0,.12);color:#fff;border:0;font-size:28px;cursor:pointer;-webkit-tap-highlight-color:transparent;transition:background .15s}
.flipbook-arrow:active{background:rgba(0,0,0,.22)}
.flipbook-arrow:disabled{opacity:.2;pointer-events:none}
.flipbook-arrow-prev{left:0;border-radius:0 8px 8px 0}
.flipbook-arrow-next{right:0;border-radius:8px 0 0 8px}
@media (max-width:768px){
.flipbook-arrow{display:flex}
.flipbook-hint{display:none}
.product-detail-img.product-gallery .gallery-main{min-height:240px}
.product-detail-img.product-gallery .gallery-main img{max-height:280px}
.docs-expand-btn{flex:1;justify-content:center;padding:10px 12px}
.flipbook-stage{min-height:240px;padding:12px}
.flipbook-pages{max-width:100%}
.flipbook-toolbar{gap:4px;padding:6px 8px}
.flipbook-toolbar button{padding:5px 9px;font-size:14px}
.flipbook-zoom-label{font-size:11px;min-width:36px}
.flipbook-toolbar .flipbook-hint{display:none}
}
/* 登录/权限提醒弹窗 */
.docs-login-modal{position:fixed;inset:0;z-index:2000;display:none;align-items:center;justify-content:center;padding:20px}
.docs-login-modal.open{display:flex}
.docs-login-overlay{position:absolute;inset:0;background:rgba(62,52,46,.55);backdrop-filter:blur(2px)}
.docs-login-box{position:relative;background:#fff;border-radius:16px;padding:34px 36px 28px;max-width:400px;width:100%;text-align:center;box-shadow:0 20px 60px rgba(0,0,0,.25);animation:docsFadeIn .25s ease}
.docs-login-close{position:absolute;top:12px;right:14px;background:none;border:none;font-size:24px;line-height:1;color:#94a3b8;cursor:pointer;padding:4px 8px}
.docs-login-close:hover{color:#1e293b}
.docs-login-icon{font-size:46px;margin-bottom:10px}
.docs-login-box h3{font-size:19px;color:#A67C52;margin:0 0 8px}
.docs-login-box p{font-size:13px;color:#64748b;line-height:1.7;margin:0 0 22px}
.docs-login-actions{display:flex;gap:10px;justify-content:center}
.docs-login-btn{flex:1;display:inline-flex;align-items:center;justify-content:center;padding:11px 0;border-radius:9px;font-size:14px;font-weight:600;text-decoration:none;transition:all .15s}
.docs-login-primary{background:#8A6540;color:#fff}
.docs-login-primary:hover{background:#235a91;color:#fff}
.docs-login-ghost{background:#fff;color:#8A6540;border:1px solid #8A6540}
.docs-login-ghost:hover{background:#eef4fb}
.docs-login-sub{margin-top:14px;font-size:12px}
.docs-login-sub a{color:#8A6540;text-decoration:none}
.no-image-large{font-size:18px;color:var(--text-lighter);text-align:center;line-height:1.8}
.product-detail-meta h1{font-size:22px;color:var(--primary);margin-bottom:16px;line-height:1.4}
.meta-row{display:flex;margin-bottom:10px;font-size:14px}
.meta-label{width:60px;color:var(--text-light);flex-shrink:0}
.meta-value{color:var(--text)}
.meta-value a{color:var(--primary);text-decoration:none;transition:color .2s}
.meta-value a:hover{color:var(--accent)}
.brand-link{display:inline-flex;align-items:center;gap:8px;color:var(--primary)!important;font-weight:500}
.brand-link:hover{color:var(--accent)!important}
.brand-logo-sm{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;flex-shrink:0;background:#fff;border-radius:4px;overflow:hidden}
.brand-logo-sm img{max-width:100%;max-height:100%;object-fit:contain}
.product-detail-body{background:var(--bg-white);border-radius:var(--radius);padding:24px;box-shadow:var(--shadow)}
.product-detail-body h2{font-size:18px;color:var(--primary);margin-bottom:14px;padding-bottom:8px;border-bottom:2px solid var(--border-light)}
.related-products{margin-top:30px}
.related-products h2{font-size:18px;color:var(--primary);margin-bottom:16px}
/* ===== Product Detail - 云平台参考排版 ===== */
.product-detail-meta h1{font-size:24px;font-weight:700;color:var(--primary);margin-bottom:8px;line-height:1.35}
.pd-subtitle{display:flex;flex-wrap:wrap;align-items:center;gap:8px 16px;font-size:14px;color:var(--text-light);margin-bottom:14px}
.pd-subtitle-brand,.pd-subtitle-model{display:inline-flex;align-items:center;gap:4px}
.pd-subtitle-brand{color:var(--primary);font-weight:600}
/* 2026-08-19 品牌 logo 链接样式（替代纯文字），当前 detail 页 28 → 19（缩小 1/3） */
.pd-brand-logo-link{display:inline-flex;align-items:center;max-height:19px;vertical-align:middle;line-height:1;transition:opacity .15s}
.pd-brand-logo-link:hover{opacity:.8}
.pd-brand-logo{max-height:19px;width:auto;height:auto;object-fit:contain;border-radius:3px}
.pd-subtitle-brand-text{color:var(--primary);font-weight:600}
.pd-brand-text-link{font-size:12px;color:#8A6540;text-decoration:none;margin-left:4px;font-weight:500}
.pd-brand-text-link:hover{text-decoration:underline;color:#A67C52}
.pd-tag-row{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:16px}
.pd-tag-pill{display:inline-flex;align-items:center;gap:0;border-radius:20px;overflow:hidden;font-size:12px;font-weight:500;border:1px solid}
.pd-tag-fn{background:#F6F1E5;border-color:#bfdbfe;color:#8A6540}
.pd-tag-app{background:#f0fdf4;border-color:#bbf7d0;color:#15803d}
.pd-tag-ind{background:#faf5ff;border-color:#e9d5ff;color:#7e22ce}
.pd-tag-ind .pd-tag-value a{color:inherit;text-decoration:none;font-weight:600}
.pd-tag-ind .pd-tag-value a:hover{text-decoration:underline}
.pd-tag-label{padding:4px 10px;background:rgba(0,0,0,.06);font-weight:600}
.pd-tag-value{padding:4px 12px}
/* 详情页分类标签：完整链路面包屑（多链路可换行，全部为精确分类超链接） */
.pd-tag-pill.pd-tag-cats{align-items:flex-start;border-radius:8px}
.pd-tag-pill.pd-tag-cats .pd-tag-value{display:inline-flex;flex-wrap:wrap;align-items:center;gap:2px 0;padding:4px 10px}
.pd-tag-pill.pd-tag-cats .pd-cat-chain{display:inline-flex;flex-wrap:wrap;align-items:center}
.pd-tag-pill.pd-tag-cats .pd-cat-sep{color:#DCC9A9;padding:0 3px}
.pd-tag-pill.pd-tag-cats .pd-cat-chain-sep{color:#C8A86A;padding:0 5px}
.pd-tag-pill.pd-tag-cats .pd-tag-value a{color:#8A6540;text-decoration:none;font-weight:500}
.pd-tag-pill.pd-tag-cats .pd-tag-value a:hover{color:#A67C52;text-decoration:underline}
.pd-cta-row{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin-bottom:18px}
.pd-cta-row.pd-cta-row-center{justify-content:center}
.pd-cta-row .btn-inquiry{border-radius:8px}
.pd-cta-row .btn-share-sm.btn-share-blue{background:#8A6540;color:#fff;border-color:#8A6540}
.pd-cta-row .btn-share-sm.btn-share-blue:hover{background:#A67C52;color:#fff;border-color:#A67C52}
.btn-inquiry{display:inline-flex;align-items:center;justify-content:center;height:44px;padding:0 32px;border-radius:8px;background:linear-gradient(135deg,#B85C38,#ea580c);color:#fff;font-size:16px;font-weight:600;text-decoration:none;box-shadow:0 4px 12px rgba(234,88,12,.25);transition:all .2s}
.btn-inquiry:hover{transform:translateY(-2px);box-shadow:0 6px 16px rgba(234,88,12,.35);color:#fff}
.btn-collect{display:inline-flex;align-items:center;justify-content:center;height:40px;padding:0 18px;border-radius:8px;border:1px solid #e2e8f0;background:#fff;color:#475569;font-size:14px;font-weight:500;cursor:pointer;transition:all .2s;gap:5px}
.btn-collect:hover{border-color:#B85C38;color:#ea580c;background:#fffbeb}
.btn-collect.active{border-color:#B85C38;background:#fef3c7;color:#7C4226}
.btn-inquiry-text{color:#8A6540}
.btn-inquiry-text:hover{color:#A67C52;background:#F6F1E5;border-color:#8A6540}
.btn-edit,.btn-spec-download,.btn-share-sm{display:inline-flex;align-items:center;justify-content:center;height:40px;padding:0 14px;border-radius:8px;border:1px solid #e2e8f0;background:#fff;color:#475569;font-size:14px;font-weight:500;text-decoration:none;cursor:pointer;transition:all .2s;gap:5px;white-space:nowrap}
.btn-edit:hover,.btn-spec-download:hover,.btn-share-sm:hover{border-color:#8A6540;color:#8A6540;background:#F6F1E5}
.btn-delete{display:inline-flex;align-items:center;justify-content:center;height:40px;padding:0 14px;border-radius:8px;border:1px solid #fecaca;background:#fef2f2;color:#b91c1c;font-size:14px;font-weight:500;text-decoration:none;cursor:pointer;transition:all .2s;gap:5px;white-space:nowrap}
.btn-delete:hover{border-color:#f87171;background:#fee2e2;color:#991b1b}
.product-detail-img.product-gallery.single-image .gallery-main{justify-content:center}
.product-detail-img.product-gallery.single-image .gallery-main img{margin:0 auto}
.pd-info-grid{display:flex;flex-direction:column;gap:8px;margin-bottom:18px;padding:12px 16px;background:#f8fafc;border-radius:10px;border:1px solid var(--border-light)}
.pd-info-item{display:flex;align-items:baseline;font-size:14px}
.pd-info-label{color:var(--text-light);width:74px;flex-shrink:0}
.pd-info-value{color:var(--text);font-weight:500}
.pd-info-value a{color:var(--primary-light);text-decoration:none}
.pd-info-value a:hover{color:var(--accent)}
/* 2026-08-19 用途场景栏目压缩：图标 / padding / 字号 / 行间距 全减，整体高度压 ~50% */
.pd-scene-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.pd-section-scenes{margin-bottom:16px}
.pd-section-scenes .pd-scene-cards{margin-bottom:0}
.pd-scene-card{display:flex;align-items:flex-start;gap:10px;padding:10px 12px;background:#fff;border:1px solid #e2e8f0;border-radius:10px;box-shadow:0 1px 3px rgba(0,0,0,.04);transition:border-color .2s,box-shadow .2s}
.pd-scene-card:hover{border-color:#bfdbfe;box-shadow:0 4px 12px rgba(30,64,175,.08)}
.pd-scene-icon{width:32px;height:32px;border-radius:8px;background:#F6F1E5;display:flex;align-items:center;justify-content:center;flex-shrink:0;margin-top:1px}
.pd-scene-icon svg{width:18px;height:18px;fill:#8A6540}
.pd-scene-body{display:flex;flex-direction:column;gap:2px;min-width:0}
.pd-scene-title{font-size:13px;font-weight:700;color:#8A6540;line-height:1.3}
.pd-scene-desc{font-size:11px;color:#64748b;line-height:1.35}
/* 未选中的用途场景：灰度占位显示，保持网格整齐 */
.pd-scene-card.dim{background:#f8fafc;border-color:#e2e8f0;box-shadow:none}
.pd-scene-card.dim:hover{border-color:#e2e8f0;box-shadow:none}
.pd-scene-card.dim .pd-scene-icon{background:#f1f5f9}
.pd-scene-card.dim .pd-scene-icon svg{fill:#94a3b8}
.pd-scene-card.dim .pd-scene-title{color:#94a3b8}
.pd-scene-card.dim .pd-scene-desc{color:#cbd5e1}
@media (max-width:1100px){
.pd-scene-cards{grid-template-columns:repeat(2,1fr);gap:8px}
.pd-section-scenes{margin-bottom:14px}
.pd-scene-card{padding:10px;gap:10px}
.pd-scene-icon{width:30px;height:30px}
.pd-scene-icon svg{width:17px;height:17px}
.pd-scene-title{font-size:12.5px}
.pd-scene-desc{font-size:11px}
}
@media (max-width:640px){
.pd-scene-cards{grid-template-columns:1fr}
}
.pd-content-stack{display:flex;flex-direction:column;gap:24px;margin-top:24px}
.pd-section{background:var(--bg-white);border-radius:var(--radius);padding:14px;box-shadow:var(--shadow)}
.pd-section h2{font-size:18px;font-weight:700;color:var(--primary);margin-bottom:16px;padding-bottom:10px;padding-left:12px;border-left:4px solid #B85C38;border-bottom:2px solid var(--border-light)}
.pd-desc-content{line-height:1.8;color:var(--text);font-size:15px}
.pd-desc-content p{margin-bottom:14px}
.pd-desc-content ul,.pd-desc-content ol{padding-left:24px;margin-bottom:16px}
.pd-desc-content ul li{list-style:disc;margin-bottom:6px}
.pd-desc-content ol li{list-style:decimal;margin-bottom:6px}
.pd-desc-empty{color:var(--text-lighter);font-style:italic}
.pd-specs-content{line-height:1.7}
/* 选件/配件区块（HIOKI 等品牌：配件跟随主机展示，源站结构） */
/* 极致压缩：小缩略图 + 一行 3 个，减少页面长度 */
.pd-section-options{margin-top:0}
.pd-opt-count{font-size:12px;font-weight:500;color:var(--text-lighter);margin-left:6px}
.pd-options-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.pd-opt-card{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;padding:8px 6px;border:1px solid var(--border-light);border-radius:8px;text-decoration:none;text-align:center;transition:border-color .15s,box-shadow .15s,transform .15s;background:var(--bg-white)}
.pd-opt-card:hover{border-color:#B85C38;box-shadow:0 2px 8px rgba(0,0,0,.06);transform:translateY(-1px)}
.pd-opt-thumb{width:48px;height:48px;flex:0 0 auto;border-radius:6px;overflow:hidden;background:#f8fafc;display:flex;align-items:center;justify-content:center}
.pd-opt-thumb img{width:100%;height:100%;object-fit:contain}
.pd-opt-thumb .no-image{font-size:20px}
.pd-opt-info{min-width:0;width:100%;display:flex;flex-direction:column;gap:1px}
.pd-opt-name{font-size:12px;font-weight:500;color:var(--text);line-height:1.25;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pd-opt-meta{display:none}
@media (max-width:640px){.pd-options-grid{grid-template-columns:repeat(3,1fr);gap:6px}.pd-opt-card{padding:6px 4px}.pd-opt-thumb{width:40px;height:40px}.pd-opt-name{font-size:11px}}
/* 规格型号价格表（多规格价格模板） */
.pd-price-table-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch;border:1px solid var(--border);border-radius:10px}
.pd-price-table{width:100%;min-width:680px;border-collapse:collapse;font-size:14px}
.pd-price-table thead th{background:#f0f6ff;color:var(--primary);font-weight:600;text-align:left;padding:10px 14px;border-bottom:2px solid var(--border);white-space:nowrap}
.pd-price-table tbody td{padding:10px 14px;border-bottom:1px solid var(--border-light);vertical-align:middle;word-break:break-word}
.pd-price-table tbody tr:last-child td{border-bottom:none}
.pd-price-table tbody tr:hover{background:#f8fafc}
.pd-price-table .ps-model{font-weight:600;color:var(--primary);white-space:nowrap}
.pd-price-table .ps-price{font-weight:700;color:#dc2626;font-variant-numeric:tabular-nums}
.pd-price-table .ps-price-cost{color:var(--primary)}
.pd-price-table .ps-price-cell{white-space:nowrap}
.pd-price-table .ps-remark{color:var(--text-lighter);font-size:13px}
.pd-price-table .ps-locked{font-size:13px;color:#8A6540;text-decoration:none;border:1px dashed #DCC9A9;border-radius:6px;padding:2px 8px;white-space:nowrap}
.pd-price-table .ps-locked:hover{background:#F6F1E5}
.ps-price-hint{margin-top:10px;font-size:13px;color:var(--text-lighter);line-height:1.6}
.ps-price-hint a{color:#8A6540;text-decoration:none;font-weight:500}
.ps-price-hint a:hover{text-decoration:underline}
/* 产品详情富文本：图片按自身宽度显示、最大不溢出容器，避免小图被强制放大模糊；保留表格内小图标不放大 */
.pd-desc-content img,.pd-specs-tech img,.pd-specs-edit img,.pd-specs-content img{display:inline-block;max-width:100%;height:auto;vertical-align:top}
/* 表格内的小图标/证书图不做满宽放大，仅防溢出 */
.pd-desc-content table img,.pd-specs-tech table img,.pd-specs-edit table img,.pd-specs-content table img{display:inline;width:auto;max-width:100%;height:auto}
/* ZTMI 产品详情页配图区块：保留原图宽度，避免选型表小图被强制放大模糊 */
.pd-specs-content .ztmi-specs-figures{margin-top:24px}
.pd-specs-content .ztmi-specs-figures>h3{font-size:18px;font-weight:700;color:#A67C52;margin-bottom:16px}
.pd-specs-content .ztmi-fig-section{margin-bottom:28px}
.pd-specs-content .ztmi-fig-section h4{font-size:15px;font-weight:600;color:#334155;margin:0 0 10px}
.pd-specs-content .ztmi-fig-section img{display:block;width:auto;max-width:100%;height:auto;margin:0 auto;border:1px solid #e2e8f0;border-radius:6px;box-shadow:0 2px 8px rgba(0,0,0,.06)}
.pd-specs-content .ztmi-fig-section p{font-size:13px;color:#64748b;margin-top:8px;line-height:1.6}
/* ZTMI MPT 系列方案页：适用产品卡片网格 */
.pd-specs-content .ztmi-prod-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:28px}
.pd-specs-content .ztmi-prod-grid figure{margin:0;padding:12px;border:1px solid #e2e8f0;border-radius:8px;background:#fff;text-align:center}
.pd-specs-content .ztmi-prod-grid figure img{display:block;width:100%;max-width:100%;height:auto;margin:0 auto;border:none;border-radius:4px;box-shadow:none}
.pd-specs-content .ztmi-prod-grid figcaption{font-size:13px;font-weight:600;color:#334155;margin-top:8px}
.pd-specs-content .ztmi-prod-grid figure p{font-size:12px;color:#64748b;line-height:1.55;margin-top:4px;text-align:left}
@media (max-width:768px){.pd-specs-content .ztmi-prod-grid{grid-template-columns:repeat(2,1fr);gap:8px}}
/* ZTMI MPT 系列方案页：测试项目多列清单 */
.pd-specs-content .ztmi-test-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px;margin-bottom:28px}
.pd-specs-content .ztmi-test-item{padding:14px 16px;border:1px solid #e2e8f0;border-radius:8px;background:#f8fafc}
.pd-specs-content .ztmi-test-item h4{font-size:15px;font-weight:700;color:#A67C52;margin:0 0 8px}
.pd-specs-content .ztmi-test-item ul{margin:0;padding-left:18px}
.pd-specs-content .ztmi-test-item li{font-size:13px;color:#475569;line-height:1.7;list-style:disc}
.pd-desc-content,.pd-specs-content{overflow-x:auto;-webkit-overflow-scrolling:touch}
.pd-desc-content table,.pd-specs-tech table,.pd-specs-edit table,.pd-specs-content table{
width:100%!important;max-width:100%!important;height:auto!important;
word-break:break-word;overflow-wrap:break-word;white-space:normal;
border-collapse:collapse;font-size:14px;margin:10px 0;
}
.pd-desc-content table th,.pd-specs-tech table th,.pd-specs-edit table th,.pd-specs-content table th,.pd-desc-content table td,.pd-specs-tech table td,.pd-specs-edit table td,.pd-specs-content table td{padding:10px 12px;border:1px solid var(--border);text-align:left;word-break:break-word;overflow-wrap:break-word;white-space:normal}
.pd-specs-tech table th,.pd-specs-edit table th,.pd-specs-content table th,.pd-desc-content table th{background:#f8fafc;font-weight:600;color:var(--primary)}
.pd-desc-content table tr:nth-child(even),.pd-specs-edit table tr:nth-child(even),.pd-specs-content table tr:nth-child(even),.pd-desc-content table tr:nth-child(even){background:#f8fafc}
/* 编辑器中拖拽设定了列宽（colgroup col 带 width）时用固定表格布局，让列宽严格生效不挤左 */
.pd-desc-content table:has(colgroup col[style*="width"]),.pd-specs-tech table:has(colgroup col[style*="width"]),.pd-specs-edit table:has(colgroup col[style*="width"]),.pd-specs-content table:has(colgroup col[style*="width"]),.article-body table:has(colgroup col[style*="width"]){table-layout:fixed}
@media (max-width:768px){
.product-detail-meta h1{font-size:20px}
.pd-info-grid{grid-template-columns:1fr}
.btn-inquiry{flex:1;padding:0 20px;font-size:15px}
.pd-cta-row{gap:8px}
.btn-collect,.btn-edit,.btn-delete,.btn-spec-download,.btn-share-sm{height:38px;padding:0 12px;font-size:13px}
.pd-scene-cards{grid-template-columns:repeat(2,1fr);gap:6px}
.pd-section-scenes{margin-bottom:12px}
.pd-scene-card{padding:8px 10px;gap:8px}
.pd-scene-icon{width:28px;height:28px;border-radius:6px}
.pd-scene-icon svg{width:16px;height:16px}
.pd-scene-title{font-size:12px}
.pd-scene-desc{font-size:10.5px;line-height:1.3}
.pd-section{padding:18px}
}
/* Auto product link in article body */
.auto-product-link{color:var(--primary-light);text-decoration:underline;text-underline-offset:3px;font-weight:500;transition:var(--transition)}
.auto-product-link:hover{color:var(--primary);background:rgba(0,102,179,.06);border-radius:2px}
/* ===== Product Detail - Related Sections (Products + Solutions + Articles) ===== */
.related-sections{margin-top:32px}
.related-section{background:#fff;border-radius:var(--radius);box-shadow:var(--shadow);margin-bottom:20px;overflow:hidden}
.related-section-header{display:flex;justify-content:space-between;align-items:center;padding:12px 20px;background:linear-gradient(135deg,var(--primary),var(--primary-light));color:#fff}
.related-section-header h2{font-size:16px;font-weight:600;margin:0;display:flex;align-items:center;gap:8px}
.related-section-count{background:rgba(255,255,255,.2);padding:2px 10px;border-radius:12px;font-size:12px;font-weight:400}
.related-section-more{color:#fff;font-size:13px;opacity:.85;text-decoration:none;white-space:nowrap}
.related-section-more:hover{opacity:1;text-decoration:underline}
.related-section-body{padding:12px 16px}
.related-list-item{display:flex;align-items:center;justify-content:space-between;padding:10px 12px;border-radius:8px;text-decoration:none;color:inherit;transition:var(--transition)}
.related-list-item:hover{background:var(--bg-light)}
.related-list-item:hover .related-item-main h3{color:var(--primary-light)}
.related-item-main{flex:1;min-width:0}
.related-item-main h3{font-size:15px;font-weight:500;margin:0 0 4px;color:var(--text);transition:var(--transition)}
.related-item-main p{font-size:13px;color:var(--text-light);margin:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.related-item-meta{display:flex;gap:8px;align-items:center;margin-top:4px}
.related-item-tag{font-size:12px;color:var(--text-lighter);background:var(--bg-light);padding:2px 8px;border-radius:4px}
.related-item-date{font-size:12px;color:var(--text-lighter)}
.related-item-arrow{color:var(--text-lighter);font-size:18px;flex-shrink:0;margin-left:12px;transition:var(--transition)}
.related-list-item:hover .related-item-arrow{color:var(--primary-light);transform:translateX(3px)}
@media(max-width:640px){
.related-section-header h2{font-size:14px}
.related-section-more{font-size:12px}
.related-item-main h3{font-size:14px}
.related-item-main p{font-size:12px}
}
/* ===== 产品详情页：上半部 3/4 + 1/4 左右栏布局 ===== */
.pd-layout{display:grid;grid-template-columns:minmax(0,3fr) minmax(0,1fr);gap:24px;align-items:start}
/* 左右栏互换（显式指定 grid-row 防止 auto-placement 把侧栏挤到第二行） */
.pd-layout-swapped{grid-template-columns:minmax(0,1fr) minmax(0,3fr)}
.pd-layout-swapped .pd-main-col{grid-column:2;grid-row:1}
.pd-layout-swapped .pd-aside{grid-column:1;grid-row:1}
.pd-main-col{min-width:0}
.pd-aside{min-width:0;position:sticky;top:120px;max-height:calc(100vh - 140px);display:flex;flex-direction:column;overflow:hidden}
.pd-aside-header{flex-shrink:0}
.pd-aside-body{flex:1;min-height:0;overflow-y:auto;overscroll-behavior:contain;padding-right:4px}
.pd-aside-body::-webkit-scrollbar{width:6px}
.pd-aside-body::-webkit-scrollbar-track{background:transparent}
.pd-aside-body::-webkit-scrollbar-thumb{background:#d1d9e6;border-radius:3px}
.pd-aside-body::-webkit-scrollbar-thumb:hover{background:#b6c3d6}
.pd-aside-box{background:#fff;border-radius:var(--radius);box-shadow:var(--shadow);padding:16px;margin-bottom:20px}
.pd-aside-title{font-size:15px;font-weight:700;color:var(--primary);margin-bottom:12px;padding-bottom:8px;border-bottom:2px solid var(--border-light);display:flex;align-items:center;justify-content:space-between}
.pd-aside-count{background:#eef2ff;color:#4f46e5;font-size:11px;font-weight:600;padding:2px 8px;border-radius:10px}
/* 右栏位置一键切换（占位按钮） */
.pd-layout-toggle{display:flex;align-items:center;justify-content:center;gap:6px;width:100%;padding:10px 12px;margin-bottom:12px;border:1px dashed var(--primary-light);border-radius:10px;background:#fff;color:var(--primary);font-size:13px;font-weight:600;cursor:pointer;transition:all .2s}
.pd-layout-toggle:hover{background:var(--primary);color:#fff;border-style:solid}
.pd-layout-toggle.active{background:var(--primary);color:#fff;border-style:solid}
.pd-layout-toggle-icon{font-size:15px;line-height:1}
.pd-layout-toggle-text{line-height:1}
/* 右栏产品检索 */
.pd-search-row{display:flex;gap:8px;margin-bottom:10px}
.pd-search-input{flex:1;min-width:0;height:38px;padding:0 12px;border:1px solid var(--border);border-radius:8px;font-size:13px;color:var(--text);background:#f8fafc;outline:none;transition:border-color .15s,box-shadow .15s}
.pd-search-input:focus{border-color:var(--primary-light);background:#fff;box-shadow:0 0 0 3px rgba(59,130,246,.12)}
.pd-search-input::placeholder{color:var(--text-lighter)}
.pd-search-btn{flex-shrink:0;height:38px;padding:0 16px;border:none;border-radius:8px;background:var(--primary);color:#fff;font-size:13px;font-weight:600;cursor:pointer;transition:background .15s}
.pd-search-btn:hover{background:var(--primary-dark, #8A6540)}
.pd-search-results{border-top:1px dashed var(--border-light);padding-top:10px}
.pd-search-status{font-size:12px;color:var(--text-light);margin-bottom:8px}
.pd-search-list{display:flex;flex-direction:column;gap:8px}
.pd-search-item{display:flex;gap:10px;align-items:center;padding:8px;border:1px solid var(--border-light);border-radius:8px;text-decoration:none;color:inherit;transition:all .15s}
.pd-search-item:hover{border-color:var(--primary-light);box-shadow:0 2px 8px rgba(0,0,0,.06);transform:translateY(-1px)}
.pd-search-item:hover .pd-side-name{color:var(--primary-light)}
/* 右侧边栏「你可能也感兴趣」：恢复原竖排列表样式 */
.pd-side-list{display:flex;flex-direction:column;gap:10px}
.pd-side-item{display:flex;gap:10px;align-items:center;padding:8px;border:1px solid var(--border-light);border-radius:8px;text-decoration:none;color:inherit;transition:all .15s}
.pd-side-item:hover{border-color:var(--primary-light);box-shadow:0 2px 8px rgba(0,0,0,.06);transform:translateY(-1px)}
.pd-side-thumb{width:56px;height:56px;flex-shrink:0;background:var(--bg-light);border-radius:6px;display:flex;align-items:center;justify-content:center;overflow:hidden}
.pd-side-thumb img{max-width:100%;max-height:100%;object-fit:contain}
.pd-side-thumb .no-image{font-size:22px}
.pd-side-info{min-width:0;flex:1}
.pd-side-name{display:block;font-size:13px;font-weight:600;color:var(--text);line-height:1.4;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.pd-side-item:hover .pd-side-name{color:var(--primary-light)}
.pd-side-meta{display:block;font-size:11px;color:var(--text-lighter);margin-top:3px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pd-side-more{text-align:center;margin-top:12px;font-size:13px}
.pd-side-more a{color:var(--primary-light);text-decoration:none}
.pd-side-more a:hover{text-decoration:underline}
/* 右侧「你可能也感兴趣」推荐卡片：图片在上，名称在下 */
.pd-rel-cards .pd-side-item{flex-direction:column;gap:8px;align-items:flex-start;padding:10px}
.pd-rel-cards .pd-side-thumb{width:100%;height:auto;min-height:90px;border-radius:6px;background:#fff;display:flex;align-items:center;justify-content:center;overflow:hidden}
.pd-rel-cards .pd-side-thumb img{display:block;width:auto;max-width:100%;height:auto;max-height:130px;object-fit:contain;margin:0 auto}
.pd-rel-cards .pd-side-thumb .no-image{font-size:32px}
.pd-rel-cards .pd-side-info{width:100%;min-width:0}
.pd-rel-cards .pd-side-meta{margin-top:4px}
/* 侧栏内分页适配窄宽度 */
.pd-aside-box .kb-pager{justify-content:flex-start;gap:4px;padding:10px 0 2px}
.pd-aside-box .kb-pager-btn{min-width:26px;height:26px;padding:0 5px;font-size:11px}
.pd-aside-box .kb-pager-cur{min-width:26px;height:26px;padding:0 5px;font-size:11px}
.pd-aside-box .kb-pager-ellipsis{height:26px;font-size:11px}
.pd-aside-box .kb-pager-info{font-size:11px;margin-left:4px}
.pd-help-text{font-size:13px;color:var(--text-light);line-height:1.7;margin-bottom:12px}
.pd-help-btn{display:block;text-align:center;background:linear-gradient(135deg,#B85C38,#ea580c);color:#fff;font-size:14px;font-weight:600;padding:10px 0;border-radius:8px;text-decoration:none;transition:all .2s}
.pd-help-btn:hover{transform:translateY(-1px);box-shadow:0 4px 12px rgba(234,88,12,.25);color:#fff}
.pd-help-tel{display:block;text-align:center;margin-top:10px;color:var(--primary-light);font-size:14px;font-weight:600;text-decoration:none}
.pd-help-tel:hover{text-decoration:underline}
@media(max-width:1024px){
.pd-layout{grid-template-columns:1fr}
.pd-layout-swapped{grid-template-columns:1fr}
.pd-layout-swapped .pd-main-col{grid-column:auto;grid-row:auto}
.pd-layout-swapped .pd-aside{grid-column:auto;grid-row:auto}
.pd-aside{position:static;max-height:none;overflow:visible;display:block}
.pd-aside-body{overflow:visible;padding-right:0}
.pd-layout-toggle{display:none}
}
/* ===== 询价单表单 ===== */
.inquiry-product-box{background:#fffbeb;border:1px solid #fde68a;border-radius:10px;padding:12px 14px;margin-bottom:16px}
.inquiry-product-title{font-size:12px;color:#7C4226;font-weight:600;margin-bottom:6px}
.inquiry-product-name{font-size:15px;font-weight:700;color:#1e293b;line-height:1.4}
.inquiry-product-meta{display:flex;flex-wrap:wrap;gap:6px 16px;font-size:12px;color:#64748b;margin-top:4px}
.inquiry-success{background:#f0fdf4;border:1px solid #bbf7d0;color:#166534;padding:16px;border-radius:10px;font-size:14px;line-height:1.9}
.inquiry-success a{color:#15803d;font-weight:600}
.inquiry-error{background:#fef2f2;border:1px solid #fecaca;color:#b91c1c;padding:12px 14px;border-radius:8px;margin-bottom:14px;font-size:13px}
.form-tip{font-size:12px;color:#94a3b8;margin-top:10px;text-align:center}
.form-tip a{color:var(--primary-light)}
/* ===== 规格书导出格式选择浮层 ===== */
.spec-export-modal{position:fixed;inset:0;z-index:9999;display:none}
.spec-export-modal.open{display:block}
.spec-export-overlay{position:absolute;inset:0;background:rgba(15,23,42,.5)}
.spec-export-close{position:absolute;top:10px;right:12px;background:#fff;border:none;font-size:22px;color:#94a3b8;cursor:pointer;z-index:2;width:32px;height:32px;border-radius:50%;line-height:1}
.spec-export-close:hover{color:#334155;background:#f1f5f9}
/* ===== 规格书预览弹窗（先预览再另存，默认整页全览） ===== */
.spec-preview-box{position:relative;display:flex;flex-direction:column;width:min(1100px,95vw);height:min(90vh,980px);margin:4vh auto 0;background:#fff;border-radius:14px;box-shadow:0 20px 60px rgba(0,0,0,.25);overflow:hidden}
.spec-preview-head{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:12px 56px 12px 20px;border-bottom:1px solid #e2e8f0}
.spec-preview-title{font-size:16px;font-weight:700;color:#0f172a;white-space:nowrap}
.spec-preview-tip{font-size:12px;color:#64748b;text-align:left;flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.spec-preview-body{flex:1;min-height:0;background:#e2e8f0}
.spec-preview-body iframe{width:100%;height:100%;border:0;background:#e2e8f0;display:block}
.spec-preview-foot{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:12px 20px;border-top:1px solid #e2e8f0}
.spec-preview-actions{display:flex;align-items:center;gap:10px;flex-shrink:0}
.spf-btn{padding:9px 18px;border-radius:8px;font-size:13px;cursor:pointer;font-family:inherit;border:1px solid #e2e8f0;background:#fff;color:#334155;transition:all .15s}
.spf-btn:hover{background:#f8fafc}
.spf-btn:disabled{opacity:.6;cursor:wait}
.spf-primary{background:#A67C52;border-color:#A67C52;color:#fff}
.spf-primary:hover{background:#24507e}
.spf-ghost{background:#fff}
/* 缩放工具条 */
.spf-zoom{display:flex;align-items:center;gap:5px;flex-shrink:0}
.spf-zbtn{min-width:30px;height:30px;padding:0 10px;border-radius:7px;border:1px solid #e2e8f0;background:#fff;color:#334155;font-size:13px;cursor:pointer;font-family:inherit;line-height:1;transition:all .15s;white-space:nowrap}
.spf-zbtn:hover{background:#f1f5f9;border-color:#cbd5e1}
.spf-zval{min-width:44px;text-align:center;font-size:12px;color:#64748b;font-variant-numeric:tabular-nums}
.spf-zsep{width:1px;height:18px;background:#e2e8f0;margin:0 3px}
@media (max-width:768px){
.spec-preview-box{width:96vw;height:90vh;margin-top:5vh}
.spec-preview-head{padding:10px 48px 10px 12px;gap:8px}
.spec-preview-title{font-size:14px}
.spec-preview-foot{flex-wrap:wrap;justify-content:center}
.spec-preview-tip{display:none}
.spf-zbtn{min-width:26px;height:26px;padding:0 7px;font-size:12px}
.spf-zval{min-width:36px}
}
.spec-print-area{position:fixed;left:-99999px;top:0;width:800px;background:#fff;z-index:-1}
/* 产品详情页：知识库三卡横排（左中右） */
.kb-prod-related-grid{
display:grid;
grid-template-columns:repeat(3, 1fr);
gap:16px;
padding:16px;
}
.kb-related-empty{
font-size:13px;
color:#94a3b8;
text-align:center;
padding:12px 0;
margin:0;
}
.kb-prod-related-grid .kb-sidebar-card{
padding:18px 16px;
border-radius:8px;
background:#fff;
box-shadow:0 1px 4px rgba(0,0,0,.06);
}
.kb-prod-related-grid .kb-sidebar-card h3{
font-size:14px;
font-weight:700;
margin-bottom:12px;
padding-bottom:8px;
border-bottom:1px solid #eee;
}
.kb-prod-related-grid .kb-related-list{
list-style:none;
padding:0;
margin:0;
}
.kb-prod-related-grid .kb-related-list li{
margin-bottom:8px;
display:flex;
align-items:flex-start;
gap:8px;
}
.kb-prod-related-grid .kb-related-list li:last-child{
margin-bottom:0;
}
.kb-prod-related-grid .kb-item-num{
flex-shrink:0;
min-width:20px;
height:20px;
line-height:20px;
text-align:center;
font-size:12px;
font-weight:600;
color:#fff;
border-radius:4px;
margin-top:5px;
}
.kb-prod-related-grid .kb-card-sel .kb-item-num{ background:#7c3aed; }
.kb-prod-related-grid .kb-card-repair .kb-item-num{ background:#ea580c; }
.kb-prod-related-grid .kb-card-case .kb-item-num{ background:#16a34a; }
.kb-prod-related-grid .kb-related-list a{
font-size:13px;
line-height:1.5;
color:var(--text);
text-decoration:none;
display:block;
flex:1;
padding:4px 0;
transition:color .15s;
border:none !important;
}
.kb-prod-related-grid .kb-related-list a:hover{
text-decoration:underline;
}
/* 配色（与知识库详情页右栏一致） */
.kb-prod-related-grid .kb-card-sel{
border-top:3px solid #7c3aed;
}
.kb-prod-related-grid .kb-card-sel h3{
color:#6d28d9;
}
.kb-prod-related-grid .kb-card-sel .kb-related-list a:hover{
color:#6d28d9;
}
.kb-prod-related-grid .kb-card-repair{
border-top:3px solid #ea580c;
}
.kb-prod-related-grid .kb-card-repair h3{
color:#c2410c;
}
.kb-prod-related-grid .kb-card-repair .kb-related-list a:hover{
color:#c2410c;
}
.kb-prod-related-grid .kb-card-case{
border-top:3px solid #16a34a;
}
.kb-prod-related-grid .kb-card-case h3{
color:#15803d;
}
.kb-prod-related-grid .kb-card-case .kb-related-list a:hover{
color:#15803d;
}
@media(max-width:900px){
.kb-prod-related-grid{
grid-template-columns:1fr;
}
}
/* ===== Inline Pagination (related sections) ===== */
.kb-pager{
display:flex;align-items:center;justify-content:center;gap:6px;
padding:14px 0 4px;flex-wrap:wrap;
}
.kb-pager-btn{
display:inline-flex;align-items:center;justify-content:center;
min-width:34px;height:32px;padding:0 8px;
border:1px solid #d1d5db;border-radius:6px;
background:#fff;color:#374151;font-size:13px;cursor:pointer;
transition:border-color .15s,background .15s,color .15s;
}
.kb-pager-btn:hover{
border-color:#8A6540;color:#8A6540;background:#F6F1E5;
}
.kb-pager-cur{
display:inline-flex;align-items:center;justify-content:center;
min-width:34px;height:32px;padding:0 8px;
border-radius:6px;background:#8A6540;color:#fff;font-size:13px;font-weight:600;
}
.kb-pager-ellipsis{
display:inline-flex;align-items:center;justify-content:center;
min-width:28px;height:32px;color:#9ca3af;font-size:13px;
}
.kb-pager-info{
margin-left:8px;font-size:12px;color:#9ca3af;white-space:nowrap;
}
/* KB 3-column cards: compact pager */
.kb-prod-related-grid .kb-pager{
padding:12px 0 2px;
}
.kb-prod-related-grid .kb-pager-btn{
min-width:28px;height:28px;padding:0 6px;font-size:12px;
}
.kb-prod-related-grid .kb-pager-cur{
min-width:28px;height:28px;padding:0 6px;font-size:12px;
}
.kb-prod-related-grid .kb-pager-info{
font-size:11px;margin-left:6px;
}
/* ===== Contact Page Cards ===== */
.contact-card{display:flex;align-items:flex-start;gap:12px;padding:12px 0}
.contact-icon{font-size:22px;flex-shrink:0;width:32px;text-align:center;line-height:1.3}
.contact-detail strong{display:block;font-size:14px;color:var(--text);margin-bottom:2px}
.contact-detail p{margin:1px 0;font-size:13px;color:var(--text-light)}
.contact-detail a{color:var(--primary);text-decoration:none}
.contact-detail a:hover{text-decoration:underline}
.contact-value-large{display:inline-block;font-size:20px;font-weight:700;color:var(--primary)!important;margin-top:1px}
.contact-divider{border:none;border-top:1px solid var(--border);margin:6px 0}
.service-promise{margin-top:16px;padding:14px 16px;background:#F3ECDD;border-radius:8px;border-left:4px solid var(--primary)}
.service-promise strong{color:var(--primary);font-size:14px}
.service-promise ul{margin:6px 0 0 16px;font-size:13px;color:var(--text)}
.service-promise li{margin-bottom:3px}
/* ===== Brand List Page ===== */
.brand-stats{display:flex;justify-content:center;gap:32px;padding:20px 0;margin-bottom:24px}
.stat-item{text-align:center}
.stat-item strong{display:block;font-size:28px;font-weight:700;color:var(--primary);line-height:1.1}
.stat-item span{font-size:12px;color:var(--text-light)}
.letter-filter{display:flex;flex-wrap:wrap;gap:4px;justify-content:center;padding:10px 0;margin-bottom:24px;border-bottom:1px solid var(--border)}
.letter-link{display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;border-radius:5px;background:var(--bg-light);color:var(--text);text-decoration:none;font-size:13px;font-weight:500;transition:all .15s}
.letter-link:hover{background:var(--primary-light);color:#fff}
.brand-section{margin-bottom:32px}
.brand-section-title{font-size:22px;font-weight:700;color:var(--primary);padding-bottom:6px;border-bottom:2px solid var(--primary-light);margin-bottom:16px}
.brand-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:14px}
.brand-card{display:flex;align-items:center;gap:12px;padding:14px;background:var(--bg-white);border:1px solid var(--border);border-radius:8px;text-decoration:none;transition:all .2s}
.brand-card:hover{border-color:var(--primary-light);box-shadow:0 3px 12px rgba(26,86,219,.08);transform:translateY(-1px)}
.brand-card-logo{width:48px;height:48px;flex-shrink:0;display:flex;align-items:center;justify-content:center;background:var(--bg-light);border-radius:6px;overflow:hidden}
.brand-card-logo img{max-width:100%;max-height:100%;object-fit:contain}
.brand-logo-placeholder{font-size:16px;font-weight:700;color:var(--primary-light)}
.brand-card-body{flex:1;min-width:0}
.brand-card-name{font-size:15px;font-weight:600;color:var(--text);margin:0 0 2px}
.brand-card-desc{font-size:11px;color:var(--text-lighter);margin:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
/* ===== Brand Detail Page ===== */
.brand-detail-header{background:linear-gradient(135deg,#1e3a5f,#1a56db);color:#fff;padding:32px 0}
.brand-detail-header h1{color:#fff}
.brand-detail-top{display:flex;align-items:center;justify-content:space-between;gap:28px}
.brand-detail-info{flex:1;min-width:0}
.brand-detail-title-row{display:flex;align-items:center;gap:14px;margin-bottom:10px}
.brand-detail-icon{width:46px;height:46px;display:flex;align-items:center;justify-content:center;background:rgba(255,255,255,.15);border-radius:10px;font-size:24px;backdrop-filter:blur(4px)}
.brand-detail-info h1{margin:0;font-size:30px;font-weight:700}
.brand-detail-slogan{margin:4px 0 0;font-size:14px;opacity:.92;color:#fff}
.brand-detail-stats{display:flex;flex-wrap:wrap;gap:18px;margin:12px 0 14px;font-size:13px}
.brand-detail-stats span{display:inline-flex;align-items:center;gap:5px}
.brand-detail-meta{display:flex;gap:16px;font-size:13px;opacity:.9}
.brand-detail-logo{flex-shrink:0;height:96px;display:flex;align-items:center;justify-content:center;background:#fff;border-radius:12px;overflow:hidden;padding:8px 16px}
.brand-detail-logo img{max-height:80px;width:auto;max-width:260px;object-fit:contain}
.brand-detail-grid{display:grid;grid-template-columns:1fr 280px;gap:24px}
.brand-detail-block{background:var(--bg-white);padding:20px;border-radius:var(--radius);box-shadow:var(--shadow);margin-bottom:20px}
.brand-detail-block h2{font-size:18px;margin-bottom:14px;padding-bottom:8px;border-bottom:1px solid var(--border)}
.brand-description{font-size:14px;line-height:1.75;color:var(--text)}
.brand-description p{margin-bottom:10px}
.ebook-list{display:flex;flex-direction:column;gap:8px}
.ebook-item{display:flex;align-items:center;gap:10px;padding:10px 14px;background:var(--bg-light);border-radius:6px;border:1px solid var(--border);transition:var(--transition)}
.ebook-item:hover{border-color:var(--primary-light)}
.ebook-icon{font-size:24px}
.ebook-info{flex:1;min-width:0}
.ebook-info strong{display:block;font-size:13px}
.ebook-type{font-size:10px;color:var(--text-light);background:#e2e8f0;padding:1px 5px;border-radius:3px}
.ebook-actions{display:flex;gap:6px;flex-shrink:0}
.ebook-actions .btn{font-size:11px;padding:5px 10px}
.brand-detail-sidebar{position:sticky;top:calc(var(--header-h) + 12px);align-self:flex-start;max-height:calc(100vh - var(--header-h) - 24px);overflow-y:auto}
.brand-detail-sidebar .cat-sub-list,.brand-detail-sidebar .cat-sub3-list{max-height:none;overflow:visible}
.brand-detail-sidebar .cat-sub3-list{display:block !important}
.brand-detail-sidebar .sub3-arrow{display:inline-block}
.brand-detail-sidebar .cat-arrow{transform:rotate(90deg)}
.brand-detail-sidebar .cat-sub-flyout{display:none !important}
.sidebar-card{background:var(--bg-white);padding:18px;border-radius:var(--radius);box-shadow:var(--shadow);margin-bottom:14px}
.sidebar-card h3{font-size:15px;margin-bottom:10px;padding-bottom:6px;border-bottom:1px solid var(--border)}
.sidebar-brand-logo{text-align:center;margin-bottom:10px}
.sidebar-brand-logo img{max-width:110px;max-height:50px;object-fit:contain}
.sidebar-info-list{list-style:none;padding:0;margin:0}
.sidebar-info-list li{padding:5px 0;font-size:13px;border-bottom:1px dashed var(--border)}
.sidebar-info-list li:last-child{border-bottom:none}
.sidebar-nav{list-style:none;padding:0;margin:0}
.sidebar-nav li{margin-bottom:3px}
.sidebar-nav a{display:block;padding:6px 8px;font-size:13px;color:var(--text);text-decoration:none;border-radius:4px;transition:all .15s}
.sidebar-nav a:hover{background:var(--bg-light);color:var(--primary-light)}
.product-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:12px}
.product-card-bd{display:block;background:var(--bg-white);border:1px solid var(--border);border-radius:8px;overflow:hidden;text-decoration:none;transition:all .15s}
.product-card-bd:hover{border-color:var(--primary-light);box-shadow:0 2px 8px rgba(0,0,0,.06)}
.product-card-bd-wrap{background:var(--bg-white);border:1px solid var(--border);border-radius:8px;overflow:hidden;transition:all .15s}
.product-card-bd-wrap:hover{border-color:var(--primary-light);box-shadow:0 2px 8px rgba(0,0,0,.06)}
.product-card-bd-wrap .product-card-bd{border:none;border-radius:0}
.product-card-bd-wrap .product-card-categories{padding:0 10px 8px}
.product-card-img{height:120px;display:flex;align-items:center;justify-content:center;background:var(--bg-light);overflow:hidden}
.product-card-img img{max-width:100%;max-height:100%;object-fit:contain}
.product-card-body{padding:8px 10px}
.product-card-name{font-size:13px;font-weight:500;color:var(--text);margin:0 0 2px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.product-card-model{font-size:11px;color:var(--text-lighter);margin:0}
/* ===== Brand Zone: product grid (4 per row) ===== */
.brand-products-header{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:14px}
.brand-products-header h2{font-size:18px;margin:0;padding:0;border:none}
.brand-products-count{font-size:13px;color:var(--text-light)}
.brand-products-count strong{color:var(--primary);font-weight:600}
.brand-product-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;align-items:stretch}
.brand-product-card{
display:flex;flex-direction:column;
background:var(--bg-white);border:1px solid var(--border);border-radius:10px;
overflow:hidden;transition:transform .15s,box-shadow .15s,border-color .15s;height:100%
}
.brand-product-card:hover{border-color:var(--primary-light);box-shadow:0 4px 12px rgba(0,0,0,.07);transform:translateY(-2px)}
.brand-product-link{display:flex;flex-direction:column;text-decoration:none;color:inherit;flex:1;min-width:0}
.brand-product-thumb{height:150px;display:flex;align-items:center;justify-content:center;background:#f8fafc;overflow:hidden;border-bottom:1px solid #f1f5f9}
.brand-product-thumb img{width:90%;height:90%;object-fit:contain;transition:transform .3s}
.brand-product-card:hover .brand-product-thumb img{transform:scale(1.03)}
.brand-product-body{flex:1;display:flex;flex-direction:column;gap:4px;padding:12px 14px 10px;min-height:0}
.brand-product-name{font-size:13px;font-weight:600;color:#1a1a2e;line-height:1.4;margin:0;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:2.8em}
.brand-product-model,.brand-product-brand{font-size:12px;color:#64748b;margin:0}
.brand-product-model{font-family:monospace;color:#8A6540}
.brand-product-tags{display:flex;align-items:center;flex-wrap:wrap;gap:4px;padding:0 14px 12px;margin-top:auto;font-size:12px}
.brand-product-tag{color:#8A6540;text-decoration:none}
.brand-product-tag:hover{text-decoration:underline}
.brand-tag-sep{color:#cbd5e1}
/* ===== Homepage Brand Teaser ===== */
.brand-teaser{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:10px}
.brand-teaser-item{background:var(--bg-white);border:1px solid var(--border-light);border-radius:8px;padding:16px 12px;text-align:center;text-decoration:none;transition:var(--transition)}
.brand-teaser-item:hover{border-color:var(--primary-light);box-shadow:var(--shadow)}
.brand-teaser-logo{height:40px;display:flex;align-items:center;justify-content:center;margin-bottom:8px}
.brand-teaser-logo img{max-height:36px;max-width:100%;object-fit:contain}
.brand-teaser-name{font-size:13px;color:var(--text);font-weight:500}
/* ===== SEO: rich-content ===== */
.rich-content img{max-width:100%;height:auto;margin:8px 0}
.rich-content iframe{max-width:100%}
/* ===== Knowledge page ===== */
.knowledge-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:20px}
/* ===== Empty state ===== */
.empty-page{padding:60px 0;text-align:center}
.empty-page p{font-size:16px;color:var(--text-lighter);margin-bottom:20px}
/* Responsive */
@media(max-width:992px){
.footer-grid{grid-template-columns:1fr 1fr}
.with-sidebar{grid-template-columns:1fr}
.contact-grid{grid-template-columns:1fr}
.product-detail-header{grid-template-columns:1fr}
.brand-detail-grid{grid-template-columns:1fr}
.brand-product-grid{grid-template-columns:repeat(3,1fr)}
.submenu.mega{min-width:auto;left:0;transform:none}
.submenu.mega .mega-grid{grid-template-columns:1fr}
.reading-frame{padding:28px 32px;max-width:none;margin:0}
.sol-meta-bar{padding:0 32px}
.sol-meta-row{flex-direction:column;align-items:flex-start;gap:6px}
.sol-meta-row{padding:12px 14px;gap:10px}
.sol-meta-label{min-width:64px;font-size:14px}
}
@media(max-width:768px){
.nav-toggle{display:block;background:var(--primary);color:#fff;border-radius:6px;padding:7px 10px;font-size:20px;line-height:1;box-shadow:0 2px 6px rgba(166,124,82,.3)}
.nav-toggle:hover,.nav-toggle:focus{background:var(--primary-dark);color:#fff}
.header-actions .btn-header-auth,.header-actions .admin-edit-btn{display:none !important}
.header-actions .btn-header-search{padding:5px 12px;font-size:12px}
.nav-list{display:none;position:fixed;top:var(--header-h);left:0;right:0;background:var(--bg-white);flex-direction:column;box-shadow:var(--shadow-lg);padding:8px 0;max-height:80vh;overflow-y:auto;z-index:1000}
.nav-list.active{display:flex}
.nav-list > li > a{padding:10px 20px;border-radius:0}
.has-submenu .submenu{display:none !important}
.hero h1{font-size:26px}
.hero{padding:40px 0 32px}
.hero-stats{flex-wrap:wrap;gap:16px}
.hero-cta{flex-direction:column}
.cards-grid{grid-template-columns:repeat(2,1fr);gap:10px}
.industry-grid{grid-template-columns:repeat(2,1fr);gap:10px}
.industry-card{padding:14px 10px}
.industry-card .icon{font-size:24px;margin-bottom:6px}
.industry-card h3{font-size:14px;margin-bottom:4px}
.industry-card p{font-size:11px;line-height:1.4;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.industry-card .more{font-size:11px;margin-top:4px}
.card-body{padding:12px 10px}
.card-body h3{font-size:13px;margin-bottom:4px}
.card-body h3 a{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.card-body p{font-size:11px;line-height:1.4;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.card-tag{font-size:10px;padding:1px 6px;margin-bottom:4px}
.card-meta{font-size:10px;margin-top:6px;padding-top:6px}
.solutions-grid{grid-template-columns:1fr}
.footer-grid{grid-template-columns:1fr}
.page-header h1{font-size:22px}
.page-header{padding:30px 0}
.article-content h1{font-size:22px}
.reading-frame{padding:22px 20px}
.reading-frame .article-body{font-size:15px;line-height:1.8}
.sol-meta-bar{padding:0 20px;gap:10px}
.sol-meta-row{padding:10px 12px}
.sol-meta-row{flex-direction:column;align-items:flex-start;gap:8px;padding:12px 14px}
.sol-meta-label{min-width:0;font-size:14px}
.sol-meta-tip{margin-left:0;white-space:normal}
.header-actions .btn-outline{display:none}
.section{padding:36px 0}
.brand-grid{grid-template-columns:1fr}
.brand-product-grid{grid-template-columns:repeat(2,1fr);gap:10px}
.brand-product-thumb{height:130px}
.brand-detail-top{flex-direction:column;align-items:flex-start;gap:18px}
.brand-detail-info h1{font-size:24px}
.brand-detail-logo{height:auto;max-width:100%;padding:10px 20px}
.brand-detail-logo img{max-height:64px}
.product-grid{grid-template-columns:repeat(auto-fill,minmax(140px,1fr))}
.brand-stats{gap:16px}
.stat-item strong{font-size:22px}
.product-grid-main{grid-template-columns:repeat(auto-fill,minmax(200px,1fr))}
}
/* Print */
@media print{
.site-header,.site-footer,.top-bar,.nav-toggle,.hero,.cta-banner{display:none}
body{font-size:13px}
.container{max-width:100%}
}
/* ============================================
NAV DROPDOWN MEGA MENU
============================================ */
.nav-dropdown {position:relative}
.nav-dropdown .dropdown-arrow {font-size:10px;margin-left:4px;transition:transform 0.2s}
.nav-dropdown:hover .dropdown-arrow {transform:rotate(180deg)}
.nav-dropdown .dropdown-mega {
position:absolute;top:100%;left:50%;transform:translateX(-50%);
background:#fff;border-radius:12px;box-shadow:0 12px 40px rgba(0,0,0,0.15);
padding:24px 28px;min-width:720px;z-index:1000;
opacity:0;visibility:hidden;
transition:opacity 0.2s,visibility 0.2s;
}
.nav-dropdown:hover .dropdown-mega {opacity:1;visibility:visible}
.dropdown-grid {display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.dropdown-col h4 {
font-size:13px;color:#8A6540;margin:0 0 8px 0;padding-bottom:6px;
border-bottom:1px solid #e3f2fd;font-weight:600;
}
.dropdown-col a {
display:block;padding:4px 0;font-size:13px;color:#555;
text-decoration:none;transition:color 0.15s;
}
.dropdown-col a:hover {color:#8A6540;padding-left:4px}
@media (max-width:768px) {
.nav-dropdown .dropdown-mega {display:none !important}
.dropdown-grid {grid-template-columns:1fr 1fr;gap:12px}
.dropdown-col h4 {font-size:12px}
.dropdown-col a {font-size:12px}
}
/* ============================================
PRODUCTS PAGE LAYOUT
============================================ */
.products-page {background:#f5f7fa;min-height:calc(100vh - 200px);padding:0 0 48px 0}
/* Products header */
.products-header {
background: linear-gradient(90deg, #8A6540, #2196f3);
color:#fff;border-radius:10px;
padding:18px 24px;margin-bottom:20px;
display:flex;align-items:center;justify-content:center;
position:relative;
}
.products-header-inner {
display:flex;align-items:center;justify-content:center;gap:10px;
font-size:18px;font-weight:600;flex-wrap:wrap;
}
.products-header .ph-item a {
color:#fff;text-decoration:none;transition:opacity .15s;
}
.products-header .ph-item a:hover {text-decoration:underline;opacity:.95}
/* 2026-08-26 SEO：列表页语义化 H1（视觉与导航项一致，不破坏布局） */
.products-header .ph-item.ph-current {
margin:0;padding:0;display:inline;font-size:inherit;font-weight:700;color:#fff;
line-height:inherit;border:none;background:none;
}
.products-header .ph-sep {opacity:.85;font-weight:700;font-size:16px;margin:0 2px}
.products-count {
position:absolute;right:24px;font-size:14px;color:rgba(255,255,255,.92);
}
.products-count strong {color:#fff;font-size:18px;margin:0 2px}
/* Products layout: sidebar + main */
.products-layout {display:flex;gap:28px;align-items:flex-start}
/* ============================================
SIDEBAR
============================================ */
.products-sidebar {
width:260px;flex-shrink:0;
background:#fff;border-radius:10px;box-shadow:0 2px 8px rgba(0,0,0,0.06);
overflow:hidden;position:sticky;top:80px;
/* 分类多时侧栏独立滚动，避免二级/三级内容被视口底部裁剪 */
max-height:calc(100vh - 96px);
overflow-y:auto;
}
/* 自定义滚动条，保持页面整体视觉统一 */
.products-sidebar::-webkit-scrollbar{width:6px}
.products-sidebar::-webkit-scrollbar-track{background:transparent}
.products-sidebar::-webkit-scrollbar-thumb{background:#d1d9e6;border-radius:3px}
.products-sidebar::-webkit-scrollbar-thumb:hover{background:#b6c3d6}
/* Sidebar search */
.sidebar-search {padding:14px;border-bottom:1px solid #f0f0f0}
.sidebar-search form {display:flex;gap:0}
.sidebar-search-input {
flex:1;padding:8px 12px;border:1px solid #e0e0e0;border-radius:6px 0 0 6px;
font-size:13px;outline:none;background:#fafafa;
}
.sidebar-search-input:focus {border-color:#8A6540;background:#fff}
.sidebar-search-btn {
padding:8px 12px;border:1px solid #8A6540;border-left:none;
background:#8A6540;color:#fff;border-radius:0 6px 6px 0;cursor:pointer;
font-size:14px;white-space:nowrap;
}
/* 产品热搜（检索框下方，后台热搜关键词-产品 栏目配置） */
.product-hot {padding:12px 16px 14px;border-bottom:1px solid #f0f0f0}
.product-hot .cat-tree-title {padding:0 0 8px;color:#666}
.product-hot-tags {display:flex;flex-wrap:wrap;gap:4px 14px}
.product-hot-tag {
padding:0;border:0;border-radius:0;background:none;
color:var(--primary);font-size:13px;line-height:1.7;
text-decoration:none;font-family:inherit;cursor:pointer;display:inline-block;
}
.product-hot-tag:hover {background:none;color:#0a3d91;text-decoration:underline}
/* 产品详情页右栏：检索框下方的产品热搜（在 .pd-search-box 卡片内部） */
.pd-search-box .product-hot {padding:12px 0 0;border-bottom:none;border-top:1px dashed var(--border-light);margin-top:12px}
.pd-search-box .product-hot .cat-tree-title {font-size:13px;color:var(--text-light);margin-bottom:8px;padding:0}
/* #1077（2026-09-05）：产品检索卡片下移至目录树下方；热搜文字链接已提升为 .product-hot-tag 基础样式 */
/* Category tree */
.cat-tree {padding:8px 0}
.cat-tree-title {
font-size:13px;color:#999;text-transform:uppercase;letter-spacing:1px;
padding:8px 16px 4px;margin:0;font-weight:600;
}
.cat-tree-list {list-style:none;margin:0;padding:0}
.cat-tree-item {
display:flex;align-items:center;gap:8px;
padding:9px 16px;text-decoration:none;color:#444;
font-size:14px;transition:all 0.15s;
border-left:3px solid transparent;
}
.cat-tree-item:hover {background:#f5f8ff;color:#8A6540}
.cat-tree-item.active {
background:#F3ECDD;color:#8A6540;font-weight:600;
border-left-color:#8A6540;
}
.cat-icon {font-size:16px;width:20px;text-align:center;flex-shrink:0}
.cat-label {flex:1}
.cat-count {
font-size:12px;color:#aaa;background:#f0f0f0;
padding:1px 7px;border-radius:10px;min-width:24px;text-align:center;
}
.cat-tree-item.active .cat-count {background:#bbdefb;color:#8A6540}
/* #834/#835 浮现卡归属亮显：浮窗打开期间（flyout-open 类由 JS 维护，浮窗 detach 在 body
下 hover 链不可用），侧栏一级目录天蓝色背景亮显，明示「这张浮现卡是谁的」。
用户反馈去掉框线，只留底色。 */
.cat-tree-item.cat-root.flyout-open {
background:#c7e4f8;
color:#0a3d91;font-weight:600;
}
.cat-arrow {
font-size:10px;color:#aaa;transition:transform 0.2s;
margin-left:auto;
}
.cat-arrow.open {transform:rotate(90deg)}
/* Sub-category list */
.cat-sub-list {
list-style:none;margin:0;padding:0;
max-height:0;overflow:hidden;
transition:max-height 0.3s ease;
}
/* 侧栏自身可滚动，展开不再设 900px 上限，避免长分类被裁剪 */
.cat-sub-list.visible {max-height:none}
.cat-sub-item {
display:flex;align-items:center;justify-content:space-between;
padding:7px 16px 7px 44px;text-decoration:none;color:#666;
font-size:13px;transition:all 0.15s;
}
.cat-sub-item:hover {color:#8A6540;background:#fafcff}
.cat-sub-item.active {color:#8A6540;font-weight:600;background:#f0f5ff}
.cat-sub-count {font-size:12px;color:#aaa}
/* 二级右侧容器（计数+箭头） */
.cat-sub-right {display:inline-flex;align-items:center;gap:4px;flex-shrink:0}
.sub3-arrow {font-size:10px;color:#b6c3d6;transition:transform 0.2s}
.sub3-arrow.open {transform:rotate(90deg);color:#8A6540}
/* 三级分类（子类）：二级下再缩进一层；默认收起，仅激活二级的展开 */
.cat-sub3-list {
list-style:none;margin:0;padding:0;border-left:2px solid #e8eef7;margin-left:44px;
max-height:0;overflow:hidden;transition:max-height 0.3s ease;
}
.cat-sub3-list.visible {max-height:none}
.cat-sub3-item {
display:flex;align-items:center;justify-content:space-between;
padding:5px 12px 5px 14px;text-decoration:none;color:#8a97a8;
font-size:13px;transition:all 0.15s;
}
.cat-sub3-item:hover {color:#8A6540;background:#f7fafe}
.cat-sub3-item.active {color:#8A6540;font-weight:600;background:#eef4ff}
/* 侧栏二级 hover 浮出三级面板（#680/#681）；#833 改为内联三/四/五级，面板加宽。 */
.cat-sub-flyout {
display:none;position:fixed;left:0;top:0;
min-width:420px;max-width:560px;background:#fff;border:1px solid #dbe7f7;border-radius:8px;
box-shadow:0 10px 28px rgba(10,61,145,.16);padding:10px 14px 12px;z-index:1002;
max-height:calc(100vh - 24px);overflow-y:auto;overscroll-behavior:contain;
}
.cat-sub-flyout.visible {display:block}
.cat-sub-flyout::before {
content:"";position:absolute;left:-10px;top:0;width:10px;height:100%;background:transparent;
}
.cat-sub-flyout h5 {
font-size:13px;color:#0a3d91;margin:0 0 6px;padding:0 0 5px;border-bottom:1px dashed #e3f2fd;
white-space:nowrap;font-weight:600;
}
.cat-sub-flyout a {
display:flex;align-items:center;justify-content:space-between;
padding:5px 0;text-decoration:none;color:#555;font-size:13px;white-space:nowrap;
}
.cat-sub-flyout a:hover {color:#8A6540}
.cat-sub-flyout a.active {color:#8A6540;font-weight:600}
.cat-sub-flyout a .cat-sub-count {margin-left:8px}
@media (hover: hover) {
.cat-sub-list > li:hover > .cat-sub-item {color:#8A6540;background:#fafcff}
/* #834/#835 浮出面板归属亮显：与一级目录同款天蓝底，明示面板是谁的（类由 JS 维护），去框线。 */
.cat-sub-list > li.flyout-open > .cat-sub-item {
color:#0a3d91;font-weight:600;
background:#c7e4f8;
}
/* 桌面 hover 设备：隐藏内联三级列表，改由浮出面板展示 */
.cat-sub3-list {display:none !important}
.sub3-arrow {display:none}
}
@media (hover: none) {
.cat-sub-flyout {display:none !important}
.sub3-arrow {display:inline-block}
}
/* 侧栏一级 hover 浮现卡（#819/#832/#833）：单面板内联二三四级（京东式横向展开）。
面板宽度足以容纳「二级标题 + 三级/四级内联链接」整行，避免纵向过长/顶部裁剪。 */
.cat-root-flyout {
display:none;position:fixed;left:0;top:0;
min-width:640px;max-width:920px;background:#fff;border:2px solid #8A6540;border-radius:8px;
box-shadow:0 10px 28px rgba(10,61,145,.18);padding:10px 14px 10px;z-index:1002;
max-height:calc(100vh - 24px);overflow-y:auto;overscroll-behavior:contain;
}
.cat-root-flyout.visible {display:block}
.cat-root-flyout h5 {
font-size:13.5px;color:#0a3d91;margin:0 0 7px;padding:0 0 5px;
border-bottom:1px dashed #e3f2fd;white-space:nowrap;font-weight:600;
}
@media (hover: none) {
.cat-root-flyout {display:none !important}
}
/* 侧栏分类多级缩进（#829 四级/五级全浮现）：三级起任意深度的递归子列表 */
.cat-tree-nested {list-style:none;margin:0;padding:0}
/* 不同深度的左侧缩进阶梯 + 引导线 */
.cat-tree-nested.depth-3 {border-left:2px solid #cfe0f5;margin-left:0}
.cat-tree-nested.depth-4 {border-left:2px solid #dbe7f7;margin-left:20px}
.cat-tree-nested.depth-5 {border-left:2px solid #e8eef7;margin-left:36px}
/* 基础链接 */
.cat-tree-nested-link {
display:flex;align-items:center;justify-content:space-between;
padding:4px 4px 4px 12px;text-decoration:none;color:#7a8a9a;
font-size:13px;white-space:nowrap;border-radius:4px;
}
.cat-tree-nested-link:hover {color:#8A6540;background:#f7fafe}
.cat-tree-nested-link.active {color:#8A6540;font-weight:600;background:#eef4ff}
.cat-tree-nested-link .cat-sub-count {margin-left:8px;flex-shrink:0}
/* 层级越深，字号/颜色越弱，缩进越大；三级作为父级需要加粗亮显 */
.cat-tree-nested-link.depth-3 {
color:#0a3d91;font-size:14px;font-weight:700;
padding:6px 4px 6px 8px;margin:2px 0 4px;
background:#f7fbff;border-radius:4px;
}
.cat-tree-nested-link.depth-4 {color:#4a5a6a;font-size:13px;font-weight:400;padding-left:10px}
.cat-tree-nested-link.depth-5 {color:#6a7a8a;font-size:12.5px;font-weight:400;padding-left:10px}
/* 二级 hover 浮出面板与浮窗保持一致 */
.cat-sub-flyout .cat-tree-nested {margin-left:0;padding-left:4px}
.cat-sub-flyout .cat-tree-nested.depth-3 {border-left-color:#cfe0f5}
.cat-sub-flyout .cat-tree-nested.depth-4 {border-left-color:#dbe7f7;margin-left:16px}
.cat-sub-flyout .cat-tree-nested.depth-5 {border-left-color:#e8eef7;margin-left:30px}
.cat-sub-flyout .cat-tree-nested-link.depth-3 {color:#0a3d91;font-weight:600}
.cat-sub-flyout .cat-tree-nested-link.depth-4 {color:#3d4f5f}
.cat-sub-flyout .cat-tree-nested-link.depth-5 {color:#6a7a8a;font-size:12.5px}
/* 一级 hover 浮窗内缩进与浮出面板保持一致 */
.cat-sub-flyout .cat-tree-nested, .cat-root-flyout .crf-sub3s .cat-tree-nested {padding-left:2px}
/* #832/#833 横向级联分类（京东式单面板内联展开）：
一级/二级 hover 浮现面板内，当前层作为行标题，下级分类全部内联平铺在一行展示。 */
.cat-hv-list {list-style:none;margin:0;padding:0}
.cat-hv-item {
display:flex;align-items:flex-start;gap:10px;
padding:5px 0;border-bottom:1px dashed #eef4ff;
}
.cat-hv-item:last-child {border-bottom:none}
.cat-hv-link {
display:inline-flex;align-items:center;gap:6px;flex-shrink:0;
padding:4px 8px;text-decoration:none;color:#0a3d91;font-size:14px;font-weight:700;
white-space:nowrap;border-radius:4px;line-height:1.3;
background:#f5f9ff;
}
.cat-hv-link:hover {background:#e8f2ff}
/* 2026-09-05 用户反馈：active 深蓝色块与文字撞色不显现，去掉色块改蓝色文字（计数徽章保持蓝底白字） */
.cat-hv-link.active {background:transparent;color:#8A6540}
.cat-hv-link .cat-sub-count {
font-size:11px;color:#fff;background:#8A6540;padding:1px 5px;border-radius:8px;font-weight:400;
}
/* 行内展开区：三级/四级链接换行平铺（#834 行间距收紧约 1/3） */
.cat-hv-inline {
flex:1;display:flex;align-items:center;flex-wrap:wrap;gap:4px 5px;
padding-top:2px;line-height:1.15;
}
/* #835 组：一个父级项 + 它自己的子项（> children）作为一个整体换行单元；
组与组之间用 .cat-hv-divider(·) 分隔，避免所有层级混成一坨。 */
.cat-hv-inline-group {
display:inline-flex;align-items:center;flex-wrap:wrap;gap:2px 3px;
}
/* #835 子项容器：四级/五级在组内横向流式排列（不纵向堆叠、不与其他组混排）。 */
.cat-hv-inline-children {
display:inline-flex;align-items:center;flex-wrap:wrap;gap:4px 5px;
}
.cat-hv-inline-sep {
color:#b6c3d6;font-size:13px;font-weight:700;margin:0 2px;flex-shrink:0;
}
.cat-hv-inline-sep.child-sep {color:#94a3b8;font-size:13px;font-weight:700;margin:0 2px}
.cat-hv-inline-link {
display:inline-flex;align-items:center;gap:3px;
color:#4a5a6a;font-size:13px;text-decoration:none;white-space:nowrap;
padding:1px 4px;border-radius:4px;
}
.cat-hv-inline-link:hover {color:#8A6540;background:#f0f5ff}
.cat-hv-inline-link.active {color:#8A6540;font-weight:600;background:#eef4ff}
/* #837 三级目录名称字号加大一号；默认蓝色，hover/active 金色；数字仍保持蓝色，不加粗 */
.cat-root-flyout .cat-hv-inline-link.depth-3,
.cat-sub-flyout .cat-hv-inline-link.depth-4 {
color:#8A6540;font-size:14px;font-weight:400;
}
.cat-root-flyout .cat-hv-inline-link.depth-3:hover,
.cat-sub-flyout .cat-hv-inline-link.depth-4:hover {color:#d4a017;background:#fff8e6}
.cat-root-flyout .cat-hv-inline-link.depth-3.active,
.cat-sub-flyout .cat-hv-inline-link.depth-4.active {color:#d4a017;background:#fff8e6;font-weight:600}
/* #834/#837 仅三级目录的数据数字显蓝色（一级浮窗内为 depth-3，二级浮窗内对应 depth-4） */
.cat-root-flyout .cat-hv-inline-link.depth-3 .cat-sub-count,
.cat-sub-flyout .cat-hv-inline-link.depth-4 .cat-sub-count {color:#8A6540;font-weight:600}
/* 层级越深越弱：四级/五级更小更灰 */
.cat-hv-inline-link.depth-4 {color:#4a5a6a;font-size:13px}
.cat-hv-inline-link.depth-5 {color:#6a7a8a;font-size:12.5px}
.cat-hv-inline-link.depth-6 {color:#7a8a9a;font-size:12px}
.cat-hv-inline-link .cat-sub-count {font-size:10px;color:#94a3b8;margin-left:2px}
.cat-hv-divider {color:#cbd5e1;font-size:12px;margin:0 2px}
/* 二级 hover 浮出面板同样适用内联布局，但尺寸略紧凑（#834 同步行距收紧） */
.cat-sub-flyout .cat-hv-item {padding:4px 0}
.cat-sub-flyout .cat-hv-link {font-size:13px;padding:3px 6px}
.cat-sub-flyout .cat-hv-inline {padding-top:1px;gap:3px 4px;line-height:1.15}
.cat-sub-flyout .cat-hv-inline-link {font-size:12.5px}
/* #835 修复 .cat-sub-flyout a{display:flex} 把内联链接块化成纵向的覆盖；
组、子项容器、分隔符也保持 inline/inline-flex，防止被通用 a 规则破坏。 */
.cat-sub-flyout .cat-hv-inline-group,
.cat-sub-flyout .cat-hv-inline-children {display:inline-flex;align-items:center;flex-wrap:wrap;gap:3px 4px}
.cat-sub-flyout .cat-hv-inline-link {display:inline-flex;padding:1px 4px}
.cat-sub-flyout .cat-hv-inline-sep,
.cat-sub-flyout .cat-hv-divider {display:inline}
@media (hover: none) {
.cat-hv-inline {display:none}
}
/* Brand filter in sidebar */
.sidebar-brand-filter {padding:12px 16px 16px;border-top:1px solid #f0f0f0}
.brand-list {display:flex;flex-wrap:wrap;gap:6px}
.brand-tag {
display:inline-flex;align-items:center;gap:4px;
padding:3px 9px;background:#f5f5f5;border-radius:4px;
font-size:12px;color:#666;text-decoration:none;
transition:all 0.15s;border:1px solid transparent;
}
.brand-tag:hover {background:#F3ECDD;color:#8A6540;border-color:#bbdefb}
.brand-tag.active {background:#8A6540;color:#fff;border-color:#8A6540}
.brand-cnt {font-size:10px;opacity:0.7}
/* ============================================
MAIN CONTENT
============================================ */
.products-main {flex:1;min-width:0}
/* Active filters */
.active-filters {
display:flex;flex-wrap:wrap;align-items:center;gap:8px;
margin-bottom:16px;padding:10px 14px;background:#fff;
border-radius:8px;box-shadow:0 1px 4px rgba(0,0,0,0.04);
}
.filter-tag {
display:inline-flex;align-items:center;gap:4px;
padding:4px 10px;background:#F3ECDD;color:#8A6540;
border-radius:16px;font-size:12px;font-weight:500;
}
.filter-remove {
color:#8A6540;font-size:14px;font-weight:700;text-decoration:none;
line-height:1;margin-left:2px;
}
.filter-remove:hover {color:#e53935}
.filter-result-info {font-size:12px;color:#999;margin-left:4px}
/* 一键换序按钮 */
.sort-toggle-btn {
display:inline-flex;align-items:center;gap:4px;
margin-left:auto;padding:5px 12px;background:#fff;
border:1px solid #d0e0f2;border-radius:16px;
font-size:12px;font-weight:500;color:#8A6540;
text-decoration:none;transition:all .2s;
}
.sort-toggle-btn:hover {
background:#F3ECDD;border-color:#8A6540;color:#A67C52;
}
.sort-toggle-icon {font-size:13px;line-height:1}
.sort-toggle-text {white-space:nowrap}
/* Product grid */
.product-grid {
display:grid;
grid-template-columns:repeat(auto-fill,minmax(300px,1fr));
gap:16px;
}
/* Product card - v2 参考图清爽风格（天蓝标题条 + 左图右文 + 参数 + 价格/查看详情） */
.product-card {
background:#fff;border-radius:12px;overflow:hidden;
box-shadow:0 2px 8px rgba(30,159,255,0.08),0 1px 3px rgba(0,0,0,0.06);
transition:box-shadow 0.2s,transform 0.2s;
display:flex;flex-direction:column;
position:relative;cursor:pointer;
}
.product-card:hover {
box-shadow:0 8px 24px rgba(30,159,255,0.14),0 2px 6px rgba(0,0,0,0.08);
transform:translateY(-3px);
}
/* 整卡可点击：透明遮罩覆盖卡片，内部交互链接/按钮提升层级 */
.product-card-link-overlay {
position:absolute;inset:0;z-index:1;
text-decoration:none;color:transparent;background:transparent;
}
.product-card-header,
.product-card-meta.pc-cats a,
.pc-price-login a,
.pc-btn-detail {
position:relative;z-index:2;
}
.product-card-header {
display:block;background:#1e9fff;
color:#fff;text-decoration:none;padding:11px 16px;
min-height:42px;display:flex;align-items:center;justify-content:center;
}
.product-card-title {
margin:0;font-size:15px;font-weight:700;line-height:1.35;
text-align:center;
display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden;
}
.product-card-body {
display:flex;gap:14px;padding:14px 16px 10px;
}
.product-card-media {
width:110px;flex-shrink:0;display:flex;flex-direction:column;align-items:center;gap:6px;
}
.product-card-thumb {
width:110px;height:90px;flex-shrink:0;background:#f6f9fc;
border-radius:8px;display:flex;align-items:center;justify-content:center;
overflow:hidden;border:1px solid #e8f1f8;
}
.product-card-thumb img {
max-width:92%;max-height:92%;object-fit:contain;
transition:transform 0.3s;
}
.product-card:hover .product-card-thumb img {transform:scale(1.05)}
.product-card-caption {
font-size:10px;color:#0d7bc4;text-align:center;line-height:1.3;
max-width:110px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;
}
/* 无图占位复用，但限制在缩略图尺寸内 */
.product-card-thumb .no-thumb,
.product-card-thumb .thumb-placeholder {
background:linear-gradient(160deg,#f2f8ff 0%,#e2eefb 100%);
width:100%;height:100%;
}
.product-card-thumb .no-thumb::before,
.product-card-thumb .thumb-placeholder::before {
content:"";width:36px;height:36px;flex-shrink:0;
background:center/contain no-repeat url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%2393b8e8'%3E%3Cpath d='M19.14 12.94c.04-.3.06-.61.06-.94 0-.32-.02-.64-.07-.94l2.03-1.58c.18-.14.23-.41.12-.61l-1.92-3.32c-.12-.22-.37-.29-.59-.22l-2.39.96c-.5-.38-1.03-.7-1.62-.94l-.36-2.54c-.04-.24-.24-.41-.48-.41h-3.84c-.24 0-.43.17-.47.41l-.36 2.54c-.59.24-1.13.57-1.62.94l-2.39-.96c-.22-.08-.47 0-.59.22L2.74 8.87c-.12.21-.08.47.12.61l2.03 1.58c-.05.3-.09.63-.09.94s.02.64.07.94l-2.03 1.58c-.18.14-.23.41-.12.61l1.92 3.32c.12.22.37.29.59.22l2.39-.96c.5.38 1.03.7 1.62.94l.36 2.54c.05.24.24.41.48.41h3.84c.24 0 .44-.17.47-.41l.36-2.54c.59-.24 1.13-.56 1.62-.94l2.39.96c.22.08.47 0 .59-.22l1.92-3.32c.12-.22.07-.47-.12-.61l-2.01-1.58zM12 15.6c-1.98 0-3.6-1.62-3.6-3.6s1.62-3.6 3.6-3.6 3.6 1.62 3.6 3.6-1.62 3.6-3.6 3.6z'/%3E%3C/svg%3E");
}
.product-card-thumb .no-thumb small,
.product-card-thumb .thumb-placeholder small {font-size:10px;color:#7a94b8;letter-spacing:.5px;text-align:center;line-height:1.3}
.product-card-info {flex:1;min-width:0;display:flex;flex-direction:column;gap:5px}
.product-card-info-title {
font-size:15px;font-weight:700;color:#1a1a2e;line-height:1.35;
display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden;
margin-bottom:2px;
}
.product-card-meta {
font-size:12px;color:#475569;line-height:1.4;
display:flex;align-items:center;gap:6px;flex-wrap:wrap;
}
.pc-meta-label {
color:#94a3b8;font-size:11px;min-width:30px;display:inline-block;
}
.product-card-meta.pc-cats a {
color:#8A6540;text-decoration:none;font-weight:500;
}
.product-card-meta.pc-cats a:hover {color:#A67C52;text-decoration:underline}
.product-card-meta.pc-cats .cat-sep {color:#cbd5e1;padding:0 2px}
.product-card-usage {
padding:10px 16px 12px;flex:1;
font-size:12px;color:#475569;line-height:1.7;
text-align:left;
overflow:hidden;
display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;
}
/* 无用途标签的产品卡占位保持高度 */
.product-card-usage:empty{display:none;}
.pc-usage-empty{color:#cbd5e1;font-style:italic}
.product-card-footer {
display:flex;align-items:center;justify-content:space-between;gap:10px;
padding:10px 16px 14px;border-top:1px solid #eef2f7;
}
.pc-price {
font-size:13px;font-weight:600;color:#8A6540;
display:flex;align-items:center;gap:3px;flex-wrap:wrap;
}
.pc-price-label {color:#64748b;font-weight:500;font-size:12px}
.pc-price-val {color:#8A6540;font-weight:700}
.pc-price-login a {
color:#8A6540;text-decoration:none;font-weight:600;
}
.pc-price-login a:hover {color:#A67C52;text-decoration:underline}
.pc-btn-detail {
display:inline-flex;align-items:center;justify-content:center;
padding:6px 18px;background:#fff;color:#374151;
border:1px solid #d1d5db;border-radius:16px;
font-size:13px;font-weight:500;text-decoration:none;
transition:all 0.15s;white-space:nowrap;
}
.pc-btn-detail:hover {background:#f8fafc;border-color:#9ca3af;color:#111827}
/* 兼容旧卡片（首页/其他页面若仍使用旧结构，保持基本可用） */
.product-card-inner {display:flex;flex-direction:column;height:100%;text-decoration:none;color:inherit}
.product-body {padding:12px 14px;flex:1;display:flex;flex-direction:column;gap:6px}
.product-name {
font-size:13px;font-weight:600;color:#1a1a2e;line-height:1.4;
margin:0;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
}
.product-meta {display:flex;align-items:center;gap:8px;font-size:11px;color:#888}
.product-model {color:#8A6540;font-family:monospace;font-size:11px}
.product-brand {color:#666}
.product-tags {display:flex;flex-wrap:wrap;gap:4px;margin-top:2px}
.tag-cat {
font-size:10px;padding:2px 6px;background:#e3f2fd;color:#8A6540;
border-radius:3px;
}
.tag-type {
font-size:10px;padding:2px 6px;background:#f3e5f5;color:#7b1fa2;
border-radius:3px;
}
.product-card-categories {
display:flex;align-items:center;flex-wrap:wrap;gap:2px;
font-size:11px;line-height:1.5;margin-top:2px;
}
.product-card-categories a {
color:#8A6540;text-decoration:none;font-weight:500;
}
.product-card-categories a:hover {color:#A67C52;text-decoration:underline}
.product-card-categories .cat-sep {color:#b6c6d9;padding:0 2px}
.product-card > .product-card-categories {padding:8px 14px 12px}
.product-footer {
padding:10px 14px;border-top:1px solid #f0f0f0;
text-align:center;
}
.btn-inquiry {
display:inline-block;padding:6px 20px;background:#8A6540;color:#fff;
border-radius:18px;font-size:12px;font-weight:500;
transition:background 0.2s;
}
.btn-inquiry:hover {background:#A67C52}
/* Empty state */
.empty-results {
text-align:center;padding:60px 20px;background:#fff;
border-radius:10px;box-shadow:0 1px 4px rgba(0,0,0,0.04);
}
.empty-icon {font-size:48px;margin-bottom:12px}
.empty-results h3 {font-size:18px;color:#666;margin:0 0 8px}
.empty-results p {font-size:14px;color:#999;margin:0 0 20px}
.btn-back {
display:inline-block;padding:8px 20px;background:#8A6540;color:#fff;
border-radius:6px;text-decoration:none;font-size:14px;
}
/* ============================================
PAGINATION
============================================ */
.pagination {
display:flex;justify-content:center;align-items:center;gap:6px;
margin-top:32px;padding:20px 0;
}
.page-btn {
padding:8px 16px;background:#fff;color:#555;text-decoration:none;
border-radius:6px;font-size:13px;border:1px solid #e0e0e0;
transition:all 0.15s;
}
.page-btn:hover {background:#f5f5f5;color:#8A6540;border-color:#8A6540}
.page-num {
width:36px;height:36px;display:flex;align-items:center;justify-content:center;
background:#fff;color:#555;text-decoration:none;
border-radius:6px;font-size:13px;border:1px solid #e0e0e0;
transition:all 0.15s;
}
.page-num:hover {background:#f5f5f5;color:#8A6540}
.page-num.current {
background:#8A6540;color:#fff;border-color:#8A6540;font-weight:600;
}
.page-dots {color:#aaa;padding:0 2px;letter-spacing:2px}
/* ============================================
RESPONSIVE
============================================ */
@media (max-width:900px) {
.products-layout {flex-direction:column}
.products-sidebar {
width:100%;position:static;display:flex;flex-wrap:wrap;gap:0;
max-height:none;overflow-y:visible;
}
.sidebar-search {flex:1;min-width:200px}
.cat-tree {flex:2;min-width:300px}
.sidebar-brand-filter {width:100%}
.product-hot {width:100%;flex:1 1 100%;min-width:200px}
.cat-sub-list.visible {max-height:none}
.product-grid {grid-template-columns:repeat(auto-fill,minmax(160px,1fr))}
.product-thumb {height:140px}
}
@media (max-width:600px) {
.products-header h1 {font-size:18px}
.product-grid {grid-template-columns:repeat(2,1fr);gap:10px}
.product-thumb {height:120px}
.product-body {padding:8px 10px}
.product-name {font-size:12px}
.product-footer {padding:8px 10px}
.btn-inquiry {padding:5px 12px;font-size:11px}
.breadcrumb {font-size:12px}
}
/* ============================================
Header Logo & Footer Re-layout v2.1
============================================ */
/* ---------- Header Logo ---------- */
.header-main .logo {
display: flex;
flex-direction: row;
align-items: center;
gap: 12px;
text-decoration: none;
flex-shrink: 0;
}
.logo-img {
height: 35px;
width: auto;
max-width: 100%;
object-fit: contain;
display: block;
}
.logo-text {
display: flex;
flex-direction: row;
align-items: center;
gap: 8px;
line-height: 1.2;
}
.logo-text strong {
font-size: 1.3rem;
color: var(--primary, #8C6D4F);
letter-spacing: 0.5px;
}
.logo-text small {
font-size: 0.72rem;
color: var(--text-light, #6c757d);
font-weight: 500;
text-transform: uppercase;
letter-spacing: 0.8px;
}
@media (max-width: 991px) {
.logo-img {
height: 29px;
max-width: 100%;
}
.logo-text strong {
font-size: 1.25rem;
}
}
@media (max-width: 640px) {
.header-main .logo {
gap: 8px;
}
.logo-img {
height: 25px;
max-width: 100%;
}
.logo-text strong {
font-size: 1.4rem;
}
.logo-text small {
display: none;
}
}
/* ---------- Footer Re-layout ---------- */
.site-footer {
background: linear-gradient(180deg, #3E342E 0%, #2E2721 100%);
color: rgba(255, 255, 255, 0.92);
padding: 36px 0 0;
font-size: 0.92rem;
line-height: 1.7;
}
.site-footer a {
color: rgba(255, 255, 255, 0.78);
text-decoration: none;
transition: color 0.2s ease, transform 0.2s ease;
}
.site-footer a:hover {
color: var(--accent, #B85C38);
}
.footer-grid {
display: grid;
grid-template-columns: 1.45fr minmax(0, 1fr) minmax(0, 1fr) minmax(0, 0.68fr) minmax(0, 0.95fr) 1.55fr;
gap: 18px 22px;
align-items: start;
}
.footer-grid > .footer-col {
min-width: 0;
overflow: hidden;
overflow-wrap: break-word;
}
.footer-col h3 {
color: #fff;
font-size: 1rem;
margin: 0 0 10px;
padding-bottom: 6px;
border-bottom: 2px solid rgba(184,92,56, 0.45);
display: inline-block;
min-width: 70%;
}
.footer-col h3 a {
color: inherit;
text-decoration: none;
}
.footer-col h3 a:hover {
color: var(--accent, #B85C38);
}
.footer-col ul {
list-style: none;
padding: 0;
margin: 0;
}
.footer-col ul li {
margin-bottom: 8px;
line-height: 1.6;
}
.footer-col ul li a {
display: inline-block;
font-size: 14px;
color: #cbd5e1;
line-height: 1.6;
transition: var(--transition);
}
.footer-col ul li a:hover {
color: var(--accent-light);
transform: translateX(4px);
}
/* Brand column */
.footer-brand {
padding-right: 12px;
}
.footer-logo {
display: inline-block;
margin-bottom: 10px;
}
.footer-logo-text {
color: var(--accent, #B85C38);
font-weight: 700;
letter-spacing: 1px;
}
.footer-logo img {
height: 42px;
width: auto;
display: block;
}
.footer-slogan {
color: var(--accent, #B85C38);
font-weight: 600;
font-size: 0.9rem;
margin: 0 0 10px;
line-height: 1.45;
}
.footer-slogan .footer-logo-text {
font-size: 1em;
margin-right: 4px;
}
.footer-about-text {
margin: 0 0 10px;
color: rgba(255, 255, 255, 0.72);
font-size: 0.88rem;
line-height: 1.7;
}
.footer-emergency {
margin-top: 4px;
max-width: 280px;
}
.footer-emergency p {
margin: 0 0 2px;
font-size: 0.86rem;
color: rgba(255, 255, 255, 0.82);
}
.footer-emergency a {
color: #D4764E;
font-weight: 600;
text-decoration: none;
}
.footer-emergency a:hover {
text-decoration: underline;
}
/* 400电话同行追加速记：桌面隐藏（走配套工厂版），移动端显示 */
.tel400-inline{display:none}
.footer-cert {
margin: 12px 0 0;
font-size: 0.84rem;
color: rgba(255, 255, 255, 0.68);
}
/* Contact column */
.footer-contact .contact-company {
margin-bottom: 8px;
padding-bottom: 6px;
border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}
.footer-contact .contact-company:last-of-type {
border-bottom: none;
}
.footer-contact .contact-name {
color: #fff;
font-weight: 600;
margin: 0 0 4px;
font-size: 0.9rem;
}
.footer-contact p {
margin: 0 0 2px;
font-size: 0.86rem;
color: rgba(255, 255, 255, 0.74);
}
.footer-contact .contact-hotline {
font-size: 1.15rem;
margin: 2px 0 0;
}
.footer-contact .contact-hotline a {
color: var(--accent, #B85C38);
font-weight: 700;
}
/* Footer brands bar: 通栏页宽品牌展示 */
.footer-brands-bar {
margin-top: 0;
padding: 6px 4vw 0;
margin-bottom: 15px;
}
.footer-brands-inner {
display: flex;
flex-wrap: wrap;
justify-content: center;
align-items: center;
gap: 8px 4px;
max-width: 100%;
box-sizing: border-box;
font-size: 0.88rem;
color: rgba(255, 255, 255, 0.82);
}
.footer-brands-label {
margin-right: 8px;
font-weight: 600;
color: rgba(255, 255, 255, 0.6);
font-size: 0.82rem;
}
.footer-brand-link {
color: rgba(255, 255, 255, 0.92);
text-decoration: none;
transition: color 0.2s;
}
.footer-brand-link:hover {
color: #B85C38;
}
.footer-brand-text {
color: rgba(255, 255, 255, 0.92);
}
.footer-brand-sep {
color: rgba(255, 255, 255, 0.25);
margin: 0 2px;
}
@media (max-width: 640px) {
.footer-brands-bar {
padding: 12px 4vw;
}
.footer-brands-inner {
font-size: 0.8rem;
gap: 6px 2px;
}
}
/* Footer QR codes: 社交媒体二维码 */
.footer-qr-row {
display: grid;
grid-template-columns: repeat(6, 1fr);
gap: 16px;
margin-top: 0;
padding: 0;
}
.footer-qr-main {
grid-column: 2 / span 4;
display: flex;
justify-content: center;
align-items: flex-start;
gap: 16px;
flex-wrap: wrap;
}
.footer-qr-wrap {
position: relative;
display: inline-block;
}
.footer-qr-img {
width: 88px;
height: 88px;
object-fit: cover;
background: #fff;
padding: 3px;
border: 1px solid var(--border);
border-radius: 6px;
box-sizing: border-box;
display: block;
}
/* 2026-09-10：取消悬浮浮现，注释文字常驻显示在二维码图片下方 */
.footer-qr-wrap::after {
content: attr(data-tip);
display: block;
margin-top: 6px;
max-width: 88px;
font-size: 12px;
line-height: 1.4;
text-align: center;
color: inherit;
opacity: .72;
white-space: normal;
overflow-wrap: break-word;
}
.footer-qr-wrap::before {
display: none;
}
@media (max-width: 768px) {
.footer-qr-row {
grid-template-columns: 1fr;
gap: 0;
margin-top: 8px;
}
.footer-qr-main {
grid-column: 1 / -1;
display: flex;
flex-wrap: wrap;
justify-content: center;
align-items: flex-start;
gap: 8px;
padding: 8px 0;
}
.footer-qr-img {
width: 100%;
height: auto;
aspect-ratio: 1 / 1;
max-width: none;
background: #fff;
padding: 0;
border: 1px solid var(--border);
border-radius: 6px;
box-sizing: border-box;
flex: 0 0 auto;
object-fit: cover;
}
/* 5 个并列不分行：弹性宽度 + 上限 62px */
.footer-qr-main .footer-qr-wrap { width: calc((100% - 34px) / 5); max-width: 62px; flex: 0 0 auto; }
.footer-qr-wrap::after { font-size: 10px; margin-top: 4px; }
}
/* Footer friend links: 页宽横排居中散开 */
.footer-friend-links {
margin-top: 6px;
padding: 8px 4vw;
}
.friend-links-list {
display: flex;
flex-wrap: wrap;
justify-content: space-evenly;
align-items: center;
gap: 8px 12px;
}
.friend-links-list a {
display: inline-block;
padding: 5px 14px;
background: rgba(255, 255, 255, 0.07);
border: 1px solid rgba(255, 255, 255, 0.14);
border-radius: 4px;
font-size: 0.84rem;
color: rgba(255, 255, 255, 0.78);
text-align: center;
transition: color 0.2s ease, background 0.2s ease, border-color 0.2s ease, transform 0.2s ease;
}
.friend-links-list a:hover {
background: rgba(184,92,56, 0.18);
border-color: rgba(184,92,56, 0.45);
color: var(--accent, #B85C38);
transform: translateY(-2px);
}
/* 技术干货列：纯文字分类链接，与左右栏目风格一致 */
.footer-tech {
min-width: 0;
}
.footer-tech h3 {
min-width: 75%;
}
/* Footer bottom */
.footer-bottom {
margin-top: 40px;
padding: 18px 0;
border-top: 1px solid rgba(255, 255, 255, 0.1);
background: rgba(0, 0, 0, 0.15);
}
.footer-bottom-inner {
display: flex;
justify-content: space-between;
align-items: center;
flex-wrap: wrap;
gap: 8px;
}
.footer-bottom p {
margin: 0;
font-size: 0.82rem;
color: rgba(255, 255, 255, 0.55);
}
.footer-bottom a {
color: rgba(255, 255, 255, 0.6);
}
.footer-tagline {
color: rgba(255,255,255,.88) !important;
font-weight: 500;
}
/* Responsive footer */
@media (max-width: 1199px) {
.footer-grid {
grid-template-columns: repeat(5, minmax(0, 1fr));
gap: 28px 20px;
}
.footer-brand {
grid-column: 1 / -1;
padding-right: 0;
}
.footer-brand .footer-about-text {
max-width: 760px;
}
.footer-emergency {
max-width: 360px;
}
}
@media (max-width: 991px) {
.site-footer {
padding-top: 40px;
}
.footer-grid {
grid-template-columns: repeat(3, minmax(0, 1fr));
gap: 28px 20px;
}
.footer-brand {
grid-column: 1 / -1;
}
.footer-col h3 {
min-width: 60%;
}
.friend-links-list {
justify-content: center;
gap: 10px 14px;
}
}
@media (max-width: 640px) {
.footer-grid {
grid-template-columns: 1fr;
gap: 22px;
}
.footer-brand {
text-align: center;
}
.footer-emergency {
max-width: none;
margin: 0 auto;
}
.footer-bottom-inner {
flex-direction: column;
text-align: center;
}
.footer-logo img {
height: 36px;
}
}
/* ====== Solutions Page v2 ====== */
/* Hero */
.sol-hero {
background: linear-gradient(135deg, #F7F1E4 0%, #F1E6D0 55%, #EADCC0 100%);
color: #3F362E;
padding: 40px 0 36px;
position: relative;
overflow: hidden;
}
.sol-hero::before {
content: '';
position: absolute;
top: 0; right: 0; bottom: 0;
width: 40%;
background: radial-gradient(ellipse at right center, rgba(166,124,82,0.10), transparent 70%);
pointer-events: none;
}
.sol-hero-inner {
display: flex;
align-items: center;
justify-content: space-between;
gap: 32px;
position: relative;
z-index: 1;
}
.sol-hero-text h1 {
color: #3F362E;
font-size: 1.8rem;
margin: 0 0 6px;
letter-spacing: 0.5px;
}
.sol-hero-text p {
color: rgba(63,54,46,0.8);
font-size: 0.9rem;
max-width: 560px;
margin: 0;
line-height: 1.6;
}
.sol-hero-stats {
display: flex;
gap: 28px;
flex-shrink: 0;
}
.sol-stat {
text-align: center;
}
.sol-stat-num {
display: block;
font-size: 1.8rem;
font-weight: 700;
color: #8A6540;
line-height: 1;
}
.sol-stat-num sup {
font-size: 0.7rem;
vertical-align: super;
}
.sol-stat-label {
display: block;
font-size: 0.75rem;
color: rgba(63,54,46,0.65);
margin-top: 4px;
}
/* Layout */
/* #1147z2 轨道防撑破：裸 1fr 的 auto 最小宽会被侧栏 nowrap 长标题/答案卡宽内容撑破视口，
html{overflow-x:clip} 下直接整页被裁且无法滚动（用户手机实拍复现）。minmax(0,1fr) 锁回容器宽 */
.solutions-layout {
display: grid;
grid-template-columns: 300px minmax(0, 1fr) !important;
gap: 24px;
padding: 24px 0 48px;
}
/* Sidebar */
.sol-sidebar {
position: sticky;
top: 80px;
align-self: start;
/* 左栏独立滚动条：内容超高视口时侧栏内部滚动，页面滚动不受影响 */
max-height: calc(100vh - 96px);
overflow-y: auto;
overscroll-behavior: contain;
scrollbar-width: thin;
scrollbar-color: #c9d4e0 transparent;
padding-right: 2px;
}
.sol-sidebar::-webkit-scrollbar {
width: 6px;
}
.sol-sidebar::-webkit-scrollbar-track {
background: transparent;
}
.sol-sidebar::-webkit-scrollbar-thumb {
background: #c9d4e0;
border-radius: 3px;
}
.sol-sidebar::-webkit-scrollbar-thumb:hover {
background: #9fb0c3;
}
.sol-sidebar-search {
margin-bottom: 16px;
}
.sol-sidebar-search form {
display: flex;
border: 2px solid #e2e8f0;
border-radius: 8px;
overflow: hidden;
transition: border-color 0.2s;
}
.sol-sidebar-search form:focus-within {
border-color: #8C6D4F;
}
.sol-search-input {
flex: 1;
border: none;
padding: 10px 12px;
font-size: 0.85rem;
outline: none;
background: #fff;
}
.sol-search-btn {
border: none;
background: #8C6D4F;
color: #fff;
padding: 0 14px;
cursor: pointer;
font-size: 0.9rem;
}
/* Category Nav */
.sol-cat-nav {
background: #fff;
border-radius: 10px;
overflow: hidden;
box-shadow: 0 1px 4px rgba(0,0,0,0.06);
border: 1px solid #f0f0f0;
}
.sol-cat-item {
display: flex;
align-items: center;
gap: 10px;
padding: 10px 14px;
border-bottom: 1px solid #f5f5f5;
text-decoration: none;
color: #444;
font-size: 0.85rem;
transition: all 0.15s;
}
.sol-cat-item:last-child {
border-bottom: none;
}
.sol-cat-item:hover {
background: #f5f7fa;
color: #8C6D4F;
}
.sol-cat-item.active {
background: linear-gradient(90deg, rgba(26,58,108,0.06), transparent);
color: #8C6D4F;
font-weight: 600;
border-left: 3px solid #e85d1a;
padding-left: 11px;
}
.sol-cat-icon {
width: 28px;
height: 28px;
display: flex;
align-items: center;
justify-content: center;
border-radius: 6px;
font-size: 0.85rem;
flex-shrink: 0;
color: #fff;
}
.sol-cat-info {
flex: 1;
min-width: 0;
}
.sol-cat-name {
display: block;
line-height: 1.3;
}
.sol-cat-badge {
font-size: 0.72rem;
color: #888;
background: #f0f4f8;
padding: 2px 8px;
border-radius: 10px;
min-width: 26px;
text-align: center;
flex-shrink: 0;
}
.sol-cat-item.active .sol-cat-badge {
background: #8C6D4F;
color: #fff;
}
/* 侧栏独立二级分类（FAQ 产品种类细分，#1048 迭代） */
.sol-cat-children {
padding: 4px 0 6px;
border-bottom: 1px solid #f5f5f5;
background: #fbfcfe;
}
.sol-cat-sub-item {
display: flex;
align-items: center;
gap: 8px;
padding: 7px 14px 7px 38px;
text-decoration: none;
color: #555;
font-size: 0.8rem;
position: relative;
transition: all 0.15s;
}
.sol-cat-sub-item::before {
content: '';
position: absolute;
left: 24px;
top: 50%;
width: 6px;
height: 6px;
margin-top: -3px;
border-radius: 50%;
background: #c9d4e0;
}
.sol-cat-sub-item:hover {
background: #f0f4f9;
color: #8C6D4F;
}
.sol-cat-sub-item.active {
color: #8C6D4F;
font-weight: 600;
background: linear-gradient(90deg, rgba(232,93,26,0.08), transparent);
}
.sol-cat-sub-item.active::before {
background: #e85d1a;
}
.sol-cat-sub-name {
flex: 1;
min-width: 0;
line-height: 1.3;
}
.sol-cat-sub-badge {
font-size: 0.7rem;
color: #888;
background: #f0f4f8;
padding: 1px 7px;
border-radius: 9px;
min-width: 24px;
text-align: center;
flex-shrink: 0;
}
.sol-cat-sub-item.active .sol-cat-sub-badge {
background: #e85d1a;
color: #fff;
}
/* Sidebar CTA */
.sol-sidebar-cta {
margin-top: 16px;
background: linear-gradient(135deg, #f8faff, #eef2f8);
border-radius: 10px;
padding: 18px 16px;
text-align: center;
border: 1px solid #e2e8f0;
}
.sol-cta-icon {
font-size: 1.5rem;
margin-bottom: 6px;
}
.sol-sidebar-cta h4 {
font-size: 0.95rem;
color: #8C6D4F;
margin: 0 0 4px;
}
.sol-sidebar-cta p {
font-size: 0.78rem;
color: #666;
margin: 0 0 12px;
line-height: 1.4;
}
.sol-cta-btn {
display: block;
background: #e85d1a;
color: #fff !important;
padding: 8px 16px;
border-radius: 6px;
text-decoration: none;
font-size: 0.85rem;
font-weight: 500;
transition: background 0.15s;
}
.sol-cta-btn:hover {
background: #d04e10;
}
.sol-cta-link {
display: block;
margin-top: 8px;
font-size: 0.78rem;
color: #8C6D4F;
text-decoration: none;
}
.sol-cta-link:hover {
text-decoration: underline;
}
/* Main Content */
.sol-main {
min-width: 0;
}
/* Bar */
.sol-bar {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 18px;
padding-bottom: 12px;
border-bottom: 2px solid #f0f0f0;
}
.sol-bar-left {
display: flex;
align-items: center;
gap: 10px;
}
.sol-bar-icon {
width: 32px;
height: 32px;
display: flex;
align-items: center;
justify-content: center;
border-radius: 7px;
font-size: 0.95rem;
color: #fff;
flex-shrink: 0;
}
.sol-bar-left h2 {
font-size: 1.2rem;
color: #8C6D4F;
margin: 0;
}
.sol-bar-count {
font-size: 0.8rem;
color: #888;
}
.sol-bar-count strong {
color: #e85d1a;
}
.sol-bar-page {
font-size: 0.8rem;
color: #888;
}
/* Grid */
.sol-grid {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 16px;
}
/* Card */
.sol-card {
background: #fff;
border-radius: 10px;
padding: 16px 18px;
box-shadow: 0 1px 3px rgba(0,0,0,0.04);
border: 1px solid #f0f0f0;
transition: all 0.2s;
display: flex;
flex-direction: column;
}
.sol-card:hover {
box-shadow: 0 6px 20px rgba(0,0,0,0.08);
border-color: #d0d8e4;
transform: translateY(-2px);
}
.sol-card-top {
margin-bottom: 8px;
}
.sol-card-cat-badge {
display: inline-flex;
align-items: center;
gap: 4px;
font-size: 0.7rem;
padding: 2px 8px;
border-radius: 4px;
font-weight: 500;
border: 1px solid;
}
/* 方案卡缩略图：主图/正文首图（2026-09-09 v11.77） */
.sol-card-thumb {
display: block;
margin: 0 0 10px;
border-radius: 8px;
overflow: hidden;
aspect-ratio: 16 / 9;
background: linear-gradient(135deg, #eef2f7, #e2e8f0);
}
.sol-card-thumb img {
width: 100%;
height: 100%;
object-fit: cover;
display: block;
transition: transform .25s ease;
}
.sol-card:hover .sol-card-thumb img {
transform: scale(1.04);
}
.sol-card-title {
font-size: 0.92rem;
line-height: 1.45;
margin: 0 0 8px;
font-weight: 600;
}
.sol-card-title a {
color: #222;
text-decoration: none;
transition: color 0.15s;
display: block;
}
.sol-card-title a:hover {
color: #8C6D4F;
}
.sol-card-desc {
font-size: 0.8rem;
color: #888;
line-height: 1.5;
margin: 0 0 10px;
flex: 1;
}
.sol-card-tags {
display: flex;
flex-wrap: wrap;
gap: 5px;
margin-bottom: 10px;
}
.sol-tag {
font-size: 0.68rem;
color: #555;
background: #f5f7fa;
padding: 2px 7px;
border-radius: 3px;
white-space: nowrap;
}
.sol-card-link {
font-size: 0.82rem;
color: #8C6D4F;
text-decoration: none;
font-weight: 500;
transition: color 0.15s;
align-self: flex-start;
}
.sol-card-link:hover {
color: #e85d1a;
}
/* Empty state */
.sol-empty {
text-align: center;
padding: 60px 20px;
}
.sol-empty-icon {
font-size: 3rem;
margin-bottom: 12px;
}
.sol-empty h3 {
color: #444;
margin-bottom: 8px;
}
.sol-empty p {
color: #888;
margin-bottom: 20px;
}
/* Pagination */
.sol-pagination {
display: flex;
justify-content: center;
align-items: center;
gap: 6px;
margin: 32px 0;
flex-wrap: wrap;
}
.sol-page-num, .sol-page-btn {
display: inline-flex;
align-items: center;
justify-content: center;
min-width: 34px;
height: 34px;
padding: 0 10px;
border: 1px solid #e0e0e0;
border-radius: 6px;
font-size: 0.85rem;
color: #555;
text-decoration: none;
background: #fff;
transition: all 0.15s;
}
.sol-page-num:hover, .sol-page-btn:hover {
border-color: #8C6D4F;
color: #8C6D4F;
}
.sol-page-num.active {
background: #8C6D4F;
color: #fff;
border-color: #8C6D4F;
}
.sol-page-dots {
padding: 0 4px;
color: #aaa;
}
/* Lifecycle */
.sol-lifecycle {
margin-top: 40px;
padding: 32px 24px;
background: linear-gradient(135deg, #f8faff, #f0f4f8);
border-radius: 12px;
border: 1px solid #e8edf3;
}
.sol-lifecycle-header {
text-align: center;
margin-bottom: 24px;
}
.sol-lifecycle-header h2 {
font-size: 1.4rem;
color: #8C6D4F;
margin: 0 0 6px;
}
.sol-lifecycle-header p {
font-size: 0.88rem;
color: #777;
margin: 0;
}
.sol-lifecycle-grid {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 16px;
}
.sol-lc-card {
background: #fff;
border-radius: 10px;
padding: 20px;
text-align: center;
border: 1px solid #f0f0f0;
transition: all 0.2s;
}
.sol-lc-card:hover {
box-shadow: 0 4px 16px rgba(0,0,0,0.06);
border-color: #d0d8e4;
transform: translateY(-2px);
}
.sol-lc-icon {
width: 48px;
height: 48px;
display: flex;
align-items: center;
justify-content: center;
border-radius: 12px;
font-size: 1.4rem;
margin: 0 auto 12px;
}
.sol-lc-card h3 {
font-size: 1rem;
color: #8C6D4F;
margin: 0 0 6px;
}
.sol-lc-card p {
font-size: 0.82rem;
color: #777;
line-height: 1.5;
margin: 0;
}
/* Responsive */
@media (max-width: 1199px) {
.sol-grid {
grid-template-columns: repeat(2, 1fr);
}
.sol-hero-inner {
flex-direction: column;
align-items: flex-start;
gap: 20px;
}
.sol-hero-stats {
gap: 24px;
}
}
@media (max-width: 991px) {
/* #1147z2 769-991 段防撑破：此前只有 mobile.css ≤768 有 minmax(0,1fr)，此段裸 1fr
被内容撑破视口后整页被 html overflow-x:clip 裁掉（横屏手机/平板窗口均命中） */
.solutions-layout {
grid-template-columns: minmax(0, 1fr) !important;
}
.sol-sidebar, .sol-main {
min-width: 0 !important;
max-width: 100% !important;
}
.sol-sidebar {
position: static;
max-height: none;
overflow: visible;
padding-right: 0;
}
.sol-cat-nav {
display: flex;
flex-wrap: wrap;
gap: 0;
overflow-x: auto;
}
.sol-cat-item {
border-bottom: none;
border-right: 1px solid #f5f5f5;
white-space: nowrap;
flex: 0 0 auto;
}
.sol-sidebar-search {
max-width: 400px;
}
.sol-lifecycle-grid {
grid-template-columns: repeat(2, 1fr);
}
}
@media (max-width: 640px) {
.sol-grid {
grid-template-columns: 1fr;
}
.sol-hero {
padding: 28px 0 24px;
}
.sol-hero-text h1 {
font-size: 1.4rem;
}
.sol-hero-text p {
font-size: 0.82rem;
}
.sol-hero-stats {
gap: 16px;
}
.sol-stat-num {
font-size: 1.4rem;
}
.sol-lifecycle-grid {
grid-template-columns: repeat(2, 1fr);
}
.sol-lifecycle {
padding: 24px 16px;
}
.sol-bar-left h2 {
font-size: 1.05rem;
}
}
/* Solutions dropdown mega menu - 3列，与 solutions.php 分类同步（DB 驱动，含数量徽标） */
.dropdown-mega-solutions { min-width: 720px !important; padding: 20px 22px !important; }
.dropdown-mega-solutions .dropdown-col h4 { font-size: 13px; margin-bottom: 6px; padding-bottom: 5px; white-space: nowrap; }
.dropdown-mega-solutions .dropdown-col a { font-size: 13px; padding: 3px 0; }
.dropdown-mega-solutions .dropdown-col a.drop-all {
color: #8A6540; font-weight: 600; margin-top: 3px;
border-top: 1px dashed #e3f2fd; padding-top: 5px;
}
.dropdown-mega-solutions .dropdown-col a.drop-all:hover { padding-left: 0; }
@media (max-width: 768px) {
.dropdown-mega-solutions { min-width: 100% !important; }
}
/* Industry dropdown mega menu - 4列紧凑布局 */
.dropdown-mega-industry { min-width: 760px !important; padding: 20px 24px !important; }
.dropdown-mega-industry .dropdown-grid { gap: 14px !important; }
.dropdown-mega-industry .dropdown-col h4 { font-size: 12px; margin-bottom: 6px; padding-bottom: 5px; }
.dropdown-mega-industry .dropdown-col a { font-size: 12px; padding: 3px 0; }
@media (max-width: 768px) {
.dropdown-mega-industry { min-width: 100% !important; }
/* 移动端两列分栏统一在 mobile.css 中通过 display: contents 实现 */
}
/* Products dropdown mega menu - 7列，与产品页分类树同步（DB 驱动，含数量徽标） */
.dropdown-mega-products {
min-width: 1160px !important;
left: 50% !important;
transform: translateX(-37%) !important;
padding: 20px 22px !important;
}
.dropdown-grid-products { grid-template-columns: repeat(7, 1fr) !important; gap: 10px 12px !important; }
.dropdown-mega-products .dropdown-col h4 { font-size: 13px; margin-bottom: 6px; padding-bottom: 5px; white-space: nowrap; }
.dropdown-mega-products .dropdown-col a {
display: flex; align-items: baseline; justify-content: flex-start;
font-size: 13px; padding: 3px 0;
}
.drop-line {
display: block;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
min-width: 0;
}
.drop-cnt {
display: inline-block; min-width: 17px; padding: 0 4px; margin-left: 4px;
font-size: 11px; line-height: 16px; text-align: center; color: #0a3d91;
background: #F3ECDD; border-radius: 8px; font-weight: 600; vertical-align: 1px;
white-space: nowrap; flex-shrink: 0;
}
.dropdown-mega-products .dropdown-col a.drop-all {
color: #8A6540; font-weight: 600; margin-top: 3px;
border-top: 1px dashed #e3f2fd; padding-top: 5px;
}
.dropdown-mega-products .dropdown-col a.drop-all:hover { padding-left: 0; }
/* 一级目录二级条目 >17 条时分两列显示（header.php 输出 dropdown-col-split2）：
该列占 2 格网格宽度，内部 .drop-col-items 双列排布，高度减半 */
.dropdown-mega-products .dropdown-col-split2 { grid-column: span 2; }
.dropdown-mega-products .dropdown-col-split2 .drop-col-items {
display: grid; grid-template-columns: 1fr 1fr; column-gap: 18px;
}
/* 三级飞出面板锚点项避免被网格行裁断 */
.dropdown-mega-products .dropdown-col-split2 .drop-sub2 { position: relative; }
@media (max-width: 900px) {
/* 移动端 split2 列本身不生成 box（.dropdown-col 是 display:contents），
让内部容器占满外层 2 列网格，并继续保持双列均分 */
.dropdown-mega-products .dropdown-col-split2 > .drop-col-items {
grid-column: 1 / -1;
grid-template-columns: 1fr 1fr;
column-gap: 8px;
}
.dropdown-mega-products .dropdown-col-split2 > .drop-all {
grid-column: 1 / -1;
}
}
/* 二级 hover 飞出三级面板（与产品页侧栏三级目录对应，#662） */
.drop-sub2 { position: relative; }
.drop-sub2 > a { display: block; position: relative; }
/* #720 把二级项和飞出卡「打通」：从 上延伸一条 10px 宽的悬停桥，
覆盖两框之间的缝隙，继承高亮背景与蓝色边框 */
.drop-sub2 > a::after {
content: ''; position: absolute; top: 0; left: 100%;
width: 10px; height: 100%;
background: transparent; border: none; pointer-events: auto;
}
.dropdown-mega-products .dropdown-col:last-child .drop-sub2 > a::after {
left: auto; right: 100%;
}
.drop-fly-arrow { flex-shrink: 0; margin-left: auto; color: #90a4ae; font-size: 11px; line-height: inherit; }
.drop-flyout {
display: none; position: absolute; left: calc(100% + 10px); top: -8px;
min-width: 240px; max-width: 320px; background: #fff;
border: 2px solid #8A6540; border-radius: 8px;
box-shadow: 0 10px 28px rgba(10, 61, 145, .18);
padding: 12px 16px 14px; z-index: 1001;
}
.dropdown-mega-products .dropdown-col:last-child .drop-flyout { left: auto; right: calc(100% + 10px); }
.drop-flyout h5 {
font-size: 13.5px; color: #0a3d91; margin: 0 0 8px; padding: 0 0 6px;
border-bottom: 1px dashed #e3f2fd; white-space: nowrap; font-weight: 600;
}
.drop-flyout a { font-size: 14px; padding: 6px 0; line-height: 1.55; white-space: nowrap; }
/* 三级条目字号需盖过 .dropdown-col a / .dropdown-mega-products .dropdown-col a 的 13px+3px 规则
（飞出卡挂在 .dropdown-col 内时后者优先级更高），detached（移到 body）时也要覆盖基础规则 */
.dropdown-mega-products .dropdown-col .drop-flyout a,
.dropdown-mega-products .drop-flyout a,
.drop-flyout.fly-detached a {
font-size: 14px; padding: 6px 0; line-height: 1.55;
}
@media (hover: hover) {
.drop-sub2:hover .drop-flyout { display: block; }
/* #719 悬停选中的二级项：蓝色线框高对比（fly-active = 光标移到飞出卡上时保持选中态） */
.drop-sub2:hover > a,
.drop-sub2.fly-active > a {
color: #0a3d91; font-weight: 600;
background: #F3ECDD;
outline: 2px solid #8A6540; outline-offset: -2px; border-radius: 4px;
}
/* #720 悬停桥：把二级项和飞出卡之间的缝隙「打通」，光标穿缝时仍处于 hover 链 */
.drop-sub2:hover > a::after,
.drop-sub2.fly-active > a::after {
background: #F3ECDD;
border-top: 2px solid #8A6540;
border-bottom: 2px solid #8A6540;
border-right: 2px solid #8A6540;
border-left: none;
border-radius: 0 4px 4px 0;
}
.dropdown-mega-products .dropdown-col:last-child .drop-sub2:hover > a::after,
.dropdown-mega-products .dropdown-col:last-child .drop-sub2.fly-active > a::after {
border-right: none;
border-left: 2px solid #8A6540;
border-radius: 4px 0 0 4px;
}
}
@media (hover: none) {
/* 触屏设备无 hover：隐藏飞出箭头，二级链接直接跳转（侧栏仍有完整三级目录） */
.drop-fly-arrow { display: none; }
}
/* #829 飞出卡内多级缩进（三级起任意深度：UNI-T 四级 / 同惠五级平铺可见） */
.drop-flyout .drop-sub3 > a { font-size: 14px; font-weight: 700; color: #0a3d91; padding: 5px 0; }
.drop-flyout .drop-sub3s,
.drop-flyout .drop-sub4s,
.drop-flyout .drop-sub5s {
border-left: 2px solid #cfe0f5;
margin: 2px 0 8px;
padding-left: 10px;
}
.drop-flyout .drop-sub4s { border-left-color: #dbe7f7; margin-left: 8px; }
.drop-flyout .drop-sub5s { border-left-color: #e8eef7; margin-left: 16px; }
.drop-flyout .drop-sub4s > a { font-size: 13px; font-weight: 600; color: #3d4f5f; padding: 4px 0; }
.drop-flyout .drop-sub5s > a { font-size: 12.5px; font-weight: 400; color: #6a7a8a; padding: 3px 0; }
.drop-flyout .drop-sub4 > a,
.drop-flyout .drop-sub5 > a { font-size: 13px; color: #6a7a8a; padding: 3px 0; }
/* #718 小屏显示器防裁剪：下拉 mega 面板超出视口时内部滚动（main.js 按需加 .mega-scroll） */
@media (min-width:769px) {
.nav-dropdown .dropdown-mega.mega-scroll {
max-height: calc(100vh - 150px);
overflow-y: auto;
overscroll-behavior: contain;
}
/* #719 滚动模式下飞出的三级面板被 detach 到 body（main.js），真 fixed 跟随光标定位，
不受面板 transform/overflow 影响（面板自身 transform 会使内部 fixed 包含块错位跑偏） */
.drop-flyout.fly-detached {
position: fixed; display: none;
left: auto; top: auto; right: auto;
max-height: calc(100vh - 96px); overflow-y: auto;
z-index: 10001;
}
.drop-flyout.fly-detached.fly-open { display: block; }
/* #720 飞出卡打开期间锁定页头浮现卡（detach 到 body 后 CSS hover 已无法维持面板展开） */
.nav-dropdown.fly-keep .dropdown-mega { opacity: 1; visibility: visible; }
.nav-dropdown.fly-keep .dropdown-arrow { transform: rotate(180deg); }
}
/* 页头 mega 面板 / detach 飞出卡滚动条显式美化（#718-2，2026-09-03）：
小屏下 .mega-scroll 已启用 overflow-y:auto，但系统默认滚动条可能过细/隐藏，
导致用户看不出可滚动。统一用站点常见细滚动条样式，确保可见。 */
.nav-dropdown .dropdown-mega.mega-scroll::-webkit-scrollbar,
.drop-flyout.fly-detached::-webkit-scrollbar { width: 7px; }
.nav-dropdown .dropdown-mega.mega-scroll::-webkit-scrollbar-track,
.drop-flyout.fly-detached::-webkit-scrollbar-track { background: transparent; }
.nav-dropdown .dropdown-mega.mega-scroll::-webkit-scrollbar-thumb,
.drop-flyout.fly-detached::-webkit-scrollbar-thumb { background: #c1cfdc; border-radius: 4px; }
.nav-dropdown .dropdown-mega.mega-scroll::-webkit-scrollbar-thumb:hover,
.drop-flyout.fly-detached::-webkit-scrollbar-thumb:hover { background: #9eb0c6; }
.nav-dropdown .dropdown-mega.mega-scroll,
.drop-flyout.fly-detached { scrollbar-width: thin; scrollbar-color: #c1cfdc transparent; }
@media (max-width: 1199px) {
.dropdown-mega-products { min-width: 980px !important; transform: translateX(-43%) !important; }
}
/* Knowledge dropdown mega menu - 3列，与知识库三栏目分类同步（DB 驱动，含数量徽标） */
.dropdown-mega-knowledge { min-width: 720px !important; padding: 20px 22px !important; }
.dropdown-mega-knowledge .dropdown-col h4 { font-size: 13px; margin-bottom: 6px; padding-bottom: 5px; white-space: nowrap; }
.dropdown-mega-knowledge .dropdown-col a { font-size: 13px; padding: 3px 0; }
.dropdown-mega-knowledge .dropdown-col a.drop-all {
color: #8A6540; font-weight: 600; margin-top: 3px;
border-top: 1px dashed #e3f2fd; padding-top: 5px;
}
.dropdown-mega-knowledge .dropdown-col a.drop-all:hover { padding-left: 0; }
@media (max-width: 768px) {
.dropdown-mega-knowledge { min-width: 100% !important; }
}
/* Articles dropdown mega menu - 3列，与 knowledge.php 8 标签同步（DB 驱动，含数量徽标） */
.dropdown-mega-articles { min-width: 720px !important; padding: 20px 22px !important; }
.dropdown-mega-articles .dropdown-col h4 { font-size: 13px; margin-bottom: 6px; padding-bottom: 5px; white-space: nowrap; }
.dropdown-mega-articles .dropdown-col a { font-size: 13px; padding: 3px 0; }
.dropdown-mega-articles .dropdown-col a.drop-all {
color: #8A6540; font-weight: 600; margin-top: 3px;
border-top: 1px dashed #e3f2fd; padding-top: 5px;
}
.dropdown-mega-articles .dropdown-col a.drop-all:hover { padding-left: 0; }
@media (max-width: 768px) {
.dropdown-mega-articles { min-width: 100% !important; }
}
/* ===== 知识库专题引导页面 (KB Hub) ===== */
.kb-hub-hero {
background: linear-gradient(135deg, #F7F1E4 0%, #EFE2C9 55%, #EADCC0 100%);
color: #3F362E;
padding: 50px 0 40px;
}
.kb-hub-hero-inner {
display: flex;
align-items: center;
gap: 24px;
flex-wrap: wrap;
}
.kb-hub-hero-icon {
flex-shrink: 0;
width: 64px;
height: 64px;
background: rgba(138,101,64,.14);
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
font-size: 32px;
}
.kb-hub-hero-content { flex: 1; min-width: 280px; }
.kb-hub-hero-content h1 {
font-size: 30px;
margin: 0 0 8px;
color: #3F362E;
font-weight: 800;
}
.kb-hub-hero-content p {
font-size: 15px;
opacity: 0.92;
line-height: 1.6;
margin: 0;
max-width: 680px;
}
.kb-hub-hero-stats {
display: flex;
gap: 10px;
flex-wrap: wrap;
}
.kb-hub-stat {
background: rgba(255,255,255,.72);
padding: 8px 16px;
border-radius: 999px;
font-size: 13px;
white-space: nowrap;
}
.kb-hub-stat strong {
font-size: 18px;
font-weight: 800;
margin-right: 3px;
}
.kb-hub-section { padding: 36px 0 30px; background: #f8fafc; }
.kb-hub-grid {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 22px;
}
.kb-hub-card {
background: #fff;
border-radius: 14px;
padding: 26px 24px 22px;
border: 1px solid #e2e8f0;
border-top: 4px solid #ddd;
transition: all .25s;
display: flex;
flex-direction: column;
}
.kb-hub-card:hover {
box-shadow: 0 10px 30px rgba(0,0,0,.08);
transform: translateY(-3px);
}
.kb-hub-card-blue { border-top-color: #8A6540; }
.kb-hub-card-green { border-top-color: #059669; }
.kb-hub-card-orange { border-top-color: #ea580c; }
.kb-hub-card-header {
display: flex;
align-items: center;
gap: 14px;
margin-bottom: 14px;
}
.kb-hub-card-icon {
flex-shrink: 0;
width: 52px;
height: 52px;
border-radius: 12px;
display: flex;
align-items: center;
justify-content: center;
font-size: 26px;
}
.kb-hub-card-blue .kb-hub-card-icon { background: #F6F1E5; }
.kb-hub-card-green .kb-hub-card-icon { background: #ecfdf5; }
.kb-hub-card-orange .kb-hub-card-icon { background: #fff7ed; }
.kb-hub-card-title h2 {
font-size: 20px;
font-weight: 800;
margin: 0 0 2px;
color: #1e293b;
}
.kb-hub-card-count {
font-size: 13px;
color: #64748b;
font-weight: 500;
}
.kb-hub-card-desc {
font-size: 13px;
color: #64748b;
line-height: 1.6;
margin: 0 0 16px;
}
.kb-hub-card-tags {
display: grid;
grid-template-columns: repeat(2, 1fr);
gap: 8px;
margin-bottom: 18px;
flex: 1;
align-items: start;
}
.kb-hub-tag {
display: inline-flex;
align-items: center;
gap: 4px;
padding: 5px 11px;
border-radius: 999px;
font-size: 12px;
text-decoration: none;
transition: all .2s;
border: 1px solid #e2e8f0;
color: #475569;
background: #f8fafc;
}
.kb-hub-tag:hover {
transform: translateY(-1px);
}
.kb-hub-tag-cnt {
font-size: 10px;
font-weight: 700;
padding: 1px 6px;
border-radius: 999px;
color: #fff;
}
.kb-hub-card-blue .kb-hub-tag:hover { background: #F6F1E5; border-color: #DCC9A9; color: #8A6540; }
.kb-hub-card-blue .kb-hub-tag-cnt { background: #8A6540; }
.kb-hub-card-green .kb-hub-tag:hover { background: #ecfdf5; border-color: #6ee7b7; color: #047857; }
.kb-hub-card-green .kb-hub-tag-cnt { background: #059669; }
.kb-hub-card-orange .kb-hub-tag:hover { background: #fff7ed; border-color: #fdba74; color: #c2410c; }
.kb-hub-card-orange .kb-hub-tag-cnt { background: #ea580c; }
.kb-hub-card-cta {
display: block;
text-align: center;
padding: 11px 16px;
border-radius: 10px;
font-size: 14px;
font-weight: 700;
text-decoration: none;
transition: all .2s;
margin-top: auto;
}
.kb-hub-card-blue .kb-hub-card-cta { background: #F6F1E5; color: #8A6540; }
.kb-hub-card-blue .kb-hub-card-cta:hover { background: #8A6540; color: #fff; }
.kb-hub-card-green .kb-hub-card-cta { background: #ecfdf5; color: #059669; }
.kb-hub-card-green .kb-hub-card-cta:hover { background: #059669; color: #fff; }
.kb-hub-card-orange .kb-hub-card-cta { background: #fff7ed; color: #ea580c; }
.kb-hub-card-orange .kb-hub-card-cta:hover { background: #ea580c; color: #fff; }
.kb-hub-tips { padding: 28px 0 40px; background: #f8fafc; }
.kb-hub-tips-inner {
background: #fff;
border-radius: 12px;
padding: 24px 28px;
border: 1px solid #e2e8f0;
}
.kb-hub-tips-inner h3 {
font-size: 16px;
font-weight: 700;
margin: 0 0 16px;
color: #1e293b;
}
.kb-hub-tips-grid {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 18px;
}
.kb-hub-tip {
display: flex;
align-items: flex-start;
gap: 10px;
}
.kb-hub-tip-num {
flex-shrink: 0;
width: 24px;
height: 24px;
border-radius: 50%;
background: var(--primary, #A67C52);
color: #fff;
font-size: 12px;
font-weight: 700;
display: flex;
align-items: center;
justify-content: center;
}
.kb-hub-tip p {
font-size: 13px;
color: #64748b;
line-height: 1.5;
margin: 0;
}
@media (max-width: 768px) {
.kb-hub-grid { grid-template-columns: 1fr; }
.kb-hub-tips-grid { grid-template-columns: 1fr; }
.kb-hub-hero-content h1 { font-size: 24px; }
.kb-hub-hero { padding: 30px 0 24px; }
.kb-hub-section { padding: 20px 0; }
.kb-hub-hero-stats { width: 100%; }
}
/* Solutions v3 Additional */
/* Solutions v3 - Additional CSS */
/* Quick Category Bar */
.sol-quickcats {
background: #fff;
border-bottom: 1px solid #f0f0f0;
box-shadow: 0 1px 3px rgba(0,0,0,0.03);
position: sticky;
top: 60px;
z-index: 90;
}
.sol-quickcats-inner {
display: flex;
gap: 4px;
padding: 10px 0;
overflow-x: auto;
scrollbar-width: thin;
}
.sol-quickcats-inner::-webkit-scrollbar {
height: 4px;
}
.sol-quickcats-inner::-webkit-scrollbar-thumb {
background: #ddd;
border-radius: 2px;
}
.sol-qc-item {
display: flex;
align-items: center;
gap: 6px;
padding: 7px 14px;
border-radius: 20px;
font-size: 0.82rem;
color: #555;
text-decoration: none;
white-space: nowrap;
transition: all 0.15s;
background: #f5f7fa;
flex: 0 0 auto;
}
.sol-qc-item:hover {
background: #e8edf3;
color: #8C6D4F;
}
.sol-qc-item.active {
background: #8C6D4F;
color: #fff;
}
.sol-qc-icon {
font-size: 0.9rem;
}
.sol-qc-count {
font-size: 0.7rem;
background: rgba(255,255,255,0.3);
padding: 1px 6px;
border-radius: 8px;
}
.sol-qc-item:not(.active) .sol-qc-count {
background: #e2e8f0;
color: #888;
}
/* Hot Tags */
.sol-hot-tags {
margin-top: 16px;
background: #fff;
border-radius: 10px;
padding: 14px;
box-shadow: 0 1px 4px rgba(0,0,0,0.06);
border: 1px solid #f0f0f0;
}
.sol-sidebar-title {
font-size: 0.85rem;
color: #8C6D4F;
margin: 0 0 10px;
font-weight: 600;
}
.sol-tag-cloud {
display: flex;
flex-wrap: wrap;
gap: 6px;
}
.sol-tag-link {
display: inline-flex;
align-items: center;
gap: 3px;
font-size: 0.72rem;
color: #555;
background: #f5f7fa;
padding: 3px 8px;
border-radius: 4px;
text-decoration: none;
transition: all 0.15s;
}
.sol-tag-link:hover {
background: #e8edf3;
color: #8C6D4F;
}
.sol-tag-link.active {
background: #e85d1a;
color: #fff;
}
.sol-tag-count {
font-size: 0.62rem;
color: #999;
background: #e8edf3;
padding: 0 4px;
border-radius: 3px;
}
.sol-tag-link.active .sol-tag-count {
background: rgba(255,255,255,0.25);
color: #fff;
}
/* Featured Section */
.sol-featured {
margin-bottom: 24px;
}
.sol-featured-header {
display: flex;
align-items: center;
gap: 12px;
margin-bottom: 14px;
}
.sol-featured-header h2 {
font-size: 1.1rem;
color: #8C6D4F;
margin: 0;
display: flex;
align-items: center;
gap: 8px;
}
.sol-featured-badge {
display: inline-block;
background: linear-gradient(135deg, #e85d1a, #f97316);
color: #fff;
font-size: 0.65rem;
padding: 2px 8px;
border-radius: 4px;
font-weight: 600;
letter-spacing: 0.5px;
}
.sol-featured-hint {
font-size: 0.78rem;
color: #999;
}
.sol-featured-scroll {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 12px;
}
.sol-featured-card {
display: flex;
flex-direction: column;
background: #fff;
border: 1px solid #f0f0f0;
border-left: 3px solid var(--fc, #8C6D4F);
border-radius: 8px;
padding: 14px 16px;
text-decoration: none;
transition: all 0.2s;
}
.sol-featured-card:hover {
box-shadow: 0 4px 16px rgba(0,0,0,0.06);
border-color: #d0d8e4;
transform: translateY(-2px);
}
.sol-featured-cat {
display: flex;
align-items: center;
gap: 6px;
margin-bottom: 8px;
}
.sol-featured-cat-icon {
width: 22px;
height: 22px;
display: flex;
align-items: center;
justify-content: center;
border-radius: 5px;
font-size: 0.75rem;
}
.sol-featured-cat-name {
font-size: 0.72rem;
font-weight: 500;
}
.sol-featured-title {
font-size: 0.88rem;
color: #222;
margin: 0 0 8px;
line-height: 1.45;
flex: 1;
font-weight: 600;
}
.sol-featured-card:hover .sol-featured-title {
color: var(--fc, #8C6D4F);
}
.sol-featured-link {
font-size: 0.78rem;
color: var(--fc, #8C6D4F);
font-weight: 500;
}
/* Bar description */
.sol-bar-desc {
font-size: 0.76rem;
color: #999;
margin: 2px 0 0;
}
/* Card number */
.sol-card-num {
font-size: 0.7rem;
color: #ccc;
font-weight: 600;
font-family: 'Courier New', monospace;
}
.sol-card-top {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 8px;
}
/* Card tags - make clickable */
.sol-card-tags .sol-tag {
text-decoration: none;
cursor: pointer;
transition: all 0.15s;
}
.sol-card-tags .sol-tag:hover {
background: #e8edf3;
color: #8C6D4F;
}
/* Pagination jump */
.sol-page-jump {
margin-left: 12px;
display: flex;
align-items: center;
}
.sol-jump-form {
display: flex;
align-items: center;
gap: 4px;
}
.sol-jump-label {
font-size: 0.78rem;
color: #888;
}
.sol-jump-input {
width: 48px;
height: 34px;
border: 1px solid #e0e0e0;
border-radius: 6px;
text-align: center;
font-size: 0.85rem;
outline: none;
transition: border-color 0.15s;
}
.sol-jump-input:focus {
border-color: #8C6D4F;
}
.sol-jump-btn {
border: 1px solid #8C6D4F;
background: #8C6D4F;
color: #fff;
height: 34px;
padding: 0 10px;
border-radius: 6px;
font-size: 0.78rem;
cursor: pointer;
font-weight: 600;
transition: all 0.15s;
}
.sol-jump-btn:hover {
background: #152d56;
}
/* Service Process */
.sol-process {
margin-top: 40px;
padding: 32px 24px;
background: #fff;
border-radius: 12px;
border: 1px solid #e8edf3;
}
.sol-process-header {
text-align: center;
margin-bottom: 28px;
}
.sol-process-header h2 {
font-size: 1.4rem;
color: #8C6D4F;
margin: 0 0 6px;
}
.sol-process-header p {
font-size: 0.88rem;
color: #777;
margin: 0;
}
.sol-process-steps {
display: flex;
align-items: stretch;
gap: 0;
justify-content: center;
}
.sol-step {
flex: 1;
max-width: 180px;
text-align: center;
padding: 0 8px;
}
.sol-step-num {
width: 40px;
height: 40px;
margin: 0 auto 10px;
background: linear-gradient(135deg, #8C6D4F, #2563a8);
color: #fff;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
font-size: 1.1rem;
font-weight: 700;
box-shadow: 0 2px 8px rgba(26,58,108,0.2);
}
.sol-step-content h4 {
font-size: 0.92rem;
color: #8C6D4F;
margin: 0 0 4px;
}
.sol-step-content p {
font-size: 0.76rem;
color: #777;
line-height: 1.5;
margin: 0;
}
.sol-step-arrow {
display: flex;
align-items: center;
color: #c0c8d4;
font-size: 1.2rem;
padding: 0 4px;
margin-top: 15px;
}
/* Responsive */
@media (max-width: 1199px) {
.sol-featured-scroll {
grid-template-columns: repeat(2, 1fr);
}
.sol-process-steps {
flex-wrap: wrap;
gap: 16px;
}
.sol-step-arrow {
display: none;
}
.sol-step {
max-width: 200px;
}
}
@media (max-width: 991px) {
.sol-quickcats {
position: static;
}
.sol-featured-scroll {
grid-template-columns: 1fr;
}
.sol-process-steps {
flex-direction: column;
align-items: center;
}
.sol-step {
max-width: 280px;
width: 100%;
}
.sol-step-arrow {
display: none;
}
.sol-page-jump {
margin-left: 0;
margin-top: 8px;
width: 100%;
justify-content: center;
}
}
@media (max-width: 640px) {
.sol-featured-header {
flex-direction: column;
align-items: flex-start;
gap: 4px;
}
.sol-bar-left {
flex-wrap: wrap;
}
}
/* Homepage v3 Additional */
/* ============================================
Homepage v3 - Additional Styles
============================================ */
/* Section Tag */
.section-tag {
display: inline-block;
font-size: 11px;
font-weight: 700;
letter-spacing: 2px;
color: var(--primary-light);
background: rgba(138,101,64,.08);
padding: 3px 14px;
border-radius: 20px;
margin-bottom: 8px;
}
.hm-section-gray { background: var(--bg-light); }
/* ============ Homepage Section Frames（参照 industry 卡片外框） ============ */
.hm-page-wrap { background: var(--bg-light); padding: 24px 0 40px; }
.hm-page-wrap .section {
background: #fff;
border: 1px solid #e8edf3;
border-radius: 16px;
box-shadow: 0 4px 20px rgba(0, 0, 0, .06);
padding: 36px 28px;
margin: 20px auto;
max-width: 1256px;
}
.hm-page-wrap .section:first-of-type { margin-top: 0; }
.hm-page-wrap .section:last-of-type { margin-bottom: 0; }
.hm-page-wrap .section + .section { border-top: 1px solid #e8edf3; }
.hm-page-wrap .hm-section-gray { background: #fff; }
/* 品牌面板避免双重外框 */
.hm-page-wrap .hm-brand-panel { border: none; box-shadow: none; padding: 0; background: transparent; }
/* ============ Hero ============ */
.hm-hero {
background: transparent;
color: #3F362E;
padding: 0; /* 2026-09-11 头部上下间距置0（占位高度 -1/3） */
position: relative;
}
.hm-hero .container {
background: linear-gradient(135deg, #F7F1E4 0%, #EFE2C9 50%, #EADCC0 100%);
}
.hm-hero .container {
position: relative;
overflow: hidden;
border-radius: 0; /* 2026-09-11 圆角去掉并通栏（呼应页脚通栏分隔） */
max-width: 100%;
padding: 36px 24px 28px; /* 2026-09-12 主题色背景上加高20px、下加高10px（16/18→36/28） */
}
.hm-hero .container::before {
content: '';
position: absolute;
top: -50%;
right: -10%;
width: 600px;
height: 600px;
background: radial-gradient(circle, rgba(184,92,56,.1) 0%, transparent 70%);
border-radius: 50%;
}
.hm-hero-grid {
display: grid;
grid-template-columns: minmax(auto, 680px) 360px;
justify-content: space-between;
gap: 24px 40px;
align-items: center;
position: relative;
z-index: 1;
max-width: 1280px;
margin: 0 auto;
}
.hm-hero-side {
display: flex;
flex-direction: column;
gap: 14px;
}
/* ===== 2026-09-09 三药丸组件化（徽章/计时牌/时间戳）：白卡+logo 蓝字，固定配色不随主题（navy/steel/暖调深浅）切换，改样式只动这里 ===== */
.hm-hero-badge {
display: inline-block;
background: #fff;
border: 1px solid rgba(24,56,132,.18);
box-shadow: 0 1px 3px rgba(0,0,0,.06);
color: #183884;
font-size: 12px;
font-weight: 600;
padding: 2px 14px; /* 2026-09-12 高度减 1/4：上下 5→2px + line-height 收紧 */
line-height: 1.25;
border-radius: 4px; /* 2026-09-12 药丸→小圆角长条（与时钟统一） */
font-family: 'DSEG7-Classic', monospace; /* 2026-09-12 数字走七段管，中文/字母自动回退系统字体 */
margin-bottom: 16px;
}
/* 2026-09-09 左栏顶端对齐：栅格垂直居中会把时钟/徽章压低，顶端对齐后时钟贴顶、徽章上一行 */
.hm-hero-text { align-self: start; }
.hm-hero-text h1 {
font-size: 30px;
font-weight: 800;
line-height: 1.35;
margin-bottom: 14px;
color: #3F362E;
text-align: center; /* 2026-09-09 口号两行居中对齐 */
}
.hm-hero-accent { color: var(--accent); }
.hm-hero-text p {
font-size: 15px;
line-height: 1.75;
opacity: .85;
margin-bottom: 20px;
max-width: 580px;
}
.hm-hero-strong { color: var(--accent); font-weight: 600; }
/* Hero Search */
.hm-hero-search { margin-bottom: 20px; }
.hm-hero-search form {
display: flex;
gap: 0;
max-width: 520px;
background: rgba(255,255,255,.95);
border-radius: 10px;
overflow: hidden;
box-shadow: 0 4px 20px rgba(0,0,0,.15);
}
.hm-search-input {
flex: 1;
border: none;
padding: 12px 18px;
font-size: 14px;
background: transparent;
outline: none;
color: var(--text);
}
.hm-search-input::placeholder { color: var(--text-lighter); }
.hm-search-btn {
border: none;
background: var(--accent);
color: #fff;
padding: 0 28px;
font-size: 14px;
font-weight: 600;
cursor: pointer;
transition: var(--transition);
}
.hm-search-btn:hover { background: var(--accent-light); }
.hm-hero-cta { display: flex; gap: 12px; flex-wrap: wrap; }
.hm-hero-kb { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; margin-top: 2px; }
.hm-hero-kb-item {
display: inline-flex;
align-items: center;
justify-content: center;
gap: 5px;
padding: 9px 6px;
border-radius: 12px;
background: rgba(124,58,237,.88);
color: #fff;
font-size: 13px;
font-weight: 600;
text-decoration: none;
border: 1px solid rgba(255,255,255,.25);
transition: var(--transition);
white-space: nowrap;
}
.hm-hero-kb-item strong { font-size: 17px; font-weight: 800; }
.hm-hero-kb-item.kb-sel { background: rgba(37,99,235,.88); }
.hm-hero-kb-item.kb-repair { background: rgba(124,58,237,.88); }
.hm-hero-kb-item.kb-case { background: rgba(234,88,12,.88); }
.hm-hero-kb-item:hover { transform: translateY(-2px); box-shadow: 0 6px 16px rgba(0,0,0,.25); }
.btn-outline-hm {
border: 1px solid rgba(62,52,46,.45);
color: #3F362E;
padding: 10px 24px;
border-radius: 8px;
font-weight: 600;
font-size: 14px;
transition: var(--transition);
}
.btn-outline-hm:hover { background: #3E342E; color: #fff; }
/* 2026-09-09 CTA 卡组件化（深棕暖调固定底）：卡内 outline 按钮恒白边白字（!important+高特异性压过主题尾部深字批次） */
.hm-cta .btn-outline-hm, html.ftr-light .hm-cta .btn-outline-hm { border-color: rgba(255,255,255,.55)!important; color: #fff!important; }
.hm-cta .btn-outline-hm:hover, html.ftr-light .hm-cta .btn-outline-hm:hover { background: rgba(255,255,255,.14)!important; color: #fff!important; }
/* Hero Floating Cards */
.hm-hero-cards {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 14px;
}
.hm-hero-card {
display: block;
background: rgba(255,255,255,.92);
backdrop-filter: blur(10px);
border: 1px solid rgba(138,101,64,.2);
border-radius: 14px;
padding: 20px 16px;
text-align: center;
color: inherit;
text-decoration: none;
transition: var(--transition);
}
.hm-hero-card:hover {
background: rgba(255,255,255,.98);
transform: translateY(-3px);
}
.hm-hero-card-alt {
background: rgba(255,255,255,.92);
border-color: rgba(138,101,64,.2);
}
.hm-hero-card-icon { font-size: 24px; margin-bottom: 6px; }
.hm-hero-card-num {
font-size: 28px;
font-weight: 800;
color: #3F362E;
line-height: 1;
}
.hm-hero-card-num span { font-size: 18px; color: var(--accent); }
.hm-hero-card-label { font-size: 12px; opacity: .8; margin-top: 4px; }
/* ============ Quick Navigation ============ */
.hm-quicknav {
background: #fff;
border-bottom: 1px solid var(--border);
padding: 14px 0;
}
.hm-quicknav-inner {
display: flex;
justify-content: center;
gap: 8px;
flex-wrap: wrap;
}
.hm-quicknav-item {
display: flex;
align-items: center;
gap: 6px;
padding: 8px 20px;
border-radius: 24px;
background: var(--bg-light);
border: 1px solid var(--border);
font-size: 14px;
font-weight: 500;
color: var(--text);
transition: var(--transition);
}
.hm-quicknav-item:hover {
background: var(--primary);
color: #fff;
border-color: var(--primary);
transform: translateY(-2px);
box-shadow: 0 4px 12px rgba(166,124,82,.2);
}
.hm-qn-icon { font-size: 16px; }
/* ============ Strategic Industries ============ */
.hm-industry-grid {
display: grid;
grid-template-columns: repeat(4, 1fr);
gap: 16px;
}
.hm-industry-card {
background: #fff;
border-radius: var(--radius);
padding: 24px 20px;
box-shadow: var(--shadow);
border-top: 4px solid var(--ind-color, var(--primary-light));
transition: var(--transition);
position: relative;
overflow: hidden;
}
.hm-industry-card::after {
content: '';
position: absolute;
bottom: 0;
left: 0;
right: 0;
height: 3px;
background: var(--ind-color, var(--accent));
transform: scaleX(0);
transition: var(--transition);
}
.hm-industry-card:hover {
box-shadow: var(--shadow-lg);
transform: translateY(-4px);
}
.hm-industry-card:hover::after { transform: scaleX(1); }
.hm-ind-header {
display: flex;
align-items: center;
gap: 10px;
margin-bottom: 12px;
}
.hm-ind-icon { font-size: 28px; }
.hm-ind-header h3 { font-size: 17px; font-weight: 700; color: var(--primary); }
.hm-industry-card p {
font-size: 13px;
line-height: 1.7;
color: var(--text-light);
margin-bottom: 12px;
display: -webkit-box;
-webkit-line-clamp: 3;
-webkit-box-orient: vertical;
overflow: hidden;
}
.hm-ind-tags {
display: flex;
flex-wrap: wrap;
gap: 6px;
margin-bottom: 14px;
}
.hm-ind-tags span {
font-size: 11px;
color: var(--text-light);
background: var(--bg-light);
padding: 3px 10px;
border-radius: 12px;
}
.hm-ind-link {
font-size: 13px;
font-weight: 600;
color: var(--primary-light);
}
.hm-ind-link:hover { color: var(--accent); }
/* ============ Product Categories ============ */
.hm-prodcats-grid {
display: flex;
flex-wrap: wrap;
justify-content: center;
gap: 20px;
max-width: 1100px;
margin: 0 auto;
}
.hm-prodcat-card {
background: #fff;
border: 1px solid var(--border);
border-radius: var(--radius);
padding: 20px 16px 16px;
text-align: center;
text-decoration: none;
transition: var(--transition);
display: flex;
flex-direction: column;
align-items: center;
min-height: 110px;
width: calc(25% - 15px);
min-width: 220px;
box-sizing: border-box;
}
.hm-prodcat-card:hover {
border-color: var(--primary-light);
box-shadow: var(--shadow-lg);
transform: translateY(-4px);
}
.hm-prodcat-icon {
width: 44px;
height: 44px;
display: flex;
align-items: center;
justify-content: center;
background: linear-gradient(135deg, #f0f7ff 0%, #e6f2ff 100%);
border-radius: 50%;
font-size: 22px;
margin-bottom: 10px;
}
.hm-prodcat-icon img {
width: 26px;
height: 26px;
object-fit: contain;
border-radius: 4px;
}
.hm-prodcat-card h3 {
font-size: 16px;
font-weight: 700;
color: var(--text);
margin-bottom: 6px;
}
.hm-prodcat-card p {
font-size: 12px;
color: var(--text-lighter);
line-height: 1.5;
margin-bottom: 10px;
flex: 1;
}
.hm-prodcat-count {
display: inline-block;
font-size: 12px;
font-weight: 700;
color: #0d8a52;
background: #e6f9f0;
padding: 4px 12px;
border-radius: 20px;
}
.hm-prodcat-count small {
font-size: 12px;
font-weight: 500;
margin-left: 2px;
}
@media (max-width: 991px) {
.hm-prodcat-card { width: calc(33.333% - 14px); min-width: 180px; }
}
@media (max-width: 640px) {
.hm-prodcats-grid { gap: 14px; }
.hm-prodcat-card { width: calc(50% - 10px); min-width: 140px; padding: 16px 10px 12px; min-height: auto; }
.hm-prodcat-icon { width: 40px; height: 40px; font-size: 20px; margin-bottom: 8px; }
.hm-prodcat-card h3 { font-size: 14px; margin-bottom: 4px; }
.hm-prodcat-card p { font-size: 11px; margin-bottom: 8px; }
.hm-prodcat-count { font-size: 11px; padding: 3px 10px; }
}
/* ============ Featured Solutions ============ */
.hm-sol-grid {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
gap: 20px;
}
.hm-sol-card {
background: #fff;
border: 1px solid var(--border);
border-radius: var(--radius);
overflow: hidden;
text-decoration: none;
transition: var(--transition);
display: flex;
flex-direction: column;
}
.hm-sol-card:hover {
border-color: var(--primary-light);
box-shadow: var(--shadow-lg);
transform: translateY(-3px);
}
.hm-sol-img {
width: 100%;
height: 180px;
flex-shrink: 0;
overflow: hidden;
background: linear-gradient(135deg, rgba(138,101,64,.08) 0%, rgba(138,101,64,.14) 100%);
display: flex;
align-items: center;
justify-content: center;
}
.hm-sol-img img { width: 100%; height: 100%; object-fit: cover; transition: transform .3s ease; }
.hm-sol-card:hover .hm-sol-img img { transform: scale(1.04); }
.hm-sol-img > span { font-size: 48px; color: var(--primary-light); }
.hm-sol-body { padding: 16px; flex: 1; display: flex; flex-direction: column; min-width: 0; }
/* #1187 首页方案卡角标标签已删（home.php 渲染行一并移除） */
.hm-sol-body h3 {
font-size: 15px;
font-weight: 600;
color: var(--text);
margin-bottom: 8px;
line-height: 1.5;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
overflow: hidden;
}
.hm-sol-body p {
font-size: 13px;
color: var(--text-light);
line-height: 1.65;
flex: 1;
display: -webkit-box;
-webkit-line-clamp: 3;
-webkit-box-orient: vertical;
overflow: hidden;
}
.hm-sol-footer {
display: flex;
justify-content: space-between;
align-items: center;
margin-top: auto;
padding-top: 10px;
border-top: 1px solid var(--border-light);
}
.hm-sol-num { font-size: 11px; font-weight: 600; color: var(--text-lighter); letter-spacing: 1px; }
.hm-sol-go { font-size: 13px; font-weight: 600; color: var(--primary-light); }
/* ============ Brand Showcase ============ */
.brand-zone-section { padding-top: 20px; padding-bottom: 40px; }
.brand-zone-section .section-title { margin-bottom: 24px; }
.brand-zone-section .section-title h2 { margin-bottom: 6px; }
.hm-brand-panel {
background: #ffffff;
border: 1px solid var(--border);
border-radius: 16px;
box-shadow: 0 4px 20px rgba(166,124,82, 0.06);
padding: 32px;
}
.hm-brand-grid {
display: grid;
grid-template-columns: repeat(5, 1fr);
gap: 18px;
}
.hm-brand-card {
display: flex;
flex-direction: column;
background: #fff;
border: 1px solid var(--border);
border-radius: var(--radius);
overflow: hidden;
text-align: center;
text-decoration: none;
transition: var(--transition);
}
.hm-brand-card:hover {
border-color: var(--primary-light);
box-shadow: 0 10px 28px rgba(166,124,82, 0.12);
transform: translateY(-4px);
}
.hm-brand-logo {
flex: 1;
min-height: 86px;
display: flex;
align-items: center;
justify-content: center;
padding: 18px 20px;
background: #fff;
}
.hm-brand-logo img { max-height: 54px; max-width: 100%; object-fit: contain; }
.hm-brand-placeholder { font-size: 18px; font-weight: 700; color: var(--primary); }
.brand-page-footer { text-align: center; margin-top: 28px; }
.hm-brand-name {
display: block;
font-size: 13px;
color: #1e3a5c;
font-weight: 600;
line-height: 1.3;
background: #F3ECDD;
padding: 11px 8px;
border-top: 1px solid #F8F4EC;
}
@media (max-width: 1100px) {
.hm-brand-panel { padding: 26px; }
.hm-brand-grid { grid-template-columns: repeat(4, 1fr); gap: 14px; }
.hm-brand-logo { min-height: 76px; padding: 14px; }
.hm-brand-logo img { max-height: 48px; }
}
@media (max-width: 768px) {
.hm-brand-panel { padding: 20px; border-radius: 14px; }
.hm-brand-grid { grid-template-columns: repeat(3, 1fr); gap: 12px; }
.hm-brand-logo { min-height: 68px; padding: 12px; }
.hm-brand-logo img { max-height: 42px; }
.hm-brand-name { font-size: 12px; padding: 9px 6px; }
}
@media (max-width: 480px) {
.hm-brand-panel { padding: 16px; border-radius: 12px; }
.hm-brand-grid { grid-template-columns: repeat(2, 1fr); gap: 10px; }
.hm-brand-logo { min-height: 62px; padding: 10px; }
.hm-brand-logo img { max-height: 38px; }
}
/* ============ Knowledge Hub ============ */
.hm-news-grid {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
gap: 20px;
}
.hm-news-card {
background: #fff;
border: 1px solid var(--border);
border-radius: var(--radius);
overflow: hidden;
text-decoration: none;
transition: var(--transition);
display: flex;
flex-direction: column;
}
.hm-news-card:hover {
border-color: var(--primary-light);
box-shadow: var(--shadow-lg);
transform: translateY(-3px);
}
.hm-news-img {
width: 100%;
height: 180px;
flex-shrink: 0;
overflow: hidden;
background: linear-gradient(135deg, rgba(138,101,64,.08) 0%, rgba(138,101,64,.14) 100%);
}
.hm-news-img img { width: 100%; height: 100%; object-fit: cover; transition: transform .3s ease; }
.hm-news-card:hover .hm-news-img img { transform: scale(1.04); }
.hm-news-img-ph {
display: flex;
align-items: center;
justify-content: center;
font-size: 48px;
color: var(--primary-light);
}
.hm-news-body { padding: 16px; flex: 1; display: flex; flex-direction: column; min-width: 0; }
.hm-news-cat {
display: inline-block;
font-size: 11px;
font-weight: 600;
color: var(--primary-light);
background: rgba(138,101,64,.08);
padding: 2px 10px;
border-radius: 10px;
margin-bottom: 8px;
align-self: flex-start;
}
.hm-news-body h3 { font-size: 15px; font-weight: 600; color: var(--text); margin-bottom: 8px; line-height: 1.5; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.hm-news-body p { font-size: 13px; color: var(--text-light); line-height: 1.65; margin-bottom: 12px; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.hm-news-meta {
display: flex;
justify-content: space-between;
align-items: center;
font-size: 12px;
color: var(--text-lighter);
margin-top: auto;
padding-top: 10px;
border-top: 1px solid var(--border-light);
}
.hm-news-link {
display: inline-flex;
align-items: center;
gap: 4px;
font-size: 13px;
font-weight: 600;
color: var(--primary-light);
margin-top: 10px;
}
.hm-news-link::after { content: '→'; transition: transform .2s ease; }
.hm-news-card:hover .hm-news-link::after { transform: translateX(4px); }
/* ============ Service Process ============ */
.hm-process-grid {
display: flex;
align-items: stretch;
gap: 0;
flex-wrap: wrap;
justify-content: center;
}
.hm-process-step {
flex: 1;
min-width: 160px;
max-width: 220px;
background: #fff;
border-radius: var(--radius);
padding: 24px 16px;
text-align: center;
box-shadow: var(--shadow);
position: relative;
transition: var(--transition);
}
.hm-process-step:hover {
box-shadow: var(--shadow-lg);
transform: translateY(-3px);
}
.hm-process-num {
position: absolute;
top: 10px;
right: 14px;
font-size: 28px;
font-weight: 800;
color: var(--bg-light);
line-height: 1;
}
.hm-process-icon { font-size: 32px; margin-bottom: 10px; }
.hm-process-step h3 { font-size: 16px; font-weight: 700; color: var(--primary); margin-bottom: 8px; }
.hm-process-step p { font-size: 12px; color: var(--text-light); line-height: 1.6; }
.hm-process-arrow {
display: flex;
align-items: center;
font-size: 20px;
color: var(--text-lighter);
padding: 0 6px;
}
/* ============ Why Choose Us ============ */
.hm-why-grid {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
gap: 16px;
}
.hm-why-card {
background: #fff;
border: 1px solid var(--border);
border-radius: var(--radius);
padding: 24px 20px;
transition: var(--transition);
}
.hm-why-card:hover {
border-color: var(--primary-light);
box-shadow: var(--shadow-lg);
transform: translateY(-3px);
}
.hm-why-icon {
font-size: 36px;
margin-bottom: 12px;
display: inline-block;
width: 60px;
height: 60px;
line-height: 60px;
text-align: center;
background: linear-gradient(135deg, var(--bg-light), #F3ECDD);
border-radius: 14px;
}
.hm-why-card h3 { font-size: 17px; font-weight: 700; color: var(--primary); margin-bottom: 8px; }
.hm-why-card > p { font-size: 13px; color: var(--text-light); line-height: 1.7; margin-bottom: 12px; }
.hm-why-card ul { list-style: none; padding: 0; }
.hm-why-card ul li {
font-size: 13px;
color: var(--text);
padding: 4px 0 4px 20px;
position: relative;
}
.hm-why-card ul li::before {
content: '✓';
position: absolute;
left: 0;
color: var(--success);
font-weight: 700;
}
/* ============ CTA Banner ============ */
/* 2026-09-09 CTA 卡组件化：深棕暖调渐变写死（#3E342E→#A67C52→#8A6540），不引用主题变量，navy/steel/暖调深浅全站统一；改卡样式只动这里 */
.hm-cta {
background: linear-gradient(135deg, #3E342E 0%, #A67C52 50%, #8A6540 100%);
border-radius: var(--radius);
padding: 22px 36px; /* 2026-09-06 高度压缩约1/3（36px 40px → 22px 36px，间距同步收紧） */
color: #fff;
display: grid;
grid-template-columns: minmax(0,1fr) minmax(0,460px); /* 2026-09-09 右列加宽容纳5列统计栅格，minmax(0,) 防外溢 */
gap: 26px;
align-items: center;
position: relative;
overflow: hidden;
}
.hm-cta::before {
content: '';
position: absolute;
top: -30%;
right: -5%;
width: 400px;
height: 400px;
background: radial-gradient(circle, rgba(184,92,56,.15) 0%, transparent 70%);
border-radius: 50%;
}
.hm-cta-content { position: relative; z-index: 1; text-align: center; } /* 2026-09-09 左栏整体居中 */
.hm-cta-content .hm-cta-services, .hm-cta-content .hm-cta-btns { justify-content: center; }
.hm-cta-content h2 { font-size: 20px; font-weight: 800; margin-bottom: 5px; color: #fff; }
.hm-cta-content > p { font-size: 13px; opacity: .9; margin-bottom: 10px; }
.hm-cta-btns { display: flex; gap: 12px; flex-wrap: wrap; margin-bottom: 8px; }
.hm-cta-phone { font-size: 13px; opacity: .8; }
.hm-cta-phone strong { color: #D4764E; font-size: 15px; } /* 2026-09-09 组件化固定暖橙，不随主题变量 */
/* CTA 实时时钟窗口（2026-09-09 组件化白卡蓝字：首页+内页 CTA 全站统一，不再分深浅色调） */
.hm-cta-clock { display: inline-block; margin-top: 13px; padding: 5px 14px; border: 1px solid rgba(24,56,132,.18); background: #fff; box-shadow: 0 1px 3px rgba(0,0,0,.06); border-radius: 4px; font-family: 'DSEG7-Classic', monospace; font-size: 15px; font-weight: normal; letter-spacing: 1px; color: #14181f; } /* 2026-09-12 数码管：同 hero-clock（+5px 行距、小圆角、加一号字） */
/* hero 右上角时间戳（2026-09-09 组件化白卡蓝字） */
.hm-hero-clock { display: inline-block; margin: 0 auto; padding: 2px 14px; line-height: 1.25; border: 1px solid rgba(24,56,132,.18); background: #fff; box-shadow: 0 1px 3px rgba(0,0,0,.06); border-radius: 4px; font-family: 'DSEG7-Classic', monospace; font-size: 14px; font-weight: normal; letter-spacing: 1px; color: #14181f; } /* 2026-09-12 数码管；行内块+容器双居中，下边距归零使上下等距 */
.hm-live-clock .seg-wrap { display: inline-block; position: relative; }
.hm-live-clock .seg-off { position: absolute; left: 0; top: 0; z-index: 0; color: #e2e8f0; } /* 灭段浅灰 */
.hm-live-clock .seg-on { position: relative; z-index: 1; } /* 亮段深色覆盖在上 */
/* 时钟行：徽章左 + 时钟右（2026-09-09）；服务时长独立行右对齐+框线（与按钮解耦） */
.hm-hero-toprow { display: flex; align-items: center; gap: 12px; margin-bottom: 16px; }
.hm-hero-toprow .hm-hero-clock { margin: 0 0 0 auto; }
.hm-hero-toprow .hm-hero-served { margin: 0 0 0 auto; } /* 计时牌置顶行右（2026-09-09 与时间戳互换） */
.hm-hero-toprow .hm-hero-badge { margin-bottom: 0; }
.hm-hero-servedrow { display: flex; justify-content: center; text-align: center; margin-top: 15px; margin-bottom: 20px; } /* 2026-09-16 #1150b 与 toprow +15px；#1150c 用户指令：与 H1 标题 +20px */
.hm-hero-served { display: inline-block; color: #183884; font-size: 13px; font-weight: 700; letter-spacing: .5px; text-align: right; border: 1px solid rgba(24,56,132,.18); background: #fff; box-shadow: 0 1px 3px rgba(0,0,0,.06); border-radius: 4px; padding: 2px 14px; line-height: 1.25; font-family: 'DSEG7-Classic', monospace; } /* 2026-09-12 数字七段管+小圆角长条 */
.hm-cta-stats {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 12px;
position: relative;
z-index: 1;
}
.hm-cta-stats > div { text-align: center; }
.hm-cta-stats .cta-stat { background: rgba(255,255,255,.92); border: 1px solid rgba(138,101,64,.14); border-radius: 12px; padding: 12px 8px 10px; }
.hm-cta-stats .cta-stat-icon { display: block; font-size: 20px; margin-bottom: 2px; }
.hm-cta-stats .cta-stat strong { color: #3F362E; }
.hm-cta-stats .cta-stat span { color: #7A6E62; opacity: 1; }
a.cta-stat { text-decoration: none; color: inherit; display: block; }
a.cta-stat:hover { transform: translateY(-2px); border-color: rgba(184,92,56,.45); }
.hm-cta-side { display: flex; flex-direction: column; gap: 10px; position: relative; z-index: 1; }
.hm-cta-stats-sm { grid-template-columns: repeat(3, 1fr); gap: 10px; }
.hm-cta-stats-sm .cta-stat { padding: 10px 6px 8px; }
.hm-cta-stats-sm .cta-stat-icon { font-size: 17px; }
.hm-cta-stats-sm .cta-stat strong { font-size: 18px; }
.hm-cta-kb { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
/* CTA 5列x2行 统计+宝典混合栅格（2026-09-09 免拉高横幅；同日去色块+防外溢） */
.hm-cta-grid { display: grid; grid-template-columns: repeat(5, minmax(0,1fr)); gap: 7px; align-items: stretch; position: relative; z-index: 1; min-width: 0; }
.hm-cta-grid .cta-stat { background: rgba(255,255,255,.92); border: 1px solid rgba(138,101,64,.14); border-radius: 10px; padding: 7px 2px 5px; text-decoration: none; display: block; text-align: center; transition: var(--transition); }
.hm-cta-grid .cta-stat:hover { transform: translateY(-2px); border-color: rgba(184,92,56,.45); }
.hm-cta-grid .cta-stat-icon { display: block; font-size: 14px; margin-bottom: 1px; }
.hm-cta-grid .cta-stat strong { display: block; font-size: 15px; font-weight: 800; color: #3F362E; line-height: 1.15; }
.hm-cta-grid .cta-stat span { display: block; font-size: 10px; color: #7A6E62; opacity: 1; white-space: nowrap; }
/* 宝典 pill 去色块：与统计卡同款白底（0,3,0 权重压过主题 kb-sel/kb-repair/kb-case 彩底） */
.hm-cta-grid .hm-hero-kb-item,
.hm-cta-grid .hm-hero-kb-item.kb-sel,
.hm-cta-grid .hm-hero-kb-item.kb-repair,
.hm-cta-grid .hm-hero-kb-item.kb-case { background: rgba(255,255,255,.92); border: 1px solid rgba(138,101,64,.14); color: #7A6E62; padding: 7px 2px; font-size: 11px; white-space: nowrap; box-shadow: none; }
.hm-cta-grid .hm-hero-kb-item strong { font-size: 14px; color: #3F362E; }
.hm-cta-grid .hm-hero-kb-item:hover { transform: translateY(-2px); box-shadow: none; border-color: rgba(184,92,56,.45); }
.hm-cta-stats strong {
display: block;
font-size: 22px;
font-weight: 800;
color: var(--accent-light);
line-height: 1.1;
}
.hm-cta-stats span { font-size: 12px; opacity: .8; }
/* ============ Responsive ============ */
@media (max-width: 968px) {
.hm-hero-grid { grid-template-columns: 1fr; gap: 24px; }
.hm-hero-cards { grid-template-columns: repeat(4, 1fr); }
.hm-hero-text h1 { font-size: 24px; }
.hm-cta { grid-template-columns: 1fr; padding: 18px 20px; }
.hm-cta-stats { grid-template-columns: repeat(4, 1fr); }
.hm-cta-grid { grid-template-columns: repeat(5, 1fr); gap: 8px; }
}
@media (max-width: 768px) {
.hm-hero { padding: 0; } /* 2026-09-12 通栏全宽（去掉上下留白） */
.hm-hero .container { padding-left: 20px; padding-right: 20px; border-radius: 0; } /* 2026-09-12 圆角去掉、通栏 */
.hm-hero-text h1 { font-size: 20px; text-align: right; } /* 2026-09-09 手机端口号居右 */
.hm-hero-servedrow { margin-top: 15px; margin-bottom: 20px; } /* 2026-09-16 #1150c 手机端同步与 H1 +20px */
.hm-hero-text p { font-size: 13px; text-align: justify; text-justify: inter-ideograph; margin-left: -1em; padding-left: 0; } /* 2026-09-09 左移一字位+两端对齐防孤字 */
/* 4 大统计卡手机端缩小一行（2026-09-09 用户指定） */
.hm-hero-cards { grid-template-columns: repeat(4, minmax(0,1fr)); gap: 6px; }
.hm-hero-card { padding: 10px 2px 8px; border-radius: 10px; }
.hm-hero-card-icon { font-size: 18px; margin-bottom: 2px; }
.hm-hero-card-num { font-size: 16px; }
.hm-hero-card-label { font-size: 10px; }
.hm-hero-kb { gap: 6px; }
.hm-hero-kb-item { font-size: 12px; padding: 8px 4px; }
.hm-hero-kb-item strong { font-size: 15px; }
.hm-quicknav-inner { gap: 6px; }
.hm-quicknav-item { padding: 6px 14px; font-size: 13px; }
.hm-sol-grid { grid-template-columns: 1fr 1fr; gap: 14px; }
.hm-sol-card h3 { font-size: 14px; }
.hm-sol-card p { -webkit-line-clamp: 3; }
.hm-sol-img { height: 120px; }
.hm-process-grid { gap: 12px; }
.hm-process-step { flex: 0 0 calc(50% - 6px); max-width: none; min-width: auto; padding: 18px 12px; }
.hm-process-arrow { display: none; }
.hm-cta-stats { grid-template-columns: 1fr 1fr; }
/* 手机端 5列x2行小白卡（2026-09-09 用户指定） */
.hm-cta-grid { grid-template-columns: repeat(5, minmax(0,1fr)); gap: 6px; }
.hm-cta-grid .cta-stat { padding: 8px 2px 6px; border-radius: 10px; }
.hm-cta-grid .cta-stat-icon { font-size: 14px; margin-bottom: 1px; }
.hm-cta-grid .cta-stat strong { font-size: 13px; }
.hm-cta-grid .cta-stat span { font-size: 10px; }
.hm-cta-grid .hm-hero-kb-item { flex-direction: column; gap: 1px; font-size: 10px; padding: 8px 2px; border-radius: 10px; }
.hm-cta-grid .hm-hero-kb-item strong { font-size: 13px; }
.hm-cta-content h2 { font-size: 20px; }
/* 移动端隐藏品牌合作伙伴；技术干货 2026-09-08 恢复显示（双列） */
.hm-brand-section { display: none; }
/* 产品分类强制双列 */
.hm-prodcats-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; justify-items: stretch; max-width: none; }
.hm-prodcat-card { width: 100%; min-width: auto; }
}
@media (max-width: 480px) {
.hm-hero-cards { grid-template-columns: repeat(4, minmax(0,1fr)); gap: 5px; }
.hm-hero-card-num { font-size: 14px; }
.hm-hero-card-icon { font-size: 16px; }
.hm-hero-card-label { font-size: 9px; }
.hm-hero-kb { gap: 5px; }
.hm-hero-kb-item { font-size: 11px; padding: 7px 2px; white-space: nowrap; }
.hm-hero-kb-item strong { font-size: 14px; }
.hm-industry-grid { grid-template-columns: 1fr 1fr; gap: 10px; }
.hm-industry-card { padding: 14px 10px; }
.hm-ind-icon { font-size: 20px; }
.hm-ind-header { gap: 6px; margin-bottom: 8px; }
.hm-ind-header h3 { font-size: 13px; }
/* 战略行业移动端采用图标+标题+标签+链接样式，隐藏描述文字 */
.hm-industry-card { display: flex; flex-direction: column; min-height: 0; }
.hm-industry-card p { display: none; }
.hm-ind-tags { display: flex; flex-wrap: wrap; gap: 4px; margin-bottom: 10px; }
.hm-ind-tags span { font-size: 10px; padding: 2px 8px; }
.hm-ind-link { display: inline-block; font-size: 12px; margin-top: auto; }
.hm-prodcat-card { padding: 16px 10px 12px; }
.hm-prodcat-icon { width: 44px; height: 44px; font-size: 22px; }
.hm-prodcat-card h3 { font-size: 14px; margin-bottom: 6px; }
.hm-prodcat-card p { font-size: 11px; margin-bottom: 8px; }
.hm-prodcat-count { font-size: 11px; padding: 3px 10px; }
.hm-why-grid { grid-template-columns: 1fr 1fr; gap: 12px; }
.hm-why-card { padding: 16px 12px; }
.hm-why-icon { width: 44px; height: 44px; line-height: 44px; font-size: 24px; margin-bottom: 8px; }
.hm-why-card h3 { font-size: 14px; margin-bottom: 6px; }
.hm-why-card > p { font-size: 12px; margin-bottom: 8px; -webkit-line-clamp: 2; display: -webkit-box; -webkit-box-orient: vertical; overflow: hidden; }
.hm-why-card ul { display: none; }
.hm-cta { padding: 16px 14px; }
.hm-cta-btns { flex-direction: column; }
}
/* Industry v3 Additional */
/* ===== Industry v3 Additional CSS ===== */
/* Hero */
.ind-hero{background:linear-gradient(135deg,#F7F1E4 0%,#F1E6D0 55%,#EADCC0 100%);color:#3F362E;padding:60px 0 50px;position:relative;overflow:hidden}
.ind-hero::before{content:'';position:absolute;top:0;right:0;width:500px;height:500px;background:radial-gradient(circle,rgba(166,124,82,.14) 0%,transparent 70%);pointer-events:none}
.ind-hero .container{display:flex;align-items:center;justify-content:space-between;gap:40px;position:relative;z-index:1}
.ind-hero-content{flex:1;max-width:620px}
.ind-hero-badge{display:inline-block;background:rgba(138,101,64,.12);backdrop-filter:blur(8px);border:1px solid rgba(138,101,64,.3);color:#8A6540;font-size:.8rem;font-weight:600;padding:4px 14px;border-radius:20px;margin-bottom:16px}
.ind-hero h1{font-size:2.4rem;font-weight:800;margin-bottom:16px;line-height:1.2;color:#3F362E}
.ind-hero-desc{font-size:1.05rem;color:rgba(63,54,46,.8);line-height:1.7;margin-bottom:24px}
.ind-hero-cta{display:flex;gap:12px}
.ind-hero-cta .btn{padding:10px 24px;border-radius:8px;font-weight:600;font-size:.9rem}
.ind-hero-cta .btn-primary{background:#3E342E;border-color:#3E342E;color:#fff}
.ind-hero-cta .btn-outline{background:transparent;border:1px solid rgba(62,52,46,.45);color:#3F362E}
.ind-hero-cta .btn-outline:hover{background:#3E342E;border-color:#3E342E;color:#fff}
.ind-hero-stats{display:grid;grid-template-columns:repeat(2,1fr);gap:14px;flex-shrink:0}
.ind-hero-card{background:rgba(255,255,255,.66);backdrop-filter:blur(12px);border:1px solid rgba(138,101,64,.22);border-radius:12px;padding:20px 24px;text-align:center;min-width:120px}
.ind-hero-card strong{display:block;font-size:2rem;font-weight:800;color:#8A6540;line-height:1}
.ind-hero-card span{font-size:.8rem;color:rgba(63,54,46,.62);margin-top:4px;display:block}
/* Quick Navigation */
.ind-quicknav{background:#fff;border-bottom:1px solid #e2e8f0;padding:12px 0;position:sticky;top:60px;z-index:50;box-shadow:0 2px 8px rgba(0,0,0,.04)}
.ind-quicknav-list{display:flex;gap:8px;flex-wrap:wrap;justify-content:center}
.ind-quicknav-item{display:inline-flex;align-items:center;gap:6px;padding:8px 18px;background:#f1f5f9;border-radius:20px;font-size:.85rem;font-weight:500;color:#475569;text-decoration:none;transition:all .2s}
.ind-quicknav-item:hover{background:#8A6540;color:#fff;transform:translateY(-2px)}
.ind-quicknav-item i{font-size:.8rem}
/* Section */
.ind-page-wrap{background:#f8fafc;padding:24px 0 40px}
.ind-section{background:#fff;border:1px solid #e8edf3;border-radius:16px;box-shadow:0 4px 20px rgba(0,0,0,.06);padding:32px;margin:20px 0}
.ind-section:first-child{margin-top:0}
.ind-section:last-child{margin-bottom:0}
.ind-section-header{text-align:center;margin-bottom:28px}
.ind-section-tag{display:inline-block;color:#fff;font-size:.75rem;font-weight:700;padding:4px 14px;border-radius:20px;margin-bottom:12px}
.ind-section-header h2{font-size:1.8rem;font-weight:800;color:#1e293b;margin-bottom:8px}
.ind-section-header p{font-size:.95rem;color:#64748b;max-width:680px;margin:0 auto}
/* Strategic Grid */
.ind-strategic-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.ind-strategic-card{display:flex;flex-direction:column;background:#fff;border:1px solid #e2e8f0;border-radius:12px;padding:24px 20px;text-decoration:none;color:inherit;transition:all .3s;border-top:4px solid var(--card-color);position:relative;overflow:hidden}
.ind-strategic-card::after{content:'';position:absolute;bottom:0;left:0;right:0;height:3px;background:var(--card-color);transform:scaleX(0);transition:transform .3s}
.ind-strategic-card:hover{transform:translateY(-4px);box-shadow:0 12px 30px rgba(0,0,0,.1)}
.ind-strategic-card:hover::after{transform:scaleX(1)}
.ind-strategic-icon{width:48px;height:48px;border-radius:12px;background:color-mix(in srgb,var(--card-color) 12%,transparent);display:flex;align-items:center;justify-content:center;font-size:1.4rem;color:var(--card-color);margin-bottom:14px}
.ind-strategic-card h3{font-size:1.05rem;font-weight:700;color:#1e293b;margin-bottom:8px}
.ind-strategic-card p{font-size:.82rem;color:#64748b;line-height:1.5;flex:1}
.ind-strategic-tags{display:flex;flex-wrap:wrap;gap:4px;margin:10px 0}
.ind-strategic-tag{font-size:.7rem;background:#f1f5f9;color:#475569;padding:2px 8px;border-radius:10px}
.ind-strategic-link{font-size:.82rem;font-weight:600;color:var(--card-color);margin-top:6px}
/* Group */
.ind-group{margin-bottom:36px}
.ind-group-header{margin-bottom:16px}
.ind-group-header h3{font-size:1.2rem;font-weight:700;color:#1e293b;display:flex;align-items:center;gap:8px}
.ind-group-header i{font-size:1.1rem}
.ind-group-count{font-size:.8rem;font-weight:400;color:#94a3b8;background:#f1f5f9;padding:2px 10px;border-radius:10px}
/* Industry Grid */
.ind-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:14px}
.ind-card{display:flex;flex-direction:column;background:#fff;border:1px solid #e2e8f0;border-radius:10px;padding:18px;text-decoration:none;color:inherit;transition:all .25s}
.ind-card:hover{transform:translateY(-3px);box-shadow:0 8px 24px rgba(0,0,0,.08);border-color:#cbd5e1}
.ind-card-top{display:flex;align-items:center;justify-content:space-between;border-top:3px solid #B99168;margin:-18px -18px 12px;padding:12px 18px 0}
.ind-card-top h4{font-size:.95rem;font-weight:700;color:#1e293b}
.ind-card-badge{font-size:.7rem;font-weight:600;color:#8A6540;background:#F6F1E5;padding:2px 8px;border-radius:10px;white-space:nowrap}
.ind-card-desc{font-size:.8rem;color:#64748b;line-height:1.5;flex:1;margin-bottom:8px}
.ind-card-tags{display:flex;flex-wrap:wrap;gap:4px;margin-bottom:8px}
.ind-card-tag{font-size:.68rem;background:#f8fafc;color:#64748b;padding:2px 7px;border-radius:8px;border:1px solid #f1f5f9}
.ind-card-link{font-size:.78rem;font-weight:600;color:#8A6540;align-self:flex-start}
/* Capability Matrix */
.ind-capability-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.ind-cap-item{background:#fff;border:1px solid #e2e8f0;border-radius:10px;padding:20px;text-align:center;transition:all .25s}
.ind-cap-item:hover{transform:translateY(-3px);box-shadow:0 8px 20px rgba(0,0,0,.06);border-color:#DCC9A9}
a.ind-cap-item{display:block;text-decoration:none;color:inherit}
a.ind-cap-item:hover h4{color:#1e293b}
.ind-cap-icon{font-size:2rem;margin-bottom:10px}
.ind-cap-item h4{font-size:.95rem;font-weight:700;color:#1e293b;margin-bottom:6px}
.ind-cap-item p{font-size:.78rem;color:#64748b;line-height:1.4;margin-bottom:8px}
.ind-cap-count{display:inline-block;font-size:.72rem;font-weight:600;color:#059669;background:#ecfdf5;padding:2px 10px;border-radius:10px}
/* Knowledge Base Grid */
.ind-kb-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.ind-kb-card{display:flex;flex-direction:column;background:#fff;border:1px solid #e2e8f0;border-radius:10px;padding:18px;text-decoration:none;color:inherit;transition:all .25s;position:relative}
.ind-kb-card:hover{transform:translateY(-3px);box-shadow:0 8px 20px rgba(0,0,0,.06);border-color:#a78bfa}
.ind-kb-icon{font-size:1.8rem;margin-bottom:8px}
.ind-kb-card h4{font-size:.9rem;font-weight:700;color:#1e293b;margin-bottom:4px}
.ind-kb-count{display:inline-block;font-size:.7rem;font-weight:600;color:#7c3aed;background:#f5f3ff;padding:1px 8px;border-radius:10px;margin-bottom:6px;align-self:flex-start}
.ind-kb-card p{font-size:.78rem;color:#64748b;line-height:1.4}
/* Process */
.ind-process{display:flex;align-items:flex-start;justify-content:center;gap:8px;flex-wrap:wrap}
.ind-process-step{flex:1;min-width:140px;max-width:200px;text-align:center;background:#fff;border:1px solid #e2e8f0;border-radius:10px;padding:20px 12px;transition:all .25s}
.ind-process-step:hover{transform:translateY(-3px);box-shadow:0 8px 16px rgba(0,0,0,.06)}
.ind-process-num{width:36px;height:36px;border-radius:50%;background:linear-gradient(135deg,#d97706,#D4764E);color:#fff;font-size:1.1rem;font-weight:700;display:flex;align-items:center;justify-content:center;margin:0 auto 10px}
.ind-process-step h4{font-size:.9rem;font-weight:700;color:#1e293b;margin-bottom:6px}
.ind-process-step p{font-size:.76rem;color:#64748b;line-height:1.4}
.ind-process-arrow{font-size:1.5rem;color:#cbd5e1;align-self:center;margin-top:20px}
/* News Grid */
.ind-news-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.ind-news-card{background:#fff;border:1px solid #e2e8f0;border-radius:10px;padding:18px;transition:all .25s}
.ind-news-card:hover{transform:translateY(-3px);box-shadow:0 8px 16px rgba(0,0,0,.06)}
.ind-news-cat{display:inline-block;font-size:.7rem;font-weight:600;color:#0891b2;background:#ecfeff;padding:2px 8px;border-radius:10px;margin-bottom:8px}
.ind-news-card h4{font-size:.9rem;font-weight:600;margin-bottom:8px}
.ind-news-card h4 a{color:#1e293b;text-decoration:none}
.ind-news-card h4 a:hover{color:#8A6540}
.ind-news-card p{font-size:.78rem;color:#64748b;line-height:1.5;margin-bottom:8px}
.ind-news-meta{display:flex;gap:12px;font-size:.72rem;color:#94a3b8}
/* CTA */
.ind-cta{background:linear-gradient(135deg,#F7F1E4,#EBDFC4);border:1px solid rgba(138,101,64,.18);border-radius:16px;padding:40px;display:flex;align-items:center;justify-content:space-between;gap:30px;margin:20px 0;color:#3F362E;box-shadow:0 6px 20px rgba(63,54,46,.12)}
.ind-cta-content{flex:1}
.ind-cta-content h2{font-size:1.6rem;font-weight:800;margin-bottom:8px;color:#3F362E}
.ind-cta-content p{color:rgba(63,54,46,.72);font-size:.9rem;margin-bottom:16px}
.ind-cta-actions{display:flex;gap:12px}
.ind-cta-actions .btn{padding:10px 24px;border-radius:8px;font-weight:600;font-size:.9rem}
.ind-cta-actions .btn-primary{background:#3E342E;border-color:#3E342E;color:#fff}
.ind-cta-actions .btn-outline{background:transparent;border:1px solid rgba(62,52,46,.45);color:#3F362E}
.ind-cta-actions .btn-outline:hover{background:#3E342E;border-color:#3E342E;color:#fff}
.ind-cta-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;flex-shrink:0}
.ind-cta-stats > div{text-align:center}
.ind-cta-stats strong{display:block;font-size:1.6rem;font-weight:800;color:#8A6540}
.ind-cta-stats span{font-size:.75rem;color:rgba(63,54,46,.55)}
/* Responsive */
@media (max-width:1024px){
.ind-strategic-grid{grid-template-columns:repeat(3,1fr)}
.ind-capability-grid{grid-template-columns:repeat(3,1fr)}
.ind-kb-grid{grid-template-columns:repeat(3,1fr)}
.ind-hero .container{flex-direction:column}
.ind-hero-stats{width:100%;max-width:400px}
}
@media (max-width:768px){
.ind-page-wrap{padding:16px 0 24px}
.ind-section{padding:24px 18px;margin:14px 0}
.ind-cta{margin:14px 0}
.ind-strategic-grid{grid-template-columns:repeat(2,1fr)}
.ind-capability-grid{grid-template-columns:repeat(2,1fr)}
.ind-kb-grid{grid-template-columns:repeat(2,1fr)}
.ind-news-grid{grid-template-columns:repeat(2,1fr)}
.ind-grid{grid-template-columns:repeat(2,1fr)}
.ind-hero h1{font-size:1.8rem}
.ind-hero-stats{grid-template-columns:repeat(2,1fr)}
.ind-cta{flex-direction:column;padding:24px}
.ind-cta-stats{grid-template-columns:repeat(2,1fr)}
.ind-process{flex-direction:column}
.ind-process-arrow{transform:rotate(90deg);margin:0}
.ind-quicknav{position:relative;top:0}
}
@media (max-width:480px){
.ind-section{padding:20px 14px;margin:12px 0}
.ind-cta{margin:12px 0}
.ind-strategic-grid{grid-template-columns:repeat(2,1fr)}
.ind-capability-grid{grid-template-columns:repeat(2,1fr)}
.ind-kb-grid{grid-template-columns:repeat(2,1fr)}
.ind-news-grid{grid-template-columns:repeat(2,1fr)}
.ind-grid{grid-template-columns:repeat(2,1fr)}
.ind-card{padding:12px 10px}
.ind-card-top{margin:-12px -10px 8px;padding:10px 10px 0}
.ind-card-top h4{font-size:16px}
.ind-card-desc{font-size:14px}
.ind-card-link{font-size:14px}
.ind-kb-card{padding:12px 10px}
.ind-kb-card h4{font-size:16px}
.ind-kb-card p{font-size:13px}
.ind-news-card{padding:12px 10px}
.ind-news-card h4{font-size:16px}
.ind-news-card p{font-size:13px}
}
/* ============================================
技术干货页 v3.0 — 侧边栏布局样式
============================================ */
/* ---------- 页面头部 ---------- */
.page-header-knowledge {
background: linear-gradient(135deg, var(--primary) 0%, #1e4a7a 100%);
}
/* ---------- 主布局：侧边栏 + 内容 ---------- */
.knowledge-search-bar {
background: var(--bg-white);
border-bottom: 1px solid var(--border-light);
padding: 0;
}
.knowledge-search-bar .container {
display: flex;
align-items: center;
justify-content: space-between;
flex-wrap: wrap;
gap: 12px;
padding-top: 16px;
padding-bottom: 16px;
}
.knowledge-search-form {
display: flex;
gap: 12px;
align-items: center;
flex: 1;
max-width: 780px;
}
.knowledge-search-input {
flex: 1;
max-width: 640px;
padding: 12px 20px;
border: 2px solid var(--border);
border-radius: 8px;
font-size: 16px;
outline: none;
transition: border-color 0.2s, box-shadow 0.2s;
}
.knowledge-search-input:focus {
border-color: var(--primary-light);
box-shadow: 0 0 0 3px rgba(0,114,198,0.12);
}
.btn-knowledge-search {
padding: 12px 28px;
background: var(--primary-light);
color: #fff;
border: none;
border-radius: 8px;
cursor: pointer;
font-size: 16px;
white-space: nowrap;
transition: background 0.2s;
}
.btn-knowledge-search:hover {
background: var(--primary);
}
.search-clear-link {
color: var(--text-light);
font-size: 15px;
text-decoration: none;
white-space: nowrap;
}
.search-clear-link:hover {
color: var(--primary);
}
.search-result-hint {
font-size: 14px;
color: var(--text-light);
white-space: nowrap;
}
.search-result-hint strong {
color: var(--primary);
}
/* 多关键词标签样式 */
.kw-tag {
display: inline-block;
background: var(--primary-light);
color: #fff;
padding: 2px 10px;
border-radius: 12px;
font-size: 13px;
font-weight: 500;
}
.kw-plus {
color: var(--text-light);
font-size: 14px;
margin: 0 2px;
}
@media(max-width:640px) {
.knowledge-search-form {
flex-wrap: wrap;
}
.knowledge-search-input {
flex: none;
width: 100%;
max-width: none;
}
.search-result-hint {
width: 100%;
}
}
.knowledge-layout {
display: flex;
gap: 28px;
margin-top: 24px;
align-items: flex-start;
}
/* ---------- 左侧边栏 ---------- */
.knowledge-sidebar {
width: 260px;
flex-shrink: 0;
position: sticky;
top: 88px;
}
.sidebar-card {
background: var(--bg-white);
border-radius: var(--radius);
border: 1px solid var(--border);
padding: 20px;
margin-bottom: 20px;
}
.sidebar-title {
font-size: 15px;
font-weight: 700;
color: var(--primary);
margin-bottom: 14px;
padding-bottom: 10px;
border-bottom: 2px solid var(--border-light);
}
/* ---------- 分类导航 ---------- */
.category-nav {
display: flex;
flex-direction: column;
gap: 2px;
}
.category-link {
display: flex;
align-items: center;
gap: 10px;
padding: 10px 12px;
border-radius: var(--radius-sm);
text-decoration: none;
color: var(--text);
transition: var(--transition);
position: relative;
}
.category-link:hover {
background: var(--bg-light);
color: var(--primary);
}
.category-link.active {
background: var(--primary);
color: #fff;
}
.category-link.active .cat-desc,
.category-link.active .cat-count {
color: rgba(255,255,255,0.75);
}
.cat-icon {
font-size: 18px;
flex-shrink: 0;
width: 28px;
text-align: center;
}
.cat-text {
flex: 1;
min-width: 0;
display: flex;
flex-direction: column;
gap: 2px;
}
.cat-name {
font-size: 14px;
font-weight: 500;
line-height: 1.3;
}
.cat-desc {
font-size: 11px;
color: var(--text-lighter);
line-height: 1.3;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.cat-count {
font-size: 12px;
color: var(--text-lighter);
background: var(--bg-light);
padding: 2px 8px;
border-radius: 10px;
font-weight: 600;
flex-shrink: 0;
}
.category-link.active .cat-count {
background: rgba(255,255,255,0.2);
color: #fff;
}
/* ---------- 热门标签 ---------- */
.hot-tags {
display: flex;
flex-wrap: wrap;
gap: 8px;
}
.tag-pill {
display: inline-block;
padding: 5px 12px;
font-size: 12px;
border-radius: 16px;
background: var(--bg-light);
color: var(--text-light);
text-decoration: none;
transition: var(--transition);
border: 1px solid transparent;
}
.tag-pill:hover {
background: var(--primary-light);
color: #fff;
border-color: var(--primary-light);
}
.tag-pill.active {
background: var(--accent);
color: #fff;
border-color: var(--accent);
}
/* ---------- 右侧主内容 ---------- */
.knowledge-main {
flex: 1;
min-width: 0;
}
/* ---------- 筛选横幅 ---------- */
.filter-banner {
display: flex;
align-items: center;
gap: 10px;
padding: 12px 18px;
background: var(--bg-white);
border: 1px solid var(--border);
border-radius: var(--radius-sm);
margin-bottom: 20px;
font-size: 14px;
}
.filter-label {
color: var(--text-light);
}
.filter-value {
font-weight: 700;
color: var(--primary);
font-size: 15px;
}
.filter-count {
color: var(--text-lighter);
}
.filter-clear {
margin-left: auto;
color: var(--danger);
text-decoration: none;
font-size: 13px;
padding: 4px 12px;
border-radius: 4px;
transition: var(--transition);
}
.filter-clear:hover {
background: #fef2f2;
}
/* ---------- 文章卡片增强 ---------- */
.knowledge-card {
display: flex;
flex-direction: column;
}
.card-tags {
display: flex;
flex-wrap: wrap;
gap: 6px;
margin-bottom: 10px;
}
.card-tag {
display: inline-block;
padding: 2px 8px;
font-size: 11px;
border-radius: 4px;
background: var(--bg-light);
color: var(--text-light);
text-decoration: none;
transition: var(--transition);
}
.card-tag:hover {
background: var(--primary-light);
color: #fff;
}
.card-meta {
display: flex;
gap: 16px;
margin-top: 12px;
font-size: 12px;
color: var(--text-lighter);
}
.meta-date, .meta-views {
display: inline-flex;
align-items: center;
gap: 4px;
}
/* ---------- 空状态 ---------- */
.empty-state {
text-align: center;
padding: 60px 20px;
color: var(--text-light);
}
.empty-state p {
font-size: 16px;
margin-bottom: 20px;
}
/* ---------- 分页优化 ---------- */
.pagination {
display: flex;
justify-content: center;
align-items: center;
gap: 6px;
margin-top: 36px;
flex-wrap: wrap;
}
.pagination a,
.pagination span {
display: inline-flex;
align-items: center;
justify-content: center;
min-width: 36px;
height: 36px;
padding: 0 10px;
border-radius: var(--radius-sm);
font-size: 14px;
text-decoration: none;
transition: var(--transition);
}
.pagination a {
background: var(--bg-white);
color: var(--text);
border: 1px solid var(--border);
}
.pagination a:hover {
background: var(--primary-light);
color: #fff;
border-color: var(--primary-light);
}
.pagination .current {
background: var(--primary);
color: #fff;
border: 1px solid var(--primary);
font-weight: 700;
}
.pagination .page-dots {
color: var(--text-lighter);
background: none;
border: none;
min-width: auto;
padding: 0 4px;
}
.pagination .page-prev,
.pagination .page-next {
padding: 0 14px;
font-weight: 500;
}
/* ============================================
响应式：移动端适配
============================================ */
@media (max-width: 900px) {.knowledge-layout {
flex-direction: column;
align-items: stretch; /* #1140 修复：column 后继承桌面的 flex-start 会让交叉轴 fit-content，被正文大图 min-content 撑爆布局视口 */
gap: 16px;
}
.knowledge-main {
width: 100%; /* #1140 双保险：显式占满交叉轴，图片不再撑宽正文 */
}
.knowledge-sidebar {
width: 100%;
position: static;
display: flex;
gap: 12px;
overflow-x: auto;
-webkit-overflow-scrolling: touch;
padding-bottom: 4px;
}
.sidebar-card {
flex-shrink: 0;
min-width: 140px;
padding: 14px;
margin-bottom: 0;
}
.sidebar-card:first-child {
flex: 1;
min-width: 200px;
}
.sidebar-title {
font-size: 13px;
margin-bottom: 8px;
padding-bottom: 6px;
}
.category-link {
padding: 7px 10px;
gap: 6px;
}
.cat-icon { font-size: 15px; width: 22px; }
.cat-name { font-size: 13px; }
.cat-desc { display: none; }
.cat-count { font-size: 11px; padding: 1px 6px; }
.hot-tags {
gap: 5px;
}
.tag-pill {
padding: 4px 10px;
font-size: 11px;
}
.filter-banner {
flex-wrap: wrap;
gap: 6px;
padding: 10px 14px;
font-size: 13px;
}
}
@media (max-width: 600px) {
.cards-grid {
grid-template-columns: repeat(2, 1fr);
}
.category-link {
padding: 6px 8px;
}
.cat-desc { display: none; }
.pagination a, .pagination span {
min-width: 32px;
height: 32px;
font-size: 13px;
}
}
/* 2-column dropdown grid for knowledge nav */
.dropdown-grid-2 { grid-template-columns: repeat(2, 1fr) !important; gap: 24px; }
.dropdown-grid-2 .dropdown-col { min-width: 160px; }
.dropdown-grid-2 .dropdown-col h4 { font-size: 13px; margin-bottom: 10px; }
@media (max-width: 600px) {
.dropdown-grid-2 { grid-template-columns: 1fr !important; }
}
/* ============================================
全站搜索页样式
============================================ */
/* ============================================
全站搜索页样式
============================================ */
.site-search-section {
background: var(--bg);
padding: 40px 0 80px;
}
.site-search-box {
background: #fff;
border-radius: var(--radius);
box-shadow: var(--shadow);
padding: 32px;
margin-bottom: 36px;
}
.site-search-form {
display: flex;
flex-direction: column;
gap: 16px;
}
.site-search-row {
display: flex;
align-items: center;
gap: 14px;
flex-wrap: wrap;
}
.site-search-input {
flex: 1;
min-width: 260px;
padding: 16px 22px;
font-size: 17px;
border: 2px solid var(--border);
border-radius: var(--radius-sm);
outline: none;
transition: border-color 0.2s, box-shadow 0.2s;
}
.site-search-input:focus {
border-color: var(--primary-light);
box-shadow: 0 0 0 4px rgba(138,101,64, 0.10);
}
.site-search-btn {
padding: 16px 32px;
font-size: 17px;
border: none;
border-radius: var(--radius-sm);
background: var(--primary-light);
color: #fff;
cursor: pointer;
white-space: nowrap;
transition: background 0.2s;
}
.site-search-btn:hover {
background: var(--primary);
}
.site-search-clear {
color: var(--text-light);
font-size: 15px;
white-space: nowrap;
padding: 10px 6px;
}
.site-search-clear:hover {
color: var(--danger);
}
/* 检索范围勾选 */
.search-scope {
display: flex;
flex-wrap: wrap;
align-items: center;
gap: 10px 14px;
padding: 14px 16px;
background: var(--bg-light);
border-radius: var(--radius-sm);
border: 1px dashed var(--border);
}
.search-scope-label {
font-size: 14px;
font-weight: 600;
color: var(--primary-dark);
white-space: nowrap;
}
.scope-check {
display: inline-flex;
align-items: center;
gap: 5px;
font-size: 13.5px;
color: var(--text);
cursor: pointer;
padding: 5px 12px;
border-radius: 16px;
background: #fff;
border: 1px solid var(--border);
transition: all 0.15s;
user-select: none;
white-space: nowrap;
}
.scope-check:hover {
border-color: var(--primary-light);
color: var(--primary-light);
}
.scope-check input {
accent-color: var(--primary-light);
cursor: pointer;
}
.scope-actions {
margin-left: auto;
display: inline-flex;
gap: 8px;
}
/* 显示图片开关：位于每个结果分区的 header 右侧 */
.search-section-actions {
display: flex;
align-items: center;
gap: 14px;
flex-shrink: 0;
}
.section-img-toggle {
display: inline-flex;
align-items: center;
gap: 7px;
background: rgba(255,255,255,0.15);
border: 1px solid rgba(255,255,255,0.35);
border-radius: 20px;
padding: 6px 14px;
cursor: pointer;
font-size: 13.5px;
font-weight: 600;
color: #fff;
transition: all 0.15s;
user-select: none;
}
.section-img-toggle:hover {
background: rgba(255,255,255,0.28);
border-color: rgba(255,255,255,0.55);
}
.section-img-toggle input {
accent-color: #fff;
width: 15px;
height: 15px;
margin: 0;
cursor: pointer;
}
/* #1141 分品牌 chip：产品中心 header 内，命中多品牌时显示 */
.brand-filter {
display: flex;
flex-wrap: wrap;
align-items: center;
gap: 6px;
}
.brand-chip {
display: inline-flex;
align-items: center;
gap: 4px;
background: rgba(255,255,255,0.14);
border: 1px solid rgba(255,255,255,0.32);
border-radius: 14px;
padding: 3px 11px;
font-size: 12.5px;
font-weight: 600;
line-height: 1.6;
color: #fff;
text-decoration: none;
transition: all 0.15s;
white-space: nowrap;
}
.brand-chip:hover {
background: rgba(255,255,255,0.3);
border-color: rgba(255,255,255,0.55);
color: #fff;
}
.brand-chip.active {
background: #fff;
color: var(--primary);
border-color: #fff;
}
.brand-chip .bc-count {
font-size: 11px;
opacity: 0.72;
}
/* #1143 品牌 chip 自动分行：header 允许换行，chip 行独占整行多行折行，标题不被挤成竖排 */
.search-section-header {
flex-wrap: wrap;
}
.search-section-header h2 {
flex-shrink: 0;
}
.search-section-actions {
flex-wrap: wrap;
}
.brand-filter {
width: 100%;
order: 3;
margin-top: 8px;
}
/* 分页控件：每栏目 9 条/页 */
.search-pagination {
display: flex;
align-items: center;
gap: 8px;
justify-content: center;
padding: 18px 0 6px;
flex-wrap: wrap;
}
.search-pagination .page-btn {
padding: 6px 14px;
border: 1px solid #d0d5e0;
background: #fff;
border-radius: 6px;
cursor: pointer;
font-size: 13px;
color: var(--text-dark);
transition: all 0.15s;
white-space: nowrap;
}
.search-pagination .page-btn:hover:not(:disabled) {
border-color: var(--primary);
color: var(--primary);
background: #f5f8ff;
}
.search-pagination .page-btn:disabled {
opacity: 0.4;
cursor: not-allowed;
}
.search-pagination .page-numbers {
display: inline-flex;
gap: 4px;
flex-wrap: wrap;
justify-content: center;
}
.search-pagination .page-num {
display: inline-flex;
align-items: center;
justify-content: center;
min-width: 32px;
height: 32px;
border: 1px solid #d0d5e0;
border-radius: 6px;
font-size: 13px;
color: var(--text-dark);
text-decoration: none;
cursor: pointer;
transition: all 0.15s;
}
.search-pagination .page-num:hover {
border-color: var(--primary);
color: var(--primary);
}
.search-pagination .page-num.active {
background: var(--primary);
border-color: var(--primary);
color: #fff;
font-weight: 600;
}
.search-pagination .page-info {
font-size: 12px;
color: var(--text-light);
margin-left: 6px;
white-space: nowrap;
}
.scope-toggle {
padding: 5px 12px;
font-size: 12.5px;
border-radius: 12px;
border: 1px solid var(--border);
background: #fff;
color: var(--text-light);
cursor: pointer;
transition: all 0.15s;
}
.scope-toggle:hover {
color: var(--primary-light);
border-color: var(--primary-light);
}
.site-search-meta,
.site-search-tips {
margin-top: 18px;
font-size: 15px;
color: var(--text-light);
}
.site-search-meta strong,
.site-search-tips strong {
color: var(--primary);
}
.kw-tag {
display: inline-block;
background: var(--primary-light);
color: #fff;
padding: 3px 12px;
border-radius: 14px;
font-size: 14px;
font-weight: 500;
}
.kw-plus {
color: var(--text-lighter);
margin: 0 3px;
}
/* 热搜关键词 */
.hot-keywords {
display: flex;
flex-wrap: wrap;
align-items: center;
gap: 10px;
margin-top: 14px;
padding-top: 14px;
border-top: 1px dashed var(--border);
}
.hot-keywords-label {
font-size: 14px;
color: var(--text-light);
font-weight: 500;
white-space: nowrap;
}
/* #1210 热搜关键词去胶囊+纤细体（PC 端清晰度反馈 2026-09-14） */
.hot-keyword {
display: inline-block;
padding: 2px 2px;
border-radius: 0;
background: transparent;
color: #8A6540;
font-size: 14px;
font-weight: 300;
text-decoration: none;
transition: all 0.15s;
border: none;
}
.hot-keyword:hover {
background: transparent;
color: #5f4527;
text-decoration: underline;
}
@media (max-width: 768px) {
.hot-keywords {
gap: 8px;
}
.hot-keyword {
padding: 4px 12px;
font-size: 13px;
}
}
/* 搜索结果分栏 */
.site-search-results {
display: flex;
flex-direction: column;
gap: 32px;
}
.search-section {
background: #fff;
border-radius: var(--radius);
box-shadow: var(--shadow);
overflow: hidden;
}
.search-section-header {
display: flex;
justify-content: space-between;
align-items: center;
padding: 18px 24px;
background: linear-gradient(90deg, var(--primary), var(--primary-dark));
color: #fff;
cursor: pointer;
transition: background 0.2s;
}
.search-section-header:hover {
background: linear-gradient(90deg, var(--primary-light), var(--primary-dark));
}
.search-section-header h2 {
font-size: 18px;
font-weight: 600;
display: flex;
align-items: center;
gap: 10px;
margin: 0;
}
.search-section-icon {
font-size: 20px;
line-height: 1;
}
.search-section-kw {
color: #B85C38;
font-weight: 700;
white-space: nowrap;
}
.search-section-kw-dark {
color: #0a3d91;
font-weight: 700;
white-space: nowrap;
}
/* KB 详情页右栏相关标题的【关键字】前缀（白底卡片用深蓝） */
.kb-sidebar-card h3 .kb-sidebar-kw {
color: #0a3d91;
font-weight: 700;
white-space: nowrap;
}
/* KB 详情页右栏相关卡片分页（紧凑版，适配窄侧栏） */
.kb-detail-sidebar .kb-pager {
padding: 10px 0 2px;
gap: 4px;
justify-content: flex-start;
}
.kb-detail-sidebar .kb-pager-btn {
min-width: 28px;
height: 26px;
padding: 0 6px;
font-size: 12px;
}
.kb-detail-sidebar .kb-pager-cur {
min-width: 28px;
height: 26px;
padding: 0 6px;
font-size: 12px;
}
.kb-detail-sidebar .kb-pager-info {
font-size: 11px;
margin-left: 6px;
}
.search-section-count {
background: rgba(255,255,255,0.18);
padding: 2px 10px;
border-radius: 12px;
font-size: 13px;
font-weight: 500;
margin-left: 6px;
}
.fold-indicator {
display: inline-flex;
align-items: center;
justify-content: center;
width: 22px;
height: 22px;
margin-left: 6px;
border-radius: 50%;
background: rgba(255,255,255,0.16);
font-size: 12px;
line-height: 1;
opacity: 0.75;
transition: transform 0.2s, opacity 0.2s;
}
.fold-indicator::before {
content: '▾';
}
.search-section.collapsed .fold-indicator::before {
content: '▸';
}
.search-section.collapsed .search-section-body {
display: none;
}
.search-section.collapsed .search-section-header {
border-radius: var(--radius);
}
.search-section-more {
color: #fff;
font-size: 14px;
opacity: 0.9;
}
.search-section-more:hover {
opacity: 1;
text-decoration: underline;
}
.search-section-body {
padding: 8px 0;
}
.search-result-item {
display: flex;
align-items: center;
justify-content: space-between;
gap: 16px;
padding: 16px 24px;
border-bottom: 1px solid var(--border-light);
color: var(--text);
transition: background 0.15s;
}
.search-result-item:last-child {
border-bottom: none;
}
.search-result-item:hover {
background: var(--bg-light);
}
.search-result-main {
flex: 1;
min-width: 0;
}
.search-result-main h3 {
font-size: 16px;
font-weight: 600;
color: var(--primary-dark);
margin-bottom: 6px;
line-height: 1.4;
}
.search-result-item:hover .search-result-main h3 {
color: var(--primary-light);
}
.search-result-main p {
font-size: 14px;
color: var(--text-light);
line-height: 1.6;
margin-bottom: 8px;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
overflow: hidden;
}
.search-result-meta {
display: flex;
flex-wrap: wrap;
align-items: center;
gap: 8px;
}
.search-result-tag,
.search-result-label {
display: inline-block;
font-size: 12px;
padding: 2px 8px;
border-radius: 4px;
white-space: nowrap;
}
.search-result-tag {
background: rgba(138,101,64, 0.08);
color: var(--primary-light);
}
.search-result-label {
background: var(--bg-light);
color: var(--text-light);
}
.search-result-date {
font-size: 12px;
color: var(--text-lighter);
}
.search-result-arrow {
flex-shrink: 0;
width: 32px;
height: 32px;
border-radius: 50%;
background: var(--bg-light);
color: var(--primary-light);
display: flex;
align-items: center;
justify-content: center;
font-size: 18px;
transition: background 0.15s, color 0.15s;
}
.search-result-item:hover .search-result-arrow {
background: var(--primary-light);
color: #fff;
}
.site-search-empty {
text-align: center;
padding: 60px 20px;
background: #fff;
border-radius: var(--radius);
box-shadow: var(--shadow);
}
.site-search-empty p {
font-size: 16px;
color: var(--text-light);
margin-bottom: 24px;
}
/* 响应式 */
@media (max-width: 768px) {
.site-search-box {
padding: 20px;
}
.site-search-form {
flex-direction: column;
align-items: stretch;
}
.site-search-row {
flex-direction: column;
align-items: stretch;
}
.site-search-input,
.site-search-btn,
.site-search-clear {
width: 100%;
text-align: center;
}
.search-scope {
padding: 12px;
gap: 8px;
}
.scope-check {
padding: 4px 9px;
font-size: 12.5px;
}
.scope-actions {
margin-left: 0;
}
.search-section-header {
flex-direction: column;
align-items: flex-start;
gap: 10px;
}
.search-section-actions {
width: 100%;
justify-content: space-between;
gap: 10px;
flex-wrap: wrap; /* #1141 品牌 chip 可换行 */
}
/* #1141 手机端品牌 chip 独占一行、横向换行 */
.brand-filter {
width: 100%;
order: 3;
gap: 5px;
}
.brand-chip {
padding: 4px 10px;
font-size: 12px;
}
.section-img-toggle {
font-size: 12.5px;
padding: 5px 12px;
}
.search-pagination {
gap: 6px;
padding: 14px 0 4px;
}
.search-pagination .page-btn {
padding: 5px 10px;
font-size: 12px;
}
.search-pagination .page-num {
min-width: 28px;
height: 28px;
font-size: 12px;
}
.search-pagination .page-info {
width: 100%;
text-align: center;
margin-left: 0;
}
.search-result-item {
padding: 14px 18px;
}
.search-result-main h3 {
font-size: 15px;
}
.search-result-arrow {
display: none;
}
}
/* 搜索结果页 — 产品中心卡片网格（5列，前10个） */
.search-section-products{padding:16px 24px 24px}
.search-section-products .product-grid{
grid-template-columns:repeat(5,1fr);
gap:14px;
align-items:stretch;
}
.search-section-products .product-card{
display:flex;flex-direction:column;
background:#fff;border:1px solid var(--border-light);border-radius:10px;
overflow:hidden;
transition:transform .2s,box-shadow .2s,border-color .2s;
height:100%;
}
.search-section-products .product-card:hover{
box-shadow:0 6px 20px rgba(0,0,0,.08);transform:translateY(-2px);border-color:var(--border)
}
.search-section-products .product-card-inner{flex:1;display:flex;flex-direction:column;min-width:0}
.search-section-products .product-thumb{
height:150px;
display:flex;align-items:center;justify-content:center;
background:#f8fafc;overflow:hidden;
border-bottom:1px solid #f1f5f9;
}
.search-section-products .product-thumb img{
width:100%;height:100%;
object-fit:contain;
transition:transform .3s;
}
.search-section-products .product-card:hover .product-thumb img{transform:scale(1.03)}
.search-section-products .product-body{
flex:1;display:flex;flex-direction:column;gap:6px;
padding:12px 14px 14px;
min-height:0;
}
.search-section-products .product-name{
font-size:13px;font-weight:600;color:#1a1a2e;line-height:1.4;
margin:0;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
min-height:2.8em;
}
.search-section-products .product-meta{
display:flex;flex-direction:column;align-items:flex-start;gap:2px;
font-size:11px;color:#64748b;
}
.search-section-products .product-model{color:#8A6540;font-family:monospace;font-size:11px}
.search-section-products .product-brand{color:#64748b}
.search-section-products .product-tags{display:none}
.search-section-products .product-card > .product-card-categories{
padding:0 14px 12px;margin-top:auto;
border-top:none;
}
@media(max-width:1200px){
.search-section-products .product-grid{grid-template-columns:repeat(4,1fr)}
}
@media(max-width:992px){
.search-section-products .product-grid{grid-template-columns:repeat(3,1fr)}
}
@media(max-width:768px){
.search-section-products{padding:12px 16px 20px}
.search-section-products .product-grid{grid-template-columns:repeat(2,1fr);gap:10px}
.search-section-products .product-thumb{height:130px}
}
/* 搜索结果页 — 三列图文卡片（解决方案/技术干货/行业配套/品牌/页面） */
.search-section-body:has(.search-card-grid){padding:16px 24px 24px}
.search-card-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.search-card{display:flex;flex-direction:column;background:#fff;border:1px solid var(--border-light);border-radius:12px;overflow:hidden;text-decoration:none;transition:transform .2s,box-shadow .2s,border-color .2s;height:100%}
.search-card:hover{transform:translateY(-3px);box-shadow:0 10px 26px rgba(0,0,0,.08);border-color:var(--border)}
.search-card-thumb{position:relative;height:170px;background:#f8fafc;overflow:hidden;flex-shrink:0;display:flex;align-items:center;justify-content:center}
.search-card-thumb img{max-width:90%;max-height:90%;object-fit:contain;transition:transform .35s}
.search-card:hover .search-card-thumb img{transform:scale(1.04)}
.search-card-noimg{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;width:100%;color:#94a3b8;gap:8px;background:linear-gradient(135deg,#f8fafc,#eef2f7)}
.search-card-noimg span:first-child{font-size:32px;line-height:1}
.search-card-noimg span:last-child{font-size:12px}
.search-card-tag{position:absolute;top:12px;left:12px;background:linear-gradient(135deg,#8A6540,#1d5288);color:#fff;font-size:12px;font-weight:600;padding:5px 10px;border-radius:20px;box-shadow:0 2px 8px rgba(0,0,0,.12);line-height:1}
.search-card-body{display:flex;flex-direction:column;flex:1;padding:16px 18px 14px}
.search-card-body h3{font-size:15px;font-weight:700;color:#1e293b;line-height:1.45;margin-bottom:10px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:43px}
.search-card-body p{font-size:13px;color:#64748b;line-height:1.6;margin-bottom:14px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;flex:1}
.search-card-footer{display:flex;align-items:center;justify-content:space-between;margin-top:auto;padding-top:12px;border-top:1px solid #f1f5f9}
.search-card-date{font-size:12px;color:#94a3b8}
.search-card-link{font-size:12px;font-weight:600;color:#8A6540;transition:color .15s}
.search-card:hover .search-card-link{color:#1d5288}
@media(max-width:1200px){
.search-card-grid{grid-template-columns:repeat(3,1fr);gap:16px}
.search-card-thumb{height:155px}
}
@media(max-width:992px){
.search-card-grid{grid-template-columns:repeat(2,1fr);gap:16px}
}
@media(max-width:768px){
.search-section-body:has(.search-card-grid){padding:12px 16px 20px}
.search-card-grid{grid-template-columns:1fr;gap:14px}
.search-card-thumb{height:190px}
.search-card-body h3{font-size:14px;min-height:auto}
}
/* ============================================
搜索结果页 — 各栏目图片默认显示
============================================ */
.search-section .product-thumb,
.search-section .search-card-thumb { display: block; }
.search-section .search-card-thumb { display: flex; }
/* 隐藏图片时的布局（用户手动关闭开关时使用） */
.search-section.hide-images .product-thumb,
.search-section.hide-images .search-card-thumb { display: none; }
.search-section .search-card-body { padding: 16px 18px; }
.search-section .product-body { padding: 10px 12px; }
/* ============================================
会员门控样式
============================================ */
.member-gate{position:relative;margin-top:24px}
.member-gate-overlay{position:absolute;bottom:0;left:0;right:0;height:120px;background:linear-gradient(transparent,var(--bg) 85%);z-index:1;pointer-events:none}
.member-gate-box{background:linear-gradient(135deg,#f8fafc,#f1f5f9);border:2px dashed #cbd5e1;border-radius:16px;padding:40px 32px;text-align:center;position:relative;z-index:2}
.gate-icon{font-size:48px;margin-bottom:12px}
.member-gate-box h3{font-size:20px;font-weight:700;color:#A67C52;margin-bottom:8px}
.member-gate-box > p{font-size:14px;color:#64748b;margin-bottom:20px}
.gate-benefits{display:flex;justify-content:center;gap:20px;flex-wrap:wrap;margin-bottom:24px;font-size:13px;color:#475569}
.gate-actions{display:flex;justify-content:center;gap:12px;flex-wrap:wrap;margin-bottom:16px}
.gate-actions .btn{padding:12px 28px;font-size:15px;border-radius:8px;font-weight:600;text-decoration:none;display:inline-block}
.gate-actions .btn-primary{background:linear-gradient(135deg,#8A6540,#1d5288);color:#fff;border:none}
.gate-actions .btn-primary:hover{transform:translateY(-1px);box-shadow:0 4px 16px rgba(138,101,64,.4)}
.gate-actions .btn-outline{border:2px solid #8A6540;color:#8A6540;background:transparent}
.gate-actions .btn-outline:hover{background:#8A6540;color:#fff}
.gate-why{font-size:12px;color:#94a3b8;line-height:1.7;max-width:760px;margin:0 auto}
/* 页头会员入口 */
.header-member-links{display:flex;align-items:center;gap:8px}
.header-member-links a{color:#64748b;font-size:13px;text-decoration:none;transition:color .15s}
.header-member-links a:hover{color:#8A6540}
.header-member-sep{color:#cbd5e1}
@media(max-width:768px){
.member-gate-box{padding:28px 20px}
.member-gate-box h3{font-size:17px}
.gate-benefits{gap:12px}
}
/* ============================================
认证页面分栏布局 (v2.0 — 参照 yun.jp17.com)
============================================ */
.auth-page{display:flex;max-width:1280px;margin:0 auto;min-height:calc(100vh - 95px);height:auto;overflow:hidden}
/* 左侧品牌展示区：固定比例+上限，防止大色块无限拉伸 */
.auth-left{flex:0 0 46%;max-width:560px;min-width:380px;background:linear-gradient(160deg,#3E342E 0%,#A67C52 40%,#1d5288 100%);display:flex;align-items:center;justify-content:center;padding:48px 40px;position:relative;overflow-x:hidden;overflow-y:auto}
.auth-left::before{content:'';position:absolute;top:-60px;right:-60px;width:260px;height:260px;border-radius:50%;background:rgba(255,255,255,.03);pointer-events:none}
.auth-left::after{content:'';position:absolute;bottom:-80px;left:-40px;width:320px;height:320px;border-radius:50%;background:rgba(255,255,255,.02);pointer-events:none}
.auth-left-inner{position:relative;z-index:1;max-width:460px;width:100%;margin:0}
.auth-brand{display:flex;align-items:center;gap:14px;margin-bottom:20px}
.auth-logo{flex-shrink:0}
.auth-brand-text h2{font-size:20px;font-weight:700;color:#fff;margin-bottom:2px}
.auth-brand-text p{font-size:13px;color:rgba(255,255,255,.55);line-height:1.4}
.auth-slogan{margin-bottom:18px}
.auth-slogan h1{font-size:24px;font-weight:700;color:#fff;margin-bottom:6px;line-height:1.25}
.auth-slogan p{font-size:14px;color:rgba(255,255,255,.65);line-height:1.55}
/* 权益列表 */
.auth-features{margin-bottom:16px}
.auth-features h3{font-size:14px;font-weight:600;color:rgba(255,255,255,.8);margin-bottom:10px;text-transform:uppercase;letter-spacing:.5px}
.auth-feature-list{display:flex;flex-direction:column;gap:8px}
.auth-feature-item{display:flex;align-items:flex-start;gap:10px;padding:8px 10px;background:rgba(255,255,255,.06);border-radius:10px;transition:background .2s}
.auth-feature-item:hover{background:rgba(255,255,255,.1)}
.auth-feature-icon{font-size:17px;flex-shrink:0;margin-top:1px;line-height:1}
.auth-feature-item div{display:flex;flex-direction:column;gap:2px}
.auth-feature-item strong{font-size:13px;color:#fff;font-weight:600}
.auth-feature-item span{font-size:12px;color:rgba(255,255,255,.5);line-height:1.45}
/* 数据统计 */
.auth-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-top:20px}
.auth-stat-item{text-align:center;padding:12px 6px;background:rgba(255,255,255,.08);border-radius:10px}
.auth-stat-num{display:block;font-size:19px;font-weight:700;color:#B85C38;margin-bottom:4px}
.auth-stat-label{display:block;font-size:11px;color:rgba(255,255,255,.5)}
/* 注册好礼 */
.auth-gifts{margin-top:16px;padding:14px;background:rgba(184,92,56,.1);border:1px solid rgba(184,92,56,.25);border-radius:12px}
.auth-gifts h3{font-size:14px;font-weight:600;color:#D4764E;margin-bottom:10px}
.auth-gifts ul{display:flex;flex-direction:column;gap:6px}
.auth-gifts li{font-size:12px;color:rgba(255,255,255,.7);line-height:1.5}
/* 右侧表单区：min-width:0 防止 flex 子项撑开横向滚动 */
.auth-right{flex:1 1 auto;min-width:0;display:flex;align-items:center;justify-content:center;padding:48px 40px;background:#fff;overflow-x:hidden;overflow-y:auto}
.auth-form-wrap{width:100%;max-width:480px}
.auth-form-header{text-align:center;margin-bottom:32px}
.auth-form-header h2{font-size:26px;font-weight:700;color:var(--primary);margin-bottom:8px}
.auth-form-header p{font-size:14px;color:var(--text-light)}
/* 成功消息 */
.auth-success-icon{font-size:56px;margin-bottom:12px}
.auth-success-actions{display:flex;gap:12px;justify-content:center;margin-top:24px}
.auth-success-actions .auth-submit-btn,.auth-success-actions .auth-outline-btn{display:inline-block;padding:14px 36px;border-radius:8px;font-size:16px;font-weight:600;text-decoration:none;transition:all .2s}
.auth-outline-btn{border:2px solid var(--primary-light);color:var(--primary-light);background:transparent}
.auth-outline-btn:hover{background:var(--primary-light);color:#fff}
/* Tabs */
.auth-tabs{display:flex;gap:0;margin-bottom:24px;background:var(--bg);border-radius:10px;padding:4px}
.auth-tab{flex:1;padding:10px 20px;border:none;border-radius:8px;font-size:14px;font-weight:500;color:var(--text-light);background:transparent;cursor:pointer;transition:all .2s}
.auth-tab.active{background:#fff;color:var(--primary);font-weight:600;box-shadow:0 1px 3px rgba(0,0,0,.08)}
.auth-tab:hover:not(.active){color:var(--primary-light)}
/* 消息提示 */
.auth-msg{padding:12px 16px;border-radius:8px;font-size:14px;margin-bottom:20px}
.auth-msg-error{background:#fef2f2;color:#dc2626;border:1px solid #fecaca}
.auth-msg-success{background:#f0fdf4;color:#16a34a;border:1px solid #bbf7d0}
/* 表单 */
.auth-form{display:flex;flex-direction:column;gap:0}
.auth-form.active{display:flex}
.auth-row{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.auth-field{margin-bottom:20px}
.auth-field label{display:block;font-size:13px;font-weight:600;color:#334155;margin-bottom:6px}
.auth-field .required{color:#dc2626}
.auth-input-wrap{position:relative;display:flex;align-items:center}
.auth-input-icon{position:absolute;left:14px;pointer-events:none;flex-shrink:0}
.auth-input-wrap input{width:100%;padding:12px 14px 12px 42px;border:2px solid var(--border);border-radius:10px;font-size:14px;color:var(--text);background:#fff;transition:border-color .2s,box-shadow .2s;outline:none}
.auth-input-wrap input:focus{border-color:var(--primary-light);box-shadow:0 0 0 3px rgba(138,101,64,.1)}
.auth-input-wrap input::placeholder{color:var(--text-lighter)}
/* 密码可见切换 */
.auth-pwd-toggle{position:absolute;right:12px;background:none;border:none;cursor:pointer;padding:4px;display:flex;align-items:center}
/* 验证码 */
.auth-sms-wrap input{padding-right:120px}
.auth-sms-btn{position:absolute;right:6px;padding:6px 14px;background:linear-gradient(135deg,var(--primary-light),var(--primary-dark));color:#fff;border:none;border-radius:6px;font-size:13px;cursor:pointer;white-space:nowrap;transition:opacity .2s}
.auth-sms-btn:disabled{opacity:.6;cursor:not-allowed}
/* 密码强度 */
.auth-pwd-strength{margin-top:-12px;margin-bottom:20px;display:flex;align-items:center;gap:10px}
.pwd-strength-bar{flex:1;height:4px;background:var(--border);border-radius:2px;overflow:hidden}
.pwd-strength-bar span{display:block;height:100%;width:0;border-radius:2px;transition:width .3s,background .3s}
.pwd-strength-text{font-size:11px;white-space:nowrap}
/* 额外选项 */
.auth-form-extra{display:flex;justify-content:space-between;align-items:center;margin-bottom:24px;font-size:13px}
.auth-checkbox{display:flex;align-items:center;gap:6px;color:var(--text-light);cursor:pointer;font-size:13px}
.auth-checkbox input[type="checkbox"]{width:16px;height:16px;accent-color:var(--primary-light);cursor:pointer}
.auth-checkbox a{color:var(--primary-light)}
.auth-forgot{color:var(--primary-light);font-size:13px}
.auth-forgot:hover{text-decoration:underline}
/* 协议 */
.auth-agreement{margin-bottom:20px}
.auth-agreement .auth-checkbox{font-size:13px;align-items:flex-start}
.auth-agreement .auth-checkbox input{margin-top:1px}
/* 提交按钮 */
.auth-submit-btn{display:block;width:100%;padding:14px;background:linear-gradient(135deg,var(--primary-light),#1d5288);color:#fff;border:none;border-radius:10px;font-size:16px;font-weight:600;cursor:pointer;transition:all .2s;text-align:center;text-decoration:none}
.auth-submit-btn:hover{transform:translateY(-1px);box-shadow:0 6px 20px rgba(138,101,64,.35)}
/* 底部链接 */
.auth-form-footer{margin-top:24px;text-align:center}
.auth-switch{font-size:14px;color:var(--text-light);margin-bottom:10px}
.auth-switch a{color:var(--primary-light);font-weight:600}
.auth-switch a:hover{text-decoration:underline}
.auth-home a{font-size:13px;color:var(--text-lighter)}
.auth-home a:hover{color:var(--primary-light)}
.auth-terms-note{font-size:12px;color:var(--text-lighter);margin-top:8px}
/* 手机登录提示 */
.auth-phone-hint{margin-top:16px;padding:12px 16px;background:#fffbeb;border:1px solid #fde68a;border-radius:8px;text-align:center}
.auth-phone-hint p{font-size:13px;color:#7C4226;margin:0}
/* ============================================
认证页面 v3 卡片化布局（参照 yun.jp17.com 排版风格）
============================================ */
.auth-page-v3{background:#f4f7fb;min-height:calc(100vh - 95px);padding:36px 0 64px}
.auth-container{max-width:var(--max-width);margin:0 auto;padding:0 24px}
.auth-back{display:inline-flex;align-items:center;gap:6px;color:#64748b;font-size:14px;text-decoration:none;margin-bottom:20px;transition:color .2s}
.auth-back:hover{color:var(--primary-light)}
.auth-card-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:32px;align-items:stretch}
/* 左侧引导卡片 */
.auth-intro-card{background:linear-gradient(165deg,#123a6b 0%,#1a4d8f 45%,#8A6540 100%);border-radius:18px;overflow:hidden;box-shadow:0 12px 40px rgba(18,58,107,.25);display:flex;flex-direction:column;min-width:0}
.auth-intro-banner{width:100%;max-height:280px;overflow:hidden;background:rgba(255,255,255,.06)}
.auth-intro-banner img{width:100%;height:100%;max-height:280px;object-fit:cover;display:block}
.auth-intro-body{flex:1;padding:38px 36px 34px;display:flex;flex-direction:column;gap:24px}
.auth-intro-brand{display:flex;align-items:center;gap:14px}
.auth-intro-logo{position:relative;width:46px;height:46px;flex-shrink:0;display:flex;align-items:center;justify-content:center;background:rgba(255,255,255,.14);border-radius:12px;overflow:hidden}
.auth-intro-logo img{width:100%;height:100%;object-fit:contain}
.auth-logo-fallback{font-size:14px;font-weight:800;color:#fff;letter-spacing:1px}
.auth-intro-brand h2{font-size:19px;font-weight:700;color:#fff;margin-bottom:2px}
.auth-intro-brand p{font-size:12.5px;color:rgba(255,255,255,.6);line-height:1.4}
.auth-intro-title h1{font-size:24px;font-weight:800;color:#fff;margin-bottom:8px;line-height:1.3}
.auth-intro-title p{font-size:14px;color:rgba(255,255,255,.68);line-height:1.6}
/* 核心功能 2x2 网格 */
.auth-intro-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.auth-intro-cell{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.1);border-radius:12px;padding:16px 14px;display:flex;flex-direction:column;gap:6px;transition:background .2s}
.auth-intro-cell:hover{background:rgba(255,255,255,.14)}
.auth-intro-icon{font-size:20px;line-height:1}
.auth-intro-cell strong{font-size:13.5px;color:#fff;font-weight:600;line-height:1.4}
.auth-intro-cell span{font-size:12px;color:rgba(255,255,255,.58);line-height:1.5}
/* 为什么选择我们 */
.auth-intro-features h3{font-size:14px;font-weight:600;color:rgba(255,255,255,.85);margin-bottom:12px;letter-spacing:.5px}
.auth-intro-features ul{display:flex;flex-direction:column;gap:8px}
.auth-intro-features li{display:flex;align-items:flex-start;gap:8px;font-size:12.5px;color:rgba(255,255,255,.75);line-height:1.55}
.auth-intro-features li .check{color:#B85C38;font-weight:700;flex-shrink:0}
/* 好礼/数据 */
.auth-intro-gift{padding:16px;background:rgba(184,92,56,.12);border:1px solid rgba(184,92,56,.28);border-radius:14px}
.auth-intro-gift h3{font-size:14px;font-weight:600;color:#D4764E;margin-bottom:10px}
.auth-intro-gift ul{display:flex;flex-direction:column;gap:6px}
.auth-intro-gift li{font-size:12.5px;color:rgba(255,255,255,.78);line-height:1.5}
.auth-intro-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-top:4px}
.auth-intro-stat{text-align:center;padding:10px 4px;background:rgba(255,255,255,.09);border-radius:10px}
.auth-intro-stat strong{display:block;font-size:17px;font-weight:700;color:#D4764E;margin-bottom:2px}
.auth-intro-stat span{display:block;font-size:11px;color:rgba(255,255,255,.55)}
/* 右侧表单卡片 */
.auth-form-card{background:#fff;border-radius:18px;box-shadow:0 8px 32px rgba(15,40,80,.08);padding:46px 44px;display:flex;align-items:center;justify-content:center;min-width:0}
.auth-form-card .auth-form-wrap{width:100%;max-width:460px}
.auth-form-card .auth-form-header{margin-bottom:28px}
.auth-form-card .auth-form-header h2{font-size:26px;font-weight:700;color:#A67C52;margin-bottom:6px}
.auth-form-card .auth-form-header p{font-size:14px;color:#64748b}
/* ========== 响应式 ========== */
@media(max-width:960px){
.auth-card-grid{grid-template-columns:1fr;gap:24px}
.auth-page-v3{padding:28px 0 48px}
.auth-intro-body{padding:30px 26px 28px}
.auth-form-card{padding:34px 28px}
}
@media(max-width:640px){
.auth-container{padding:0 16px}
.auth-page-v3{padding:20px 0 40px}
.auth-intro-title h1{font-size:21px}
.auth-intro-grid{grid-template-columns:1fr}
.auth-intro-stats{grid-template-columns:repeat(2,1fr)}
.auth-form-card{padding:28px 20px}
}
/* ============================================
认证页面 v4 排版式样
参照 yun.jp17.com 的 UI 排版骨架（浅色底/限宽居中/顶部返回/左栏信息堆叠/右栏表单卡/字段纵向 label 上置）
视觉设计采用本站品牌语言（白卡 + 品牌蓝点缀），不照搬源站配色
============================================ */
.auth-v4{background:#f4f7fb;min-height:calc(100vh - 95px);padding:32px 0 64px}
.auth-v4-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:32px;align-items:stretch}
.auth-v4-aside,.auth-v4-side{display:flex;flex-direction:column;gap:24px;min-width:0}
.auth-v4-panel{background:#fff;border:1px solid #eef2f7;border-radius:14px;padding:24px;box-shadow:0 4px 16px rgba(166,124,82,.05)}
.auth-v4-panel h3{font-size:15px;font-weight:700;color:var(--primary);margin-bottom:14px;display:flex;align-items:center;gap:8px}
.auth-v4-panel h3::before{content:'';width:4px;height:16px;border-radius:2px;background:linear-gradient(180deg,var(--primary-light),var(--primary));flex-shrink:0}
/* 顶部 banner（后台 站点设置 可编辑图，无图时隐藏） */
.auth-v4-banner{border-radius:14px;overflow:hidden;border:1px solid #eef2f7;box-shadow:0 4px 16px rgba(166,124,82,.05)}
.auth-v4-banner img{width:100%;max-height:200px;object-fit:cover;display:block}
/* 品牌介绍卡 */
.auth-v4-brand{display:flex;gap:16px;align-items:center}
.auth-v4-logo{flex-shrink:0;display:flex;align-items:center;justify-content:flex-start;background:transparent}
.auth-v4-logo img{height:42px;width:auto;max-width:170px;object-fit:contain;display:block}
.auth-v4-logo-fallback{display:none;font-size:20px;font-weight:800;color:var(--primary);letter-spacing:1px}
.auth-v4-logo img[style*="display: none"] + .auth-v4-logo-fallback,
.auth-v4-logo img[style*="display:none"] + .auth-v4-logo-fallback{display:inline-block}
.auth-v4-brand h2{font-size:20px;font-weight:700;color:var(--primary);margin-bottom:4px}
.auth-v4-brand p{font-size:13px;color:var(--text-light);line-height:1.6}
/* 核心功能 2x2 */
.auth-v4-func-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.auth-v4-func-cell{display:flex;flex-direction:column;gap:6px;background:#f8fafc;border:1px solid #eef2f7;border-radius:12px;padding:16px 14px;transition:box-shadow .2s,transform .2s}
.auth-v4-func-cell:hover{box-shadow:0 4px 12px rgba(166,124,82,.08);transform:translateY(-1px)}
.auth-v4-func-icon{width:34px;height:34px;display:flex;align-items:center;justify-content:center;font-size:17px;background:rgba(138,101,64,.1);border-radius:9px;margin-bottom:2px}
.auth-v4-func-cell strong{font-size:13.5px;color:var(--primary);font-weight:600;line-height:1.4}
.auth-v4-func-cell span{font-size:12px;color:var(--text-light);line-height:1.5}
/* 为什么选择我们 */
.auth-v4-list{display:flex;flex-direction:column;gap:10px}
.auth-v4-list li{display:flex;align-items:flex-start;gap:9px;font-size:13px;color:var(--text);line-height:1.6}
.auth-v4-list .tick{width:18px;height:18px;border-radius:50%;background:rgba(22,163,74,.1);color:#16a34a;font-size:11px;font-weight:700;display:flex;align-items:center;justify-content:center;flex-shrink:0;margin-top:2px}
/* 好礼 / 统计横幅 */
.auth-v4-gift{border-radius:14px;padding:20px;background:linear-gradient(135deg,#fff8e6,#fef3cd);border:1px solid #fde68a}
.auth-v4-gift h3{font-size:15px;font-weight:700;color:#7C4226;margin-bottom:10px}
.auth-v4-gift ul{display:flex;flex-direction:column;gap:7px}
.auth-v4-gift li{font-size:13px;color:#78350f;line-height:1.5;display:flex;gap:8px;align-items:flex-start}
.auth-v4-gift li::before{content:'🎁';flex-shrink:0}
.auth-v4-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-top:6px}
.auth-v4-stat{text-align:center;padding:12px 4px;background:rgba(255,255,255,.7);border:1px solid #fde68a;border-radius:10px}
.auth-v4-stat strong{display:block;font-size:18px;font-weight:700;color:var(--primary-light);margin-bottom:2px}
.auth-v4-stat span{display:block;font-size:11.5px;color:#7C4226}
/* 右侧表单卡 */
.auth-v4-form-card{background:#fff;border:1px solid #eef2f7;border-radius:14px;box-shadow:0 4px 16px rgba(166,124,82,.05);padding:36px 34px}
.auth-v4-form-card .auth-form-header{text-align:left;margin-bottom:24px}
.auth-v4-form-card .auth-form-header h2{font-size:24px;font-weight:700;color:var(--primary);margin-bottom:6px}
.auth-v4-form-card .auth-form-header p{font-size:14px;color:var(--text-light)}
/* 提示卡 */
.auth-v4-tip{background:#fff;border:1px solid #eef2f7;border-radius:14px;padding:16px 20px;display:flex;gap:12px;align-items:flex-start;box-shadow:0 4px 16px rgba(166,124,82,.05)}
.auth-v4-tip .tip-icon{font-size:20px;flex-shrink:0}
.auth-v4-tip p{font-size:13px;color:var(--text-light);line-height:1.7;margin:0}
.auth-v4-tip p strong{color:var(--primary)}
/* 响应式 */
@media(max-width:960px){
.auth-v4{padding:24px 0 48px}
.auth-v4-grid{grid-template-columns:1fr;gap:24px}
.auth-v4-form-card{padding:30px 24px}
}
@media(max-width:640px){
.auth-v4{padding:16px 0 40px}
.auth-v4-func-grid{grid-template-columns:1fr 1fr;gap:8px}
.auth-v4-stats{grid-template-columns:repeat(2,1fr)}
.auth-v4-form-card{padding:24px 18px}
}
/* ======== Member Center ======== */
.member-center-layout{display:grid;grid-template-columns:260px 1fr;gap:24px}
.member-card{background:#fff;border-radius:12px;box-shadow:0 2px 12px rgba(0,0,0,.06);overflow:hidden}
.member-sidebar{display:flex;flex-direction:column;gap:16px}
.member-user-card{padding:24px;text-align:center}
.member-avatar{width:64px;height:64px;border-radius:50%;background:linear-gradient(135deg,#8A6540,#1d5288);color:#fff;font-size:26px;font-weight:700;display:flex;align-items:center;justify-content:center;margin:0 auto 10px}
.member-user-card h3{color:#A67C52;font-size:18px;margin-bottom:6px}
.member-level-badge{display:inline-block;padding:3px 14px;border-radius:12px;font-size:12px;font-weight:600}
.member-level-badge.level-free{background:#f1f5f9;color:#64748b}
.member-level-badge.level-silver{background:#e2e8f0;color:#475569}
.member-level-badge.level-gold{background:#fef3c7;color:#7C4226}
.member-level-badge.level-enterprise{background:#fef3c7;color:#7C4226}
.member-nav{padding:8px}
.member-nav-item{display:flex;align-items:center;gap:8px;padding:12px 16px;color:#475569;text-decoration:none;font-size:14px;border-radius:8px;border-left:3px solid transparent;transition:all .15s}
.member-nav-item:hover{background:#f8fafc;color:#A67C52}
.member-nav-item.active{background:#F6F1E5;color:#A67C52;font-weight:600;border-left-color:#8A6540}
.member-nav-item .nav-icon{width:20px;text-align:center}
.member-nav-item .nav-count{margin-left:auto;background:#f1f5f9;color:#64748b;font-size:11px;padding:1px 8px;border-radius:10px;font-weight:600}
.member-nav-item.active .nav-count{background:#F8F4EC;color:#1e40af}
.member-nav-group{margin-top:8px}
.member-nav-group-title{padding:8px 16px 4px;font-size:12px;color:#94a3b8;font-weight:600;letter-spacing:.5px}
.member-nav-logout{color:#ef4444;margin-top:8px}
.member-nav-logout:hover{background:#fef2f2;color:#ef4444}
.member-main{min-width:0}
.member-stats-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-bottom:24px}
.member-stat-card{background:#fff;padding:20px;border-radius:12px;box-shadow:0 2px 12px rgba(0,0,0,.06);text-align:center}
.member-stat-num{font-size:30px;font-weight:800}
.member-stat-label{font-size:13px;color:#64748b;margin-top:4px}
.member-section-title{color:#A67C52;font-size:17px;font-weight:700;margin-bottom:20px;padding-bottom:12px;border-bottom:2px solid #f1f5f9;display:flex;align-items:center;gap:8px}
.member-section-count{font-size:13px;color:#64748b;font-weight:400;background:#f1f5f9;padding:2px 10px;border-radius:10px}
.member-card{padding:24px;margin-bottom:24px}
.member-info-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;font-size:14px}
.member-info-item{display:flex;flex-direction:column;gap:2px}
.member-info-item .info-label{color:#94a3b8;font-size:12px}
.member-info-item .info-value{color:#1e293b;font-weight:500}
.member-upgrade-banner{background:linear-gradient(135deg,#fef3c7,#fde68a);padding:24px;border-radius:12px;margin-bottom:24px}
.member-upgrade-banner h3{color:#7C4226;margin-bottom:8px}
.member-upgrade-banner p{color:#a16207;font-size:14px;margin-bottom:16px}
/* Collection summary tiles */
.member-collection-summary{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.collection-tile{display:block;text-align:center;padding:20px 12px;border-radius:10px;text-decoration:none;transition:all .2s}
.collection-tile:hover{transform:translateY(-2px);box-shadow:0 4px 16px rgba(0,0,0,.1)}
.collection-tile-num{font-size:28px;font-weight:800}
.collection-tile-label{font-size:13px;margin-top:4px}
.tile-fav{background:linear-gradient(135deg,#fef3c7,#fde68a)}
.tile-fav .collection-tile-num{color:#7C4226}
.tile-fav .collection-tile-label{color:#a16207}
.tile-fol{background:linear-gradient(135deg,#F8F4EC,#bfdbfe)}
.tile-fol .collection-tile-num{color:#1e40af}
.tile-fol .collection-tile-label{color:#B99168}
/* Member list (articles/solutions) */
.member-list{display:flex;flex-direction:column;gap:0}
.member-list-item{display:flex;align-items:center;justify-content:space-between;padding:14px 0;border-bottom:1px solid #f1f5f9;gap:12px}
.member-list-item:last-child{border-bottom:none}
.member-list-title{color:#A67C52;text-decoration:none;font-size:14px;font-weight:500;flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.member-list-title:hover{color:#8A6540}
.member-list-meta{display:flex;align-items:center;gap:12px;flex-shrink:0;font-size:12px;color:#94a3b8}
.member-list-update{color:#B99168}
.btn-remove{background:none;border:1px solid #e2e8f0;color:#94a3b8;padding:3px 12px;border-radius:6px;font-size:12px;cursor:pointer;transition:all .15s}
.btn-remove:hover{border-color:#ef4444;color:#ef4444;background:#fef2f2}
/* Member product grid */
.member-product-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.member-product-card{background:#f8fafc;border-radius:10px;overflow:hidden;transition:all .2s}
.member-product-card:hover{box-shadow:0 4px 16px rgba(0,0,0,.1)}
.member-product-link{display:block;text-decoration:none}
.member-product-img{width:100%;height:140px;background:#f1f5f9;display:flex;align-items:center;justify-content:center;overflow:hidden}
.member-product-img img{width:100%;height:100%;object-fit:contain}
.member-product-info{padding:12px}
.member-product-info h4{font-size:13px;color:#A67C52;margin-bottom:4px;line-height:1.4;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.member-product-brand{font-size:12px;color:#64748b;display:block}
.member-product-model{font-size:11px;color:#94a3b8}
.member-product-footer{padding:8px 12px;display:flex;align-items:center;justify-content:space-between;border-top:1px solid #e2e8f0}
.member-product-cats{padding:0 12px 8px}
.member-product-time{font-size:11px;color:#94a3b8}
/* Empty state */
.member-empty{text-align:center;padding:60px 20px}
.member-empty-icon{font-size:48px;margin-bottom:16px}
.member-empty p{color:#94a3b8;font-size:15px;margin-bottom:20px}
/* ======== Detail page action bar (favorite/follow) ======== */
.detail-action-bar{display:flex;align-items:center;gap:12px;margin:24px 0;padding:16px 0;border-top:1px solid #f1f5f9;border-bottom:1px solid #f1f5f9}
.btn-action{display:inline-flex;align-items:center;gap:6px;padding:8px 20px;border-radius:8px;border:2px solid #e2e8f0;background:#fff;color:#64748b;font-size:14px;font-weight:500;cursor:pointer;transition:all .2s}
.btn-action:hover{border-color:#8A6540;color:#8A6540}
.btn-action.active{border-color:transparent}
.btn-favorite.active{background:#fef3c7;color:#7C4226}
.btn-follow.active{background:#F8F4EC;color:#1e40af}
.btn-action .action-icon{font-size:16px}
.btn-download{border-color:#d1d5db;color:#4b5563}
.btn-download:hover{border-color:#10b981;color:#10b981}
.action-status{font-size:13px;color:#10b981;opacity:0;transition:opacity .3s}
/* ======== Product detail action bar ======== */
.product-action-bar{display:flex;flex-direction:column;gap:12px;margin:20px 0 0;padding:16px;background:#f8fafc;border:1px solid #e2e8f0;border-radius:12px}
.action-row{display:flex;align-items:center;justify-content:space-between;gap:12px}
.action-row-secondary{justify-content:flex-start;flex-wrap:wrap}
.price-block{display:inline-flex;align-items:center}
.product-price{display:inline-flex;align-items:center}
.product-price .price-text{font-size:20px;font-weight:800;color:#dc2626;letter-spacing:-.5px}
.btn-consult{display:inline-flex;align-items:center;justify-content:center;height:40px;padding:0 28px;border-radius:8px;background:#8A6540;color:#fff;font-size:15px;font-weight:600;text-decoration:none;transition:all .2s;box-shadow:0 2px 6px rgba(138,101,64,.25)}
.btn-consult:hover{background:#1e568c;transform:translateY(-1px);box-shadow:0 4px 10px rgba(138,101,64,.35)}
.product-action-bar .btn-action{display:inline-flex;align-items:center;justify-content:center;height:36px;padding:0 14px;border-radius:8px;border:1px solid #d1d5db;background:#fff;color:#4b5563;font-size:13px;font-weight:500;cursor:pointer;transition:all .2s;gap:5px;white-space:nowrap}
.product-action-bar .btn-action:hover{border-color:#8A6540;color:#8A6540;background:#fff;transform:translateY(-1px)}
.product-action-bar .btn-action .action-icon{font-size:15px;line-height:1}
.product-action-bar .btn-action .action-count{margin-left:2px;color:#9ca3af;font-size:12px}
.product-action-bar .btn-like:hover{border-color:#dc2626;color:#dc2626;background:#fef2f2}
.product-action-bar .btn-favorite:hover{border-color:#B85C38;color:#b45309;background:#fffbeb}
.product-action-bar .btn-follow:hover{border-color:#B99168;color:#8A6540;background:#F6F1E5}
.product-action-bar .btn-share:hover{border-color:#B85C38;color:#b45309;background:#fffbeb}
.product-action-bar .btn-download:hover{border-color:#10b981;color:#047857;background:#ecfdf5}
.product-action-bar .btn-like.active{background:#fee2e2;border-color:#dc2626;color:#dc2626}
.product-action-bar .btn-favorite.active{background:#fef3c7;border-color:#B85C38;color:#7C4226}
.product-action-bar .btn-follow.active{background:#F8F4EC;border-color:#B99168;color:#1e40af}
@media(max-width:576px){
.product-action-bar{padding:12px}
.action-row{gap:10px}
.product-price .price-text{font-size:18px}
.btn-consult{height:38px;padding:0 20px;font-size:14px}
.product-action-bar .btn-action{height:34px;padding:0 10px;font-size:12px}
}
@media(max-width:400px){
.action-row-secondary{gap:8px}
.product-action-bar .btn-action{padding:0 8px}
.product-action-bar .action-text{display:none}
.btn-consult{padding:0 16px}
}
/* Member center responsive */
@media(max-width:768px){
.member-center-layout{grid-template-columns:1fr}
.member-stats-grid{grid-template-columns:1fr}
.member-info-grid{grid-template-columns:1fr}
.member-collection-summary{grid-template-columns:repeat(2,1fr)}
.member-product-grid{grid-template-columns:repeat(2,1fr)}
.detail-action-bar{flex-wrap:wrap}
/* 功能按钮移动端布局（自主题文件移植 2026-09-09：主题文件不再管辖任何功能按钮） */
.product-action-bar{flex-wrap:wrap;gap:8px}
.product-action-bar .btn{flex:1;min-width:120px}
.detail-action-bar,.engagement-bar{flex-wrap:wrap;gap:8px}
.detail-action-bar .btn,.engagement-bar .btn{flex:1;min-width:100px;justify-content:center}
}
@media(max-width:480px){
.member-product-grid{grid-template-columns:1fr}
.member-collection-summary{grid-template-columns:1fr}
}
/* ======== Engagement system (like/share/comment/points) ======== */
.engagement-section{margin:32px 0;padding:24px;background:#fff;border-radius:12px;box-shadow:0 1px 3px rgba(0,0,0,.04)}
.engagement-prompt{text-align:center;padding:4px 0 0;margin-bottom:12px;background:none;border:none}
.engagement-prompt p{margin:6px 0;color:#7C4226;font-size:15px;line-height:1.6}
.engagement-prompt .register-link{color:#16a34a;font-weight:700;text-decoration:underline}
.engagement-prompt em{font-style:italic;font-size:13px;color:#b45309}
.engagement-bar{display:flex;align-items:center;justify-content:center;gap:12px;flex-wrap:wrap;margin-bottom:16px}
.engagement-bar.compact{justify-content:flex-start}
.engagement-btn{display:inline-flex;align-items:center;gap:5px;padding:8px 16px;border-radius:8px;border:1.5px solid #e2e8f0;background:#fff;color:#475569;font-size:14px;font-weight:500;cursor:pointer;transition:all .2s;text-decoration:none}
.engagement-btn:hover{border-color:#8A6540;color:#8A6540;transform:translateY(-1px)}
.engagement-btn.active{border-color:transparent;color:#fff}
.btn-like.active{background:#fee2e2;color:#dc2626}
.btn-share.active,.btn-favorite.active{background:#fef3c7;color:#7C4226}
.btn-follow.active{background:#F8F4EC;color:#1e40af}
.btn-comment.active{background:#dcfce7;color:#15803d}
.engagement-icon{font-size:16px}
.engagement-count{margin-left:2px;font-size:12px;background:#f1f5f9;padding:2px 6px;border-radius:10px;color:#64748b}
.engagement-btn.active .engagement-count{background:rgba(255,255,255,.25);color:inherit}
.share-menu-wrap{position:relative}
.share-dropdown{display:none;position:absolute;top:100%;left:0;margin-top:6px;background:#fff;border:1px solid #e2e8f0;border-radius:8px;box-shadow:0 4px 12px rgba(0,0,0,.1);min-width:120px;z-index:50;overflow:hidden}
.share-dropdown a{display:block;padding:10px 14px;color:#475569;font-size:13px;text-decoration:none;transition:background .2s}
.share-dropdown a:hover{background:#f8fafc;color:#8A6540}
.share-dropdown.open{display:block}
.member-points-tip{font-size:13px;color:#64748b;margin-bottom:16px}
.member-points-tip a{color:#8A6540;text-decoration:none;font-weight:500}
.member-points-tip a:hover{text-decoration:underline}
/* #1045 互动条「我要询价」CTA（2026-09-09 用户裁决：去色块，改蓝色描边白底） */
.engagement-btn.btn-inquiry{background:#fff;border:1.5px solid #183884;color:#183884;font-weight:600;box-shadow:none}
.engagement-btn.btn-inquiry:hover{background:rgba(24,56,132,.06);color:#183884;border-color:#183884;transform:translateY(-1px);box-shadow:none}
/* Comments */
.comments-section{border-top:1px solid #f1f5f9;padding-top:24px}
.comments-title{font-size:17px;font-weight:700;color:#A67C52;margin-bottom:16px}
.comments-count{font-size:13px;color:#94a3b8;font-weight:400;margin-left:6px}
.comments-empty{text-align:center;padding:32px;color:#94a3b8;font-size:14px}
.comments-list{display:flex;flex-direction:column;gap:16px;margin-bottom:24px}
.comment-item{display:flex;gap:12px;align-items:flex-start}
.comment-avatar{width:40px;height:40px;border-radius:50%;background:linear-gradient(135deg,#8A6540,#A67C52);color:#fff;display:flex;align-items:center;justify-content:center;font-size:15px;font-weight:700;flex-shrink:0}
.comment-body{flex:1;background:#f8fafc;border-radius:10px;padding:12px 16px}
.comment-meta{display:flex;align-items:center;gap:10px;margin-bottom:6px;flex-wrap:wrap}
.comment-author{font-weight:600;color:#1e293b;font-size:14px}
.comment-level{font-size:11px;color:#7C4226;background:#fef3c7;padding:2px 8px;border-radius:10px}
.comment-date{font-size:12px;color:#94a3b8}
.comment-content{font-size:14px;color:#334155;line-height:1.6;word-break:break-word}
.comment-reply{margin-top:10px;padding:10px;background:#fff;border-radius:8px;border-left:3px solid #8A6540;font-size:13px;color:#475569}
.comment-form{background:#fff;border-radius:10px;padding:16px;border:1px solid #e2e8f0}
.comment-form h4{font-size:15px;color:#A67C52;margin-bottom:10px}
.comment-form textarea{width:100%;padding:12px;border:1px solid #e2e8f0;border-radius:8px;font-size:14px;resize:vertical;min-height:90px;outline:none}
.comment-form textarea:focus{border-color:#8A6540}
.comment-form-actions{display:flex;align-items:center;justify-content:space-between;margin-top:12px;flex-wrap:wrap;gap:10px}
.correction-check{display:flex;align-items:center;gap:6px;font-size:13px;color:#64748b;cursor:pointer}
.correction-check input{width:16px;height:16px}
.comment-form-status{font-size:13px;margin-top:8px;color:#16a34a;min-height:18px}
.comment-form-status.error{color:#dc2626}
/* Correction modal */
.correction-overlay{position:fixed;inset:0;background:rgba(0,0,0,.5);z-index:200;display:none;align-items:center;justify-content:center}
.correction-overlay.open{display:flex}
.correction-modal{background:#fff;border-radius:12px;padding:24px;width:90%;max-width:520px;max-height:80vh;overflow-y:auto}
.correction-modal h3{margin:0 0 12px;color:#A67C52;font-size:17px}
.correction-modal textarea{width:100%;padding:12px;border:1px solid #e2e8f0;border-radius:8px;font-size:14px;min-height:120px;resize:vertical}
.correction-modal .modal-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:16px}
/* Toast */
.engagement-toast{position:fixed;bottom:30px;left:50%;transform:translateX(-50%) translateY(100px);background:#A67C52;color:#fff;padding:12px 24px;border-radius:8px;font-size:14px;z-index:300;opacity:0;transition:all .3s;box-shadow:0 4px 12px rgba(0,0,0,.15)}
.engagement-toast.show{opacity:1;transform:translateX(-50%) translateY(0)}
/* ====== Share Poster Modal ====== */
.share-poster-overlay{position:fixed;inset:0;background:rgba(0,0,0,.6);z-index:3000;display:none;align-items:center;justify-content:center;overflow-y:auto;padding:20px 0}
.share-poster-overlay.open{display:flex}
.share-poster-modal{background:#fff;border-radius:16px;padding:20px;width:90%;max-width:400px;max-height:95vh;overflow-y:auto;position:relative;animation:posterSlideIn .3s ease}
@keyframes posterSlideIn{from{transform:translateY(30px);opacity:0}to{transform:translateY(0);opacity:1}}
.share-poster-close{position:absolute;top:8px;right:12px;font-size:28px;color:#94a3b8;cursor:pointer;z-index:5;line-height:1}
.share-poster-close:hover{color:#1e293b}
.share-poster-header{text-align:center;margin-bottom:12px}
.share-poster-header h3{margin:0 0 4px;font-size:18px;color:#A67C52}
.share-poster-header p{margin:0;font-size:12px;color:#64748b}
.share-poster-canvas-wrap{position:relative;text-align:center;margin-bottom:16px}
#shareCanvas{border-radius:12px;box-shadow:0 4px 20px rgba(0,0,0,.1);display:none;margin:0 auto}
.share-poster-loading{padding:60px 20px;text-align:center;color:#64748b;font-size:14px}
.share-poster-actions{display:flex;flex-wrap:wrap;gap:8px;justify-content:center}
.poster-btn{display:inline-flex;align-items:center;gap:4px;padding:10px 16px;border:1px solid #e2e8f0;border-radius:8px;background:#f8fafc;color:#1e293b;font-size:13px;cursor:pointer;text-decoration:none;transition:all .2s}
.poster-btn:hover{background:#f1f5f9;border-color:#cbd5e1}
.poster-btn-primary{background:#B85C38;color:#fff;border-color:#B85C38}
.poster-btn-primary:hover{background:#d97706}
.share-poster-points{text-align:center;margin-top:10px;padding:8px 12px;background:#fef3c7;color:#7C4226;border-radius:8px;font-size:13px}
.wechat-save-tip{margin-top:12px;padding:10px 14px;background:#fef3c7;color:#7C4226;border:1px solid #fde68a;border-radius:8px;font-size:13px;line-height:1.6;text-align:center}
#wechatPosterImg{margin:0 auto;display:block}
/* 产品多主图选择条（海报弹窗内，v10.51） */
.poster-img-picker{margin:0 auto 14px;max-width:350px;text-align:center}
.poster-img-picker-label{font-size:12px;color:#64748b;margin-bottom:8px}
.poster-img-picker-list{display:flex;flex-wrap:wrap;gap:8px;justify-content:center}
.poster-img-pick{width:52px;height:52px;object-fit:cover;border-radius:8px;border:2px solid #e2e8f0;cursor:pointer;transition:all .15s;background:#f8fafc}
.poster-img-pick:hover{border-color:#94a3b8}
.poster-img-pick.active{border-color:#A67C52;box-shadow:0 0 0 2px rgba(166,124,82,.15)}
/* ====== Member Shares Page ====== */
.invite-code-card{display:flex;gap:20px;background:linear-gradient(135deg,#A67C52 0%,#8A6540 100%);color:#fff;border-radius:16px;padding:24px;margin-bottom:24px;flex-wrap:wrap}
.invite-code-left{flex:0 0 200px}
.invite-code-label{font-size:14px;opacity:.8;margin-bottom:8px}
.invite-code-value{font-size:36px;font-weight:700;font-family:monospace;letter-spacing:2px;margin-bottom:12px;color:#B85C38}
.invite-copy-btn{background:rgba(255,255,255,.2);border:1px solid rgba(255,255,255,.3);color:#fff;padding:8px 16px;border-radius:8px;cursor:pointer;font-size:13px;transition:all .2s}
.invite-copy-btn:hover{background:rgba(255,255,255,.3)}
.invite-code-right{flex:1;min-width:250px}
.invite-code-tip{font-size:14px;line-height:1.8}
.invite-code-tip strong{color:#B85C38}
.invite-code-tip ul{margin:8px 0 0;padding-left:20px}
.invite-code-tip li{margin-bottom:4px;opacity:.9}
.share-stats-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-bottom:24px}
.share-stat-card{background:#fff;border-radius:12px;padding:20px;text-align:center;box-shadow:0 1px 3px rgba(0,0,0,.08)}
.share-stat-card .stat-icon{font-size:28px;margin-bottom:8px}
.share-stat-card .stat-num{font-size:28px;font-weight:700;color:#A67C52}
.share-stat-card .stat-label{font-size:13px;color:#64748b;margin-top:4px}
@media(max-width:640px){.share-stats-grid{grid-template-columns:repeat(2,1fr)}}
.share-section{background:#fff;border-radius:12px;padding:20px;margin-bottom:24px}
.share-section-title{font-size:18px;color:#A67C52;margin:0 0 16px;display:flex;align-items:center;gap:8px}
.section-count{background:#B85C38;color:#fff;font-size:13px;padding:2px 10px;border-radius:20px}
.share-records-table{overflow-x:auto}
.share-records-table table{width:100%;border-collapse:collapse;font-size:14px}
.share-records-table th{padding:10px 8px;text-align:left;color:#64748b;font-weight:600;border-bottom:2px solid #e2e8f0;white-space:nowrap}
.share-records-table td{padding:10px 8px;border-bottom:1px solid #f1f5f9;vertical-align:middle}
.share-records-table tr:hover{background:#f8fafc}
.share-content-cell a{color:#A67C52;text-decoration:none;max-width:300px;display:inline-block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.share-content-cell a:hover{color:#8A6540}
.share-date{color:#94a3b8;font-size:13px;white-space:nowrap}
.content-type-badge{display:inline-block;padding:2px 8px;border-radius:4px;font-size:11px;font-weight:600;text-transform:uppercase}
.content-type-badge.type-article{background:#F8F4EC;color:#1e40af}
.content-type-badge.type-product{background:#dcfce7;color:#166534}
.content-type-badge.type-solution{background:#fef3c7;color:#7C4226}
.content-type-badge.type-industry{background:#f3e8ff;color:#6b21a8}
.text-success{color:#16a34a}
.reshare-btn{background:#f1f5f9;border:1px solid #e2e8f0;padding:4px 12px;border-radius:6px;font-size:12px;cursor:pointer;color:#475569}
.reshare-btn:hover{background:#e2e8f0}
.referrals-list{display:flex;flex-direction:column;gap:12px}
.referral-card{display:flex;gap:14px;align-items:flex-start;padding:14px;border-radius:10px;background:#f8fafc;border:1px solid #e2e8f0}
.referral-card.registered{border-left:3px solid #16a34a}
.referral-card.pending{border-left:3px solid #B85C38}
.referral-avatar{width:42px;height:42px;border-radius:50%;background:linear-gradient(135deg,#B85C38,#d97706);color:#fff;display:flex;align-items:center;justify-content:center;font-size:18px;font-weight:600;flex-shrink:0}
.referral-info{flex:1}
.referral-name{font-size:14px;font-weight:600;color:#1e293b;display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.referral-status{font-size:11px;padding:2px 8px;border-radius:12px}
.referral-status.registered{background:#dcfce7;color:#16a34a}
.referral-status.pending{background:#fef3c7;color:#7C4226}
.referral-level{background:#F8F4EC;color:#1e40af;font-size:11px;padding:2px 8px;border-radius:12px}
.referral-meta{font-size:12px;color:#94a3b8;margin-top:4px}
.referral-engagement{display:flex;gap:12px;margin-top:6px;font-size:12px;color:#64748b}
.referral-engagement span{display:inline-flex;align-items:center;gap:2px}
/* 已注册好友的会员信息卡片 */
.referral-info-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:10px;background:#fff;border:1px solid #e2e8f0;border-radius:8px;padding:10px 12px}
.referral-info-item{display:flex;flex-direction:column;gap:2px;min-width:0}
.referral-info-item span{font-size:11px;color:#94a3b8}
.referral-info-item em{font-style:normal;font-size:13px;font-weight:600;color:#1e293b;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
@media(max-width:520px){.referral-info-grid{grid-template-columns:1fr 1fr}.referral-info-item:last-child{grid-column:span 2}}
.share-empty{text-align:center;padding:40px 20px;color:#64748b;font-size:14px;line-height:2}
.share-empty a{color:#8A6540;text-decoration:none}
/* Registration referral bonus */
.auth-referral-bonus{background:#dcfce7;border:1px solid #86efac;border-radius:10px;padding:16px;margin:16px 0;text-align:center}
.auth-referral-bonus p{margin:0 0 4px;font-size:15px;color:#166534}
.auth-referral-bonus strong{color:#16a34a;font-size:18px}
/* ============================================
行业分类页 — 6阶段方案卡片样式
============================================ */
/* 主内容区与侧边栏两栏布局 */
.industry-layout{display:flex;gap:20px;align-items:flex-start}
.industry-main{flex:1;min-width:0}
.industry-sidebar{width:260px;flex-shrink:0;position:sticky;top:88px;display:flex;flex-direction:column;gap:16px;max-height:calc(100vh - 110px);overflow-y:auto}
.industry-sidebar .sidebar-card{background:var(--bg-white);border:1px solid var(--border-light);border-radius:var(--radius);box-shadow:var(--shadow);overflow:hidden}
.industry-sidebar .sidebar-card-header{display:flex;align-items:center;gap:10px;padding:16px 18px;border-bottom:1px solid var(--border-light);background:var(--bg-light)}
.industry-sidebar .sidebar-card-header h4{font-size:15px;font-weight:700;color:var(--text);margin:0}
.industry-sidebar .sidebar-card-icon{font-size:18px;line-height:1}
.industry-sidebar .sidebar-products{padding:12px}
.industry-sidebar .sidebar-product-item{display:flex;align-items:center;gap:10px;padding:10px 0;border-bottom:1px dashed var(--border-light);text-decoration:none;color:var(--text);font-size:13px;transition:all .15s ease}
.industry-sidebar .sidebar-product-item:last-child{border-bottom:none}
.industry-sidebar .sidebar-product-item:hover{color:var(--primary);padding-left:4px}
.industry-sidebar .sidebar-product-img{width:44px;height:44px;border-radius:var(--radius-sm);overflow:hidden;background:var(--bg);flex-shrink:0}
.industry-sidebar .sidebar-product-img img{width:100%;height:100%;object-fit:cover}
.industry-sidebar .sidebar-product-name{flex:1;min-width:0;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;line-height:1.5}
.industry-sidebar .sidebar-list{list-style:none;margin:0;padding:12px}
.industry-sidebar .sidebar-list li a{display:flex;align-items:flex-start;gap:8px;padding:9px 0;font-size:13px;color:var(--text-secondary);text-decoration:none;transition:all .15s ease;border-bottom:1px dashed var(--border-light)}
.industry-sidebar .sidebar-list li:last-child a{border-bottom:none}
.industry-sidebar .sidebar-list li a:hover{color:var(--primary);padding-left:4px}
.industry-sidebar .sidebar-list-dot{width:5px;height:5px;border-radius:50%;background:var(--primary-light);flex-shrink:0;margin-top:8px;opacity:.6}
.industry-sidebar .sidebar-more{display:block;padding:12px 18px;text-align:center;font-size:13px;font-weight:600;color:var(--primary);text-decoration:none;border-top:1px solid var(--border-light);background:var(--bg-light);transition:all .15s ease}
.industry-sidebar .sidebar-more:hover{background:var(--primary-light);color:#fff}
.industry-sidebar .sidebar-back{display:block;width:100%;text-align:center}
.stage-cards-wrapper{display:flex;flex-direction:column;gap:24px;margin-bottom:32px}
.stage-card{background:var(--stage-bg,var(--bg-white));border:1.5px solid var(--stage-border,var(--border-light));border-left:4px solid var(--stage-color,var(--primary));border-radius:var(--radius);box-shadow:var(--shadow);overflow:hidden;transition:all .2s ease}
.stage-card:hover{border-color:var(--stage-color,var(--primary));box-shadow:0 8px 24px rgba(0,0,0,.08);transform:translateY(-2px)}
.stage-card[id]{scroll-margin-top:130px}
.stage-card-header{display:flex;align-items:center;gap:14px;padding:20px 24px 16px;border-bottom:1px solid var(--stage-border,var(--border-light));background:linear-gradient(90deg,rgba(255,255,255,.95),rgba(255,255,255,.7))}
.stage-card-header h2{font-size:20px;font-weight:700;color:var(--text);margin:0}
.stage-num{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:10px;background:var(--stage-color,var(--primary));color:#fff;font-size:16px;font-weight:700;flex-shrink:0}
.stage-card h3{font-size:16px;font-weight:600;color:var(--text);margin:20px 24px 12px;padding-left:12px;border-left:3px solid var(--stage-color,var(--primary))}
.stage-card ul{margin:0 24px 16px;padding-left:24px}
.stage-card ul li{margin-bottom:8px;line-height:1.7;color:var(--text-secondary,#475569)}
.stage-card ul li::marker{color:var(--stage-color,var(--primary))}
.stage-card > *:not(.stage-card-header){padding-left:24px;padding-right:24px}
.stage-card > *:last-child{padding-bottom:20px}
.stage-extra{margin:16px 24px 24px;padding:16px;background:var(--bg-light);border-radius:var(--radius-sm);border:1px dashed var(--border)}
.stage-extra-label{font-size:14px;font-weight:600;color:var(--text);margin-bottom:8px}
.stage-extra-input{width:100%;padding:10px 12px;border:1px solid var(--border);border-radius:var(--radius-sm);font-size:14px;box-sizing:border-box}
@media(max-width:768px){
.stage-card-header{padding:16px 16px 12px}
.stage-card-header h2{font-size:17px}
.stage-num{width:34px;height:34px;font-size:14px}
.stage-card h3{margin:16px 16px 10px}
.stage-card ul{margin:0 16px 12px}
.stage-card > *:not(.stage-card-header){padding-left:16px;padding-right:16px}
.stage-extra{margin:12px 16px 20px}
}
/* ============================================
行业应用场景页 — 填报入口横幅 / CTA
============================================ */
/* 填报入口横幅：适用场景页 → 行业配套填报页 */
.report-entry-banner{display:flex;align-items:center;gap:18px;margin:20px auto 8px;padding:18px 24px;max-width:var(--max-width);background:linear-gradient(135deg,#eef4fb 0%,#e3edf8 100%);border:1px solid #c9dcef;border-left:5px solid #8A6540;border-radius:var(--radius);box-shadow:var(--shadow-sm)}
.report-entry-icon{font-size:34px;flex-shrink:0}
.report-entry-text{flex:1;min-width:0}
.report-entry-text strong{display:block;font-size:16px;color:#A67C52;margin-bottom:4px}
.report-entry-text span{display:block;font-size:13px;color:#475569;line-height:1.6}
.btn-report-entry{flex-shrink:0;white-space:nowrap}
@media(max-width:768px){
.report-entry-banner{flex-wrap:wrap;padding:14px 16px;gap:10px}
.report-entry-icon{font-size:28px}
.report-entry-text{flex:1 1 100%}
.btn-report-entry{width:100%;text-align:center}
}
/* 页内 CTA（适用场景页 / 填报页通用） */
.btn-lg{padding:13px 32px;font-size:15px;border-radius:10px}
.solution-cta{position:relative;background:linear-gradient(135deg,#A67C52 0%,#3E342E 100%);border-radius:var(--radius);overflow:hidden;margin:36px 0}
.solution-cta-bg{position:absolute;inset:0;background:radial-gradient(circle at 80% 30%,rgba(184,92,56,.12) 0%,transparent 60%),radial-gradient(circle at 20% 70%,rgba(138,101,64,.15) 0%,transparent 50%);z-index:0}
.solution-cta-content{position:relative;z-index:1;padding:40px 36px;text-align:center;color:#fff}
.solution-cta-icon{font-size:40px;margin-bottom:12px}
.solution-cta-content h3{font-size:22px;font-weight:700;margin-bottom:10px}
.solution-cta-content p{font-size:14px;opacity:.8;max-width:520px;margin:0 auto 24px;line-height:1.7}
.solution-cta-btns{display:flex;gap:14px;justify-content:center;flex-wrap:wrap}
.solution-cta .btn-outline{border-color:rgba(255,255,255,.4);color:#fff}
.solution-cta .btn-outline:hover{border-color:#fff;background:rgba(255,255,255,.1)}
@media(max-width:768px){
.solution-cta-content{padding:28px 18px}
.solution-cta-btns{gap:10px;flex-direction:column}
.solution-cta-btns .btn{width:100%}
}
/* ============================================
行业分类页 — 快速导航 / 报告单横幅 / 时间线 / 报告单表单
============================================ */
/* 粘性阶段快速导航 */
.stage-sticky-nav {
position: sticky;
top: 96px;
z-index: 99;
background: var(--bg-white);
border-bottom: 1px solid var(--border-light);
box-shadow: 0 4px 12px rgba(0,0,0,.06);
padding: 12px 0;
}
.stage-sticky-nav .container {
display: flex;
align-items: center;
gap: 12px;
flex-wrap: wrap;
}
.stage-nav-label {
font-size: 13px;
color: var(--text-secondary);
font-weight: 500;
margin-right: 8px;
white-space: nowrap;
}
.stage-nav-item {
display: inline-flex;
align-items: center;
gap: 6px;
padding: 8px 14px;
border-radius: 999px;
background: var(--bg-light, #f8fafc);
border: 1px solid var(--border-light);
color: var(--text);
font-size: 14px;
font-weight: 500;
text-decoration: none;
transition: all .2s ease;
white-space: nowrap;
}
.stage-nav-item:hover {
background: var(--primary-light);
border-color: var(--primary-light);
color: #fff;
}
.stage-nav-item.active {
background: var(--primary);
border-color: var(--primary);
color: #fff;
}
.stage-nav-icon {
font-size: 15px;
line-height: 1;
}
.stage-nav-progress {
position: absolute;
bottom: 0;
left: 0;
width: 100%;
height: 3px;
background: var(--border-light);
}
.stage-nav-progress-bar {
height: 100%;
width: 0%;
background: linear-gradient(90deg, #A67C52, #8A6540, #0e7490, #15803d, #a855f7, #dc2626);
transition: width .2s ease;
}
/* 报告单入口横幅 */
.report-banner {
display: flex;
align-items: center;
gap: 16px;
background: linear-gradient(135deg, #fff7ed, #ffedd5);
border: 1px solid #fed7aa;
border-radius: var(--radius);
padding: 18px 24px;
margin-bottom: 24px;
}
.report-banner-icon {
font-size: 32px;
line-height: 1;
}
.report-banner-text {
flex: 1;
display: flex;
flex-direction: column;
gap: 4px;
}
.report-banner-text strong {
font-size: 16px;
color: var(--text);
}
.report-banner-text span {
font-size: 13px;
color: var(--text-secondary);
}
.report-banner-btn {
flex-shrink: 0;
}
/* 应用场景推荐引导横幅 */
.scenario-guide-banner {
display: flex;
align-items: center;
gap: 16px;
background: linear-gradient(135deg, #eef2ff, #e0e7ff);
border: 1px solid #c7d2fe;
border-radius: var(--radius);
padding: 16px 24px;
margin-bottom: 24px;
}
.scenario-guide-icon {
font-size: 28px;
line-height: 1;
flex-shrink: 0;
}
.scenario-guide-text {
flex: 1;
display: flex;
flex-direction: column;
gap: 4px;
}
.scenario-guide-text strong {
font-size: 15px;
color: var(--text);
}
.scenario-guide-text span {
font-size: 13px;
color: var(--text-secondary);
}
.scenario-guide-btn {
flex-shrink: 0;
white-space: nowrap;
border-color: #818cf8;
color: #4f46e5;
}
.scenario-guide-btn:hover {
background: #4f46e5;
color: #fff;
border-color: #4f46e5;
}
.no-solution-actions {
display: flex;
gap: 12px;
justify-content: center;
flex-wrap: wrap;
margin-top: 8px;
}
/* 6阶段流程时间线 */
.stage-timeline {
background: var(--bg-white);
border: 1px solid var(--border-light);
border-radius: var(--radius);
padding: 32px 24px;
margin-bottom: 32px;
box-shadow: var(--shadow);
}
.stage-timeline-title {
text-align: center;
font-size: 20px;
color: var(--text);
margin-bottom: 8px;
}
.stage-timeline-sub {
text-align: center;
font-size: 14px;
color: var(--text-secondary);
margin-bottom: 28px;
}
.timeline-track {
display: flex;
align-items: center;
justify-content: space-between;
position: relative;
}
.timeline-node {
display: flex;
flex-direction: column;
align-items: center;
gap: 10px;
position: relative;
z-index: 2;
flex: 1;
}
.timeline-dot {
width: 44px;
height: 44px;
border-radius: 50%;
display: inline-flex;
align-items: center;
justify-content: center;
color: #fff;
text-decoration: none;
box-shadow: 0 4px 12px rgba(0,0,0,.15);
transition: transform .2s ease;
position: relative;
z-index: 3;
}
.timeline-dot:hover {
transform: scale(1.1);
color: #fff;
}
.timeline-num {
font-size: 16px;
font-weight: 700;
}
.timeline-label {
text-align: center;
color: inherit;
text-decoration: none;
display: block;
}
.timeline-label:hover {
color: inherit;
}
.timeline-label strong {
display: block;
font-size: 14px;
color: var(--text);
margin-bottom: 2px;
}
.timeline-label small {
display: block;
font-size: 11px;
color: var(--text-secondary);
line-height: 1.3;
}
.timeline-connector {
position: absolute;
top: 22px;
left: calc(50% + 24px);
width: calc(100% - 48px);
height: 3px;
transform: translateX(0);
z-index: 1;
}
/* ============================================ */
/* 行业应用场景详情页 — 文本内容 + 按产品分类聚合设备 */
/* ============================================ */
/* 文本内容卡片（行业观察/概述/理解） */
.industry-content-section {
display: flex;
flex-direction: column;
gap: 24px;
margin-bottom: 36px;
}
.industry-text-card {
background: #fff;
border: 1px solid var(--border-light, #e2e8f0);
border-radius: 14px;
overflow: hidden;
box-shadow: 0 2px 8px rgba(0,0,0,.04);
transition: box-shadow .2s ease;
}
.industry-text-card:hover {
box-shadow: 0 6px 20px rgba(0,0,0,.06);
}
.industry-text-card-header {
display: flex;
align-items: center;
gap: 10px;
padding: 18px 24px 14px;
border-bottom: 1px solid #f0f4f8;
}
.industry-text-icon {
font-size: 24px;
line-height: 1;
}
.industry-text-card-header h2 {
font-size: 18px;
font-weight: 700;
margin: 0;
}
.industry-text-insight .industry-text-card-header { border-left: 4px solid #B99168; }
.industry-text-overview .industry-text-card-header { border-left: 4px solid #10b981; }
.industry-text-understanding .industry-text-card-header { border-left: 4px solid #B85C38; }
.industry-text-insight .industry-text-card-header h2 { color: #1e40af; }
.industry-text-overview .industry-text-card-header h2 { color: #047857; }
.industry-text-understanding .industry-text-card-header h2 { color: #b45309; }
.industry-text-body {
padding: 20px 24px;
font-size: 15px;
line-height: 1.8;
color: #374151;
}
.industry-text-body h2,
.industry-text-body h3,
.industry-text-body h4 {
font-weight: 600;
margin: 16px 0 10px;
color: #1e293b;
}
.industry-text-body h2 { font-size: 17px; }
.industry-text-body h3 { font-size: 16px; }
.industry-text-body p { margin-bottom: 12px; }
.industry-text-body ul,
.industry-text-body ol {
margin: 8px 0 14px;
padding-left: 24px;
}
.industry-text-body li { margin-bottom: 6px; line-height: 1.7; }
.industry-text-body img {
max-width: 100%;
height: auto;
border-radius: 8px;
margin: 12px 0;
}
.industry-text-body table {
width: 100%;
border-collapse: collapse;
margin: 12px 0;
}
.industry-text-body table td,
.industry-text-body table th {
border: 1px solid #e2e8f0;
padding: 8px 12px;
font-size: 14px;
}
/* 仪器设备展示区 */
.industry-equipment-section {
margin-bottom: 36px;
}
.industry-equipment-header {
margin-bottom: 24px;
padding-bottom: 16px;
border-bottom: 2px solid #e2e8f0;
}
.industry-equipment-header h2 {
font-size: 22px;
font-weight: 700;
color: #0f172a;
margin-bottom: 6px;
}
.industry-equipment-header p {
font-size: 14px;
color: #64748b;
}
/* 一级分类块 */
.equip-cat1-block {
background: #fff;
border: 1px solid var(--border-light, #e2e8f0);
border-radius: 14px;
padding: 24px;
margin-bottom: 20px;
box-shadow: 0 2px 8px rgba(0,0,0,.04);
}
.equip-cat1-header {
display: flex;
align-items: center;
justify-content: space-between;
margin-bottom: 20px;
padding-bottom: 12px;
border-bottom: 2px solid #f1f5f9;
}
.equip-cat1-header h3 {
font-size: 18px;
font-weight: 700;
color: #1e40af;
margin: 0;
padding-left: 12px;
border-left: 4px solid #B99168;
}
.equip-cat1-count {
font-size: 13px;
color: #64748b;
background: #f1f5f9;
padding: 4px 12px;
border-radius: 20px;
font-weight: 500;
}
/* 二级分类头 */
.equip-cat2-header {
display: flex;
align-items: center;
gap: 8px;
margin: 18px 0 12px;
}
.equip-cat2-bar {
width: 3px;
height: 16px;
background: #DCC9A9;
border-radius: 2px;
}
.equip-cat2-header h4 {
font-size: 15px;
font-weight: 600;
color: #334155;
margin: 0;
}
.equip-cat2-count {
font-size: 12px;
color: #94a3b8;
}
/* 产品网格 */
.equip-product-grid {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
gap: 16px;
}
.equip-product-card {
display: flex;
flex-direction: column;
background: #fff;
border: 1px solid #e2e8f0;
border-radius: 10px;
overflow: hidden;
text-decoration: none;
transition: all .2s ease;
}
.equip-product-card:hover {
border-color: #B99168;
box-shadow: 0 4px 16px rgba(59,130,246,.12);
transform: translateY(-3px);
}
.equip-product-card-wrap {
display: flex;
flex-direction: column;
background: #fff;
border: 1px solid #e2e8f0;
border-radius: 10px;
overflow: hidden;
transition: all .2s ease;
}
.equip-product-card-wrap:hover {
border-color: #B99168;
box-shadow: 0 4px 16px rgba(59,130,246,.12);
}
.equip-product-card-wrap .equip-product-card {
border: none;
border-radius: 0;
flex: 1;
}
.equip-product-card-wrap .equip-product-card:hover {
transform: none;
}
.equip-product-cats { padding: 0 12px 10px; }
.equip-product-img {
width: 100%;
height: 140px;
overflow: hidden;
background: #f8fafc;
display: flex;
align-items: center;
justify-content: center;
}
.equip-product-img img {
width: 100%;
height: 100%;
object-fit: contain;
padding: 8px;
}
.equip-product-info {
padding: 10px 12px 12px;
}
.equip-product-info h5 {
font-size: 13px;
font-weight: 600;
color: #1e293b;
margin: 0 0 4px;
line-height: 1.4;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
overflow: hidden;
}
.equip-product-brand {
display: inline-block;
font-size: 11px;
color: #64748b;
margin-right: 6px;
}
.equip-product-model {
display: inline-block;
font-size: 11px;
color: #94a3b8;
}
/* 移动端适配 */
@media (max-width: 768px) {
.industry-content-section { gap: 16px; }
.industry-text-card-header { padding: 14px 16px 10px; }
.industry-text-card-header h2 { font-size: 16px; }
.industry-text-body { padding: 14px 16px; font-size: 14px; }
.equip-cat1-block { padding: 16px; }
.equip-cat1-header h3 { font-size: 16px; }
.equip-product-grid {
grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
gap: 12px;
}
.equip-product-img { height: 110px; }
.equip-product-info h5 { font-size: 12px; }
}
/* 配套报告单填写区 */
.report-panel {
background: var(--bg-white);
border: 1px solid var(--border-light);
border-radius: var(--radius);
padding: 28px;
margin-bottom: 32px;
box-shadow: var(--shadow);
}
.report-panel-head {
display: flex;
align-items: center;
gap: 14px;
margin-bottom: 24px;
padding-bottom: 20px;
border-bottom: 1px solid var(--border-light);
}
.report-panel-icon {
font-size: 36px;
line-height: 1;
}
.report-panel-head h3 {
margin: 0 0 4px;
font-size: 18px;
color: var(--text);
}
.report-panel-head p {
margin: 0;
font-size: 13px;
color: var(--text-secondary);
}
.report-field-row {
margin-bottom: 24px;
}
.report-field-label {
font-size: 15px;
font-weight: 600;
color: var(--text);
margin-bottom: 12px;
}
.report-field-label em {
color: #dc2626;
margin-left: 2px;
font-style: normal;
}
.report-radio-group {
display: flex;
flex-wrap: wrap;
gap: 10px;
}
.rpt-radio {
display: inline-flex;
align-items: center;
gap: 6px;
padding: 8px 14px;
background: var(--bg-light);
border: 1px solid var(--border-light);
border-radius: 999px;
font-size: 14px;
color: var(--text);
cursor: pointer;
transition: all .2s ease;
}
.rpt-radio:hover {
border-color: var(--primary-light);
}
.rpt-radio input {
margin: 0;
}
.report-stats {
background: var(--bg-light);
border: 1px dashed var(--border);
border-radius: var(--radius-sm);
padding: 14px;
font-size: 14px;
color: var(--text-secondary);
margin-bottom: 24px;
}
.report-fields {
display: grid;
grid-template-columns: repeat(2, 1fr);
gap: 16px;
}
.report-field {
display: flex;
flex-direction: column;
gap: 6px;
}
.report-field label {
font-size: 13px;
color: var(--text-secondary);
}
.report-field label em {
color: #dc2626;
font-style: normal;
margin-left: 2px;
}
.report-field input,
.report-field textarea {
padding: 10px 12px;
border: 1px solid var(--border);
border-radius: var(--radius-sm);
font-size: 14px;
font-family: inherit;
box-sizing: border-box;
}
.report-field textarea {
resize: vertical;
min-height: 80px;
}
.report-field-wide {
grid-column: 1 / -1;
}
.report-attach {
margin-top: 16px;
padding: 16px;
background: var(--bg-light);
border: 1px dashed var(--border);
border-radius: var(--radius-sm);
}
.report-attach > label {
display: block;
font-size: 13px;
color: var(--text-secondary);
margin-bottom: 10px;
}
.report-attach-row {
display: flex;
align-items: center;
gap: 12px;
flex-wrap: wrap;
}
.report-attach-row input[type="file"] {
font-size: 14px;
max-width: 260px;
}
.report-attach-list {
margin-top: 12px;
display: flex;
flex-direction: column;
gap: 8px;
}
.report-attach-item {
display: flex;
align-items: center;
justify-content: space-between;
gap: 10px;
padding: 8px 12px;
background: #fff;
border: 1px solid var(--border);
border-radius: var(--radius-sm);
font-size: 13px;
word-break: break-all;
}
.report-attach-item a {
color: var(--primary-light);
text-decoration: none;
}
.report-attach-item a:hover {
text-decoration: underline;
}
.report-attach-item .del {
color: #dc2626;
cursor: pointer;
font-size: 12px;
white-space: nowrap;
}
.report-attach-item .del:hover {
text-decoration: underline;
}
.report-actions {
display: flex;
justify-content: flex-end;
gap: 12px;
margin-top: 24px;
}
.report-note {
margin-top: 16px;
padding: 12px 16px;
background: #f0f9ff;
border: 1px solid #bae6fd;
border-radius: var(--radius-sm);
font-size: 13px;
color: #0369a1;
}
/* 响应式 */
@media(max-width:768px) {
.industry-layout {
flex-direction: column;
gap: 16px;
}
.industry-sidebar {
width: 100%;
position: static;
max-height: none;
order: -1;
}
.stage-sticky-nav {
top: 86px;
padding: 10px 0;
}
.stage-sticky-nav .container {
gap: 8px;
}
.stage-nav-label {
display: none;
}
.stage-nav-item {
padding: 6px 10px;
font-size: 13px;
}
.report-banner {
flex-direction: column;
align-items: flex-start;
gap: 12px;
padding: 16px;
}
.report-banner-btn {
width: 100%;
text-align: center;
}
.scenario-guide-banner {
flex-direction: column;
align-items: flex-start;
gap: 10px;
padding: 14px 16px;
}
.scenario-guide-btn {
width: 100%;
text-align: center;
}
.no-solution-actions .btn {
width: 100%;
}
.stage-timeline {
padding: 24px 16px;
overflow-x: auto;
}
.timeline-track {
min-width: 700px;
padding-bottom: 10px;
}
.timeline-label strong {
font-size: 12px;
}
.timeline-label small {
display: none;
}
.report-panel {
padding: 20px 16px;
}
.report-fields {
grid-template-columns: 1fr;
}
.report-actions {
flex-direction: column;
}
.report-actions .btn {
width: 100%;
text-align: center;
}
}
/* ============================================
行业分类页 — 阶段设备勾选选项
============================================ */
.eq-row {
display: flex;
align-items: flex-start;
justify-content: space-between;
gap: 16px;
}
.eq-text {
flex: 1;
min-width: 0;
line-height: 1.6;
color: var(--text-secondary);
}
.eq-opts {
display: inline-flex;
flex-wrap: nowrap;
align-items: center;
gap: 8px;
flex-shrink: 0;
}
.eq-opt {
display: inline-flex;
align-items: center;
gap: 5px;
padding: 5px 11px;
border-radius: 999px;
border: 1.5px solid var(--border-light);
background: var(--bg-white);
font-size: 13px;
color: var(--text);
cursor: pointer;
transition: all .15s ease;
white-space: nowrap;
user-select: none;
}
.eq-opt input[type="radio"],
.eq-opt input[type="checkbox"] {
width: 14px;
height: 14px;
margin: 0;
flex-shrink: 0;
}
.eq-opt:hover {
border-color: var(--primary-light);
color: var(--primary);
}
.eq-opt.active-have { border-color: #8A6540; color: #8A6540; background: #F6F1E5; }
.eq-opt.active-need { border-color: #ea580c; color: #ea580c; background: #fff7ed; }
.eq-opt.active-noneed { border-color: #64748b; color: #64748b; background: #f1f5f9; }
.eq-opt.active-other { border-color: #7c3aed; color: #7c3aed; background: #f5f3ff; }
.eq-other-note {
width: 100%;
margin-top: 8px;
padding: 8px 10px;
border: 1px solid var(--border);
border-radius: var(--radius-sm);
font-size: 13px;
box-sizing: border-box;
}
li.eq-other-on .eq-other-note { display: block; }
@media (max-width: 768px) {
.eq-row {
flex-direction: column;
gap: 10px;
}
.eq-opts {
flex-wrap: wrap;
gap: 6px;
}
.eq-opt {
font-size: 12px;
padding: 4px 8px;
}
}
@media (max-width: 1024px) {
.industry-layout { flex-direction: column; }
.industry-sidebar {
width: 100%;
position: static;
order: 2;
display: grid;
grid-template-columns: repeat(2, 1fr);
gap: 16px;
}
.industry-sidebar .sidebar-back { grid-column: span 2; }
}
@media (max-width: 1200px) {
.industry-sidebar { width: 260px; }
}
/* ===== 微信小程序入口浮窗 ===== */
.weapp-fab {
position: fixed;
right: 18px;
bottom: 90px;
z-index: 999;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
gap: 2px;
width: 56px;
height: 56px;
border: none;
border-radius: 12px;
background: transparent;
color: #07c160;
cursor: pointer;
box-shadow: none;
transition: transform .2s ease;
}
/* 2026-09-09 去绿盘：仅保留绿色泡泡图标+文字 */
.weapp-fab:hover { transform: translateY(-2px); box-shadow: none; }
.weapp-fab:active { transform: scale(.95); }
.weapp-fab svg { display: block; }
.weapp-fab-text { font-size: 11px; line-height: 1; font-weight: 600; }
.weapp-modal {
position: fixed;
inset: 0;
z-index: 2000;
display: flex;
align-items: center;
justify-content: center;
padding: 20px;
}
.weapp-modal[hidden] { display: none; }
.weapp-modal-mask { position: absolute; inset: 0; background: rgba(15,23,42,.55); }
.weapp-modal-card {
position: relative;
z-index: 1;
width: 320px;
max-width: 100%;
background: #fff;
border-radius: 16px;
padding: 28px 22px 24px;
text-align: center;
box-shadow: 0 20px 60px rgba(0,0,0,.25);
animation: weappPop .25s ease;
}
@keyframes weappPop { from { transform: scale(.9); opacity: 0; } to { transform: scale(1); opacity: 1; } }
.weapp-modal-close {
position: absolute; top: 10px; right: 12px;
width: 30px; height: 30px; border: none; background: transparent;
font-size: 24px; line-height: 1; color: #94a3b8; cursor: pointer;
}
.weapp-modal-head { display: flex; align-items: center; justify-content: center; gap: 8px; margin-bottom: 6px; }
.weapp-modal-head h3 { font-size: 18px; color: #0f172a; margin: 0; }
.weapp-modal-badge { font-size: 20px; }
.weapp-modal-tip { font-size: 13px; color: #64748b; margin: 0 0 16px; }
.weapp-launch { min-height: 0; }
.weapp-qr-img { width: 200px; max-width: 70%; border-radius: 10px; box-shadow: 0 2px 10px rgba(0,0,0,.08); }
.weapp-qr-hint { font-size: 13px; color: #64748b; margin-top: 12px; }
@media (max-width: 480px) {
.weapp-fab { right: 14px; bottom: 78px; width: 52px; height: 52px; }
.weapp-modal-card { width: 300px; }
}
/* ===== 行业目录折叠树（可复用组件） ===== */
.industry-cat-nav { }
.industry-cat-nav-header {
display: flex;
align-items: center;
gap: 10px;
margin: -20px -20px 14px -20px;
padding: 16px 20px;
border-bottom: 1px solid var(--border-light);
background: var(--bg-light);
}
.sidebar-card.industry-cat-nav .industry-cat-nav-header {
margin: -18px -18px 14px -18px;
padding: 16px 18px;
}
.industry-cat-nav-header h4 {
font-size: 15px;
font-weight: 700;
color: var(--text);
margin: 0;
}
.industry-cat-nav-icon {
font-size: 18px;
line-height: 1;
}
.right-nav-tree {
list-style: none;
padding: 0;
margin: 0;
max-height: calc(100vh - 240px);
overflow-y: auto;
}
.right-nav-tree::-webkit-scrollbar { width: 5px; }
.right-nav-tree::-webkit-scrollbar-thumb {
background: var(--border);
border-radius: 3px;
}
/* 一级组标题 */
.right-nav-group {
border-bottom: 1px dashed var(--border-light);
}
.right-nav-group:last-child { border-bottom: none; }
.right-nav-group-toggle {
display: flex;
align-items: center;
gap: 8px;
width: 100%;
padding: 10px 14px;
background: none;
border: none;
cursor: pointer;
font-size: 13px;
font-weight: 600;
color: var(--text);
text-align: left;
transition: all .15s ease;
font-family: inherit;
}
.right-nav-group-toggle:hover {
background: var(--bg-light);
color: var(--primary);
}
.right-nav-group.open .right-nav-group-toggle {
color: var(--primary);
background: linear-gradient(90deg, rgba(138,101,64,.06), transparent);
}
.right-nav-gicon { font-size: 14px; line-height: 1; }
.right-nav-gname {
flex: 1;
min-width: 0;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.right-nav-gcount {
font-size: 11px;
color: var(--text-muted);
background: var(--bg-light);
border: 1px solid var(--border-light);
border-radius: 10px;
padding: 1px 7px;
font-weight: 500;
flex-shrink: 0;
}
.right-nav-arrow {
color: var(--text-muted);
font-size: 11px;
transition: transform .2s ease;
flex-shrink: 0;
}
.right-nav-group.open .right-nav-arrow { transform: rotate(90deg); }
/* 二级子行业 */
.right-nav-subs {
display: none;
list-style: none;
padding: 0 0 6px;
margin: 0;
background: var(--bg);
}
.right-nav-group.open .right-nav-subs { display: block; }
.right-nav-subs li { position: relative; }
.right-nav-subs li a {
display: flex;
align-items: center;
gap: 8px;
padding: 7px 14px 7px 34px;
font-size: 12.5px;
color: var(--text);
text-decoration: none;
transition: all .15s ease;
border-left: 3px solid transparent;
line-height: 1.4;
}
.right-nav-subs li a:hover {
background: var(--bg-white);
color: var(--primary);
padding-left: 38px;
}
.right-nav-subs li.active a,
.right-nav-subs li a.active {
background: linear-gradient(90deg, rgba(138,101,64,.1), rgba(138,101,64,.02));
color: var(--primary);
border-left-color: var(--primary);
font-weight: 700;
}
.right-nav-dot {
width: 5px;
height: 5px;
border-radius: 50%;
background: var(--primary-light);
opacity: .45;
flex-shrink: 0;
}
.right-nav-subs li.active .right-nav-dot,
.right-nav-subs li a:hover .right-nav-dot { opacity: 1; }
.right-nav-name {
flex: 1;
min-width: 0;
}
@media (max-width: 768px) {
.industry-cat-nav-header {
margin: -16px -16px 12px -16px;
padding: 14px 16px;
}
.sidebar-card.industry-cat-nav .industry-cat-nav-header {
margin: -16px -16px 12px -16px;
padding: 14px 16px;
}
.right-nav-tree {
max-height: 320px;
padding: 0 12px;
}
.right-nav-group-toggle {
padding: 9px 6px;
border-radius: var(--radius-sm);
}
.right-nav-group.open .right-nav-group-toggle {
border-radius: var(--radius-sm) var(--radius-sm) 0 0;
}
.right-nav-subs li a {
padding: 7px 8px 7px 24px;
}
.right-nav-subs li a:hover { padding-left: 28px; }
}
/* ============================================
知识库三栏页面克隆样式（选型指南/维修指南/维修案例）
============================================ */
/* ---- Hero ---- */
.kb-hero {
padding: 30px 0 55px;
color: #fff;
}
.kb-hero-blue {
background: linear-gradient(135deg, #8A6540 0%, #4f46e5 100%);
}
.kb-hero-green {
background: linear-gradient(135deg, #059669 0%, #0d9488 100%);
}
.kb-hero-orange {
background: linear-gradient(135deg, #ea580c 0%, #d97706 100%);
}
.kb-hero-sm {
padding: 40px 0 30px;
}
.kb-hero-sm h1, .kb-hero-sm h2 { font-size: 28px; margin: 0 0 6px; }
.kb-hero-inner {
display: flex;
align-items: center;
gap: 16px;
margin-bottom: 14px;
}
.kb-hero-icon {
flex-shrink: 0;
width: 48px;
height: 48px;
background: rgba(255,255,255,0.2);
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
}
.kb-hero-icon svg {
width: 26px;
height: 26px;
}
.kb-hero-content h1 {
font-size: 26px;
margin-bottom: 6px;
color: #fff;
}
.kb-hero-content p {
font-size: 14px;
opacity: 0.95;
max-width: 720px;
line-height: 1.5;
}
.kb-hero-stats {
display: flex;
gap: 10px;
margin-top: 12px;
}
.kb-stat {
display: inline-flex;
align-items: center;
gap: 5px;
background: rgba(255,255,255,0.18);
padding: 5px 12px;
border-radius: 999px;
font-size: 12px;
font-weight: 500;
}
.kb-hot-search {
display: flex;
align-items: flex-start;
gap: 10px;
flex-wrap: wrap;
margin-top: 14px;
}
.kb-hot-label {
font-size: 13px;
font-weight: 500;
padding-top: 5px;
}
.kb-hot-tags {
display: flex;
flex-wrap: wrap;
gap: 8px;
}
.kb-hot-tag {
display: inline-block;
background: rgba(255,255,255,0.2);
color: #fff;
padding: 5px 12px;
border-radius: 999px;
font-size: 12px;
transition: all .2s;
}
.kb-hot-tag:hover {
background: #fff;
color: var(--text);
}
.kb-hot-tag.active {
background: #fff;
color: var(--text);
}
/* ---- 紧凑 hero：色块保留但不通栏（容器内圆角卡片） ---- */
.kb-hero-compact {
padding: 16px 0 12px;
}
.kb-hero-box {
border-radius: 14px;
padding: 20px 24px 16px;
color: #fff;
}
.kb-hero-box.kb-hero-blue {
background: linear-gradient(135deg, #8A6540 0%, #4f46e5 100%);
}
.kb-hero-box.kb-hero-green {
background: linear-gradient(135deg, #059669 0%, #0d9488 100%);
}
.kb-hero-box.kb-hero-orange {
background: linear-gradient(135deg, #ea580c 0%, #d97706 100%);
}
.kb-hero-compact .kb-hero-inner {
align-items: center;
margin-bottom: 0;
gap: 20px;
}
.kb-hero-compact .kb-hero-content { flex: 1; }
.kb-hero-compact .kb-hero-stats {
margin-top: 0;
margin-left: auto;
flex-shrink: 0;
}
.kb-hero-compact .kb-hot-search {
margin-top: 12px;
}
.kb-hero-box-center {
text-align: center;
}
.kb-hero-box-center .kb-hero-sm-title,
.kb-hero-box-center h1 {
margin: 0 0 6px;
font-size: 26px;
}
.kb-hero-box-center p {
margin: 0;
opacity: 0.95;
font-size: 14px;
}
.kb-hero-box-center .kb-hero-subtitle {
font-size: 16px;
font-weight: 500;
}
.kb-hero-box-center .kb-hero-stats {
justify-content: center;
margin: 10px 0 0;
}
.kb-hero-list .kb-hero-box {
padding: 18px 24px 14px;
}
/* ---- 筛选卡：提示标签与内容同行 ---- */
.kb-filter-card-clean {
margin: 18px 0;
border: 1px solid var(--border-light);
box-shadow: none;
}
.kb-filter-card-clean .kb-filter-row {
flex-direction: row;
align-items: flex-start;
gap: 24px;
}
.kb-filter-card-clean .kb-filter-item {
display: flex;
align-items: flex-start;
gap: 10px;
flex: 1;
width: auto;
}
.kb-filter-card-clean .kb-filter-item label {
flex-shrink: 0;
width: auto;
white-space: nowrap;
margin-bottom: 0;
padding-top: 8px;
color: var(--text-light);
font-weight: 500;
}
.kb-filter-card-clean .kb-filter-form,
.kb-filter-card-clean .kb-filter-links-group {
flex: 1;
min-width: 0;
}
@media (max-width: 768px) {
.kb-hero-compact { padding: 14px 0 10px; }
.kb-hero-compact .kb-hero-inner {
flex-wrap: wrap;
gap: 10px;
}
.kb-hero-compact .kb-hero-content { width: calc(100% - 64px); }
.kb-hero-compact .kb-hero-stats {
width: 100%;
margin-left: 0;
justify-content: flex-start;
}
.kb-filter-card-clean { margin: 14px 0; }
.kb-filter-card-clean .kb-filter-row {
flex-direction: column;
gap: 14px;
}
.kb-filter-card-clean .kb-filter-item {
flex-direction: column;
width: 100%;
}
.kb-filter-card-clean .kb-filter-item label { padding-top: 0; }
}
/* ---- 栏目原地搜索状态条 ---- */
.kb-search-status {
display: flex;
flex-wrap: wrap;
align-items: center;
justify-content: space-between;
gap: 12px;
margin: 0 0 18px;
padding: 12px 18px;
border-radius: 10px;
background: #f0f6ff;
border: 1px solid #d6e6ff;
}
.kb-search-status-text {
font-size: 14px;
color: var(--text);
}
.kb-search-status-text b {
color: #0a3d91;
}
.kb-search-clear {
border: 1px solid var(--border-light);
cursor: pointer;
padding: 6px 14px;
border-radius: 6px;
background: #fff;
color: var(--text-lighter);
font-size: 13px;
transition: all .2s;
}
.kb-search-clear:hover {
color: #e74c3c;
border-color: #e74c3c;
}
/* ---- 筛选卡 ---- */
.kb-filter-card {
background: #fff;
border-radius: var(--radius);
box-shadow: var(--shadow);
padding: 16px 18px;
margin: -30px 0 18px;
position: relative;
z-index: 2;
}
.kb-filter-row {
display: flex;
flex-direction: column;
gap: 12px;
}
.kb-filter-row:has(> :nth-child(2):last-child) {
display: flex;
flex-direction: column;
gap: 12px;
}
.kb-filter-item {
width: 100%;
}
.kb-filter-item label {
display: flex;
align-items: center;
gap: 6px;
font-size: 13px;
font-weight: 500;
color: var(--text);
margin-bottom: 8px;
}
.kb-filter-form,
.kb-filter-select-form {
display: flex;
gap: 8px;
}
.kb-filter-input {
flex: 1;
padding: 9px 14px;
border: 1px solid var(--border);
border-radius: var(--radius-sm);
font-size: 14px;
outline: none;
}
.kb-filter-input:focus {
border-color: var(--primary-light);
}
.kb-filter-btn {
padding: 9px 18px;
border: none;
border-radius: var(--radius-sm);
background: #8A6540;
color: #fff;
font-size: 14px;
cursor: pointer;
}
.kb-filter-green { background: #059669; }
.kb-filter-orange { background: #ea580c; }
.kb-filter-select,
.kb-filter-select-sm {
width: 100%;
padding: 9px 14px;
border: 1px solid var(--border);
border-radius: var(--radius-sm);
font-size: 14px;
background: #fff;
outline: none;
}
.kb-filter-select-sm {
width: auto;
min-width: 80px;
}
.kb-filter-links-group {
display: flex;
flex-wrap: wrap;
gap: 8px;
}
.kb-filter-bar-bottom {
display: flex;
align-items: center;
justify-content: space-between;
margin-top: 12px;
padding-top: 10px;
border-top: 1px solid var(--border-light);
}
.kb-per-page {
display: flex;
align-items: center;
gap: 8px;
font-size: 13px;
color: var(--text-light);
}
.kb-result-count {
font-size: 13px;
color: var(--text-light);
}
.kb-result-count strong {
color: var(--text);
font-size: 16px;
}
/* ---- 卡片网格 ---- */
.kb-card-grid {
display: grid;
gap: 16px;
margin-bottom: 30px;
}
.kb-grid-3 {
grid-template-columns: repeat(3, 1fr);
}
.kb-grid-2 {
grid-template-columns: repeat(2, 1fr);
}
.kb-card {
background: #fff;
border-radius: var(--radius);
box-shadow: var(--shadow);
border: 1px solid var(--border-light);
overflow: hidden;
transition: all .2s;
position: relative;
}
/* 整卡可点击：标题链接的伪元素铺满卡片 */
.kb-card h3 a::after {
content: '';
position: absolute;
inset: 0;
}
/* 卡片内其他链接（如案例故障类型）保持可点 */
.kb-card .kb-case-meta a {
position: relative;
z-index: 2;
}
/* 搜索结果状态下分页淡化占位（不隐藏，避免布局跳动） */
.kb-pg-dim {
opacity: .35;
pointer-events: none;
}
.kb-card:hover {
box-shadow: var(--shadow-lg);
transform: translateY(-3px);
}
.kb-card-blue:hover { border-color: #bfdbfe; }
.kb-card-green:hover { border-color: #a7f3d0; }
.kb-card-orange:hover { border-color: #fed7aa; }
.kb-card-body {
padding: 18px;
}
.kb-card-badges {
display: flex;
flex-wrap: wrap;
gap: 6px;
margin-bottom: 10px;
}
.kb-card-badge {
display: inline-block;
padding: 4px 10px;
border-radius: 999px;
font-size: 12px;
font-weight: 500;
}
.kb-badge-blue {
background: #F8F4EC;
color: #8A6540;
}
.kb-badge-green {
background: #d1fae5;
color: #047857;
}
.kb-badge-gray {
background: #f3f4f6;
color: #4b5563;
}
.kb-badge-orange {
background: #ffedd5;
color: #c2410c;
}
.kb-card h3 {
font-size: 16px;
line-height: 1.45;
margin-bottom: 10px;
}
.kb-card h3 a {
color: var(--text);
}
.kb-card h3 a:hover {
color: var(--primary-light);
}
.kb-card-section {
margin-bottom: 10px;
}
.kb-section-label {
display: inline-flex;
align-items: center;
gap: 4px;
font-size: 12px;
font-weight: 600;
color: var(--text);
margin-bottom: 4px;
}
.kb-section-blue { color: #8A6540; }
.kb-card-section p {
font-size: 13px;
color: var(--text-light);
line-height: 1.6;
display: -webkit-box;
-webkit-line-clamp: 3;
-webkit-box-orient: vertical;
overflow: hidden;
}
.kb-card-footer {
display: flex;
align-items: center;
justify-content: space-between;
padding-top: 10px;
margin-top: 10px;
border-top: 1px solid var(--border-light);
}
.kb-card-more {
font-size: 14px;
font-weight: 500;
color: var(--primary-light);
}
.kb-card-more:hover {
color: var(--primary-dark);
}
.kb-card-more span {
display: inline-block;
transition: transform .2s;
}
.kb-card:hover .kb-card-more span {
transform: translateX(4px);
}
.kb-card-date {
font-size: 13px;
color: var(--text-lighter);
}
/* 维修案例卡片特殊 */
.kb-case-title {
font-size: 18px;
margin-bottom: 10px;
}
.kb-case-meta {
display: flex;
flex-wrap: wrap;
gap: 12px;
margin-bottom: 14px;
font-size: 13px;
color: var(--text-light);
}
.kb-case-equip {
color: var(--text-light);
}
.kb-case-duration i {
font-style: normal;
}
.kb-case-footer {
align-items: center;
}
.kb-star {
color: #e2e8f0;
font-size: 15px;
}
.kb-star-on {
color: #B85C38;
}
/* ---- 分页 ---- */
.kb-pagination {
display: flex;
justify-content: center;
align-items: center;
gap: 8px;
margin: 20px 0 40px;
}
.kb-pagination a,
.kb-pagination span {
display: inline-flex;
align-items: center;
justify-content: center;
min-width: 38px;
height: 38px;
padding: 0 12px;
border-radius: var(--radius-sm);
font-size: 14px;
border: 1px solid var(--border);
background: #fff;
color: var(--text);
}
.kb-pagination a:hover {
border-color: var(--primary-light);
color: var(--primary-light);
}
.kb-pagination .kb-page-current {
background: var(--primary-light);
border-color: var(--primary-light);
color: #fff;
}
.kb-page-ellipsis {
border: none !important;
background: transparent !important;
color: var(--text-light) !important;
}
/* ---- 详情页 ---- */
.kb-detail-layout {
display: grid;
grid-template-columns: 1fr 300px;
gap: 28px;
margin: 30px 0 60px;
}
.kb-detail-card {
background: #fff;
border-radius: var(--radius);
box-shadow: var(--shadow);
padding: 32px;
}
.kb-detail-meta {
display: flex;
flex-wrap: wrap;
align-items: center;
gap: 10px;
margin-bottom: 16px;
}
.kb-detail-date,
.kb-detail-views {
font-size: 13px;
color: var(--text-lighter);
}
/* 主题=设备类型，直接作为主标题（对齐云平台详情页结构） */
.kb-detail-title {
font-size: 32px;
margin-bottom: 10px;
line-height: 1.3;
text-align: center;
color: #0a3d91;
font-weight: 800;
}
.kb-detail-subtitle {
display: flex;
flex-wrap: wrap;
justify-content: center;
align-items: center;
gap: 10px;
margin-bottom: 26px;
padding-bottom: 20px;
border-bottom: 1px solid var(--border-light);
font-size: 15px;
}
.kb-detail-subtitle .kb-sub-cat {
color: var(--text-lighter);
font-weight: 500;
}
.kb-detail-subtitle .kb-sub-title {
color: var(--text);
font-weight: 600;
}
.kb-detail-subtitle .kb-sub-sep {
color: #c0c4cc;
}
/* ---- 知识库详情：知识卡风格 ---- */
.kb-detail-block {
background: #fff;
border: 1px solid var(--border);
border-radius: var(--radius);
box-shadow: var(--shadow-sm);
padding: 24px;
margin-bottom: 24px;
}
.kb-detail-block h2 {
font-size: 18px;
margin-bottom: 18px;
padding-bottom: 12px;
border-bottom: 1px solid var(--border-light);
display: flex;
align-items: center;
gap: 8px;
}
.kb-detail-block h2 i {
font-style: normal;
}
.kb-detail-content {
font-size: 15px;
line-height: 1.8;
color: var(--text);
}
.kb-detail-content p {
margin-bottom: 12px;
}
.kb-detail-content p:last-child {
margin-bottom: 0;
}
.kb-detail-content ul,
.kb-detail-content ol {
margin: 12px 0 12px 22px;
list-style: initial;
}
.kb-detail-content li {
margin-bottom: 6px;
}
.kb-detail-list {
margin: 12px 0 12px 22px;
list-style: disc;
}
.kb-detail-list li {
margin-bottom: 8px;
line-height: 1.7;
}
/* 知识库详情自动分行后的编号列表（参照 yun.jp17.com 风格） */
.kb-point-list {
display: flex;
flex-direction: column;
gap: 14px;
}
.kb-point-item {
display: flex;
align-items: flex-start;
gap: 12px;
font-size: 16px;
line-height: 1.75;
color: var(--text);
}
.kb-point-item p {
margin: 0;
flex: 1;
}
.kb-point-num {
flex: 0 0 auto;
display: inline-flex;
align-items: center;
justify-content: center;
min-width: 26px;
height: 26px;
margin-top: 1px;
padding: 0 6px;
border-radius: 50%;
background: linear-gradient(135deg, var(--primary), var(--primary-light));
color: #fff;
font-size: 14px;
font-weight: 600;
line-height: 1;
box-shadow: 0 2px 6px rgba(59, 130, 246, 0.25);
}
.kb-point-no-num {
padding-left: 38px;
}
/* 温馨提示知识卡（从正文内容中独立出来） */
.kb-tip-card {
background: linear-gradient(135deg, #fffbeb 0%, #fef3c7 100%);
border: 1px solid #fde68a;
border-radius: var(--radius);
box-shadow: var(--shadow-sm);
padding: 22px 24px;
margin-top: 20px;
}
.kb-tip-title {
display: flex;
align-items: center;
gap: 8px;
font-size: 16px;
font-weight: 600;
color: #7C4226;
margin-bottom: 14px;
}
.kb-tip-title i {
font-style: normal;
}
.kb-tip-content {
font-size: 15px;
line-height: 1.75;
color: var(--text);
}
.kb-tip-content .kb-point-list {
gap: 10px;
}
.kb-tip-content .kb-point-num {
background: linear-gradient(135deg, #B85C38, #D4764E);
box-shadow: 0 2px 6px rgba(245, 158, 11, 0.25);
}
.kb-detail-warm {
background: #fffbeb;
border: 1px solid #fde68a;
}
.kb-detail-solution {
background: #f0fdf4;
border: 1px solid #bbf7d0;
}
.kb-detail-actions {
display: flex;
gap: 12px;
margin-top: 32px;
padding-top: 24px;
border-top: 1px solid var(--border-light);
}
/* 会员/管理员登录才可见的元素（meta 行等） */
.kb-require-member {
display: none !important;
}
.kb-require-member.is-visible {
display: flex !important;
}
.kb-engage-bar.kb-require-member.is-visible {
display: flex !important;
}
/* 互动计数：按钮始终显示，数字仅企业会员/管理员可见 */
.kb-count-protected {
display: none !important;
}
.kb-count-protected.is-visible {
display: inline-flex !important;
}
/* 底部互动按钮条 */
.kb-engage-bar {
display: flex;
flex-wrap: wrap;
align-items: center;
gap: 10px;
margin-top: 20px;
padding: 14px;
background: #f8fafc;
border: 1px solid #e2e8f0;
border-radius: 12px;
user-select: none;
}
.kb-eng-btn {
display: inline-flex;
align-items: center;
gap: 5px;
padding: 7px 14px;
border-radius: 8px;
border: 1px solid #e2e8f0;
background: #fff;
color: #475569;
font-size: 13px;
font-weight: 500;
cursor: pointer;
text-decoration: none;
transition: all .2s;
line-height: 1;
}
.kb-eng-btn:hover {
border-color: #8A6540;
color: #8A6540;
transform: translateY(-1px);
}
/* 互动完成后的激活态（已赞/已收藏/已关注） */
.kb-eng-btn.kb-eng-active {
border-color: #8A6540;
background: #eef5fc;
color: #0a3d91;
}
.kb-eng-btn .kb-eng-icon {
font-size: 14px;
line-height: 1;
}
.kb-eng-btn .kb-eng-count {
display: inline-block;
min-width: 16px;
padding: 1px 5px;
margin-left: 2px;
background: #f1f5f9;
border-radius: 999px;
font-size: 11px;
color: #64748b;
text-align: center;
}
.kb-eng-like:hover { border-color: #e74c3c; color: #e74c3c; }
.kb-eng-share:hover { border-color: #B85C38; color: #b45309; }
.kb-eng-favorite:hover { border-color: #B85C38; color: #b45309; }
.kb-eng-follow:hover { border-color: #B99168; color: #8A6540; }
.kb-eng-comment:hover { border-color: #10b981; color: #047857; }
.kb-eng-correction:hover { border-color: #8b5cf6; color: #7c3aed; }
.kb-eng-submit:hover { border-color: #8A6540; color: #8A6540; }
/* 兼容旧的底部统计行（如仍有页面使用） */
.kb-engage-stats {
display: flex;
flex-wrap: wrap;
align-items: center;
gap: 2px;
margin-top: 16px;
padding-top: 16px;
border-top: 1px solid #e2e8f0;
font-size: 14px;
color: #64748b;
user-select: none;
}
.kb-stat-item {
display: inline-flex;
align-items: center;
gap: 4px;
}
.kb-stat-item .kb-ico {
font-style: normal;
font-size: 14px;
line-height: 1;
}
.kb-stat-item .kb-stat-name {
margin-right: 2px;
}
.kb-stat-item b {
font-weight: 600;
color: #1e293b;
min-width: 14px;
text-align: left;
}
.kb-stat-sep {
margin: 0 6px;
color: #cbd5e1;
}
.kb-detail-sidebar {
align-self: start;
}
.kb-sidebar-card {
background: #fff;
border-radius: var(--radius);
box-shadow: var(--shadow);
padding: 22px;
}
.kb-sidebar-card h3 {
font-size: 16px;
margin-bottom: 14px;
}
.kb-sidebar-card ul li {
margin-bottom: 10px;
}
.kb-sidebar-card ul li a {
font-size: 14px;
color: var(--text);
}
.kb-sidebar-card ul li a:hover {
color: var(--primary-light);
}
/* 侧栏相关卡按类别配色（顶部色条 + 标题同色），避免视觉疲劳 */
.kb-card-service {
border-top: 3px solid #8A6540;
}
.kb-card-service h3 {
color: #8A6540;
}
.kb-card-service ul li a:hover {
color: #8A6540;
}
.kb-card-repair {
border-top: 3px solid #ea580c;
}
.kb-card-repair h3 {
color: #c2410c;
}
.kb-card-repair ul li a:hover {
color: #c2410c;
}
.kb-card-case {
border-top: 3px solid #16a34a;
}
.kb-card-case h3 {
color: #15803d;
}
.kb-card-case ul li a:hover {
color: #15803d;
}
.kb-card-sel {
border-top: 3px solid #7c3aed;
}
.kb-card-sel h3 {
color: #6d28d9;
}
.kb-card-sel ul li a:hover {
color: #6d28d9;
}
.kb-sidebar-products {
border-top: 3px solid #0891b2;
}
.kb-sidebar-products h3 {
color: #0e7490;
}
.kb-sidebar-products ul li a:hover {
color: #0e7490;
}
.kb-case-info-bar {
display: flex;
flex-wrap: wrap;
gap: 16px 24px;
background: #f8fafc;
border-radius: var(--radius-sm);
padding: 16px 20px;
margin: 24px 0;
font-size: 14px;
}
.kb-case-info-bar strong {
color: var(--text-light);
font-weight: 500;
}
.kb-customer-comment {
border-left: 3px solid var(--accent);
padding-left: 16px;
font-style: italic;
color: var(--text-light);
}
.kb-empty-state {
text-align: center;
padding: 60px 20px;
background: #fff;
border-radius: var(--radius);
box-shadow: var(--shadow);
margin-bottom: 40px;
}
.kb-empty-state p {
color: var(--text-light);
margin-bottom: 20px;
}
/* ---- 响应式 ---- */
@media (max-width: 1024px) {
.kb-grid-3 { grid-template-columns: repeat(2, 1fr); }
.kb-detail-layout { grid-template-columns: 1fr; }
.kb-detail-sidebar { order: 2; }
}
@media (max-width: 768px) {
.kb-hero-inner { flex-direction: column; align-items: flex-start; text-align: left; }
.kb-hero-content h1 { font-size: 24px; }
.kb-filter-row,
.kb-filter-row:has(> :nth-child(2):last-child) {
grid-template-columns: 1fr;
}
.kb-grid-3,
.kb-grid-2 { grid-template-columns: 1fr; }
.kb-filter-bar-bottom {
flex-direction: column;
align-items: flex-start;
gap: 12px;
}
.kb-detail-card { padding: 22px; }
.kb-detail-title { font-size: 24px; }
.kb-case-info-bar { flex-direction: column; gap: 10px; }
}
/* ============ 知识库静态化（2026-08-14 v8.2） ============ */
/* 静态页筛选卡：分类链接组代替下拉 */
.kb-filter-links { width: 100%; }
.kb-filter-links label { display: block; font-size: 13px; font-weight: 600; color: var(--text-light, #666); margin-bottom: 8px; }
.kb-filter-link {
display: inline-block;
padding: 5px 12px;
font-size: 13px;
color: #333;
background: #f3f4f6;
border: 1px solid #e5e7eb;
border-radius: 6px;
text-decoration: none;
transition: all .2s;
line-height: 1.5;
}
.kb-filter-link:hover {
color: #8A6540;
border-color: #8A6540;
background: #F6F1E5;
}
.kb-card-green .kb-filter-link:hover,
.kb-hero-green ~ * .kb-filter-link:hover { color: #059669; border-color: #059669; background: #ecfdf5; }
.kb-filter-link.active {
color: #fff;
background: #8A6540;
border-color: #8A6540;
font-weight: 600;
}
.kb-filter-select-form + .kb-filter-links-group .kb-filter-link.active { background: #059669; border-color: #059669; }
/* 详情页相关推荐 */
.kb-detail-related {
margin-top: 28px;
padding: 20px;
background: #f8fafc;
border: 1px solid #e2e8f0;
border-radius: 10px;
}
.kb-detail-related h2 {
font-size: 16px;
margin-bottom: 12px;
color: #1e293b;
}
.kb-related-list {
list-style: none;
margin: 0;
padding: 0;
display: grid;
grid-template-columns: minmax(0,1fr) minmax(0,1fr);
gap: 8px 20px;
}
.kb-related-list li a {
display: block;
padding: 7px 10px;
color: #334155;
font-size: 13.5px;
background: #fff;
border: 1px solid #e2e8f0;
border-radius: 6px;
text-decoration: none;
transition: all .2s;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.kb-related-list li a:hover {
color: #8A6540;
border-color: #8A6540;
transform: translateX(2px);
}
/* 侧栏相关推荐：始终竖排单列 */
.kb-sidebar-related .kb-related-list {
grid-template-columns: 1fr !important;
gap: 8px;
}
/* 侧栏相关产品：名称上方显示产品主图（2列网格） */
.kb-sidebar-products .kb-prod-list {
grid-template-columns: 1fr 1fr !important;
gap: 10px;
}
.kb-prod-item a {
display: flex !important;
flex-direction: column;
padding: 8px !important;
white-space: normal !important;
text-overflow: unset !important;
}
.kb-prod-thumb {
width: 100%;
aspect-ratio: 1 / 1;
margin-bottom: 8px;
background: #f1f5f9;
border-radius: 6px;
overflow: hidden;
display: flex;
align-items: center;
justify-content: center;
}
.kb-prod-thumb img {
max-width: 100%;
max-height: 100%;
object-fit: contain;
}
.kb-prod-name {
text-align: center;
font-size: 12.5px;
line-height: 1.4;
color: #334155;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
overflow: hidden;
}
.kb-prod-item a:hover .kb-prod-name { color: #8A6540; }
/* 详情页左栏相关产品：每行 5 个，超过 10 个由 data-per-page 分页 */
.kb-main-products {
margin-top: 24px;
}
.kb-main-products .kb-prod-list {
display: grid;
grid-template-columns: repeat(5, 1fr);
gap: 16px;
list-style: none;
padding: 0;
margin: 0;
}
.kb-main-products .kb-prod-item a {
background: #fff;
border: 1px solid #e2e8f0;
border-radius: var(--radius-sm);
padding: 10px;
transition: box-shadow 0.2s, border-color 0.2s;
}
.kb-main-products .kb-prod-item a:hover {
border-color: #38bdf8;
box-shadow: var(--shadow);
}
.kb-main-products .kb-prod-name {
font-size: 13.5px;
margin-top: 8px;
}
@media (max-width: 1024px) {
.kb-main-products .kb-prod-list { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 768px) {
.kb-sidebar-products .kb-prod-list { grid-template-columns: 1fr 1fr !important; }
.kb-main-products .kb-prod-list { grid-template-columns: repeat(2, 1fr); gap: 12px; }
}
@media (max-width: 768px) {
.kb-related-list { grid-template-columns: minmax(0,1fr); }
.kb-filter-links-group { gap: 5px; }
.kb-filter-link { padding: 5px 10px; font-size: 12.5px; }
.kb-engage-stats { font-size: 13px; gap: 1px; }
.kb-stat-sep { margin: 0 4px; }
}
/* ===== 配套方案产品名 → 全站检索链接 ===== */
.eq-link {
color: #8A6540 !important;
font-weight: 600;
text-decoration: none;
border-bottom: 1px solid #90caf9;
transition: color .15s, border-color .15s;
}
.eq-link:hover {
color: #A67C52 !important;
border-bottom-color: #A67C52;
text-decoration: none;
}
.stage-card ul li .eq-link { color: #8A6540; }
@media (max-width: 768px) {
.eq-link { border-bottom-width: 1px; }
}
/* ===== 2026-08-17 产品卡"询价/详情"按钮：去背景色块，蓝色加粗文字 ===== */
.product-footer .btn-inquiry {
display:inline-block;height:auto;box-shadow:none;
background:transparent;border-radius:0;padding:4px 8px;
color:#8A6540;font-size:15px;font-weight:700;letter-spacing:.5px;
transition:color .15s;
}
.product-footer .btn-inquiry:hover {
background:transparent;box-shadow:none;transform:none;
color:#A67C52;text-decoration:underline;
}
/* ===== 2026-08-24 产品对比（参照 tek.com.cn product-compare） ===== */
/* --- 产品卡「对比」复选框 --- */
.pc-cmp-check {
position:relative;z-index:2;
display:inline-flex;align-items:center;gap:4px;
font-size:12px;color:#64748b;font-weight:500;
cursor:pointer;user-select:none;white-space:nowrap;
padding:5px 8px;border:1px solid #d1d5db;border-radius:16px;
background:#fff;transition:all .15s;
}
.pc-cmp-check:hover {border-color:#8A6540;color:#8A6540}
.pc-cmp-check input {
width:13px;height:13px;margin:0;accent-color:#8A6540;cursor:pointer;flex-shrink:0;
}
.product-card.is-comparing .pc-cmp-check {
border-color:#8A6540;background:#eaf3ff;color:#8A6540;font-weight:600;
}
/* --- 详情页「加入对比」按钮 --- */
.pd-cta-row .btn-cmp-add {
display:inline-flex;align-items:center;justify-content:center;gap:5px;
height:40px;padding:0 18px;border-radius:8px;
border:1px solid #e2e8f0;background:#fff;color:#475569;
font-size:14px;font-weight:500;cursor:pointer;transition:all .2s;
}
.pd-cta-row .btn-cmp-add:hover {border-color:#8A6540;color:#8A6540;background:#f0f7ff}
.pd-cta-row .btn-cmp-add.is-on {
border-color:#8A6540;background:#eaf3ff;color:#8A6540;font-weight:600;
}
@media (max-width:768px) {
.pd-cta-row .btn-cmp-add{height:38px;padding:0 12px;font-size:13px}
}
/* --- 浮动对比条 --- */
.jp-cmp-bar {
position:fixed;left:50%;bottom:24px;transform:translateX(-50%);
z-index:9998;max-width:min(92vw,760px);width:max-content;
box-shadow:0 8px 30px rgba(15,42,80,.22);
border-radius:12px;overflow:hidden;
}
.jp-cmp-bar[hidden] {display:none;}
.jp-cmp-bar-inner {
display:flex;align-items:center;gap:10px;flex-wrap:wrap;
padding:10px 14px;background:#fff;border:1px solid #dbe6f2;border-radius:12px;
}
.jp-cmp-bar-label {font-size:13px;font-weight:700;color:#1a1a2e;white-space:nowrap}
.jp-cmp-count {
font-size:12px;font-weight:600;color:#8A6540;background:#eaf3ff;
border-radius:10px;padding:2px 9px;white-space:nowrap;
}
.jp-cmp-chips {display:flex;align-items:center;gap:6px;flex-wrap:wrap;max-width:46vw}
.jp-cmp-chip {
display:inline-flex;align-items:center;gap:4px;
background:#f1f6fc;border:1px solid #dbe6f2;border-radius:14px;
padding:3px 6px 3px 10px;font-size:12px;color:#334155;max-width:180px;
}
.jp-cmp-chip-name {overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.jp-cmp-chip-x {
border:none;background:#cbd5e1;color:#475569;width:16px;height:16px;
border-radius:50%;font-size:11px;line-height:1;cursor:pointer;padding:0;flex-shrink:0;
}
.jp-cmp-chip-x:hover {background:#ef4444;color:#fff}
.jp-cmp-go {
border:none;background:#8A6540;color:#fff;border-radius:8px;
padding:8px 18px;font-size:13px;font-weight:600;cursor:pointer;white-space:nowrap;
transition:background .15s;
}
.jp-cmp-go:hover:not(:disabled) {background:#A67C52}
.jp-cmp-go:disabled {background:#b9c6d6;cursor:not-allowed}
.jp-cmp-clear {
border:none;background:transparent;color:#94a3b8;font-size:12px;
cursor:pointer;padding:4px 6px;white-space:nowrap;
}
.jp-cmp-clear:hover {color:#ef4444}
/* 超额提示 */
.jp-cmp-tip {
position:fixed;left:50%;bottom:88px;transform:translateX(-50%) translateY(8px);
z-index:9999;background:#1e293b;color:#fff;font-size:13px;
padding:9px 18px;border-radius:8px;opacity:0;pointer-events:none;
transition:opacity .25s, transform .25s;
}
.jp-cmp-tip.show {opacity:1;transform:translateX(-50%) translateY(0)}
@media (max-width:640px) {
.jp-cmp-bar {bottom:12px;width:calc(100vw - 20px)}
.jp-cmp-chips {max-width:100%}
.jp-cmp-bar-label {display:none}
}
/* --- 比对页 --- */
.cmp-page {padding:18px 0 60px}
.cmp-hero {
display:flex;align-items:center;gap:14px;flex-wrap:wrap;
padding:18px 22px;margin-bottom:18px;
background:linear-gradient(135deg,#f0f7ff 0%,#eaf3ff 100%);
border:1px solid #dbe6f2;border-radius:12px;
}
.cmp-title {margin:0;font-size:24px;font-weight:700;color:#1a1a2e}
.cmp-sub {margin:0;font-size:13px;color:#64748b;flex:1;min-width:200px}
.cmp-sub strong {color:#8A6540}
.cmp-onlydiff {
display:inline-flex;align-items:center;gap:6px;
font-size:13px;color:#475569;cursor:pointer;user-select:none;
background:#fff;border:1px solid #dbe6f2;border-radius:8px;padding:7px 12px;
}
.cmp-onlydiff input {accent-color:#8A6540;width:14px;height:14px;cursor:pointer}
.cmp-table-wrap {
overflow-x:auto;border:1px solid #e2e8f0;border-radius:12px;
background:#fff;box-shadow:0 2px 12px rgba(15,42,80,.05);
}
.cmp-table {width:100%;border-collapse:collapse;min-width:640px}
.cmp-table th, .cmp-table td {
border-bottom:1px solid #eef2f7;border-right:1px solid #f1f5f9;
padding:11px 14px;font-size:13px;color:#334155;text-align:left;
vertical-align:middle;line-height:1.55;
}
.cmp-table tr > *:last-child {border-right:none}
.cmp-table tbody tr:last-child > * {border-bottom:none}
.cmp-table tr:nth-child(even) > td, .cmp-table tr:nth-child(even) > th {background:#fafcff}
/* 参数名列 */
.cmp-col-key {
width:168px;min-width:150px;background:#f4f8fd !important;
font-weight:600;color:#1a1a2e;position:sticky;left:0;z-index:2;
}
.cmp-keylabel {font-size:13px}
/* 产品头部列 */
.cmp-row-head th, .cmp-row-head td {background:#fff !important;border-bottom:2px solid #dbe6f2}
.cmp-col-prod {
min-width:190px;max-width:260px;text-align:center !important;
position:relative;padding-top:16px;
}
.cmp-remove {
position:absolute;top:6px;right:8px;
width:22px;height:22px;border-radius:50%;
background:#f1f5f9;color:#64748b;font-size:14px;line-height:22px;text-align:center;
text-decoration:none;transition:all .15s;
}
.cmp-remove:hover {background:#ef4444;color:#fff;text-decoration:none}
.cmp-prod-thumb {
display:flex;align-items:center;justify-content:center;
width:100%;height:120px;margin-bottom:8px;
}
.cmp-prod-thumb img {max-width:100%;max-height:100%;object-fit:contain}
.cmp-prod-name {
display:block;font-size:14px;font-weight:700;color:#1a1a2e;
text-decoration:none;line-height:1.4;margin-bottom:2px;
}
.cmp-prod-name:hover {color:#8A6540;text-decoration:underline}
.cmp-prod-model {font-size:12px;color:#8A6540;font-weight:500;margin-bottom:4px}
.cmp-prod-cats {font-size:11px;color:#94a3b8;margin-bottom:10px}
.cmp-prod-cats i {font-style:normal;margin:0 3px}
.cmp-prod-btn {
display:inline-block;padding:6px 20px;border-radius:18px;
border:1px solid #8A6540;color:#8A6540;font-size:12px;font-weight:600;
text-decoration:none;transition:all .15s;
}
.cmp-prod-btn:hover {background:#8A6540;color:#fff;text-decoration:none}
.cmp-price {color:#8A6540;font-weight:700}
.cmp-price-login {color:#8A6540;font-weight:600;text-decoration:none}
.cmp-price-login:hover {text-decoration:underline}
/* 分区行 */
.cmp-row-sec th {
background:#8A6540 !important;color:#fff;font-size:13px;font-weight:600;
padding:8px 14px;
}
.cmp-row-sec td {background:#8A6540 !important;border-bottom-color:#8A6540;padding:0}
/* 差异高亮（tek 风格黄底） */
.cmp-table tr.cmp-diff > th {background:#fff8e1 !important;color:#7C4226}
.cmp-table tr.cmp-diff > td {background:#fff8e1 !important;color:#7c5c10;font-weight:500}
.cmp-na {color:#cbd5e1}
.cmp-foot-note {margin-top:14px;font-size:12px;color:#94a3b8}
/* 空状态 */
.cmp-empty {
text-align:center;padding:70px 20px;background:#fff;
border:1px dashed #dbe6f2;border-radius:12px;
}
.cmp-empty-icon {font-size:44px;color:#93b8e8;margin-bottom:12px}
.cmp-empty h3 {margin:0 0 8px;font-size:18px;color:#1a1a2e}
.cmp-empty p {margin:0 0 20px;font-size:14px;color:#64748b}
.cmp-empty-btn {
display:inline-block;padding:10px 32px;border-radius:8px;
background:#8A6540;color:#fff;font-size:14px;font-weight:600;text-decoration:none;
transition:background .15s;
}
.cmp-empty-btn:hover {background:#A67C52;color:#fff;text-decoration:none}
@media (max-width:640px) {
.cmp-title {font-size:20px}
.cmp-col-key {width:110px;min-width:110px;font-size:12px}
.cmp-col-prod {min-width:160px}
}
/* === 产品视频区块（products.videos JSON） === */
.pd-video-grid {display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:20px}
.pd-video-card {background:var(--bg-white);border:1px solid var(--border);border-radius:var(--radius-sm);padding:16px;box-shadow:var(--shadow)}
.pd-video-title {font-size:16px;font-weight:600;margin:0 0 12px;color:var(--text)}
.pd-video-wrap {overflow:hidden;border-radius:6px;background:#000}
/* mp4：按视频自身比例自适应，杜绝裁剪/变形（含旧标记无修饰类的兜底） */
.pd-video-wrap-mp4 video,
.pd-video-wrap video {display:block;width:100%;max-width:100%;height:auto;border:0;object-fit:contain;background:#000;cursor:pointer}
/* 外链 iframe：保持 16:9 占位自适应 */
.pd-video-wrap-frame {position:relative;padding-bottom:56.25%;height:0}
.pd-video-wrap-frame iframe {position:absolute;top:0;left:0;width:100%;height:100%;border:0}
.pd-video-desc {font-size:13px;color:var(--text-light);margin:10px 0 0;line-height:1.6}
@media (max-width:640px) {
.pd-video-grid {grid-template-columns:1fr}
}
/* === HIOKI 产品概述中的内联视频（原 .hioki-block 缩略图） === */
.hioki-block video {width:100%;max-width:100%;height:auto;display:block;border-radius:6px;background:#000;cursor:pointer;margin:0 0 10px}
/* === HIOKI specs_html 选件/附件列表（ul.hioki-options）：压缩为 3 列缩略图网格 === */
.hioki-options{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;list-style:none;margin:12px 0;padding:0!important}
.hioki-options li{display:flex;flex-direction:column;align-items:center;justify-content:flex-start;gap:5px;padding:8px 6px;border:1px solid var(--border-light);border-radius:8px;text-align:center;background:#fff;margin:0!important}
.hioki-options li img{width:auto!important;height:auto!important;max-width:100%!important;max-height:90px!important;object-fit:contain;border-radius:4px}
.hioki-options li span{display:block;width:100%;font-size:12px;line-height:1.35;color:var(--text-lighter)}
.hioki-options li span strong{display:block;font-size:12px;font-weight:600;color:var(--text);line-height:1.3;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.hioki-options li span a{display:none}
@media (max-width:640px){.hioki-options{gap:6px}.hioki-options li img{width:auto!important;height:auto!important;max-width:100%!important;max-height:72px!important}.hioki-options li span,.hioki-options li span strong{font-size:11px}}
/* === 品牌详情页：品牌视频集锦（按分类分组） === */
.brand-video-intro{margin:0 0 18px;font-size:13px;color:var(--text-light);line-height:1.75}
.brand-video-group{margin-bottom:28px}
.brand-video-group:last-child{margin-bottom:0}
.brand-video-group-title{display:flex;align-items:center;gap:10px;font-size:17px;font-weight:600;color:var(--text);margin:0 0 14px;padding-left:10px;border-left:3px solid var(--primary)}
.brand-video-group-count{flex-shrink:0;padding:1px 10px;border-radius:10px;background:#eef4fd;color:#8A6540;font-size:12px;font-weight:600}
.brand-video-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:16px;align-items:stretch}
.brand-video-card{display:flex;flex-direction:column;background:var(--bg-white);border:1px solid var(--border);border-radius:var(--radius-sm);overflow:hidden;box-shadow:var(--shadow);transition:transform .15s,box-shadow .15s}
.brand-video-card:hover{transform:translateY(-2px);box-shadow:var(--shadow-lg)}
.brand-video-media{position:relative;aspect-ratio:16/9;background:#0b1220;cursor:pointer;overflow:hidden}
.brand-video-media img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .25s}
.brand-video-card:hover .brand-video-media img{transform:scale(1.04)}
.brand-video-play{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:rgba(10,25,50,.30);transition:background .15s}
.brand-video-play i{width:52px;height:52px;border-radius:50%;background:rgba(30,111,217,.92);color:#fff;font-style:normal;font-size:20px;display:flex;align-items:center;justify-content:center;box-shadow:0 4px 16px rgba(0,0,0,.35);transition:transform .15s,background .15s}
.brand-video-media:hover .brand-video-play{background:rgba(10,25,50,.14)}
.brand-video-media:hover .brand-video-play i{transform:scale(1.1);background:#8A6540}
.brand-video-nothumb{width:100%;height:100%;display:flex;align-items:center;justify-content:center;color:rgba(255,255,255,.45);font-size:42px}
.brand-video-media video{width:100%;height:100%;object-fit:contain;display:block;background:#000}
.brand-video-media.is-frame{position:relative}
.brand-video-media.is-frame iframe{position:absolute;top:0;left:0;width:100%;height:100%;border:0}
.brand-video-body{display:flex;flex-direction:column;gap:8px;padding:14px 16px 16px;flex:1}
.brand-video-tag{align-self:flex-start;padding:2px 8px;border-radius:4px;background:#f0f6ff;color:#8A6540;font-size:12px;font-weight:500}
.brand-video-name{margin:0;font-size:15px;font-weight:600;color:var(--text);line-height:1.5;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.brand-video-desc{margin:0;font-size:13px;color:var(--text-light);line-height:1.65;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.brand-video-ctx{margin-top:auto;padding-top:10px;border-top:1px dashed var(--border-light);display:flex;flex-direction:column;gap:4px}
.brand-video-product{font-size:13px;color:#8A6540;text-decoration:none;font-weight:500;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.brand-video-product:hover{color:var(--primary-dark);text-decoration:underline}
.brand-video-pcount{font-size:12px;color:var(--text-lighter)}
@media (max-width:1024px){.brand-video-grid{grid-template-columns:repeat(auto-fill,minmax(240px,1fr))}}
@media (max-width:640px){
.brand-video-grid{grid-template-columns:1fr;gap:12px}
.brand-video-group-title{font-size:16px}
.brand-video-play i{width:46px;height:46px;font-size:18px}
}
/* ============================================
视频中心 v1.0 — 列表页 + 播放页（2026-08-25）
============================================ */
/* ---------- 页面头部 ---------- */
.page-header-videos {
background: linear-gradient(135deg, #3E342E 0%, var(--primary) 55%, #1e4a7a 100%);
}
.page-header-videos h1 { letter-spacing: 1px; }
/* ---------- 列表页主布局 ---------- */
.video-layout {
display: flex;
gap: 28px;
margin-top: 24px;
align-items: flex-start;
}
.video-main { min-width: 0; }
.video-cat-empty { color: var(--text-lighter); font-size: 13px; padding: 8px 0; }
/* 视频库统计卡片 */
.video-lib-stat {
display: flex;
align-items: center;
justify-content: space-between;
gap: 8px;
padding: 4px 2px;
}
.vls-row { flex: 1; text-align: center; }
.vls-row strong { display: block; font-size: 26px; font-weight: 800; color: var(--primary); line-height: 1.2; }
.vls-row span { font-size: 12px; color: var(--text-light); }
.vls-divider { width: 1px; align-self: stretch; background: var(--border-light); }
.video-lib-tip { margin-top: 12px; font-size: 12px; color: var(--text-lighter); line-height: 1.6; border-top: 1px dashed var(--border-light); padding-top: 10px; }
/* ---------- 分组节 ---------- */
.video-group-section { margin-bottom: 36px; }
.video-group-head {
display: flex;
align-items: baseline;
gap: 12px;
flex-wrap: wrap;
padding-bottom: 10px;
margin-bottom: 14px;
border-bottom: 2px solid var(--border-light);
}
.video-group-name { font-size: 20px; font-weight: 800; color: var(--text); position: relative; }
.video-group-name::before {
content: '';
display: inline-block;
width: 4px; height: 18px;
border-radius: 2px;
background: var(--primary);
margin-right: 10px;
vertical-align: -3px;
}
.video-group-cnt {
font-size: 13px;
color: var(--primary);
background: rgba(30, 86, 148, 0.08);
padding: 2px 10px;
border-radius: 999px;
font-weight: 600;
}
.video-group-more { margin-left: auto; font-size: 13px; color: var(--primary); font-weight: 600; text-decoration: none; }
.video-group-more:hover { text-decoration: underline; }
.video-group-desc { font-size: 13px; color: var(--text-light); margin: -6px 0 14px; line-height: 1.7; }
/* ---------- 视频缩略图卡片网格 ---------- */
.video-card-grid {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(230px, 1fr));
gap: 18px;
}
.video-thumb-card {
display: flex;
flex-direction: column;
background: var(--bg-white);
border: 1px solid var(--border);
border-radius: var(--radius);
overflow: hidden;
text-decoration: none;
transition: var(--transition);
}
.video-thumb-card:hover {
transform: translateY(-3px);
box-shadow: 0 10px 26px rgba(62,52,46, 0.14);
border-color: rgba(30, 86, 148, 0.4);
}
.vtc-cover {
position: relative;
display: block;
aspect-ratio: 16 / 9;
background: linear-gradient(135deg, #16324f 0%, #3E342E 100%);
overflow: hidden;
}
.vtc-cover img {
width: 100%; height: 100%;
object-fit: cover;
display: block;
transition: transform .35s ease;
}
.video-thumb-card:hover .vtc-cover img { transform: scale(1.06); }
.vtc-nothumb {
position: absolute; inset: 0;
display: flex; align-items: center; justify-content: center;
font-size: 40px; opacity: 0.55;
}
.vtc-play {
position: absolute;
left: 50%; top: 50%;
transform: translate(-50%, -50%);
width: 44px; height: 44px;
border-radius: 50%;
background: rgba(62,52,46, 0.62);
border: 2px solid rgba(255, 255, 255, 0.85);
color: #fff;
font-size: 15px;
display: flex; align-items: center; justify-content: center;
padding-left: 3px;
transition: all .25s ease;
pointer-events: none;
}
.video-thumb-card:hover .vtc-play {
background: var(--primary);
transform: translate(-50%, -50%) scale(1.12);
}
.vtc-duration {
position: absolute;
right: 8px; bottom: 8px;
background: rgba(0, 0, 0, 0.72);
color: #fff;
font-size: 11px;
padding: 1px 7px;
border-radius: 4px;
line-height: 1.5;
}
.vtc-title {
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
overflow: hidden;
font-size: 14px;
font-weight: 600;
color: var(--text);
line-height: 1.5;
padding: 10px 12px 2px;
}
.video-thumb-card:hover .vtc-title { color: var(--primary); }
.vtc-meta {
font-size: 12px;
color: var(--text-lighter);
padding: 4px 12px 12px;
}
/* ---------- 视频中心：分组分页 ---------- */
.video-pager { display: none; }
.video-pager.show {
display: flex;
flex-wrap: wrap;
gap: 8px;
align-items: center;
justify-content: center;
margin-top: 22px;
}
.vp-btn {
appearance: none;
border: 1px solid var(--border);
background: var(--bg-white);
color: var(--text);
font-size: 13px;
font-weight: 600;
padding: 7px 14px;
border-radius: var(--radius);
cursor: pointer;
transition: var(--transition);
line-height: 1.4;
}
.vp-btn:hover:not(:disabled) { border-color: var(--primary); color: var(--primary); }
.vp-btn:disabled { opacity: 0.45; cursor: not-allowed; }
.vp-num.active,
.vp-num.active:hover { background: var(--primary); border-color: var(--primary); color: #fff; }
.vp-ellipsis { color: var(--text-lighter); padding: 0 2px; }
.vp-info { margin-left: 10px; font-size: 12.5px; color: var(--text-lighter); }
/* ---------- 播放页：左栏目录树 + 右栏播放 ---------- */
.vp-layout {
display: flex;
gap: 24px;
margin-top: 24px;
align-items: flex-start;
}
.vp-page-header { padding-top: 34px; padding-bottom: 34px; }
.vp-sidebar {
width: 320px;
flex-shrink: 0;
position: sticky;
top: 88px;
max-height: calc(100vh - 108px);
overflow-y: auto;
background: var(--bg-white);
border: 1px solid var(--border);
border-radius: var(--radius);
padding: 10px;
scrollbar-width: thin;
}
.vp-sidebar::-webkit-scrollbar { width: 5px; }
.vp-sidebar::-webkit-scrollbar-thumb { background: rgba(62,52,46, 0.18); border-radius: 3px; }
.vp-group { border-radius: var(--radius-sm); margin-bottom: 4px; }
.vp-group-head {
display: flex;
align-items: center;
gap: 8px;
width: 100%;
padding: 11px 12px;
background: transparent;
border: 0;
border-radius: var(--radius-sm);
cursor: pointer;
text-align: left;
font: inherit;
transition: var(--transition);
}
.vp-group-head:hover { background: var(--bg-light); }
.vpg-name {
flex: 1;
min-width: 0;
font-size: 14px;
font-weight: 700;
color: var(--text);
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.vpg-cnt {
font-size: 11px;
font-weight: 600;
color: var(--text-light);
background: var(--bg-light);
border-radius: 999px;
padding: 1px 8px;
flex-shrink: 0;
}
.vpg-arrow { font-size: 11px; color: var(--text-lighter); transition: transform .25s ease; flex-shrink: 0; }
.vp-group:not(.open) .vpg-arrow { transform: rotate(-90deg); }
.vp-group.current .vpg-name { color: var(--primary); }
.vp-group.current .vpg-cnt { background: rgba(30, 86, 148, 0.12); color: var(--primary); }
.vp-group-body { display: none; flex-direction: column; gap: 4px; padding: 2px 0 8px; }
.vp-group.open .vp-group-body { display: flex; }
.vp-item {
display: flex;
align-items: center;
gap: 10px;
padding: 7px 10px;
border-radius: var(--radius-sm);
text-decoration: none;
transition: var(--transition);
border-left: 3px solid transparent;
}
.vp-item:hover { background: var(--bg-light); }
.vp-item.active {
background: var(--primary);
border-left-color: #B85C38;
}
.vp-item-thumb {
position: relative;
width: 92px;
aspect-ratio: 16 / 9;
flex-shrink: 0;
border-radius: 5px;
overflow: hidden;
background: #3E342E;
}
.vp-item-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.vp-nothumb {
position: absolute; inset: 0;
display: flex; align-items: center; justify-content: center;
font-size: 18px; opacity: 0.6;
}
.vp-item-title {
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
overflow: hidden;
font-size: 13px;
line-height: 1.5;
color: var(--text);
}
.vp-item.active .vp-item-title { color: #fff; font-weight: 600; }
/* ---------- 播放页右栏 ---------- */
.vp-main { flex: 1; min-width: 0; }
.vp-player-box {
position: relative;
width: 100%;
aspect-ratio: 16 / 9;
background: #000;
border-radius: 12px;
overflow: hidden;
box-shadow: 0 14px 34px rgba(62,52,46, 0.22);
}
.vp-player-box video,
.vp-player-box iframe {
display: block;
width: 100%;
height: 100%;
border: 0;
object-fit: contain;
}
.vp-title { font-size: 22px; font-weight: 800; color: var(--text); margin: 18px 0 10px; line-height: 1.4; }
.vp-meta {
display: flex;
align-items: center;
flex-wrap: wrap;
gap: 18px;
font-size: 13px;
color: var(--text-light);
padding-bottom: 14px;
border-bottom: 1px solid var(--border-light);
}
.vp-share-btn {
border: 0;
background: transparent;
color: var(--primary);
font: inherit;
font-size: 13px;
cursor: pointer;
padding: 0;
text-decoration: underline;
}
.vp-share-btn:hover { color: var(--primary-dark); }
.vp-desc {
margin-top: 14px;
font-size: 14px;
line-height: 1.9;
color: var(--text);
background: var(--bg-white);
border: 1px solid var(--border-light);
border-radius: var(--radius);
padding: 16px 18px;
white-space: pre-line;
}
.vp-nav { display: flex; gap: 10px; margin-top: 18px; flex-wrap: wrap; }
.vp-nav-btn { min-width: 110px; text-align: center; }
.vp-back { margin-left: auto; }
/* ---------- 视频中心响应式 ---------- */
@media (max-width: 1024px) {
.video-card-grid { grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 14px; }
}
@media (max-width: 900px) {
.video-layout { flex-direction: column; gap: 16px; }
.video-layout .knowledge-sidebar { width: 100%; position: static; }
.video-card-grid { grid-template-columns: repeat(2, 1fr); gap: 12px; }
.video-group-name { font-size: 18px; }
.vp-layout { flex-direction: column; gap: 16px; }
.vp-sidebar { width: 100%; position: static; max-height: 420px; order: 2; }
.vp-main { order: 1; }
.vp-item-thumb { width: 84px; }
.vp-title { font-size: 18px; }
.vp-desc { font-size: 13px; padding: 12px 14px; }
.vp-nav-btn { min-width: 0; flex: 1; }
.vp-back { margin-left: 0; }
}
@media (max-width: 480px) {
.video-card-grid { grid-template-columns: 1fr 1fr; gap: 10px; }
.vtc-title { font-size: 13px; }
.vls-row strong { font-size: 22px; }
}
/* ================= Keysight 是德科技 富文本规格区 v2.0 ================= */
/* 概述首段 */
.pd-specs-content .ks-desc { font-size: 15px; color: #2c3e50; background: #f4f7fb; border-left: 3px solid #1e56a0; padding: 10px 14px; border-radius: 0 6px 6px 0; margin: 0 0 14px; }
/* PDF 规格书下载按钮 */
.ks-doc-btns { margin: 0 0 18px; }
.ks-doc-btns .ks-pdf-btn { display: inline-flex; align-items: center; gap: 6px; padding: 9px 22px; background: linear-gradient(135deg, #1e56a0, #2d7ad6); color: #fff !important; font-size: 14px; font-weight: 600; border-radius: 6px; text-decoration: none; box-shadow: 0 2px 8px rgba(30, 86, 160, .28); transition: all .2s; }
.ks-doc-btns .ks-pdf-btn:hover { transform: translateY(-1px); box-shadow: 0 4px 14px rgba(30, 86, 160, .4); }
/* overview 扁平化富文本容器 */
.pd-specs-content .ks-ov-rich { margin-bottom: 6px; }
.pd-specs-content .ks-ov-rich h3 { font-size: 18px; font-weight: 700; color: #A67C52; margin: 26px 0 12px; padding-left: 10px; border-left: 4px solid #1e56a0; line-height: 1.4; }
.pd-specs-content .ks-ov-rich h4 { font-size: 16px; font-weight: 700; color: #2c3e50; margin: 20px 0 10px; }
.pd-specs-content .ks-ov-rich p { margin: 0 0 12px; color: #333; }
.pd-specs-content .ks-ov-rich ul, .pd-specs-content .ks-ov-rich ol { margin: 0 0 14px; padding-left: 22px; }
.pd-specs-content .ks-ov-rich li { margin-bottom: 7px; color: #333; line-height: 1.65; }
.pd-specs-content .ks-ov-rich li p { display: inline; margin: 0; }
.pd-specs-content .ks-ov-rich li p + p::before { content: "："; }
.pd-specs-content .ks-ov-rich li p:first-child { font-weight: 600; color: #A67C52; }
/* 富文本图片：覆盖通用满宽规则——大图自适应缩、小图不放大 */
.pd-specs-content .ks-ov-rich img { display: block; width: auto; max-width: 100%; height: auto; margin: 14px auto; border-radius: 6px; box-shadow: 0 2px 10px rgba(0, 0, 0, .08); }
/* 富文本表格（默认满宽斑马纹） */
.pd-specs-content .ks-ov-rich table { width: 100%; border-collapse: collapse; margin: 14px 0; font-size: 14px; }
.pd-specs-content .ks-ov-rich th, .pd-specs-content .ks-ov-rich td { border: 1px solid #e3e8ef; padding: 8px 12px; text-align: left; }
.pd-specs-content .ks-ov-rich th { background: #f0f4f9; color: #A67C52; font-weight: 600; }
.pd-specs-content .ks-ov-rich tr:nth-child(even) td { background: #fafbfd; }
/* 视频容器（16:9） */
.ks-video-wrap { position: relative; width: 100%; max-width: 720px; aspect-ratio: 16 / 9; margin: 14px 0; border-radius: 8px; overflow: hidden; background: #000; box-shadow: 0 3px 12px rgba(0, 0, 0, .18); }
.ks-video-wrap video, .ks-video-wrap iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
/* 旧版图片集兼容（.ks-ov-images） */
.pd-specs-content .ks-ov-images img { display: block; width: auto; max-width: 100%; height: auto; margin: 12px auto; }
@media (max-width: 640px) {
.pd-specs-content .ks-ov-rich h3 { font-size: 16px; }
.pd-specs-content .ks-ov-rich table { font-size: 13px; }
.pd-specs-content .ks-ov-rich th, .pd-specs-content .ks-ov-rich td { padding: 6px 8px; }
}
/* ==================================================
=== iDi 仪迪 产品详情克隆排版（2026-08-26 导入）===
克隆自 idi-e.com 详情页四板块：主要功能/突出优势/技术指标/质量保证
视觉 DNA：品牌蓝 #015bab / 正文 #505258 / 浅灰 #f8f8f8 / 卡片阴影 rgba(3,0,0,.05)
================================================== */
/* --- 区块骨架与标题 --- */
.pd-specs-content .idi-sec { margin: 0 0 48px; }
.pd-specs-content .idi-sec:last-child { margin-bottom: 0; }
.pd-specs-content h2.idi-title { display: flex; align-items: center; justify-content: center; gap: 12px; font-size: 24px; font-weight: 700; color: #015bab; text-align: center; margin: 8px 0 30px; line-height: 1.4; }
.pd-specs-content h2.idi-title::before { content: ""; width: 29px; height: 23px; background: url(/uploads/imglocal/idi_d04aca49.png) center / contain no-repeat; opacity: .9; flex-shrink: 0; }
/* --- 主要功能：66px 圆形图标悬浮卡顶（克隆源站 section3）--- */
.pd-specs-content .idi-gn { display: flex; flex-wrap: wrap; justify-content: center; gap: 44px 24px; padding-top: 33px; }
.pd-specs-content .idi-gn-item { position: relative; flex: 0 0 calc(33.333% - 16px); max-width: calc(33.333% - 16px); background: #fff; border: 1px solid #eef1f6; border-radius: 10px; padding: 46px 22px 24px; text-align: center; box-shadow: 0 4px 16px rgba(3, 0, 0, .05); }
.pd-specs-content .idi-gn-icon { position: absolute; top: -33px; left: 50%; transform: translateX(-50%); width: 66px; height: 66px; border-radius: 50%; background: #f8f8f8; border: 1px solid #e6ebf2; display: flex; align-items: center; justify-content: center; }
/* 2026-09-09 用户裁决：数字放进圆里（计数器自动编号），标题内 em 隐藏 */
.pd-specs-content .idi-gn { counter-reset: idi-gn; }
.pd-specs-content .idi-gn-item { counter-increment: idi-gn; }
.pd-specs-content .idi-gn-icon::before { content: counter(idi-gn, decimal-leading-zero); font: 700 20px/1 Arial, sans-serif; color: #015bab; }
.pd-specs-content .idi-gn-body h3 em { display: none; }
.pd-specs-content .idi-gn-icon img { width: 30px; height: auto; display: block; }
.pd-specs-content .idi-gn-body h3 { font-size: 16px; font-weight: 700; color: #333; margin: 0 0 10px; line-height: 1.4; }
.pd-specs-content .idi-gn-body h3 em { font-style: normal; color: #015bab; font-family: Arial, sans-serif; margin-right: 6px; }
.pd-specs-content .idi-gn-body p { font-size: 14px; color: #666; line-height: 1.8; margin: 0; }
/* --- 突出优势：背景图 + 方形白卡一行 5 张 + 大数字水印（2026-08-26 圆卡改方卡一行）--- */
.pd-specs-content .idi-sec-tc .idi-tc { background: #f0f4f8 url(/uploads/imglocal/idi_e4ccb5a9.jpg) center top / cover no-repeat; border-radius: 12px; padding: 6px 26px 34px; }
.pd-specs-content .idi-tc-grid { display: flex; flex-wrap: wrap; justify-content: center; gap: 24px 16px; }
.pd-specs-content .idi-tc-item { position: relative; flex: 0 0 calc(20% - 13px); max-width: calc(20% - 13px); background: #fff; border-radius: 12px; box-shadow: 0 0 20px rgba(3, 0, 0, .06); display: flex; flex-direction: column; align-items: center; justify-content: flex-start; text-align: center; padding: 36px 13px 20px; overflow: hidden; }
.pd-specs-content .idi-tc-num { position: relative; width: 100%; }
.pd-specs-content .idi-tc-n { position: absolute; left: 50%; top: -26px; transform: translateX(-50%); font: 700 52px / 1 Arial, sans-serif; color: #015bab; opacity: .1; pointer-events: none; white-space: nowrap; }
.pd-specs-content .idi-tc-num h3 { font-size: 16px; font-weight: 700; color: #015bab; margin: 0 0 8px; position: relative; line-height: 1.4; }
.pd-specs-content .idi-tc-item p { font-size: 12.5px; color: #666; line-height: 1.7; margin: 0; position: relative; }
/* --- 技术指标：清洗后的源站富文本（克隆源站 section2）--- */
.pd-specs-content .idi-cs { font-size: 15px; color: #505258; line-height: 1.9; word-break: break-word; }
.pd-specs-content .idi-cs p { margin: 8px 0; }
.pd-specs-content .idi-cs h2 { font-size: 19px; font-weight: 700; color: #015bab; margin: 26px 0 12px; line-height: 1.5; border-left: 0; padding-left: 0; }
.pd-specs-content .idi-cs h2:empty,
.pd-specs-content .idi-cs h2 > br:only-child { display: none; }
.pd-specs-content .idi-cs h3 { font-size: 16px; font-weight: 700; color: #333; margin: 18px 0 10px; line-height: 1.5; }
.pd-specs-content .idi-cs strong { color: #333; }
.pd-specs-content .idi-cs img { display: block; width: auto; max-width: 100%; height: auto; margin: 14px auto; border-radius: 6px; }
/* --- 质量保证：浅灰底 + 蓝点列表 + A-F 字母卡（克隆源站 section5）--- */
.pd-specs-content .idi-zl { background: #f8f8f8; border-radius: 12px; padding: 28px 30px 26px; }
.pd-specs-content .idi-zl-intro { font-size: 15px; color: #505258; line-height: 1.9; margin: 0 0 14px; }
.pd-specs-content .idi-zl-list { list-style: none; margin: 0 0 6px; padding: 0; }
.pd-specs-content .idi-zl-list li { position: relative; padding-left: 18px; font-size: 15px; color: #505258; line-height: 1.9; margin: 6px 0; }
.pd-specs-content .idi-zl-list li::before { content: ""; position: absolute; left: 0; top: 11px; width: 8px; height: 8px; border-radius: 50%; background: #015bab; }
.pd-specs-content .idi-zl-letters { list-style: none; display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; margin: 16px 0; padding: 0; }
.pd-specs-content .idi-zl-letters li { background: #fff; border-radius: 10px; padding: 18px 14px; text-align: center; box-shadow: 0 2px 10px rgba(3, 0, 0, .04); display: flex; flex-direction: column; align-items: center; gap: 10px; margin: 0; }
.pd-specs-content .idi-zl-letters .letter { width: 46px; height: 46px; border-radius: 50%; background: #fff; border: 1px solid #dbe6f2; color: #015bab; font: 700 20px / 44px Arial, sans-serif; text-align: center; box-shadow: 0 2px 8px rgba(3, 0, 0, .05); }
.pd-specs-content .idi-zl-letters li p { font-size: 13.5px; color: #666; line-height: 1.7; margin: 0; }
.pd-specs-content .idi-zl-tail { font-size: 15px; color: #505258; line-height: 1.9; margin: 14px 0 0; }
/* --- iDi 响应式 --- */
@media (max-width: 900px) {
.pd-specs-content .idi-gn-item { flex: 0 0 calc(50% - 12px); max-width: calc(50% - 12px); }
.pd-specs-content .idi-tc-grid { gap: 16px 10px; }
.pd-specs-content .idi-tc-item { flex: 0 0 calc(33.333% - 11px); max-width: calc(33.333% - 11px); padding: 28px 9px 16px; }
.pd-specs-content .idi-tc-n { font-size: 42px; top: -21px; }
.pd-specs-content .idi-tc-num h3 { font-size: 15px; }
.pd-specs-content .idi-tc-item p { font-size: 12px; }
.pd-specs-content .idi-zl-letters { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 600px) {
.pd-specs-content .idi-sec { margin-bottom: 34px; }
.pd-specs-content h2.idi-title { font-size: 20px; margin-bottom: 22px; gap: 8px; }
.pd-specs-content h2.idi-title::before { width: 22px; height: 18px; }
.pd-specs-content .idi-gn { gap: 30px 10px; padding-top: 26px; }
.pd-specs-content .idi-gn-item { flex: 0 0 calc(50% - 8px); max-width: calc(50% - 8px); padding: 34px 10px 18px; }
.pd-specs-content .idi-gn-icon { top: -26px; width: 52px; height: 52px; }
.pd-specs-content .idi-gn-icon::before { font-size: 16px; }
.pd-specs-content .idi-gn-icon img { width: 24px; }
.pd-specs-content .idi-gn-body h3 { font-size: 14px; margin-bottom: 6px; }
.pd-specs-content .idi-gn-body p { font-size: 12px; line-height: 1.65; }
.pd-specs-content .idi-tc-grid { gap: 14px 10px; }
.pd-specs-content .idi-tc-item { flex: 0 0 calc(50% - 8px); max-width: calc(50% - 8px); padding: 24px 12px 16px; }
.pd-specs-content .idi-tc-n { font-size: 40px; top: -20px; }
.pd-specs-content .idi-zl { padding: 20px 16px; }
.pd-specs-content .idi-zl-letters { grid-template-columns: repeat(2, 1fr); gap: 10px; }
.pd-specs-content .idi-zl-letters .letter { width: 38px; height: 38px; font: 700 16px / 36px Arial, sans-serif; }
.pd-specs-content .idi-zl-letters li p { font-size: 12px; }
}
/* ==================================================
ConST 康斯特 详情页规格参数（2026-08-26 导入 162 款）
克隆自 constgroup.com 详情页 tab：产品详情/订购信息/应用图集/产品问答
视觉 DNA：康斯特蓝 #0e90d2 / 正文 #444 / 浅灰底 #f8f8f8 / 表格斑马纹
================================================== */
/* --- 区块骨架与标题（2026-08-26 收紧行间距）--- */
.pd-specs-content .const-sec { margin: 0 0 26px; }
.pd-specs-content .const-sec:last-child { margin-bottom: 0; }
.pd-specs-content h2.const-title { display: flex; align-items: center; justify-content: center; gap: 10px; font-size: 20px; font-weight: 700; color: #0e90d2; text-align: center; margin: 4px 0 14px; line-height: 1.35; }
.pd-specs-content h2.const-title::before, .pd-specs-content h2.const-title::after { content: ""; width: 36px; height: 2px; background: linear-gradient(90deg, transparent, #0e90d2); flex-shrink: 0; }
.pd-specs-content h2.const-title::after { background: linear-gradient(270deg, transparent, #0e90d2); }
/* --- 产品详情（清洗后的源站富文本：h2 小节 + 选型表格 + 插图）--- */
.pd-specs-content .const-xq { font-size: 15px; color: #444; line-height: 1.65; word-break: break-word; }
.pd-specs-content .const-xq p { margin: 6px 0; }
.pd-specs-content .const-xq h2 { font-size: 18px; font-weight: 700; color: #0e90d2; margin: 16px 0 8px; line-height: 1.4; padding-left: 12px; border-left: 4px solid #0e90d2; }
.pd-specs-content .const-xq h3 { font-size: 15.5px; font-weight: 700; color: #333; margin: 12px 0 6px; line-height: 1.4; }
.pd-specs-content .const-xq strong { color: #222; }
.pd-specs-content .const-xq img { display: block; width: auto; max-width: 100%; height: auto; margin: 8px auto; border-radius: 6px; }
.pd-specs-content .const-xq ul, .pd-specs-content .const-xq ol { padding-left: 22px; margin: 6px 0; }
/* --- 订购信息 / 选型表格（表头蓝底 + 斑马纹 + 横向滚动）--- */
.pd-specs-content .const-pj { font-size: 14.5px; color: #444; line-height: 1.65; }
.pd-specs-content .const-scroll { overflow-x: auto; -webkit-overflow-scrolling: touch; margin: 8px 0; }
.pd-specs-content .const-xq table, .pd-specs-content .const-pj table { border-collapse: collapse; width: 100%; min-width: 480px; background: #fff; font-size: 13px; }
.pd-specs-content .const-xq table th, .pd-specs-content .const-pj table th { background: #0e90d2; color: #fff; font-weight: 600; padding: 7px 10px; border: 1px solid #0c7fbd; white-space: nowrap; }
.pd-specs-content .const-xq table td, .pd-specs-content .const-pj table td { padding: 6px 10px; border: 1px solid #e2e8ef; color: #444; line-height: 1.5; }
.pd-specs-content .const-xq table tr:nth-child(even) td, .pd-specs-content .const-pj table tr:nth-child(even) td { background: #f6fafd; }
.pd-specs-content .const-xq table img, .pd-specs-content .const-pj table img { max-width: 120px; height: auto; margin: 0; display: inline-block; }
/* --- 应用图集（固定一行 5 个；兼容裸 img —— 前台 clean_word_paste 会剥 包装）--- */
.pd-specs-content .const-yy { display: grid; grid-template-columns: repeat(5, 1fr); gap: 10px; }
.pd-specs-content .const-yy-item { display: block; background: #fff; border: 1px solid #e8edf3; border-radius: 8px; overflow: hidden; transition: box-shadow .2s; }
.pd-specs-content .const-yy-item:hover { box-shadow: 0 6px 18px rgba(14, 144, 210, .18); }
.pd-specs-content .const-yy > img, .pd-specs-content .const-yy-item img { width: 100%; height: auto; aspect-ratio: 4 / 3; object-fit: cover; display: block; }
.pd-specs-content .const-yy > img { border: 1px solid #e8edf3; border-radius: 8px; background: #fff; }
/* 应用图集 hover 浮现大图（不跳转） */
.pd-specs-content .const-yy-item { position: relative; cursor: default; }
.pd-specs-content .const-yy-item a { pointer-events: none; }
.const-yy-preview {
position: absolute;
left: 0;
top: 0;
width: 320px;
height: 240px;
margin: 0;
background: #fff;
border: 1px solid #e8edf3;
border-radius: 8px;
box-shadow: 0 12px 32px rgba(0,0,0,.18);
display: flex;
align-items: center;
justify-content: center;
z-index: 1000;
pointer-events: none;
overflow: hidden;
animation: constYyPreviewIn .18s ease-out;
}
.const-yy-preview img {
width: 100%;
height: 100%;
object-fit: contain;
aspect-ratio: auto;
display: block;
}
/* 覆盖缩略图规则（.const-yy-item img 的 aspect-ratio:4/3 + cover 优先级更高，会把预览图裁成局部放大） */
.pd-specs-content .const-yy-item .const-yy-preview img {
aspect-ratio: auto;
object-fit: contain;
}
@keyframes constYyPreviewIn {
from { opacity: 0; transform: scale(.92); }
to { opacity: 1; transform: scale(1); }
}
/* --- 产品问答（编号徽章 + 摘要卡）--- */
.pd-specs-content .const-qa { border-top: 1px solid #e8edf3; }
.pd-specs-content .const-qa-item { border-bottom: 1px solid #e8edf3; padding: 10px 4px; }
.pd-specs-content .const-qa-q { display: flex; align-items: baseline; gap: 10px; font-size: 15px; font-weight: 700; color: #333; line-height: 1.5; }
.pd-specs-content .const-qa-q i { font-style: normal; flex-shrink: 0; min-width: 26px; height: 22px; padding: 0 5px; border-radius: 11px; background: #0e90d2; color: #fff; font: 600 12px / 22px Arial, sans-serif; text-align: center; transform: translateY(-2px); }
.pd-specs-content .const-qa-a { margin: 5px 0 0 36px; font-size: 14px; color: #666; line-height: 1.6; }
/* --- ConST 响应式 --- */
@media (max-width: 900px) {
.pd-specs-content h2.const-title { font-size: 18px; }
.pd-specs-content .const-yy { grid-template-columns: repeat(3, 1fr); gap: 8px; }
}
@media (max-width: 600px) {
.pd-specs-content .const-sec { margin-bottom: 18px; }
.pd-specs-content .const-yy { grid-template-columns: repeat(2, 1fr); }
.pd-specs-content .const-qa-a { margin-left: 0; }
.pd-specs-content .const-xq table, .pd-specs-content .const-pj table { min-width: 420px; }
}
/* --- ERICHSEN 规格参数板块（er-sec 结构化重建 v9.74）--- */
.pd-specs-content .er-sec { margin: 0 0 26px; }
.pd-specs-content .er-sec:last-child { margin-bottom: 0; }
.pd-specs-content .er-title { display: flex; align-items: center; font-size: 17px; font-weight: 700; color: #A67C52; margin: 0 0 14px; }
.pd-specs-content .er-title::before { content: ''; display: inline-block; width: 5px; height: 17px; border-radius: 2px; background: #8A6540; margin-right: 9px; }
.pd-specs-content .er-body p { margin: 0 0 12px; line-height: 1.85; font-size: 15px; color: #1e293b; }
.pd-specs-content .er-body h4.er-h { font-size: 15px; font-weight: 700; color: #8A6540; margin: 18px 0 10px; padding-left: 10px; border-left: 3px solid #B85C38; }
.pd-specs-content .er-body img { display: block; max-width: 100%; height: auto; margin: 10px auto; border-radius: 6px; border: 1px solid #e2e8f0; }
.pd-specs-content .er-arg-table { width: 100%; border-collapse: collapse; font-size: 14px; margin: 0 0 16px; background: #fff; }
.pd-specs-content .er-arg-table th, .pd-specs-content .er-arg-table td { border: 1px solid #d9e2ec; padding: 10px 14px; text-align: left; vertical-align: top; word-break: break-word; }
.pd-specs-content .er-arg-table th { width: 30%; background: #f0f6ff; color: #A67C52; font-weight: 600; }
.pd-specs-content .er-arg-table tr:nth-child(even) th, .pd-specs-content .er-arg-table tr:nth-child(even) td { background: #f8fafc; }
.pd-specs-content .er-arg-table tr.er-grp th, .pd-specs-content .er-arg-table tr.er-grp td { background: #e6effc !important; font-weight: 700; color: #A67C52; }
.pd-specs-content .er-arg-table.er-tb th, .pd-specs-content .er-arg-table.er-tb td { width: auto; }
/* ERICHSEN 响应式 */
@media (max-width: 600px) {
.pd-specs-content .er-sec { margin-bottom: 18px; }
.pd-specs-content .er-title { font-size: 16px; }
.pd-specs-content .er-body p { font-size: 14px; }
.pd-specs-content .er-arg-table { font-size: 13px; }
.pd-specs-content .er-arg-table th, .pd-specs-content .er-arg-table td { padding: 8px 10px; }
.pd-specs-content .er-arg-table { display: block; overflow-x: auto; }
}
/* ============================================
UNI-T 优利德 规格4板块扩展（视频/问答）v9.75
作用域：.pd-specs-content（产品详情规格参数栏）
============================================ */
.pd-specs-content .er-sec-video .er-title::before { content: "▶ "; }
.pd-specs-content .er-sec-qa .er-title::before { content: "Q "; }
.pd-specs-content .er-imgs { display: flex; flex-wrap: wrap; gap: 10px; margin: 0 0 14px; }
.pd-specs-content .er-imgs img { max-width: 48%; flex: 1 1 40%; min-width: 180px; border: 1px solid var(--border); border-radius: var(--radius-sm); }
.pd-specs-content .er-video-item { margin: 0 0 18px; }
.pd-specs-content .er-video-item:last-child { margin-bottom: 0; }
.pd-specs-content .er-video-name { font-size: 15px; font-weight: 700; color: var(--primary); margin: 0 0 8px; }
.pd-specs-content .er-video-box { position: relative; max-width: 853px; margin: 0 auto; } /* 640px 放大 1/3 + 栏内居中 */
.pd-specs-content .er-video-player { width: 100%; max-width: 853px; aspect-ratio: 16 / 9; border-radius: var(--radius-sm); background: #000; display: block; }
.pd-specs-content .er-qa-item { border: 1px solid var(--border); border-radius: var(--radius-sm); margin: 0 0 10px; overflow: hidden; background: var(--bg-white); }
.pd-specs-content .er-qa-item:last-child { margin-bottom: 0; }
.pd-specs-content .er-qa-q { background: #f0f6ff; padding: 10px 14px; font-weight: 700; color: var(--primary); border-bottom: 1px solid var(--border); }
.pd-specs-content .er-qa-q::before { content: "问："; color: var(--primary-light); }
.pd-specs-content .er-qa-a { padding: 10px 14px; line-height: 1.75; color: var(--text); font-size: 14px; }
.pd-specs-content .er-qa-a::before { content: "答："; color: var(--success); font-weight: 700; }
@media (max-width: 768px) {
.pd-specs-content .er-imgs img { max-width: 100%; flex-basis: 100%; }
.pd-specs-content .er-video-player { max-width: 100%; }
}
/* ===== 站内全屏视频（保留本站页头页脚，2026-08-27） ===== */
.er-video-item, .pd-video-wrap-mp4 { position: relative; }
.er-video-box { position: relative; }
.er-video-fs-btn {
position: absolute; top: 8px; right: 8px; z-index: 6;
display: inline-flex; align-items: center; gap: 5px;
padding: 5px 11px; border: 0; border-radius: 5px;
background: rgba(166,124,82, .82); color: #fff; font-size: 12.5px; line-height: 1.4;
cursor: pointer; opacity: .95; transition: opacity .2s, background .2s;
-webkit-backdrop-filter: blur(3px); backdrop-filter: blur(3px);
box-shadow: 0 1px 8px rgba(0, 0, 0, .35);
}
.er-video-fs-btn:hover { opacity: 1; background: #8A6540; }
.er-video-fs-btn svg { flex: none; }
.er-video-fs-active {
position: fixed !important; top: var(--header-h); left: 0; right: 0; bottom: 0;
z-index: 9999; margin: 0 !important; padding: 0 !important;
max-width: none !important; width: 100%;
background: #000; display: flex; align-items: center; justify-content: center;
box-shadow: none !important; border-radius: 0 !important;
}
.er-video-fs-active .er-video-player,
.er-video-fs-active video {
max-width: none !important; width: 100%; height: 100%;
aspect-ratio: auto; object-fit: contain; border-radius: 0;
}
body.er-video-fs-lock { overflow: hidden; }
.er-video-fs-hdr { position: fixed !important; top: 0; left: 0; right: 0; z-index: 10001; }
/* 品牌详情页视频站内全屏（2026-09-04，video-site-fullscreen.js v1.3）：
.brand-video-media 自身作为全屏容器，需解除 16/9 锁定让视频铺满页头下方 */
.er-video-fs-active.brand-video-media { aspect-ratio: auto; }
.er-video-fs-bar {
position: fixed; left: 0; right: 0; bottom: 0; height: 34px; z-index: 10000;
background: #0b1220; color: #94a3b8; font-size: 12px;
display: flex; align-items: center; justify-content: center; gap: 14px;
border-top: 1px solid rgba(255, 255, 255, .08);
}
.er-video-fs-bar b { color: #fff; font-weight: 600; }
.er-video-fs-bar kbd { background: rgba(255,255,255,.1); border: 1px solid rgba(255,255,255,.2); border-radius: 3px; padding: 0 6px; font-size: 11px; color: #e2e8f0; }
@media (hover: none) { .er-video-fs-btn { opacity: .9; } }
@media (max-width: 640px) {
.er-video-fs-bar { font-size: 11px; gap: 8px; }
.er-video-fs-bar span:nth-child(3) { display: none; }
}
/* ===== FAQ 正文视频：站内框播放控制（2026-09-03，配合 video-site-fullscreen.js v1.2） =====
手风琴答案(.faq-acc-answer)与 FAQ 详情页(.faq-detail-body)中的每个