/* ═══════════════════════════════════════════════════════════
   MACHINEER — ENGINEERING BLUEPRINT 设计系统 (v4)
   挂在每页内联 <style> 之后:同名 token / 组件后者覆盖,
   页面专属样式通过 var() 自动继承新系统。
   图纸蓝 #1d52c9 主导 · 标注橙 #e8590c 锐利强调
   Chakra Petch (display) + IBM Plex Mono (标注)
   ═══════════════════════════════════════════════════════════ */
:root{
  --bg:#f7f9fb; --bg2:#eef2f7; --surface:#ffffff;
  --ink:#10243e; --ink2:#3d5170; --muted:#5e7089;
  --line:#d6deeb; --line2:#b9c6da;
  --brand:#1d52c9; --brand2:#1d52c9; --brand-deep:#143a8f;
  --violet:#e8590c; /* 旧紫色槽位 → 标注橙 */
  --orange:#e8590c; --orange-soft:#fdeee3;
  --grad:linear-gradient(120deg,var(--brand),var(--brand));
  --grad-v:linear-gradient(120deg,var(--orange),var(--orange));
  --line-blue:rgba(29,82,201,.28); --line-faint:rgba(29,82,201,.12);
  --grid-minor:rgba(16,36,62,.045); --grid-major:rgba(29,82,201,.085);
  --radius:2px; --radius-sm:2px;
  --shadow-sm:3px 3px 0 rgba(29,82,201,.10);
  --shadow:6px 6px 0 rgba(29,82,201,.10);
  --shadow-brand:4px 4px 0 rgba(29,82,201,.18);
  --hard:6px 6px 0 rgba(29,82,201,.10);
  --hard-sm:4px 4px 0 rgba(29,82,201,.10);
  --disp:'Chakra Petch','PingFang SC','Microsoft YaHei',sans-serif;
  --mono:'IBM Plex Mono','PingFang SC',monospace;
  --body:-apple-system,BlinkMacSystemFont,'PingFang SC','Hiragino Sans GB','Microsoft YaHei',sans-serif;
}

body{ font-family:var(--body); color:var(--ink); background:var(--bg); }
/* 制图纸网格,覆盖旧版光晕背景 */
body::before{ content:''; position:fixed; inset:0; z-index:-1; pointer-events:none;
  background-image:
    linear-gradient(var(--grid-minor) 1px,transparent 1px),
    linear-gradient(90deg,var(--grid-minor) 1px,transparent 1px),
    linear-gradient(var(--grid-major) 1px,transparent 1px),
    linear-gradient(90deg,var(--grid-major) 1px,transparent 1px);
  background-size:12px 12px,12px 12px,96px 96px,96px 96px;
  -webkit-mask-image:none; mask-image:none; opacity:1; }
body::after{ content:none; }
.mono{ font-family:var(--mono); }

/* 图纸外框 + 四角十字定位标 */
.sheet-frame{ position:fixed; inset:10px; z-index:30; pointer-events:none;
  border:1px solid var(--line-blue); }
.sheet-frame i{ position:absolute; width:18px; height:18px; }
.sheet-frame i::before,.sheet-frame i::after{ content:''; position:absolute; background:var(--brand); opacity:.55; }
.sheet-frame i::before{ left:50%; top:0; width:1px; height:100%; }
.sheet-frame i::after{ top:50%; left:0; height:1px; width:100%; }
.sheet-frame .c1{ top:-9px; left:-9px; } .sheet-frame .c2{ top:-9px; right:-9px; }
.sheet-frame .c3{ bottom:-9px; left:-9px; } .sheet-frame .c4{ bottom:-9px; right:-9px; }
@media (max-width:920px){ .sheet-frame{ display:none; } }

/* buttons — 直角 + 硬投影 */
.btn{ border-radius:var(--radius); border:1px solid var(--ink); font-family:var(--body);
  transition:transform .16s, box-shadow .16s, background .16s, color .16s; }
.btn-primary{ background:var(--brand); border-color:var(--brand-deep); color:#fff; box-shadow:var(--hard-sm); }
.btn-primary::after{ content:none; }
.btn-primary:hover{ transform:translate(-2px,-2px); box-shadow:6px 6px 0 rgba(29,82,201,.22); background:var(--brand-deep); }
.btn-ghost{ background:var(--surface); color:var(--ink); border-color:var(--ink); }
.btn-ghost:hover{ transform:translate(-2px,-2px); box-shadow:var(--hard-sm); color:var(--brand); border-color:var(--brand); }

/* header */
.site-header{ background:rgba(247,249,251,.88); border-bottom:1px solid var(--line-blue); }
.site-header.scrolled{ box-shadow:0 4px 0 rgba(29,82,201,.06); }
.logo-mark{ border-radius:var(--radius); background:var(--brand); border:1px solid var(--brand-deep);
  box-shadow:3px 3px 0 rgba(29,82,201,.18); }
.logo .lt{ font-family:var(--disp); font-weight:700; letter-spacing:.02em; }
.logo .cn{ font-family:var(--body); }
.nav-links a{ position:relative; padding:4px 0; }
.nav-links a::after{ content:''; position:absolute; left:0; bottom:-2px; width:0; height:2px; background:var(--orange); transition:width .18s; }
.nav-links a:hover::after{ width:100%; }
.drop-card{ border:1px solid var(--ink); border-radius:var(--radius); box-shadow:var(--hard); }
.drop-item{ border-radius:var(--radius); }
.di-ic{ background:var(--surface); border:1px solid var(--line-blue); border-radius:var(--radius);
  color:var(--brand); box-shadow:none; }
.di-ic.v{ background:var(--surface); color:var(--orange); border-color:rgba(232,89,12,.4); box-shadow:none; }
.nav-burger{ border:1px solid var(--ink); border-radius:var(--radius); background:var(--surface); }

/* section 脚手架:图号 kicker */
.kicker{ display:flex; align-items:center; gap:14px; font-family:var(--mono); font-size:12.5px; font-weight:600;
  letter-spacing:.14em; text-transform:uppercase; color:var(--brand);
  background:none; border:0; padding:0; border-radius:0; }
.kicker::after{ content:''; flex:0 0 64px; height:1px; background:var(--brand); opacity:.5; }
.sec-head.center .kicker{ justify-content:center; }
.sec-head.center .kicker::before{ content:''; flex:0 0 64px; height:1px; background:var(--brand); opacity:.5; }
.sec-head h2,h1,h2,h3{ font-family:var(--disp); }
.sec-head h2{ font-weight:800; letter-spacing:-.01em; }
.accent{ background:none; -webkit-background-clip:initial; background-clip:initial;
  -webkit-text-fill-color:currentColor; color:var(--brand); }

/* 卡片 = 图框:直角、墨线、角标、硬投影 */
.card{ position:relative; background:var(--surface); border:1px solid var(--ink); border-radius:var(--radius);
  box-shadow:none; transition:transform .18s, box-shadow .18s; }
.card::before,.card::after{ content:''; position:absolute; width:11px; height:11px; pointer-events:none;
  background:none; border-radius:0; }
.card::before{ top:-1px; left:-1px; border-top:2px solid var(--brand); border-left:2px solid var(--brand);
  border-bottom:0; border-right:0; inset:auto; top:-1px; left:-1px; }
.card::after{ bottom:-1px; right:-1px; border-bottom:2px solid var(--brand); border-right:2px solid var(--brand);
  border-top:0; border-left:0; }
.card:hover{ transform:translate(-3px,-3px); box-shadow:var(--hard); border-color:var(--ink); }
.icn{ border-radius:var(--radius); color:var(--brand); background:var(--surface);
  border:1px solid var(--line-blue); box-shadow:none; }
.icn.v{ color:var(--orange); border-color:rgba(232,89,12,.4); background:var(--surface); box-shadow:none; }

/* eyebrow 工程铭牌 */
.eyebrow{ color:var(--ink); background:var(--surface); border:1px solid var(--ink); border-radius:var(--radius);
  font-family:var(--mono); letter-spacing:.06em; font-weight:600; box-shadow:3px 3px 0 rgba(29,82,201,.10); }
.eyebrow .dot{ background:var(--orange); border-radius:0; }

/* footer */
footer{ background:var(--ink); }
.fc h5{ font-family:var(--mono); text-transform:uppercase; letter-spacing:.16em; }
.footer-cert span{ font-family:var(--mono); border-radius:var(--radius); }
.footer-bottom{ font-family:var(--mono); letter-spacing:.08em; }

/* 表单控件直角化 */
input,select,textarea{ border-radius:var(--radius) !important; font-family:var(--body); }
input:focus,select:focus,textarea:focus{ border-color:var(--brand); outline-offset:0; }

@media (prefers-reduced-motion:reduce){
  .reveal{ opacity:1; transform:none; transition:none; }
}

/* trends 区 NEW 角标 — 雷达脉冲:文字稳定,外圈波纹扩散 + 轻微呼吸光晕 */
.new-tag{ font-style:normal; font-family:var(--mono); font-size:8.5px; font-weight:600; letter-spacing:.06em;
  background:var(--orange); color:#fff; padding:1.5px 4px; margin-left:5px; vertical-align:super; border-radius:1px;
  position:relative; animation:new-glow 1.8s ease-in-out infinite; }
.new-tag::before{ content:''; position:absolute; inset:0; border:1px solid var(--orange); border-radius:1px;
  animation:new-ping 1.8s cubic-bezier(0,0,.2,1) infinite; pointer-events:none; }
@keyframes new-ping{
  0%{ transform:scale(1); opacity:.75; }
  75%,100%{ transform:scale(1.8,2.4); opacity:0; }
}
@keyframes new-glow{
  0%,100%{ box-shadow:0 0 0 0 rgba(232,89,12,.45); }
  50%{ box-shadow:0 0 7px 1px rgba(232,89,12,.55); }
}
@media (prefers-reduced-motion:reduce){
  .new-tag,.new-tag::before{ animation:none; }
  .new-tag::before{ display:none; }
}

/* header 尺寸与首页(v4)完全对齐 */
.nav{ height:68px; }
.logo{ gap:11px; }
.logo .lt{ font-size:19px; }
.logo-mark{ width:34px; height:34px; }
.nav-links{ gap:28px; }
.btn{ min-height:48px; padding:12px 26px; gap:9px; }
@media (max-width:920px){
  .mobile-menu{ top:68px; }
  .site-header .nav-actions .btn-primary{ min-height:38px; padding:9px 13px; }
}

/* 容器宽度与首页对齐(1180px / 48px 槽),消除切页横移 */
.wrap{ width:min(1180px, calc(100% - 48px)); }
