:root{
--ink:#1d222b;--paper:#f4f1ea;--line:#c9c3b4;--accent:#2f6f5f;--accent-dark:#225045;--muted:#5d6470;
--fs-hero:clamp(2rem,5vw,3.4rem);--fs-h2:1.5rem;--fs-h3:1.125rem;--fs-body:1rem;--fs-small:.8125rem;--fs-kicker:.6875rem;
--sp1:4px;--sp2:8px;--sp3:12px;--sp4:16px;--sp5:24px;--sp6:32px;--sp7:48px;--sp8:64px;
}
*{box-sizing:border-box;margin:0;padding:0}
body{font-family:"Noto Sans SC","PingFang SC","Microsoft YaHei",sans-serif;color:var(--ink);background:var(--paper);line-height:1.75;font-size:var(--fs-body);background-image:linear-gradient(var(--line) 1px,transparent 1px);background-size:100% 96px;background-position:0 48px}
.wrap{max-width:1240px;margin:0 auto;padding:0 var(--sp5)}
h1,h2,h3{line-height:1.3;font-weight:700;letter-spacing:.01em}
a{color:var(--accent-dark);text-decoration-thickness:1px;text-underline-offset:3px}
a:hover{color:var(--ink)}
a:focus,button:focus{outline:2px solid var(--accent);outline-offset:2px}
.site-header{border-bottom:2px solid var(--ink);background:var(--paper);position:sticky;top:0;z-index:10}
.header-grid{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:var(--sp4);padding-top:var(--sp3);padding-bottom:var(--sp3)}
nav a{margin-right:var(--sp4);text-decoration:none;font-size:var(--fs-small);letter-spacing:.06em}
nav a:hover{text-decoration:underline}
.kicker{font-family:"Courier New",monospace;font-size:var(--fs-kicker);letter-spacing:.24em;color:var(--muted);text-transform:uppercase}
.breadcrumb{font-size:var(--fs-small);letter-spacing:.08em;color:var(--muted);padding:var(--sp4) 0;display:flex;gap:var(--sp2)}
.breadcrumb a{color:var(--muted)}
.section{padding:var(--sp8) 0;border-top:1px solid var(--line)}
.sec-title{font-size:var(--fs-h2);margin-bottom:var(--sp5);border-left:6px solid var(--accent);padding-left:var(--sp3)}
/* 首屏：左右分栏 + 可见网格 */
.hero-split{display:grid;grid-template-columns:1.1fr .9fr;gap:var(--sp6);padding:var(--sp8) 0;align-items:center}
.hero-split h1{font-size:var(--fs-hero);margin-bottom:var(--sp5)}
.lead{max-width:38em;color:var(--muted)}
.actions{margin-top:var(--sp5)}
.btn{display:inline-block;background:var(--ink);color:var(--paper);padding:var(--sp3) var(--sp5);text-decoration:none;font-size:var(--fs-small);letter-spacing:.1em;border:1px solid var(--ink)}
.btn:hover{background:var(--accent-dark);border-color:var(--accent-dark);color:#fff}
.btn.ghost{background:transparent;color:var(--ink)}
.btn.ghost:hover{background:var(--ink);color:var(--paper)}
.hero-media img{width:100%;height:auto;display:block;border:1px solid var(--ink)}
.col3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--sp5)}
.block{border-top:2px solid var(--ink);padding-top:var(--sp4)}
.block h3{margin-bottom:var(--sp2);color:var(--accent-dark)}
/* 九宫格 */
.items{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.item{border:1px solid var(--ink);padding:0 0 var(--sp4)}
.item img{width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;display:block;border-bottom:1px solid var(--ink)}
.item h2,.item h3{font-size:var(--fs-h3);padding:var(--sp3) var(--sp4) 0}
.item p{padding:var(--sp2) var(--sp4) 0;font-size:var(--fs-small);color:var(--muted)}
.item ul{padding:var(--sp2) var(--sp4) 0 var(--sp5);font-size:var(--fs-small);list-style:square}
@media(max-width:760px){.items{grid-template-columns:minmax(0,1fr)}}
.steps{list-style:none;counter-reset:none;display:grid;grid-template-columns:repeat(4,1fr);gap:var(--sp5)}
.steps span{font-family:"Courier New",monospace;font-size:var(--fs-h2);color:var(--accent);display:block;border-bottom:2px solid var(--ink);margin-bottom:var(--sp2)}
.steps.vertical{grid-template-columns:1fr;max-width:720px}
.steps.vertical li{border-left:2px solid var(--ink);padding-left:var(--sp4);margin-bottom:var(--sp5)}
dl.faq dt{font-weight:700;margin-top:var(--sp4);color:var(--accent-dark)}
dl.faq dd{color:var(--muted);max-width:64ch}
.cta{border-top:2px solid var(--ink);text-align:left}
.cta h2{font-size:var(--fs-h2);margin-bottom:var(--sp2)}
.cta p{margin-bottom:var(--sp4);color:var(--muted)}
.band{background:var(--ink);color:var(--paper);padding:var(--sp7) var(--sp5)}
.band a{color:#9fd4c6}
.band h2{margin-bottom:var(--sp2)}
.hero-band h1{font-size:var(--fs-hero);padding-top:var(--sp6)}
.hero-band .lead{margin:var(--sp4) 0 var(--sp6)}
.hero-media-full{position:relative;padding-top:var(--sp5)}
.hero-media-full img{width:100%;height:auto;display:block;border:1px solid var(--ink)}
.overlay-title{position:absolute;left:var(--sp5);bottom:var(--sp4);background:var(--paper);border:1px solid var(--ink);padding:var(--sp2) var(--sp4);font-size:var(--fs-h2)}
.hero-contact{display:grid;grid-template-columns:1.2fr .8fr;gap:var(--sp6);padding:var(--sp6) 0;align-items:center}
.hero-contact h1{font-size:var(--fs-hero);margin-bottom:var(--sp4)}
.mail-line{margin-top:var(--sp5);display:flex;gap:var(--sp4);align-items:baseline}
.mail-line a{font-family:"Courier New",monospace;font-size:1.25rem;font-weight:700}
.hero-contact img{width:100%;height:auto;border:1px solid var(--ink)}
.prose{max-width:70ch}
.prose h2{font-size:var(--fs-h2);margin:var(--sp7) 0 var(--sp3)}
.prose h3{margin:var(--sp6) 0 var(--sp3)}
.prose p{margin-bottom:var(--sp4)}
.article-head img{width:100%;height:auto;border:1px solid var(--ink);margin:var(--sp4) 0}
.meta{font-size:var(--fs-small);color:var(--muted);letter-spacing:.08em}
table{border-collapse:collapse;width:100%;margin:var(--sp4) 0;font-size:var(--fs-small)}
th,td{border:1px solid var(--ink);padding:var(--sp2) var(--sp3);text-align:left}
th{background:var(--ink);color:var(--paper)}
.faq-list h2{font-size:var(--fs-h3);margin-top:var(--sp5);padding-left:var(--sp3);border-left:4px solid var(--accent)}
.faq-list p{color:var(--muted);margin-top:var(--sp2)}
.site-footer{border-top:2px solid var(--ink);margin-top:var(--sp8);padding:var(--sp6) 0;background:var(--paper)}
.foot-grid{display:flex;flex-wrap:wrap;justify-content:space-between;gap:var(--sp5)}
.foot-name{font-weight:700}
.site-footer nav{display:flex;flex-wrap:wrap}
.site-footer p{font-size:var(--fs-small);color:var(--muted)}
@media(max-width:900px){
.hero-split,.hero-contact,.col3,.steps{grid-template-columns:1fr}
.overlay-title{position:static;margin-top:var(--sp3);display:inline-block}
}