:root{
    --bg:#0b1220;
    --card:#0f1a2f;
    --text:#eaf0ff;
    --muted:#a9b4d0;
    --line:#1f2a44;
    --accent:#d6b35b;
    --accent2:#2aa6a3;
    --white:#ffffff;
}

*{box-sizing:border-box}
html,body{height:100%}
body{
    margin:0;
    font-family: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, "Apple Color Emoji","Segoe UI Emoji";
    background: linear-gradient(180deg, #071022 0%, #050a14 100%);
    color: var(--text);
}

a{color:inherit; text-decoration:none}
.container{max-width:1100px; margin:0 auto; padding:0 18px}

.header{
    position:sticky; top:0; z-index:50;
    background: rgba(5,10,20,.85);
    backdrop-filter: blur(10px);
    border-bottom: 1px solid rgba(31,42,68,.7);
}
.header__inner{
    display:flex; align-items:center; justify-content:space-between;
    padding:14px 0;
}

.brand{display:flex; gap:12px; align-items:center}
.brand__logo{
    width:44px; height:44px; border-radius:12px;
    background:#0c1530; border:1px solid rgba(31,42,68,.8);
    object-fit:contain;
}
.brand__name{font-weight:800; letter-spacing:.2px}
.brand__tag{font-size:12px; color:var(--muted)}

.nav{display:flex; gap:18px; align-items:center}
.nav a{color:var(--muted); font-weight:600}
.nav a:hover{color:var(--text)}

.menuBtn{
    display:none;
    width:44px; height:40px;
    background:transparent; border:1px solid rgba(31,42,68,.9);
    border-radius:12px; cursor:pointer;
}
.menuBtn span{
    display:block; height:2px; margin:6px 10px;
    background: var(--text); border-radius:2px;
}

.mobileNav{
    display:none;
    padding:10px 18px 18px;
    border-top: 1px solid rgba(31,42,68,.7);
}
.mobileNav a{display:block; padding:10px 6px; color:var(--muted); font-weight:600}
.mobileNav a:hover{color:var(--text)}

.hero{padding:56px 0 26px}
.hero__grid{
    display:grid; gap:22px;
    grid-template-columns: 1.4fr .9fr;
    align-items:start;
}
h1{
    margin:0 0 12px;
    font-size:44px; line-height:1.08;
    letter-spacing:-.6px;
}
.accent{color:var(--accent)}
.lead{color:var(--muted); font-size:18px; line-height:1.55; margin:0 0 18px}
.hero__cta{display:flex; gap:12px; flex-wrap:wrap; margin:18px 0}
.badges{display:flex; gap:10px; flex-wrap:wrap; margin-top:12px}
.badge{
    padding:8px 10px;
    border-radius:999px;
    border:1px solid rgba(31,42,68,.9);
    background: rgba(15,26,47,.6);
    color: var(--muted);
    font-weight:700;
    font-size:12px;
}

.section{padding:42px 0}
.section--alt{background: rgba(15,26,47,.35); border-top:1px solid rgba(31,42,68,.6); border-bottom:1px solid rgba(31,42,68,.6)}
h2{font-size:30px; margin:0 0 8px}
.muted{color:var(--muted)}
.fineprint{font-size:12.5px; color: var(--muted); margin-top:14px}

.card{
    background: rgba(15,26,47,.72);
    border:1px solid rgba(31,42,68,.85);
    border-radius:18px;
    padding:18px;
    box-shadow: 0 10px 30px rgba(0,0,0,.25);
}
.card__title{margin:0 0 10px; font-size:18px}
.card__subtitle{margin:0 0 10px; font-size:14px; color:var(--muted)}
.divider{height:1px; background: rgba(31,42,68,.8); margin:14px 0}

.list{margin:0; padding-left:18px; color:var(--muted); line-height:1.6}
.pills{display:flex; flex-wrap:wrap; gap:8px}
.pill{
    border:1px solid rgba(31,42,68,.85);
    background: rgba(5,10,20,.35);
    color: var(--text);
    padding:7px 10px;
    border-radius:999px;
    font-size:12px;
    font-weight:700;
}

.steps{display:grid; grid-template-columns: repeat(3, 1fr); gap:14px; margin-top:18px}
.step{
    border:1px solid rgba(31,42,68,.85);
    background: rgba(15,26,47,.45);
    border-radius:18px;
    padding:16px;
}
.step__num{
    width:34px; height:34px; border-radius:10px;
    display:flex; align-items:center; justify-content:center;
    background: rgba(214,179,91,.12);
    border:1px solid rgba(214,179,91,.35);
    color: var(--accent);
    font-weight:900;
    margin-bottom:10px;
}
.step h3{margin:0 0 6px; font-size:16px}
.step p{margin:0; color:var(--muted); line-height:1.55}

.grid2{display:grid; grid-template-columns: 1fr 1fr; gap:14px; margin-top:18px}

.btn{
    display:inline-flex; align-items:center; justify-content:center;
    gap:8px;
    padding:12px 16px;
    border-radius:14px;
    border:1px solid rgba(214,179,91,.4);
    background: rgba(214,179,91,.16);
    color: var(--text);
    font-weight:900;
    cursor:pointer;
}
.btn:hover{background: rgba(214,179,91,.24)}
.btn--ghost{
    border:1px solid rgba(31,42,68,.9);
    background: rgba(15,26,47,.55);
    color: var(--text);
}
.btn--ghost:hover{background: rgba(15,26,47,.75)}
.btn--small{padding:10px 12px; border-radius:12px; font-size:13px}

.form{
    margin-top:16px;
    display:grid;
    gap:12px;
    max-width: 760px;
}
.form__row{display:grid; grid-template-columns: 1fr 1fr; gap:12px}
label{display:grid; gap:6px; font-weight:800; color: var(--text); font-size:13px}
input, select, textarea{
    width:100%;
    padding:12px 12px;
    border-radius:14px;
    border:1px solid rgba(31,42,68,.9);
    background: rgba(5,10,20,.45);
    color: var(--text);
    outline:none;
}
input::placeholder, textarea::placeholder{color: rgba(169,180,208,.8)}
input:focus, select:focus, textarea:focus{border-color: rgba(42,166,163,.7)}
textarea{resize:vertical; min-height:120px}

.contactCard{
    margin-top:18px;
    display:grid;
    grid-template-columns: repeat(2, 1fr);
    gap:10px;
    max-width: 760px;
}
.contactCard__item{
    border:1px solid rgba(31,42,68,.85);
    background: rgba(15,26,47,.35);
    border-radius:16px;
    padding:14px;
}
.contactCard__label{font-size:12px; color:var(--muted); font-weight:800}
.contactCard__value{font-size:14px; font-weight:900}

.footer{
    border-top:1px solid rgba(31,42,68,.7);
    padding:18px 0;
    color:var(--muted);
}
.footer__inner{
    display:flex; justify-content:space-between; gap:12px; flex-wrap:wrap;
}

@media (max-width: 900px){
    h1{font-size:38px}
    .hero__grid{grid-template-columns: 1fr}
    .steps{grid-template-columns: 1fr}
    .grid2{grid-template-columns: 1fr}
    .form__row{grid-template-columns: 1fr}
    .nav{display:none}
    .menuBtn{display:block}
    .mobileNav.open{display:block}
}