:root{
  --bg:#0f1724;
  --card:#0b1220;
  --muted:#9aa4b2;
  /* --accent:#534fc7; */
  --accent:#7bd389;
  --text:#e6eef6;
  --radius:12px;
  --wrap:1100px;
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial;
}
*{box-sizing:border-box}
html,body{height:100%}

body{
  margin:0;
  background:linear-gradient(180deg,var(--bg),#081022);
  color:var(--text);
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  line-height:1.5;
}
.wrap{max-width:var(--wrap);margin:0 auto;padding:48px 20px}
.site-header{background:#0f1724;position:sticky;top:0;z-index:10;opacity: 0.9; padding-top: 0px; padding-bottom: 0px}
.site-header .wrap{display:flex;align-items:center;justify-content:space-between}
.logo{margin:0;font-size:1.2rem;letter-spacing:0.4px}
nav a{color:var(--muted);text-decoration:none;margin-left:18px}
nav a:hover{color:var(--text)}

.highlight {
  /* color: #3d3b7b; Choose any color you like */
  color: #7bd389;
  font-weight: bold;
  /* background: #595c5f; Optional: subtle background */
  padding: 0 2px;
  border-radius: 3px;
}

/* Make a Section for bullet points */
ul {
  list-style-type: disc; /* Use disc bullets */
  margin-left: 20px; /* Indent the list */
  padding-left: 0; /* Remove default padding */
}




.hero{padding:48px 20px 36px}
.hero h2{margin:0;font-size:2.0rem}
.tagline{color:var(--accent);margin:6px 0 12px;font-weight:600}
.btn{display:inline-block;padding:10px 16px;border-radius:10px;background:var(--accent);color:#022; text-decoration:none;margin-right:8px}
.btn.ghost{background:transparent;border:1px solid rgba(255,255,255,0.06);color:var(--text)}

h3{margin-top:0}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:18px;margin-top:18px}
.card{background:linear-gradient(180deg, rgba(255,255,255,0.02), rgba(255,255,255,0.01));padding:18px;border-radius:var(--radius);box-shadow:0 6px 18px rgba(2,6,23,0.6)}
.card h4{margin:0 0 8px}
.card p{color:var(--muted);margin:0 0 12px}

.site-footer{text-align:center;padding:18px 0;color:var(--muted);border-top:1px solid rgba(255,255,255,0.02);margin-top:36px}
@media (max-width:640px){.hero h2{font-size:1.6rem}.wrap{padding:28px 16px}}