@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600&family=IBM+Plex+Mono:wght@400;500&family=Space+Grotesk:wght@400;500;600&display=swap');
:root { --bg:#151717; --text:#f1f0e8; --muted:#a9afa7; --line:#383d38; --lime:#d0f568; color-scheme:dark; font-family:'DM Sans',sans-serif; color:var(--text); background:var(--bg); -webkit-font-smoothing:antialiased; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; min-width:320px; }
a { color:inherit; }
::selection { background:var(--lime); color:var(--bg); }
:focus-visible { outline:2px solid var(--lime); outline-offset:4px; }
.skip-link { position:fixed; top:8px; left:8px; padding:10px 14px; background:var(--lime); color:var(--bg); transform:translateY(-160%); z-index:5; }
.skip-link:focus { transform:none; }
.page-shell { max-width:1500px; margin:auto; padding:0 clamp(22px,4vw,60px); }
.site-header { min-height:86px; border-bottom:1px solid var(--line); display:flex; align-items:center; justify-content:space-between; gap:20px; }
.wordmark { text-decoration:none; white-space:nowrap; font:600 15px 'Space Grotesk',sans-serif; letter-spacing:-.3px; }
.wordmark span { color:var(--lime); font:20px 'IBM Plex Mono',monospace; letter-spacing:-3px; margin-right:12px; }
.header-link { text-decoration:none; color:#c9cfc5; font:11px 'IBM Plex Mono',monospace; }
.header-link span,.product-foot a span,.site-footer a span { color:var(--lime); margin-left:6px; }
.header-link:hover,.product-foot a:hover,.site-footer a:hover { color:var(--lime); }
.hero { padding:clamp(80px,11vw,155px) 0 clamp(80px,10vw,135px); text-align:center; }
.eyebrow { margin:0; color:var(--lime); font:10px/1.6 'IBM Plex Mono',monospace; letter-spacing:1.2px; }
.status-dot { display:inline-block; width:7px; height:7px; margin-right:8px; border-radius:50%; background:var(--lime); box-shadow:0 0 14px #d0f56890; }
.eyebrow-divider { color:#7c8379; margin-inline:8px; }
h1,h2 { font-family:'Space Grotesk',sans-serif; font-weight:500; letter-spacing:-.065em; }
h1 { margin:22px auto 28px; max-width:1000px; font-size:clamp(62px,8.3vw,124px); line-height:.94; }
h1 em { color:var(--lime); font-style:normal; }
.hero-copy { max-width:625px; margin:0 auto; color:#b9c0b6; font-size:clamp(15px,1.55vw,18px); line-height:1.7; }
.access-form { width:min(100%,590px); margin:48px auto 0; text-align:left; }
.access-form label { display:block; margin-bottom:12px; font:11px 'IBM Plex Mono',monospace; color:#dce3d7; }
.form-row { display:flex; padding:6px; border:1px solid #77846a; background:#222823; transition:border-color .18s, box-shadow .18s; }
.form-row:focus-within { border-color:var(--lime); box-shadow:0 0 0 3px #d0f56822; }
.form-row input { min-width:0; flex:1; border:0; outline:0; padding:0 16px; background:transparent; color:var(--text); font:15px 'DM Sans',sans-serif; }
.form-row input::placeholder { color:#8a9388; }
.form-row button { min-height:55px; border:0; padding:0 22px; display:flex; align-items:center; gap:22px; white-space:nowrap; background:var(--lime); color:#202b17; font:600 13px 'Space Grotesk',sans-serif; cursor:pointer; transition:background .18s,transform .18s; }
.form-row button:hover { background:#e1ffa3; }
.form-row button:active { transform:scale(.98); }
.form-row button:disabled { opacity:.65; cursor:wait; }
.form-row button span:last-child { font-size:21px; font-weight:400; line-height:1; }
.form-status { min-height:19px; margin:11px 0 0; color:var(--muted); font:11px/1.5 'DM Sans',sans-serif; }
.form-status[data-state="error"] { color:#ffb0a5; }
.form-status[data-state="success"] { color:var(--lime); }
.honeypot { position:absolute; left:-10000px; width:1px; height:1px; overflow:hidden; }
.product { border-top:1px solid var(--line); padding-top:42px; }
.product-heading { display:flex; align-items:start; justify-content:space-between; gap:32px; margin-bottom:30px; }
.product-heading h2 { margin:0; max-width:690px; font-size:clamp(24px,2.9vw,40px); line-height:1.2; letter-spacing:-.04em; }
.product-heading h2 span { color:#929b91; }
.product-frame { padding:8px; border:1px solid #414b40; border-radius:13px; background:#252a25; box-shadow:0 36px 75px #080b0877; }
.frame-top { height:32px; padding:0 13px 7px; display:flex; align-items:center; justify-content:space-between; color:#899086; font:9px 'IBM Plex Mono',monospace; letter-spacing:.8px; }
.frame-lights { display:flex; gap:5px; }
.frame-lights i { width:6px; height:6px; border:1px solid #6b7468; border-radius:50%; }
.product-frame img { display:block; width:100%; height:auto; border:1px solid #313830; border-radius:7px; }
.screenshot-link { display:block; border-radius:7px; }
.screenshot-link:hover img { border-color:#94ab77; }
.product-foot { display:flex; justify-content:space-between; align-items:center; gap:25px; padding:28px 0 86px; }
.product-foot p { margin:0; color:var(--muted); font-size:13px; }
.product-foot p span { color:#858f83; }
.product-foot a { font:11px 'IBM Plex Mono',monospace; white-space:nowrap; text-decoration:none; }
.site-footer { min-height:90px; border-top:1px solid var(--line); display:flex; align-items:center; justify-content:space-between; gap:20px; color:#8b9389; font:10px 'IBM Plex Mono',monospace; letter-spacing:.5px; }
.site-footer a { text-decoration:none; color:var(--text); }
@media(max-width:800px) { .product-heading { display:block; } .product-heading h2 { margin-top:18px; } }
@media(max-width:580px) { .site-header { min-height:72px; } .header-link { font-size:9px; } .hero { padding:84px 0 86px; } h1 { font-size:clamp(56px,12.7vw,74px); } .hero-copy { font-size:15px; } .access-form { margin-top:36px; } .form-row { display:block; } .form-row input { width:100%; height:53px; } .form-row button { width:100%; justify-content:space-between; min-height:52px; } .product { padding-top:30px; } .product-heading { margin-bottom:22px; } .product-heading h2 { font-size:27px; } .frame-top { font-size:7px; padding-inline:6px; } .product-foot { display:block; padding-bottom:60px; } .product-foot a { display:inline-block; margin-top:18px; } .site-footer { font-size:8px; } }
@media(prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } *,*::before,*::after { transition-duration:.01ms!important; } }