:root{--bg:#14110b;--panel:#2a2116;--accent:#e6b35a;--pale:#fff6e4;--radius:18px}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Inter,"Segoe UI",
"PingFang SC","Microsoft YaHei",sans-serif;color:#152135;background:#fff;line-height:1.7}
a{color:inherit;text-decoration:none}.nav{height:76px;display:flex;align-items:center;
justify-content:space-between;padding:0 max(5vw,24px);position:absolute;z-index:5;width:100%;color:#fff}
.brand{font-size:22px;font-weight:900;letter-spacing:.06em}.brand-mark{display:flex;align-items:center;
background:#fff;padding:5px 10px;border-radius:8px}.brand-logo{display:block;height:31px;width:auto;max-width:132px}
.nav-links{display:flex;gap:24px;font-size:13px}.nav .nav-cta{padding:9px 18px;
border:1px solid color-mix(in srgb,var(--accent) 70%,white);border-radius:999px;color:var(--accent)}
.nav-links a.active{color:var(--accent);font-weight:800}
.hero{min-height:712px;background:radial-gradient(circle at 26% 20%,
color-mix(in srgb,var(--accent) 26%,transparent),transparent 28%),linear-gradient(135deg,var(--bg),var(--panel));
color:#fff;display:flex;flex-direction:row-reverse;align-items:center;gap:6vw;padding:130px max(6vw,30px) 80px;
clip-path:polygon(0 0,100% 0,94% 100%,0 92%);overflow:hidden}.hero-copy{flex:1;max-width:680px;text-align:center}
.eyebrow,.section header>span,.compare span,.security span{font-size:11px;letter-spacing:.24em;color:var(--accent);
font-weight:800}h1{font-size:clamp(42px,7vw,78px);line-height:1.05;margin:18px 0 22px;
letter-spacing:-.04em}.lead{font-size:18px;opacity:.76;max-width:620px;margin-left:auto;
margin-right:auto}.actions{display:flex;gap:12px;margin-top:34px;
justify-content:center}.button{padding:13px 24px;border-radius:18px;font-weight:800;
font-size:14px;border:1px solid rgba(255,255,255,.25)}.button.primary{background:var(--accent);color:var(--bg);
border-color:var(--accent)}.visual{flex:1;min-width:320px;max-width:620px;transform:rotate(0deg)}
.zh-hero-img,.hero-shot{display:block;width:100%;max-height:430px;object-fit:cover;border-radius:var(--radius);
border:1px solid rgba(255,255,255,.16);box-shadow:0 28px 70px rgba(0,0,0,.34)}
.hero-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.28;pointer-events:none}
.hero{position:relative}.hero-copy,.hero .visual{position:relative;z-index:1}
.hero-mosaic,.hero-stack{display:grid;gap:10px}.hero-mosaic{grid-template-columns:1.2fr .8fr}
.hero-stack{grid-template-columns:repeat(3,1fr)}.hero-mosaic .hero-shot,.hero-stack .hero-shot{max-height:280px}
.section{padding:96px max(7vw,28px);max-width:1440px;margin:auto}.section header{max-width:760px;
margin-bottom:38px}h2{font-size:clamp(30px,4vw,52px);line-height:1.15;margin:12px 0}h3{line-height:1.3}
.metrics{max-width:1180px;margin:-34px auto 10px;position:relative;z-index:3;background:#fff;display:grid;
grid-template-columns:repeat(4,1fr);box-shadow:0 18px 55px rgba(11,31,58,.12);border-radius:var(--radius);
overflow:hidden}.metrics div{padding:27px;text-align:center;border-right:1px solid #e7edf4}.metrics strong{display:block;
font-size:34px;color:var(--panel)}.metrics span{font-size:12px;color:#68758a}
.feature-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.feature-grid article{padding:28px;
border:1px solid #e3eaf2;border-radius:var(--radius);background:linear-gradient(145deg,#fff,var(--pale))}
.feature-grid em{font-style:normal;color:var(--accent);font-weight:900}.feature-grid h3{font-size:20px}
.media-grid{display:grid;grid-template-columns:1.35fr 1fr 1fr;gap:16px}.media-grid figure{margin:0;
border-radius:var(--radius);overflow:hidden;background:var(--bg);color:#fff;box-shadow:0 18px 46px rgba(7,24,47,.13)}
.media-grid img{display:block;width:100%;height:260px;object-fit:cover;background:var(--panel)}.media-grid figure:first-child img{height:330px}
.media-grid figcaption{padding:14px 18px;font-size:13px;color:#dbe8f5}
.steps{display:grid;grid-template-columns:1fr 1.35fr;gap:7vw;align-items:start}
.steps ol{list-style:none;margin:0;padding:0;counter-reset:s}.steps li{display:flex;gap:20px;padding:23px 0;
border-bottom:1px solid #dce5ee}.steps li>b{color:var(--accent);font-size:13px}.steps h3,.steps p{margin:0}
.compare{display:grid;grid-template-columns:1.3fr .8fr;gap:7vw;background:var(--pale);max-width:none;
padding-left:max(9vw,28px);padding-right:max(9vw,28px)}.compare aside{background:var(--bg);color:white;
padding:32px;border-radius:var(--radius)}.compare li{margin:12px 0}.security{display:flex;align-items:center;gap:32px}
.shield{width:100px;height:100px;display:grid;place-items:center;border-radius:32% 68% 58% 42%;
background:var(--accent);color:var(--bg);font-size:44px;font-weight:900;flex:none}.faq>div{display:grid;
grid-template-columns:repeat(2,1fr);gap:12px}details{border:1px solid #dfe7ef;
border-radius:var(--radius);padding:20px;background:#fff}summary{font-weight:800;cursor:pointer}details p{color:#657286}
.footer{background:var(--bg);color:#aebbd0;padding:58px max(7vw,28px) 0;font-size:12px}
.footer-grid{max-width:1280px;margin:auto;display:grid;grid-template-columns:2fr repeat(3,1fr);gap:38px;padding-bottom:36px}
.footer strong{color:#fff;font-size:19px}.footer-logo-wrap{display:inline-flex;background:#fff;padding:6px 10px;
border-radius:8px;margin-bottom:12px}.footer-logo{height:32px;width:auto;max-width:150px}
.footer-brand p{max-width:520px;line-height:1.9}
.footer-col h5{color:#fff;font-size:14px;margin:0 0 16px}.footer-col ul{list-style:none;margin:0;padding:0}
.footer-col li{margin:9px 0}.footer-col a:hover{color:#fff}
.footer-disclaimer{max-width:1280px;margin:auto;border-top:1px solid rgba(255,255,255,.12);padding:20px 0;line-height:1.8}
.copyright{border-top:1px solid rgba(255,255,255,.12);padding:18px;text-align:center;color:#7889a1}
.downloads{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.downloads article{padding:28px;border:1px solid #dfe7ef;border-radius:var(--radius);background:#fff}
.downloads b{display:block;color:var(--accent);font-size:12px;letter-spacing:.12em}
@media(max-width:820px){.nav-links{display:none}.hero{flex-direction:column;padding-top:110px;clip-path:none}
.hero-copy{text-align:left}.actions{justify-content:flex-start;flex-wrap:wrap}.visual{min-width:0;width:100%}
.metrics{grid-template-columns:repeat(2,1fr);margin:0}.feature-grid,.media-grid,.steps,.compare,.faq>div,.downloads{grid-template-columns:1fr}
.media-grid img,.media-grid figure:first-child img{height:220px}
.section{padding:62px 22px}.footer-grid{grid-template-columns:1fr 1fr}}
@media(max-width:520px){.footer-grid{grid-template-columns:1fr}}
body.spider-home{background:#f4f7fb;color:#1b2430}
body.spider-home .nav{position:sticky;top:0;background:#fff;color:#1b2430;border-bottom:1px solid #d7e1ec}
body.spider-home .nav .nav-cta{color:var(--panel)}
body.spider-home .hero{min-height:auto;background:#fff;color:#1b2430;flex-direction:column;padding:42px max(6vw,24px);
clip-path:none;gap:28px}
body.spider-home .hero-copy{max-width:820px}
body.spider-home .lead{opacity:.84;margin:0}
body.spider-home .visual{transform:none;max-width:920px;width:100%}
body.spider-home .button{border-color:#c5d0dc;color:#1b2430}
body.spider-home .button.primary{color:#fff}
body.skin-1 .hero{min-height:88vh;flex-direction:column;justify-content:flex-end;padding-bottom:48px}body.skin-1 .hero-copy{max-width:820px}body.skin-1 .visual{max-width:none;width:min(1100px,100%);transform:none}