:root{--bg:#0b1117;--panel:#111b24;--panel2:#17232d;--text:#edf3f4;--muted:#9aadb4;--accent:#63e6be;--line:#2b3b45;--mono:"SFMono-Regular",Consolas,"Liberation Mono",monospace}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:radial-gradient(circle at 80% -10%,#183333 0,transparent 38%),var(--bg);color:var(--text);font:16px/1.6 system-ui,-apple-system,sans-serif}a{color:inherit}.skip-link{position:absolute;left:-999px}.skip-link:focus{left:1rem;top:1rem;z-index:5;background:var(--accent);color:#06110f;padding:.5rem 1rem}.site-header,main,footer{max-width:1100px;margin:auto}.site-header{height:82px;display:flex;align-items:center;justify-content:space-between;padding:0 24px}.brand{display:flex;align-items:center;gap:10px;font-weight:700;letter-spacing:.03em;text-decoration:none}.brand img{width:30px;height:30px}.site-header nav{display:flex;gap:26px;color:var(--muted);font-size:.94rem}.site-header nav a,.text-link,footer a{ text-decoration:none}.site-header nav a:hover,.text-link:hover,footer a:hover{color:var(--accent)}section{padding:90px 24px}.hero{max-width:850px;padding-top:92px}.eyebrow{color:var(--accent);font:700 .76rem/1.3 var(--mono);letter-spacing:.11em;text-transform:uppercase}.hero h1{font-size:clamp(2.8rem,7vw,5.8rem);line-height:1.04;letter-spacing:-.055em;margin:18px 0 24px}.hero h1 em{font-style:normal;color:var(--accent)}.lead{font-size:clamp(1.25rem,2.5vw,1.65rem);line-height:1.35;max-width:700px}.intro{color:var(--muted);max-width:670px}.actions{display:flex;gap:12px;margin-top:30px;flex-wrap:wrap}.button{border:1px solid var(--line);border-radius:6px;padding:10px 16px;text-decoration:none;font-weight:700}.primary{background:var(--accent);border-color:var(--accent);color:#06110f}.secondary{color:var(--text)}.button:focus-visible,.copy:focus-visible,.play:focus-visible,summary:focus-visible,a:focus-visible{outline:3px solid #fff;outline-offset:3px}.demo{margin:0 24px;background:#0a0f13;border:1px solid var(--line);border-radius:10px;overflow:hidden;box-shadow:0 25px 80px #0008}.window-bar{height:38px;display:flex;align-items:center;gap:7px;padding:0 15px;background:var(--panel2);color:var(--muted);font:12px var(--mono)}.window-bar span{width:9px;height:9px;border-radius:50%;background:#ef8354}.window-bar span:nth-child(2){background:#f2c14e}.window-bar span:nth-child(3){background:var(--accent)}.window-bar b{margin:auto;font-weight:400}.demo-stage{position:relative}.demo-stage img{display:block;width:100%;height:auto}.play{position:absolute;inset:50% auto auto 50%;transform:translate(-50%,-50%);background:var(--accent);border:0;border-radius:99px;padding:11px 20px;color:#06110f;font-weight:700;cursor:pointer}.demo-stage.playing .play{background:#0b1117;color:var(--text);border:1px solid var(--line)}figcaption{padding:14px 18px;color:var(--muted);font-size:.88rem}figcaption a{color:var(--accent)}.section-heading h2{font-size:clamp(2rem,4vw,3.2rem);line-height:1.1;letter-spacing:-.035em;margin:12px 0}.section-heading p{color:var(--muted)}.benefits{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin:35px 0}.benefits article{background:var(--panel);border:1px solid var(--line);padding:24px;border-radius:8px}.benefits kbd{display:inline-grid;place-items:center;min-width:43px;height:34px;color:var(--accent);font:700 .9rem var(--mono);border:1px solid #3a655d;border-radius:4px}.benefits h3{margin:22px 0 8px}.benefits p{margin:0;color:var(--muted)}code,pre{font-family:var(--mono)}code{color:var(--accent);font-size:.92em}.install{background:var(--panel);border:1px solid var(--line);border-radius:10px;margin:0 24px;padding:55px clamp(24px,6vw,70px)}.command{display:flex;align-items:stretch;background:#080d11;border:1px solid var(--line);border-radius:6px;overflow:hidden;margin:24px 0 12px}.command pre{margin:0;padding:16px 18px;white-space:pre-wrap;flex:1;overflow:auto;color:var(--text)}.copy{background:transparent;border:0;border-left:1px solid var(--line);padding:0 18px;color:var(--accent);font-weight:700;cursor:pointer}.after-command,.alt-install{color:var(--muted)}.first-task{display:flex;gap:12px;align-items:center;flex-wrap:wrap;margin-top:35px;padding:18px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);color:var(--muted)}.first-task strong{color:var(--text);width:100%}.first-task i{color:var(--accent);font-style:normal}.faq details{border-top:1px solid var(--line);padding:19px 0}.faq details:last-child{border-bottom:1px solid var(--line)}summary{cursor:pointer;font-weight:700}.faq details p{color:var(--muted);max-width:750px;margin:10px 0 0}footer{border-top:1px solid var(--line);padding:35px 24px 50px;display:flex;gap:25px;align-items:center;flex-wrap:wrap;color:var(--muted);font-size:.9rem}footer>div:nth-child(2){display:flex;gap:18px;flex-wrap:wrap}footer p{margin-left:auto}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}@media(max-width:700px){.site-header{height:70px}.site-header nav{gap:12px;font-size:.82rem}.hero{padding-top:65px}.hero h1{font-size:clamp(2.65rem,13vw,4rem)}section{padding:70px 24px}.benefits{grid-template-columns:1fr}.demo{margin:0 12px}.install{margin:0 12px;padding:35px 20px}.first-task{align-items:flex-start}.first-task i{display:none}footer p{margin-left:0;width:100%}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
:root { --bg:#080f20; --panel:#101b30; --panel2:#162036; --text:#f4f3ed; --muted:#a5b0c5; --accent:#f3a945; --line:#29344a; }
body { background:var(--bg); }
.site-header, main, footer { max-width:1152px; }
.site-header { height:90px; margin-inline:auto; padding-inline:32px; border-bottom:1px solid var(--line); }
.brand { font-size:24px; letter-spacing:-.06em; gap:12px; }
.brand img { width:42px; height:42px; }
.site-header nav { font-size:14px; font-weight:550; }
.site-header nav a:last-child { border:1px solid var(--line); padding:7px 16px; border-radius:6px; color:var(--text); }
.hero { max-width:none; text-align:center; padding:68px 32px 48px; }
.hero .eyebrow { display:inline-block; padding:7px 13px; border:1px solid #f3a94535; border-radius:99px; background:#f3a94508; font-size:12px; }
.hero h1 { max-width:960px; margin:25px auto 24px; font-size:clamp(40px,5.8vw,76px); font-weight:750; line-height:1.09; letter-spacing:-.055em; text-wrap:balance; }
.hero h1 em { display:block; }
.lead { max-width:660px; margin:0 auto 14px; font-size:19px; line-height:1.6; text-wrap:balance; }
.intro { max-width:650px; margin:0 auto; font-size:15px; }
.actions { justify-content:center; margin-top:28px; }
.button { display:inline-flex; align-items:center; gap:18px; min-height:48px; padding:10px 22px; font-size:14px; font-weight:650; transition:background .15s,transform .15s; }
.button:hover { transform:translateY(-2px); }
.primary { color:#111827; box-shadow:0 3px 0 #ad6e22; }
.primary:hover { background:#ffc46f; }
.secondary { background:var(--panel); }
.secondary:hover { background:#1b2941; }
.demo { margin-inline:32px; border-color:#3a455b; box-shadow:0 28px 80px #0005,0 0 90px #f3a94508; }
.window-bar { height:42px; border-bottom:1px solid var(--line); position:relative; }
.window-bar b { position:absolute; left:50%; transform:translateX(-50%); }
.window-bar span:first-child { background:#e58c79; }
.window-bar span:nth-child(2) { background:var(--accent); }
.window-bar span:nth-child(3) { background:#8bad94; }
.demo-stage img { aspect-ratio:12/7; object-fit:contain; }
.play { padding:13px 24px; font-size:14px; border:1px solid #ffffff30; box-shadow:0 8px 35px #0006; }
.play::before { content:'▶'; margin-right:10px; font-size:11px; }
.demo-stage.playing .play { top:auto; bottom:14px; left:auto; right:14px; transform:none; background:var(--panel); padding:9px 15px; }
.demo-stage.playing .play::before { content:'■'; }
figcaption { display:flex; justify-content:space-between; gap:16px; padding:16px 20px; background:#10192a; font-size:13px; }
figcaption a { white-space:nowrap; }
.section-heading h2 { font-size:clamp(30px,3.6vw,44px); line-height:1.2; text-wrap:balance; }
.benefits { gap:0; margin:36px 0 24px; }
.benefits article { background:none; border:0; border-radius:0; padding:8px 28px 8px 0; }
.benefits article + article { padding-left:28px; border-left:1px solid var(--line); }
.benefits kbd { min-width:48px; height:40px; border:1px solid #45516a; border-bottom-width:4px; border-radius:7px; background:#18243a; font-size:16px; }
.benefits h3 { font-size:19px; letter-spacing:-.02em; }
.benefits p { font-size:15px; }
code { color:#f8c784; }
.text-link { color:var(--accent); font-size:14px; }
.install { margin-inline:32px; padding:52px 64px; border-color:#364056; border-radius:12px; background:linear-gradient(130deg,#17233a,#10192c); }
.command { align-items:center; background:#080f20; border-color:#3a455b; border-radius:7px; min-width:0; }
.command pre { min-width:0; padding:22px; white-space:pre; font-size:15px; line-height:1.8; }
.command code { color:var(--text); font-size:inherit; }
.copy { align-self:flex-start; flex-shrink:0; margin:14px 14px 14px 0; padding:7px 12px; border:1px solid var(--line); background:var(--panel); color:var(--muted); border-radius:5px; font:12px var(--mono); min-height:40px; }
.copy:hover { color:var(--accent); border-color:var(--accent); }
.after-command,.alt-install { font-size:14px; }
.first-task { border-bottom:0; padding:24px 0 0; font-size:13px; }
.first-task strong { font-size:14px; }
.faq { display:grid; grid-template-columns:.85fr 1.4fr; column-gap:60px; align-items:start; }
.faq .section-heading { grid-column:1; grid-row:1/5; }
.faq details { grid-column:2; border-top:0; border-bottom:1px solid var(--line); padding:20px 0; }
.faq details:first-of-type { border-top:1px solid var(--line); }
summary { font-size:15px; font-weight:550; }
.faq details p { font-size:14px; }
footer { padding:32px; }
footer .brand { font-size:20px; }
footer .brand img { width:32px; height:32px; }
footer > div:nth-child(2) { margin-left:auto; }
footer a,footer p { font-size:13px; }
footer p { width:100%; margin:0; }
[hidden] { display:none!important; }
@media(max-width:700px) {
  .site-header { height:78px; padding-inline:20px; }
  .site-header nav { gap:12px; font-size:13px; }
  .site-header nav a:last-child { padding:6px 10px; }
  .brand { font-size:22px; gap:8px; }
  .brand img { width:34px; height:34px; }
  .hero { padding:48px 22px 36px; }
  .hero .eyebrow { font-size:10px; letter-spacing:.07em; }
  .hero h1 { font-size:clamp(36px,8vw,54px); }
  .lead { font-size:17px; }
  .intro { font-size:14px; }
  .demo { margin-inline:16px; }
  figcaption { display:block; font-size:12px; padding:14px; }
  figcaption a { display:block; margin-top:5px; }
  .benefits article,.benefits article + article { border-left:0; border-bottom:1px solid var(--line); padding:24px 0; }
  .benefits article:last-child { border-bottom:0; }
  .install { margin-inline:16px; padding:30px 20px; }
  .command { position:relative; padding-top:36px; }
  .command pre { padding:14px; font-size:13px; }
  .copy { position:absolute; top:7px; right:7px; margin:0; padding:3px 10px; min-height:32px; }
  .faq { display:block; }
  .faq .section-heading { margin-bottom:30px; }
  footer { padding:28px 24px; }
  footer > div:nth-child(2) { margin-left:0; }
}
@media(prefers-reduced-motion:reduce) { .button { transition:none; } .button:hover { transform:none; } }