:root{
  --bg:#f7f9fc; --card:#ffffff; --text:#111827; --muted:#6b7280; --accent:#2563eb;
  --border:#e5e7eb; --shadow:0 10px 30px rgba(17,24,39,.06);
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Inter,system-ui,sans-serif;
  background:var(--bg); color:var(--text); line-height:1.6;
}
a{color:var(--accent); text-decoration:none}
a:hover{text-decoration:underline}
.container{max-width:1100px;margin:0 auto;padding:0 20px}
.nav{
  position:sticky; top:0; z-index:10;
  background:rgba(247,249,252,.9); backdrop-filter: blur(10px);
  border-bottom:1px solid var(--border);
}
.nav-inner{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px 0}
.brand{display:flex;align-items:center;gap:10px;font-weight:800;letter-spacing:.2px}
.brand svg{width:28px;height:28px}
.nav-links{display:flex;flex-wrap:wrap;gap:14px}
.nav-links a{color:var(--text);font-weight:600;opacity:.85}
.nav-links a.active{color:var(--accent);opacity:1}
.hero{
  background:linear-gradient(180deg,#ffffff,#f1f5f9);
  border-bottom:1px solid var(--border);
  padding:56px 0 40px;
}
.hero h1{font-size:46px;line-height:1.1;margin:0 0 12px}
.hero p{margin:10px 0;color:var(--muted);font-size:18px;max-width:880px}
.pills{display:flex;flex-wrap:wrap;gap:10px;margin-top:16px}
.pill{
  display:inline-block; padding:6px 12px; border:1px solid var(--border);
  border-radius:999px; background:#fff; color:var(--muted); font-size:14px;
}
.badge{
  display:inline-block; padding:6px 10px; border-radius:10px;
  border:1px solid rgba(37,99,235,.25); background:rgba(37,99,235,.06);
  color:var(--accent); font-weight:800; font-size:13px;
}
section{padding:42px 0}
h2{font-size:30px;margin:0 0 12px}
h3{font-size:18px;margin:22px 0 8px}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:18px;margin-top:18px}
.card{
  background:var(--card); border:1px solid var(--border); border-radius:14px;
  padding:18px; box-shadow:var(--shadow);
}
.kpi{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:14px;margin-top:18px}
.kpi .card{padding:14px}
.kpi .num{font-size:24px;font-weight:900}
.small{font-size:14px;color:var(--muted)}
hr.sep{border:none;border-top:1px solid var(--border);margin:28px 0}
.footer{border-top:1px solid var(--border);padding:28px 0;color:var(--muted);font-size:13px}
.callout{
  border-left:4px solid var(--accent);
  padding:12px 14px; background:#fff; border:1px solid var(--border);
  border-radius:12px; box-shadow:var(--shadow);
}
ul{padding-left:18px}