
:root{
  --bg:#0f0f12; --card:#16161b; --text:#e6e6e6; --muted:#9aa0a6; --brand:#7c3aed; --accent:#22c55e;
  --shadow:0 10px 25px rgba(0,0,0,.25);
}
*{box-sizing:border-box}
html,body{margin:0;padding:0;font-family:Inter,system-ui,Segoe UI,Roboto,Helvetica,Arial,sans-serif;background:linear-gradient(180deg,#0b0b0e,#14141a);color:var(--text)}
a{color:inherit;text-decoration:none}
.container{max-width:1150px;margin:0 auto;padding:24px}
.btn{display:inline-flex;align-items:center;gap:10px;padding:12px 18px;border-radius:14px;background:var(--brand);color:white;border:0;cursor:pointer;box-shadow:var(--shadow);transition:transform .1s ease}
.btn:hover{transform:translateY(-1px)}
.btn.ghost{background:transparent;border:1px solid #2b2b33;color:var(--text)}
.badge{padding:4px 10px;border:1px solid #2b2b33;border-radius:999px;color:var(--muted);font-size:12px}
header{position:sticky;top:0;background:rgba(12,12,15,.7);backdrop-filter:saturate(140%) blur(10px);border-bottom:1px solid #1f1f27;z-index:10}
.nav{display:flex;align-items:center;justify-content:space-between;padding:12px 24px}
.logo{display:flex;align-items:center;gap:10px;font-weight:800;letter-spacing:.4px}
.logo .dot{width:10px;height:10px;background:var(--accent);border-radius:999px;display:inline-block}
.hero{display:grid;grid-template-columns:1.1fr .9fr;gap:36px;align-items:center;padding:52px 24px}
.card{background:var(--card);border:1px solid #242430;border-radius:18px;box-shadow:var(--shadow)}
.card.pad{padding:24px}
h1{font-size:44px;line-height:1.05;margin:0 0 10px}
h2{font-size:28px;margin:0 0 12px}
p{color:var(--muted);line-height:1.65}
.grid{display:grid;gap:18px}
.grid.cols-3{grid-template-columns:repeat(3,1fr)}
.grid.cols-4{grid-template-columns:repeat(4,1fr)}
.input{width:100%;padding:12px 14px;border-radius:12px;border:1px solid #2b2b33;background:#111118;color:var(--text)}
.kpis{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:18px}
.kpi{padding:16px;border-radius:14px;background:linear-gradient(180deg,#17171f,#141419);border:1px solid #2a2a33}
.kpi .v{font-size:22px;font-weight:700}
footer{border-top:1px solid #1f1f27;padding:24px;color:#a0a3ad}
.tag{font-size:12px;padding:6px 10px;border-radius:999px;background:#1b1b22;border:1px solid #2b2b33;color:#c9cad1}
.card.media{overflow:hidden}
.card.media img{width:100%;height:260px;object-fit:cover;display:block}
.card .title{font-weight:700;margin-top:10px}
.flex{display:flex;gap:12px;align-items:center}
.row{display:flex;gap:12px;flex-wrap:wrap}
section{margin:32px 0}
.table{width:100%;border-collapse:collapse}
.table td,.table th{padding:12px;border-bottom:1px solid #242430;color:#d5d7de;text-align:left}
.notice{font-size:12px;color:#9aa0a6}
@media (max-width: 950px){
 .hero{grid-template-columns:1fr;gap:20px}
 .grid.cols-3{grid-template-columns:1fr 1fr}
 .grid.cols-4{grid-template-columns:1fr 1fr}
}
