:root{
--bg:#070B12;
--panel:rgba(255,255,255,.06);
--border:rgba(255,255,255,.14);
--text:#EAF2FF;
--muted:#B6C6DD;
--blue:#2EA8FF;
--green:#22C55E;
--gold:#FBBF24;
--shadow:0 18px 60px rgba(0,0,0,.45);
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
font-family:system-ui,Segoe UI,Roboto,Arial,sans-serif;
background:var(--bg);
color:var(--text);
}
a{color:var(--blue);text-decoration:none}
a:hover{opacity:.92}
.wrap{max-width:1120px;margin:0 auto;padding:22px}
.card{
background:var(--panel);
border:1px solid var(--border);
border-radius:18px;
padding:18px;
box-shadow:var(--shadow);
}
.grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.grid3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:12px}
@media(max-width:980px){.grid,.grid3{grid-template-columns:1fr}}
h1,h2,h3{margin:0 0 10px 0}
p,li{color:var(--muted);line-height:1.62}
.pill{
display:inline-block;
padding:6px 10px;
border-radius:999px;
border:1px solid var(--border);
background:rgba(255,255,255,.05);
color:var(--muted);
font-size:12px;
}
.nav{
position:sticky;top:0;z-index:20;
background:rgba(7,11,18,.88);
backdrop-filter: blur(10px);
border-bottom:1px solid rgba(255,255,255,.10);
}
.navin{
max-width:1120px;margin:0 auto;
padding:12px 22px;
display:flex;gap:10px;align-items:center;justify-content:space-between;flex-wrap:wrap
}
.brand{display:flex;gap:10px;align-items:center}
.dot{
width:10px;height:10px;border-radius:999px;
background:var(--gold);
box-shadow:0 0 22px rgba(251,191,36,.55)
}
.links{display:flex;gap:10px;flex-wrap:wrap}
.btn{
display:inline-block;
padding:10px 12px;
border-radius:12px;
border:1px solid rgba(255,255,255,.14);
background:rgba(255,255,255,.06);
color:var(--text);
}
.btn:hover{border-color:rgba(46,168,255,.55)}
.btn.active{
border-color:rgba(34,197,94,.70);
box-shadow:0 0 0 2px rgba(34,197,94,.12) inset;
}
.accentGold{color:var(--gold)}
.accentGreen{color:var(--green)}
.accentBlue{color:var(--blue)}
.heroImg{
border-radius:18px;border:1px solid rgba(255,255,255,.12);
overflow:hidden;min-height:260px;background:rgba(255,255,255,.04)
}
.heroImg img, .heroImg video{width:100%;height:100%;object-fit:cover;display:block}
input,select,textarea{
width:100%;
background:rgba(255,255,255,.06);
border:1px solid rgba(255,255,255,.14);
color:var(--text);
border-radius:12px;
padding:10px 12px;
outline:none;
}
label{display:block;margin:10px 0 6px 0;color:var(--muted)}
small{color:var(--muted)}
hr{border:none;border-top:1px solid rgba(255,255,255,.10);margin:14px 0}
:root {
--econ-blue: #1ea7ff;
--econ-green: #22c55e;
--econ-gold: #f5c84c;
}
a, .link { color: var(--econ-blue); }
button, .btn { background-color: var(--econ-green); border-color: var(--econ-gold); }
.highlight, .accent { color: var(--econ-gold); }