/* ══════════════════════════════════════
   DESIGN TOKENS — 全站统一（以首页规格为准）
══════════════════════════════════════ */
:root {
  --paper:      #FFFFFF;
  --mist:       #F6F7F9;
  --mist-card:  #EFF1F4;
  --line:       #E7E9ED;

  --ink:        #14181F;
  --ink-soft:   #4B5160;
  --slate:      #83899A;

  --orange:      #FF6A13;
  --orange-deep: #E85A00;
  --orange-sub:  rgba(255,106,19,.10);
  --orange-glow: rgba(255,106,19,.28);
  --orange-tint: #FFF2E8;

  --footer-bg:  #14181F;
  --footer-line:#262B35;
  --footer-txt: #9CA1AD;

  --font-d: 'Outfit', sans-serif;
  --font-b: 'DM Sans', sans-serif;
  --r:  8px;
  --rs: 5px;
  --section-v: 112px; /* 统一采用首页规格 */
}

*,*::before,*::after { box-sizing:border-box; }
body,html { margin:0; padding:0; overflow-x:hidden; font-family:var(--font-b); background:var(--paper); color:var(--ink); -webkit-font-smoothing:antialiased; scroll-behavior:smooth; }
h1,h2,h3,p,ul { margin:0; padding:0; }
h1,h2,h3,.section-title,.hero-title { font-family:var(--font-d); }
img { max-width:100%; display:block; }
a { color:inherit; text-decoration:none; }

.inner { max-width:1680px; margin:0 auto; padding:0 4%; } /* 统一采用首页规格 */
section { width:100%; }
.band-white { background:var(--paper); }
.band-mist  { background:var(--mist); }
.band-tint  { background:var(--orange-tint); }
.band-dark,.band-ink { background:var(--footer-bg); }

.pad-xl { padding:var(--section-v) 0; }
.pad-lg { padding:72px 0; }
.pad-md { padding:52px 0; }

.eyebrow { font-size:11px; font-weight:700; letter-spacing:3px; text-transform:uppercase; color:var(--orange-deep); margin-bottom:14px; display:block; }
.eyebrow.center { text-align:center; }
.section-title { text-align:center; font-family:var(--font-d); font-size:36px; font-weight:800; margin-bottom:44px; line-height:1.15; color:var(--ink); }

/* ══════════════════════════════════════
   BUTTONS（全站共用）
══════════════════════════════════════ */
.btn-primary { background:var(--orange); color:#FFF; padding:13px 26px; font-weight:700; font-size:14px; border-radius:var(--rs); transition:background .2s, box-shadow .2s; display:inline-flex; align-items:center; gap:8px; font-family:var(--font-b); border:none; cursor:pointer; }
.btn-primary:hover { background:var(--orange-deep); box-shadow:0 0 24px var(--orange-glow); }
.btn-secondary { background:#fff; color:var(--ink); padding:13px 26px; font-weight:700; font-size:14px; border-radius:var(--rs); border:1.5px solid var(--line); transition:all .2s; display:inline-flex; align-items:center; gap:8px; font-family:var(--font-b); }
.btn-secondary:hover { border-color:var(--orange); color:var(--orange-deep); }
.btn-wa { background:#25D366; color:#fff; padding:13px 20px; font-weight:700; font-size:14px; border-radius:var(--rs); display:inline-flex; align-items:center; gap:8px; font-family:var(--font-b); transition:filter .2s; }
.btn-wa:hover { filter:brightness(.94); }

/* ══════════════════════════════════════
   BREADCRUMB（内页共用）
══════════════════════════════════════ */
.crumb-bar { margin-top:68px; border-bottom:1px solid var(--line); background:var(--paper); }
.crumb { display:flex; align-items:center; gap:8px; font-size:12.5px; color:var(--slate); padding:15px 0; flex-wrap:wrap; }
.crumb a { color:var(--slate); font-weight:600; }
.crumb a:hover { color:var(--orange-deep); }
.crumb .sep { color:var(--line); }
.crumb .current { color:var(--ink); font-weight:700; }

/* ══════════════════════════════════════
   PHOTO SLOT（图片占位系统，全站共用，等真实图片到位后逐步替换）
══════════════════════════════════════ */
.photo-slot { width:100%; height:100%; min-height:220px; background:linear-gradient(135deg,var(--mist-card) 0%,var(--mist) 100%); border:1.5px dashed var(--line); border-radius:inherit; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:8px; padding:16px; text-align:center; box-sizing:border-box; }
.photo-slot .ph-icon { width:26px; height:26px; color:var(--orange); opacity:.55; flex-shrink:0; }
.photo-slot .ph-icon svg { width:100%; height:100%; }
.photo-slot .ph-label { font-size:11.5px; font-weight:700; color:var(--ink-soft); }
.photo-slot .ph-sub { font-size:10px; color:var(--slate); }
.photo-slot.sm { min-height:0; }

/* ══════════════════════════════════════
   BADGES（产品页/About页共用）
══════════════════════════════════════ */
.p-badge-row { display:flex; gap:8px; flex-wrap:wrap; }
.p-badge { font-size:11px; font-weight:700; letter-spacing:.04em; text-transform:uppercase; padding:5px 11px; border-radius:100px; background:var(--orange-sub); color:var(--orange-deep); border:1px solid rgba(255,106,19,.25); }
.p-badge.grey { background:var(--mist-card); color:var(--ink-soft); border-color:var(--line); }

/* ══════════════════════════════════════
   ANIMATIONS（全站共用，配合 animation.js 的 IntersectionObserver）
══════════════════════════════════════ */
.anim-fade { opacity:0; transform:translateY(14px); transition:opacity .55s ease, transform .55s ease; }
.anim-fade.in-view { opacity:1; transform:translateY(0); }
.anim-fade.d1 { transition-delay:.05s; }
.anim-fade.d2 { transition-delay:.1s; }
.anim-fade.d3 { transition-delay:.15s; }
.anim-fade.d4 { transition-delay:.2s; }

/* ══════════════════════════════════════
   表单 GDPR 同意勾选（4 个询盘表单共用：首页 / OEM页 / 产品页 / Contact页）
   2026-09-18 新增：服务端会校验这个勾选（未勾选直接拒绝提交），
   所以四个表单都必须有这个字段，不能只在其中一个上加。
══════════════════════════════════════ */
.consent-row { display:flex; gap:10px; align-items:flex-start; font-size:12.5px; color:var(--ink-soft); line-height:1.6; margin:0 0 14px; cursor:pointer; }
.consent-row input[type="checkbox"] { flex-shrink:0; width:16px; height:16px; margin-top:2px; accent-color:var(--orange); cursor:pointer; }
.consent-row a { color:var(--orange-deep); font-weight:700; text-decoration:underline; }

/* ══════════════════════════════════════
   文件上传区（询盘表单通用）
   2026-09-18：从 page-contact.css 挪过来，因为首页 / 产品页 / OEM 页底部的
   询盘表单也要能上传图纸；这些页面不加载 page-contact.css。
   拖拽高亮（.is-dragover）与文件名回填由 assets/js/contact-form.js 处理。
══════════════════════════════════════ */
.upload-zone { display:block; border:1.5px dashed var(--line); border-radius:var(--rs); padding:26px 20px; text-align:center; background:var(--mist-card); margin-bottom:22px; cursor:pointer; transition:border-color .15s, background .15s; }
.upload-zone:hover { border-color:var(--orange); background:var(--orange-sub); }
.upload-zone.is-dragover { border-color:var(--orange); background:var(--orange-sub); }
.upload-zone .uz-icon { width:34px; height:34px; margin:0 auto 10px; color:var(--slate); }
.upload-zone .uz-icon svg { width:100%; height:100%; }
.upload-zone .uz-title { font-size:13.5px; font-weight:700; color:var(--ink); margin-bottom:4px; }
.upload-zone .uz-sub { font-size:11.5px; color:var(--slate); line-height:1.5; }
.upload-zone .uz-filename { display:block; margin-top:10px; font-size:12px; font-weight:700; color:var(--orange-deep); word-break:break-all; }
