/* ============================================================================
 * pages-common.css — 子页面共享覆盖层
 * （联系我们 / 关于我们 / 公司简介 / 产品中心 / 紧固件标准附录）
 * ----------------------------------------------------------------------------
 * 上述五个子页面与主页共用 base.css / mobile.css / tablet.css / ultrawide.css。
 * 本文件提取这五页完全一致的公共覆盖，避免在 company.css / contact.css /
 * products.css / standards.css 中重复维护：
 *   1) 子页面 CSS 变量 + html/body 覆盖（区别于首页的配色与字号基准）
 *   2) 子页面 Header 副标题字距校准（头部结构 / 布局已统一并入 base.css）
 *   3) 分隔线 / 导航栏 / 页脚 的统一覆盖
 *   4) 移动端（≤767px）body 字号还原
 *
 * 说明：头部 LOGO / 主 / 副标题结构与字号已统一由 base.css 维护，
 * 各子页面仅按各自英文副标题文案在下方（或专属 CSS 中）覆盖字距使其与主标题等长。
 * ============================================================================ */

/* ============================================================================
 * 1. 变量 + html / body 覆盖
 * ============================================================================ */
:root {
    --primary-color: #2c3e50;
    --secondary-color: #555555;
    --third-color: rgb(21, 21, 142);
    --light-gray: #bdc3c7;
    --background-color: #e6eff4;
    --text-color: #333333;
    --header-background-color: #e6eff4;
    --navbar-background-color: #3a536d;
    --navbar-hover-color: #d4af37;
    --accent-color: #d4af37;
    --accent-dark: #b8941f
}

html {
    font-size: clamp(12px, 1vw, 16px)
}

body {
    background-color: var(--background-color);
    font-family: "Noto Sans SC", "Noto Sans SC Fallback", "Noto Sans", sans-serif;
    font-size: 1rem;
    line-height: 1.6;
    margin: 0;
    overflow-x: hidden;
    padding: 0
}

/* ============================================================================
 * 2. Header 副标题字距校准（头部边框 / 内边距 / 阴影已统一并入 base.css）
 * ============================================================================ */
/* 子页面副标题等长校准：about.html「About Us - GEM-DUO Co.,Ltd」与主标题等长的实测值
   （其余页面在各自专属 CSS 中覆盖）；改文案或字体需重新校准 */
.header .header-content .branding-text .branding-sub {
    letter-spacing: .292em
}

/* ============================================================================
 * 3. 分隔线 / 导航栏 / 页脚 的统一覆盖
 * ============================================================================ */
/* 分隔线：子页面保持原有的灰色细线，覆盖 base.css 的金色渐变与 hover 效果 */
.section-divider {
    width: 95%;
    height: 1px;
    background: #ddd;
    margin: 2rem auto;
    box-sizing: border-box;
    border-radius: 0
}

.section-divider:hover {
    background: #ddd;
    height: 1px
}

/* 导航栏 / 页脚：子页面保持原有的系统字体栈（base.css 未单独声明，会继承 body 的 Noto Sans） */
.navbar,
.footer {
    font-family: "Noto Sans SC", "Noto Sans SC Fallback", -apple-system, BlinkMacSystemFont, "Segoe UI", "Microsoft YaHei", "PingFang SC", "Helvetica Neue", Arial, sans-serif
}

/* ============================================================================
 * 4. 移动端（≤767px）：body 字号还原（头部移动端样式已统一并入 mobile.css）
 * ============================================================================ */
@media (max-width:767px) {
    body {
        font-size: 1.1rem
    }
}
