:root{--bg:#05070f;--panel:rgba(16,18,30,.68);--panel2:rgba(16,18,30,.52);--stroke:rgba(255,255,255,.14);--stroke2:rgba(255,255,255,.10);--text:rgba(255,255,255,.92);--muted:rgba(255,255,255,.68);--cyan:#22d3ee;--purple:#a855f7}
*{box-sizing:border-box}html{scroll-behavior:smooth}
body{margin:0;font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial;color:var(--text);background:var(--bg);overflow-x:hidden}
a{color:inherit;text-decoration:none}
.wrap{width:min(1100px,92vw);margin:0 auto;padding:92px 0 56px}
.bg{position:fixed;inset:0;z-index:-1}
.bg__grid{position:absolute;inset:-2px;background:linear-gradient(to right,rgba(255,255,255,.06) 1px,transparent 1px) 0 0/40px 40px,linear-gradient(to bottom,rgba(255,255,255,.06) 1px,transparent 1px) 0 0/40px 40px;mask-image:radial-gradient(closest-side at 50% 25%,black 0%,transparent 72%);opacity:.45}
.bg__glow{position:absolute;width:820px;height:820px;filter:blur(70px);opacity:.55}
.bg__glow--a{left:-260px;top:-240px;background:radial-gradient(circle,rgba(34,211,238,.55),transparent 60%)}
.bg__glow--b{right:-320px;top:-180px;background:radial-gradient(circle,rgba(168,85,247,.55),transparent 60%)}
.bg__noise{position:absolute;inset:0;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='120' height='120' filter='url(%23n)' opacity='.25'/%3E%3C/svg%3E");opacity:.17;mix-blend-mode:overlay}
.topbar{position:fixed;top:0;left:0;right:0;z-index:5;display:flex;align-items:center;justify-content:space-between;padding:14px 18px;background:rgba(7,9,18,.72);border-bottom:1px solid rgba(255,255,255,.10);backdrop-filter:blur(12px)}
.brand{display:flex;gap:10px;align-items:center;font-weight:800;letter-spacing:-.02em}
.brand__dot{width:10px;height:10px;border-radius:999px;background:linear-gradient(135deg,var(--cyan),var(--purple));box-shadow:0 0 18px rgba(34,211,238,.55),0 0 26px rgba(168,85,247,.45)}
.nav{display:none;gap:18px;color:var(--muted);font-weight:650;font-size:13px}
.nav a:hover{color:rgba(255,255,255,.92)}
@media(min-width:860px){.nav{display:flex}}
.btn{border:1px solid var(--stroke);padding:10px 14px;border-radius:14px;font-weight:800;font-size:13px;letter-spacing:-.01em;display:inline-flex;align-items:center;gap:8px;transition:transform .18s ease,filter .18s ease,border-color .18s ease,background .18s ease;cursor:pointer;user-select:none;background:transparent;color:inherit}
.btn:hover{transform:translateY(-1px);filter:brightness(1.05)}
.btn--primary{background:linear-gradient(135deg,rgba(34,211,238,.24),rgba(168,85,247,.20));border-color:rgba(34,211,238,.35);box-shadow:0 12px 48px rgba(0,0,0,.45)}
.btn--outline{background:rgba(255,255,255,.04);border-color:rgba(255,255,255,.16)}
.btn--ghost{border-color:rgba(255,255,255,.10);color:rgba(255,255,255,.82)}
.btn--sm{padding:8px 12px;border-radius:12px;font-size:12px}
.hero__badge{display:flex;gap:10px;flex-wrap:wrap;margin-top:18px}
.pill{padding:8px 12px;border-radius:999px;border:1px solid var(--stroke);background:rgba(255,255,255,.04);font-weight:800;font-size:12px;color:rgba(255,255,255,.82)}
.pill--cyan{border-color:rgba(34,211,238,.36)}
.pill--purple{border-color:rgba(168,85,247,.34)}
.hero__title{margin:14px 0 10px;font-weight:950;font-size:clamp(34px,4.2vw,56px);line-height:1.02;letter-spacing:-.04em}
.hero__sub{margin:0;color:var(--muted);font-size:16px;max-width:70ch;line-height:1.7}
.neon--cyan{color:rgba(34,211,238,.98);text-shadow:0 0 18px rgba(34,211,238,.18)}
.neon--purple{color:rgba(168,85,247,.98);text-shadow:0 0 18px rgba(168,85,247,.18)}
.hero__cta{display:flex;gap:12px;flex-wrap:wrap;margin-top:16px}
.hero__meta{display:grid;grid-template-columns:1fr;gap:12px;margin-top:18px}
@media(min-width:860px){.hero__meta{grid-template-columns:repeat(3,1fr)}}
.metaCard{background:var(--panel2);border:1px solid var(--stroke2);border-radius:18px;padding:12px 14px}
.metaCard__k{font-size:12px;color:var(--muted);font-weight:800}
.metaCard__v{margin-top:6px;font-weight:850;letter-spacing:-.02em}
.hero__art{margin-top:18px;border:1px solid rgba(255,255,255,.12);border-radius:22px;background:linear-gradient(180deg,rgba(255,255,255,.06),rgba(255,255,255,.02));overflow:hidden}
.circuit{width:100%;height:auto;display:block}
.section{margin-top:44px}
.section__head{display:flex;align-items:flex-end;justify-content:space-between;gap:18px;flex-wrap:wrap}
.section__head h2{margin:0;font-size:26px;font-weight:950;letter-spacing:-.03em}
.section__head p{margin:0;color:var(--muted);max-width:62ch;line-height:1.7}
.grid3{display:grid;grid-template-columns:1fr;gap:14px;margin-top:16px}
@media(min-width:900px){.grid3{grid-template-columns:repeat(3,1fr)}}
.card{background:var(--panel);border:1px solid var(--stroke);border-radius:22px;padding:16px;position:relative;overflow:hidden}
.card:before{content:"";position:absolute;inset:-1px;background:radial-gradient(circle at 12% 10%,rgba(34,211,238,.18),transparent 55%),radial-gradient(circle at 80% 25%,rgba(168,85,247,.16),transparent 55%);opacity:.9;pointer-events:none}
.card>*{position:relative}
.card__icon{font-size:20px}
.card h3{margin:10px 0 6px;font-size:16px;font-weight:950}
.card p{margin:0;color:var(--muted);line-height:1.65}
.list{margin:10px 0 0;padding-left:18px;color:rgba(255,255,255,.78)}
.list li{margin:6px 0}
.stack{display:grid;gap:12px;margin-top:16px}
.proof{display:grid;grid-template-columns:110px 1fr;gap:14px;background:var(--panel);border:1px solid var(--stroke);border-radius:22px;padding:14px}
@media(max-width:620px){.proof{grid-template-columns:1fr}}
.proof__tag{padding:10px 12px;border-radius:16px;border:1px solid rgba(255,255,255,.14);background:rgba(0,0,0,.20);font-weight:950}
.proof__body h3{margin:0;font-size:16px;font-weight:950}
.proof__body p{margin:6px 0 10px;color:var(--muted);line-height:1.65}
.proof__chips{display:flex;gap:8px;flex-wrap:wrap}
.proof__chips span{font-size:12px;font-weight:800;padding:6px 10px;border-radius:999px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.10)}
.ctaRow{display:flex;gap:12px;flex-wrap:wrap;margin-top:14px}
.timeline{display:grid;gap:10px;margin-top:16px}
.step{display:grid;grid-template-columns:62px 1fr;gap:12px;background:var(--panel);border:1px solid var(--stroke);border-radius:22px;padding:14px}
.step__n{width:50px;height:50px;border-radius:16px;display:grid;place-items:center;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.12);font-weight:950}
.step__c h3{margin:0;font-size:16px;font-weight:950}
.step__c p{margin:6px 0 0;color:var(--muted);line-height:1.65}
.lab{display:grid;grid-template-columns:1fr;gap:14px;margin-top:16px}
@media(min-width:900px){.lab{grid-template-columns:1.15fr .85fr}}
.lab__pane{background:var(--panel);border:1px solid var(--stroke);border-radius:22px;padding:14px}
.lab__pane--right{display:grid;gap:14px}
.lab__top{display:flex;justify-content:space-between;align-items:center;gap:12px}
.lab__title{font-weight:950}
.code{margin:12px 0 0;background:rgba(0,0,0,.24);border:1px solid rgba(255,255,255,.10);border-radius:18px;padding:14px;overflow:auto;color:rgba(255,255,255,.86);line-height:1.6}
.lab__hint{margin-top:10px;color:var(--muted);font-size:12px}
.mini{background:rgba(0,0,0,.20);border:1px solid rgba(255,255,255,.12);border-radius:22px;padding:14px}
.mini--glow{background:radial-gradient(circle at 12% 10%,rgba(34,211,238,.14),transparent 55%),radial-gradient(circle at 80% 25%,rgba(168,85,247,.12),transparent 55%),rgba(0,0,0,.18)}
.mini h3{margin:0 0 10px;font-size:15px;font-weight:950}
.mini ul{margin:0;padding-left:18px;color:rgba(255,255,255,.78)}
.mini li{margin:6px 0}
.row{display:flex;gap:10px;flex-wrap:wrap;margin-top:12px}
.contact{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-top:16px}
.contact__card{flex:1;min-width:260px;background:var(--panel);border:1px solid var(--stroke);border-radius:22px;padding:14px}
.contact__k{font-size:12px;color:var(--muted);font-weight:850;margin-top:10px}
.contact__k:first-child{margin-top:0}
.contact__v{margin-top:6px;font-weight:900}
.foot{margin-top:56px;display:flex;justify-content:center;gap:10px;flex-wrap:wrap;color:rgba(255,255,255,.68);font-size:13px}
.foot a{color:rgba(255,255,255,.78)}
.foot a:hover{color:rgba(255,255,255,.92)}
.dot{opacity:.5}
.toast{position:fixed;left:50%;bottom:18px;transform:translateX(-50%);padding:10px 12px;border-radius:14px;border:1px solid rgba(255,255,255,.12);background:rgba(0,0,0,.55);backdrop-filter:blur(10px);font-weight:800;font-size:12px;opacity:0;pointer-events:none;transition:opacity .18s ease,transform .18s ease}
.toast--show{opacity:1;transform:translateX(-50%) translateY(-2px)}