/* 剧场工业：近黑底 + 舞台琥珀光；几何块面，无圆角无阴影 */
:root{
  --bg:#151210;
  --bg2:#1e1a16;
  --ink:#ede6db;
  --ink-dim:#b9ae9e;
  --amber:#e0a24a;
  --amber-deep:#9c6a25;
  --line:#3a332b;
  --fs-xs:.8125rem;
  --fs-s:.9375rem;
  --fs-m:1.0625rem;
  --fs-l:1.5rem;
  --fs-xl:2.5rem;
  --fs-hero:clamp(2.4rem,6vw,4.25rem);
  --sp1:4px;--sp2:8px;--sp3:12px;--sp4:16px;--sp5:24px;--sp6:32px;--sp7:48px;--sp8:64px;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{
  background:var(--bg);color:var(--ink);
  font-family:Georgia,"Songti SC","SimSun",serif;
  font-size:var(--fs-m);line-height:1.75;
}
h1,h2,h3{font-family:"PingFang SC","Microsoft YaHei",sans-serif;color:var(--ink)}
h2{font-size:var(--fs-xl);letter-spacing:.06em;border-left:6px solid var(--amber);padding-left:var(--sp4);margin:var(--sp8) 0 var(--sp5)}
h3{font-size:var(--fs-l);letter-spacing:.04em;margin-bottom:var(--sp3)}
p{max-width:66ch}
a{color:var(--amber);text-decoration:none;border-bottom:1px solid var(--amber-deep)}
a:hover{color:#f2c483;border-bottom-color:#f2c483}
a:focus-visible,button:focus-visible{outline:2px solid var(--amber);outline-offset:2px}
img{max-width:100%;height:auto;display:block}
.container{max-width:1240px;margin:0 auto;padding:0 var(--sp5)}
/* header */
.site-header{border-bottom:2px solid var(--line);background:var(--bg2)}
.header-inner{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:var(--sp4);padding-top:var(--sp4);padding-bottom:var(--sp4)}
.brand img{height:32px;width:auto}
nav[aria-label] a{color:var(--ink-dim);border-bottom:none;font-family:"PingFang SC","Microsoft YaHei",sans-serif;font-size:var(--fs-s);letter-spacing:.08em;margin-left:var(--sp4)}
nav[aria-label] a:hover{color:var(--amber)}
/* hero */
.hero-index{display:grid;grid-template-columns:1.1fr .9fr;gap:var(--sp6);padding:var(--sp8) 0;align-items:center}
.kicker{font-family:"PingFang SC","Microsoft YaHei",sans-serif;font-size:var(--fs-xs);letter-spacing:.35em;color:var(--amber);text-transform:uppercase;margin-bottom:var(--sp4)}
.hero-index h1{font-size:var(--fs-hero);line-height:1.2;letter-spacing:.04em;margin-bottom:var(--sp5)}
.lead{color:var(--ink-dim);margin-bottom:var(--sp5)}
.cta-row{display:flex;gap:var(--sp4);flex-wrap:wrap}
.btn{display:inline-block;background:var(--amber);color:#181310;font-family:"PingFang SC","Microsoft YaHei",sans-serif;font-weight:700;letter-spacing:.1em;padding:var(--sp3) var(--sp6);border:none;transition:background .2s}
.btn:hover{background:#f2c483;color:#181310}
.btn.ghost{background:transparent;color:var(--amber);border:2px solid var(--amber-deep)}
.btn.ghost:hover{border-color:var(--amber);color:var(--amber)}
.hero-art{border:2px solid var(--line)}
/* breadcrumb */
.breadcrumb{font-size:var(--fs-xs);letter-spacing:.12em;color:var(--ink-dim);padding-top:var(--sp5)}
.breadcrumb a{color:var(--ink-dim);border:none}
.breadcrumb span{margin:0 var(--sp2)}
/* page head */
.page-head{padding:var(--sp6) 0 var(--sp2)}
.page-head h1{font-size:var(--fs-xl);letter-spacing:.08em;margin-bottom:var(--sp4)}
.page-head p{color:var(--ink-dim);margin-bottom:var(--sp5)}
.page-head figure{border:2px solid var(--line);margin:var(--sp6) 0}
/* abilities */
.ability-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--sp6);border-top:2px solid var(--line);padding-top:var(--sp6)}
.ability-grid article{border-top:6px solid var(--amber);padding-top:var(--sp4)}
.ability-grid p{color:var(--ink-dim)}
/* 9-grid (contract) */
.items{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;margin-top:var(--sp6)}
.item{border:2px solid var(--line);background:var(--bg2);padding-bottom:var(--sp4)}
.item img{width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;display:block;border-bottom:2px solid var(--line)}
.item h2,.item h3{font-size:var(--fs-m);letter-spacing:.06em;margin:var(--sp3) var(--sp4) var(--sp2);border:none;padding:0}
.item p{font-size:var(--fs-s);color:var(--ink-dim);margin:0 var(--sp4) var(--sp2)}
.item ul{list-style:none;margin:0 var(--sp4)}
.item li{font-size:var(--fs-s);color:var(--ink-dim);padding-left:var(--sp4);position:relative}
.item li::before{content:"";position:absolute;left:0;top:.7em;width:6px;height:6px;background:var(--amber)}
@media(max-width:760px){.items{grid-template-columns:minmax(0,1fr)}}
.section-note{color:var(--ink-dim)}
/* process */
.process ol{list-style:none;counter-reset:step;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--sp6);margin-top:var(--sp6)}
.process li{border-top:2px solid var(--line);padding-top:var(--sp4)}
.process h3{font-family:"PingFang SC","Microsoft YaHei",sans-serif;color:var(--amber)}
.process p{color:var(--ink-dim);margin-top:var(--sp2)}
/* faq */
.qa{border-bottom:1px solid var(--line);padding:var(--sp4) 0}
.qa h3,.qa h2{font-size:var(--fs-m);border:none;padding:0;margin-bottom:var(--sp2);letter-spacing:.04em}
.qa p{color:var(--ink-dim)}
.more-link{margin-top:var(--sp5)}
/* about */
.about-head{display:grid;grid-template-columns:.9fr 1.1fr;gap:var(--sp6);align-items:center;padding:var(--sp6) 0}
.about-head figure{border:2px solid var(--line)}
.about-head h1{font-size:var(--fs-xl);letter-spacing:.06em;margin-bottom:var(--sp3)}
.about-head p{color:var(--ink-dim)}
.about-body h2{margin-top:var(--sp7)}
.about-body p{color:var(--ink-dim);margin-bottom:var(--sp4)}
/* guide */
.guide{padding:var(--sp6) 0}
.guide h1{font-size:var(--fs-xl);letter-spacing:.06em;margin-bottom:var(--sp4)}
.guide-intro{color:var(--ink-dim);margin-bottom:var(--sp5)}
.guide h2{font-size:var(--fs-l);margin-top:var(--sp7)}
.guide p{color:var(--ink-dim);margin-bottom:var(--sp4)}
.table-wrap{overflow-x:auto;margin:var(--sp5) 0;border:2px solid var(--line)}
table{border-collapse:collapse;width:100%;font-size:var(--fs-s)}
th,td{border:1px solid var(--line);padding:var(--sp3) var(--sp4);text-align:left;vertical-align:top}
th{background:var(--bg2);font-family:"PingFang SC","Microsoft YaHei",sans-serif;color:var(--amber);letter-spacing:.06em}
td{color:var(--ink-dim)}
.checklist{list-style:none;margin:var(--sp4) 0}
.checklist li{color:var(--ink-dim);padding:var(--sp2) 0 var(--sp2) var(--sp5);position:relative;border-bottom:1px dashed var(--line)}
.checklist li::before{content:"";position:absolute;left:0;top:1em;width:10px;height:10px;border:2px solid var(--amber)}
/* cta */
.cta-block{margin:var(--sp8) 0;border:2px solid var(--amber-deep);padding:var(--sp6);text-align:center}
.cta-block h2{border:none;padding:0;margin-bottom:var(--sp3)}
.cta-block p{margin:0 auto var(--sp5);color:var(--ink-dim)}
/* footer */
.site-footer{border-top:2px solid var(--line);background:var(--bg2);margin-top:var(--sp8)}
.footer-inner{padding:var(--sp6) 0;display:grid;gap:var(--sp3);color:var(--ink-dim);font-size:var(--fs-s)}
.footer-inner a{color:var(--ink-dim);border:none;margin-right:var(--sp3)}
.footer-inner a:hover{color:var(--amber)}
/* responsive */
@media(max-width:900px){
  .hero-index,.about-head,.ability-grid,.process ol{grid-template-columns:minmax(0,1fr)}
  .header-inner{flex-direction:column;align-items:flex-start}
  nav[aria-label] a{margin-left:0;margin-right:var(--sp4)}
}