/* ═════════ LAUNCH PAGE — tokens ═════════ */
:root{
  --bg:#080A1F; --bg2:#0D1030; --card:#151A3D; --card2:#1C2250;
  --txt:#FFFFFF; --mut:#A6ADD6; --dim:#767DA6;
  --line:rgba(255,255,255,.11); --line2:rgba(255,255,255,.22);
  --vi:#8B5CF6; --pk:#EC4899; --or:#FF7A18; --am:#FFB800; --gold:#FFD700;
  --gr:#22C55E; --rd:#F43F5E; --cy:#22D3EE;
  --g-cta:linear-gradient(96deg,#FF7A18,#FFB800);
  --g-vi:linear-gradient(96deg,#8B5CF6,#EC4899);
  --g-cy:linear-gradient(96deg,#22D3EE,#8B5CF6);
  --g-gr:linear-gradient(96deg,#22C55E,#14B8A6);
  --sh:0 20px 54px rgba(0,0,0,.45);
  --glow:0 12px 38px rgba(255,122,24,.42);
  --fd:'Poppins','Anek Bangla',system-ui,sans-serif;
  --fb:'Inter','Anek Bangla',system-ui,sans-serif;
}
html[data-theme="light"]{
  --bg:#FFFFFF; --bg2:#F3F5FF; --card:#FFFFFF; --card2:#F7F8FF;
  --txt:#0C1030; --mut:#565E8A; --dim:#8A90B5;
  --line:rgba(12,16,48,.10); --line2:rgba(12,16,48,.18);
  --sh:0 16px 44px rgba(20,24,70,.10);
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{background:var(--bg);color:var(--txt);font-family:var(--fb);font-size:16.5px;line-height:1.7;-webkit-font-smoothing:antialiased;transition:background .3s,color .3s;overflow-x:hidden}
img,svg{display:block}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:none;cursor:pointer}
:focus-visible{outline:3px solid var(--am);outline-offset:3px;border-radius:8px}
::selection{background:var(--or);color:#fff}
.skip{position:absolute;left:-999px;background:var(--or);color:#fff;padding:.6rem 1rem;z-index:400;font-weight:700}
.skip:focus{left:12px;top:12px}

/* ── layout ── */
.wrap{max-width:1180px;margin:0 auto;padding:0 22px}
.narrow{max-width:900px;margin:0 auto}
.sec{padding:84px 0;position:relative}
.sec.alt{background:var(--bg2)}
.sec.tight{padding:56px 0}
.ctr{text-align:center}
.g2,.g3,.g4{display:grid;gap:22px}
.g2{grid-template-columns:repeat(2,1fr)}
.g3{grid-template-columns:repeat(3,1fr)}
.g4{grid-template-columns:repeat(4,1fr)}
@media(max-width:980px){.g3,.g4{grid-template-columns:repeat(2,1fr)}}
@media(max-width:640px){.g2,.g3,.g4{grid-template-columns:1fr}}
/* ambient glows */
.glow-a,.glow-b{position:absolute;border-radius:50%;filter:blur(90px);pointer-events:none;z-index:0}
.glow-a{width:420px;height:420px;background:rgba(139,92,246,.30);top:-120px;left:-100px}
.glow-b{width:380px;height:380px;background:rgba(255,122,24,.22);bottom:-140px;right:-90px}
html[data-theme="light"] .glow-a{background:rgba(139,92,246,.16)}
html[data-theme="light"] .glow-b{background:rgba(255,122,24,.14)}
.sec>.wrap{position:relative;z-index:1}

/* ── type ── */
h1,h2,h3,h4{font-family:var(--fd);font-weight:800;line-height:1.14;letter-spacing:-.02em}
.h1{font-size:clamp(2.15rem,5.4vw,3.85rem);font-weight:900;line-height:1.08}
.h2{font-size:clamp(1.75rem,3.7vw,2.75rem);font-weight:800;margin-bottom:14px}
.h3{font-size:1.16rem;font-weight:700;line-height:1.35}
html[data-lang="bn"] .h1,html[data-lang="bn"] .h2{line-height:1.32;letter-spacing:0}
.lead{color:var(--mut);font-size:1.1rem;max-width:660px}
.ctr .lead,.ctr .narrow{margin-left:auto;margin-right:auto}
.mut{color:var(--mut)}
.mk{background:linear-gradient(transparent 60%,rgba(255,215,0,.55) 60%);padding:0 .12em}
html[data-theme="light"] .mk{background:linear-gradient(transparent 60%,rgba(255,184,0,.55) 60%)}
.grad{background:var(--g-cta);-webkit-background-clip:text;background-clip:text;color:transparent}
.gradv{background:var(--g-vi);-webkit-background-clip:text;background-clip:text;color:transparent}
.eyebrow{font-family:var(--fd);font-weight:700;font-size:.86rem;letter-spacing:.06em;text-transform:uppercase;color:var(--am);margin-bottom:14px;display:block}
html[data-lang="bn"] .eyebrow{text-transform:none;letter-spacing:0}

/* ── pills & badges ── */
.pill{display:inline-flex;align-items:center;gap:.5rem;border:1px solid var(--line2);background:var(--card);border-radius:999px;padding:.42rem 1rem;font-size:.8rem;font-weight:600;color:var(--mut)}
.pill .dot{width:7px;height:7px;border-radius:50%;background:var(--gr);box-shadow:0 0 0 4px rgba(34,197,94,.22);animation:blink 1.8s infinite}
@keyframes blink{50%{opacity:.35}}
.pill.hot{border-color:transparent;background:var(--g-vi);color:#fff}
.ribbon{position:absolute;top:-14px;left:50%;transform:translateX(-50%);background:var(--g-cta);color:#2A1400;font-family:var(--fd);font-weight:800;font-size:.72rem;letter-spacing:.08em;text-transform:uppercase;padding:.34rem 1rem;border-radius:999px;white-space:nowrap;box-shadow:var(--glow)}
.tagb{font-family:var(--fd);font-weight:700;font-size:.68rem;letter-spacing:.08em;text-transform:uppercase;padding:.24rem .6rem;border-radius:6px;display:inline-block}
.tb-vi{background:rgba(139,92,246,.18);color:#B79BFF}
.tb-or{background:rgba(255,122,24,.18);color:#FFA85C}
.tb-gr{background:rgba(34,197,94,.18);color:#6EE7A5}
.tb-cy{background:rgba(34,211,238,.18);color:#67E8F9}
html[data-theme="light"] .tb-vi{color:#6D28D9}html[data-theme="light"] .tb-or{color:#C2410C}
html[data-theme="light"] .tb-gr{color:#047857}html[data-theme="light"] .tb-cy{color:#0E7490}
.stars{color:var(--am);letter-spacing:.12em;font-size:.95rem}

/* ── buttons ── */
.cta{display:inline-flex;align-items:center;justify-content:center;gap:.6rem;font-family:var(--fd);font-weight:800;font-size:1rem;padding:1.05rem 2.1rem;border-radius:999px;background:var(--g-cta);color:#2A1400;box-shadow:var(--glow);transition:transform .2s,box-shadow .2s;text-align:center}
.cta:hover{transform:translateY(-3px);box-shadow:0 18px 46px rgba(255,122,24,.55)}
.cta.pulse{animation:pulse 2.6s infinite}
@keyframes pulse{0%,100%{box-shadow:var(--glow)}50%{box-shadow:0 12px 46px rgba(255,184,0,.72)}}
.cta.v{background:var(--g-vi);color:#fff;box-shadow:0 12px 38px rgba(139,92,246,.45)}
.cta.v:hover{box-shadow:0 18px 46px rgba(236,72,153,.5)}
.cta.g{background:var(--g-gr);color:#03291C;box-shadow:0 12px 38px rgba(34,197,94,.4)}
.cta.ghost{background:transparent;border:2px solid var(--line2);color:var(--txt);box-shadow:none}
.cta.ghost:hover{border-color:var(--am);color:var(--am)}
.cta.sm{padding:.7rem 1.4rem;font-size:.86rem}
.btn-row{display:flex;gap:14px;flex-wrap:wrap}
.ctr .btn-row{justify-content:center}
.sub-cta{font-size:.82rem;color:var(--dim);margin-top:12px;display:flex;gap:1rem;flex-wrap:wrap;justify-content:center}
.sub-cta span{display:inline-flex;align-items:center;gap:.35rem}

/* ── cards ── */
.card{background:var(--card);border:1px solid var(--line);border-radius:20px;padding:28px;box-shadow:var(--sh);transition:transform .25s,border-color .25s}
.card:hover{transform:translateY(-5px);border-color:var(--line2)}
.card.hot{border-color:var(--am);box-shadow:0 0 0 2px var(--am),var(--sh)}
.icon-tile{width:52px;height:52px;border-radius:15px;display:grid;place-items:center;margin-bottom:16px;color:#fff}
.it-vi{background:var(--g-vi)}.it-or{background:var(--g-cta);color:#2A1400}.it-cy{background:var(--g-cy)}.it-gr{background:var(--g-gr);color:#03291C}
.checks{list-style:none;display:grid;gap:.6rem;margin-top:16px}
.checks li{padding-left:1.9rem;position:relative;color:var(--mut);font-size:.95rem}
.checks li::before{content:"✓";position:absolute;left:0;top:0;width:20px;height:20px;border-radius:50%;background:rgba(34,197,94,.18);color:var(--gr);font-size:.72rem;font-weight:800;display:grid;place-items:center;margin-top:.28em}
.crosses{list-style:none;display:grid;gap:.6rem;margin-top:16px}
.crosses li{padding-left:1.9rem;position:relative;color:var(--mut);font-size:.95rem}
.crosses li::before{content:"✕";position:absolute;left:0;top:0;width:20px;height:20px;border-radius:50%;background:rgba(244,63,94,.18);color:var(--rd);font-size:.7rem;font-weight:800;display:grid;place-items:center;margin-top:.28em}
.price{font-family:var(--fd);font-weight:900;font-size:2.4rem;line-height:1;letter-spacing:-.03em}
.strike{color:var(--dim);text-decoration:line-through;font-weight:600;font-size:1.05rem}
.reveal{opacity:0;transform:translateY(24px);transition:opacity .6s ease,transform .6s ease}
.reveal.in{opacity:1;transform:none}


/* ===== block boundary ===== */


/* ── flash bar + countdown ── */
.flash{background:var(--g-vi);color:#fff;text-align:center;padding:.55rem 12px;font-size:.86rem;font-weight:600;display:flex;align-items:center;justify-content:center;gap:.9rem;flex-wrap:wrap}
.flash b{font-family:var(--fd);font-weight:800}
.cdown{display:inline-flex;gap:5px}
.cdown i{background:rgba(0,0,0,.28);border-radius:7px;padding:.12rem .42rem;font-style:normal;font-family:var(--fd);font-weight:800;font-size:.84rem;min-width:32px;text-align:center}
.cdown i small{display:block;font-size:.5rem;font-weight:600;opacity:.75;letter-spacing:.06em}

/* ── nav ── */
.nav{position:sticky;top:0;z-index:100;background:color-mix(in srgb,var(--bg) 88%,transparent);backdrop-filter:blur(14px);border-bottom:1px solid var(--line)}
.nav-in{max-width:1280px;margin:0 auto;padding:0 20px;height:68px;display:flex;align-items:center;gap:14px}
.logo{display:flex;align-items:center;gap:.55rem;font-family:var(--fd);font-weight:800;font-size:1.1rem;letter-spacing:-.01em}
.logo svg{width:34px;height:34px;border-radius:10px}
.links{display:flex;gap:2px;margin-left:auto}
.links a{font-size:.83rem;font-weight:600;padding:.5rem .62rem;border-radius:9px;color:var(--mut);transition:.2s;white-space:nowrap}
.links a:hover{color:var(--txt);background:var(--card)}
.links a.on{color:var(--txt);background:var(--card);box-shadow:inset 0 -2px 0 var(--or)}
.ctl{display:flex;align-items:center;gap:8px;margin-left:auto}
.links+.ctl{margin-left:10px}
.sw{border:1px solid var(--line2);border-radius:9px;padding:.42rem .6rem;font-size:.76rem;font-weight:700;color:var(--mut);transition:.2s}
.sw:hover{color:var(--txt);border-color:var(--am)}
.lang{display:flex;border:1px solid var(--line2);border-radius:9px;overflow:hidden}
.lang button{font-size:.74rem;font-weight:700;padding:.42rem .55rem;color:var(--mut)}
.lang button.on{background:var(--g-cta);color:#2A1400}
.burger{display:none;flex-direction:column;gap:4.5px;padding:8px}
.burger span{width:21px;height:2.5px;background:var(--txt);border-radius:3px}
@media(max-width:1180px){.links{display:none}.burger{display:flex}}
.mm{position:fixed;inset:0;z-index:200;background:var(--bg);display:none;flex-direction:column;padding:24px;overflow:auto}
.mm.open{display:flex}
.mm-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}
.mm a{display:flex;justify-content:space-between;align-items:center;padding:.85rem .3rem;border-bottom:1px solid var(--line);font-family:var(--fd);font-weight:700;font-size:1.2rem}
.mm a small{font-size:.72rem;color:var(--dim);font-weight:600}
.mm-foot{margin-top:auto;padding-top:22px;display:flex;gap:10px;align-items:center}

/* ── hero ── */
.hero{padding:56px 0 40px;position:relative;overflow:hidden}
.hero-in{position:relative;z-index:1}
.bullets{display:flex;gap:1.5rem;flex-wrap:wrap;justify-content:center;margin-bottom:22px}
.bullets span{display:inline-flex;align-items:center;gap:.4rem;font-size:.86rem;font-weight:600;color:var(--mut)}
.bullets b{color:var(--gr);font-size:1rem}
.hero .h1{max-width:960px;margin:0 auto 18px}
.arrow-down{display:grid;place-items:center;margin:28px 0 0;color:var(--am);animation:bob 1.9s ease-in-out infinite}
@keyframes bob{50%{transform:translateY(9px)}}

/* ── AI demo window ── */
.demo{max-width:840px;margin:40px auto 0;border-radius:18px;overflow:hidden;border:1px solid var(--line2);background:var(--card);box-shadow:0 30px 70px rgba(0,0,0,.5)}
html[data-theme="light"] .demo{box-shadow:0 26px 60px rgba(20,24,70,.16)}
.dbar{display:flex;align-items:center;gap:7px;padding:.7rem 1rem;background:var(--card2);border-bottom:1px solid var(--line)}
.dbar i{width:11px;height:11px;border-radius:50%;background:var(--dim);opacity:.6}
.dbar i:nth-child(1){background:#FF5F57}.dbar i:nth-child(2){background:#FEBC2E}.dbar i:nth-child(3){background:#28C840}
.durl{margin-left:12px;font-size:.74rem;color:var(--dim);background:var(--bg2);border-radius:7px;padding:.2rem .7rem;flex:1;max-width:340px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.dbody{padding:22px;min-height:290px}
.dprompt{display:flex;align-items:center;gap:.6rem;background:var(--bg2);border:1px solid var(--line);border-radius:12px;padding:.7rem 1rem;font-size:.9rem;color:var(--mut);margin-bottom:20px}
.dprompt .sparkle{color:var(--am)}
.dtype{overflow:hidden;white-space:nowrap;border-right:2px solid var(--or);animation:type 3.4s steps(46) infinite}
@keyframes type{0%{width:0}45%,100%{width:26ch}}
.dwire{display:grid;gap:10px}
.dblk{background:var(--card2);border-radius:9px;animation:pop .5s ease backwards;animation-delay:var(--d)}
html[data-theme="light"] .dblk{background:#EDF0FB}
@keyframes pop{from{opacity:0;transform:translateY(10px) scale(.97)}}
.dblk.hd{height:38px;background:var(--g-vi)}
.dblk.t1{height:22px;width:72%}
.dblk.t2{height:14px;width:90%}
.dblk.t3{height:14px;width:60%}
.drow{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:6px}
.dblk.cd{height:66px}
.dblk.btn{height:34px;width:150px;background:var(--g-cta);margin-top:6px}
.dstat{display:flex;align-items:center;gap:.5rem;font-size:.78rem;color:var(--gr);font-weight:700;margin-top:16px;animation:pop .5s ease backwards;animation-delay:1.5s}

/* ── steps ── */
.step{position:relative;padding-top:20px}
.step .num{font-family:var(--fd);font-weight:900;font-size:3.2rem;line-height:1;background:var(--g-cta);-webkit-background-clip:text;background-clip:text;color:transparent;opacity:.95}
.step h3{margin:6px 0 8px}

/* ── niche marquee ── */
.mq{overflow:hidden;position:relative;padding:6px 0;-webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.mq-in{display:flex;gap:10px;width:max-content;animation:slide 46s linear infinite}
.mq.rev .mq-in{animation-direction:reverse;animation-duration:54s}
.mq:hover .mq-in{animation-play-state:paused}
@keyframes slide{to{transform:translateX(-50%)}}
.nchip{border:1px solid var(--line);background:var(--card);border-radius:999px;padding:.5rem 1.05rem;font-size:.86rem;font-weight:600;color:var(--mut);white-space:nowrap}
.nchip:hover{border-color:var(--am);color:var(--txt)}

/* ── feature rows ── */
.frow{display:grid;grid-template-columns:88px 1fr;gap:22px;padding:26px 0;border-bottom:1px solid var(--line);align-items:start}
.frow:last-child{border-bottom:none}
.fnum{font-family:var(--fd);font-weight:900;font-size:2.1rem;color:transparent;-webkit-text-stroke:1.5px var(--line2);line-height:1}
.frow.on .fnum{-webkit-text-stroke:1.5px var(--or);color:transparent}
@media(max-width:640px){.frow{grid-template-columns:1fr;gap:8px}}

/* ── compare ── */
.cmp{border-radius:20px;padding:30px;border:2px solid}
.cmp.bad{border-color:rgba(244,63,94,.4);background:rgba(244,63,94,.06)}
.cmp.good{border-color:var(--gr);background:rgba(34,197,94,.07)}
.cmp h3{margin-bottom:6px}
.cmp .tot{font-family:var(--fd);font-weight:900;font-size:1.5rem;margin-top:18px;padding-top:16px;border-top:1px dashed var(--line2)}
.cmp.bad .tot{color:var(--rd)}.cmp.good .tot{color:var(--gr)}

/* ── pricing ── */
.plan{position:relative;display:flex;flex-direction:column;gap:10px}
.plan .price-row{display:flex;align-items:baseline;gap:.6rem;flex-wrap:wrap}
.save{background:rgba(34,197,94,.18);color:var(--gr);font-family:var(--fd);font-weight:800;font-size:.72rem;padding:.2rem .55rem;border-radius:6px}
.guar{max-width:820px;margin:0 auto;display:flex;gap:26px;align-items:center;flex-wrap:wrap;justify-content:center;text-align:left}
.seal{width:132px;height:132px;min-width:132px;border-radius:50%;background:var(--g-cta);display:grid;place-items:center;text-align:center;color:#2A1400;font-family:var(--fd);font-weight:900;line-height:1.1;box-shadow:var(--glow);padding:14px}
.seal span{font-size:1.9rem;display:block}
.seal small{font-size:.62rem;letter-spacing:.08em;text-transform:uppercase;font-weight:700}

/* ── tables / faq / forms ── */
.tw{overflow-x:auto;border:1px solid var(--line);border-radius:18px;background:var(--card)}
table{width:100%;border-collapse:collapse;min-width:660px}
th,td{padding:14px 18px;text-align:left;border-bottom:1px solid var(--line);font-size:.92rem}
th{font-family:var(--fd);font-size:.76rem;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:var(--dim)}
tr:last-child td{border-bottom:none}
td .y{color:var(--gr);font-weight:800}td .n{color:var(--dim)}
details.q{border:1px solid var(--line);background:var(--card);border-radius:14px;margin-bottom:12px;overflow:hidden}
details.q summary{list-style:none;cursor:pointer;padding:18px 22px;font-family:var(--fd);font-weight:700;font-size:1rem;display:flex;justify-content:space-between;gap:14px}
details.q summary::-webkit-details-marker{display:none}
details.q summary::after{content:"+";color:var(--am);font-size:1.4rem;line-height:1}
details.q[open] summary::after{content:"−"}
details.q .a{padding:0 22px 20px;color:var(--mut);font-size:.94rem}
.field{display:grid;gap:7px;margin-bottom:16px}
.field label{font-size:.8rem;font-weight:700;color:var(--mut)}
.field input,.field select,.field textarea{background:var(--bg2);border:1px solid var(--line2);border-radius:12px;padding:.85rem 1rem;color:var(--txt);font:inherit;font-size:.94rem}
html[data-theme="light"] .field input,html[data-theme="light"] .field select,html[data-theme="light"] .field textarea{background:#fff}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:var(--or)}
.field textarea{min-height:104px;resize:vertical}
.fg{display:grid;grid-template-columns:1fr 1fr;gap:0 16px}
@media(max-width:640px){.fg{grid-template-columns:1fr}}
.ok{display:none;text-align:center;padding:36px 20px}
.ok.show{display:block}
.ep{display:flex;align-items:center;gap:16px;padding:20px 24px;margin-bottom:12px}
.play{width:46px;height:46px;min-width:46px;border-radius:50%;background:var(--g-cta);color:#2A1400;display:grid;place-items:center;box-shadow:var(--glow);transition:transform .2s}
.play:hover{transform:scale(1.08)}
.bar{height:5px;background:var(--line);border-radius:99px;margin-top:10px;overflow:hidden}
.bar i{display:block;height:100%;width:0;background:var(--g-cta)}

/* ── footer & floats ── */
.foot{background:var(--bg2);border-top:1px solid var(--line);padding:56px 0 24px}
.f-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:28px;margin-bottom:34px}
@media(max-width:860px){.f-grid{grid-template-columns:1fr 1fr}}
@media(max-width:520px){.f-grid{grid-template-columns:1fr}}
.f-grid h4{font-size:.8rem;text-transform:uppercase;letter-spacing:.1em;color:var(--dim);margin-bottom:12px}
.f-grid a{display:block;color:var(--mut);font-size:.92rem;padding:.26rem 0}
.f-grid a:hover{color:var(--am)}
.f-bot{border-top:1px solid var(--line);padding-top:20px;color:var(--dim);font-size:.83rem;display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap}
.wa{position:fixed;right:18px;bottom:82px;z-index:90;width:56px;height:56px;border-radius:50%;background:#25D366;display:grid;place-items:center;box-shadow:0 10px 30px rgba(37,211,102,.45);transition:transform .2s}
.wa:hover{transform:scale(1.08)}
.sticky{position:fixed;left:0;right:0;bottom:0;z-index:95;background:var(--card);border-top:1px solid var(--line2);padding:.7rem 16px;display:flex;align-items:center;justify-content:space-between;gap:12px;transform:translateY(110%);transition:transform .35s;box-shadow:0 -10px 30px rgba(0,0,0,.3)}
.sticky.show{transform:none}
.sticky .st-txt{font-size:.84rem;font-weight:700;line-height:1.3}
.sticky .st-txt small{display:block;font-weight:500;color:var(--dim);font-size:.74rem}

/* ── pages ── */
.wgl-page{display:none}
.wgl-page.on{display:block;animation:fade .4s ease}
@keyframes fade{from{opacity:0;transform:translateY(10px)}}
.phead{padding:60px 0 0;text-align:center}
.wgl-search{display:flex;align-items:center;gap:10px;background:var(--card);border:1px solid var(--line2);border-radius:14px;padding:.75rem 1.1rem;max-width:440px;margin:22px auto 0}
.wgl-search input{background:none;border:none;outline:none;color:var(--txt);font:inherit;font-size:.95rem;width:100%}
.filters{display:flex;gap:10px;flex-wrap:wrap;justify-content:center;margin-top:22px}
.fb{border:1px solid var(--line2);border-radius:999px;padding:.5rem 1.15rem;font-size:.84rem;font-weight:700;color:var(--mut);transition:.2s}
.fb:hover{color:var(--txt)}
.fb.on{background:var(--g-cta);border-color:transparent;color:#2A1400}
.vert{border:1px solid var(--line);background:var(--card);border-radius:16px;margin-bottom:12px;overflow:hidden}
.vert.open{border-color:var(--am)}
.vhead{width:100%;display:flex;align-items:center;gap:14px;padding:18px 22px;text-align:left}
.vhead .h3{flex:1}
.vbody{display:grid;grid-template-rows:0fr;transition:grid-template-rows .35s ease}
.vert.open .vbody{grid-template-rows:1fr}
.vin{overflow:hidden}
.vpad{padding:0 22px 20px;display:flex;flex-wrap:wrap;gap:8px}
.varw{transition:transform .3s;color:var(--mut)}
.vert.open .varw{transform:rotate(180deg);color:var(--am)}
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms !important;animation-iteration-count:1 !important;transition-duration:.01ms !important}
  .reveal{opacity:1;transform:none}
  .dtype{animation:none;width:26ch;border-right:none}
}


/* ===== block boundary ===== */


/* ═════════ POLISH PASS ═════════ */
:root{--cbA:rgba(139,92,246,.34);--cbB:rgba(255,122,24,.28);--cbC:rgba(34,211,238,.24)}
html[data-theme="light"]{--cbA:rgba(139,92,246,.22);--cbB:rgba(255,122,24,.20);--cbC:rgba(34,211,238,.16)}
html[data-theme="light"] body{background-image:radial-gradient(760px 320px at 50% -100px,rgba(139,92,246,.10),transparent)}

/* gradient hairline cards */
.card{border:1px solid transparent;background:linear-gradient(var(--card),var(--card)) padding-box,linear-gradient(155deg,var(--cbA),var(--cbB) 55%,var(--cbC)) border-box}
.card.hot{background:var(--card)}

/* eyebrow → pill */
.eyebrow{display:inline-flex;align-items:center;gap:.55rem;background:var(--card);border:1px solid var(--line);border-radius:999px;padding:.48rem 1.05rem;font-size:.76rem;letter-spacing:.05em}
.eyebrow::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--g-cta);box-shadow:0 0 10px rgba(255,122,24,.7)}

/* section dividers */
.sec.alt::before{content:"";position:absolute;top:0;left:50%;transform:translateX(-50%);width:min(640px,80%);height:1px;background:linear-gradient(90deg,transparent,var(--line2),transparent)}

/* CTA shine sweep */
.cta{position:relative;overflow:hidden}
.cta::after{content:"";position:absolute;inset:0;border-radius:inherit;background:linear-gradient(110deg,transparent 32%,rgba(255,255,255,.38) 50%,transparent 68%);transform:translateX(-130%)}
.cta:hover::after{transform:translateX(130%);transition:transform .55s ease}
.plan .cta{width:100%}

/* hero demo — gradient ring, floats, shimmer */
.demo-wrap{position:relative;max-width:840px;margin:44px auto 0}
.demo{margin:0;max-width:100%;border:1px solid transparent;background:linear-gradient(var(--card),var(--card)) padding-box,linear-gradient(140deg,rgba(139,92,246,.6),rgba(236,72,153,.35) 45%,rgba(255,122,24,.55)) border-box;box-shadow:0 40px 90px rgba(0,0,0,.5),0 0 70px rgba(139,92,246,.16)}
html[data-theme="light"] .demo{box-shadow:0 30px 70px rgba(20,24,70,.16),0 0 50px rgba(139,92,246,.10)}
.dtype{display:inline-block;max-width:100%;vertical-align:bottom}
.dprompt{min-width:0}
.dblk{position:relative;overflow:hidden}
.dblk::after{content:"";position:absolute;inset:0;background:linear-gradient(100deg,transparent 32%,rgba(255,255,255,.10) 50%,transparent 68%);transform:translateX(-130%);animation:shim 2.8s 1.9s infinite}
html[data-theme="light"] .dblk::after{background:linear-gradient(100deg,transparent 32%,rgba(12,16,48,.07) 50%,transparent 68%)}
@keyframes shim{to{transform:translateX(130%)}}
.float-b{position:absolute;z-index:2;display:flex;align-items:center;gap:.45rem;background:var(--card);border:1px solid var(--line2);border-radius:999px;padding:.5rem .95rem;font-size:.78rem;font-weight:700;box-shadow:var(--sh);animation:floaty 5.5s ease-in-out infinite}
.float-b b{color:var(--gr)}
.fb-a{top:-18px;left:-26px}
.fb-b{top:36%;right:-30px;animation-delay:1.3s}
.fb-c{bottom:-18px;left:6%;animation-delay:2.2s}
@keyframes floaty{0%,100%{transform:translateY(0)}50%{transform:translateY(-11px)}}
@media(max-width:880px){.float-b{display:none}}

/* steps connector */
@media(min-width:981px){.steps{position:relative}.steps::before{content:"";position:absolute;top:52px;left:13%;right:13%;border-top:2px dashed var(--line2)}.steps .card{position:relative}}

/* feature numerals — gradient fill */
.fnum{-webkit-text-stroke:0;color:transparent;background:var(--g-vi);-webkit-background-clip:text;background-clip:text;font-size:2.3rem}
.frow{transition:background .2s;border-radius:16px;padding-left:14px;padding-right:14px;margin:0 -14px}
.frow:hover{background:var(--card)}
.frow:hover .fnum{background:var(--g-cta);-webkit-background-clip:text;background-clip:text}

/* marquee dots, avatars, socials */
.ndot{width:7px;height:7px;border-radius:50%;display:inline-block;margin-right:.5rem;vertical-align:middle}
.ava{width:44px;height:44px;min-width:44px;border-radius:50%;display:grid;place-items:center;font-family:var(--fd);font-weight:800;font-size:.92rem}
.soc{display:flex;gap:10px;margin-top:16px}
.soc a{width:38px;height:38px;border-radius:50%;border:1px solid var(--line2);display:grid;place-items:center;color:var(--mut);transition:.2s}
.soc a:hover{color:#fff;background:var(--g-vi);border-color:transparent;transform:translateY(-3px)}

/* small screens */
@media(max-width:600px){.nav-in .cta{display:none}}


/* ===== block boundary ===== */


/* ═════════ EXPANSION PASS ═════════ */
/* dropdown nav */
.dd{position:relative}
.dd-btn{font-size:.83rem;font-weight:600;padding:.5rem .62rem;border-radius:9px;color:var(--mut);display:flex;align-items:center;gap:.3rem;transition:.2s;white-space:nowrap}
.dd-btn::after{content:"▾";font-size:.68em;opacity:.7}
.dd-btn:hover{color:var(--txt);background:var(--card)}
.dd.on .dd-btn{color:var(--txt);background:var(--card);box-shadow:inset 0 -2px 0 var(--or)}
.dd-menu{position:absolute;top:calc(100% + 10px);left:0;min-width:220px;background:var(--card);border:1px solid var(--line2);border-radius:14px;padding:8px;display:none;box-shadow:var(--sh);z-index:130}
.dd-menu a{display:block;border-radius:9px;padding:.62rem .85rem;font-size:.85rem;font-weight:600;color:var(--mut)}
.dd-menu a:hover{background:var(--bg2);color:var(--txt)}
.dd-menu a.on{color:var(--am)}
.dd:hover .dd-menu,.dd:focus-within .dd-menu,.dd.open .dd-menu{display:block}
.mm-g{font-size:.66rem;letter-spacing:.14em;text-transform:uppercase;color:var(--dim);font-weight:700;margin:16px 0 2px}
html[data-lang="bn"] .mm-g{letter-spacing:.03em;text-transform:none}
.mm a.sub{font-size:1rem;font-weight:600;padding:.55rem .3rem .55rem 1.1rem;color:var(--mut)}

/* modals */
.modal{position:fixed;inset:0;z-index:300;display:none}
.modal.open{display:grid;place-items:center;padding:18px}
.modal-bg{position:absolute;inset:0;background:rgba(4,6,20,.72);backdrop-filter:blur(5px)}
html[data-theme="light"] .modal-bg{background:rgba(20,24,60,.45)}
.modal-card{position:relative;width:min(480px,94vw);max-height:90vh;overflow:auto;background:var(--card);border-radius:22px;padding:26px;border:1px solid transparent;background:linear-gradient(var(--card),var(--card)) padding-box,linear-gradient(150deg,var(--cbA),var(--cbB) 55%,var(--cbC)) border-box;box-shadow:0 40px 90px rgba(0,0,0,.55);animation:mpop .3s ease}
@keyframes mpop{from{opacity:0;transform:translateY(18px) scale(.97)}}
.modal-x{position:absolute;top:14px;right:14px;width:34px;height:34px;border-radius:50%;border:1px solid var(--line2);color:var(--mut);display:grid;place-items:center}
.modal-x:hover{color:var(--txt);border-color:var(--am)}
.qc-fee{display:flex;justify-content:space-between;align-items:center;background:var(--bg2);border:1px dashed var(--line2);border-radius:12px;padding:.7rem 1rem;margin-bottom:16px;font-weight:700}
html[data-theme="light"] .qc-fee{background:#F3F5FF}
.qc-fee b.free{color:var(--gr)}
.stu-row{display:flex;gap:.6rem;align-items:center;font-size:.9rem;color:var(--mut);margin:-2px 0 14px;cursor:pointer}
.stu-row input{accent-color:var(--or);width:17px;height:17px}

/* calculator */
.calc{display:grid;grid-template-columns:1.55fr 1fr;gap:24px;align-items:start}
@media(max-width:900px){.calc{grid-template-columns:1fr}.sum{position:static !important}}
.selrow{display:grid;grid-template-columns:1fr 1fr;gap:14px}
@media(max-width:640px){.selrow{grid-template-columns:1fr}}
select.big{width:100%;background:var(--card);border:1px solid var(--line2);border-radius:12px;padding:.8rem 1rem;color:var(--txt);font:inherit;font-weight:600}
details.cat{border:1px solid var(--line);border-radius:14px;background:var(--card);margin-bottom:10px;overflow:hidden}
details.cat>summary{list-style:none;cursor:pointer;padding:14px 18px;font-family:var(--fd);font-weight:700;font-size:.98rem;display:flex;justify-content:space-between;align-items:center;gap:10px}
details.cat>summary::-webkit-details-marker{display:none}
details.cat>summary::after{content:"+";color:var(--am);font-size:1.2rem}
details.cat[open]>summary::after{content:"−"}
details.cat>summary small{color:var(--dim);font-weight:600;font-size:.76rem;font-family:var(--fb)}
.feat{border-top:1px solid var(--line)}
.feat-h{display:flex;align-items:center;gap:12px;padding:12px 18px;cursor:pointer}
.feat-h input{accent-color:var(--or);width:18px;height:18px;flex:none;cursor:pointer}
.feat-n{flex:1;font-weight:600;font-size:.92rem;line-height:1.35}
.feat-p{font-family:var(--fd);font-weight:800;font-size:.9rem;white-space:nowrap}
.feat-p.inc{color:var(--gr);font-size:.72rem;letter-spacing:.06em;text-transform:uppercase}
.feat-b{display:none;padding:0 18px 14px 48px;color:var(--mut);font-size:.88rem}
.feat.open .feat-b{display:block}
.demo-btn{margin-top:10px;display:inline-flex;gap:.4rem;align-items:center;font-size:.76rem;font-weight:700;color:var(--cy);border:1px solid var(--line2);border-radius:999px;padding:.35rem .85rem;transition:.2s}
.demo-btn:hover{border-color:var(--cy)}
.sum{position:sticky;top:92px}
.sum .row{display:flex;justify-content:space-between;gap:10px;font-size:.9rem;padding:.42rem 0;color:var(--mut)}
.sum .row b{color:var(--txt);font-family:var(--fd)}
.sum .tot{border-top:1px dashed var(--line2);margin-top:8px;padding-top:12px;font-family:var(--fd);font-weight:900;font-size:1.45rem;display:flex;justify-content:space-between;gap:10px}
.sum .cta{width:100%;margin-top:12px;font-size:.86rem;padding:.85rem 1rem}
.memhint{font-size:.78rem;background:rgba(34,197,94,.1);border:1px dashed var(--gr);color:var(--gr);border-radius:10px;padding:.55rem .8rem;margin-top:14px;display:block;text-align:center;font-weight:700}
.dm-frame{aspect-ratio:16/9;border-radius:14px;background:repeating-linear-gradient(45deg,var(--bg2),var(--bg2) 12px,var(--card2) 12px,var(--card2) 24px);display:grid;place-items:center;color:var(--dim);margin:14px 0;border:1px solid var(--line)}

/* shop v2 */
.toolbar{display:flex;gap:12px;flex-wrap:wrap;align-items:center;justify-content:center;margin-top:20px}
.toolbar .wgl-search{margin:0;max-width:250px;flex:1;min-width:170px}
select.sort{width:auto;padding:.62rem .9rem;font-size:.86rem}
.vt{display:flex;border:1px solid var(--line2);border-radius:10px;overflow:hidden}
.vt button{padding:.55rem .7rem;color:var(--mut);display:grid;place-items:center}
.vt button.on{background:var(--g-cta);color:#2A1400}
.pgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
@media(max-width:980px){.pgrid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:640px){.pgrid{grid-template-columns:1fr}}
.pgrid.list{grid-template-columns:1fr}
.pcard{display:flex;flex-direction:column;gap:10px}
.pgrid.list .pcard{flex-direction:row;align-items:center;gap:18px}
.pimg{height:150px;border-radius:14px;display:grid;place-items:center;font-family:var(--fd);font-weight:900;font-size:2.1rem;color:rgba(255,255,255,.92)}
.pgrid.list .pimg{height:104px;width:140px;min-width:140px;font-size:1.6rem}
.pbody{display:flex;flex-direction:column;gap:8px;flex:1}
.pfoot{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-top:auto}

/* course detail */
.cd{display:grid;grid-template-columns:1.5fr 1fr;gap:26px;align-items:start}
@media(max-width:900px){.cd{grid-template-columns:1fr}.buy{position:static !important}}
.buy{position:sticky;top:92px}
.lesson{display:flex;gap:.6rem;padding:.42rem 0;color:var(--mut);font-size:.9rem;border-bottom:1px dashed var(--line)}
.lesson:last-child{border-bottom:none}
.lesson::before{content:"▸";color:var(--am);flex:none}

/* account */
.acct{display:grid;grid-template-columns:230px 1fr;gap:22px;align-items:start}
@media(max-width:840px){.acct{grid-template-columns:1fr}}
.atabs{display:flex;flex-direction:column;gap:6px}
@media(max-width:840px){.atabs{flex-direction:row;flex-wrap:wrap}}
.atabs button{text-align:left;padding:.7rem 1rem;border-radius:10px;font-weight:700;font-size:.9rem;color:var(--mut);transition:.2s}
.atabs button:hover{color:var(--txt);background:var(--card)}
.atabs button.on{background:var(--g-vi);color:#fff}
.prog{height:8px;border-radius:99px;background:var(--line);overflow:hidden;margin-top:8px}
.prog i{display:block;height:100%;background:var(--g-cta)}


/* ===== block boundary ===== */


/* LMS lessons */
.lesson2{display:flex;align-items:center;gap:10px;padding:.6rem .2rem;border-bottom:1px dashed var(--line);font-size:.9rem;color:var(--mut)}
.lesson2:last-child{border-bottom:none}
.lic{flex:none;width:20px;text-align:center;color:var(--am)}
.lesson2.lock{opacity:.6}.lesson2.lock .lic{color:var(--dim)}
.ln{flex:1;line-height:1.4}
.ldur{font-size:.76rem;color:var(--dim);font-variant-numeric:tabular-nums;white-space:nowrap}
.lvl{font-size:.7rem;font-weight:800;letter-spacing:.05em;text-transform:uppercase}
.cprev{aspect-ratio:16/9;border-radius:16px;position:relative;overflow:hidden;background:linear-gradient(140deg,var(--card2),var(--bg2));border:1px solid var(--line2);display:grid;place-items:center;cursor:pointer;transition:.25s}
.cprev:hover{border-color:var(--am)}
.cprev .pbtn{width:66px;height:66px;border-radius:50%;background:var(--g-cta);color:#2A1400;display:grid;place-items:center;box-shadow:var(--glow);transition:transform .2s}
.cprev:hover .pbtn{transform:scale(1.1)}
.cprev small{position:absolute;bottom:12px;left:0;right:0;text-align:center;color:var(--dim);font-weight:600}
/* community feed */
.post{border-bottom:1px solid var(--line);padding:14px 0}
.post:last-child{border-bottom:none}
.post-h{display:flex;align-items:center;gap:10px;margin-bottom:8px}
.post-h .ava{width:36px;height:36px;min-width:36px;font-size:.78rem}
.post-h b{font-size:.9rem}
.post-h .mut{font-size:.74rem}
.post p{font-size:.92rem;color:var(--mut)}
.post-f{display:flex;gap:16px;margin-top:8px;font-size:.76rem;color:var(--dim);font-weight:700}
.rit{display:flex;gap:12px;align-items:center;padding:.55rem 0;border-bottom:1px dashed var(--line);font-size:.9rem}
.rit:last-child{border-bottom:none}
.rit .tagb{min-width:44px;text-align:center}
@media(max-width:900px){#pg-community .wrap[style*="grid-template-columns"]{grid-template-columns:1fr !important}}
/* admin */
.tile{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:18px}
.tile .tv{font-family:var(--fd);font-weight:900;font-size:1.6rem;margin-top:4px}
.tile .tl{font-size:.76rem;color:var(--dim);font-weight:700;text-transform:uppercase;letter-spacing:.05em}
html[data-lang="bn"] .tile .tl{text-transform:none;letter-spacing:0}
.role-demo{display:flex;gap:10px;margin-top:14px;flex-wrap:wrap}
.role-demo button{flex:1;min-width:140px;border:1px dashed var(--line2);border-radius:12px;padding:.6rem;font-size:.78rem;font-weight:700;color:var(--mut);transition:.2s}
.role-demo button:hover{color:var(--am);border-color:var(--am)}


/* ===== block boundary ===== */


.ladder{display:grid;grid-template-columns:repeat(auto-fit,minmax(216px,1fr));gap:16px;align-items:stretch}
.lad-code{font-family:var(--fd);font-weight:900;font-size:.9rem;letter-spacing:.06em;background:var(--g-vi);-webkit-background-clip:text;background-clip:text;color:transparent}
.lad-aff{font-size:.76rem;color:var(--dim);border-top:1px dashed var(--line);padding-top:10px;margin-top:4px}
.dayh{display:flex;justify-content:space-between;align-items:center;gap:10px;margin:16px 0 4px;font-family:var(--fd);font-weight:800;font-size:.95rem}
.dayh:first-child{margin-top:0}
.dayh .tagb{font-size:.62rem}


/* ==========================================================================
   WGL token re-assertion.
   BuddyBoss Platform prints an inline <style> on :root from its customizer
   palette. Inline styles beat enqueue order regardless of priority, so the
   contested tokens are re-declared here with !important. Custom properties
   do honour !important. Covers BuddyBoss's dark/light mode body classes too.
   ========================================================================== */
:root,
html[data-theme="dark"],
body.bb-dark-mode,
body.bb-dark-theme {
  --bg:#080A1F !important; --bg2:#0D1030 !important;
  --card:#151A3D !important; --card2:#1C2250 !important;
  --txt:#FFFFFF !important; --mut:#A6ADD6 !important; --dim:#767DA6 !important;
  --line:rgba(255,255,255,.11) !important; --line2:rgba(255,255,255,.22) !important;
  --vi:#8B5CF6 !important; --pk:#EC4899 !important; --or:#FF7A18 !important;
  --am:#FFB800 !important; --gold:#FFD700 !important;
  --gr:#22C55E !important; --rd:#F43F5E !important; --cy:#22D3EE !important;
  --g-cta:linear-gradient(96deg,#FF7A18,#FFB800) !important;
  --g-vi:linear-gradient(96deg,#8B5CF6,#EC4899) !important;
  --g-cy:linear-gradient(96deg,#22D3EE,#8B5CF6) !important;
  --g-gr:linear-gradient(96deg,#22C55E,#14B8A6) !important;
  --fd:'Poppins','Anek Bangla',system-ui,sans-serif !important;
  --fb:'Inter','Anek Bangla',system-ui,sans-serif !important;
}
html[data-theme="light"], html[data-theme="light"] body.bb-dark-mode {
  --bg:#FFFFFF !important; --bg2:#F3F5FF !important;
  --card:#FFFFFF !important; --card2:#F7F8FF !important;
  --txt:#0C1030 !important; --mut:#565E8A !important; --dim:#8A90B5 !important;
  --line:rgba(12,16,48,.10) !important; --line2:rgba(12,16,48,.18) !important;
}

/* On WGL pages the panel is always visible: WP serves one panel per URL,
   so the SPA's display:none default must not apply. */
body.wgl-on .wgl-page { display:block !important; }

/* WP admin bar must not sit under the fixed header. */
body.admin-bar .flash { top:32px; }
@media screen and (max-width:782px){ body.admin-bar .flash { top:46px; } }
/* === amelia dark theme === */

/* Amelia 8 renders its booking form through Element UI internals, and its own
   customization.globalColors settings never reach them (verified: inputs stayed
   #FFFFFF and the primary button #1A84EE after saving the palette). So the form
   is themed here. Both scopes are covered: the inline block on /consult/ and the
   iframed document the booking modal loads — the modal was initially unthemed
   because #wgl-book does not exist inside the iframe. */
#wgl-book .el-input__inner,
body.wgl-embed .el-input__inner,
#wgl-book .el-textarea__inner,
body.wgl-embed .el-textarea__inner,
#wgl-book .el-select .el-input__inner,
body.wgl-embed .el-select .el-input__inner {
  background:var(--card2)!important;color:var(--txt)!important;
  border:1px solid var(--line2)!important;border-radius:12px!important;
}
#wgl-book .el-input__inner::placeholder,
body.wgl-embed .el-input__inner::placeholder,
#wgl-book .el-textarea__inner::placeholder,
body.wgl-embed .el-textarea__inner::placeholder {
  color:var(--dim)!important;
}
#wgl-book .el-input__icon,
body.wgl-embed .el-input__icon,
#wgl-book .el-select__caret,
body.wgl-embed .el-select__caret { color:var(--mut)!important }
#wgl-book .el-button--primary,
body.wgl-embed .el-button--primary {
  background:var(--g-cta)!important;border:0!important;color:#0B0B18!important;
  font-weight:800!important;border-radius:999px!important;padding:12px 26px!important;
}
#wgl-book .el-button--primary:hover,
body.wgl-embed .el-button--primary:hover { filter:brightness(1.07) }
#wgl-book .el-button--default,
body.wgl-embed .el-button--default {
  background:var(--card2)!important;color:var(--txt)!important;
  border:1px solid var(--line2)!important;border-radius:999px!important;
}
#wgl-book .am-wrap,
body.wgl-embed .am-wrap,
#wgl-book [class^="am-"],
body.wgl-embed [class^="am-"],
#wgl-book [class*=" am-"],
body.wgl-embed [class*=" am-"] {
  background-color:transparent!important;color:var(--txt)!important;
}
#wgl-book label,
body.wgl-embed label,
#wgl-book .el-form-item__label,
body.wgl-embed .el-form-item__label { color:var(--mut)!important }
#wgl-book .el-scrollbar__bar,
body.wgl-embed .el-scrollbar__bar { background:transparent!important }
#wgl-book .el-scrollbar__thumb,
body.wgl-embed .el-scrollbar__thumb { background:var(--line2)!important;border-radius:999px!important }
#wgl-book .el-radio__label,
body.wgl-embed .el-radio__label,
#wgl-book .el-checkbox__label,
body.wgl-embed .el-checkbox__label { color:var(--txt)!important }
#wgl-book .el-table,
body.wgl-embed .el-table,
#wgl-book .el-table tr,
body.wgl-embed .el-table tr,
#wgl-book .el-table th,
body.wgl-embed .el-table th,
#wgl-book .el-table td,
body.wgl-embed .el-table td {
  background:transparent!important;color:var(--txt)!important;border-color:var(--line)!important;
}

/* Element UI portals dropdown + date panels onto <body>, so those cannot be
   scoped to the block — they are scoped to the WebGolok body classes instead. */
body.wgl-on .el-select-dropdown,
body.wgl-embed .el-select-dropdown,
body.wgl-on .el-picker-panel,
body.wgl-embed .el-picker-panel,
body.wgl-on .el-popper,
body.wgl-embed .el-popper{
  background:var(--card)!important;border-color:var(--line2)!important;color:var(--txt)!important;
}
body.wgl-on .el-select-dropdown__item,
body.wgl-embed .el-select-dropdown__item{ color:var(--txt)!important }
body.wgl-on .el-select-dropdown__item.hover,
body.wgl-on .el-select-dropdown__item:hover,
body.wgl-on .el-select-dropdown__item.selected,
body.wgl-embed .el-select-dropdown__item.hover,
body.wgl-embed .el-select-dropdown__item:hover,
body.wgl-embed .el-select-dropdown__item.selected{
  background:var(--card2)!important;color:var(--am)!important;
}

.no-js .reveal{opacity:1!important;transform:none!important}

/* === wgl form + chrome polish === */
/* The artifact styles .field input but native <select>/<textarea> fell back to
   browser defaults (white on dark) once rendered inside WordPress. */
body.wgl-on .field select,
body.wgl-on .field textarea,
body.wgl-on .wgl-page select,
body.wgl-on .wgl-page textarea{
  background:var(--card2);color:var(--txt);
  border:1px solid var(--line2);border-radius:12px;
  font-family:var(--fb);font-size:1rem;padding:12px 14px;width:100%;
  -webkit-appearance:none;appearance:none;
}
body.wgl-on .field select{
  background-image:linear-gradient(45deg,transparent 50%,var(--mut) 50%),
                   linear-gradient(135deg,var(--mut) 50%,transparent 50%);
  background-position:calc(100% - 20px) 50%,calc(100% - 14px) 50%;
  background-size:6px 6px,6px 6px;background-repeat:no-repeat;
}
body.wgl-on .field select option{background:var(--card);color:var(--txt)}
body.wgl-on .field textarea{min-height:110px;resize:vertical}
body.wgl-on .field select:focus,
body.wgl-on .field textarea:focus{outline:2px solid var(--am);outline-offset:2px}

/* Amelia's Element-UI scroll rail defaults to blue. */
#wgl-book .el-scrollbar__bar,
#wgl-book .el-scrollbar__wrap > .el-scrollbar__bar{background:transparent!important}
#wgl-book .el-scrollbar__thumb{background:var(--line2)!important;border-radius:999px!important}

/* TranslatePress prints a floating language switcher. The artifact header already
   carries its own EN / বাং toggle, so the duplicate floater is suppressed on
   WebGolok pages only — the language feature itself stays intact. */
body.wgl-on #trp-floater-ls,
body.wgl-on .trp-floater-ls,
body.wgl-on #trp-floater-ls-current-language,
body.wgl-on .trp-language-switcher-container{display:none!important}
/* === wgl booking modal === */
/* Booking modal. The Amelia form is iframed and only fetched on first open,
   so Amelia's bundle never loads on pages the visitor is only browsing. */
#wgl-book-modal{
  position:fixed;inset:0;z-index:99999;
  display:flex;align-items:center;justify-content:center;padding:20px;
  background:rgba(4,6,18,.80);
  -webkit-backdrop-filter:blur(7px);backdrop-filter:blur(7px);
  opacity:0;transition:opacity .22s ease;
}
#wgl-book-modal[hidden]{display:none}
#wgl-book-modal.on{opacity:1}
#wgl-book-modal .wgl-modal-panel{
  width:100%;max-width:1040px;max-height:92vh;
  display:flex;flex-direction:column;overflow:hidden;
  background:var(--card);color:var(--txt);
  border:1px solid var(--line2);border-radius:22px;
  box-shadow:0 34px 90px rgba(0,0,0,.6);
  transform:translateY(14px) scale(.985);
  transition:transform .24s cubic-bezier(.2,.8,.25,1);
}
#wgl-book-modal.on .wgl-modal-panel{transform:none}
#wgl-book-modal .wgl-modal-head{
  display:flex;align-items:flex-start;gap:16px;
  padding:22px 24px 16px;border-bottom:1px solid var(--line);
}
#wgl-book-modal .wgl-modal-head .eyebrow{margin-bottom:6px}
#wgl-book-modal .wgl-modal-title{
  font-family:var(--fd);font-weight:800;font-size:1.42rem;line-height:1.25;margin:0;
}
#wgl-book-modal .wgl-modal-sub{
  color:var(--mut);font-size:.94rem;margin:6px 0 0;line-height:1.55;
}
#wgl-book-modal .wgl-modal-close{
  margin-left:auto;flex:0 0 auto;
  width:40px;height:40px;border-radius:50%;
  display:grid;place-items:center;font-size:1.3rem;line-height:1;
  background:var(--card2);color:var(--txt);border:1px solid var(--line2);
  cursor:pointer;transition:background .2s,border-color .2s,transform .2s;
}
#wgl-book-modal .wgl-modal-close:hover{background:var(--or);border-color:var(--or);color:#0B0B18;transform:rotate(90deg)}
#wgl-book-modal .wgl-modal-body{flex:1 1 auto;overflow:auto;-webkit-overflow-scrolling:touch}
#wgl-book-modal iframe{
  display:block;width:100%;height:660px;border:0;background:transparent;
}
@media (max-width:720px){
  #wgl-book-modal{padding:0}
  #wgl-book-modal .wgl-modal-panel{max-width:none;max-height:100vh;height:100vh;border-radius:0;border:0}
  #wgl-book-modal iframe{height:calc(100vh - 118px)}
  #wgl-book-modal .wgl-modal-title{font-size:1.18rem}
}
@media (prefers-reduced-motion:reduce){
  #wgl-book-modal,#wgl-book-modal .wgl-modal-panel{transition:none}
}

/* the iframed booking document itself */
body.wgl-embed{
  background:var(--card)!important;margin:0;padding:18px 18px 26px;
  font-family:var(--fb);color:var(--txt);
}
body.wgl-embed .wgl-embed-wrap{max-width:100%}
/* === wgl booking fixes === */
/* 1. The iframed document's <html> stayed #FFFFFF (only <body> was themed),
      which showed as a white strip under the form inside the modal. */
html.wgl-embed-doc{background:var(--card)!important}
html.wgl-embed-doc,html.wgl-embed-doc body{min-height:100%}

/* 2. Amelia paints its date panel with a background-IMAGE gradient in its own
      default blue (#1A84EE -> #043...). A background-color override cannot touch
      that, which is why the blue rail survived the retheme. This is exactly the
      formGradientColor pair Amelia ignored in its own settings. */
#wgl-book .am-select-date,
body.wgl-embed .am-select-date,
#wgl-book [class*="am-select-date"],
body.wgl-embed [class*="am-select-date"],
#wgl-book .am-fs__side,
body.wgl-embed .am-fs__side{
  background-image:linear-gradient(135deg,var(--or),var(--am))!important;
}
/* any other Amelia surface that leans on the default blue */
#wgl-book .am-button--primary,
body.wgl-embed .am-button--primary{
  background-image:var(--g-cta)!important;color:#0B0B18!important;border:0!important;
}

/* 3. TranslatePress renders <nav class="trp-language-switcher trp-floating-switcher">
      — none of the ids I first guessed. The artifact header already carries its own
      EN / বাং toggle, so the duplicate floater is hidden on WebGolok surfaces only;
      the multilingual feature itself is untouched. */
body.wgl-on .trp-floating-switcher,
body.wgl-embed .trp-floating-switcher,
body.wgl-on nav.trp-language-switcher.trp-floating-switcher,
body.wgl-embed nav.trp-language-switcher.trp-floating-switcher{
  display:none!important;
}
/* === wgl booking wizard (artifact v4) === */
.qc-head{display:flex;gap:14px;align-items:center}
.qc-head .ava{width:52px;height:52px;min-width:52px;font-size:1.15rem}
.trustrow{display:flex;gap:8px;flex-wrap:wrap;margin:12px 0 16px}
.trustrow span{font-size:.68rem;font-weight:700;border:1px dashed var(--line2);border-radius:999px;padding:.32rem .7rem;color:var(--mut)}
.stepsbar{display:flex;gap:6px;margin-bottom:26px}
.stepsbar i{flex:1;height:5px;border-radius:99px;background:var(--line);position:relative}
.stepsbar i.on{background:var(--g-cta)}
.stepsbar i small{position:absolute;top:9px;left:0;font-size:.6rem;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--dim);white-space:nowrap}
.stepsbar i.on small{color:var(--am)}
html[data-lang="bn"] .stepsbar i small{letter-spacing:0;text-transform:none}
.qcp{display:none}
.qcp.on{display:block;animation:fade .25s ease}
.topt{display:grid;grid-template-columns:1fr;gap:10px}
.topt button{border:1px solid var(--line2);border-radius:14px;padding:13px 14px;text-align:left;display:flex;gap:10px;align-items:flex-start;background:var(--bg2);transition:.2s;width:100%}
html[data-theme="light"] .topt button{background:#F6F8FF}
.topt button:hover{border-color:var(--am);transform:translateY(-2px)}
.topt .ti{font-size:1.25rem;line-height:1}
.topt b{display:block;font-size:.88rem;font-family:var(--fd)}
.topt small{color:var(--dim);font-size:.72rem;line-height:1.35;display:block;margin-top:2px}
.backlink{font-size:.78rem;font-weight:700;color:var(--dim);display:inline-block;margin-bottom:12px;cursor:pointer}
.backlink:hover{color:var(--am)}
.datechips{display:flex;gap:8px;overflow-x:auto;padding-bottom:6px;margin-bottom:14px;scrollbar-width:thin}
.dchip{min-width:62px;border:1px solid var(--line2);border-radius:12px;padding:.5rem .3rem;text-align:center;font-weight:800;font-family:var(--fd);color:var(--mut);transition:.2s}
.dchip small{display:block;font-size:.6rem;color:var(--dim);font-weight:700;text-transform:uppercase;letter-spacing:.05em}
html[data-lang="bn"] .dchip small{letter-spacing:0;text-transform:none}
.dchip:hover{border-color:var(--am)}
.dchip.on{background:var(--g-cta);color:#2A1400;border-color:transparent}
.dchip.on small{color:#5A2E00}
.slots{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.slot{border:1px solid var(--line2);border-radius:10px;padding:.6rem .4rem;font-weight:700;font-size:.85rem;color:var(--mut);transition:.2s}
.slot:hover:not(:disabled){border-color:var(--am);color:var(--txt)}
.slot.on{background:var(--g-vi);color:#fff;border-color:transparent}
.slot:disabled{opacity:.38;text-decoration:line-through;cursor:not-allowed}
.qc-ctx{font-size:.78rem;background:rgba(34,211,238,.1);border:1px dashed var(--cy);color:var(--cy);border-radius:10px;padding:.55rem .85rem;margin-bottom:14px;font-weight:600}
.qc-sumbox{background:var(--bg2);border:1px solid var(--line);border-radius:14px;padding:14px 16px;margin-bottom:14px}
html[data-theme="light"] .qc-sumbox{background:#F6F8FF}
.qc-sumbox .row{display:flex;justify-content:space-between;gap:12px;font-size:.88rem;padding:.3rem 0;color:var(--mut)}
.qc-sumbox .row b{color:var(--txt);text-align:right}

/* wizard states that are ours, not the artifact's: the artifact faked
   availability with a modulo, so it never needed loading or empty states. */
.wgl-loading{display:flex;align-items:center;gap:10px;color:var(--mut);font-size:.86rem;padding:18px 0}
.wgl-loading::before{content:"";width:16px;height:16px;border-radius:50%;border:2px solid var(--line2);border-top-color:var(--am);animation:wglspin .7s linear infinite}
@keyframes wglspin{to{transform:rotate(360deg)}}
.wgl-empty{color:var(--dim);font-size:.84rem;padding:14px 0;line-height:1.6}
.wgl-err{color:var(--rd);font-size:.84rem;padding:10px 0;font-weight:600}
.topt button .pricetag{margin-left:auto;font-family:var(--fd);font-weight:800;color:var(--am);white-space:nowrap}
.topt button[disabled]{opacity:.5;cursor:not-allowed}
#wgl-book-modal .modal-card{max-height:92vh;overflow:auto}
@media (max-width:560px){ .slots{grid-template-columns:repeat(2,1fr)} }
/* === wizard service features === */
/* Feature bullets on the service cards. Kept quiet so the card still reads
   name -> duration -> price first; the features are supporting detail. */
.topt .qc-flist{list-style:none;margin:8px 0 0;padding:0;display:flex;flex-direction:column;gap:3px}
.topt .qc-flist li{
  position:relative;padding-left:15px;font-size:.72rem;line-height:1.45;color:var(--mut);
}
.topt .qc-flist li::before{
  content:"";position:absolute;left:0;top:.5em;width:5px;height:5px;border-radius:50%;
  background:var(--am);opacity:.8;
}
.topt button:hover .qc-flist li{color:var(--txt)}

/* The full "what you get" block on the details step — the last thing read
   before confirming, so it gets a little more presence than the card bullets. */
.qc-feats{
  background:var(--bg2);border:1px solid var(--line);border-radius:14px;
  padding:14px 16px;margin-bottom:14px;
}
html[data-theme="light"] .qc-feats{background:#F6F8FF}
.qc-feats h4{
  font-family:var(--fd);font-size:.74rem;font-weight:800;letter-spacing:.09em;
  text-transform:uppercase;color:var(--am);margin:0 0 8px;
}
html[data-lang="bn"] .qc-feats h4{letter-spacing:0;text-transform:none}
.qc-feats .checks{margin:0}
.qc-feats .checks li{font-size:.86rem;line-height:1.5}

/* Student verification block inside the details step. */
#qcStudent{
  border-top:1px dashed var(--line2);margin-top:6px;padding-top:14px;
}
#qcStudent input[type=file]{
  width:100%;font:inherit;font-size:.86rem;color:var(--mut);
  background:var(--card2);border:1px solid var(--line2);border-radius:12px;padding:10px 12px;
}
#qcStudent input[type=file]::file-selector-button{
  font:inherit;font-weight:700;font-size:.8rem;margin-right:10px;cursor:pointer;
  background:var(--g-cta);color:#0B0B18;border:0;border-radius:999px;padding:7px 14px;
}
/* === modal form controls === */
/* The artifact styles bare `.field input`, so only type=text picked up the dark
   treatment — email/tel/url inputs and textareas fell through to the theme and
   rendered WHITE background with WHITE inherited text, i.e. invisible typing.
   Every control inside both dialogs is pinned explicitly here. */
#wgl-book-modal .field input,
#wgl-book-modal .field textarea,
#wgl-book-modal .field select,
#wgl-join-modal .field input,
#wgl-join-modal .field textarea,
#wgl-join-modal .field select{
  background:var(--card2)!important;
  color:var(--txt)!important;
  border:1px solid var(--line2)!important;
  border-radius:12px!important;
  font:inherit!important;
  font-size:1rem!important;
  padding:12px 14px!important;
  width:100%!important;
  -webkit-text-fill-color:var(--txt)!important;   /* Safari autofill */
}
#wgl-book-modal .field textarea,
#wgl-join-modal .field textarea{min-height:70px!important;resize:vertical!important}
#wgl-book-modal .field input::placeholder,
#wgl-book-modal .field textarea::placeholder,
#wgl-join-modal .field input::placeholder,
#wgl-join-modal .field textarea::placeholder{color:var(--dim)!important;opacity:1}
#wgl-book-modal .field input:focus,
#wgl-book-modal .field textarea:focus,
#wgl-join-modal .field input:focus,
#wgl-join-modal .field textarea:focus{
  outline:2px solid var(--am)!important;outline-offset:2px!important;border-color:var(--am)!important;
}
/* Browser autofill repaints the box white on Chrome — hold the dark ground. */
#wgl-book-modal .field input:-webkit-autofill,
#wgl-join-modal .field input:-webkit-autofill{
  -webkit-box-shadow:0 0 0 1000px var(--card2) inset!important;
  -webkit-text-fill-color:var(--txt)!important;
}
/* The file input keeps its own padding from the student block. */
#wgl-book-modal .field input[type=file]{padding:10px 12px!important}
/* ===== dark scrollbars inside the modals ===== */
/*
 * The booking card scrolls, and the UA painted a light scrollbar down the right
 * edge of a dark panel — a white band against the navy. color-scheme does the
 * real work; the WebKit rules just slim it down and inset the thumb.
 */
#wgl-book-modal,
#wgl-join-modal {
  color-scheme: dark;
}
#wgl-book-modal *,
#wgl-join-modal * {
  scrollbar-width: thin;
  scrollbar-color: rgba(255, 255, 255, .26) transparent;
}
#wgl-book-modal ::-webkit-scrollbar,
#wgl-join-modal ::-webkit-scrollbar {
  width: 10px;
  height: 10px;
}
#wgl-book-modal ::-webkit-scrollbar-track,
#wgl-join-modal ::-webkit-scrollbar-track {
  background: transparent;
}
#wgl-book-modal ::-webkit-scrollbar-thumb,
#wgl-join-modal ::-webkit-scrollbar-thumb {
  background: rgba(255, 255, 255, .24);
  background-clip: content-box;
  border: 3px solid transparent;
  border-radius: 999px;
}
#wgl-book-modal ::-webkit-scrollbar-thumb:hover,
#wgl-join-modal ::-webkit-scrollbar-thumb:hover {
  background: rgba(255, 255, 255, .42);
  background-clip: content-box;
  border: 3px solid transparent;
}
/* ===== inline booking wizard (consult page) ===== */
/*
 * Same wizard as the modal, rendered in the page flow.
 *
 * #wgl-book-modal carries the whole overlay treatment at id specificity —
 * fixed, inset:0, z-index, a blurred backdrop and opacity:0 until .on is added.
 * The inline dress has to unwind every one of those, so it is matched at
 * id+class to outrank them.
 */
#wgl-book-modal.wgl-book-inline {
  position: static;
  inset: auto;
  z-index: auto;
  display: block;
  padding: 0;
  background: none;
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
  opacity: 1;
  transition: none;
}
#wgl-book-modal.wgl-book-inline .modal-card {
  width: min(760px, 100%);
  max-width: 100%;
  max-height: none;
  overflow: visible;
  margin: 0 auto;
  padding: 28px;
}
@media (max-width: 640px) {
  #wgl-book-modal.wgl-book-inline .modal-card {
    padding: 20px;
    border-radius: 18px;
  }
}

/* ===== community app (artifact V6/V7) ===== */
/*
 * Ported verbatim from artifact 5bc55d25 (chars 41,010-43,300). Only .rit, .ava,
 * .tagb, .role-demo and .post-h already existed here — the whole two-column
 * community app was missing, which is why /community-dashboard/ had no design.
 */
.comm{display:grid;grid-template-columns:280px 1fr;gap:22px;align-items:start}
@media(max-width:920px){.comm{grid-template-columns:1fr}}
.sideb{display:grid;gap:16px;position:sticky;top:90px}
@media(max-width:920px){.sideb{position:static}}
.prof-pts{font-family:var(--fd);font-weight:900;font-size:1.6rem;background:var(--g-cta);-webkit-background-clip:text;background-clip:text;color:transparent}
.cnav{display:grid;gap:4px}
.cnav button{display:flex;justify-content:space-between;gap:8px;text-align:left;padding:.55rem .8rem;border-radius:10px;font-weight:700;font-size:.86rem;color:var(--mut);width:100%}
.cnav button:hover{background:var(--bg2);color:var(--txt)}
.cnav button.on{background:var(--g-vi);color:#fff}
.cnav button small{opacity:.7;font-weight:800}
.composer textarea{width:100%;background:var(--bg2);border:1px solid var(--line2);border-radius:12px;padding:.8rem 1rem;color:var(--txt);font:inherit;font-size:.92rem;min-height:74px;resize:vertical}
html[data-theme="light"] .composer textarea{background:#fff}
.composer .rowx{display:flex;gap:10px;margin-top:10px;align-items:center;flex-wrap:wrap}
.hackban{background:var(--g-vi);border-radius:16px;padding:16px 18px;color:#fff;display:flex;gap:14px;align-items:center;flex-wrap:wrap;margin:16px 0}
.hackban b{font-family:var(--fd)}
.hackban .cta{box-shadow:none;padding:.6rem 1.2rem;font-size:.82rem}
.cpost{border-bottom:1px solid var(--line);padding:16px 0}
.cpost:last-child{border-bottom:none}
.cact{display:flex;gap:14px;margin-top:10px}
.cact button{font-size:.78rem;font-weight:800;color:var(--dim);display:inline-flex;gap:.35rem;align-items:center;border-radius:8px;padding:.3rem .55rem;transition:.2s}
.cact button:hover{color:var(--txt);background:var(--bg2)}
.cact button.on{color:var(--pk)}
.cact .adm{color:var(--am)}
.creply{margin:10px 0 0 46px;display:grid;gap:8px}
.creply .r{background:var(--bg2);border:1px solid var(--line);border-radius:12px;padding:.55rem .8rem;font-size:.85rem;color:var(--mut)}
html[data-theme="light"] .creply .r{background:#F6F8FF}
.creply .rin{display:flex;gap:8px}
.creply input{flex:1;background:var(--bg2);border:1px solid var(--line2);border-radius:10px;padding:.5rem .8rem;color:var(--txt);font:inherit;font-size:.85rem}
.lb{display:grid;gap:8px}
.lb .row{display:flex;align-items:center;gap:10px;font-size:.88rem}
.lb .rk{width:22px;text-align:center;font-weight:900;font-family:var(--fd)}
.lb .me{background:rgba(255,184,0,.12);border:1px dashed var(--am);border-radius:10px;padding:.35rem .5rem}
.rsvp{border:1px solid var(--line2);border-radius:999px;padding:.3rem .8rem;font-size:.72rem;font-weight:800;color:var(--mut)}
.rsvp.on{background:var(--g-gr);color:#03291C;border-color:transparent}

/*
 * Additions beyond the artifact — it never had to deal with a real backend.
 */
/* the composer select had no styling of its own in the artifact */
.composer select{background:var(--bg2);border:1px solid var(--line2);border-radius:10px;padding:.5rem .8rem;color:var(--txt);font:inherit;font-size:.85rem;font-weight:700}
html[data-theme="light"] .composer select{background:#fff}
.composer select:disabled,.composer textarea:disabled{opacity:.5;cursor:not-allowed}
/* a real feed can be empty; the artifact's demo array never was */
.cempty{text-align:center;padding:34px 18px;color:var(--mut)}
.cempty .big{font-size:2rem;margin-bottom:8px}
/* in-flight and error feedback for real network writes */
.cbusy{opacity:.55;pointer-events:none}
.cerr{color:var(--rd);font-size:.8rem;font-weight:700;margin-top:8px}
.cpost.pinned{background:rgba(255,184,0,.05);border-radius:12px;padding-left:10px;padding-right:10px}

/* ===== community form controls: beat the vendor !important ===== */
/*
 * A vendor sheet (style-index.css) sets
 *   input[...], select, textarea { background: #fff !important }
 * which outranks every rule above regardless of specificity. Left alone the
 * composer textarea and the reply input render white-on-white the moment you
 * type — the placeholder is browser-grey so it LOOKS fine until you use it.
 * Colours are pinned here with !important for that reason, not for convenience.
 */
.composer textarea,
.composer select,
.creply input,
.creply .rin input {
  background: var(--bg2) !important;
  color: var(--txt) !important;
  -webkit-text-fill-color: var(--txt) !important;
  border-color: var(--line2) !important;
}
html[data-theme="light"] .composer textarea,
html[data-theme="light"] .composer select,
html[data-theme="light"] .creply input,
html[data-theme="light"] .creply .rin input {
  background: #fff !important;
  color: var(--txt) !important;
  -webkit-text-fill-color: var(--txt) !important;
}
.composer textarea::placeholder,
.creply input::placeholder { color: var(--dim) !important; opacity: 1; }
/* the dropdown list itself is painted by the OS, so it needs its own colours */
.composer select option { background: var(--card); color: var(--txt); }
/* Chrome autofill repaints the field regardless of the rules above */
.composer textarea:-webkit-autofill,
.creply input:-webkit-autofill {
  -webkit-text-fill-color: var(--txt) !important;
  -webkit-box-shadow: 0 0 0 1000px var(--bg2) inset !important;
}

/* ===== role-demo row accepts real links ===== */
/*
 * The artifact's locked-dashboard card uses .role-demo buttons for its two
 * fake "demo login" actions. Here those are real destinations (log in / request
 * a seat), so the same treatment has to apply to anchors.
 */
.role-demo a {
  flex: 1;
  min-width: 140px;
  border: 1px dashed var(--line2);
  border-radius: 12px;
  padding: .6rem;
  font-size: .78rem;
  font-weight: 700;
  color: var(--mut);
  transition: .2s;
  text-align: center;
  display: block;
}
.role-demo a:hover { color: var(--am); border-color: var(--am); }

/* ===== booking wizard: running selection preview ===== */
/*
 * Shows the choices made so far from step 2 onward. Chips that are still
 * undecided stay dashed and muted, so the row doubles as "what is left to do".
 */
.qc-prev {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin: 0 0 14px;
}
.qc-prev .pv {
  font-family: var(--fd);
  font-size: .72rem;
  font-weight: 700;
  padding: .26rem .62rem;
  border-radius: 999px;
  border: 1px dashed var(--line2);
  color: var(--dim);
  white-space: nowrap;
}
.qc-prev .pv.on {
  border-style: solid;
  border-color: transparent;
  background: rgba(34, 211, 238, .14);
  color: var(--cy);
}
@media (max-width: 480px) {
  .qc-prev .pv { font-size: .68rem; padding: .22rem .5rem; }
}


/* wg-real-site overrides */
/* No time-limited offer is running, so the countdown would be meaningless. */
.flash .cdown{display:none !important}
.flash{justify-content:center}