/* 襄阳泰美工业设计有限公司 —— 工业硬朗方向
   主色：安全橙（来自工业设备警示色），打底：水泥灰 */
:root{
  --ink:#1e2226;
  --paper:#e9e7e2;
  --panel:#f4f3ef;
  --accent:#b8511e;
  --accent-ink:#8a3a12;
  --line:2px solid var(--ink);
  --line-soft:1px solid #c9c5bd;
  --fs-xs:12px;
  --fs-s:15px;
  --fs-m:18px;
  --fs-l:28px;
  --fs-xl:44px;
  --fs-hero:clamp(40px,7vw,88px);
  --sp-1:4px;--sp-2:8px;--sp-3:12px;--sp-4:16px;--sp-5:24px;--sp-6:32px;--sp-7:48px;--sp-8:64px;
  --mono:"Courier New",ui-monospace,monospace;
}
*{box-sizing:border-box;margin:0;padding:0}
body{
  font-family:"Noto Sans SC","Microsoft YaHei",sans-serif;
  background:var(--paper);color:var(--ink);
  font-size:var(--fs-s);line-height:1.75;
}
img{max-width:100%}
.wrap{max-width:1280px;margin:0 auto;padding:0 var(--sp-5)}

/* 页头 */
.site-header{background:var(--ink);color:var(--paper);border-bottom:4px solid var(--accent)}
.header-row{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:var(--sp-4);padding-top:var(--sp-4);padding-bottom:var(--sp-4)}
.site-header nav{display:flex;flex-wrap:wrap;gap:var(--sp-5)}
.site-header a{color:var(--paper);text-decoration:none;font-weight:700;letter-spacing:.08em;font-size:var(--fs-xs);text-transform:uppercase;padding:var(--sp-1) 0;border-bottom:2px solid transparent}
.site-header a:hover{border-bottom-color:var(--accent)}
.site-header a:focus-visible,a:focus-visible,.btn:focus-visible{outline:3px solid var(--accent);outline-offset:2px}

/* 标题与正文拉开差距：标题加粗+紧字距 */
h1,h2,h3{font-weight:900;letter-spacing:-.01em;line-height:1.2}
.sec-title{font-size:var(--fs-xl);border-left:8px solid var(--accent);padding-left:var(--sp-4);margin:var(--sp-8) 0 var(--sp-5)}
.kicker{font-family:var(--mono);font-size:var(--fs-xs);letter-spacing:.25em;text-transform:uppercase;color:var(--accent-ink);margin-bottom:var(--sp-3)}
.lede{max-width:68ch;font-size:var(--fs-m)}
p{max-width:68ch}
a{color:var(--accent-ink)}
a:hover{color:var(--accent)}

.btn{display:inline-block;background:var(--accent);color:#fff;text-decoration:none;font-weight:700;padding:var(--sp-3) var(--sp-6);border:var(--line);border-color:var(--ink);letter-spacing:.05em}
.btn:hover{background:var(--ink);color:var(--paper)}
.btn.ghost{background:transparent;color:var(--ink)}
.btn.ghost:hover{background:var(--ink);color:var(--paper)}

/* 首页首屏：超大字标题 + 右图，非居中 */
.hero-mega{display:grid;grid-template-columns:1.15fr .85fr;gap:var(--sp-7);align-items:start;padding:var(--sp-8) 0;border-bottom:var(--line)}
.hero-mega h1{font-size:var(--fs-hero);margin:var(--sp-2) 0 var(--sp-5)}
.hero-actions{margin-top:var(--sp-5)}
.hero-visual{border:var(--line);background:var(--panel)}
.hero-visual img{display:block;width:100%;height:auto}

/* 能力区块：主叙述 + 两条侧注 */
.caps{padding:var(--sp-8) 0;border-bottom:var(--line)}
.cap-main{border:var(--line);background:var(--panel);padding:var(--sp-6);margin-bottom:var(--sp-5)}
.cap-main h3{font-size:var(--fs-l);margin-bottom:var(--sp-3)}
.cap-side{display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-5)}
.cap-side>div{border-top:4px solid var(--ink);padding-top:var(--sp-3)}
.cap-side h3{font-size:var(--fs-m);margin-bottom:var(--sp-2)}

/* 九宫格（契约结构） */
.items{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;margin-top:var(--sp-5)}
.item{border:var(--line);background:var(--panel);padding:var(--sp-4)}
.item img{width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;display:block;border-bottom:var(--line);margin-bottom:var(--sp-3)}
.item h2{font-size:var(--fs-m);margin-bottom:var(--sp-2)}
.item p{font-size:var(--fs-s);max-width:none}
.item ul{margin-top:var(--sp-2);padding-left:1.2em;font-size:var(--fs-xs);color:#3d4348}
@media(max-width:760px){.items{grid-template-columns:minmax(0,1fr)}}

/* 流程 */
.steps{list-style:none;display:grid;grid-template-columns:repeat(4,1fr);gap:var(--sp-5);counter-reset:none}
.step-no{font-family:var(--mono);font-size:var(--fs-l);font-weight:700;color:var(--accent);display:block;border-bottom:var(--line);margin-bottom:var(--sp-2)}
.steps h3{font-size:var(--fs-m);margin-bottom:var(--sp-2)}
.steps p{font-size:var(--fs-s);max-width:none}

/* FAQ（dl） */
.faq-home{padding:var(--sp-8) 0}
.faq-home dl{border-top:var(--line)}
.faq-home dt{font-weight:900;font-size:var(--fs-m);padding:var(--sp-4) 0 var(--sp-2)}
.faq-home dd{padding:0 0 var(--sp-4);border-bottom:var(--line-soft)}

/* CTA 带 */
.cta-strip{background:var(--ink);color:var(--paper);padding:var(--sp-7) var(--sp-6);margin:var(--sp-8) 0;border-left:12px solid var(--accent)}
.cta-strip h2{font-size:var(--fs-xl);margin-bottom:var(--sp-3)}
.cta-strip p{margin-bottom:var(--sp-5);color:#d7d4cd}

/* 内页首屏：服务页（左图右文） */
.page-head{display:grid;grid-template-columns:.9fr 1.1fr;gap:var(--sp-7);align-items:center;padding:var(--sp-7) 0;border-bottom:var(--line)}
.page-head h1{font-size:var(--fs-xl);margin-bottom:var(--sp-4)}
.page-head.reverse{grid-template-columns:1.1fr .9fr}
.page-head-visual{border:var(--line);background:var(--panel)}
.page-head-visual img{display:block;width:100%;height:auto}

/* 面包屑 */
.breadcrumb{font-size:var(--fs-xs);letter-spacing:.12em;color:#5a5f64;padding:var(--sp-5) 0 var(--sp-2)}
.breadcrumb a{color:#5a5f64;text-decoration:none}
.breadcrumb a:hover{color:var(--accent);text-decoration:underline}
.breadcrumb span{margin:0 var(--sp-2)}

/* 关于页：满版色块首屏 + 双栏 */
.hero-block{background:var(--ink);color:var(--paper);padding:var(--sp-8) var(--sp-6);border-bottom:8px solid var(--accent);margin-top:var(--sp-5)}
.hero-block h1{font-size:var(--fs-hero);max-width:20ch}
.hero-block p{color:#c9c5bd;margin-top:var(--sp-3);font-size:var(--fs-m)}
.about-cols{display:grid;grid-template-columns:.9fr 1.1fr;gap:var(--sp-7);padding:var(--sp-7) 0;align-items:start}
.about-cols figure{border:var(--line);background:var(--panel);position:sticky;top:var(--sp-5)}
.about-cols img{display:block;width:100%;height:auto}
.about-text h2{font-size:var(--fs-l);margin:var(--sp-6) 0 var(--sp-3);border-bottom:4px solid var(--accent);display:inline-block}
.about-text h2:first-child{margin-top:0}

/* 联系页：分栏首屏 + 纵向流程 */
.contact-split{display:grid;grid-template-columns:1fr .8fr;gap:var(--sp-7);align-items:center;padding:var(--sp-7) 0;border-bottom:var(--line)}
.contact-split h1{font-size:var(--fs-xl);margin-bottom:var(--sp-4)}
.contact-split figure{border:var(--line);background:var(--panel)}
.contact-split img{display:block;width:100%;height:auto}
.process-vertical ol{list-style:none;counter-reset:pv}
.process-vertical li{border:var(--line);background:var(--panel);padding:var(--sp-5);margin-bottom:var(--sp-4)}
.process-vertical h3{font-size:var(--fs-m);color:var(--accent-ink);margin-bottom:var(--sp-2)}

/* 指南文章 */
.guide-article{padding:var(--sp-6) 0}
.guide-figure{border:var(--line);background:var(--panel);margin-bottom:var(--sp-6)}
.guide-figure img{display:block;width:100%;height:auto}
.guide-article h1{font-size:var(--fs-xl);margin-bottom:var(--sp-4)}
.guide-article h2{font-size:var(--fs-l);margin:var(--sp-7) 0 var(--sp-3);border-left:8px solid var(--accent);padding-left:var(--sp-3)}
.cmp-table{width:100%;border-collapse:collapse;margin:var(--sp-5) 0;font-size:var(--fs-s)}
.cmp-table th,.cmp-table td{border:var(--line);padding:var(--sp-3);text-align:left;vertical-align:top}
.cmp-table th{background:var(--ink);color:var(--paper)}
.cmp-table tr:nth-child(even) td{background:var(--panel)}

/* FAQ 页列表 */
.faq-list{padding:var(--sp-6) 0;max-width:900px}
.faq-list h2{font-size:var(--fs-m);margin-top:var(--sp-6);padding-top:var(--sp-4);border-top:var(--line)}

/* 页脚 */
.site-footer{background:var(--ink);color:var(--paper);margin-top:var(--sp-8);padding:var(--sp-7) 0;border-top:4px solid var(--accent)}
.footer-grid{display:grid;grid-template-columns:1fr auto;gap:var(--sp-6)}
.f-name{font-weight:900;font-size:var(--fs-m);color:var(--paper);margin-bottom:var(--sp-2)}
.site-footer p{color:#b6b2aa}
.site-footer nav{display:flex;flex-wrap:wrap;gap:var(--sp-4)}
.site-footer a{color:var(--paper);font-size:var(--fs-xs);letter-spacing:.1em;text-decoration:none}
.site-footer a:hover{color:var(--accent)}

@media(max-width:900px){
  .hero-mega,.page-head,.page-head.reverse,.about-cols,.contact-split,.cap-side,.footer-grid{grid-template-columns:1fr}
  .steps{grid-template-columns:1fr 1fr}
  .hero-block{padding:var(--sp-6) var(--sp-4)}
}
@media(max-width:600px){
  .steps{grid-template-columns:1fr}
  .sec-title{font-size:var(--fs-l)}
}