* { margin:0; padding:0; box-sizing:border-box; }
body { font-family:'Inter',sans-serif; line-height:1.6; color:#333; background:#000; }
.container { max-width:1200px; margin:0 auto; padding:0 20px; }

/* Header */
header { background:rgba(0,0,0,0.95); backdrop-filter:blur(20px); position:fixed; width:100%; top:0; z-index:1000; padding:1rem 0; }
nav { display:flex; justify-content:space-between; align-items:center; }
.logo { height:50px; }
nav ul { display:flex; list-style:none; gap:2rem; align-items:center; }
nav a { color:#fff; text-decoration:none; font-weight:500; }
.cta { background:linear-gradient(135deg,#00d4ff,#0099cc); color:#fff; border:none; padding:12px 24px; border-radius:50px; font-weight:600; cursor:pointer; transition:all 0.3s; }
.cta:hover { transform:translateY(-2px); box-shadow:0 10px 30px rgba(0,212,255,0.4); }

/* Hero */
.hero { background:linear-gradient(135deg,#0a0a0a 0%,#1a1a2e 50%,#16213e 100%); padding:150px 0 100px; text-align:center; color:#fff; }
.hero h1 { font-size:clamp(3rem,8vw,6rem); font-weight:800; margin-bottom:1rem; background:linear-gradient(135deg,#00d4ff,#fff); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text; }
.hero p { font-size:1.5rem; margin-bottom:3rem; opacity:0.9; }
.hero-buttons { gap:1rem; display:flex; justify-content:center; flex-wrap:wrap; margin-bottom:3rem; }
.free-trial ul { display:flex; gap:2rem; justify-content:center; font-size:1.1rem; opacity:0.8; flex-wrap:wrap; }

/* Deployment */
.deployment { padding:100px 0; background:#111; }
.deployment h2 { text-align:center; font-size:3rem; color:#fff; margin-bottom:5rem; }
.steps { display:grid; grid-template-columns:1fr 1fr; gap:5rem; }
.step { text-align:center; }
.step-icon { background:linear-gradient(135deg,#00d4ff,#0099cc); color:#000; width:80px; height:80px; border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:2rem; font-weight:800; margin:0 auto 2rem; }
.step h3 { color:#fff; font-size:1.8rem; margin-bottom:1rem; }

/* Features Overview */
.features-overview { padding:100px 0; background:linear-gradient(135deg,#16213e,#0f3460); display:grid; grid-template-columns:repeat(auto-fit,minmax(250px,1fr)); gap:3rem; }
.feature { text-align:center; color:#fff; }
.feature h3 { font-size:1.8rem; margin-bottom:1rem; }

/* Pricing */
.pricing { padding:100px 0; background:#111; }
.pricing h2 { text-align:center; color:#fff; font-size:3rem; margin-bottom:3rem; }
table { width:100%; max-width:600px; margin:0 auto; background:#222; border-radius:20px; overflow:hidden; box-shadow:0 20px 40px rgba(0,0,0,0.5); }
th,td { padding:1.5rem; text-align:center; border-bottom:1px solid #333; }
th { background:linear-gradient(135deg,#00d4ff,#0099cc); color:#000; font-weight:600; }

/* Download */
.download { padding:100px 0; background:linear-gradient(135deg,#0a0a0a,#1a1a2e); text-align:center; color:#fff; }
.download h2 { font-size:3rem; margin-bottom:3rem; }
.download-cards { display:grid; grid-template-columns:repeat(auto-fit,minmax(300px,1fr)); gap:2rem; margin-bottom:2rem; }
.card { background:#222; padding:3rem 2rem; border-radius:20px; transition:all 0.3s; }
.card:hover { transform:translateY(-10px); box-shadow:0 20px 40px rgba(0,212,255,0.3); }
.card.beta { border:2px solid #00d4ff; }
.btn-download { display:inline-block; background:linear-gradient(135deg,#00d4ff,#0099cc); color:#000; padding:1rem 2rem; border-radius:50px; text-decoration:none; font-weight:600; margin-top:1rem; }

/* Footer */
footer { background:#000; color:#888; text-align:center; padding:3rem 0; }
.logo-footer { height:40px; margin-bottom:1rem; opacity:0.8; }

/* Responsive */
@media (max-width:768px) {
    nav ul { flex-direction:column; gap:1rem; }
    .steps { grid-template-columns:1fr; }
    .hero-buttons { flex-direction:column; align-items:center; }
}