:root{
  --bg: #0b0f14;
  --card:#10151d;
  --muted:#9aa4b2;
  --primary:#0d6efd;
}
*{box-sizing:border-box}
body{
  font-family: 'Inter', system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  background: #0b0f14;
  color:#e9eef6;
}
a{ text-decoration:none }
.text-light-50{ color: rgba(255,255,255,.6) }

.glass-nav{
  backdrop-filter: blur(8px);
  background: rgba(8,12,18,.75)!important;
  border-bottom: 1px solid rgba(255,255,255,.05);
}
.navbar .nav-link{ color:#cfd6e4 }
.navbar .nav-link.active,
.navbar .nav-link:hover{ color:#fff }

.hero{
  min-height: 92vh;
  position: relative;
  background:
    radial-gradient(1200px 600px at 0% 0%, rgba(13,110,253,.12), transparent 60%),
    radial-gradient(800px 400px at 100% 10%, rgba(13,110,253,.12), transparent 60%),
    linear-gradient(180deg, #0b0f14 0%, #0b0f14 60%, #0e141b 100%);
  padding-top: 5rem;
}
.hero-gradient{
  position:absolute; inset:0;
  background: radial-gradient(600px 300px at 70% 80%, rgba(13,110,253,.15), transparent 60%);
  pointer-events:none;
}
.hero .badge{ backdrop-filter: blur(4px) }
.fw-extrabold{ font-weight: 800 }

.hero-card{
  background: var(--card);
  border-radius: 1.25rem;
  overflow: hidden;
}
.hero-card .stats{
  display:grid;
  grid-template-columns: repeat(3,1fr);
  gap:1rem;
  padding:1rem 1rem 0 1rem;
}
.hero-card .stats .text-muted{ color: var(--muted)!important }

.page-hero{
  padding-top:6rem; padding-bottom:2rem;
  background: linear-gradient(180deg, #0b0f14 0%, #0e141b 100%);
}

.feature-card{
  background: var(--card);
  border: 1px solid rgba(255,255,255,.06);
  border-radius: 1rem;
  transition: transform .2s ease, border-color .2s ease;
}
.feature-card:hover{ transform: translateY(-4px); border-color: rgba(13,110,253,.4) }
.icon-wrap{
  width:48px; height:48px; border-radius:10px;
  display:grid; place-items:center; margin-bottom:12px;
  background: rgba(13,110,253,.12);
  color:#a9c4ff; font-size:22px;
}

.project img{ object-fit:cover; height: 190px }

.pricing{
  background: var(--card);
  border:1px solid rgba(255,255,255,.06)
}

.card, .btn, .form-control, .form-select{
  border-radius: 0.9rem;
}

.btn-primary{
  background: linear-gradient(90deg, #0d6efd, #5a8bff)!important;
  border: none;
}

footer{ border-top: 1px solid rgba(255,255,255,.06) }

/* Typewriter effect */
.typewriter {
  border-right: 2px solid #fff;
  white-space: nowrap;
  overflow: hidden;
  display:inline-block;
  animation: typing 3s steps(14,end) 1s 1 normal both, blink 900ms steps(14,end) infinite;
}
@keyframes typing { from { width:0 } to { width: 12ch } }
@keyframes blink { 0%,100%{ border-color: transparent } 50%{ border-color:#fff } }

/* Form */
.form-label{ color:#e9eef6 }
.form-control, .form-select{
  background: #0f1520; color:#e9eef6; border-color:#1a2330;
}
.form-control:focus, .form-select:focus{
  border-color:#2e3b52; box-shadow: none;
}