:root { --bg:#0b1220; --panel:#121a2b; --panel-2:#0f1726; --text:#e6eaf3; --muted:#96a1b8; --accent-1:#5b7cff; --accent-2:#27c3e6; --border:#1e2940; }
*{box-sizing:border-box}
html,body{margin:0;padding:0;background:var(--bg);color:var(--text);font-family:Inter,system-ui,-apple-system,"Segoe UI",Roboto,Ubuntu,"Helvetica Neue",Arial}
.container{max-width:1120px;margin:0 auto;padding:0 clamp(12px,3.2vw,24px)}

/* Header & Nav */
.header{position:sticky;top:0;z-index:3000;background:rgba(11,18,32,.85);backdrop-filter:blur(10px);border-bottom:1px solid var(--border)}
.header-inner{display:flex;align-items:center;justify-content:space-between;height:64px}
.brand{display:flex;align-items:center;gap:10px;font-weight:600}
.logo{width:28px;height:28px;border-radius:9px;background:linear-gradient(135deg,var(--accent-1),var(--accent-2))}
.nav a{color:var(--text);text-decoration:none;padding:8px 12px;border-radius:10px;border:1px solid transparent}
.nav a:hover{background:var(--panel);border-color:var(--border)}
.nav .primary{background:linear-gradient(135deg,var(--accent-1),var(--accent-2));color:#fff;border:none}

/* Hamburger */
.hamburger{display:none;appearance:none;background:transparent;border:0;padding:10px;margin:-6px 6px -6px -6px;cursor:pointer;touch-action:manipulation;position:relative;z-index:3002}
.hamburger span{display:block;width:22px;height:2px;background:#cfd6ea;margin:5px 0;border-radius:2px;transition:transform .25s,opacity .25s}

/* Mobile nav */
@media (max-width:880px){
  .hide-on-mobile{display:none}
  .hamburger{display:block}
  .nav{
    position:absolute;left:0;right:0;top:64px;z-index:3001;
    display:flex;flex-direction:column;gap:8px;
    background:rgba(14,22,38,.98);border-bottom:1px solid var(--border);
    padding:12px;transform:translateY(-12px);opacity:0;pointer-events:none;
    transition:opacity .25s,transform .25s;
  }
  body.nav-open .nav{opacity:1;transform:translateY(0);pointer-events:auto}
  body.nav-open .hamburger span:nth-child(1){transform:translateY(7px) rotate(45deg)}
  body.nav-open .hamburger span:nth-child(2){opacity:0}
  body.nav-open .hamburger span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
}

/* Hero */
.hero{position:relative}
.hero .gradient{position:absolute;inset:0;background:linear-gradient(180deg,rgba(91,124,255,.15),transparent);pointer-events:none}
.hero-inner{padding:clamp(40px,6vw,72px) 0 24px;display:grid;grid-template-columns:1.1fr .9fr;gap:clamp(16px,4vw,28px)}
.hero h1{font-size:clamp(26px,4.2vw,40px);line-height:1.15;margin:0 0 12px}
.hero p{color:var(--muted);margin:0 0 16px}

/* Buttons/Badges */
.button{display:inline-flex;align-items:center;gap:8px;padding:10px 14px;border-radius:12px;border:1px solid var(--border);background:var(--panel);color:var(--text);text-decoration:none}
.button.primary{background:linear-gradient(135deg,var(--accent-1),var(--accent-2));border:none;color:#fff}
.button.outline{background:transparent}
.badge{display:inline-flex;gap:8px;align-items:center;border:1px solid var(--border);border-radius:999px;padding:4px 10px;font-size:12px;color:#c9d2ea}
.cta-row{display:flex;flex-wrap:wrap;gap:10px;margin-top:12px}

/* Grids & Cards */
.section{padding:clamp(40px,7vw,64px) 0}
.section h2{font-size:clamp(22px,3.2vw,28px);margin:0 0 8px}
.section p.subtitle{margin:6px 0 22px;color:var(--muted)}

.features-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:12px}
.feature-card{background:var(--panel);border:1px solid var(--border);border-radius:16px;padding:14px}

.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:clamp(12px,2.6vw,16px)}
.card{background:var(--panel);border:1px solid var(--border);border-radius:16px;overflow:hidden}
.card .card-body{padding:clamp(12px,2.6vw,16px)}
.card h3{margin:0 0 8px;font-size:clamp(16px,2.8vw,18px)}
.card p{margin:0;color:var(--muted)}

.grid-2{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:clamp(12px,2.6vw,16px)}
.small-grid-2{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:clamp(10px,2.2vw,12px)}
.partner-pill,.client-card{background:var(--panel-2);border:1px solid var(--border);border-radius:14px;padding:16px;text-align:center;color:#c9d2ea}

/* Contact */
.form{display:grid;gap:12px}
.form input,.form textarea{width:100%;padding:12px 14px;border-radius:12px;border:1px solid var(--border);background:#0c1526;color:var(--text)}
.form textarea{min-height:140px;resize:vertical}
.form .row{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px}
.notice{border:1px solid var(--border);background:var(--panel-2);padding:14px;border-radius:12px;color:#c9d2ea;font-size:14px}

/* Footer */
.footer{padding:32px 0;border-top:1px solid var(--border)}
.footer-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:clamp(12px,2.6vw,16px)}
.copy{padding-top:12px;color:#7f8baa}
.divider{height:1px;background:linear-gradient(90deg,transparent,var(--border),transparent);margin:24px 0}
.muted{color:var(--muted)}

/* Fallbacks */
@media (max-width:1024px){ .hero-inner{grid-template-columns:1fr} }
@media (max-width:420px){ .button{padding:12px 16px} }


/* DEBUG — remove after testing */
.hamburger { outline: 2px dashed #27c3e6; }
