/* ============================================================
   FangService Style Theme
   仿照 fangservice.com 的字体、字号、配色与组件风格
   适用于 www.highqualitydisplay.com 全站
   ============================================================ */

/* ---------- 1. Inter 可变字体（自托管） ---------- */
@font-face {
  font-family: 'Inter';
  src: url('../fonts/InterVariable.woff2') format('woff2');
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}

/* ---------- 2. 设计变量覆盖（原站 CSS 变量） ---------- */
:root {
  /* 字体族：Inter */
  --fontfamily: 'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif !important;

  /* 配色：FangService 蓝调 */
  --color: #2B6A9F;                 /* 主强调色（原为绿色 #1CCE7E） */
  --color1: #1E4663;                /* 深蓝主色（原为 #0098F5） */
  --hovercolor: #EFF3F8;            /* 悬停浅底 */
  --fontcolor: #1A2634;             /* 正文色 */
  --headercolor: #FFFFFF;
  --footercolor: #0E1C2A;           /* 页脚深色 */
  --introcolor: #5B7188;            /* 次要文字 */
  --bgcolor: linear-gradient(135deg, #1E4663, #2B6A9F);  /* 渐变 */

  /* 圆角：FangService 大圆角 */
  --borderradius: 24px;

  /* 字号体系：对齐 FangService，按欧美客户阅读习惯放大
     （原站最小 12px 偏小，统一抬高到 ≥13px；正文 16px；标题按 FangService 比例） */
  --fontsize12: 13px;
  --fontsize13: 14px;
  --fontsize14: 15px;
  --fontsize15: 15.5px;
  --fontsize16: 16px;
  --fontsize17: 17px;
  --fontsize18: 18px;
  --fontsize20: 20px;
  --fontsize22: 22px;
  --fontsize24: 24px;
  --fontsize26: 26px;
  --fontsize28: 28px;
  --fontsize30: 30px;
  --fontsize32: 32px;
  --hometitlefont: 36px;

  /* 字重 */
  --fontbold3: 300;
  --fontbold4: 400;
  --fontbold5: 500;
  --fontbold6: 600;
  --fontbold7: 700;
  --fontbold8: 800;
  --fontbold9: 900;

  /* FangService 扩展色板 */
  --fs-dark: #0B2B3F;
  --fs-primary: #1E4663;
  --fs-accent: #2B6A9F;
  --fs-text: #1A2634;
  --fs-text-2: #2C3E50;
  --fs-text-3: #4A5B6E;
  --fs-muted: #5B7188;
  --fs-bg-1: #F8FAFE;
  --fs-bg-2: #F0F4F9;
  --fs-bg-3: #E8F0F8;
  --fs-border: #EFF3F8;
  --fs-border-2: #DFE9F3;
  --fs-footer-bg: #0E1C2A;
  --fs-footer-text: #BBD1E6;
}

/* ---------- 3. 基础排版 ---------- */
html { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; text-rendering: optimizeLegibility; }

body {
  font-family: 'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif !important;
  color: #1A2634 !important;
  line-height: 1.6 !important;
  font-weight: 400;
  font-size: 16px;
  letter-spacing: -0.005em;
}

/* 强制全站使用 Inter（含内联 font-family 的元素），图标字体除外 */
body *:not(.iconfont):not([class^="icon-"]):not([class*=" icon-"]) {
  font-family: 'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif !important;
}
/* 图标字体保持原字体，避免图标错乱 */
.iconfont, [class^="icon-"], [class*=" icon-"] {
  font-family: 'iconfont' !important;
}

/* ---------- 4. 标题层级（对齐 FangService） ---------- */
/* 注意：颜色不加 !important，避免破坏深色背景上的白色标题 */
h1, .h1 {
  font-family: 'Inter', sans-serif !important;
  font-weight: 800 !important;
  line-height: 1.32 !important;
  color: #1E4663;
  letter-spacing: -0.02em;
}
h2, .h2 {
  font-family: 'Inter', sans-serif !important;
  font-weight: 700 !important;
  line-height: 1.35 !important;
  color: #1E4663;
  letter-spacing: -0.015em;
}
h3, .h3 {
  font-family: 'Inter', sans-serif !important;
  font-weight: 700 !important;
  line-height: 1.4 !important;
  color: #1E4663;
}
h4, h5, h6 {
  font-family: 'Inter', sans-serif !important;
  font-weight: 600 !important;
  color: #1E4663;
  line-height: 1.45 !important;
}
p { line-height: 1.75; }

/* 深色背景上的标题保持白色（FangService 渐变区块） */
.page-header h1, .page-header h2, .page-header h3,
.cta-block h1, .cta-block h2, .cta-block h3,
[class*="banner"] h1, [class*="banner"] h2, [class*="banner"] h3,
[class*="banner"] .title, [class*="banner"] .name {
  color: #FFFFFF !important;
}

/* ---------- 5. 链接 ---------- */
a { color: #2B6A9F; transition: color .2s ease; }
a:hover { color: #1E4663; }
a:visited { color: #1E4663; }

/* 按钮/胶囊类链接：visited 后必须保持原色。
   否则白字会被 a:visited 刷成深蓝，与深色按钮底同色 → 文字"消失"。
   （FangService 原文同样用 .btn-primary:visited{color:#fff} 处理此问题） */
a.btn-primary, a.btn-primary:visited, a.btn-primary:hover { color: #FFFFFF !important; }
a.home-more, a.home-more:visited { color: #FFFFFF !important; }
a.btn-light, a.btn-light:visited, a.btn-light:hover { color: #1E4663 !important; }
a.btn-ghost, a.btn-ghost:visited, a.btn-ghost:hover { color: #1E4663 !important; }
.btn-item a, .btn-item a:visited { color: #FFFFFF !important; }
/* 其它常见的按钮式链接 */
a.more-btn, a.more-btn:visited, a.read-more, a.read-more:visited { color: #FFFFFF !important; }

/* ---------- 6. 布局容器（对齐 FangService 1280px / 32px） ---------- */
.l-wrap {
  max-width: 1280px !important;
  padding: 0 32px !important;
}
@media (max-width: 768px) {
  .l-wrap { padding: 0 20px !important; }
}

/* ---------- 7. 按钮 / CTA ---------- */
.home-more,
.btn-item,
.more,
.btn,
button.btn,
input[type="submit"],
input[type="button"] {
  border-radius: 40px !important;
  font-weight: 600 !important;
  font-family: 'Inter', sans-serif !important;
  transition: all .25s ease !important;
}
.home-more:hover,
.btn-item:hover,
.more:hover,
.btn:hover {
  transform: translateY(-2px);
}

/* ---------- 8. 顶部导航栏 ---------- */
.head-top {
  background: linear-gradient(135deg, #1E4663, #2B6A9F) !important;
  color: #FFFFFF !important;
}
.head-info {
  background: #FFFFFF !important;
  box-shadow: 0 2px 12px rgba(0,20,40,.04);
}
.head-nav .nav-ul > li > a,
.head-nav a {
  font-weight: 500 !important;
  color: #2C3E50 !important;
  transition: color .2s;
}
.head-nav a:hover,
.head-nav .active > a {
  color: #2B6A9F !important;
}
.head-logo,
.head-logo a {
  font-weight: 800 !important;
  color: #0B2B3F !important;
}

/* ---------- 9. 区块标题（FangService 下划线标题） ---------- */
.home-title {
  color: #1E4663 !important;
}
.home-title h2,
.home-title .title,
.home-title .name {
  color: #1E4663 !important;
  font-weight: 700 !important;
}
.home-title::after {
  background: #2B6A9F !important;
}

/* ---------- 10. 卡片 / 内容块 ---------- */
.homepro-recommend-item,
.service-card,
.item,
.lazy-wrap,
.LiProCateOne,
.indexadv-right .icon,
.info,
.content {
  border-radius: 24px !important;
}
.homepro-recommend-item,
.lazy-wrap {
  border: 1px solid #EFF3F8 !important;
  background: #FFFFFF;
  box-shadow: 0 8px 20px rgba(0,0,0,.03) !important;
  transition: all .25s ease !important;
  overflow: hidden;
}
.homepro-recommend-item:hover,
.lazy-wrap:hover {
  transform: translateY(-5px);
  box-shadow: 0 12px 28px rgba(0,0,0,.08) !important;
}

/* 首页各 section 背景（FangService 浅底块） */
.home-indexadv,
.home-solution,
.home-application,
.home-news {
  background: #F8FAFE;
}

/* ---------- 11. 页脚 ---------- */
footer,
.foot-main,
.foot-wrap,
.footer {
  background: #0E1C2A !important;
  color: #BBD1E6 !important;
}
.foot-title {
  color: #FFFFFF !important;
  font-weight: 700 !important;
}
.foot-main a,
.foot-list a,
footer a {
  color: #BBD1E6 !important;
  transition: color .2s;
}
.foot-main a:hover,
footer a:hover {
  color: #FFFFFF !important;
}

/* ---------- 12. 表单 ---------- */
input[type="text"],
input[type="email"],
input[type="tel"],
input[type="search"],
textarea,
select {
  border-radius: 16px !important;
  border: 1px solid #DFE9F3 !important;
  font-family: 'Inter', sans-serif !important;
  padding: 10px 16px;
  transition: border-color .2s;
}
input:focus, textarea:focus, select:focus {
  border-color: #2B6A9F !important;
  outline: none;
  box-shadow: 0 0 0 3px rgba(43,106,159,.12);
}

/* ---------- 13. 面包屑 / 分页 ---------- */
.breadcrumb a,
.crumb a { color: #2B6A9F !important; }

/* ---------- 14. 表格 ---------- */
table th {
  background: #F0F4F9;
  color: #1E4663;
  font-weight: 600;
}
table td, table th { border-color: #EFF3F8; }

/* ---------- 15. 图片圆角 ---------- */
.lazy img, .lazy-wrap img, .homepro-recommend-item img {
  border-radius: 0;
}
img.rounded, .rounded img { border-radius: 24px !important; }

/* ---------- 16. 滚动条（细节） ---------- */
::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-track { background: #F0F4F9; }
::-webkit-scrollbar-thumb { background: #BBD1E6; border-radius: 10px; }
::-webkit-scrollbar-thumb:hover { background: #2B6A9F; }

/* ---------- 17. 移动端适配 ---------- */
@media (max-width: 1200px) {
  :root { --hometitlefont: 30px; }
}
@media (max-width: 768px) {
  :root { --hometitlefont: 26px; }
  h1, .h1 { font-size: 1.9rem !important; }
  h2, .h2 { font-size: 1.5rem !important; }
  .home-title h2, .home-title .title { font-size: 1.5rem !important; }
}

/* ============================================================
   18. FangService 外壳结构（内页统一骨架）
   .site-header > .container > .navbar
   .page-header > .container > .breadcrumbs + h1
   .section > .container > .layout > .sidebar + .page-main
   .site-footer > .container > .footer-grid > .footer-col
   ============================================================ */

/* 原站 header 为 position:fixed 且 body 预留 140px 顶距；
   改为 FangService 的 sticky 导航后需要复位 */
body { padding-top: 0 !important; }

.container {
  width: 100% !important;
  max-width: 1280px !important;
  margin: 0 auto !important;
  padding: 0 32px !important;
}
@media (max-width: 768px) { .container { padding: 0 20px !important; } }

/* ---- 18.1 顶部导航 ---- */
.site-header {
  position: sticky !important;
  top: 0 !important;
  left: auto !important;
  transform: none !important;
  width: 100% !important;
  max-width: none !important;
  z-index: 120 !important;
  background: #FFFFFF !important;
  box-shadow: 0 2px 12px rgba(0, 20, 40, .05) !important;
}
.site-header .navbar {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: 18px;
  padding: 18px 0;
}
.site-header .logo {
  font-size: 1.7rem;
  font-weight: 800;
  color: #0B2B3F;
  letter-spacing: -.02em;
  text-decoration: none;
  white-space: nowrap;
}
.site-header .logo span { color: #2B6A9F; }
.site-header .nav-links {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 26px;
  margin: 0;
  padding: 0;
  list-style: none;
}
.site-header .nav-links > li { position: relative; }
.site-header .nav-links > li > a {
  display: block;
  padding: 6px 0;
  font-size: .98rem;
  font-weight: 500;
  color: #2C3E50 !important;
  text-decoration: none;
}
.site-header .nav-links > li > a:hover,
.site-header .nav-links > li > a.active { color: #2B6A9F !important; }
.site-header .nav-links .sub-menu {
  position: absolute;
  top: 100%;
  left: 0;
  min-width: 240px;
  margin: 0;
  padding: 10px 0;
  list-style: none;
  background: #FFFFFF;
  border: 1px solid #EFF3F8;
  border-radius: 16px;
  box-shadow: 0 14px 32px rgba(0, 20, 40, .12);
  opacity: 0;
  visibility: hidden;
  transform: translateY(8px);
  transition: all .22s ease;
  z-index: 130;
}
.site-header .nav-links > li:hover > .sub-menu {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}
.site-header .nav-links .sub-menu a {
  display: block;
  padding: 9px 20px;
  font-size: .93rem;
  color: #2C3E50 !important;
  text-decoration: none;
}
.site-header .nav-links .sub-menu a:hover {
  background: #F0F6FC;
  color: #1E4663 !important;
}
/* 二级下拉（分类 → 子分类），向右弹出 */
.site-header .nav-links .sub-menu li { position: relative; }
.site-header .nav-links .sub-menu li.has-sub2 > a { padding-right: 38px; }
.site-header .nav-links .sub-menu li.has-sub2 > a::after {
  content: '';
  position: absolute;
  right: 20px;
  top: 50%;
  width: 6px;
  height: 6px;
  border-right: 1.6px solid #9FB3C8;
  border-bottom: 1.6px solid #9FB3C8;
  transform: translateY(-50%) rotate(-45deg);
}
.site-header .nav-links .sub-menu li.has-sub2 > .sub-menu {
  top: -10px;
  left: 100%;
  margin-left: 4px;
}
.site-header .nav-links .sub-menu li.has-sub2:hover > .sub-menu {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}

/* 导航搜索框 */
.site-header .nav-search { display: flex; align-items: center; gap: 8px; }
.site-header .nav-search input {
  width: 150px;
  height: 40px;
  padding: 0 16px !important;
  background: #F0F6FC !important;
  border: 1px solid #DFE9F3 !important;
  border-radius: 40px !important;
  font-size: .88rem;
  color: #1A2634;
  transition: all .25s ease;
}
.site-header .nav-search input:focus {
  width: 200px;
  background: #FFFFFF !important;
  border-color: #2B6A9F !important;
  box-shadow: 0 0 0 3px rgba(43, 106, 159, .12);
}
.site-header .nav-search button {
  flex: 0 0 auto;
  width: 40px;
  height: 40px;
  border: none;
  border-radius: 50% !important;
  background: #1E4663 !important;
  color: #FFFFFF !important;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background .25s ease;
}
.site-header .nav-search button:hover { background: #2B6A9F !important; }
.site-header .nav-search button em { color: #FFFFFF !important; font-size: 16px; }
.site-header .btn-primary {
  display: inline-block;
  padding: 12px 26px;
  background: #1E4663 !important;
  color: #FFFFFF !important;
  border-radius: 40px;
  font-size: .95rem;
  font-weight: 600;
  text-decoration: none;
  white-space: nowrap;
  transition: all .25s ease;
}
.site-header .btn-primary:hover {
  background: #2B6A9F !important;
  color: #FFFFFF !important;
  transform: translateY(-2px);
}

/* ---- 18.2 渐变页头 ---- */
/* 顶部宽幅蓝色大横幅：标题一律居中（显式声明 + !important，防止被任何样式覆盖） */
.page-header {
  background: linear-gradient(135deg, #1E4663, #2B6A9F) !important;
  color: #FFFFFF !important;
  padding: 40px 0 !important;
  text-align: center !important;
}
.page-header h1,
.page-header h2,
.page-header h3,
.page-header .page-title,
.page-header p,
.page-header .breadcrumbs {
  text-align: center !important;
}
.page-header .breadcrumbs {
  font-size: .9rem;
  line-height: 1.7;
  color: rgba(255, 255, 255, .85) !important;
  margin-bottom: 14px;
  word-break: break-word;
}
.page-header .breadcrumbs a {
  color: rgba(255, 255, 255, .9) !important;
  text-decoration: none;
}
.page-header .breadcrumbs a:hover {
  color: #FFFFFF !important;
  text-decoration: underline;
}
.page-header .breadcrumbs em,
.page-header .breadcrumbs .iconfont { color: rgba(255, 255, 255, .9) !important; }
.page-header h1 {
  margin: 0 !important;
  font-size: 2.2rem !important;
  font-weight: 800 !important;
  line-height: 1.35 !important;
  color: #FFFFFF !important;
  text-transform: none !important;
}
/* 原本用 <div class="banner-title-h1"> 的页面（正文已有 h1），
   页头标题用 div 呈现，避免同页出现两个 h1 */
.page-header .page-title {
  margin: 0 !important;
  font-size: 2.2rem !important;
  font-weight: 800 !important;
  line-height: 1.35 !important;
  letter-spacing: -.02em;
  color: #FFFFFF !important;
  text-transform: none !important;
}

/* ---- 18.3 正文区块与两栏布局 ---- */
.section { padding: 38px 0 28px !important; }
main { display: block; }
main.pro-main, main.news-main, main.protype-main, main.singgle-main { padding: 0 !important; }
/* 少数页面（如 Cookie Policy）正文直接位于 .prohome-content 中 */
.prohome-content { padding: 32px 0 18px !important; }

.layout {
  display: flex;
  align-items: flex-start;
  gap: 28px;
}
.layout > .sidebar {
  flex: 0 0 280px !important;
  width: 280px !important;
  max-width: 280px !important;
  margin-right: 0 !important;
}
/* 注意：原站 .page-main{flex:1;width:100%}，
   若改成 flex-basis:auto 会以 width:100% 为基准导致两栏换行，必须用 0% */
.layout > .page-main,
.layout > .pro-main {
  flex: 1 1 0% !important;
  min-width: 0;
  width: auto !important;
}

/* 侧栏（对齐 FangService 浅底圆角卡片） */
.layout .sidebar-item {
  background: #F8FAFE !important;
  border: 1px solid #EFF3F8 !important;
  border-radius: 20px !important;
  padding: 18px !important;
  margin-bottom: 14px !important;
}
.layout .sidebar-item:last-child { margin-bottom: 0 !important; }
.layout .sidebar-title {
  font-size: 1.02rem !important;
  font-weight: 700 !important;
  color: #1E4663 !important;
  margin-bottom: 12px !important;
  padding-bottom: 10px !important;
  border-bottom: 2px solid #2B6A9F !important;
  text-transform: none !important;
}
.layout .sidebar-cate { margin: 0; padding: 0; list-style: none; }
.layout .sidebar-cate > li {
  background: #F8FAFE !important;
  border-radius: 10px !important;
  margin-bottom: 4px !important;
  padding: 2px 0;
}
.layout .sidebar-cate > li > a {
  display: block;
  padding: 9px 14px;
  font-size: .95rem;
  font-weight: 600;
  color: #1E4663 !important;
  background: transparent !important;
  border-radius: 10px !important;
  text-transform: none !important;
}
.layout .sidebar-cate > li > a:hover { color: #2B6A9F !important; background: #E8F0F8 !important; }
.layout .sidebar-cate .sub-menu { margin: 0 0 4px; padding: 0 0 0 14px; list-style: none; }
.layout .sidebar-cate .sub-menu a {
  display: block;
  padding: 7px 14px;
  font-size: .9rem;
  color: #4A5B6E !important;
  background: transparent !important;
  border-radius: 8px !important;
}
.layout .sidebar-cate .sub-menu a:hover { color: #2B6A9F !important; background: #F0F4F9 !important; }

/* 侧栏搜索 */
.layout .sidebar-item.search {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 10px 12px !important;
}
.layout .sidebar-item.search input {
  flex: 1 1 auto;
  min-width: 0;
  height: 42px;
  padding: 0 14px !important;
  background: #FFFFFF !important;
  border: 1px solid #DFE9F3 !important;
  border-radius: 12px !important;
  font-size: .92rem;
}
.layout .sidebar-item.search .search-btn {
  flex: 0 0 auto;
  width: 42px;
  height: 42px;
  border: none;
  border-radius: 12px !important;
  background: #1E4663 !important;
  color: #FFFFFF !important;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
}
.layout .sidebar-item.search .search-btn:hover { background: #2B6A9F !important; }
.layout .sidebar-item.search .search-btn em { color: #FFFFFF !important; }

/* 产品详情页图片居中（对齐 FangService） */
.prodetails-content img,
.pro-d-main img,
.prodetails-top img {
  display: block;
  margin: 0 auto;
}
.prodetails-content .kche-t223-img,
.prodetails-content .kche-t222-img,
.prodetails-content .kche-item-img {
  text-align: center;
}
.prodetails-content p img {
  display: block;
  margin: 0 auto;
}

/* 产品详情页蓝色标签栏：保持居左（遵循原站设计），仅修复白字可读性 */
.prodetails-tabs {
  background: linear-gradient(135deg, #1E4663, #2B6A9F) !important;
}
.prodetails-tabs > .container {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  flex-wrap: wrap;
  gap: 4px;
  padding-left: 0;   /* 左内边距交给标签项，保证首个标签文字与正文左边缘对齐 */
}
.prodetails-tabs .prodetails-tabs-item {
  padding: 12px 20px;
  color: #FFFFFF !important;
  font-size: 1.05rem;
  font-weight: 600;
  cursor: pointer;
  position: relative;
}
.prodetails-tabs .prodetails-tabs-item.act {
  font-weight: 800;
}
.prodetails-tabs .prodetails-tabs-item.act::after {
  content: '';
  position: absolute;
  left: 20px;
  right: 20px;
  bottom: 0;
  height: 3px;
  background: #FFFFFF;
}

/* 侧栏热门产品卡片 */
.layout .sidebar-list .item {
  background: #FFFFFF !important;
  border: 1px solid #EFF3F8 !important;
  border-radius: 16px !important;
  padding: 10px !important;
  margin-bottom: 12px !important;
  transition: all .25s ease;
}
.layout .sidebar-list .item:last-child { margin-bottom: 0 !important; }
.layout .sidebar-list .item:hover {
  transform: translateY(-3px);
  box-shadow: 0 10px 22px rgba(0, 20, 40, .08);
}
.layout .sidebar-list .item .title {
  font-size: .9rem !important;
  font-weight: 600 !important;
  color: #1E4663 !important;
  line-height: 1.5;
}
.layout .sidebar-list .item .more {
  font-size: .8rem !important;
  color: #2B6A9F !important;
}

/* 正文内的“发送询盘”区块 */
.protypefeedback {
  background: #F8FAFE !important;
  padding: 48px 0 !important;
  margin-top: 12px;
}
.protypefeedback .inquiry-title {
  font-size: 1.6rem !important;
  font-weight: 700 !important;
  color: #1E4663 !important;
  text-align: center;
  margin-bottom: 24px !important;
  text-transform: none !important;
}

/* ---- 18.4 页脚 ---- */
.site-footer {
  background: #0E1C2A !important;
  color: #BBD1E6 !important;
  padding: 52px 0 24px !important;
  margin-top: 36px !important;
}
.site-footer .footer-grid {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 28px;
}
.site-footer .footer-col { flex: 1 1 200px; min-width: 0; }
.site-footer .footer-col h4 {
  margin: 0 0 14px !important;
  font-size: 1rem !important;
  font-weight: 700 !important;
  color: #FFFFFF !important;
  text-transform: none !important;
}
.site-footer .footer-col ul { margin: 0; padding: 0; list-style: none; }
.site-footer .footer-col li { margin-bottom: 9px; }
.site-footer .footer-col p {
  font-size: .9rem;
  line-height: 1.8;
  color: #BBD1E6 !important;
  word-break: break-word;
}
.site-footer .footer-col a {
  color: #BBD1E6 !important;
  font-size: .9rem;
  text-decoration: none;
}
.site-footer .footer-col a:hover { color: #FFFFFF !important; }
.site-footer .copyright {
  margin-top: 24px;
  padding-top: 20px;
  border-top: 1px solid #2C4054;
  text-align: center;
  font-size: .85rem;
  color: #8FA9C2 !important;
}
.site-footer .copyright a { color: #8FA9C2 !important; text-decoration: none; }
.site-footer .copyright a:hover { color: #FFFFFF !important; }

/* 返回顶部 */
.gotop {
  position: fixed;
  right: 24px;
  bottom: 24px;
  width: 46px;
  height: 46px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background: #1E4663;
  color: #FFFFFF;
  cursor: pointer;
  box-shadow: 0 8px 20px rgba(30, 70, 99, .35);
  z-index: 200;
  transition: all .25s ease;
}
.gotop:hover { background: #2B6A9F; transform: translateY(-3px); }

/* ---- 18.5 外壳响应式 ---- */
@media (max-width: 1024px) {
  .layout { flex-direction: column; gap: 28px; }
  .layout > .sidebar {
    flex: 1 1 auto;
    width: 100%;
    max-width: 100%;
  }
}
@media (max-width: 900px) {
  .site-header .navbar { justify-content: center; text-align: center; }
  .site-header .nav-links { gap: 16px; justify-content: center; }
  .site-header .nav-links .sub-menu { display: none; }
  .site-header .nav-links .sub-menu li.has-sub2 > .sub-menu { display: none; }
  .site-header .nav-search { order: 3; width: 100%; }
  .site-header .nav-search input { flex: 1 1 auto; width: auto; }
  .site-header .nav-search input:focus { width: auto; }
  .page-header { padding: 32px 0 !important; }
  .page-header h1, .page-header .page-title { font-size: 1.7rem !important; }
  .section { padding: 28px 0 22px !important; }
  .site-footer .footer-grid { gap: 28px; }
  .site-footer .footer-col { flex: 1 1 100%; }
}

/* ============================================================
   19. 在线询价表单（仿 fangservice.com 询价表单）
   结构：.form-card（完整版）/ .inq-wrap（紧凑内联版）
   提交：POST /api/contact（Cloudflare Worker + Resend + Turnstile）
         失败时降级 FormSubmit AJAX -> sales@highqualitydisplay.com
   ============================================================ */

/* ---- 19.1 完整表单卡片 ---- */
.form-card {
  background: #FFFFFF;
  border: 1px solid #EFF3F8;
  border-radius: 32px;
  padding: 48px;
  margin: 40px 0;
  box-shadow: 0 12px 32px rgba(0, 0, 0, .05);
}
.form-card .form-sub {
  color: #5B7188;
  font-size: 1rem;
  line-height: 1.75;
  margin: 0 0 28px;
}
.form-card .form-lead {
  font-size: 1.25rem;
  font-weight: 700;
  color: #1E4663;
  margin: 0 0 10px;
}

/* ---- 19.2 表单控件（FangService 胶囊风格） ---- */
.inq-form input[type="text"],
.inq-form input[type="email"],
.inq-form input[type="tel"],
.inq-form input[type="number"],
.inq-form select,
.inq-form textarea {
  width: 100% !important;
  padding: 14px 18px !important;
  margin: 0 0 18px !important;
  background: #FFFFFF !important;
  border: 1px solid #DCE5EF !important;
  border-radius: 60px !important;
  font-family: 'Inter', system-ui, sans-serif !important;
  font-size: 1rem !important;
  line-height: 1.5 !important;
  color: #1A2634 !important;
  transition: border-color .2s ease, box-shadow .2s ease;
}
.inq-form textarea {
  border-radius: 24px !important;
  resize: vertical;
  min-height: 110px;
}
.inq-form select {
  appearance: none;
  -webkit-appearance: none;
  padding-right: 48px !important;
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='9' viewBox='0 0 14 9'%3E%3Cpath d='M1 1l6 6 6-6' fill='none' stroke='%235B7188' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: right 22px center !important;
  cursor: pointer;
}
.inq-form input::placeholder,
.inq-form textarea::placeholder { color: #93A6B8 !important; }
.inq-form input:focus,
.inq-form select:focus,
.inq-form textarea:focus {
  border-color: #2B6A9F !important;
  outline: none !important;
  box-shadow: 0 0 0 3px rgba(43, 106, 159, .12) !important;
}
.inq-form .field-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0 18px;
}
.inq-form .btn-submit {
  width: 100% !important;
  padding: 15px 28px !important;
  border: none !important;
  border-radius: 60px !important;
  background: #1E4663 !important;
  color: #FFFFFF !important;
  font-family: 'Inter', system-ui, sans-serif !important;
  font-size: 1rem !important;
  font-weight: 700 !important;
  letter-spacing: .01em;
  cursor: pointer;
  transition: all .2s ease;
}
.inq-form .btn-submit:hover:not(:disabled) {
  background: #2B6A9F !important;
  color: #FFFFFF !important;
  transform: translateY(-2px);
}
.inq-form .btn-submit:disabled { opacity: .6; cursor: wait; transform: none; }
.inq-form .form-note {
  margin: 16px 0 0 !important;
  font-size: .8rem !important;
  color: #5B7188 !important;
  text-align: center;
}
/* 蜜罐字段：人不可见，机器人会填 */
.inq-form .inq-honey {
  position: absolute !important;
  left: -9999px !important;
  width: 1px; height: 1px;
  opacity: 0;
  pointer-events: none;
}

/* ---- 19.3 成功 / 失败提示 ---- */
.form-success,
.form-error {
  display: none;
  margin-top: 18px;
  padding: 15px 18px;
  border-radius: 16px;
  text-align: center;
  font-size: .95rem;
  font-weight: 600;
  line-height: 1.6;
}
.form-success { background: #E6F7EE; color: #155724 !important; border: 1px solid #A8DFC0; }
.form-error { background: #FDECEC; color: #A52121 !important; border: 1px solid #F3C2C2; }
.form-success.show, .form-error.show { display: block; }
.form-error a { color: #A52121 !important; text-decoration: underline; }

/* ---- 19.4 紧凑内联版（内页底部 Send Inquiry） ---- */
.inq-wrap { width: 100%; }
.inq-wrap .inq-compact { max-width: 900px; margin: 0 auto; }
.inq-wrap .inq-compact input[type="text"],
.inq-wrap .inq-compact input[type="email"],
.inq-wrap .inq-compact input[type="tel"],
.inq-wrap .inq-compact textarea { margin-bottom: 14px !important; }
.inq-wrap .inq-compact textarea { min-height: 96px; }

/* 内页 Send Inquiry 区块（原 .protypefeedback 承接 .wmkcfeedback） */
.wmkcfeedback { width: 100%; }
#toinquiry .inquiry-title,
.protypefeedback .inquiry-title {
  font-size: 1.6rem !important;
  font-weight: 700 !important;
  color: #1E4663 !important;
  text-align: center;
  margin-bottom: 24px !important;
  text-transform: none !important;
}
.contact-inquiry .inq-full { margin: 0; }

/* ---- 19.5 页脚上方横幅（可选 CTA） ---- */
.inq-banner {
  background: linear-gradient(135deg, #1E4663, #2B6A9F);
  border-radius: 24px;
  padding: 32px 36px;
  color: #FFFFFF;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  margin: 40px 0 0;
}
.inq-banner p { margin: 0; font-size: 1.1rem; font-weight: 600; color: #FFFFFF !important; }
.inq-banner a {
  background: #FFFFFF; color: #1E4663 !important;
  padding: 12px 26px; border-radius: 40px;
  font-weight: 700; text-decoration: none; white-space: nowrap;
  transition: all .25s ease;
}
.inq-banner a:hover { transform: translateY(-2px); box-shadow: 0 10px 22px rgba(0, 0, 0, .18); }

/* ---- 19.6 Turnstile 人机验证 ----
   未配置 site key 时容器保持 display:none，不留空白；配置后 JS 自动加 .active。 */
.inq-form .inq-turnstile {
  display: none;
  margin: 2px 0 18px;
  min-height: 0;
}
.inq-form .inq-turnstile.active { display: block; }
.inq-form .inq-turnstile iframe { max-width: 100%; border-radius: 12px; }

/* ---- 19.7 响应式 ---- */
@media (max-width: 768px) {
  .form-card { padding: 26px 20px; border-radius: 24px; margin: 24px 0; }
  .inq-form .field-row { grid-template-columns: 1fr; }
  .inq-form input[type="text"],
  .inq-form input[type="email"],
  .inq-form input[type="tel"],
  .inq-form select,
  .inq-form textarea { border-radius: 18px !important; padding: 13px 16px !important; }
  .inq-form textarea { border-radius: 18px !important; }
  .inq-banner { padding: 24px 20px; }
  .inq-form .inq-turnstile { margin-bottom: 14px; }
}

/* ---------- 20. 多语种下拉（对齐 FangService） ---------- */
/* 由 scripts/i18n/inject_lang_switcher.py 注入的 .lang-dropdown 使用 */
.site-header .lang-dropdown {
  position: relative;
  display: inline-block;
  flex: 0 0 auto;
}
.site-header .lang-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 8px 16px;
  background: #F0F4F9;
  border: none;
  border-radius: 30px;
  font-family: inherit;
  font-size: .85rem;
  font-weight: 600;
  line-height: 1.4;
  color: #1E4663;
  white-space: nowrap;
  cursor: pointer;
}
.site-header .lang-btn:hover { background: #E8F0F8; }
.site-header .lang-btn .lang-caret {
  font-style: normal;
  font-size: .68rem;
  opacity: .7;
  transition: transform .2s ease;
}
.site-header .lang-dropdown:hover .lang-btn .lang-caret,
.site-header .lang-dropdown:focus-within .lang-btn .lang-caret { transform: rotate(180deg); }

.site-header .lang-dropdown-content {
  display: none;
  position: absolute;
  top: calc(100% + 6px);
  left: 0;
  z-index: 130;
  min-width: 172px;
  max-height: 300px;
  overflow-y: auto;
  padding: 6px 0;
  background: #FFFFFF;
  border: 1px solid #EFF3F8;
  border-radius: 16px;
  box-shadow: 0 12px 32px rgba(0, 20, 40, .14);
}
.site-header .lang-dropdown-content a {
  display: block;
  padding: 9px 16px;
  font-size: .85rem;
  line-height: 1.5;
  color: #2C3E50;
  text-decoration: none;
  white-space: nowrap;
  unicode-bidi: plaintext;      /* 阿拉伯语在 LTR 页面里也能正确排列 */
}
.site-header .lang-dropdown-content a:hover { background: #F0F4F9; color: #2B6A9F; }
.site-header .lang-dropdown-content a.current {
  color: #2B6A9F;
  font-weight: 700;
  background: #F8FAFE;
}
.site-header .lang-dropdown-content a.pending {
  color: #9AAABD;
  cursor: not-allowed;
}
.site-header .lang-dropdown-content a.pending:hover { background: transparent; color: #9AAABD; }
.site-header .lang-dropdown-content a.pending::after {
  content: ' · ' attr(data-soon);
  font-size: .72rem;
  font-weight: 400;
  opacity: .85;
}
.site-header .lang-dropdown:hover .lang-dropdown-content,
.site-header .lang-dropdown:focus-within .lang-dropdown-content { display: block; }

/* 阿拉伯语：整页 RTL，下拉面板靠左展开 */
html[dir="rtl"] .site-header .lang-dropdown-content { right: auto; left: 0; }

@media (max-width: 992px) {
  .site-header .lang-dropdown { margin-top: 4px; }
}