/* 西宁昭安信息技术有限公司 —— 技术文档 / 数据可视化混合风格 */
:root{
  --ink:#1c2733;          /* 主文字：深蓝灰 */
  --paper:#f4f2ec;        /* 打底：暖米白 */
  --panel:#ffffff;
  --line:#c9c3b4;         /* 细线 */
  --accent:#0e5a52;       /* 主色：低饱和湖青，源自高原湖水 */
  --accent-ink:#0a403b;
  --mono:"SFMono-Regular","Consolas","Courier New",monospace;
  --fs-xl:clamp(2rem,5vw,3.25rem);
  --fs-lg:clamp(1.35rem,2.5vw,1.9rem);
  --fs-md:1.0625rem;
  --fs-sm:.9375rem;
  --fs-xs:.8125rem;
  --gap:24px;
  --pad:32px;
}
*{box-sizing:border-box;margin:0;padding:0}
body{
  background:var(--paper);color:var(--ink);
  font-family:Georgia,"Songti SC","SimSun",serif;
  font-size:var(--fs-md);line-height:1.8;
}
.wrap{max-width:1280px;margin:0 auto;padding:0 24px}
/* 顶栏 */
.site-head{background:var(--ink);color:var(--paper)}
.head-in{display:flex;flex-wrap:wrap;gap:16px;align-items:center;justify-content:space-between;padding:16px 24px}
.site-head nav{display:flex;flex-wrap:wrap;gap:8px 24px}
.site-head nav a{color:var(--paper);text-decoration:none;font-family:var(--mono);font-size:var(--fs-sm);letter-spacing:.06em;padding:4px 2px;border-bottom:2px solid transparent}
.site-head nav a:hover{border-bottom-color:var(--paper)}
.site-head nav a:focus{outline:2px solid var(--paper);outline-offset:2px}
/* hero 变体 */
.hero-split{display:grid;gap:32px;padding:64px 24px;align-items:center}
@media(min-width:900px){.hero-split{grid-template-columns:1.2fr .8fr}}
.hero-copy h1{font-size:var(--fs-xl);line-height:1.25;letter-spacing:.02em;font-weight:700}
.lede{max-width:68ch;margin-top:16px}
.kicker{font-family:var(--mono);font-size:var(--fs-xs);letter-spacing:.18em;text-transform:uppercase;color:var(--accent-ink);margin-bottom:12px;border-bottom:1px solid var(--line);display:inline-block;padding-bottom:4px}
.hero-art img,.side-art img,.hero-contact figure img,.hero-text figure img{width:100%;height:auto;border:1px solid var(--line);background:var(--panel)}
/* 区块标题 */
.sec-title{font-size:var(--fs-lg);margin:64px 0 16px;padding-bottom:8px;border-bottom:2px solid var(--ink);letter-spacing:.03em}
.sec-title .no{font-family:var(--mono);color:var(--accent);font-size:var(--fs-sm);margin-right:12px;letter-spacing:.1em}
.sec-note{font-family:var(--mono);font-size:var(--fs-sm);color:#5a6470;margin-bottom:16px}
/* 能力 */
.cap-grid{display:grid;gap:0;border-top:1px solid var(--line)}
.cap{padding:24px 0;border-bottom:1px solid var(--line)}
@media(min-width:900px){.cap-grid{grid-template-columns:repeat(3,1fr)}.cap{border-bottom:none;border-right:1px solid var(--line);padding:24px}.cap:last-child{border-right:none}.cap-grid{border-top:1px solid var(--line)}}
.cap h3{font-size:var(--fs-md);font-family:var(--mono);letter-spacing:.08em;color:var(--accent-ink);margin-bottom:8px}
.cap p{font-size:var(--fs-sm);max-width:34ch}
/* 九宫格 */
.items{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.item img{width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;display:block;border:1px solid var(--line)}
.item{background:var(--panel);border:1px solid var(--line);padding:0}
.item h2,.item h3{font-size:1.0625rem;padding:16px 16px 0;letter-spacing:.04em}
.item h2{counter-increment:none}
.items article{counter-increment:item}
.item p{font-size:var(--fs-sm);padding:8px 16px 0;line-height:1.7}
.item ul{list-style:none;padding:8px 16px 16px}
.item li{font-size:var(--fs-xs);font-family:var(--mono);color:#44505c;padding-left:16px;position:relative;line-height:1.9}
.item li::before{content:"—";position:absolute;left:0;color:var(--accent)}
@media(max-width:760px){.items{grid-template-columns:minmax(0,1fr)}}
@media(min-width:761px) and (max-width:1020px){.items{grid-template-columns:repeat(2,minmax(0,1fr))}}
/* 流程 */
.steps{list-style:none;counter-reset:s;display:grid;gap:16px;margin-top:16px}
.steps li{border:1px solid var(--line);background:var(--panel);padding:16px 16px 16px 64px;position:relative;counter-increment:s}
.steps li::before{content:counter(s,decimal-leading-zero);font-family:var(--mono);font-size:1.5rem;color:var(--accent);position:absolute;left:16px;top:12px}
.steps strong{display:block;font-family:var(--mono);letter-spacing:.06em;margin-bottom:4px}
.steps span{font-size:var(--fs-sm)}
@media(min-width:900px){.steps{grid-template-columns:repeat(4,1fr)}.steps.vertical{grid-template-columns:1fr}}
/* FAQ */
.faq-list{border-top:1px solid var(--line)}
details{border-bottom:1px solid var(--line);background:var(--panel)}
summary{cursor:pointer;padding:16px;font-size:var(--fs-md);font-weight:700;letter-spacing:.02em}
summary:hover{color:var(--accent-ink)}
details p{padding:0 16px 16px;font-size:var(--fs-sm);max-width:68ch}
.faq-page h2{margin:48px 0 8px;font-size:var(--fs-md);font-family:var(--mono);letter-spacing:.1em;color:var(--accent-ink)}
.more-link{font-family:var(--mono);font-size:var(--fs-sm);margin-top:16px}
/* CTA */
.cta-band{background:var(--ink);color:var(--paper);margin-top:64px;padding:48px 0}
.cta-band h2{font-size:var(--fs-lg);letter-spacing:.02em}
.cta-band p{color:#cfd6dc;margin:8px 0 16px;font-size:var(--fs-sm)}
/* 按钮 */
.btn{display:inline-block;background:var(--accent);color:#fff;font-family:var(--mono);font-size:var(--fs-sm);letter-spacing:.08em;text-decoration:none;padding:10px 24px;border:1px solid var(--accent-ink)}
.btn:hover{background:var(--accent-ink)}
.btn:focus{outline:2px solid var(--ink);outline-offset:2px}
.btn.ghost{background:transparent;color:var(--ink)}
.btn.ghost:hover{background:var(--line)}
.cta-band .btn:hover{background:#fff;color:var(--ink)}
/* 正文页 */
.prose{max-width:72ch;padding-top:32px;padding-bottom:64px}
.prose h2{font-size:var(--fs-lg);margin:48px 0 16px;letter-spacing:.03em;border-left:4px solid var(--accent);padding-left:12px}
.prose p{margin-bottom:16px}
.prose a{color:var(--accent-ink)}
/* 表格 */
.table-wrap{overflow-x:auto;margin:16px 0 24px;border:1px solid var(--line)}
table{border-collapse:collapse;width:100%;background:var(--panel);font-size:var(--fs-sm)}
caption{text-align:left;font-family:var(--mono);font-size:var(--fs-xs);padding:8px;color:#44505c}
th,td{border:1px solid var(--line);padding:8px 12px;text-align:left}
th{background:var(--paper);font-family:var(--mono);letter-spacing:.05em}
/* 面包屑 */
.breadcrumb{padding-top:16px;font-size:12px;letter-spacing:.08em;color:#6b7480}
.breadcrumb a{color:#6b7480;text-decoration:none}
.breadcrumb a:hover{color:var(--accent-ink);text-decoration:underline}
.breadcrumb span{margin:0 8px}
/* 联系页 */
.hero-contact{display:grid;gap:32px;padding:48px 24px;align-items:start}
@media(min-width:900px){.hero-contact{grid-template-columns:.9fr 1.1fr}}
.contact-mail{font-family:var(--mono);font-size:var(--fs-md);margin:16px 0}
.contact-mail a{color:var(--accent-ink)}
.hero-text{padding:48px 24px 16px}
.hero-text figure{max-width:720px;margin-bottom:24px}
/* 页脚 */
.site-foot{background:var(--ink);color:var(--paper);margin-top:0;padding:32px 0}
.foot-in{display:flex;flex-wrap:wrap;gap:24px;justify-content:space-between;align-items:flex-start}
.foot-name{font-family:var(--mono);letter-spacing:.06em;margin-bottom:4px}
.site-foot p{font-size:var(--fs-xs);color:#cfd6dc}
.site-foot nav{display:flex;flex-wrap:wrap;gap:8px 20px}
.site-foot nav a{color:var(--paper);font-size:var(--fs-sm);text-decoration:none;border-bottom:1px solid transparent}
.site-foot nav a:hover{border-bottom-color:var(--paper)}
.site-foot nav a:focus{outline:2px solid var(--paper);outline-offset:2px}
img{max-width:100%}