:root{
  --bg:#070200;
  --bg2:#140702;
  --panel:rgba(20,8,3,.78);
  --panel-2:rgba(255,255,255,.06);
  --border:rgba(255,214,170,.22);
  --gold:#f28a35;
  --gold-2:#ffb870;
  --gold-3:#ffe0b9;
  --text:#fff7ef;
  --muted:#f2c9a2;
  --shadow:0 24px 65px rgba(0,0,0,.48);
}
*{box-sizing:border-box;margin:0;padding:0}
html,body{min-height:100%}
body{
  font-family:Poppins,system-ui,-apple-system,Segoe UI,sans-serif;
  color:var(--text);
  background:
    radial-gradient(circle at 20% 20%, rgba(242,138,53,.2), transparent 30%),
    radial-gradient(circle at 80% 15%, rgba(255,184,112,.12), transparent 26%),
    linear-gradient(180deg,#040100 0%, #0b0301 40%, #100401 100%);
  overflow-x:hidden;
}
.ambient,.grain,.silk-lines{position:fixed;inset:0;pointer-events:none}
.ambient{filter:blur(28px);opacity:.55;z-index:-4;animation:floatBg 14s ease-in-out infinite alternate}
.ambient-a{background:radial-gradient(circle, rgba(242,138,53,.25), transparent 55%);top:-10%;left:-10%;width:45vw;height:45vw}
.ambient-b{background:radial-gradient(circle, rgba(255,224,185,.14), transparent 55%);right:-5%;top:8%;width:32vw;height:32vw;animation-duration:18s}
.ambient-c{background:radial-gradient(circle, rgba(188,67,21,.2), transparent 55%);left:25%;bottom:-12%;width:38vw;height:38vw;animation-duration:20s}
.silk-lines{
  z-index:-3;
  opacity:.35;
  background:
    radial-gradient(circle at 20% 20%, transparent 0 58%, rgba(242,138,53,.12) 59% 60%, transparent 61%),
    radial-gradient(circle at 80% 70%, transparent 0 56%, rgba(255,224,185,.08) 57% 58%, transparent 59%);
  animation:rotateAura 22s linear infinite;
}
.grain{z-index:-2;opacity:.08;background-image:radial-gradient(circle, #fff 0 1px, transparent 1.2px);background-size:14px 14px}

.app-shell{
  min-height:100svh;
  display:grid;
  place-items:center;
  padding:18px;
}
.phone-ui{
  width:min(100%,460px);
  position:relative;
  background:linear-gradient(180deg,rgba(27,10,4,.9),rgba(10,4,2,.98));
  border:1px solid rgba(255,255,255,.05);
  border-radius:36px;
  padding:14px 14px 92px;
  box-shadow:0 26px 90px rgba(0,0,0,.56), inset 0 1px 0 rgba(255,255,255,.06);
  overflow:hidden;
  isolation:isolate;
}
.phone-ui::before{
  content:"";
  position:absolute;
  inset:0;
  border-radius:36px;
  border:1px solid rgba(255,222,190,.12);
  pointer-events:none;
}
.phone-glow{
  position:absolute;
  inset:-15% -20% auto;
  height:250px;
  background:radial-gradient(circle at 50% 0%, rgba(242,138,53,.18), transparent 60%);
  filter:blur(18px);
  z-index:-1;
}
.app-topbar{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin-bottom:14px;
}
.app-badge{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:9px 14px;
  border-radius:999px;
  font-size:12px;
  font-weight:700;
  color:var(--gold-3);
  background:rgba(255,255,255,.06);
  border:1px solid rgba(255,222,190,.12);
  box-shadow:inset 0 0 20px rgba(255,255,255,.03);
}
.signal-dots{display:flex;gap:6px}
.signal-dots i{width:8px;height:8px;border-radius:50%;display:block;background:linear-gradient(135deg,var(--gold),var(--gold-2));box-shadow:0 0 14px rgba(242,138,53,.45);animation:blinkDot 2s ease-in-out infinite}
.signal-dots i:nth-child(2){animation-delay:.35s}
.signal-dots i:nth-child(3){animation-delay:.7s}

.hero-panel,.widget{
  position:relative;
  border-radius:30px;
  background:linear-gradient(180deg,rgba(255,255,255,.065),rgba(255,255,255,.03));
  border:1px solid var(--border);
  box-shadow:var(--shadow);
  backdrop-filter:blur(16px);
  overflow:hidden;
}
.hero-panel{
  padding:24px 18px 20px;
  text-align:center;
  margin-bottom:14px;
}
.hero-panel::before,.widget::before{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(130deg,transparent,rgba(255,255,255,.05),transparent 70%);
  transform:translateX(-100%);
  animation:shine 7s linear infinite;
  pointer-events:none;
}
.hero-shine{
  position:absolute;
  inset:auto auto 18% -18%;
  width:180px;height:180px;border-radius:50%;
  background:radial-gradient(circle, rgba(255,224,185,.18), transparent 66%);
  filter:blur(8px);
}
.widget{padding:18px 16px;margin-bottom:14px}
.orb{position:absolute;border-radius:50%;filter:blur(2px);opacity:.7;pointer-events:none}
.orb-1{width:110px;height:110px;left:-10px;top:-24px;background:radial-gradient(circle at 30% 30%, rgba(255,224,185,.45), rgba(242,138,53,.06) 65%, transparent 72%);animation:orbFloat 8s ease-in-out infinite}
.orb-2{width:150px;height:150px;right:-25px;bottom:-40px;background:radial-gradient(circle at 30% 30%, rgba(242,138,53,.28), rgba(255,184,112,.05) 65%, transparent 74%);animation:orbFloat 10s ease-in-out infinite reverse}

.logo-stage{position:relative;width:150px;height:150px;margin:0 auto 16px;display:grid;place-items:center}
.pulse-ring{
  position:absolute;
  inset:0;
  border-radius:50%;
  border:1px solid rgba(255,224,185,.35);
  animation:pulseRing 3.6s ease-out infinite;
}
.ring-2{animation-delay:1.1s}
.ring-3{animation-delay:2.2s}
.brand-logo{
  width:120px;height:120px;object-fit:cover;border-radius:50%;
  border:1px solid rgba(255,224,185,.28);
  box-shadow:0 0 40px rgba(242,138,53,.32), inset 0 0 0 2px rgba(255,255,255,.05);
  position:relative;z-index:2;animation:logoFloat 4.5s ease-in-out infinite;
}
.eyebrow{
  font-size:11px;
  font-weight:800;
  letter-spacing:3px;
  text-transform:uppercase;
  color:var(--gold-3);
  margin-bottom:10px;
}
.logo-wordmark{
  font-family:Cinzel,serif;
  font-size:clamp(42px,12vw,62px);
  line-height:.95;
  color:var(--gold);
  text-shadow:0 0 26px rgba(242,138,53,.35);
  position:relative;
}
.logo-wordmark::after{
  content:"";
  position:absolute;
  left:18%;right:18%;bottom:-8px;height:2px;
  background:linear-gradient(90deg,transparent,rgba(255,224,185,.75),transparent);
}
h2{
  margin-top:16px;
  font-family:"Noto Serif Bengali",serif;
  font-size:clamp(18px,5vw,27px);
  line-height:1.35;
}
.luxury-divider{
  display:flex;align-items:center;justify-content:center;gap:10px;
  margin:16px 0 14px;
  color:var(--gold-3);
}
.luxury-divider span{width:70px;height:1px;background:linear-gradient(90deg,transparent,rgba(255,224,185,.6),transparent)}
.luxury-divider i{font-style:normal;font-size:12px;opacity:.9}
.mini-status{display:flex;flex-wrap:wrap;gap:8px;justify-content:center}
.mini-status span{
  font-size:11px;
  padding:8px 12px;
  border-radius:999px;
  color:#ffe4c7;
  background:rgba(242,138,53,.12);
  border:1px solid rgba(255,184,112,.18);
  box-shadow:inset 0 0 12px rgba(255,255,255,.02);
}
.widget-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:16px}
.widget-head.compact{margin-bottom:14px}
.widget-label{font-size:11px;font-weight:700;letter-spacing:2px;text-transform:uppercase;color:var(--gold-3);margin-bottom:4px}
.widget-head h3{font-size:18px;line-height:1.3}
.live-pill{
  padding:8px 12px;
  font-size:11px;
  font-weight:800;
  letter-spacing:1.2px;
  border-radius:999px;
  color:#2e1002;
  background:linear-gradient(135deg,var(--gold),var(--gold-2));
  box-shadow:0 10px 26px rgba(242,138,53,.25);
  white-space:nowrap;
  animation:softPulse 2.4s ease-in-out infinite;
}
.countdown-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px;
}
.time-box{
  position:relative;
  text-align:center;
  padding:18px 8px;
  border-radius:22px;
  background:linear-gradient(180deg,rgba(255,255,255,.08),rgba(255,255,255,.03));
  border:1px solid rgba(255,224,185,.16);
  box-shadow:inset 0 0 24px rgba(242,138,53,.07);
  transition:transform .35s ease, box-shadow .35s ease, border-color .35s ease;
}
.time-box.active,
.time-box.flash{
  transform:translateY(-2px) scale(1.02);
  border-color:rgba(255,224,185,.36);
  box-shadow:inset 0 0 28px rgba(242,138,53,.18), 0 0 18px rgba(242,138,53,.16);
}
.time-box strong{display:block;font-family:Cinzel,serif;font-size:clamp(34px,10vw,42px);line-height:1;color:var(--gold-3)}
.time-box span{display:block;margin-top:8px;font-size:12px;text-transform:uppercase;letter-spacing:1.3px;color:var(--muted)}
.progress-widget{margin-top:14px}
.progress-track{height:10px;border-radius:999px;background:rgba(255,255,255,.08);overflow:hidden;border:1px solid rgba(255,224,185,.12)}
.progress-track span{display:block;height:100%;width:0%;border-radius:999px;background:linear-gradient(90deg,var(--gold),var(--gold-2),var(--gold-3));box-shadow:0 0 20px rgba(242,138,53,.35);transition:width .8s ease}
.progress-meta{display:flex;justify-content:space-between;gap:10px;margin-top:8px;color:var(--muted);font-size:11px}
.launch-text{margin-top:14px;color:#ffe6cc;line-height:1.65;font-size:14px}
.action-grid{display:grid;gap:12px}
.action-card{
  display:flex;align-items:center;gap:12px;text-decoration:none;color:var(--text);
  padding:14px 14px;border-radius:20px;
  background:linear-gradient(180deg,rgba(255,255,255,.05),rgba(255,255,255,.03));
  border:1px solid rgba(255,224,185,.14);transition:transform .25s ease, border-color .25s ease, background .25s ease, box-shadow .25s ease;
}
.action-card:hover{transform:translateY(-3px);border-color:rgba(255,224,185,.25);box-shadow:0 14px 28px rgba(0,0,0,.18)}
.action-card strong{display:block;font-size:15px}
.action-card small{display:block;margin-top:2px;color:var(--muted);font-size:12px}
.icon-circle{
  flex:0 0 46px;width:46px;height:46px;border-radius:14px;display:grid;place-items:center;
  font-size:20px;font-weight:800;color:#2d1002;
  background:linear-gradient(135deg,var(--gold),var(--gold-2));
  box-shadow:0 12px 28px rgba(242,138,53,.24);
}
.whatsapp .icon-circle{font-size:18px}
.facebook .icon-circle{font-family:Georgia,serif;font-size:24px}
.youtube .icon-circle{font-size:18px}
.notify-form{display:flex;flex-direction:column;gap:10px}
.notify-form input{
  width:100%;
  border:1px solid rgba(255,224,185,.2);
  border-radius:18px;
  padding:15px 16px;
  background:rgba(0,0,0,.22);
  color:var(--text);
  outline:none;
}
.notify-form input:focus{border-color:rgba(255,224,185,.42);box-shadow:0 0 0 4px rgba(242,138,53,.08)}
.notify-form button{
  border:none;
  border-radius:18px;
  padding:15px 18px;
  cursor:pointer;
  font-weight:800;
  color:#2a1002;
  background:linear-gradient(135deg,var(--gold),var(--gold-2),var(--gold-3));
  box-shadow:0 12px 30px rgba(242,138,53,.24);
  transition:transform .25s ease, filter .25s ease;
}
.notify-form button:hover{transform:translateY(-2px);filter:brightness(1.05)}
.form-msg{display:block;min-height:20px;margin-top:8px;color:var(--gold-3);font-size:12px}
.bottom-dock{
  position:absolute;
  left:14px;right:14px;bottom:14px;
  display:grid;grid-template-columns:repeat(3,1fr);gap:10px;
  padding:10px;
  border-radius:22px;
  background:rgba(10,3,1,.86);
  border:1px solid rgba(255,224,185,.12);
  box-shadow:0 14px 32px rgba(0,0,0,.42);
  backdrop-filter:blur(14px);
}
.bottom-dock a{
  text-decoration:none;color:var(--text);display:grid;place-items:center;gap:4px;padding:8px;border-radius:16px;background:rgba(255,255,255,.03);transition:transform .25s ease, background .25s ease
}
.bottom-dock a:hover{transform:translateY(-2px);background:rgba(255,255,255,.05)}
.bottom-dock span{font-size:18px}
.bottom-dock small{font-size:11px;color:var(--muted)}
.reveal{opacity:0;transform:translateY(22px) scale(.98);animation:revealUp .8s ease forwards}
.reveal-1{animation-delay:.05s}.reveal-2{animation-delay:.12s}.reveal-3{animation-delay:.24s}.reveal-4{animation-delay:.36s}.reveal-5{animation-delay:.48s}.reveal-6{animation-delay:.6s}

@keyframes pulseRing{
  0%{transform:scale(.78);opacity:0}
  20%{opacity:.55}
  100%{transform:scale(1.22);opacity:0}
}
@keyframes logoFloat{50%{transform:translateY(-6px)}}
@keyframes shine{to{transform:translateX(100%)}}
@keyframes floatBg{to{transform:translate3d(30px,-20px,0) scale(1.08)}}
@keyframes orbFloat{50%{transform:translateY(-10px) translateX(8px)}}
@keyframes rotateAura{to{transform:rotate(360deg)}}
@keyframes blinkDot{50%{transform:translateY(-1px) scale(1.12);opacity:.65}}
@keyframes softPulse{50%{box-shadow:0 0 0 8px rgba(242,138,53,.04), 0 10px 26px rgba(242,138,53,.25)}}
@keyframes revealUp{to{opacity:1;transform:none}}

@media (min-width:768px){
  .app-shell{padding:28px}
  .phone-ui{width:min(100%,520px);padding:18px 18px 96px}
  .hero-panel{padding:28px 22px 22px}
  .widget{padding:20px 18px}
  .countdown-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
  .notify-form{flex-direction:row}
  .notify-form button{min-width:152px}
}

@media (max-width:370px){
  .phone-ui{border-radius:28px;padding:12px 12px 88px}
  .phone-ui::before{border-radius:28px}
  .hero-panel,.widget{border-radius:24px}
  .countdown-grid{grid-template-columns:1fr 1fr;gap:10px}
  .widget-head{flex-direction:column}
  .live-pill{align-self:flex-start}
  .action-card{padding:12px}
  .luxury-divider span{width:42px}
}