
:root{--bg:#07111d;--panel:rgba(255,255,255,.05);--border:rgba(255,255,255,.08);--blue:#3d8cff}
*{margin:0;padding:0;box-sizing:border-box}
body{font-family:Inter,sans-serif;background:radial-gradient(circle at top,#10243d,#07111d 60%);color:#eef5ff}
.nav{position:sticky;top:0;display:flex;justify-content:space-between;padding:20px 6%;background:rgba(7,17,29,.82);backdrop-filter:blur(16px);z-index:10}
.logo{font-weight:800;letter-spacing:2px}.nav a{color:#dbe8ff;text-decoration:none;margin-left:22px}
.hero img{display:block;width:100%;height:auto}
.intro{padding:80px 8%;text-align:center;max-width:1100px;margin:auto}
.intro h1{font:700 64px "Space Grotesk";margin-bottom:18px}
.intro p{font-size:1.15rem;color:#b8c7da;max-width:850px;margin:auto}
.actions{margin-top:35px}


.btn{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    padding:14px 32px;
    margin:8px;
    border-radius:999px;

    text-decoration:none;
    color:#ffffff;
    font-weight:600;

    border:1px solid var(--border);
    transition:all .25s ease;
}

.btn:hover{
    transform:translateY(-2px);
}

.btn.primary{
    background:linear-gradient(135deg,#54a6ff,#2458de);
    color:#fff;
    border:none;
    box-shadow:0 12px 30px rgba(61,140,255,.35);
}

.btn.primary:hover{
    box-shadow:0 18px 40px rgba(61,140,255,.45);
}

.btn:not(.primary){
    background:rgba(255,255,255,.03);
    color:#eef5ff;
}

.btn:not(.primary):hover{
    background:rgba(255,255,255,.08);
}








.section{padding:90px 8%}
.section h2{text-align:center;font:700 44px "Space Grotesk";margin-bottom:10px}
.lead{text-align:center;color:#8eb8ff;margin-bottom:40px}
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:24px;margin-top:35px}
.card{background:var(--panel);border:1px solid var(--border);border-radius:18px;padding:28px;backdrop-filter:blur(18px);transition:.3s}
.card:hover{transform:translateY(-10px);box-shadow:0 0 40px rgba(61,140,255,.25);border-color:#4c9bff}
.alt{background:#0c1725}
.timeline{display:flex;justify-content:center;align-items:center;gap:14px;flex-wrap:wrap;font-weight:700}
.timeline div{padding:16px 20px;background:var(--panel);border:1px solid var(--border);border-radius:12px}
footer{text-align:center;padding:50px;color:#8ea5bc}
@media(max-width:800px){.intro h1{font-size:42px}}
