*{margin:0;padding:0;box-sizing:border-box}
:root{--p:#2C82FF;--s:#0C172A;--bg:#0C172A;--t:#F5F7FB;--l:#AFC0D6;--b:#22314A;}
body{font-family:Segoe UI,Arial,sans-serif;background:var(--bg);color:var(--t)}
.container{width:min(1240px,92%);margin:auto}
header{position:sticky;top:0;background:rgba(255,255,255,.92);backdrop-filter:blur(10px);border-bottom:1px solid var(--b);z-index:10}
.navbar{height:82px;display:flex;justify-content:space-between;align-items:center}
.logo{text-decoration:none;font-size:2rem;font-weight:700;color:var(--s)}
.logo span{color:var(--p)}
.menu{display:flex;gap:36px;list-style:none}
.menu a{text-decoration:none;color:var(--t);font-weight:600}
.hero{position:relative;padding:90px 0 120px;overflow:hidden}
.hero-bg{position:absolute;right:-180px;top:-150px;width:700px;height:700px;background:radial-gradient(circle,#d9ecff 0,#eef6ff 45%,transparent 70%)}
.hero-grid{

    position:relative;

    display:grid;

    grid-template-columns:1fr 1.15fr;

    gap:30px;

    align-items:center;

}
.tag{display:inline-block;margin-bottom:20px;color:var(--p);font-size:.82rem;font-weight:700;letter-spacing:2px;text-transform:uppercase}
h1{

    font-size:5rem;

    line-height:.95;

    margin-bottom:30px;

    letter-spacing:-3px;

}
p{font-size:1.15rem;color:var(--l);max-width:580px}
.buttons{display:flex;gap:16px;margin-top:38px}
.btn{text-decoration:none;padding:16px 28px;border-radius:999px;font-weight:700;transition:.25s}
.primary{background:var(--p);color:#fff}
.secondary{border:2px solid var(--p);color:var(--p)}
.primary:hover,.secondary:hover{transform:translateY(-3px)}
.process-card{background:#fff;border:1px solid var(--b);border-radius:24px;padding:32px;box-shadow:0 20px 40px rgba(0,0,0,.06)}
.process-card h3{margin-bottom:20px}
.process-svg{width:100%;height:auto}
.process-svg line{stroke:#8fb8ef;stroke-width:4}
.process-svg circle{fill:#fff;stroke:#0B63CE;stroke-width:4}
.process-svg text{font:600 18px Segoe UI;fill:#12263F}
.coming{text-align:center;margin-top:20px;font-size:.9rem}
@media(max-width:900px){.hero-grid{grid-template-columns:1fr}.menu{display:none}h1{font-size:3rem}}

.hero-right{

    display:flex;

    justify-content:center;

    align-items:center;

    position:relative;

}
.hero-machine{

    width:125%;

    max-width:980px;

    display:block;

    background:none;

    border:none;

    border-radius:0;

    box-shadow:none;

    filter:drop-shadow(0 35px 45px rgba(0,0,0,.35));

    transform:translateX(40px);

    transition:.35s ease;

}

.hero-machine:hover{

    transform:translateX(40px) translateY(-8px);

}
header{background:rgba(12,23,42,.92)!important;border-bottom:1px solid rgba(255,255,255,.08)!important}
.logo,.menu a{color:white!important}
.hero{background:#0C172A}
.hero-bg{position:absolute;right:-250px;top:-250px;width:900px;height:900px;background:radial-gradient(circle,rgba(44,130,255,.25) 0%,rgba(44,130,255,.08) 40%,transparent 70%)}
