@charset "UTF-8";
/* =========================================================
   Typography Layer — 前台字体与排版规范（叠加在 index.css 之后）
   约束：
     * 不修改任何 :root 变量（--jq_fs*, --jq_color* 等保持原样）
     * 不修改任何业务/PHP 数据
     * 不覆盖图标字体（iconfont / el-icon）
   目标：
     1. 统一字体栈（英文 Inter Tight，中文系统字体回落）
     2. 建立标题 h1~h6 视觉层级
     3. 增加抗锯齿、字间距、行距规范，提升可读性
     4. 数字使用等宽衬线（tabular-nums），表格/价格对齐更整齐
   ========================================================= */

/* --- Web Fonts ------------------------------------------------ */
@font-face {
  font-family: "Inter Tight";
  src: url('../fonts/InterTight-VariableFont_wght.ttf') format('truetype-variations'),
       url('../fonts/InterTight-VariableFont_wght.ttf') format('truetype');
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Koulen";
  src: url('../fonts/Koulen-Regular.ttf') format('truetype');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

/* --- 基础 ----------------------------------------------------- */
html {
  -webkit-text-size-adjust: 100%;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
  font-family: "Inter Tight", -apple-system, BlinkMacSystemFont, "Segoe UI",
               "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei UI",
               "Microsoft YaHei", "Source Han Sans CN", Roboto, "Helvetica Neue",
               Helvetica, Arial, sans-serif;
  color: var(--jq_color7);
  line-height: 1.6;
  letter-spacing: 0.01em;
}

body {
  font-family: inherit;
  line-height: 1.6;
  color: var(--jq_color7);
  background-color: #ffffff;
}

/* 让表单控件继承全局字体，避免浏览器默认 Arial/Times */
input, button, select, textarea, optgroup {
  font-family: inherit;
  letter-spacing: inherit;
}

/* 段落/列表可读性 */
p { line-height: 1.75; }
ul, ol { line-height: 1.7; }

/* 链接交互 */
a {
  transition: color .2s ease, opacity .2s ease;
}
a:hover { color: var(--jq_color14); }

/* 强调 */
b, strong { font-weight: 600; }
em, i { font-style: italic; }

/* --- 标题层级 ------------------------------------------------- */
/* 说明：index.css 中 `* { font-size: var(--jq_fs2) }` 会把 h1~h6 压成 14px，
   这里通过元素选择器（优先级 0,0,0,1）覆盖，建立清晰层级。           */
h1, h2, h3, h4, h5, h6 {
  font-family: inherit;
  font-weight: 600;
  line-height: 1.35;
  letter-spacing: 0;
  color: var(--jq_color1);
  margin: 0;
}
h1 { font-size: var(--jq_fs10); font-weight: 700; letter-spacing: -0.01em; }
h2 { font-size: var(--jq_fs8);  font-weight: 700; letter-spacing: -0.005em; }
h3 { font-size: var(--jq_fs6);  font-weight: 600; }
h4 { font-size: var(--jq_fs5);  font-weight: 600; }
h5 { font-size: var(--jq_fs4);  font-weight: 600; }
h6 { font-size: var(--jq_fs3);  font-weight: 600; }

/* --- 数字等宽（价格/编号/表格） ------------------------------ */
.price, .num, .count, .quantity, .stock,
table td, table th,
.products-table .tds, .products-table .ths,
.page-main a, .page-prev, .page-next,
.productList-item .price, .productList-item .number {
  font-variant-numeric: tabular-nums lining-nums;
  font-feature-settings: "tnum" on, "lnum" on;
}

/* --- 通用区块标题规范 ----------------------------------------- */
/* 首页与栏目页大量使用 .title / *-title 作为小节标题，统一升级视觉 */
.title,
.technologies-box .title,
.hotSaleBriefs .appBriefs-title,
.hotSaleBriefs .appHotSale-title,
.productList-box .title,
.productType-box .title,
.news-box .title,
.application-box .title,
.brand-box .title,
.rfq-box .title,
.page-box .title {
  font-size: var(--jq_fs6);
  font-weight: 600;
  line-height: 1.4;
  letter-spacing: -0.002em;
  color: var(--jq_color1);
}

/* 面包屑 */
.breadcrumb,
.breadcrumb-box,
.breadcrumb a,
.breadcrumb-box a {
  font-size: var(--jq_fs2);
  color: var(--jq_color10);
}
.breadcrumb a:hover,
.breadcrumb-box a:hover { color: var(--jq_color14); }

/* 主菜单 */
.menu-box, .menu-box a {
  font-size: var(--jq_fs2);
  font-weight: 500;
  letter-spacing: 0.02em;
}

/* 按钮 */
button, .btn, .button,
.J_submit, input[type="submit"], input[type="button"] {
  font-family: inherit;
  font-weight: 500;
  letter-spacing: 0.02em;
}

/* 输入框占位符 */
::-webkit-input-placeholder { color: var(--jq_color18); letter-spacing: 0.01em; }
::-moz-placeholder          { color: var(--jq_color18); letter-spacing: 0.01em; }
:-ms-input-placeholder      { color: var(--jq_color18); letter-spacing: 0.01em; }
::placeholder               { color: var(--jq_color18); letter-spacing: 0.01em; }

/* --- 图标字体保护（绝不覆盖） -------------------------------- */
.iconfont, [class^="icon-"], [class*=" icon-"],
.el-icon, [class^="el-icon-"], [class*=" el-icon-"],
i[class^="icon-"], i[class*=" icon-"] {
  font-family: "iconfont", "element-icons" !important;
  letter-spacing: normal !important;
  text-transform: none !important;
  font-style: normal !important;
  -webkit-font-smoothing: antialiased;
}

/* 邮箱、URL、代码等不应大写转换（index.css 里 * 默认 capitalize） */
.email, .url, code, pre, kbd, samp, .part-number, .product-code {
  text-transform: none !important;
  font-variant-numeric: tabular-nums;
}

/* --- 表格阅读性微调 ------------------------------------------- */
table { font-variant-numeric: tabular-nums; }
th { font-weight: 600; letter-spacing: 0.01em; }

/* --- 响应式微调 ----------------------------------------------- */
@media only screen and (max-width: 1200px) {
  html { letter-spacing: 0.005em; }
  h1 { font-size: var(--jq_fs9); }
  h2 { font-size: var(--jq_fs7); }
  .title { font-size: var(--jq_fs5); }
}
@media only screen and (max-width: 768px) {
  html { line-height: 1.55; letter-spacing: 0; }
  h1 { font-size: var(--jq_fs8); }
  h2 { font-size: var(--jq_fs6); }
  h3 { font-size: var(--jq_fs5); }
  .title { font-size: var(--jq_fs5); }
  p, ul, ol { line-height: 1.7; }
}