:root{
--bg:#0b0d12; --card:#121626; --ink:#e9ecf1; --muted:#97a3b6; --brand:#6ee7b7; --ring:#26324a;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0;font-family:'Inter',system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;background:var(--bg);color:var(--ink);}
img{max-width:100%;display:block}
a{color:var(--ink);text-decoration:none}
.container{width:min(1100px,92%);margin-inline:auto}
.center{text-align:center}
.right{text-align:right}
.flex{display:flex;gap:1rem}
.between{justify-content:space-between}
.grid{display:grid;gap:1.25rem}
.grid.two{grid-template-columns:repeat(2,minmax(0,1fr))}
.grid.three{grid-template-columns:repeat(3,minmax(0,1fr))}


.site-header{position:sticky;top:0;z-index:50;background:rgba(11,13,18,.7);backdrop-filter:saturate(180%) blur(10px);border-bottom:1px solid var(--ring)}
.site-header .logo{font-weight:800;letter-spacing:.3px}
.nav a{opacity:.9;margin-left:1rem}
.nav .active{border-bottom:2px solid var(--brand)}


.hero{padding:72px 0;background:radial-gradient(1200px 600px at 20% -20%, rgba(110,231,183,.15), transparent)}
.hero-grid{grid-template-columns:1.1fr .9fr;align-items:center}
.lead{color:var(--muted);max-width:60ch}
.actions{display:flex;gap:.75rem;margin:1rem 0 1.2rem}
.keyword-strip{display:flex;flex-wrap:wrap;gap:.5rem;padding:0;margin:1rem 0 0;list-style:none}
.keyword-strip li{border:1px solid var(--ring);border-radius:999px;padding:.35rem .6rem;font-size:.85rem;color:var(--muted)}


.card{background:var(--card);border:1px solid var(--ring);border-radius:16px}
.shadow{box-shadow:0 20px 60px rgba(0,0,0,.25)}
.demo-card{padding:6px}
.features{padding:40px 0}
.features-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
.features .card{padding:18px}
.quote{padding:16px;font-style:italic}


.cta{padding:56px 0}
.cta .btn{font-size:1.05rem}


.site-footer{border-top:1px solid var(--ring);padding:20px 0;background:rgba(0,0,0,.2)}
.small{font-size:.9rem;color:var(--muted)}
.tiny{font-size:.8rem}
.muted{color:var(--muted)}


.btn{display:inline-block;background:var(--brand);color:#062816;padding:.65rem 1rem;border-radius:10px;font-weight:700;border:0}
.btn:hover{filter:brightness(1.05)}
.btn-outline{border:1px solid var(--ring);background:transparent}
.btn-ghost{background:transparent;border:1px dashed var(--ring)}


.breadcrumbs{margin:18px 0;color:var(--muted)}
.narrow{max-width:520px}
.form{padding:18px;display:grid;gap:.8rem}
input{width:100%;padding:.75rem;border-radius:10px;border:1px solid var(--ring);background:#0e1220;color:var(--ink)}


@media (max-width:900px){
.grid.three,.features-grid{grid-template-columns:1fr}
.grid.two{grid-template-columns:1fr}
.hero-grid{grid-template-columns:1fr}
}


/* Accessibility helpers */
.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}