:root{
  --accent:#5ecbff;
  --bg:#00303e;
  --card:#0f1116;
}
*{box-sizing:border-box}
body{margin:0;font-family:Inter,Arial,Helvetica,sans-serif;background:var(--bg);color:#e6f7ff;line-height:1.6}
.wrap{max-width:1200px;margin:0 auto;padding:0 24px}
header{position:fixed;top:0;left:0;width:100%;background:rgba(5,5,10,0.6);backdrop-filter:blur(6px);z-index:999;padding:14px 0}
header .logo{color:var(--accent);font-weight:700;display:inline-block;margin-right:24px}
header nav{display:inline-block}
header nav a{color:#cbdfe8;text-decoration:none;margin:0 12px;padding:6px 8px;border-radius:6px;transition:color 0.2s,background 0.2s}
header nav a.active, header nav a:hover{color:#002b36;background:var(--accent);}
.hero{height:100vh;display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden}
.hero .hero-bg{position:absolute;inset:0;background-size:cover;background-position:center;filter:brightness(0.28);z-index:0}
.hero .hero-inner{position:relative;z-index:2;text-align:center;padding:40px}
.hero h1{font-size:42px;color:var(--accent);margin:0 0 12px;letter-spacing:0.5px}
.hero p{color:#dbeefc;margin:0 0 18px}
.btn{display:inline-block;background:transparent;color:var(--accent);border:1px solid var(--accent);padding:10px 20px;border-radius:30px;text-decoration:none;font-weight:600}
.section{padding:100px 0;background:transparent}
.section h2{color:var(--accent);margin-bottom:16px}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:20px}
.card{background:linear-gradient(180deg, rgba(255,255,255,0.02), rgba(255,255,255,0.01));padding:18px;border-radius:12px;box-shadow:0 6px 18px rgba(0,0,0,0.6)}
.card img{width:100%;border-radius:10px;margin-bottom:10px;display:block}
.partners img{width:160px;margin:10px;opacity:0.8}
footer{padding:28px 0;background:#020213;color:#9fb2bf;text-align:center}

/* Fade in */
.fade {opacity:0;transform:translateY(18px);transition:all 0.7s ease}
.fade.visible{opacity:1;transform:translateY(0)}

/* Responsive */
@media(max-width:800px){header nav{display:none}.hero h1{font-size:28px} .wrap{padding:0 14px}}