
:root{
  --bg0:#05070f;
  --bg1:#070b18;
  --card: rgba(255,255,255,.06);
  --card2: rgba(255,255,255,.08);
  --stroke: rgba(255,255,255,.12);
  --text: rgba(255,255,255,.92);
  --muted: rgba(255,255,255,.62);
  --muted2: rgba(255,255,255,.45);
  --brand: #7c3aed; /* violet */
  --brand2:#22d3ee; /* cyan */
  --shadow: 0 18px 50px rgba(0,0,0,.45);
  --r: 18px;
}
html,body{height:100%;}
body{
  margin:0;
  background:
    radial-gradient(1200px 600px at 18% 20%, rgba(34,211,238,.20), transparent 55%),
    radial-gradient(1000px 600px at 85% 18%, rgba(124,58,237,.24), transparent 55%),
    radial-gradient(800px 600px at 70% 85%, rgba(16,185,129,.10), transparent 55%),
    linear-gradient(180deg, var(--bg0), var(--bg1));
  color:var(--text);
  font-family: system-ui, -apple-system, Segoe UI, Roboto, Arial, "Noto Sans", sans-serif;
}
a{color:inherit}
.small-muted{color:var(--muted); font-size:.95rem}
.small-muted a{color:var(--text)}
.navbar{
  backdrop-filter: blur(12px);
  background: rgba(0,0,0,.35);
  border-bottom: 1px solid rgba(255,255,255,.08);
}
.navbar .nav-link{color:rgba(255,255,255,.80); border-radius:10px; padding:.55rem .75rem}
.navbar .nav-link:hover{color:#fff; background:rgba(255,255,255,.06)}
.navbar .nav-link.active{color:#fff; background:rgba(255,255,255,.10)}
.btn-primary{
  background: linear-gradient(135deg, var(--brand), var(--brand2));
  border:0;
  box-shadow: 0 10px 26px rgba(124,58,237,.25);
}
.btn-outline-light{border-color: rgba(255,255,255,.25); color:rgba(255,255,255,.9)}
.btn-outline-light:hover{background:rgba(255,255,255,.10); border-color: rgba(255,255,255,.35); color:#fff}
.hero{
  position:relative;
  overflow:hidden;
}
.hero:before{
  content:"";
  position:absolute; inset:-2px;
  background:
    radial-gradient(900px 420px at 20% 30%, rgba(34,211,238,.18), transparent 60%),
    radial-gradient(800px 420px at 78% 25%, rgba(124,58,237,.20), transparent 60%);
  pointer-events:none;
}
.hero .container{position:relative}
.kicker{
  display:inline-flex; gap:.55rem; align-items:center;
  padding:.45rem .75rem;
  border:1px solid rgba(255,255,255,.14);
  background: rgba(255,255,255,.05);
  border-radius: 999px;
  color: rgba(255,255,255,.85);
}
.glass{
  background: linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.05));
  border: 1px solid rgba(255,255,255,.12);
  border-radius: var(--r);
  box-shadow: var(--shadow);
}
.cardx{
  background: var(--card);
  border: 1px solid rgba(255,255,255,.10);
  border-radius: var(--r);
  transition: transform .15s ease, background .15s ease, border-color .15s ease;
}
.cardx:hover{
  transform: translateY(-3px);
  background: var(--card2);
  border-color: rgba(255,255,255,.18);
}
.icon-pill{
  width:46px; height:46px;
  display:flex; align-items:center; justify-content:center;
  border-radius: 14px;
  background: linear-gradient(135deg, rgba(124,58,237,.35), rgba(34,211,238,.25));
  border: 1px solid rgba(255,255,255,.15);
}
.section-title{
  letter-spacing:.12em;
  text-transform:uppercase;
  font-weight:700;
  font-size:.78rem;
  color: rgba(255,255,255,.65);
}
.divider{height:1px; background: rgba(255,255,255,.10)}
.footer{
  margin-top: 4rem;
  border-top: 1px solid rgba(255,255,255,.10);
  background: rgba(0,0,0,.25);
  backdrop-filter: blur(10px);
}
.chip{
  display:inline-flex; align-items:center; gap:.45rem;
  padding:.40rem .65rem;
  border-radius: 999px;
  border:1px solid rgba(255,255,255,.14);
  background: rgba(255,255,255,.06);
  color: rgba(255,255,255,.82);
  font-size:.92rem;
}
.rtl{direction:rtl; text-align:right}
.rtl .navbar .navbar-nav{margin-right:auto!important; margin-left:0!important}
.rtl .ms-auto{margin-right:auto!important; margin-left:0!important}
.rtl .me-1,.rtl .me-2{margin-left:.25rem!important; margin-right:0!important}
.rtl .ms-1,.rtl .ms-2,.rtl .ms-3{margin-right:.25rem!important; margin-left:0!important}
