:root{
  --bg:#0f172a; --panel:#0b1226; --text:#e2e8f0; --muted:#94a3b8;
  --c1:#22d3ee; --c2:#a78bfa; --radius:18px; --shadow:0 10px 30px rgba(0,0,0,.35);
}
*{box-sizing:border-box;margin:0;padding:0}
body{font-family:Inter,system-ui;background:linear-gradient(120deg,#0f172a,#0b1226);color:var(--text)}
a{color:var(--c1);text-decoration:none}
.container{width:100%;max-width:1100px;margin:auto;padding:0 20px}

/* Header */
header{position:sticky;top:0;z-index:50;background:rgba(10,14,30,.65);backdrop-filter:blur(12px);
 border-bottom:1px solid rgba(255,255,255,.08);}
.nav{display:flex;align-items:center;justify-content:space-between;padding:14px 0;}
.brand{display:flex;gap:10px;align-items:center;font-weight:700;color:var(--text)}
.brand img{width:32px;height:32px}

/* Desktop menu */
.menu{display:flex;gap:22px;list-style:none}
.menu a{padding:10px 14px;border-radius:10px;color:var(--text)}
.menu a:hover{background:rgba(255,255,255,.06)}

/* Burger */
.burger{display:none;font-size:30px;cursor:pointer;color:var(--text)}

/* Mobile menu overlay */
.mobile-nav{display:none;position:fixed;inset:0;background:rgba(0,0,0,.7);backdrop-filter:blur(6px);z-index:99;}
.mobile-panel{background:var(--panel);width:260px;height:100%;padding:24px;box-shadow:var(--shadow);}
.mobile-links{list-style:none;display:grid;gap:18px;margin-top:18px}
.mobile-links a{color:var(--text);font-size:18px}

/* Close btn */
.close-btn{font-size:28px;cursor:pointer;color:var(--text);margin-bottom:18px}

/* Hero */
.hero{padding:80px 0 60px}
.hero-grid{display:grid;grid-template-columns:1fr 1fr;gap:30px;align-items:center}
h1{font-size:clamp(26px,5vw,44px);margin-bottom:12px}
.sub{color:var(--muted);margin-bottom:14px}
.btn{display:inline-block;padding:12px 18px;border-radius:14px;border:1px solid rgba(255,255,255,.1);
 background:linear-gradient(135deg,#22d3ee44,#a78bfa44);box-shadow:var(--shadow);}

/* Sections */
.section{padding:70px 0}
.lead{color:var(--muted);margin-bottom:28px}
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:18px}
.card{background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08);
 padding:20px;border-radius:var(--radius);min-height:150px}

/* Form */
form{display:grid;gap:12px}
input,textarea{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.1);
 padding:12px;border-radius:12px;color:var(--text)}
textarea{min-height:120px}

/* Footer */
footer{text-align:center;padding:24px 0;color:var(--muted);border-top:1px solid rgba(255,255,255,.08)}

/* Mobile rules */
@media(max-width:880px){
  .hero-grid{grid-template-columns:1fr}
}
@media(max-width:720px){
  .menu{display:none}
  .burger{display:block}
  .btn{width:100%;text-align:center}
}