@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap');

:root{--bg:#050607;--panel:rgba(18,21,25,.66);--line:rgba(255,255,255,.09);--muted:#9299a3;--text:#f5f7fa;--cyan:#63e6ff;--cyan2:#00bfe8}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:Inter,-apple-system,BlinkMacSystemFont,"SF Pro Display","Segoe UI",sans-serif;background:var(--bg);color:var(--text);overflow-x:hidden}
body:before{content:"";position:fixed;inset:0;z-index:-3;background:radial-gradient(circle at 15% 10%,rgba(0,210,255,.12),transparent 28%),radial-gradient(circle at 85% 75%,rgba(0,100,255,.10),transparent 30%),#050607}
body:after{content:"";position:fixed;inset:0;z-index:-2;opacity:.28;background-image:linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px);background-size:60px 60px;mask-image:linear-gradient(to bottom,#000,transparent 80%)}
a{text-decoration:none;color:inherit}.wrap{width:min(1180px,92%);margin:auto}
nav{position:fixed;z-index:99;top:18px;left:50%;transform:translateX(-50%);width:min(1180px,92%);padding:13px 16px;border:1px solid var(--line);border-radius:20px;background:rgba(10,12,15,.72);backdrop-filter:blur(24px);display:flex;align-items:center;justify-content:space-between;box-shadow:0 20px 60px #0008}
.logo{font-size:19px;font-weight:800;letter-spacing:-.7px}.logo i{font-style:normal;color:var(--cyan)}
.navlinks{display:flex;gap:5px;list-style:none}.navlinks a{display:block;padding:9px 12px;border-radius:12px;color:#aeb5be;font-size:13px;transition:.25s}.navlinks a:hover,.navlinks a.active{color:#fff;background:#ffffff0c}
.menu{display:none;background:none;border:0;color:#fff;font-size:24px}
.hero{min-height:100vh;display:grid;place-items:center;padding:150px 0 90px}.hero-inner{max-width:900px}.eyebrow{display:inline-flex;gap:8px;align-items:center;border:1px solid #63e6ff2b;background:#63e6ff0d;color:var(--cyan);padding:8px 13px;border-radius:999px;font-size:12px;font-weight:700;letter-spacing:.5px}.dot{width:7px;height:7px;border-radius:50%;background:var(--cyan);box-shadow:0 0 16px var(--cyan)}
h1{font-size:clamp(52px,9vw,108px);line-height:.94;letter-spacing:-6px;margin:28px 0}.gradient{background:linear-gradient(100deg,#fff 20%,#8eeeff 65%,#00bfe8);-webkit-background-clip:text;color:transparent}
.lead{font-size:18px;line-height:1.8;color:var(--muted);max-width:720px}.actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:34px}.btn{padding:14px 19px;border:1px solid var(--line);border-radius:14px;background:#ffffff09;font-size:13px;font-weight:700;transition:.25s}.btn:hover{transform:translateY(-3px);background:#ffffff12}.btn.primary{background:var(--cyan);color:#001116;border-color:var(--cyan)}.btn.primary:hover{box-shadow:0 10px 35px #00d9ff30}
section{padding:120px 0}.section-head{margin-bottom:40px}.kicker{font-size:12px;color:var(--cyan);font-weight:800;text-transform:uppercase;letter-spacing:1.5px}.section-head h2{font-size:clamp(36px,6vw,64px);letter-spacing:-3px;margin-top:8px}.section-head p{color:var(--muted);line-height:1.7;margin-top:12px;max-width:650px}
.glass{background:var(--panel);border:1px solid var(--line);border-radius:28px;backdrop-filter:blur(22px);box-shadow:0 20px 80px #0004}
.grid2{display:grid;grid-template-columns:1.2fr .8fr;gap:18px}.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.card{padding:30px}.card h3{font-size:25px;letter-spacing:-1px;margin:10px 0}.muted{color:var(--muted);line-height:1.8}
.stat strong{font-size:30px;color:var(--cyan);display:block}.stat span{font-size:13px;color:#7e8792}
.project{min-height:300px;padding:28px;display:flex;flex-direction:column;justify-content:space-between;transition:.35s}.project:hover{transform:translateY(-7px);border-color:#63e6ff30}.num{color:var(--cyan);font-size:11px;font-weight:800;letter-spacing:1px}.project h3{font-size:30px;margin:12px 0}.project p{color:var(--muted);line-height:1.7;font-size:14px}.link{color:var(--cyan);font-size:13px;font-weight:800;margin-top:20px}
.tags{display:flex;flex-wrap:wrap;gap:9px}.tag{padding:10px 13px;border:1px solid var(--line);background:#ffffff07;border-radius:12px;color:#d9dee4;font-size:13px}
.timeline{display:grid;gap:12px}.timeline .item{padding:22px;border-left:2px solid #63e6ff55;background:#ffffff04;border-radius:0 18px 18px 0}.item b{font-size:14px}.item p{color:var(--muted);margin-top:7px;line-height:1.7;font-size:13px}
.contactbox{text-align:center;padding:80px 25px}.contactbox h2{font-size:clamp(38px,7vw,76px);letter-spacing:-4px}.contactbox p{color:var(--muted);max-width:600px;margin:16px auto;line-height:1.8}
footer{border-top:1px solid var(--line);padding:30px 0 45px;color:#68717c;font-size:12px;display:flex;justify-content:space-between}.cyan{color:var(--cyan)}
.reveal{opacity:0;transform:translateY(25px);transition:.7s ease}.reveal.show{opacity:1;transform:none}
@media(max-width:800px){.navlinks{display:none;position:absolute;top:62px;left:0;right:0;padding:10px;flex-direction:column;background:#0b0d10f5;border:1px solid var(--line);border-radius:18px}.navlinks.open{display:flex}.menu{display:block}.grid2,.grid3{grid-template-columns:1fr}.hero{padding-top:145px}h1{letter-spacing:-4px}.lead{font-size:16px}section{padding:85px 0}.section-head h2{letter-spacing:-2px}footer{flex-direction:column;gap:8px}}