/* MAT 站点外壳样式（页头 / 页脚 / 按钮 / 令牌）
 * 单一源：index.html、terms.html、privacy.html 都引这一份。
 * 各页面的**专属**样式（hero、终端、流程、文档排版…）仍写在各自页面的 <style> 里。
 * ⚠️ 改页头或页脚只改这里——三页自动一致。
 */

:root{
  --p:#4F5BFF;--p2:#6C7BFF;--p-soft:#EEF0FF;--p-line:#D9DEFF;
  --ink:#0E1120;--ink-2:#171A22;--ink-3:#1E2333;
  --text:#141824;--muted:#6E7587;--line:#E6E9F2;--surface:#F7F8FC;--ok:#00B42A;
  --r-s:10px;--r-m:14px;--r-l:20px;--r-xl:28px;
  --sh-1:0 1px 2px rgba(20,24,36,.06),0 6px 18px -8px rgba(20,24,36,.14);
  --sh-2:0 10px 40px -12px rgba(20,24,36,.22);
  --sh-p:0 12px 34px -10px rgba(79,91,255,.5);
  --w:1160px;
  --f:-apple-system,BlinkMacSystemFont,'Segoe UI','PingFang SC','Hiragino Sans GB','Microsoft YaHei','HarmonyOS Sans SC',sans-serif;
  --fm:ui-monospace,SFMono-Regular,Menlo,Consolas,'Liberation Mono',monospace;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;background:#fff;color:var(--text);font-family:var(--f);font-size:16px;line-height:1.75;overflow-x:hidden}
h1,h2,h3,h4{margin:0;line-height:1.22;letter-spacing:-.015em;font-weight:700}
p{margin:0}
a{color:inherit}
code{font-family:var(--fm);font-size:.88em}
.wrap{width:100%;max-width:var(--w);margin:0 auto;padding:0 24px}
.skip{position:absolute;left:-9999px}
.skip:focus{left:24px;top:12px;z-index:99;background:#fff;padding:10px 16px;border-radius:var(--r-s);box-shadow:var(--sh-2)}

/* ===== 页头 ===== */
header.site{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.82);backdrop-filter:saturate(180%) blur(14px);border-bottom:1px solid transparent;transition:border-color .25s,box-shadow .25s}
header.site.stuck{border-bottom-color:var(--line);box-shadow:0 1px 0 rgba(20,24,36,.02)}
.bar{display:flex;align-items:center;justify-content:space-between;gap:18px;height:66px}
.logo{display:flex;align-items:center;gap:10px;font-weight:700;font-size:18px;text-decoration:none;letter-spacing:-.01em}
.logo img{display:block;width:28px;height:28px}
.logo b{color:var(--p)}
.logo .tag{color:var(--muted);font-weight:500;font-size:14px}
nav.main{display:flex;align-items:center;gap:4px}
nav.main a{padding:8px 12px;border-radius:var(--r-s);text-decoration:none;font-size:14.5px;color:#3A4152;transition:background .18s,color .18s}
nav.main a:hover{background:var(--p-soft);color:var(--p)}
nav.main a[aria-current=page]{color:var(--p);background:var(--p-soft)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:11px 20px;border-radius:var(--r-s);text-decoration:none;font-weight:600;font-size:15px;border:1px solid transparent;cursor:pointer;transition:transform .16s,box-shadow .2s,background .2s}
.btn.pri{background:linear-gradient(135deg,var(--p),var(--p2));color:#fff;box-shadow:var(--sh-p)}
.btn.pri:hover{transform:translateY(-1px);box-shadow:0 16px 40px -10px rgba(79,91,255,.6)}
.btn.sec{background:#fff;border-color:var(--p-line);color:var(--p)}
.btn.sec:hover{background:var(--p-soft)}
.btn.ghost2{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.22);color:#fff}
.btn.ghost2:hover{background:rgba(255,255,255,.14)}
.btn.sm{padding:9px 16px;font-size:14px}
.burger{display:none;width:42px;height:42px;border:1px solid var(--line);background:#fff;border-radius:var(--r-s);padding:0;cursor:pointer;align-items:center;justify-content:center}
.burger span{display:block;width:18px;height:2px;background:var(--text);border-radius:2px;position:relative}
.burger span:before,.burger span:after{content:'';position:absolute;left:0;width:18px;height:2px;background:var(--text);border-radius:2px}
.burger span:before{top:-6px}.burger span:after{top:6px}

/* ===== 页面通用块 ===== */
section{padding:86px 0}
section.tint{background:linear-gradient(180deg,var(--surface),#fff)}
.sec-head{max-width:660px;margin:0 0 44px}
.sec-head.center{margin:0 auto 44px;text-align:center}
.kicker{display:inline-block;font-size:13px;font-weight:600;color:var(--p);letter-spacing:.04em;text-transform:uppercase;margin-bottom:12px}
.sec-head h2{font-size:clamp(23px,2.7vw,34px)}
.sec-head p{color:var(--muted);margin-top:14px;font-size:16.5px}
.cta-row{display:flex;flex-wrap:wrap;gap:12px;margin-top:32px}

/* ===== 页脚 ===== */
footer.site{background:var(--ink);color:#8E96AE;padding:96px 0 34px;font-size:14px}
.fgrid{display:grid;grid-template-columns:1.5fr 1fr 1fr;gap:34px}
footer.site .logo{color:#fff;font-size:19px}
footer.site .logo .tag{color:#8E96AE}
footer.site .about{color:#8E96AE;margin-top:14px;max-width:34ch;font-size:13.5px}
footer.site h4{color:#fff;font-size:13px;letter-spacing:.05em;text-transform:uppercase;margin-bottom:14px;font-weight:600}
footer.site ul{list-style:none;margin:0;padding:0}
footer.site li{margin:9px 0}
footer.site a{color:#A9B0C6;text-decoration:none}
footer.site a:hover{color:#fff}
.fbot{margin-top:48px;padding-top:22px;border-top:1px solid rgba(255,255,255,.1);display:flex;flex-wrap:wrap;gap:10px 22px;justify-content:space-between;align-items:center;font-size:13px;color:#6F7791}
.fbot a{color:#8E96AE}

/* ===== 滚动显现（由 site.js 加 .in；无 JS 时 .js 不存在 ⇒ 内容照常可见） ===== */
.js .rv{opacity:0;transform:translateY(16px);transition:opacity .6s cubic-bezier(.2,.7,.2,1),transform .6s cubic-bezier(.2,.7,.2,1)}
.js .rv.in{opacity:1;transform:none}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .js .rv{opacity:1;transform:none;transition:none}
  .card:hover{transform:none}
  .btn.pri:hover{transform:none}
}

/* ===== 外壳响应式 ===== */
@media (max-width:1000px){
  .fgrid{grid-template-columns:1fr 1fr}
  .fgrid>div:first-child{grid-column:1/-1}
}
@media (max-width:720px){
  body{font-size:15.5px}
  .wrap{padding:0 18px}
  nav.main{position:absolute;left:18px;right:18px;top:62px;flex-direction:column;align-items:stretch;gap:2px;background:#fff;border:1px solid var(--line);border-radius:var(--r-m);box-shadow:var(--sh-2);padding:8px;display:none}
  nav.main.open{display:flex}
  nav.main a{padding:11px 12px}
  .bar .btn.pri{display:none}
  .burger{display:flex}
  section{padding:58px 0}
  footer.site{padding:64px 0 30px}
  .fgrid{grid-template-columns:1fr}
}
