:root {
  --bg:#0b0c10; --fg:#e5e7eb; --muted:#9ca3af; --card:#111317; --accent:#a7f3d0; --border:#1f2937; --accent-2:#60a5fa;
}
*{box-sizing:border-box} html,body{margin:0;padding:0;background:var(--bg);color:var(--fg);font:16px/1.6 Inter,ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif}
a{color:var(--fg);text-decoration:none} img{max-width:100%;display:block}
.container{max-width:1100px;margin:0 auto;padding:2rem}

.nav{display:flex;align-items:center;justify-content:space-between;padding:1rem 2rem;border-bottom:1px solid var(--border);position:sticky;top:0;background:rgba(11,12,16,.7);backdrop-filter:blur(8px);z-index:20}
.nav nav a{margin:0 .8rem;color:var(--muted)} .nav nav a.active{color:var(--fg)}
.brand{display:flex;align-items:center;gap:.65rem}.brand-mark{width:36px;height:36px;display:grid;place-items:center;border:1px solid var(--border);border-radius:.8rem;background:linear-gradient(145deg,#0f1117,#0b0c10)} .brand-text{font-weight:700;letter-spacing:.03em}
.cta{border:1px solid var(--border);padding:.55rem .9rem;border-radius:.75rem}

.hero{padding:6rem 2rem 3rem;text-align:center}
.hero h1{font-size:clamp(2rem,3vw + 1rem,3rem);margin-bottom:.5rem;line-height:1.2}
.hero p.lead{color:var(--muted);max-width:860px;margin:0 auto}
.hero-cta{margin-top:1.2rem;display:flex;gap:.8rem;justify-content:center;flex-wrap:wrap}
.button{display:inline-block;padding:.85rem 1.1rem;border-radius:.9rem;border:1px solid var(--border)}
.button.primary{background:var(--accent);color:#0a0a0a;font-weight:700}
.button.ghost{background:transparent}

.badges{margin-top:1.4rem;display:flex;gap:.6rem;justify-content:center;flex-wrap:wrap}
.badge{border:1px dashed var(--border);color:var(--muted);padding:.35rem .6rem;border-radius:.6rem;font-size:.9rem}

.section{padding:3rem 2rem}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:1rem}
.card{border:1px solid var(--border);background:var(--card);padding:1.2rem;border-radius:1rem}
.card h3{margin:.2rem 0 0.4rem}
.stack{color:var(--muted);font-size:.95rem}
.tag{display:inline-block;border:1px solid var(--border);border-radius:.6rem;padding:.2rem .5rem;margin-right:.35rem;color:var(--muted);font-size:.8rem}

.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:1rem;margin:2rem auto}
.kpi{border:1px solid var(--border);background:var(--card);border-radius:1rem;padding:1rem;text-align:center}
.kpi .num{font-size:1.6rem;font-weight:800}

.contact form{display:grid;gap:.7rem;max-width:640px;margin:1rem auto}
input,textarea{width:100%;padding:.9rem 1rem;border-radius:.7rem;border:1px solid var(--border);background:#0d0f14;color:var(--fg)}
button{padding:.9rem 1rem;border-radius:.8rem;border:1px solid var(--border);background:var(--accent);color:#0a0a0a;font-weight:600;cursor:pointer}
button.secondary{background:var(--accent-2);color:#0a0a0a}
.footer{border-top:1px solid var(--border);padding:2rem;text-align:center;color:var(--muted)}
.small{color:var(--muted)}
.cards-2col{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:1rem}

@media (max-width:640px){.nav nav{display:none}.cta{display:none}.container{padding:1.25rem}}