:root{
  --bg:#061026;
  --card: rgba(255,255,255,0.03);
  --accent1:#00d4ff;
  --accent2:#6b7aff;
  --muted: rgba(230,245,255,0.85);
  --radius:12px;
}
*{box-sizing:border-box}
html,body{height:100%;margin:0;font-family:Inter, "Segoe UI", Roboto, Arial;color:#eaf8ff;background:var(--bg);overflow-x:hidden}
a{color:inherit;text-decoration:none}
.container{max-width:1200px;margin:0 auto;padding:28px;position:relative;z-index:4}
.header{display:flex;align-items:center;justify-content:space-between;padding-top:12px;position:relative;z-index:6}
.logo{display:flex;align-items:center;gap:12px}
.logo img{height:54px;border-radius:8px;box-shadow:0 10px 30px rgba(11,95,165,0.08)}
.nav{display:flex;gap:22px;align-items:center;font-size:15px}
.nav a{color:rgba(255,255,255,0.9);padding:8px 12px;border-radius:10px;transition:all .18s}
.nav a:hover{transform:translateY(-3px);color:var(--accent1)}
.lang{display:flex;gap:8px;align-items:center}
.lang button{background:transparent;border:1px solid rgba(255,255,255,0.06);padding:6px 10px;border-radius:8px;color:var(--muted);cursor:pointer}

/* hero */
.hero{height:74vh;min-height:480px;display:flex;align-items:center;justify-content:center;position:relative;z-index:6;padding:20px}
.hero-card{background:linear-gradient(180deg, rgba(255,255,255,0.02), rgba(255,255,255,0.006));padding:34px;border-radius:var(--radius);backdrop-filter: blur(8px);max-width:920px;box-shadow:0 20px 60px rgba(3,11,30,0.7);border:1px solid rgba(255,255,255,0.02)}
.h-title{font-size:48px;margin:0;line-height:1.04;font-weight:700;letter-spacing:1px}
.h-sub{margin-top:12px;color:var(--muted);font-size:17px}

/* CTA */
.cta{margin-top:22px;display:flex;gap:12px;justify-content:center}
.btn-primary{background:linear-gradient(90deg,var(--accent1),var(--accent2));border:none;padding:12px 22px;border-radius:12px;color:#001;font-weight:700;cursor:pointer;box-shadow:0 12px 50px rgba(91,122,255,0.12)}
.btn-ghost{background:transparent;border:1px solid rgba(255,255,255,0.06);padding:10px 18px;border-radius:12px;color:var(--muted);cursor:pointer}

/* sections */
.section{padding:56px 0;position:relative;z-index:6}
.card{background:var(--card);padding:18px;border-radius:12px;border:1px solid rgba(255,255,255,0.03);backdrop-filter: blur(6px)}

/* footer */
.footer{padding:26px 0;color:var(--muted);font-size:14px;border-top:1px solid rgba(255,255,255,0.03);display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:12px}

/* responsive */
@media(max-width:900px){
  .h-title{font-size:30px}
  .nav{display:none}
  .hero{height:64vh}
  .container{padding:16px}
}