:root{color-scheme:dark;--bg:#101814;--panel:#17241d;--line:#36473b;--text:#f4f6ef;--muted:#becbc0;--green:#c5f275}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--text);font:16px/1.6 Inter,system-ui,sans-serif}
a{color:inherit;text-underline-offset:.24em}
a:hover{color:var(--green)}
:focus-visible{outline:3px solid var(--green);outline-offset:5px}
.wrap{width:min(1180px,calc(100% - 48px));margin-inline:auto}
.top,.footer,.section-head{display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap}
.top{padding:24px 0;border-bottom:1px solid var(--line)}
.top nav,.footer div,.actions{display:flex;flex-wrap:wrap;gap:12px 22px}
.top nav a,.footer a,.section-head a,.actions a,.brand,.grid h3 a,.grid h2 a{text-decoration:none}
.brand{font-size:1.45rem;font-weight:750;letter-spacing:-.055em}
.brand span,.eyebrow,em,.quiet,.section-head>a{color:var(--green)}
.brand i{display:inline-block;width:.6em;height:.6em;background:var(--green);margin-right:.45em;transform:rotate(45deg)}
.hero{display:grid;grid-template-columns:1fr 1.05fr;align-items:center;gap:clamp(24px,5vw,70px);padding:clamp(50px,8vw,112px) 0}
.eyebrow{font-size:.76rem;letter-spacing:.12em;text-transform:uppercase;font-weight:700}
h1,h2,h3{line-height:1.07;margin:0 0 .45em;letter-spacing:-.045em}
h1{font-size:clamp(2.9rem,6.8vw,6.2rem)}
h2{font-size:clamp(1.4rem,3vw,2.55rem)}
h3{font-size:1.45rem}
em{font-style:normal}
p{color:var(--muted)}
.intro{font-size:clamp(1.05rem,2vw,1.26rem);max-width:58ch}
.actions{align-items:center;margin-top:25px}
.button,.secondary{display:inline-block;border:1px solid var(--line);border-radius:6px;padding:10px 15px;font-weight:650}
.button{background:var(--green);border-color:var(--green);color:#172114}
.button:hover{color:#172114;background:#d9ff9e}
figure{margin:0}
.hero-image,.grid article,.contact{border:1px solid var(--line);background:var(--panel);border-radius:12px;overflow:hidden}
img{display:block;max-width:100%;height:auto}
.hero-image img{width:100%;aspect-ratio:4/3;object-fit:cover}
figcaption{display:flex;justify-content:space-between;gap:12px;padding:13px 16px;font-size:.85rem}
figcaption span,.quiet{font-size:.88rem}
figcaption span{color:var(--muted)}
.block{margin-bottom:58px}
.section-head{margin-bottom:12px}
.grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:15px}
.grid.two{grid-template-columns:repeat(2,minmax(0,1fr))}
.grid article,.contact{padding:clamp(18px,3vw,28px)}
.grid article p:last-child{margin-bottom:0}
.subhero{padding:60px 0 32px}
.subhero h1{max-width:17ch;margin-top:12px}
.list,.two,.project{margin-bottom:50px}
.service-visual{margin:0 0 30px}
.demo-frame{display:block;width:100%;height:700px;border:1px solid var(--line);border-radius:12px;background:var(--panel)}
.demo-frame.tracking{height:630px}
.demo-frame.deployment{height:480px}
@media(max-width:600px){.demo-frame{height:540px}.demo-frame.tracking{height:455px}.demo-frame.deployment{height:580px}}
.project{max-width:850px}
.project img{border-radius:12px}
.footer{border-top:1px solid var(--line);padding:24px 0 35px;margin-top:45px}
.skip{position:absolute;top:-100px;background:var(--bg);padding:10px}
.skip:focus{top:4px}
@media(max-width:770px){.hero,.grid,.grid.two{grid-template-columns:1fr}.hero-image img{aspect-ratio:16/9}.wrap{width:calc(100% - 32px)}}
