@import url('https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&family=Inter:wght@400;500;600;700;800&family=Noto+Sans+SC:wght@400;500;700;900&display=swap');

:root { --ink:#0b0d10; --paper:#f3f1ea; --acid:#dfff00; --blue:#5856ff; --line:rgba(11,13,16,.18); --mono:'DM Mono',monospace; --sans:'Inter','Noto Sans SC',sans-serif; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; color:var(--ink); background:var(--paper); font-family:var(--sans); overflow-x:hidden; }
a { color:inherit; text-decoration:none; }
img { display:block; max-width:100%; }
.shell { width:min(1180px, calc(100% - 48px)); margin-inline:auto; }
.noise { position:fixed; inset:0; pointer-events:none; z-index:99; opacity:.035; background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.65'/%3E%3C/svg%3E"); }
.nav { height:82px; display:flex; align-items:center; justify-content:space-between; border-bottom:1px solid var(--line); }
.brand { display:flex; align-items:center; gap:10px; font-size:20px; font-weight:800; letter-spacing:-.04em; }
.brand img { width:34px; height:34px; border-radius:8px; }
.brand span span { color:var(--blue); }
.nav nav { display:flex; gap:34px; font-size:14px; font-weight:600; }
.nav nav a:hover { color:var(--blue); }
.nav-cta { border:1px solid var(--ink); padding:11px 17px; font-family:var(--mono); font-size:12px; transition:.2s; }
.nav-cta:hover { background:var(--ink); color:white; }
.hero { min-height:690px; display:grid; grid-template-columns:1fr 1.06fr; gap:70px; align-items:center; padding-block:84px 100px; }
.eyebrow,.mono-label,.section-index { font:500 11px/1 var(--mono); letter-spacing:.16em; }
.eyebrow { display:flex; align-items:center; gap:10px; margin-bottom:24px; }
.status-dot { width:9px; height:9px; border-radius:50%; background:#25b45b; box-shadow:0 0 0 5px rgba(37,180,91,.12); }
h1,h2,h3,p { margin-top:0; }
h1 { font-size:clamp(54px,6.3vw,92px); line-height:.94; letter-spacing:-.075em; margin-bottom:28px; }
h1 em { font-style:normal; color:var(--blue); }
.hero-lead { max-width:610px; font-size:18px; line-height:1.8; color:#484a4d; }
.hero-actions { display:flex; gap:10px; margin:34px 0 26px; }
.button { display:inline-flex; align-items:center; justify-content:space-between; min-width:160px; gap:28px; padding:16px 18px; font-size:14px; font-weight:700; border:1px solid var(--ink); transition:.2s; }
.button.primary { background:var(--ink); color:white; }
.button.primary:hover { background:var(--blue); border-color:var(--blue); transform:translateY(-2px); }
.button.ghost:hover { background:white; transform:translateY(-2px); }
.compatibility { display:flex; flex-wrap:wrap; gap:8px 20px; font:400 10px/1.5 var(--mono); color:#666; }
.hero-visual { position:relative; }
.scope-card { border:1px solid var(--ink); background:#111419; box-shadow:18px 18px 0 var(--blue); transform:rotate(1deg); }
.scope-topbar { height:42px; padding:0 14px; display:flex; align-items:center; justify-content:space-between; border-bottom:1px solid #3b3f47; color:#aaa; font:400 9px/1 var(--mono); }
.scope-topbar b { color:#64e38e; font-weight:400; }
.window-dots { display:flex; gap:5px; }.window-dots i,.terminal-top i,.app-window-top i { width:7px;height:7px;border-radius:50%;background:#4a4e57; }
.scope-screen { position:relative; height:470px; overflow:hidden; background:linear-gradient(#171a1f,#0e1013); }
.scope-grid { position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.045) 1px,transparent 1px);background-size:38px 38px; }
.signal { position:absolute;inset:0;opacity:.75; }
.signal-a { background:linear-gradient(172deg,transparent 0 37%,var(--acid) 37.4% 38%,transparent 38.4% 46%,var(--acid) 46.4% 47%,transparent 47.4% 62%,var(--acid) 62.4% 63%,transparent 63.4%); clip-path:polygon(0 32%,13% 32%,13% 55%,29% 55%,29% 40%,47% 40%,47% 66%,66% 66%,66% 47%,82% 47%,82% 59%,100% 59%,100% 61%,80% 61%,80% 49%,68% 49%,68% 68%,45% 68%,45% 42%,31% 42%,31% 57%,11% 57%,11% 34%,0 34%); }
.signal-b { inset:80px 0 0; background:linear-gradient(90deg,transparent,var(--blue),transparent); height:2px; top:260px; box-shadow:60px 55px 0 #5856ff,200px -70px 0 #5856ff,350px 42px 0 #5856ff; }
.device-stack { position:absolute; top:25px; left:24px; display:grid; gap:8px; }
.device-stack div { width:230px; padding:12px 14px; display:grid; grid-template-columns:28px 1fr auto 7px;align-items:center;gap:8px;background:rgba(15,17,21,.83);border:1px solid #3b3f47;color:white;backdrop-filter:blur(8px); }
.device-stack b { font-size:11px; }.device-stack small { font:9px var(--mono);color:#8e949e;}.device-stack i { width:6px;height:6px;border-radius:50%;background:#4be37d; }
.agent-card { position:absolute;right:22px;bottom:25px;width:250px;background:var(--acid);padding:18px;border:1px solid var(--ink);display:grid;gap:9px; }
.agent-card small { font:9px var(--mono); }.agent-card code { font:600 14px var(--mono); }.agent-card strong { font-size:10px;font-weight:500; }
.floating-label { position:absolute; font:500 10px var(--mono); padding:9px 11px; background:white; border:1px solid var(--ink); }
.label-one { right:-24px;top:50px; }.label-two { left:-28px;bottom:56px; }
.signal-strip { background:var(--ink); color:white; overflow:hidden; transform:rotate(-1deg) scale(1.02); }
.ticker { width:max-content; display:flex; align-items:center; gap:30px; padding:18px 0; animation:ticker 28s linear infinite; font:500 11px var(--mono); letter-spacing:.13em; }
.ticker i { color:var(--acid);font-style:normal; }
@keyframes ticker { to { transform:translateX(-50%); } }
.section-pad { padding-block:130px; }
.problem { display:grid;grid-template-columns:140px 1.1fr .8fr;gap:50px;align-items:start; }
.section-index { padding-top:10px;color:#6f7073; }
.kicker { font:500 11px/1.5 var(--mono); color:var(--blue); letter-spacing:.08em; }
h2 { font-size:clamp(43px,5vw,72px);line-height:1.02;letter-spacing:-.065em; }
.section-body { font-size:18px;line-height:1.9;color:#4e5054;padding-top:40px; }
.features { padding-top:0; display:grid;grid-template-columns:1fr 1fr;gap:14px; }
.feature { min-height:490px;border:1px solid var(--ink);padding:36px;display:flex;flex-direction:column;position:relative;overflow:hidden; }
.feature-number { position:absolute;top:30px;right:32px;font:500 11px var(--mono); }
.feature h3 { font-size:42px;line-height:1.08;letter-spacing:-.055em;margin-top:52px; }
.feature p:not(.mono-label) { max-width:490px;font-size:15px;line-height:1.8;color:#4f5154; }
.feature-large { grid-column:span 2; min-height:440px;display:grid;grid-template-columns:1fr .85fr;align-items:center;background:#e7e4da; }
.feature-large h3 { font-size:58px; }
.mini-devices { display:grid;grid-template-columns:1fr 1fr;gap:10px;transform:rotate(-3deg); }
.mini-devices span { height:120px;border:1px solid var(--ink);background:var(--paper);display:flex;align-items:center;justify-content:center;font-size:40px;position:relative;box-shadow:7px 7px 0 var(--ink); }
.mini-devices i { position:absolute;right:12px;top:12px;width:8px;height:8px;border-radius:50%;background:#2dbb61; }
.feature-yellow { background:var(--acid); }
.event-log { margin-top:auto;border-top:1px solid var(--ink); }
.event-log div { display:grid;grid-template-columns:55px 1fr auto;gap:10px;padding:13px 0;border-bottom:1px solid rgba(0,0,0,.25);font:10px var(--mono); }
.event-log code { font:10px var(--mono); }
.feature-blue { background:var(--blue);color:white; }.feature-blue p:not(.mono-label){color:rgba(255,255,255,.72);}
.flash-meter { margin-top:auto;height:58px;border:1px solid white;position:relative;display:flex;align-items:center;padding:8px; }
.flash-meter span { width:87%;height:100%;background:var(--acid); }.flash-meter b{position:absolute;right:18px;color:white;font:500 12px var(--mono);}
.feature-image { padding:0;background:#15181e; }.feature-image img{width:100%;height:100%;object-fit:cover;filter:saturate(.85);}.image-caption{position:absolute;inset:auto 0 0;background:var(--ink);color:white;padding:18px 22px;display:flex;justify-content:space-between;gap:20px;align-items:center}.image-caption span{font:10px var(--mono)}.image-caption b{font-size:13px;}
.showcase { background:var(--ink);color:white; }
.showcase-head { display:grid;grid-template-columns:1fr 340px;gap:50px;align-items:end;margin-bottom:65px; }.showcase-head p{line-height:1.8;color:#a7a9ad;}.section-index.light{color:#7c7f86;margin-bottom:25px;}
.app-window { border:1px solid #3c4048;background:#181b21;padding:12px;box-shadow:0 0 80px rgba(88,86,255,.16); }.app-window-top{height:32px;display:flex;justify-content:space-between;align-items:center;padding:0 8px 10px;font:9px var(--mono);color:#858991}.app-window-top div{display:flex;gap:5px}.app-window img{width:100%;aspect-ratio:1.55/1;object-fit:cover;object-position:top;}
.workflow-steps { display:grid;grid-template-columns:repeat(3,1fr);margin-top:42px;border-top:1px solid #393c42; }.workflow-steps div{padding:28px 28px 0 0;display:grid;grid-template-columns:35px 1fr;}.workflow-steps span{font:11px var(--mono);color:var(--acid)}.workflow-steps b{font-size:14px}.workflow-steps p{grid-column:2;font-size:12px;line-height:1.7;color:#858991;margin-top:10px;}
.mcp { display:grid;grid-template-columns:1fr 1fr;gap:90px;align-items:center; }.mcp-copy h2{margin-top:28px}.mcp-copy>p{max-width:500px;line-height:1.8;color:#525458}.tool-groups{display:flex;flex-wrap:wrap;gap:7px;margin-top:26px}.tool-groups span{padding:8px 10px;border:1px solid var(--ink);font:10px var(--mono);}
.terminal { background:#12151a;color:#c8ccd3;border:1px solid var(--ink);box-shadow:12px 12px 0 var(--acid);position:relative; }.terminal-top{height:43px;border-bottom:1px solid #343841;display:flex;align-items:center;justify-content:space-between;padding:0 15px;font:9px var(--mono);color:#747982}.terminal-top div{display:flex;gap:5px}.terminal pre{margin:0;padding:36px 30px 80px;overflow:auto;font:13px/2 var(--mono)}.terminal code span{color:#a6a5ff}.terminal code em{color:var(--acid);font-style:normal}.copy-button{position:absolute;right:18px;bottom:18px;border:1px solid #656a73;background:transparent;color:white;padding:9px 13px;font:10px var(--mono);cursor:pointer}.copy-button:hover{background:white;color:var(--ink)}
.final-cta { background:var(--acid);border-block:1px solid var(--ink);padding:90px 0; }.final-cta .shell{display:grid;grid-template-columns:110px 1fr 1fr;gap:50px;align-items:center}.final-cta img{width:90px;border-radius:20px;box-shadow:8px 8px 0 var(--ink)}.final-cta>.shell>p{font:500 13px/1.7 var(--mono)}.final-cta p em{font-style:normal}.final-cta h2{font-size:48px;margin-bottom:8px}.final-cta div>p{font-size:14px}.button.dark{margin-top:16px;}
.footer { min-height:120px;display:flex;align-items:center;justify-content:space-between;font:10px var(--mono); }.footer .brand{font-family:var(--sans);font-size:16px}.footer .brand img{width:28px;height:28px}.footer>div{display:flex;gap:20px}.footer a:hover{color:var(--blue)}
.reveal { opacity:0; transform:translateY(20px); transition:opacity .7s ease,transform .7s ease; }.reveal.visible{opacity:1;transform:none}.delay-1{transition-delay:.12s}
@media (prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;animation:none!important}.reveal{opacity:1;transform:none;transition:none}}
@media (max-width:900px){.nav nav{display:none}.hero{grid-template-columns:1fr;padding-top:60px}.hero-visual{max-width:630px}.problem{grid-template-columns:1fr}.problem .section-body{padding-top:0}.feature-large{grid-template-columns:1fr}.showcase-head,.mcp{grid-template-columns:1fr}.final-cta .shell{grid-template-columns:90px 1fr}.final-cta .shell>div{grid-column:1/-1}.mcp{gap:50px}}
@media (max-width:640px){.shell{width:min(100% - 28px,1180px)}.nav{height:68px}.nav-cta{padding:9px 11px;font-size:9px}.hero{padding-block:58px 75px;gap:52px}.hero-lead{font-size:16px}.hero-actions{flex-direction:column}.button{width:100%}.scope-screen{height:380px}.device-stack div{width:205px}.agent-card{width:215px}.floating-label{display:none}.section-pad{padding-block:88px}.problem{gap:16px}.features{grid-template-columns:1fr}.feature,.feature-large{grid-column:auto;min-height:450px;padding:26px}.feature-large h3,.feature h3{font-size:38px}.mini-devices span{height:85px}.showcase-head{gap:10px;margin-bottom:38px}.app-window{padding:6px}.workflow-steps{grid-template-columns:1fr}.workflow-steps div{border-bottom:1px solid #393c42}.mcp{gap:42px}.terminal pre{font-size:10px;padding:25px 18px 70px}.final-cta .shell{grid-template-columns:70px 1fr;gap:25px}.final-cta img{width:65px}.final-cta>.shell>p{font-size:10px}.final-cta h2{font-size:38px}.footer{flex-wrap:wrap;gap:15px;padding-block:30px}.footer>p{order:3;width:100%}}
