:root{
  --bg1:#e9fff3;
  --bg2:#dff7ec;
  --card:#ffffffcc;
  --card2:#ffffffee;
  --text:#0d1b14;
  --muted:#3f5a4e;
  --line:#cfe7da;
  --brand:#10b981;   /* green */
  --brand2:#34d399;  /* mint */
  --shadow: 0 18px 55px rgba(0,0,0,.10);
  --shadow2: 0 10px 30px rgba(0,0,0,.10);
  --r: 22px;
}

*{box-sizing:border-box}
html,body{margin:0; padding:0}
body{
  font-family: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Arial, "Noto Sans Bengali", sans-serif;
  color:var(--text);
  background:
    radial-gradient(1200px 600px at 10% 10%, #ffffff 0%, transparent 60%),
    radial-gradient(1000px 700px at 90% 20%, #ffffff 0%, transparent 55%),
    linear-gradient(135deg, var(--bg1), var(--bg2));
  overflow-x:hidden;
}

/* subtle noise overlay */
body::before{
  content:"";
  position:fixed; inset:0;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='120' height='120' filter='url(%23n)' opacity='.14'/%3E%3C/svg%3E");
  opacity:.18;
  pointer-events:none;
  mix-blend-mode:overlay;
}

/* NAV */
.nav{
  position:sticky; top:0; z-index:50;
  background: linear-gradient(180deg, #ffffffee, #ffffffcc);
  backdrop-filter: blur(12px);
  border-bottom:1px solid var(--line);
}
.nav-inner{
  max-width:1180px; margin:0 auto;
  display:flex; align-items:center; justify-content:space-between;
  padding:12px 16px;
  gap:12px;
}
.brand{
  display:flex; align-items:center; gap:10px;
  text-decoration:none; color:var(--text);
  font-weight:900; letter-spacing:.2px;
}
.logo-img{
  width:38px; height:38px; border-radius:12px;
  object-fit:cover;
  box-shadow: 0 10px 20px rgba(16,185,129,.18);
}
.logo-fallback{
  width:38px; height:38px; border-radius:12px;
  background: radial-gradient(circle at 30% 30%, #88ffcc, var(--brand));
  display:none;
  box-shadow: 0 10px 20px rgba(16,185,129,.18);
}
.nav-links{
  display:flex; gap:22px; align-items:center;
}
.nav-links a{
  text-decoration:none;
  color:#1c3c2f;
  font-weight:700;
  opacity:.85;
}
.nav-links a:hover{opacity:1}
.nav-cta{display:flex; gap:10px; align-items:center}

/* WRAP */
.wrap{
  max-width:1180px;
  margin:0 auto;
  padding:16px;
}

/* Buttons */
.btn{
  position:relative;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  padding:10px 14px;
  border-radius:14px;
  border:1px solid #cfe7da;
  background: #ffffffc8;
  text-decoration:none;
  color:#0f2a1e;
  font-weight:800;
  box-shadow: 0 10px 20px rgba(0,0,0,.06);
  transition: transform .15s ease, box-shadow .15s ease, background .15s ease;
  overflow:hidden; /* ✅ prevents any pseudo element from showing outside */
}
.btn:hover{
  transform: translateY(-1px);
  box-shadow: 0 16px 30px rgba(0,0,0,.10);
  background:#ffffffee;
}
.btn.primary{
  border-color: rgba(16,185,129,.35);
  background: linear-gradient(135deg, #bff7dd, #eafff4);
}
.btn.primary:hover{
  background: linear-gradient(135deg, #aaf1d2, #e7fff3);
}

/* bouncing site */
.site-bounce-wrap{display:flex; justify-content:center; margin:18px 0 10px}
.site-bounce{
  display:inline-flex; gap:10px; align-items:center;
  padding:10px 14px;
  border-radius:999px;
  background: #ffffffd8;
  border:1px solid var(--line);
  box-shadow: var(--shadow2);
  font-weight:900;
  animation: bounce 1.8s infinite ease-in-out;
}
.site-bounce a{
  color: #0b6f49;
  text-decoration:none;
  border-bottom:2px dotted rgba(16,185,129,.5);
}
@keyframes bounce{
  0%,100%{transform:translateY(0)}
  50%{transform:translateY(-5px)}
}

/* HERO */
.hero{padding:18px 0 24px}
.grid{
  display:grid;
  grid-template-columns: 1.05fr .95fr;
  gap:18px;
}
.hero-card{
  background: var(--card);
  border:1px solid var(--line);
  border-radius: var(--r);
  box-shadow: var(--shadow);
  padding:18px;
  position:relative;
  overflow:hidden;
}
.hero-card::after{
  content:"";
  position:absolute; inset:-80px;
  background:
    radial-gradient(240px 240px at 10% 15%, rgba(16,185,129,.18), transparent 60%),
    radial-gradient(260px 260px at 90% 25%, rgba(52,211,153,.16), transparent 60%),
    radial-gradient(260px 260px at 60% 90%, rgba(16,185,129,.12), transparent 60%);
  pointer-events:none;
}
.badge{
  display:inline-flex; align-items:center; gap:10px;
  padding:8px 12px;
  border-radius:999px;
  border:1px solid var(--line);
  background:#ffffffe6;
  font-weight:800;
  color:#234135;
}
.dot{
  width:10px; height:10px; border-radius:50%;
  background: var(--brand);
  box-shadow: 0 0 0 5px rgba(16,185,129,.18);
}
.hero-title{
  margin:14px 0 10px;
  font-size:40px;
  line-height:1.08;
  letter-spacing:-.5px;
}
.bn-3d{
  text-shadow:
    0 2px 0 rgba(0,0,0,.06),
    0 10px 25px rgba(0,0,0,.12);
}
.bn-3d-accent{
  background: linear-gradient(90deg, #00a96b, #00d49a);
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
  text-shadow:
    0 2px 0 rgba(0,0,0,.06),
    0 12px 25px rgba(16,185,129,.18);
}
.hero-sub{color:var(--muted); font-weight:650; line-height:1.6}
.mini{display:flex; flex-wrap:wrap; gap:10px; margin:14px 0}
.pill{
  display:inline-flex; align-items:center;
  padding:9px 12px;
  border-radius:999px;
  border:1px solid var(--line);
  background:#ffffffea;
  font-weight:800;
  color:#1f3a2f;
}
.hero-actions{display:flex; flex-wrap:wrap; gap:10px; margin:12px 0 6px}

.bn-box{
  margin-top:14px;
  background: var(--card2);
  border:1px solid var(--line);
  border-radius:18px;
  padding:14px;
  box-shadow: 0 12px 28px rgba(0,0,0,.08);
}
.bn-box-title{
  font-weight:1000;
  font-size:18px;
  margin-bottom:8px;
}
.bn-box-text{color:#2b4a3d; font-weight:650; line-height:1.7}
.mail-link{color:#0a7a52; font-weight:900; text-decoration:none; border-bottom:2px dotted rgba(16,185,129,.55)}
.mail-link:hover{opacity:.9}

/* Poster / Slider */
.poster{position:relative}
.slider{
  position:relative;
  width:100%;
  height:360px;
  border-radius:22px;
  overflow:hidden;
  border:1px solid var(--line);
  box-shadow: 0 18px 45px rgba(0,0,0,.15);
  background:#0b1b14;
}
.slider img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
  transform: scale(1.02);
  transition: opacity .65s ease, transform .65s ease;
}
.slider-overlay{
  position:absolute; inset:0;
  background: linear-gradient(180deg, rgba(0,0,0,.05), rgba(0,0,0,.28));
  pointer-events:none;
}

/* Poster info */
.poster-info{
  position:absolute;
  left:14px; right:14px;
  bottom:14px;
  background: rgba(255,255,255,.18);
  border:1px solid rgba(255,255,255,.35);
  border-radius:18px;
  padding:12px;
  backdrop-filter: blur(10px);
}
.note{
  display:flex; justify-content:space-between; gap:10px;
  font-weight:900;
  color:#ffffff;
  text-shadow: 0 10px 22px rgba(0,0,0,.35);
}
.muted{opacity:.86; font-weight:800}

/* Countdown */
.countdown{
  position:relative;
  margin:12px 0;
  display:grid;
  grid-template-columns: repeat(4, 1fr);
  gap:10px;
}
.tbox{
  position:relative;
  background: rgba(0,0,0,.40);
  border:1px solid rgba(255,255,255,.18);
  border-radius:16px;
  padding:10px 10px 8px;
  text-align:center;
  overflow:hidden;
}

/* ✅ Rain drops effect (CSS) */
.tbox::before{
  content:"";
  position:absolute; inset:0;
  background:
    radial-gradient(circle at 15% 0%, rgba(255,255,255,.65) 0 2px, transparent 3px),
    radial-gradient(circle at 55% 0%, rgba(255,255,255,.55) 0 2px, transparent 3px),
    radial-gradient(circle at 80% 0%, rgba(255,255,255,.50) 0 2px, transparent 3px);
  background-size: 140px 90px;
  background-repeat: repeat;
  opacity:.35;
  transform: translateY(-30px);
  animation: rain 1.1s linear infinite;
  pointer-events:none;
}
@keyframes rain{
  to{ transform: translateY(35px); }
}

.tval{
  font-family: "Orbitron", ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
  font-size:34px;
  font-weight:900;
  letter-spacing:1px;
  color:#f3fff9;
  text-shadow:
    0 2px 0 rgba(0,0,0,.35),
    0 0 18px rgba(16,185,129,.35);
}
.tlabel{
  margin-top:2px;
  font-size:12px;
  font-weight:900;
  letter-spacing:.6px;
  color: rgba(255,255,255,.86);
  text-transform:uppercase;
}

/* ✅ Heartbeat / electric line */
.pulse-line{
  position:absolute;
  left:10px; right:10px;
  top:50%;
  height:2px;
  transform: translateY(-50%);
  pointer-events:none;
  opacity:.9;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.55), transparent);
}
.pulse-line::before{
  content:"";
  position:absolute; inset:-10px 0;
  background:
    linear-gradient(90deg,
      transparent 0 8%,
      rgba(52,211,153,.00) 8%,
      rgba(52,211,153,.95) 12%,
      rgba(52,211,153,.00) 16%,
      rgba(52,211,153,.95) 21%,
      rgba(52,211,153,.00) 26%,
      rgba(52,211,153,.95) 33%,
      rgba(52,211,153,.00) 40%,
      rgba(52,211,153,.95) 46%,
      rgba(52,211,153,.00) 54%,
      rgba(52,211,153,.95) 60%,
      rgba(52,211,153,.00) 70%,
      transparent 70% 100%);
  filter: drop-shadow(0 0 10px rgba(52,211,153,.7));
  animation: pulseMove 1.1s linear infinite;
  opacity:.95;
}
@keyframes pulseMove{
  0%{transform: translateX(-18%)}
  100%{transform: translateX(18%)}
}

/* SECTIONS */
.section{padding:26px 0}
.sec-head{
  display:flex; align-items:flex-end; justify-content:space-between; gap:12px;
  margin-bottom:14px;
}
.sec-title{font-size:34px; font-weight:1000; letter-spacing:-.4px}
.sec-desc{color:var(--muted); font-weight:650}

/* cards */
.cards{
  display:grid;
  grid-template-columns: repeat(3, 1fr);
  gap:14px;
}
.card{
  background: var(--card2);
  border:1px solid var(--line);
  border-radius: 20px;
  padding:16px;
  box-shadow: var(--shadow2);
  transition: transform .15s ease, box-shadow .15s ease;
}
.card:hover{
  transform: translateY(-2px);
  box-shadow: 0 20px 40px rgba(0,0,0,.12);
}
.icon{
  width:38px; height:38px;
  border-radius:14px;
  display:grid; place-items:center;
  background: linear-gradient(135deg, #d9fff0, #f3fffa);
  border:1px solid var(--line);
  margin-bottom:10px;
}
.card h3{margin:0 0 6px; font-size:18px}
.card p{margin:0; color:var(--muted); font-weight:650; line-height:1.6}

/* split panels */
.split{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap:14px;
}
.split.one{grid-template-columns: 1fr;}
.panel{
  background: var(--card2);
  border:1px solid var(--line);
  border-radius: 20px;
  padding:16px;
  box-shadow: var(--shadow2);
}
.panel-h3{margin:0 0 8px; font-size:18px}
.panel-p{margin:0 0 10px; color:var(--muted); font-weight:650; line-height:1.6}
.list{list-style:none; padding:0; margin:12px 0 0; display:grid; gap:10px}
.li{display:flex; gap:10px; align-items:flex-start; padding:10px; border-radius:16px; border:1px solid var(--line); background:#ffffffea}
.tick{width:28px; height:28px; border-radius:10px; display:grid; place-items:center; background:#d8fff0; border:1px solid var(--line); font-weight:1000}
.li b{display:block}
.li span{display:block; color:var(--muted); font-weight:650; margin-top:2px}

.stats{display:grid; grid-template-columns: repeat(3,1fr); gap:10px; margin-top:10px}
.stat{border:1px solid var(--line); border-radius:18px; background:#ffffffea; padding:14px; text-align:center}
.stat .n{font-weight:1000; font-size:22px}
.stat .t{color:var(--muted); font-weight:650; margin-top:2px}

.faq details{
  background: var(--card2);
  border:1px solid var(--line);
  border-radius:18px;
  padding:12px 14px;
  box-shadow: var(--shadow2);
  margin-bottom:10px;
}
.faq summary{
  cursor:pointer;
  font-weight:900;
  display:flex; align-items:center; justify-content:space-between;
}
.faq p{margin:10px 0 0; color:var(--muted); font-weight:650; line-height:1.6}

.footer{
  margin-top:26px;
  border-top:1px solid var(--line);
  padding:18px 0 28px;
}
.footgrid{
  display:flex; align-items:flex-start; justify-content:space-between; gap:14px;
}
.footbrand{display:flex; align-items:center; gap:10px; font-weight:1000}
.footlogo{width:34px; height:34px; border-radius:12px; object-fit:cover}
.foottext{color:var(--muted); font-weight:650; margin-top:8px}
.small-links{display:flex; gap:12px; flex-wrap:wrap}
.small-links a{color:#1c3c2f; text-decoration:none; font-weight:800; opacity:.85}
.small-links a:hover{opacity:1}

/* Animations */
.fade-up{opacity:0; transform: translateY(10px); animation: fadeUp .7s ease forwards}
.delay1{animation-delay:.12s}
.delay2{animation-delay:.22s}
.delay3{animation-delay:.32s}
@keyframes fadeUp{to{opacity:1; transform:translateY(0)}}

/* Responsive */
@media (max-width: 980px){
  .grid{grid-template-columns:1fr}
  .cards{grid-template-columns:1fr 1fr}
  .split{grid-template-columns:1fr}
  .slider{height:320px}
  .hero-title{font-size:34px}
}
@media (max-width: 560px){
  .nav-links{display:none}
  .cards{grid-template-columns:1fr}
  .countdown{grid-template-columns: repeat(2, 1fr)}
  .slider{height:280px}
}