:root{
  --cl-bg:#f7f9fc;
  --cl-surface:#ffffff;
  --cl-border:#e6ebf2;
  --cl-text:#0f1c2e;
  --cl-muted:#5f6b7a;
  --cl-primary:#1f4ed8;
  --cl-primary-soft:#e8f0ff;
  --cl-link:#1f4ed8;
}

html,body{height:100%;}

body{
  background: linear-gradient(180deg,#f9fbff 0%,#f2f6fc 100%);
  color:var(--cl-text);
}

/* Navbar */
.navbar{
  background:#ffffff !important;
  border-bottom:1px solid var(--cl-border);
}
.navbar .nav-link{
  color:var(--cl-muted) !important;
  font-weight:500;
}
.navbar .nav-link:hover{
  color:var(--cl-primary) !important;
}

/* Buttons */
.btn-accent{
  background: var(--cl-primary);
  border:none;
  color:#fff;
  font-weight:600;
}
.btn-accent:hover{
  background:#193eb0;
}

.btn-outline-accent{
  border:1px solid var(--cl-primary);
  color:var(--cl-primary);
}
.btn-outline-accent:hover{
  background:var(--cl-primary-soft);
  color:var(--cl-primary);
}

/* Hero */
.hero{
  padding:5rem 0 4rem;
}

.hero h1{
  font-weight:800;
  letter-spacing:-0.02em;
}

.lead{
  color:var(--cl-muted);
}

/* Cards */
.card{
  background:var(--cl-surface);
  border:1px solid var(--cl-border);
  border-radius:1rem;
  box-shadow:0 8px 30px rgba(15,28,46,.05);
}

.section{
  padding:4rem 0;
}

.kicker{
  color:var(--cl-primary);
  text-transform:uppercase;
  letter-spacing:.14em;
  font-weight:700;
  font-size:.75rem;
}

.badge-soft{
  background:var(--cl-primary-soft);
  border:1px solid #d9e5ff;
  color:var(--cl-primary);
  font-weight:600;
}

.hr-soft{
  border-top:1px solid var(--cl-border);
}

/* Footer */
.footer{
  border-top:1px solid var(--cl-border);
  background:#ffffff;
}

a{
  color:var(--cl-link);
  text-decoration:none;
}

a:hover{
  text-decoration:underline;
}

.codeblock{
  background:#f4f7fc;
  border:1px solid var(--cl-border);
  border-radius:.75rem;
  padding:1rem;
  overflow:auto;
  color:#243247;
}

/* Remove previous glow effect */
.glow:before{
  display:none;
}

.hero-illustration{
  border-radius:1rem;
  border:1px solid var(--cl-border);
  background:#ffffff;
  padding:.75rem;
}