:root{
  --bg:#0b0f14; --card:#0f1720; --txt:#e6edf3; --muted:#9fb3c8;
  --brand:#0ea5e9; --brand-2:#22d3ee; --border:rgba(255,255,255,.06);
  --glow:0 0 60px rgba(34,211,238,.25);
}
:root.light{
  --bg:#f8fafc; --card:#ffffff; --txt:#0f172a; --muted:#475569;
  --brand:#0369a1; --brand-2:#0ea5e9; --border:rgba(2,6,23,.08);
  --glow:0 0 60px rgba(14,165,233,.18);
}
*{box-sizing:border-box}html,body{height:100%}
body{
  margin:0;font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,"Helvetica Neue",Arial,"Noto Sans",sans-serif;
  background: radial-gradient(1200px 500px at 80% -10%, rgba(14,165,233,.15), transparent 60%),
              radial-gradient(900px 400px at 10% 10%, rgba(34,211,238,.10), transparent 60%),
              var(--bg);
  color:var(--txt); line-height:1.6;
}
a{color:inherit;text-decoration:none}
.container{max-width:1200px;margin:0 auto;padding:0 20px}

/* Header */
header{
  position:sticky;top:0;z-index:40;
  background:linear-gradient(to bottom, rgba(0,0,0,.35), transparent);
  backdrop-filter:saturate(1.2) blur(8px);
  border-bottom:1px solid var(--border);
}
.nav{display:flex;align-items:center;justify-content:space-between;height:70px}
.brand{display:flex;gap:12px;align-items:center;font-weight:700;letter-spacing:.2px}
.logo{width:36px;height:36px;border-radius:10px;background:linear-gradient(135deg,var(--brand),var(--brand-2));box-shadow:var(--glow)}
.links{display:flex;gap:22px;align-items:center}
.links a{color:var(--muted);font-weight:600}
.links a.active,.links a:hover{color:var(--txt)}
.cta{
  display:inline-flex;align-items:center;gap:8px;background:linear-gradient(135deg,var(--brand),var(--brand-2));
  color:#fff;border:0;padding:10px 16px;border-radius:12px;font-weight:700;box-shadow:var(--glow);cursor:pointer
}
.ghost{background:transparent;border:1px solid var(--border);color:var(--txt);padding:10px 14px;border-radius:12px;font-weight:600}
.menu-btn{display:none}

/* Sections / Cards */
section{padding:56px 0}
.section-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:18px}
.section-head h1,.section-head h2{margin:0;font-size:clamp(22px,4vw,36px)}
.muted{color:var(--muted)}
.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.card{
  border:1px solid var(--border);border-radius:16px;padding:18px;background:linear-gradient(180deg,rgba(255,255,255,.02),transparent);
  transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease;position:relative;overflow:hidden
}
.card:hover{transform:translateY(-4px);border-color:rgba(34,211,238,.25);box-shadow:var(--glow)}
.card .chip{font-size:12px;color:var(--brand-2);background:rgba(34,211,238,.09);border:1px solid var(--border);padding:4px 8px;border-radius:999px;display:inline-block}
.card h3{margin:10px 0 6px}
.card p{margin:0;color:var(--muted)}
.card .go{position:absolute;right:14px;bottom:14px;font-weight:700;color:var(--brand-2)}
.split{display:grid;grid-template-columns:1fr 1fr;gap:22px}
.kpi{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:10px}
.k{border:1px solid var(--border);border-radius:14px;padding:12px;text-align:center}
.k .n{font-size:20px;font-weight:800}.k .l{color:var(--muted);font-size:12px}

/* Hero */
.hero{padding:56px 0 40px;position:relative;overflow:hidden}
.hero-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:24px;align-items:center}
.eyebrow{color:var(--brand-2);font-weight:700;letter-spacing:.5px}
.title{font-size:clamp(32px,6vw,56px);line-height:1.05;margin:8px 0 12px;font-weight:800}
.subtitle{color:var(--muted);font-size:clamp(14px,2.4vw,18px);max-width:56ch}
.hero-actions{display:flex;gap:12px;margin-top:22px;flex-wrap:wrap}
.badge{display:inline-flex;align-items:center;gap:8px;background:rgba(14,165,233,.08);color:var(--brand-2);padding:6px 10px;border-radius:999px;font-weight:700;font-size:12px;border:1px solid var(--border)}
.orbit{position:absolute;right:-120px;top:-120px;width:540px;height:540px;border-radius:50%;background:radial-gradient(closest-side,rgba(34,211,238,.18),transparent 70%);filter:blur(6px);animation:float 12s ease-in-out infinite;pointer-events:none}
@keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(18px)}}

/* Footer */
footer{border-top:1px solid var(--border);padding:28px 0;color:var(--muted);font-size:14px}
.sr{position:absolute;left:-10000px;width:1px;height:1px;top:auto;overflow:hidden}
.reveal{opacity:0;transform:translateY(14px);transition:all .5s ease}
.reveal.show{opacity:1;transform:translateY(0)}
.hide-on-mobile{display:block}

/* Responsive */
@media (max-width:1000px){.grid{grid-template-columns:1fr 1fr}.split{grid-template-columns:1fr}.hero-grid{grid-template-columns:1fr}.hide-on-mobile{display:none}}
@media (max-width:600px){.grid{grid-template-columns:1fr}.links{display:none}.menu-btn{display:inline-flex}}