/* ============================================================
   POLYC MACHINE — Flat Design Override
   加载顺序：必须在 styles.css / modules.css / shared-nav.css /
   product-image-enhance.css / contact.css 之后加载。
   只改视觉，不改布局结构和文案。
   ============================================================ */

/* ---------- 1. 设计变量 ---------- */
:root {
  --c-primary:      #0d3b7a;   /* 品牌深蓝 */
  --c-primary-2:    #1a5fb4;   /* 中蓝 hover */
  --c-accent:       #2e8b57;   /* 沉稳绿（替代荧光绿） */
  --c-accent-2:     #256e45;   /* 深绿 hover */
  --c-bg:           #ffffff;
  --c-bg-soft:      #f5f7fa;   /* 交替区块浅灰底 */
  --c-text:         #1a2332;   /* 主文字（不使用纯黑） */
  --c-text-2:       #5a6b7b;   /* 次要文字 */
  --c-border:       #e2e8f0;   /* 统一边框 */
  --c-border-soft:  #eef1f5;
  --radius-sm:      4px;
  --radius:         8px;       /* 卡片/按钮/输入框标准圆角 */
  --radius-lg:      12px;      /* 大容器 */
  --shadow-sm:      0 1px 2px rgba(13,59,122,.06);
  --shadow:         0 2px 8px rgba(13,59,122,.08);
  --shadow-lg:      0 8px 24px rgba(13,59,122,.10);
  --transition:     .2s ease;
  --font-sans:      'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI',
                    Roboto, 'Helvetica Neue', Arial, sans-serif;
}

/* ---------- 2. 全局基础 ---------- */
* { box-sizing: border-box; }

html { scroll-behavior: smooth; }

body {
  font-family: var(--font-sans) !important;
  color: var(--c-text) !important;
  background: var(--c-bg) !important;
  font-size: 16px !important;
  line-height: 1.7 !important;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

h1, h2, h3, h4, h5, h6 {
  font-family: var(--font-sans) !important;
  color: var(--c-text) !important;
  font-weight: 700 !important;
  letter-spacing: -0.01em !important;
  line-height: 1.25 !important;
}

h1 { font-size: clamp(28px, 4vw, 44px) !important; }
h2 { font-size: clamp(24px, 3vw, 34px) !important; }
h3 { font-size: clamp(18px, 2vw, 22px) !important; }

p  { color: var(--c-text-2); }

a  { color: var(--c-primary-2); text-decoration: none; transition: color var(--transition); }
a:hover { color: var(--c-primary); }

img { max-width: 100%; height: auto; display: block; }

/* ---------- 3. 顶部导航 ---------- */
.site-header,
header.site-header,
header.shared-nav {
  background: rgba(255,255,255,.92) !important;
  backdrop-filter: saturate(180%) blur(10px);
  -webkit-backdrop-filter: saturate(180%) blur(10px);
  border-bottom: 1px solid var(--c-border-soft) !important;
  box-shadow: var(--shadow-sm) !important;
}

.shared-brand, .brand {
  font-weight: 800 !important;
  letter-spacing: .02em !important;
}
.shared-brand strong, .brand strong { color: var(--c-primary) !important; }
.shared-brand span,   .brand span   { color: var(--c-text-2) !important; font-weight: 600; }

#main-navigation a,
.shared-links a {
  color: var(--c-text) !important;
  font-weight: 500 !important;
  font-size: 14px !important;
  padding: 6px 4px !important;
  border-radius: var(--radius-sm) !important;
  transition: color var(--transition), background var(--transition) !important;
}
#main-navigation a:hover,
.shared-links a:hover {
  color: var(--c-primary) !important;
  background: var(--c-bg-soft) !important;
}
#main-navigation a.active,
.shared-links a.active {
  color: var(--c-primary) !important;
  font-weight: 700 !important;
}

.products-trigger {
  color: var(--c-text) !important;
  font-weight: 500 !important;
  font-size: 14px !important;
  border-radius: var(--radius-sm) !important;
}
.products-panel {
  background: #fff !important;
  border: 1px solid var(--c-border) !important;
  border-radius: var(--radius) !important;
  box-shadow: var(--shadow-lg) !important;
  padding: 8px !important;
}
.products-panel a {
  border-radius: var(--radius-sm) !important;
  padding: 8px 12px !important;
}
.products-panel a:hover { background: var(--c-bg-soft) !important; }

/* 汉堡按钮 */
.nav-toggle {
  border-radius: var(--radius-sm) !important;
  border: 1px solid var(--c-border) !important;
  background: #fff !important;
}

/* ---------- 4. 按钮 ---------- */
.button,
.header-cta,
.form-submit,
button[type="submit"],
a[class*="button"],
a[class*="cta"] {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  background: var(--c-accent) !important;
  color: #fff !important;
  border: 1px solid var(--c-accent) !important;
  border-radius: var(--radius) !important;
  padding: 11px 22px !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  font-family: var(--font-sans) !important;
  letter-spacing: .01em !important;
  box-shadow: var(--shadow-sm) !important;
  cursor: pointer !important;
  transition: background var(--transition), transform var(--transition),
              box-shadow var(--transition) !important;
  text-decoration: none !important;
}
.button:hover,
.header-cta:hover,
.form-submit:hover {
  background: var(--c-accent-2) !important;
  border-color: var(--c-accent-2) !important;
  transform: translateY(-1px) !important;
  box-shadow: var(--shadow) !important;
}
.button:active, .header-cta:active { transform: translateY(0) !important; }

/* 描边次按钮 */
.button-outline,
a[class*="outline"] {
  background: transparent !important;
  color: var(--c-primary) !important;
  border: 1px solid var(--c-primary) !important;
}
.button-outline:hover {
  background: var(--c-primary) !important;
  color: #fff !important;
}

/* ---------- 5. 区块通用 ---------- */
section {
  padding: 72px 24px !important;
}
section:nth-of-type(even) {
  background: var(--c-bg-soft) !important;
}

.eyebrow,
[class*="eyebrow"] {
  display: inline-block !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  letter-spacing: .12em !important;
  text-transform: uppercase !important;
  color: var(--c-primary-2) !important;
  background: rgba(26,95,180,.08) !important;
  padding: 5px 12px !important;
  border-radius: 100px !important;
  margin-bottom: 14px !important;
}

/* ---------- 6. 卡片（特性/部件/联系卡等） ---------- */
[class*="card"],
[class*="Card"],
[class*="feature"],
[class*="Feature"],
[class*="assembly"],
[class*="Assembly"] {
  background: #fff !important;
  border: 1px solid var(--c-border) !important;
  border-radius: var(--radius) !important;
  box-shadow: var(--shadow-sm) !important;
  padding: 24px !important;
  transition: box-shadow var(--transition), transform var(--transition),
              border-color var(--transition) !important;
}
[class*="card"]:hover,
[class*="feature"]:hover,
[class*="assembly"]:hover {
  box-shadow: var(--shadow) !important;
  border-color: #cfd8e3 !important;
  transform: translateY(-2px) !important;
}

/* 联系卡片特殊处理 */
.contact-card {
  background: #fff !important;
  border: 1px solid var(--c-border) !important;
  border-radius: var(--radius) !important;
  box-shadow: var(--shadow-sm) !important;
  padding: 20px !important;
  transition: box-shadow var(--transition), transform var(--transition) !important;
}
.contact-card:hover {
  box-shadow: var(--shadow) !important;
  transform: translateY(-2px) !important;
}
.contact-card b,
.contact-card [class*="label"] {
  font-size: 11px !important;
  font-weight: 700 !important;
  letter-spacing: .1em !important;
  text-transform: uppercase !important;
  color: var(--c-text-2) !important;
}
.contact-card a {
  color: var(--c-primary) !important;
  font-weight: 600 !important;
  font-size: 15px !important;
}

/* ---------- 7. 参数表 ---------- */
.table-wrap,
[class*="table-wrap"],
[class*="spec-table"] {
  border: 1px solid var(--c-border) !important;
  border-radius: var(--radius) !important;
  overflow: hidden !important;
  box-shadow: var(--shadow-sm) !important;
  background: #fff !important;
}

table {
  border-collapse: collapse !important;
  width: 100% !important;
  font-size: 14px !important;
  font-family: var(--font-sans) !important;
}
thead th {
  background: var(--c-primary) !important;
  color: #fff !important;
  font-weight: 600 !important;
  font-size: 13px !important;
  letter-spacing: .02em !important;
  padding: 14px 16px !important;
  text-align: left !important;
  border: none !important;
}
tbody td {
  padding: 12px 16px !important;
  border-bottom: 1px solid var(--c-border-soft) !important;
  color: var(--c-text) !important;
}
tbody tr:nth-child(even) td { background: var(--c-bg-soft) !important; }
tbody tr:hover td { background: rgba(26,95,180,.05) !important; }
tbody tr:last-child td { border-bottom: none !important; }

/* ---------- 8. 表单 ---------- */
form label {
  font-size: 13px !important;
  font-weight: 600 !important;
  color: var(--c-text) !important;
  margin-bottom: 6px !important;
  display: block !important;
}

input[type="text"],
input[type="email"],
input[type="tel"],
input:not([type]),
select,
textarea {
  width: 100% !important;
  font-family: var(--font-sans) !important;
  font-size: 14px !important;
  color: var(--c-text) !important;
  background: #fff !important;
  border: 1px solid var(--c-border) !important;
  border-radius: var(--radius) !important;
  padding: 11px 14px !important;
  transition: border-color var(--transition), box-shadow var(--transition) !important;
  appearance: none !important;
  -webkit-appearance: none !important;
}
input:focus, select:focus, textarea:focus {
  outline: none !important;
  border-color: var(--c-primary-2) !important;
  box-shadow: 0 0 0 3px rgba(26,95,180,.12) !important;
}
textarea { resize: vertical !important; min-height: 100px !important; }

/* ---------- 9. FAQ ---------- */
details,
[class*="faq-item"],
[class*="faq"] {
  background: #fff !important;
  border: 1px solid var(--c-border) !important;
  border-radius: var(--radius) !important;
  padding: 18px 22px !important;
  margin-bottom: 12px !important;
  transition: border-color var(--transition), box-shadow var(--transition) !important;
}
details[open],
[class*="faq-item"]:hover {
  border-color: var(--c-primary-2) !important;
  box-shadow: var(--shadow-sm) !important;
}
details summary {
  font-weight: 600 !important;
  font-size: 16px !important;
  color: var(--c-text) !important;
  cursor: pointer !important;
  list-style: none !important;
}
details summary::-webkit-details-marker { display: none; }
details summary::after {
  content: "+";
  float: right;
  font-size: 22px;
  font-weight: 300;
  color: var(--c-primary-2);
  transition: transform var(--transition);
}
details[open] summary::after { content: "−"; }

/* ---------- 10. 页脚 ---------- */
footer.site-footer,
.site-footer {
  background: var(--c-primary) !important;
  color: rgba(255,255,255,.85) !important;
  padding: 56px 24px 24px !important;
}
.site-footer a { color: rgba(255,255,255,.8) !important; }
.site-footer a:hover { color: #fff !important; }
.site-footer b,
.site-footer [class*="title"] {
  color: #fff !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  letter-spacing: .08em !important;
  text-transform: uppercase !important;
  margin-bottom: 14px !important;
  display: block !important;
}
.footer-brand { color: #fff !important; font-weight: 800 !important; font-size: 20px !important; }
.footer-bottom {
  border-top: 1px solid rgba(255,255,255,.15) !important;
  padding-top: 20px !important;
  margin-top: 36px !important;
  font-size: 13px !important;
  color: rgba(255,255,255,.6) !important;
}

/* ---------- 11. 面包屑 ---------- */
.crumb, .breadcrumb, [aria-label="Breadcrumb"] {
  font-size: 13px !important;
  color: var(--c-text-2) !important;
  padding: 16px 0 !important;
}
.crumb a, .breadcrumb a { color: var(--c-primary-2) !important; }
.crumb a:hover { text-decoration: underline !important; }

/* ---------- 12. 图片区 ---------- */
.page-detail-images figure,
[class*="detail-images"] figure {
  border: 1px solid var(--c-border) !important;
  border-radius: var(--radius) !important;
  overflow: hidden !important;
  background: #fff !important;
  transition: box-shadow var(--transition), transform var(--transition) !important;
}
.page-detail-images figure:hover {
  box-shadow: var(--shadow) !important;
  transform: translateY(-2px) !important;
}
.page-detail-images figcaption {
  padding: 10px 14px !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  color: var(--c-primary) !important;
  border-top: 1px solid var(--c-border-soft) !important;
}

/* ---------- 13. 响应式微调 ---------- */
@media (max-width: 768px) {
  section { padding: 48px 18px !important; }
  h1 { font-size: 28px !important; }
  h2 { font-size: 22px !important; }
  .button, .header-cta { padding: 10px 18px !important; font-size: 13px !important; }
  [class*="card"] { padding: 18px !important; }
  thead th, tbody td { padding: 10px 12px !important; font-size: 13px !important; }
}

/* ---------- 14. 选中文字颜色 ---------- */
::selection { background: rgba(26,95,180,.15); color: var(--c-primary); }