/* ============================================================
   96Jewelry B2B 设计系统 v2 — Industrial Minimalist
   东莞豪森金属首饰 | Dongguan Haosen Metal Jewelry
   设计方向：工业极简 · 精准 · 信任
   ============================================================ */

/* ---------- CSS 变量 ---------- */
:root {
  /* === 核心色板（OKLCH基础） === */
  --color-ink:        #0D0D0D;   /* 极致黑 — 主文字、标题 */
  --color-steel:      #1A1D20;   /* 工业钢灰 — 深色区块背景 */
  --color-carbon:     #26292D;   /* 碳灰 — 卡片、次要面 */
  --color-iron:       #3A3E44;   /* 铁灰 — 边框、分割线 */
  --color-concrete:   #8A8D91;   /* 水泥灰 — 辅助文字、占位符 */
  --color-smoke:      #C5C7CA;   /* 烟灰 — 深色背景上的文字 */
  --color-slate:      #E4E5E6;   /* 石板灰 — 浅色区块背景 */
  --color-surface:    #F5F5F5;   /* 近白面 — 主背景 */
  --color-white:      #FAFAFA;   /* 纯白面 — 卡片 */

  /* === 珠宝暖金色（唯一强调色） === */
  --color-brass:      #B8975A;   /* 黄铜色 — CTA、重点 */
  --color-brass-light:#D4B978;   /* 浅黄铜 — 悬停态 */
  --color-brass-dark: #8B6F3A;   /* 深黄铜 — 按压态 */
  --color-brass-dim:  rgba(184,151,90,0.12); /* 极淡 — 背景标记 */

  /* === 功能色 === */
  --color-ok:     #4A9E6E;
  --color-warn:   #D4953A;
  --color-err:    #C84A3A;

  /* === 排版（工业几何感） === */
  --font-display: 'Cormorant Garamond', 'Noto Serif SC', serif;
  --font-heading: 'DM Sans', 'Inter', 'Noto Sans SC', sans-serif;
  --font-body:    'Inter', 'Noto Sans SC', -apple-system, sans-serif;
  --font-mono:    'JetBrains Mono', 'Fira Code', monospace;

  /* 字号梯度 */
  --text-xs:   0.75rem;
  --text-sm:   0.875rem;
  --text-base: 1rem;
  --text-lg:   1.125rem;
  --text-xl:   1.25rem;
  --text-2xl:  1.5rem;
  --text-3xl:  2rem;
  --text-4xl:  2.75rem;
  --text-5xl:  3.75rem;
  --text-6xl:  clamp(4rem, 8vw, 6rem);

  /* 行高 */
  --leading-tight:  1.1;
  --leading-snug:   1.3;
  --leading-normal: 1.6;
  --leading-relaxed:1.75;

  /* 间距 */
  --space-xs:  0.25rem;
  --space-sm:  0.5rem;
  --space-md:  1rem;
  --space-lg:  1.5rem;
  --space-xl:  2rem;
  --space-2xl: 3rem;
  --space-3xl: 5rem;
  --space-4xl: 8rem;

  /* 尖角 + 最小圆角（工业感） */
  --radius-none: 0;
  --radius-sm:   2px;
  --radius-md:   4px;

  /* 阴影 — 仅功能性，不装饰 */
  --shadow-focus: 0 0 0 3px rgba(184,151,90,0.35);

  /* 过渡 */
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --duration-fast: 150ms;
  --duration-base: 300ms;
  --duration-slow: 600ms;

  /* 容器 */
  --container-max: 1320px;
  --container-narrow: 880px;
  --header-h: 64px;
}

/* ---------- 全局重置 ---------- */
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
html{font-size:16px;scroll-behavior:smooth;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
body{font-family:var(--font-body);font-size:var(--text-base);line-height:var(--leading-normal);color:var(--color-ink);background:var(--color-surface)}

/* ---------- 排版 ---------- */
h1,h2,h3,h4,h5,h6{font-family:var(--font-heading);font-weight:700;line-height:var(--leading-snug);color:var(--color-ink);text-wrap:balance}
h1{font-size:var(--text-6xl);letter-spacing:-0.03em}
h2{font-size:var(--text-5xl);letter-spacing:-0.02em}
h3{font-size:var(--text-3xl);letter-spacing:-0.01em}
h4{font-size:var(--text-2xl)}
h5{font-size:var(--text-xl)}
h6{font-size:var(--text-lg)}
p{margin-bottom:var(--space-md);max-width:68ch}
a{color:var(--color-ink);text-decoration:none;transition:color var(--duration-fast) var(--ease-out)}
a:hover{color:var(--color-brass)}
img{max-width:100%;height:auto;display:block}

/* ---------- 容器 ---------- */
.container{width:100%;max-width:var(--container-max);margin-left:auto;margin-right:auto;padding-left:var(--space-xl);padding-right:var(--space-xl)}
.container--narrow{max-width:var(--container-narrow)}

/* ---------- 区块 ---------- */
.section{padding-top:var(--space-4xl);padding-bottom:var(--space-4xl)}
.section--dark{background:var(--color-steel);color:var(--color-smoke)}
.section--ink{background:var(--color-ink);color:var(--color-smoke)}
.section--tight{padding-top:var(--space-3xl);padding-bottom:var(--space-3xl)}
.section--dark h2,.section--ink h2{color:var(--color-white)}
.section--dark h3,.section--ink h3{color:var(--color-white)}

/* ---------- 按钮 ---------- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:var(--space-sm);
  font-family:var(--font-heading);font-size:var(--text-sm);font-weight:600;
  letter-spacing:0.04em;text-transform:uppercase;
  padding:0.8rem 2rem;border:none;cursor:pointer;
  transition:all var(--duration-base) var(--ease-out);
  position:relative;overflow:hidden;
}
.btn--primary{background:var(--color-brass);color:var(--color-white)}
.btn--primary:hover{background:var(--color-brass-dark);color:var(--color-white);transform:translateY(-2px)}
.btn--primary:focus-visible{box-shadow:var(--shadow-focus);outline:none}
.btn--outline{background:transparent;color:var(--color-ink);border:1.5px solid var(--color-iron)}
.btn--outline:hover{background:var(--color-ink);color:var(--color-white);border-color:var(--color-ink)}
.btn--outline-light{background:transparent;color:var(--color-smoke);border:1.5px solid var(--color-iron)}
.btn--outline-light:hover{background:rgba(255,255,255,0.08);border-color:var(--color-smoke);color:var(--color-white)}
.btn--lg{padding:1rem 2.5rem;font-size:var(--text-base)}
.btn--sm{padding:0.5rem 1.25rem;font-size:var(--text-xs)}

/* ---------- 导航 ---------- */
.navbar{
  position:fixed;top:0;left:0;right:0;z-index:100;
  height:var(--header-h);background:rgba(13,13,13,0.92);
  backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);
  border-bottom:1px solid rgba(255,255,255,0.06);
  transition:background var(--duration-base) var(--ease-out);
}
.navbar--solid{background:rgba(13,13,13,0.98)}
.navbar__inner{display:flex;align-items:center;justify-content:space-between;height:100%;max-width:1440px;margin:0 auto;padding:0 var(--space-xl)}
.navbar__logo{font-family:var(--font-display);font-size:1.4rem;font-weight:700;color:var(--color-white);letter-spacing:-0.01em;flex-shrink:0}
.navbar__logo span{color:var(--color-brass)}
.navbar__nav{display:flex;align-items:center;gap:var(--space-2xl);list-style:none}
.navbar__nav a{font-family:var(--font-heading);font-size:var(--text-xs);font-weight:500;color:var(--color-concrete);text-transform:uppercase;letter-spacing:0.08em;transition:color var(--duration-fast);position:relative}
.navbar__nav a::after{content:'';position:absolute;bottom:-4px;left:0;width:100%;height:1px;background:var(--color-brass);transform:scaleX(0);transform-origin:right;transition:transform var(--duration-base) var(--ease-out)}
.navbar__nav a:hover,.navbar__nav a.active{color:var(--color-white)}
.navbar__nav a:hover::after,.navbar__nav a.active::after{transform:scaleX(1);transform-origin:left}
.navbar__actions{display:flex;align-items:center;gap:var(--space-md);flex-shrink:0}
.navbar__hamburger{display:none;flex-direction:column;gap:5px;cursor:pointer;padding:4px;background:none;border:none}
.navbar__hamburger span{display:block;width:22px;height:2px;background:var(--color-white);transition:all var(--duration-base) var(--ease-out)}

/* ---- 导航下拉菜单 ---- */
.navbar__nav .menu-item-has-children{position:relative}
.navbar__nav .menu-item-has-children>a::after{content:'';display:inline-block;width:6px;height:6px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:rotate(45deg);margin-left:6px;position:static;background:none}
.navbar__nav .sub-menu{
  position:absolute;top:100%;left:0;min-width:200px;
  background:rgba(13,13,13,0.98);backdrop-filter:blur(12px);
  border:1px solid rgba(255,255,255,0.08);
  padding:var(--space-sm) 0;
  list-style:none;
  opacity:0;visibility:hidden;
  transform:translateY(8px);
  transition:all var(--duration-base) var(--ease-out);
  z-index:200;
}
.navbar__nav .menu-item-has-children:hover>.sub-menu,
.navbar__nav .menu-item-has-children:focus-within>.sub-menu{
  opacity:1;visibility:visible;transform:translateY(0);
}
.navbar__nav .sub-menu a{
  display:block;padding:var(--space-sm) var(--space-xl);
  font-size:var(--text-xs);font-weight:500;color:var(--color-concrete);
  text-transform:none;letter-spacing:0.04em;white-space:nowrap;
}
.navbar__nav .sub-menu a:hover{color:var(--color-white);background:rgba(255,255,255,0.06)}
.navbar__nav .sub-menu a::after{display:none}
/* 移动端下拉 */
@media(max-width:1024px){
  .navbar__nav .sub-menu{
    position:static;opacity:1;visibility:visible;transform:none;
    background:transparent;border:none;padding-left:var(--space-lg);
  }
}

/* ---------- 页脚 ---------- */
.footer{background:var(--color-ink);color:var(--color-smoke);padding:var(--space-4xl) 0 var(--space-2xl)}
.footer__grid{display:grid;grid-template-columns:2fr 1fr 1fr 1.5fr;gap:var(--space-3xl);margin-bottom:var(--space-3xl)}
.footer__brand-desc{color:var(--color-concrete);font-size:var(--text-sm);line-height:var(--leading-relaxed);margin-top:var(--space-md)}
.footer__heading{color:var(--color-white);font-family:var(--font-heading);font-size:var(--text-xs);font-weight:600;text-transform:uppercase;letter-spacing:0.08em;margin-bottom:var(--space-lg)}
.footer__links{list-style:none;display:flex;flex-direction:column;gap:var(--space-sm)}
.footer__links a{color:var(--color-concrete);font-size:var(--text-sm);transition:color var(--duration-fast)}
.footer__links a:hover{color:var(--color-brass-light)}
.footer__contact-item{display:flex;gap:var(--space-sm);font-size:var(--text-sm);color:var(--color-concrete);margin-bottom:var(--space-sm)}
.footer__bottom{border-top:1px solid rgba(255,255,255,0.08);padding-top:var(--space-xl);display:flex;justify-content:space-between;align-items:center;font-size:var(--text-xs);color:var(--color-concrete);flex-wrap:wrap;gap:var(--space-md)}

/* ---------- 表单 ---------- */
.form-group{margin-bottom:var(--space-lg)}
.form-label{display:block;font-size:var(--text-sm);font-weight:500;color:var(--color-ink);margin-bottom:var(--space-xs)}
.form-input,.form-textarea,.form-select{
  width:100%;padding:0.75rem 1rem;font-family:var(--font-body);font-size:var(--text-base);
  color:var(--color-ink);background:var(--color-white);border:1px solid var(--color-iron);
  transition:border-color var(--duration-fast),box-shadow var(--duration-fast)
}
.form-input:focus,.form-textarea:focus,.form-select:focus{outline:none;border-color:var(--color-brass);box-shadow:var(--shadow-focus)}
.form-textarea{min-height:120px;resize:vertical}

/* ---------- 面包屑 ---------- */
.breadcrumb{display:flex;align-items:center;gap:var(--space-sm);font-size:var(--text-sm);color:var(--color-concrete);padding:var(--space-lg) 0;flex-wrap:wrap}
.breadcrumb a{color:var(--color-iron)}
.breadcrumb a:hover{color:var(--color-brass)}
.breadcrumb__sep{color:var(--color-iron);user-select:none}

/* ---------- 标签 ---------- */
.tag{display:inline-block;font-size:var(--text-xs);font-weight:600;padding:0.25rem 0.75rem;background:var(--color-brass-dim);color:var(--color-brass-dark);text-transform:uppercase;letter-spacing:0.04em}

/* ---------- 响应式 ---------- */
@media(max-width:1024px){
  :root{--text-5xl:2.5rem;--text-4xl:2rem;--text-3xl:1.6rem;--space-4xl:5rem}
  .footer__grid{grid-template-columns:1fr 1fr}
  .navbar__nav{position:fixed;top:var(--header-h);left:0;right:0;bottom:0;background:var(--color-ink);flex-direction:column;align-items:flex-start;padding:var(--space-2xl);gap:var(--space-xl);transform:translateX(100%);transition:transform var(--duration-slow) var(--ease-in-out)}
  .navbar__nav--open{transform:translateX(0)}
  .navbar__hamburger{display:flex}
}
@media(max-width:768px){
  :root{--text-6xl:2.75rem;--text-5xl:2rem;--text-3xl:1.4rem;--space-4xl:3.5rem}
  .container{padding-left:var(--space-lg);padding-right:var(--space-lg)}
  .footer__grid{grid-template-columns:1fr;gap:var(--space-2xl)}
}

/* ---------- 无障碍：减少动画 ---------- */
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:0.01ms!important;animation-iteration-count:1!important;transition-duration:0.01ms!important;scroll-behavior:auto!important}
}

/* ---------- 工具类 ---------- */
.text-brass{color:var(--color-brass)}
.text-center{text-align:center}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* ============================================================
   首页专属样式
   ============================================================ */
[data-reveal]{opacity:0;transform:translateY(40px);transition:opacity 0.8s var(--ease-out),transform 0.8s var(--ease-out)}
[data-reveal].revealed{opacity:1;transform:translateY(0)}
[data-reveal-delay="1"]{transition-delay:0.1s}[data-reveal-delay="2"]{transition-delay:0.2s}[data-reveal-delay="3"]{transition-delay:0.3s}

.hero{position:relative;min-height:100vh;display:flex;align-items:center;background:var(--color-ink);overflow:hidden}
.hero__bg{position:absolute;inset:0;z-index:0;background:radial-gradient(ellipse at 30% 50%,rgba(184,151,90,0.06) 0%,transparent 60%),radial-gradient(ellipse at 70% 30%,rgba(255,255,255,0.02) 0%,transparent 50%)}
.hero__inner{position:relative;z-index:2;display:grid;grid-template-columns:1fr 1fr;gap:var(--space-4xl);align-items:center;width:100%;max-width:1440px;margin:0 auto;padding:calc(var(--header-h) + var(--space-4xl)) var(--space-xl) var(--space-4xl)}
.hero__content{max-width:640px}
.hero__kicker{display:inline-flex;align-items:center;gap:10px;font-family:var(--font-heading);font-size:var(--text-xs);font-weight:600;letter-spacing:0.12em;text-transform:uppercase;color:var(--color-brass);margin-bottom:var(--space-xl)}
.hero__kicker::before{content:'';width:32px;height:1px;background:var(--color-brass)}
.hero__title{font-family:var(--font-heading);font-size:var(--text-6xl);font-weight:700;line-height:1.05;letter-spacing:-0.03em;color:var(--color-white);margin-bottom:var(--space-lg)}
.hero__title em{font-family:var(--font-display);font-style:italic;color:var(--color-brass-light);display:block}
.hero__desc{font-size:var(--text-lg);color:var(--color-concrete);line-height:var(--leading-relaxed);margin-bottom:var(--space-lg)}
.hero__trust-badges{display:flex;flex-direction:column;gap:var(--space-md);margin-bottom:var(--space-2xl)}
.hero__trust-item{display:flex;align-items:flex-start;gap:var(--space-md);font-size:var(--text-sm);color:var(--color-smoke)}
.hero__trust-item svg{width:20px;height:20px;color:var(--color-brass);flex-shrink:0;margin-top:2px}
.hero__actions{display:flex;gap:var(--space-md);flex-wrap:wrap;margin-bottom:var(--space-3xl)}
.hero__stats{display:flex;gap:var(--space-3xl);padding-top:var(--space-2xl);border-top:1px solid rgba(255,255,255,0.08)}
.hero__stat-num{display:block;font-family:var(--font-display);font-size:var(--text-4xl);font-weight:700;color:var(--color-brass-light);line-height:1}
.hero__stat-label{display:block;font-size:var(--text-xs);color:var(--color-concrete);text-transform:uppercase;letter-spacing:0.06em;margin-top:var(--space-xs)}
.hero__visual{position:relative;display:grid;grid-template-columns:1fr 1fr;grid-template-rows:1fr 1fr;gap:12px;height:520px}
.hero__visual-item{position:relative;overflow:hidden;background:var(--color-carbon);transition:transform var(--duration-slow) var(--ease-out)}
.hero__visual-item:nth-child(1){grid-row:1/3}
.hero__visual-item:hover{transform:scale(1.02)}
.hero__visual-img{width:100%;height:100%;display:flex;align-items:center;justify-content:center;font-size:var(--text-xs);color:var(--color-iron);text-transform:uppercase;letter-spacing:0.08em;background:linear-gradient(135deg,var(--color-carbon) 0%,#2a2d32 100%)}
.hero__visual-label{position:absolute;bottom:0;left:0;right:0;padding:var(--space-md);background:linear-gradient(to top,rgba(0,0,0,0.7),transparent);color:var(--color-white);font-size:var(--text-xs);font-weight:600;letter-spacing:0.04em}
.hero__cert-float{position:absolute;right:-16px;bottom:40px;z-index:3;background:var(--color-white);padding:var(--space-md) var(--space-xl);display:flex;align-items:center;gap:var(--space-md);box-shadow:0 8px 32px rgba(0,0,0,0.3)}
.hero__scroll-indicator{position:absolute;bottom:var(--space-xl);left:50%;transform:translateX(-50%);z-index:2;display:flex;flex-direction:column;align-items:center;gap:8px;color:var(--color-concrete);font-size:var(--text-xs);letter-spacing:0.1em;text-transform:uppercase;animation:floatDown 2s ease-in-out infinite}
@keyframes floatDown{0%,100%{transform:translateX(-50%) translateY(0);opacity:0.6}50%{transform:translateX(-50%) translateY(10px);opacity:1}}
.hero__scroll-line{width:1px;height:40px;background:linear-gradient(to bottom,var(--color-brass),transparent)}

.trust-strip{background:var(--color-steel);padding:var(--space-lg) 0;border-bottom:1px solid rgba(255,255,255,0.06)}
.trust-strip__inner{display:flex;align-items:center;justify-content:center;gap:var(--space-4xl);flex-wrap:wrap}
.trust-strip__item{display:flex;align-items:center;gap:10px;font-family:var(--font-heading);font-size:var(--text-xs);font-weight:500;color:var(--color-smoke);text-transform:uppercase;letter-spacing:0.06em}
.trust-strip__item svg{width:20px;height:20px;color:var(--color-brass);flex-shrink:0}

.advantages-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--color-iron);border:1px solid var(--color-iron)}
.advantage-card{background:var(--color-white);padding:var(--space-3xl) var(--space-2xl);transition:background var(--duration-base) var(--ease-out)}
.advantage-card:hover{background:var(--color-steel)}
.advantage-card:hover .advantage-card__title{color:var(--color-white)}
.advantage-card:hover .advantage-card__desc,.advantage-card:hover .advantage-card__detail{color:var(--color-smoke)}
.advantage-card:hover .advantage-card__icon{color:var(--color-brass-light)}
.advantage-card__icon{width:48px;height:48px;color:var(--color-brass);margin-bottom:var(--space-lg);transition:color var(--duration-base)}
.advantage-card__title{font-size:var(--text-xl);font-weight:700;margin-bottom:var(--space-sm);transition:color var(--duration-base)}
.advantage-card__desc{font-size:var(--text-sm);color:var(--color-concrete);line-height:var(--leading-relaxed);margin-bottom:var(--space-sm);transition:color var(--duration-base)}
.advantage-card__detail{font-size:var(--text-xs);color:var(--color-concrete);line-height:var(--leading-relaxed);transition:color var(--duration-base)}

.client-logo-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:var(--space-lg);align-items:center}
.client-logo-item{aspect-ratio:3/2;background:var(--color-white);display:flex;align-items:center;justify-content:center;font-size:var(--text-sm);font-weight:700;color:var(--color-concrete);text-transform:uppercase;letter-spacing:0.06em;transition:all var(--duration-base);border:1px solid var(--color-slate)}
.client-logo-item:hover{border-color:var(--color-brass);color:var(--color-ink);box-shadow:0 4px 16px rgba(0,0,0,0.06)}

.testing-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--space-xl)}
.testing-card{text-align:center;padding:var(--space-2xl) var(--space-lg);background:rgba(255,255,255,0.03);border:1px solid rgba(255,255,255,0.06);transition:all var(--duration-base)}
.testing-card:hover{background:rgba(255,255,255,0.06);transform:translateY(-4px)}
.testing-card__icon{width:56px;height:56px;margin:0 auto var(--space-lg);color:var(--color-brass)}
.testing-card__title{font-family:var(--font-heading);font-size:var(--text-base);font-weight:700;color:var(--color-white);margin-bottom:var(--space-sm)}
.testing-card__desc{font-size:var(--text-xs);color:var(--color-concrete);line-height:var(--leading-relaxed);margin-bottom:var(--space-sm)}
.testing-card__tech{font-size:var(--text-xs);color:var(--color-brass-light);font-family:var(--font-mono)}

.carousel-tabs{display:flex;gap:var(--space-sm);justify-content:center;flex-wrap:wrap}
.carousel-tab{font-family:var(--font-heading);font-size:var(--text-xs);font-weight:600;text-transform:uppercase;letter-spacing:0.06em;padding:0.6rem 1.5rem;background:transparent;border:1px solid var(--color-iron);color:var(--color-concrete);cursor:pointer;transition:all var(--duration-fast) var(--ease-out)}
.carousel-tab:hover{color:var(--color-white);border-color:var(--color-white)}
.carousel-tab.active{background:var(--color-brass);color:var(--color-white);border-color:var(--color-brass)}
.carousel-stage{position:relative;overflow:hidden;max-width:var(--container-wide);margin:0 auto}
.carousel-track{display:flex;transition:transform 0.6s var(--ease-out);will-change:transform}
.carousel-slide{flex:0 0 100%;display:grid;grid-template-columns:1fr 1fr;min-height:520px}
.carousel-slide__bg{display:flex;align-items:center;justify-content:center;font-size:var(--text-sm);color:var(--color-iron);text-transform:uppercase;letter-spacing:0.08em;background:linear-gradient(135deg,var(--color-carbon) 0%,#25282c 100%);position:relative;overflow:hidden}
.carousel-slide__bg::after{content:'';position:absolute;inset:0;background:linear-gradient(to right,rgba(13,13,13,0.5) 0%,transparent 50%)}
.carousel-slide__content{display:flex;flex-direction:column;justify-content:center;padding:var(--space-4xl);background:var(--color-steel)}
.carousel-slide__tag{display:inline-block;font-size:var(--text-xs);font-weight:700;text-transform:uppercase;letter-spacing:0.1em;color:var(--color-brass-light);margin-bottom:var(--space-md)}
.carousel-slide__title{font-size:var(--text-4xl);color:var(--color-white);margin-bottom:var(--space-md);line-height:1.15}
.carousel-slide__desc{font-size:var(--text-base);color:var(--color-concrete);line-height:var(--leading-relaxed);margin-bottom:var(--space-xl);max-width:480px}
.carousel-slide__specs{display:flex;gap:var(--space-xl);margin-bottom:var(--space-2xl);flex-wrap:wrap}
.carousel-slide__specs span{font-size:var(--text-sm);color:var(--color-smoke)}
.carousel-slide__specs strong{display:block;color:var(--color-white);font-size:var(--text-base)}
.carousel-arrow{position:absolute;top:50%;transform:translateY(-50%);z-index:5;width:56px;height:56px;border-radius:50%;background:rgba(255,255,255,0.08);backdrop-filter:blur(8px);border:1px solid rgba(255,255,255,0.12);color:var(--color-white);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all var(--duration-fast) var(--ease-out)}
.carousel-arrow:hover{background:rgba(255,255,255,0.16);border-color:rgba(255,255,255,0.3);transform:translateY(-50%) scale(1.05)}
.carousel-arrow--prev{left:var(--space-xl)}
.carousel-arrow--next{right:var(--space-xl)}
.carousel-dots{display:flex;gap:10px;justify-content:center;position:absolute;bottom:var(--space-xl);left:50%;transform:translateX(-50%);z-index:5}
.carousel-dot{width:10px;height:10px;border-radius:50%;background:rgba(255,255,255,0.25);border:none;cursor:pointer;transition:all var(--duration-fast) var(--ease-out);padding:0}
.carousel-dot:hover{background:rgba(255,255,255,0.5)}
.carousel-dot.active{background:var(--color-brass);transform:scale(1.3)}

.process-flow{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--space-xl);position:relative}
.process-flow::before{content:'';position:absolute;top:36px;left:12.5%;right:12.5%;height:1px;background:var(--color-iron);z-index:0}
.process-step{text-align:center;position:relative;z-index:1}
.process-step__circle{width:72px;height:72px;margin:0 auto var(--space-lg);border:2px solid var(--color-iron);border-radius:50%;display:flex;align-items:center;justify-content:center;font-family:var(--font-display);font-size:var(--text-2xl);font-weight:700;color:var(--color-iron);background:var(--color-surface);transition:all var(--duration-base) var(--ease-out)}
.process-step:hover .process-step__circle{background:var(--color-brass);color:var(--color-white);border-color:var(--color-brass);transform:scale(1.1)}
.process-step__title{font-family:var(--font-heading);font-size:var(--text-base);font-weight:700;margin-bottom:var(--space-xs)}
.process-step__desc{font-size:var(--text-sm);color:var(--color-concrete);line-height:var(--leading-relaxed)}
.process-step__time{display:inline-block;font-size:var(--text-xs);color:var(--color-brass);font-weight:600;margin-top:var(--space-sm)}

.material-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--space-lg)}
.material-card{background:var(--color-white);padding:var(--space-2xl);text-align:center;transition:all var(--duration-base);border:1px solid var(--color-slate)}
.material-card:hover{transform:translateY(-4px);box-shadow:0 12px 32px rgba(0,0,0,0.08)}
.material-card__name{font-family:var(--font-heading);font-size:var(--text-xl);font-weight:700;margin-bottom:var(--space-sm)}
.material-card__props{font-size:var(--text-xs);color:var(--color-concrete);line-height:var(--leading-relaxed);margin-bottom:var(--space-md)}
.material-card__tags{display:flex;flex-wrap:wrap;gap:4px;justify-content:center}
.material-card__tag{font-size:10px;font-weight:600;text-transform:uppercase;padding:2px 8px;background:var(--color-brass-dim);color:var(--color-brass-dark);letter-spacing:0.04em}

.cta-block{background:var(--color-steel);text-align:center;padding:var(--space-4xl) 0;position:relative;overflow:hidden}
.cta-block::before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse at center,rgba(184,151,90,0.06) 0%,transparent 70%)}
.cta-block__inner{position:relative;z-index:1}
.cta-block__title{font-size:var(--text-5xl);color:var(--color-white);margin-bottom:var(--space-md)}
.cta-block__desc{font-size:var(--text-lg);color:var(--color-concrete);margin-bottom:var(--space-2xl);max-width:520px;margin-left:auto;margin-right:auto}
.cta-block__actions{display:flex;gap:var(--space-md);justify-content:center;flex-wrap:wrap}

/* ---- WordPress 导航菜单兼容 ---- */
.navbar__nav li{list-style:none}
.navbar__nav a{font-family:var(--font-heading);font-size:var(--text-xs);font-weight:500;color:var(--color-concrete);text-transform:uppercase;letter-spacing:0.08em;transition:color var(--duration-fast);position:relative;text-decoration:none}
.navbar__nav a::after{content:'';position:absolute;bottom:-4px;left:0;width:100%;height:1px;background:var(--color-brass);transform:scaleX(0);transform-origin:right;transition:transform var(--duration-base) var(--ease-out)}
.navbar__nav a:hover,.navbar__nav .current-menu-item a,.navbar__nav .current_page_item a{color:var(--color-white)}
.navbar__nav a:hover::after,.navbar__nav .current-menu-item a::after,.navbar__nav .current_page_item a::after{transform:scaleX(1);transform-origin:left}

/* ---- 页面头部（内页通用） ---- */
.page-hero{background:var(--color-ink);padding:calc(var(--header-h) + var(--space-3xl)) 0 var(--space-3xl);text-align:center}
.page-hero h1{color:var(--color-white);margin-bottom:var(--space-sm)}
.page-hero p{color:var(--color-concrete);font-size:var(--text-lg);max-width:560px;margin:0 auto}

/* ---- 响应式 ---- */
@media(max-width:1024px){
  .hero__inner{grid-template-columns:1fr;text-align:center;padding-top:calc(var(--header-h) + var(--space-2xl))}
  .hero__content{max-width:100%}
  .hero__trust-badges{align-items:center}
  .hero__trust-item{justify-content:center}
  .hero__actions{justify-content:center}
  .hero__stats{justify-content:center}
  .hero__visual{max-width:500px;margin:0 auto;height:360px}
  .hero__cert-float{right:0}
  .advantages-grid{grid-template-columns:repeat(2,1fr)}
  .testing-grid{grid-template-columns:repeat(2,1fr)}
  .process-flow{grid-template-columns:repeat(2,1fr)}
  .process-flow::before{display:none}
  .material-grid{grid-template-columns:repeat(2,1fr)}
  .client-logo-grid{grid-template-columns:repeat(3,1fr)}
  .carousel-slide{grid-template-columns:1fr;min-height:auto}
  .carousel-slide__bg{aspect-ratio:16/9}
  .carousel-slide__content{padding:var(--space-2xl)}
  .carousel-slide__title{font-size:var(--text-3xl)}
  .carousel-arrow{width:44px;height:44px}
  .carousel-arrow--prev{left:var(--space-md)}
  .carousel-arrow--next{right:var(--space-md)}
}
@media(max-width:768px){
  .advantages-grid{grid-template-columns:1fr}
  .testing-grid{grid-template-columns:1fr}
  .process-flow{grid-template-columns:1fr}
  .material-grid{grid-template-columns:1fr}
  .client-logo-grid{grid-template-columns:repeat(2,1fr)}
  .trust-strip__inner{gap:var(--space-xl)}
  .hero__stats{flex-wrap:wrap;gap:var(--space-xl)}
  .cta-block__title{font-size:var(--text-4xl)}
  .carousel-slide__content{padding:var(--space-xl)}
  .carousel-slide__title{font-size:var(--text-2xl)}
  .carousel-slide__specs{gap:var(--space-md)}
  .carousel-tab{padding:0.5rem 1rem;font-size:10px}
}

/* ============================================================
   产品归档页 — Hero 背景图
   ============================================================ */
.page-hero {
  position: relative;
  padding: var(--space-4xl) 0;
  min-height: 280px;
  display: flex;
  align-items: center;
}
.page-hero__overlay {
  position: absolute;
  inset: 0;
  background: rgba(13,13,13,0.55);
  z-index: 1;
}
.page-hero h1 {
  color: var(--color-white);
  font-size: var(--text-4xl);
  margin-bottom: var(--space-sm);
}
.page-hero p {
  color: var(--color-smoke);
  font-size: var(--text-lg);
  margin-bottom: 0;
}

/* ============================================================
   美化筛选栏
   ============================================================ */
.filter-bar {
  margin-bottom: var(--space-3xl);
}
.filter-bar__form {
  display: flex;
  gap: var(--space-sm);
  flex-wrap: wrap;
  align-items: center;
  padding: var(--space-md);
  background: var(--color-white);
  border: 1px solid var(--color-slate);
}
.filter-bar__group {
  position: relative;
  display: flex;
  align-items: center;
}
.filter-bar__icon {
  position: absolute;
  left: 12px;
  top: 50%;
  transform: translateY(-50%);
  color: var(--color-concrete);
  pointer-events: none;
  z-index: 1;
  display: flex;
}
.filter-bar__select {
  appearance: none;
  -webkit-appearance: none;
  font-family: var(--font-heading);
  font-size: var(--text-sm);
  font-weight: 500;
  color: var(--color-ink);
  background: var(--color-surface);
  border: 1px solid var(--color-slate);
  padding: 0.65rem 2rem 0.65rem 2.4rem;
  min-width: 170px;
  cursor: pointer;
  transition: all var(--duration-base) var(--ease-out);
  background-image: url("data:image/svg+xml,%3Csvg width='10' height='6' viewBox='0 0 10 6' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1l4 4 4-4' stroke='%238A8D91' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 12px center;
  padding-right: 2rem;
}
.filter-bar__select:hover {
  border-color: var(--color-brass);
}
.filter-bar__select:focus {
  outline: none;
  border-color: var(--color-brass);
  box-shadow: var(--shadow-focus);
}
.filter-bar__clear {
  font-family: var(--font-heading);
  font-size: var(--text-sm);
  font-weight: 600;
  color: var(--color-err);
  text-decoration: none;
  padding: 0.65rem 0.8rem;
  transition: opacity var(--duration-fast) var(--ease-out);
}
.filter-bar__clear:hover {
  opacity: 0.7;
  color: var(--color-err);
}
.filter-bar__count {
  font-size: var(--text-sm);
  color: var(--color-concrete);
  margin-left: auto;
}
.filter-bar__count strong {
  color: var(--color-ink);
  font-weight: 700;
}

/* ============================================================
   产品卡片网格 + 悬停换图
   ============================================================ */
.product-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: var(--space-lg);
}

.product-card {
  background: var(--color-white);
  border: 1px solid var(--color-slate);
  overflow: hidden;
  transition: box-shadow var(--duration-base) var(--ease-out),
              transform var(--duration-base) var(--ease-out);
}
.product-card:hover {
  box-shadow: 0 8px 30px rgba(0,0,0,0.08);
  transform: translateY(-2px);
}
.product-card__link {
  display: block;
  text-decoration: none;
  color: inherit;
}
.product-card__link:hover {
  color: inherit;
}
.product-card__img-wrap {
  position: relative;
  aspect-ratio: 1;
  overflow: hidden;
  background: var(--color-slate);
}
.product-card__img {
  position: absolute;
  inset: 0;
  transition: opacity var(--duration-base) var(--ease-out);
}
.product-card__img--primary {
  opacity: 1;
  z-index: 2;
}
.product-card__img--hover {
  opacity: 0;
  z-index: 1;
}
.product-card:hover .product-card__img--primary {
  opacity: 0;
}
.product-card:hover .product-card__img--hover {
  opacity: 1;
}
.product-card__thumb {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.product-card__placeholder {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
  font-size: var(--text-sm);
  color: var(--color-concrete);
  text-transform: uppercase;
  letter-spacing: 0.08em;
}
.product-card__body {
  padding: var(--space-md);
}
.product-card__title {
  font-size: var(--text-base);
  font-weight: 600;
  margin-bottom: var(--space-xs);
  line-height: var(--leading-snug);
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.product-card__tags {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
}

/* ============================================================
   分页
   ============================================================ */
.pagination {
  display: flex;
  justify-content: center;
  gap: var(--space-sm);
  margin-top: var(--space-3xl);
}
.pagination .page-numbers {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 40px;
  height: 40px;
  padding: 0 var(--space-sm);
  font-family: var(--font-heading);
  font-size: var(--text-sm);
  font-weight: 500;
  color: var(--color-iron);
  background: var(--color-white);
  border: 1px solid var(--color-slate);
  text-decoration: none;
  transition: all var(--duration-fast) var(--ease-out);
}
.pagination .page-numbers.current {
  background: var(--color-brass);
  color: var(--color-white);
  border-color: var(--color-brass);
}
.pagination .page-numbers:hover:not(.current) {
  border-color: var(--color-brass);
  color: var(--color-brass);
}

/* ============================================================
   空状态
   ============================================================ */
.empty-state {
  text-align: center;
  padding: var(--space-4xl) 0;
}
.empty-state__text {
  font-size: var(--text-lg);
  color: var(--color-concrete);
  margin-bottom: var(--space-md);
}

/* ============================================================
   产品详情 — 放大镜效果
   ============================================================ */
.product-gallery {
  position: relative;
}
.product-gallery__main {
  position: relative;
  aspect-ratio: 1;
  overflow: hidden;
  background: var(--color-slate);
  cursor: crosshair;
}
.product-gallery__image {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.product-gallery__placeholder {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
  font-size: var(--text-sm);
  color: var(--color-concrete);
  text-transform: uppercase;
  letter-spacing: 0.08em;
}
.product-gallery__lens {
  position: absolute;
  width: 120px;
  height: 120px;
  border: 2px solid var(--color-brass);
  background: rgba(184,151,90,0.12);
  pointer-events: none;
  opacity: 0;
  z-index: 10;
  box-shadow: 0 0 8px rgba(0,0,0,0.2);
}
.product-gallery__main:hover .product-gallery__lens {
  opacity: 1;
}
.product-gallery__result {
  position: absolute;
  top: 0;
  left: calc(100% + var(--space-lg));
  width: 100%;
  aspect-ratio: 1;
  background-repeat: no-repeat;
  background-color: var(--color-white);
  border: 1px solid var(--color-slate);
  box-shadow: 0 4px 20px rgba(0,0,0,0.1);
  z-index: 20;
  display: none;
}

@media (max-width: 1024px) {
  .product-grid {
    grid-template-columns: repeat(2, 1fr);
  }
  .product-gallery__result {
    display: none !important;
  }
}
@media (max-width: 640px) {
  .product-grid {
    grid-template-columns: 1fr;
  }
  .filter-bar__form {
    flex-direction: column;
    align-items: stretch;
  }
  .filter-bar__select {
    width: 100%;
  }
  .filter-bar__count {
    margin-left: 0;
    text-align: center;
  }
}