*{margin:0;padding:0;box-sizing:border-box;font-family:Arial,sans-serif}
body{background:#030712;color:#fff;line-height:1.6}
header{position:fixed;width:100%;padding:22px 40px;background:rgba(3,7,18,.88);backdrop-filter:blur(12px);display:flex;justify-content:space-between;align-items:center;z-index:999;border-bottom:1px solid rgba(255,255,255,.08)}
.logo{font-size:28px;font-weight:800;background:linear-gradient(90deg,#00c2ff,#2563eb);-webkit-background-clip:text;-webkit-text-fill-color:transparent}
nav a{margin:0 12px;color:#fff;text-decoration:none}
.cta-top{padding:12px 20px;border:1px solid #2563eb;border-radius:12px;color:#fff;text-decoration:none}
.hero{height:100vh;background:url('hero-bg.png') center/cover no-repeat;display:flex;align-items:center;padding:0 60px;position:relative}
.overlay{position:absolute;inset:0;background:rgba(0,0,0,.58)}
.hero-content{position:relative;max-width:760px;z-index:2}
.tag{display:inline-block;padding:10px 18px;border-radius:999px;background:rgba(37,99,235,.15);color:#38bdf8;margin-bottom:20px}
.hero h1{font-size:68px;line-height:1.1;margin-bottom:25px}
.hero p{font-size:22px;color:#d1d5db}
.buttons{margin-top:35px;display:flex;gap:18px;flex-wrap:wrap}
.btn-primary,.btn-secondary{padding:16px 26px;border-radius:14px;text-decoration:none;font-weight:bold}
.btn-primary{background:linear-gradient(90deg,#00c2ff,#2563eb);color:#fff}
.btn-secondary{border:1px solid rgba(255,255,255,.2);color:#fff}
.section-title{text-align:center;margin-bottom:50px}
.section-title h2{font-size:48px;margin-bottom:12px}
.section-title p{color:#cbd5e1}
.history,.ecosystem,.contact{padding:100px 50px}
.history-grid,.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:28px}
.history-card,.card{background:#0f172a;border-radius:24px;overflow:hidden;border:1px solid #1e293b;transition:.3s}
.history-card:hover,.card:hover{transform:translateY(-6px);border-color:#38bdf8}
.history-card img,.card img{width:100%;height:220px;object-fit:cover}
.history-card h3,.card h3{padding:24px 24px 10px}
.history-card p,.card p{padding:0 24px 24px;color:#cbd5e1}
.card .content{padding-bottom:24px}
.card a{margin-left:24px;text-decoration:none;color:#38bdf8;font-weight:bold}
.numbers{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:20px;padding:40px 50px}
.number-box{background:#081120;padding:35px;border-radius:22px;text-align:center;border:1px solid #1e293b}
.number-box h3{font-size:42px;color:#38bdf8}
.number-box span{color:#cbd5e1}
form{max-width:700px;margin:auto;display:flex;flex-direction:column;gap:18px}
input,textarea{padding:18px;background:#0f172a;border:1px solid #1e293b;border-radius:14px;color:#fff}
textarea{height:180px}
button{padding:18px;border:none;border-radius:14px;background:linear-gradient(90deg,#00c2ff,#2563eb);color:#fff;font-weight:bold}
footer{text-align:center;padding:50px;background:#081120;border-top:1px solid #1e293b}
footer h3{font-size:32px;margin-bottom:12px}
@media(max-width:900px){
header{flex-direction:column;gap:14px;padding:18px}
.hero{padding:0 20px;text-align:center}
.hero h1{font-size:42px}
.hero p{font-size:18px}
.buttons{justify-content:center}
.history,.ecosystem,.contact,.numbers{padding:80px 20px}
}