:root{
  --ink:#123a45;          /* 深青墨：来自水与钢铁的青灰 */
  --accent:#0e6e7d;       /* 主色：处理水的青蓝 */
  --accent-2:#8fd0d8;
  --bg:#f2f6f6;           /* 低饱和打底 */
  --panel:#0d2b33;
  --line:#c9d8da;
  --paper:#fbfdfd;
  --fs-xs:.8125rem; --fs-s:.9375rem; --fs-m:1.0625rem;
  --fs-l:1.5rem; --fs-xl:2.375rem; --fs-2xl:3.25rem;
  --sp-1:4px;--sp-2:8px;--sp-3:12px;--sp-4:16px;--sp-6:24px;--sp-8:32px;--sp-12:48px;--sp-16:64px;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:"Songti SC","Noto Serif SC",Georgia,serif;font-size:var(--fs-m);line-height:1.75;color:var(--ink);background:var(--bg)}
.wrap{max-width:1240px;margin:0 auto;padding:0 var(--sp-6)}
.wrap.narrow{max-width:780px}
a{color:var(--accent);text-decoration:underline;text-underline-offset:3px}
a:hover{color:var(--ink)}
a:focus,button:focus{outline:2px solid var(--accent);outline-offset:2px}
img{max-width:100%;height:auto}
code,.kicker,.meta,.breadcrumb,footer .copy,.cap-num{font-family:"SF Mono",Consolas,"Courier New",monospace}

/* header */
.site-head{background:var(--panel);border-bottom:3px solid var(--accent)}
.head-grid{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:var(--sp-4);padding-top:var(--sp-3);padding-bottom:var(--sp-3)}
.site-head nav{display:flex;flex-wrap:wrap;gap:var(--sp-6)}
.site-head nav a{color:#cfe7ea;text-decoration:none;font-family:var(--fs-xs);font-family:"SF Mono",Consolas,monospace;font-size:var(--fs-xs);letter-spacing:.12em;padding:var(--sp-1) 0;border-bottom:2px solid transparent}
.site-head nav a:hover{color:#fff;border-bottom-color:var(--accent-2)}

/* hero variants —— 每页首屏结构不同 */
.hero{padding:var(--sp-16) 0}
.hero-split{background:var(--paper);border-bottom:6px solid var(--accent)}
.hero-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:var(--sp-12);align-items:center}
.kicker{color:var(--accent);font-size:var(--fs-xs);letter-spacing:.25em;text-transform:uppercase}
h1{font-size:var(--fs-2xl);line-height:1.25;font-weight:700;letter-spacing:.02em;margin:var(--sp-3) 0 var(--sp-4)}
.lede{max-width:62ch;font-size:var(--fs-m)}
.hero-cta{margin-top:var(--sp-6);display:flex;gap:var(--sp-4);flex-wrap:wrap}
.hero-fig img{display:block;width:100%;border:1px solid var(--line)}
.hero-banner{background:linear-gradient(120deg,var(--panel) 0%,var(--accent) 130%);color:#eaf5f6}
.hero-banner h1{color:#fff;max-width:22ch}
.hero-banner .breadcrumb a{color:var(--accent-2)}
.hero-line{background:var(--paper);border-bottom:1px solid var(--line)}
.hero-line h1{border-left:6px solid var(--accent);padding-left:var(--sp-4)}
.hero-block{background:var(--panel);color:#eaf5f6}
.hero-block h1{color:#fff}
.hero-block .lede{color:#cfe7ea;max-width:56ch}
.hero-block .breadcrumb a{color:var(--accent-2)}
.hero-doc{background:var(--paper);border-bottom:1px solid var(--line)}
.hero-doc .meta{color:var(--accent);font-size:var(--fs-xs);letter-spacing:.15em;margin-top:var(--sp-2)}

/* breadcrumb */
.breadcrumb{font-size:var(--fs-xs);letter-spacing:.08em;color:#7f9aa0;display:flex;gap:var(--sp-2);margin-bottom:var(--sp-4)}
.breadcrumb a{color:#7f9aa0;text-decoration:none}
.breadcrumb a:hover{color:var(--accent-2)}

/* buttons */
.btn{display:inline-block;background:var(--accent);color:#fff;text-decoration:none;padding:var(--sp-3) var(--sp-6);font-family:"SF Mono",Consolas,monospace;font-size:var(--fs-s);letter-spacing:.1em;border:1px solid var(--accent)}
.btn:hover{background:var(--ink);border-color:var(--ink);color:#fff}
.btn.ghost{background:transparent;color:var(--accent);border:1px solid var(--accent)}
.btn.ghost:hover{background:var(--accent);color:#fff}
.hero-block .btn{background:var(--accent-2);color:var(--ink);border-color:var(--accent-2)}
.hero-block .btn:hover{background:#fff}

/* sections */
section{padding:var(--sp-16) 0}
.sec-title{font-size:var(--fs-xl);font-weight:700;margin-bottom:var(--sp-3);letter-spacing:.02em}
.sec-sub{color:#5c7880;max-width:60ch;margin-bottom:var(--sp-8)}

/* capabilities：主叙述式，非卡片 */
.cap{background:var(--panel);color:#cfe7ea}
.cap-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--sp-12)}
.cap-block h2{color:#fff;font-size:var(--fs-l);margin-bottom:var(--sp-3)}
.cap-block p{font-size:var(--fs-s)}
.cap-num{display:block;color:var(--accent-2);font-size:var(--fs-s);letter-spacing:.3em;margin-bottom:var(--sp-2)}

/* 九宫格契约 */
.items{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.item{border:1px solid var(--line);background:var(--paper);padding:var(--sp-4)}
.item img{width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;display:block;border:1px solid var(--line)}
.item h2{font-size:var(--fs-l);margin:var(--sp-3) 0 var(--sp-2);border-top:3px solid var(--accent);padding-top:var(--sp-2)}
.item p{font-size:var(--fs-s);color:#3c5960}
.item ul{margin-top:var(--sp-2);padding-left:0;list-style:none;font-size:var(--fs-s)}
.item ul li{padding:var(--sp-1) 0;border-bottom:1px dashed var(--line)}
.item ul li::before{content:"— ";color:var(--accent)}
@media(max-width:760px){.items{grid-template-columns:minmax(0,1fr)}}

/* process */
.process{background:var(--paper);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.steps{list-style:none;counter-reset:s;display:grid;grid-template-columns:repeat(4,1fr);gap:var(--sp-8);margin-top:var(--sp-8);padding-left:0}
.steps li{counter-increment:s;border-top:3px solid var(--accent);padding-top:var(--sp-3)}
.steps li h3::before{content:counter(s,decimal-leading-zero) " / ";font-family:monospace;color:var(--accent)}
.steps li h3{font-size:var(--fs-m)}
.steps li p{font-size:var(--fs-s);color:#3c5960}
.steps.tall li p{line-height:1.8}

/* faq */
.faq{background:var(--paper)}
.faq dl,.faq-page dl{margin-top:var(--sp-6)}
dt{font-weight:700;margin-top:var(--sp-6);border-left:4px solid var(--accent);padding-left:var(--sp-3)}
dd{margin-top:var(--sp-2);padding-left:var(--sp-6);color:#3c5960;font-size:var(--fs-s)}
.faq-page h2{font-size:var(--fs-l);margin-top:var(--sp-12);padding-bottom:var(--sp-2);border-bottom:2px solid var(--line)}
.faq-page figure{margin-bottom:var(--sp-8)}
.faq-page figure img{border:1px solid var(--line)}

/* cta */
.cta{background:linear-gradient(100deg,var(--accent) 0%,var(--panel) 120%);color:#fff;text-align:center}
.cta h2{font-size:var(--fs-xl);color:#fff}
.cta p{margin:var(--sp-3) auto var(--sp-6);max-width:52ch;color:#d8ecef}
.cta .btn{background:#fff;color:var(--ink);border-color:#fff}
.cta .btn:hover{background:var(--accent-2)}

/* about */
.about-grid{padding-bottom:var(--sp-16)}
.about-cols{display:grid;grid-template-columns:1.6fr 1fr;gap:var(--sp-12)}
.about-text h2{font-size:var(--fs-l);margin:var(--sp-8) 0 var(--sp-3);padding-top:var(--sp-3);border-top:3px solid var(--accent)}
.about-text p{max-width:62ch}
.about-side{position:sticky;top:var(--sp-8);align-self:start}
.about-side figure img{border:1px solid var(--line)}
.about-facts{margin-top:var(--sp-6);border:1px solid var(--line);background:var(--paper);padding:var(--sp-4)}
.about-facts h3{font-size:var(--fs-m)}
.about-facts ul{list-style:none;padding:var(--sp-3) 0;font-size:var(--fs-s)}
.about-facts ul li{border-bottom:1px dashed var(--line);padding:var(--sp-1) 0}

/* note / contact */
.note{background:var(--paper);border-top:1px solid var(--line)}
.contact-flow{background:var(--paper);border-bottom:1px solid var(--line)}
.contact-faq figure{margin-bottom:var(--sp-6)}
.contact-faq figure img{border:1px solid var(--line)}
.cta-line{margin-top:var(--sp-8);font-size:var(--fs-s);color:#3c5960}

/* guide article */
.doc{padding-bottom:var(--sp-16)}
.doc h2{font-size:var(--fs-l);margin:var(--sp-12) 0 var(--sp-3);padding-top:var(--sp-3);border-top:3px solid var(--accent)}
.doc p{max-width:62ch;margin-top:var(--sp-3)}
.doc table{width:100%;border-collapse:collapse;margin:var(--sp-6) 0;font-size:var(--fs-s);background:var(--paper)}
.doc caption{font-family:monospace;font-size:var(--fs-xs);letter-spacing:.2em;text-align:left;color:var(--accent);padding-bottom:var(--sp-2)}
.doc th,.doc td{border:1px solid var(--line);padding:var(--sp-2) var(--sp-3);text-align:left;vertical-align:top}
.doc th{background:var(--panel);color:#cfe7ea;font-weight:700}

/* footer */
.site-foot{background:var(--panel);color:#9ab6bb;padding:var(--sp-12) 0 var(--sp-6)}
.foot-grid{display:flex;flex-wrap:wrap;justify-content:space-between;gap:var(--sp-8)}
.foot-grid nav{display:flex;flex-wrap:wrap;gap:var(--sp-6)}
.foot-grid nav a{color:#cfe7ea;font-family:monospace;font-size:var(--fs-xs);letter-spacing:.1em;text-decoration:none}
.foot-grid nav a:hover{color:#fff;border-bottom:2px solid var(--accent-2)}
.site-foot p{font-size:var(--fs-s);margin-top:var(--sp-3)}
.copy{font-size:var(--fs-xs);letter-spacing:.1em;border-top:1px solid #2c5a64;margin-top:var(--sp-8);padding-top:var(--sp-4)}

/* responsive */
@media(max-width:900px){
  .hero-grid,.cap-grid,.about-cols{grid-template-columns:1fr}
  .steps{grid-template-columns:1fr 1fr}
  h1{font-size:var(--fs-xl)}
  .about-side{position:static}
}
@media(max-width:600px){
  .steps{grid-template-columns:1fr}
  section{padding:var(--sp-12) 0}
}