:root{
  --g1: rgba(16,185,129,.10);
  --g2: rgba(59,130,246,.10);
  --g3: rgba(139,92,246,.10);
  --glassL: rgba(255,255,255,.72);
  --glassD: rgba(15,23,42,.62);
}
html{scroll-behavior:smooth}
body{
  font-family: Poppins, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  background-image:
    radial-gradient(circle at 15% 18%, var(--g1), transparent 35%),
    radial-gradient(circle at 85% 22%, var(--g2), transparent 38%),
    radial-gradient(circle at 75% 80%, var(--g3), transparent 45%);
}
.bg-grid{
  background-image:
    linear-gradient(to right, rgba(148,163,184,.09) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(148,163,184,.09) 1px, transparent 1px);
  background-size:30px 30px;
}
.glass{
  background: var(--glassL);
  backdrop-filter: blur(14px);
  border: 1px solid rgba(255,255,255,.40);
}
.dark .glass{
  background: var(--glassD);
  border-color: rgba(148,163,184,.16);
}
.reveal{opacity:0; transform:translateY(22px); transition: all .65s ease;}
.reveal.show{opacity:1; transform:translateY(0);}

#scrollProgress{
  position:fixed; top:0; left:0; height:3px; width:0%;
  z-index:80;
  background: linear-gradient(90deg, #10B981, #3B82F6);
  box-shadow: 0 0 12px rgba(59,130,246,.45);
}

.section-title{ letter-spacing: -.02em; }

.lang-btn{
  font-weight:900;
  padding:.45rem .7rem;
  border-radius: .9rem;
  border:1px solid rgba(148,163,184,.35);
  background: rgba(255,255,255,.65);
}
.dark .lang-btn{ background: rgba(15,23,42,.55); border-color: rgba(148,163,184,.18); }
.lang-btn.active{
  border-color: rgba(16,185,129,.6);
  box-shadow: 0 0 0 2px rgba(16,185,129,.12);
}
.lang-en{ color:#2563eb; }
.lang-bn{ color:#10b981; }

.pill{
  padding:.22rem .6rem;
  border-radius:999px;
  font-weight:900;
  font-size:11px;
  border:1px solid rgba(148,163,184,.25);
  background: rgba(255,255,255,.65);
}
.dark .pill{ background: rgba(15,23,42,.55); border-color: rgba(148,163,184,.18); }

.plan-card{
  transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
.plan-card:hover{
  transform: translateY(-6px);
  box-shadow: 0 18px 40px rgba(16,185,129,.14);
  border-color: rgba(16,185,129,.35);
}
.badge-pop{
  position:absolute;
  top:-14px;
  left:50%;
  transform:translateX(-50%);
  padding:.25rem .7rem;
  border-radius:999px;
  font-weight:900;
  font-size:11px;
  color:#065f46;
  background: rgba(16,185,129,.18);
  border:1px solid rgba(16,185,129,.35);
}
.dark .badge-pop{
  color:#a7f3d0;
  background: rgba(16,185,129,.12);
  border-color: rgba(16,185,129,.25);
}