
:root{
  --primary:rgb(70,139,223);
  --primary-dark:#246dbf;
  --primary-soft:#eef6ff;
  --ink:#10243f;
  --muted:#5f7188;
  --line:#dce9f7;
  --card:#ffffff;
  --bg:#f7fbff;
  --shadow:0 18px 50px rgba(36,109,191,.10);
  --radius:22px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Hiragino Sans GB","Microsoft YaHei",Arial,sans-serif;color:var(--ink);background:linear-gradient(180deg,#f7fbff 0%,#fff 42%,#f5f9ff 100%);line-height:1.75;overflow-x:hidden}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
.site-header{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.88);backdrop-filter:blur(16px);border-bottom:1px solid rgba(220,233,247,.8)}
.header-inner{max-width:1180px;margin:0 auto;padding:14px 18px;display:flex;align-items:center;justify-content:space-between;gap:16px}
.logo{display:flex;align-items:center;gap:10px;font-weight:800;color:var(--ink);letter-spacing:-.02em}.logo img{width:44px;height:auto}.logo span{white-space:nowrap}
.nav{display:flex;align-items:center;justify-content:flex-end;gap:8px;flex-wrap:wrap}.nav a{font-size:14px;color:#39546f;padding:8px 10px;border-radius:999px}.nav a:hover{background:var(--primary-soft);color:var(--primary-dark)}
.container{width:min(1120px,calc(100% - 36px));margin:0 auto}.narrow{width:min(860px,calc(100% - 36px));margin:0 auto}.section{padding:56px 0}.section-title{font-size:clamp(26px,4.8vw,42px);line-height:1.18;letter-spacing:-.04em;margin:0 0 14px}.section-lead{margin:0 0 28px;color:var(--muted);font-size:16px}.eyebrow,.badge{display:inline-flex;align-items:center;gap:6px;padding:6px 12px;border-radius:999px;background:#edf6ff;color:var(--primary-dark);font-weight:700;font-size:13px;border:1px solid #d7eafe}.gradient-bg{background:radial-gradient(circle at 20% 20%,rgba(70,139,223,.18),transparent 32%),linear-gradient(135deg,#f8fbff,#edf6ff);border-bottom:1px solid var(--line)}
.hero{padding:56px 0 38px}.hero-layout{display:grid;gap:30px;align-items:center}.hero-copy h1{font-size:clamp(34px,8vw,68px);line-height:1.06;letter-spacing:-.06em;margin:18px 0;color:var(--ink)}.hero-copy p{font-size:17px;color:var(--muted);margin:0 0 22px;max-width:650px}.hero-tags,.safe-tags{display:flex;flex-wrap:wrap;gap:10px;margin-top:18px}.safe-tags span,.hero-tags span{padding:8px 12px;border-radius:999px;background:rgba(255,255,255,.75);border:1px solid #dbeaf9;color:#35506b;font-size:13px;font-weight:650}.download-btn{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:13px 24px;border-radius:999px;background:var(--primary);color:#fff!important;font-weight:800;box-shadow:0 12px 26px rgba(70,139,223,.24);transition:transform .2s ease,box-shadow .2s ease}.download-btn:hover{transform:translateY(-1px);box-shadow:0 16px 34px rgba(70,139,223,.30)}
.hero-device{position:relative;min-height:560px}.device-card{background:rgba(255,255,255,.78);border:1px solid rgba(220,233,247,.9);border-radius:30px;box-shadow:var(--shadow);padding:24px;display:flex;align-items:center;justify-content:center}.device-card img{max-height:520px;margin:auto}.float-card{position:relative;margin:12px 0;background:rgba(255,255,255,.86);border:1px solid #dce9f7;border-radius:18px;padding:13px 15px;box-shadow:0 16px 36px rgba(36,109,191,.08);font-size:14px}.float-card b{display:block;color:#183856}.float-card span{color:var(--muted);font-size:12px}.status-dot{display:inline-block;width:9px;height:9px;border-radius:50%;background:#2bb673;margin-right:7px}
.metric-strip{display:grid;gap:14px}.metric{background:#fff;border:1px solid var(--line);border-radius:20px;padding:18px;box-shadow:0 12px 34px rgba(36,109,191,.06)}.metric strong{display:block;font-size:18px;margin-bottom:4px}.metric p{margin:0;color:var(--muted);font-size:14px}.card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:22px;box-shadow:0 12px 36px rgba(36,109,191,.06)}.card h3{margin:0 0 10px;font-size:20px;line-height:1.35}.card p{margin:0;color:var(--muted)}
.feature-grid,.category-grid,.scenario-grid,.recommend-grid{display:grid;gap:16px}.feature-card,.category-card,.scenario-card{background:#fff;border:1px solid var(--line);border-radius:22px;padding:22px;box-shadow:0 12px 32px rgba(36,109,191,.06)}.category-card{display:flex;flex-direction:column;gap:10px}.category-card a,.text-link{color:var(--primary-dark);font-weight:800}.category-nav{display:flex;gap:10px;flex-wrap:wrap;margin:18px 0 28px}.category-nav a{padding:8px 12px;border-radius:999px;background:#fff;border:1px solid var(--line);color:#415b76;font-size:14px}.category-nav a:hover{background:#edf6ff;color:var(--primary-dark)}
.steps{display:grid;gap:14px;counter-reset:step}.step{position:relative;background:#fff;border:1px solid var(--line);border-radius:22px;padding:22px 20px 20px 64px;box-shadow:0 12px 30px rgba(36,109,191,.05)}.step:before{counter-increment:step;content:counter(step);position:absolute;left:20px;top:22px;width:30px;height:30px;border-radius:50%;display:grid;place-items:center;background:var(--primary);color:#fff;font-weight:800}.step h3{margin:0 0 6px}.step p{margin:0 0 10px;color:var(--muted)}.step a{color:var(--primary-dark);font-weight:800}.process-steps{display:grid;gap:14px}.process-steps li{background:#fff;border:1px solid var(--line);border-radius:18px;padding:15px 17px;color:#35506b}.process-steps strong{color:var(--ink)}
.security-layout{display:grid;gap:20px;align-items:start}.security-panel{background:linear-gradient(135deg,#ffffff,#eef6ff);border:1px solid var(--line);border-radius:28px;padding:26px;box-shadow:var(--shadow)}.security-list{display:grid;gap:12px;margin:0;padding:0;list-style:none}.security-list li{padding:13px 14px;border-radius:16px;background:#fff;border:1px solid #dce9f7;color:#36506b}.security-list li:before{content:'✓';color:var(--primary);font-weight:900;margin-right:8px}.faq-list{display:grid;gap:12px}.faq-item{background:#fff;border:1px solid var(--line);border-radius:20px;padding:20px}.faq-item h3{margin:0 0 8px;font-size:18px}.faq-item p{margin:0;color:var(--muted)}
.cta-section{padding:54px 0;text-align:center;background:linear-gradient(135deg,#eef6ff,#ffffff);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.cta-box{max-width:780px;margin:0 auto}.cta-box h2{font-size:clamp(26px,5vw,44px);line-height:1.16;margin:0 0 14px}.cta-box p{color:var(--muted);margin:0 auto 22px}.site-footer{background:#f4f8fd;border-top:1px solid var(--line);padding:38px 0;color:#526a82}.footer-grid{display:grid;gap:20px}.footer-links{display:flex;flex-wrap:wrap;gap:10px}.footer-links a{font-size:14px;padding:6px 8px;border-radius:999px}.footer-links a:hover{background:#e8f3ff;color:var(--primary-dark)}.footer-note{font-size:13px;color:#70849a;margin-top:18px}
.page-hero{padding:44px 0 26px}.page-hero h1{font-size:clamp(30px,6vw,52px);line-height:1.12;letter-spacing:-.04em;margin:16px 0 14px}.page-hero p{color:var(--muted);font-size:17px;max-width:760px}.doc-layout{display:grid;gap:22px;align-items:start}.doc-content{background:#fff;border:1px solid var(--line);border-radius:26px;padding:24px;box-shadow:0 14px 38px rgba(36,109,191,.05)}.doc-content h2{margin-top:10px;font-size:24px}.doc-content p{color:#425a74}.tip-card{background:linear-gradient(135deg,#eef6ff,#fff);border:1px solid var(--line);border-radius:22px;padding:20px}.tip-card h3{margin:0 0 10px}.tip-card ul{margin:0;padding-left:20px;color:#4b6178}.notice{border-left:4px solid var(--primary);background:#f1f7ff;border-radius:16px;padding:16px;color:#3d5772}.two-col{display:grid;gap:16px}.mini-panel{padding:18px;border:1px solid var(--line);border-radius:18px;background:#fff}.mini-panel h3{margin:0 0 8px}.mini-panel p{margin:0;color:var(--muted)}
@media (min-width:700px){.metric-strip{grid-template-columns:repeat(2,1fr)}.category-grid,.feature-grid,.scenario-grid,.recommend-grid{grid-template-columns:repeat(2,1fr)}.two-col{grid-template-columns:repeat(2,1fr)}.footer-grid{grid-template-columns:1.2fr 1fr}.steps{grid-template-columns:repeat(2,1fr)}}
@media (min-width:980px){.header-inner{padding:18px}.nav a{font-size:15px;padding:9px 12px}.hero{padding:80px 0 58px}.hero-layout{grid-template-columns:minmax(0,1.05fr) minmax(420px,.95fr);gap:54px}.hero-device{min-height:610px}.float-card{position:absolute;width:210px}.float-card.one{top:42px;left:0}.float-card.two{top:190px;right:0}.float-card.three{bottom:120px;left:10px}.float-card.four{bottom:50px;right:28px}.metric-strip{grid-template-columns:repeat(4,1fr)}.category-grid{grid-template-columns:repeat(3,1fr)}.category-card.large{grid-column:span 2}.feature-grid{grid-template-columns:repeat(3,1fr)}.feature-card.large{grid-column:span 2}.steps{grid-template-columns:repeat(3,1fr)}.security-layout{grid-template-columns:1.05fr .95fr;gap:34px}.doc-layout{grid-template-columns:minmax(0,1fr) 320px}.doc-content{padding:34px}.section{padding:72px 0}.scenario-grid{grid-template-columns:repeat(5,1fr)}.scenario-card{grid-column:span 1}.recommend-grid{grid-template-columns:repeat(4,1fr)}}
@media (max-width:480px){.header-inner{align-items:flex-start;flex-direction:column}.nav{justify-content:flex-start}.nav a{font-size:13px;padding:7px 8px}.container,.narrow{width:min(100% - 28px,1120px)}.hero{padding-top:38px}.hero-copy h1{font-size:36px}.device-card{padding:14px;border-radius:24px}.hero-device{min-height:auto}.section{padding:42px 0}.download-btn{width:100%;max-width:280px}.doc-content{padding:20px}.card,.feature-card,.category-card,.scenario-card{padding:19px}.cta-section{padding:42px 0}}
