/* =====================================================================
   modern.css — কর্পোরেট + "মোবাইলে শেখা" থিম লেয়ার (শুধু পাবলিক সাইট)
   ধারণা: ধীর-স্থির নেভি/সাদা কর্পোরেট ভিত্তি; ফোনের ভাষা (অ্যাপ-আইকন টাইল, নিচের ট্যাব বার,
   সিগন্যাল-বার, iOS-স্টাইল তালিকা) শুধু কয়েকটি জায়গায় — যাতে মনে হয় "মোবাইল দিয়ে শেখার প্রতিষ্ঠান"।
   মুছে দিলে সাইট আগের লুকে ফিরে যাবে।
   ===================================================================== */
:root{
  --bg:#F4F7FB;--line:#E1E8F2;--mint3:#EEF3FA;
  --sh:0 1px 2px rgba(8,27,82,.05),0 10px 28px -14px rgba(8,27,82,.18);
  --sh-l:0 28px 60px -20px rgba(5,14,45,.45);
  --tb-h:66px;
  --sig:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 15 12'%3E%3Crect x='0' y='8' width='3' height='4' rx='1'/%3E%3Crect x='4' y='5.5' width='3' height='6.5' rx='1'/%3E%3Crect x='8' y='3' width='3' height='9' rx='1'/%3E%3Crect x='12' y='0' width='3' height='12' rx='1'/%3E%3C/svg%3E");
}
body{font-size:16.5px}
h1,h2,h3{text-wrap:balance}

/* ---------- সেকশনের ছন্দ ও শিরোনাম ---------- */
.sec{padding:72px 0}
.sec-h{max-width:none;margin:0 0 34px;text-align:left}
.sec-h h2{font-size:clamp(1.6rem,1rem + 2.3vw,2.35rem);line-height:1.25;max-width:26em}
.sec-h p{max-width:60ch;margin:10px 0 0;font-size:1.04rem}
.kicker{display:inline-flex;align-items:center;gap:8px;margin:0 0 12px;padding:5px 13px 5px 10px;border-radius:99px;background:#E6EEFC;color:var(--g700);font:700 .8rem/1.3 var(--f-b);letter-spacing:0;text-transform:none}
.kicker::before{content:"";flex:none;width:14px;height:11px;background:currentColor;-webkit-mask:var(--sig) center/contain no-repeat;mask:var(--sig) center/contain no-repeat}
.kicker-l,.sec-dark .kicker,.sec-h-d .kicker,.page-h .kicker{background:rgba(255,255,255,.1);color:#FFD27A}
.sec-tint{background:var(--mint3)}

/* ---------- বোতাম ---------- */
.btn{min-height:46px;border-radius:12px;font-weight:700;letter-spacing:0}
.btn-sm{min-height:38px;border-radius:10px}
.btn-lg{min-height:54px;border-radius:14px}
.btn-primary{background:linear-gradient(180deg,#0B58F0,#0A47D1);box-shadow:inset 0 1px 0 rgba(255,255,255,.22),0 10px 20px -10px rgba(10,71,209,.7)}
.btn-primary:hover{background:linear-gradient(180deg,#1163FF,#0B50E2)}
.btn-outline{border-color:#CBD7EA;color:var(--g800)}
.btn-outline:hover{border-color:var(--g600);background:#F5F9FF}

/* ---------- ফর্মের ঘর ---------- */
input,select,textarea{border:1.5px solid #D3DEEE;border-radius:12px;min-height:48px;font-size:16px}
input:focus,select:focus,textarea:focus{outline:0;border-color:var(--g600);box-shadow:0 0 0 4px rgba(11,95,255,.14)}

/* ---------- কার্ড ---------- */
.ccard{border-radius:20px;border-color:var(--line)}
.ccard:hover{box-shadow:0 22px 44px -18px rgba(8,30,100,.28)}
.ccard-img{aspect-ratio:2/1}
.ccard .ccard-ph{position:relative;overflow:hidden;background:radial-gradient(120% 95% at 100% 0%,var(--phg,rgba(0,212,255,.38)),transparent 58%),linear-gradient(155deg,#0C2F8F,#071845)}
.ccard .ccard-ph::before{content:"";position:absolute;inset:0;background-image:radial-gradient(rgba(255,255,255,.16) 1px,transparent 1.5px);background-size:18px 18px;-webkit-mask-image:linear-gradient(135deg,#000,transparent 72%);mask-image:linear-gradient(135deg,#000,transparent 72%)}
.ccard .ph-0{--phg:rgba(0,212,255,.38)}.ccard .ph-1{--phg:rgba(255,176,0,.36)}.ccard .ph-2{--phg:rgba(150,120,255,.36)}.ccard .ph-3{--phg:rgba(47,139,255,.5)}
.ccard-ph svg{position:relative;box-sizing:content-box;width:38px;height:38px;padding:20px;border-radius:26px;background:linear-gradient(145deg,rgba(255,255,255,.24),rgba(255,255,255,.06));border:1px solid rgba(255,255,255,.3);box-shadow:0 16px 30px -8px rgba(0,0,0,.5),inset 0 1px 0 rgba(255,255,255,.35)}
.ccard-badge{padding:4px 11px 4px 24px;border-radius:8px;background:#fff;color:#081B52;font-weight:700;box-shadow:0 6px 16px -6px rgba(0,0,0,.4)}
.ccard-badge::before{content:"";position:absolute;left:10px;top:50%;width:8px;height:8px;margin-top:-4px;border-radius:50%;background:var(--amber)}
.ccard-b{padding:18px 20px 20px}
.chips li{border-radius:8px;background:#EDF2FA;color:#24385F}
.card-p,.tcard,.rvx-list{border-radius:20px;border-color:var(--line)}

/* ---------- ভেতরের পেজের হেডার ---------- */
.page-h{position:relative;overflow:hidden;padding:46px 0 42px;background:radial-gradient(720px 320px at 92% -30%,rgba(0,212,255,.24),transparent 62%),linear-gradient(160deg,#0B2C86,#050E2D)}
.page-h::before{content:"";position:absolute;inset:0;pointer-events:none;background-image:radial-gradient(rgba(255,255,255,.11) 1px,transparent 1.5px);background-size:22px 22px;-webkit-mask-image:linear-gradient(90deg,transparent 10%,#000);mask-image:linear-gradient(90deg,transparent 10%,#000)}
.page-h .wrap{position:relative}
.page-h h1{font-size:clamp(1.7rem,1.1rem + 2.4vw,2.5rem);line-height:1.22}

/* ---------- ফোনের নিচের ট্যাব বার (অ্যাপের মতো) ---------- */
.tabbar{display:none}
@media(max-width:820px){
  .tabbar{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));position:fixed;z-index:90;left:10px;right:10px;bottom:calc(10px + env(safe-area-inset-bottom));height:var(--tb-h);padding:6px;border-radius:24px;background:rgba(255,255,255,.98);border:1px solid rgba(8,27,82,.08);box-shadow:0 18px 42px -12px rgba(5,14,45,.45),0 2px 6px rgba(5,14,45,.08);transition:transform .32s cubic-bezier(.22,.8,.24,1)}
  body.kbd .tabbar{transform:translateY(150%)}
  .tb{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;border-radius:18px;color:#5A6A88;text-decoration:none!important;font:700 .68rem/1.2 var(--f-b);-webkit-tap-highlight-color:transparent;transition:color .2s,transform .12s}
  .tb-i{display:grid;place-items:center;width:46px;height:28px;border-radius:14px;transition:background .25s,color .25s,box-shadow .25s}
  .tb:active{transform:scale(.92)}
  .tb.is-on{color:var(--g800)}
  .tb.is-on .tb-i{background:linear-gradient(135deg,#0A47D1,#0B5FFF);color:#fff;box-shadow:0 8px 16px -6px rgba(10,71,209,.7)}
  /* নিচের বারের ওপর অন্য ভাসমান জিনিস */
  body.has-tabbar .chat-fab{bottom:calc(var(--tb-h) + 24px + env(safe-area-inset-bottom))}
  body.has-tabbar .mf-top{bottom:calc(var(--tb-h) + 24px + env(safe-area-inset-bottom))}
  body.has-tabbar .chat{bottom:calc(var(--tb-h) + 90px + env(safe-area-inset-bottom))}
  body.has-tabbar .mf-toast{bottom:calc(var(--tb-h) + 30px + env(safe-area-inset-bottom))}
  body.has-tabbar .mf-bot{padding-bottom:calc(var(--tb-h) + 30px + env(safe-area-inset-bottom))}
  .dock{top:44%}
  .sec{padding:54px 0}
  .sec-h{margin-bottom:26px}
}
@media(max-height:430px){.tabbar{display:none}body.has-tabbar .mf-bot{padding-bottom:16px}}
.mf-top{background:linear-gradient(135deg,#0B2C86,#081B52);color:#fff;border:1px solid rgba(255,255,255,.16);box-shadow:0 12px 26px -8px rgba(5,14,45,.6)}
@media(prefers-reduced-motion:reduce){.tabbar,.tb{transition:none}}

/* ---------- ফুটার: ফোনের "অ্যাপ" লুক ---------- */
.mf-qa{display:none}
@media(max-width:700px){
  .mf-in{padding-top:92px}
  .mf-qa{display:grid;grid-template-columns:repeat(auto-fit,minmax(0,1fr));gap:10px;margin:0 0 16px}
  .mf-q{display:flex;flex-direction:column;align-items:center;gap:8px;color:#fff;text-decoration:none!important;-webkit-tap-highlight-color:transparent}
  .mf-qi{display:grid;place-items:center;width:60px;height:60px;border-radius:21px;color:#fff;border:1px solid rgba(255,255,255,.22);box-shadow:0 14px 26px -8px rgba(0,0,0,.55),inset 0 1px 0 rgba(255,255,255,.3);transition:transform .15s}
  .qa-call .mf-qi{background:linear-gradient(145deg,#FFB000,#FF7A00)}
  .qa-wa .mf-qi{background:linear-gradient(145deg,#2EE56F,#12A150)}
  .qa-mail .mf-qi{background:linear-gradient(145deg,#3B93FF,#0A47D1)}
  .qa-tg .mf-qi{background:linear-gradient(145deg,#37AEE2,#1E96C8)}
  .mf-qt{font:700 .78rem var(--f-b);color:#DCE8FF}
  .mf-q:active .mf-qi{transform:scale(.9)}

  .mf-logo{border-radius:22px;padding:10px 16px}
  .mf-card{border-radius:22px}
  /* তালিকার মতো সারি (iOS সেটিংসের মতো) */
  .mf-acc{padding:0;overflow:hidden}
  .mf-js .mf-acc .mf-h{margin:0;padding:0 16px 0 18px;min-height:58px;font-size:1.02rem}
  .mf-js .mf-acc.is-open .mf-h{margin:0}
  .mf-pl{width:30px;height:30px;align-items:center;justify-content:center;border-radius:50%;background:rgba(255,255,255,.12)}
  .mf-acc .mf-body>*{padding:2px 18px 0}
  .mf-links::after,.mf-ct::after{content:"";display:block;height:14px}
  .mf-links{gap:0}
  .mf-links li{border-top:1px solid rgba(255,255,255,.09)}
  .mf-links a,.mf-links a:hover,.mf-links a:active{display:flex;align-items:center;justify-content:space-between;width:100%;padding:14px 2px;transform:none;font-size:1rem}
  .mf-links a::after,.mf-links a:hover::after{position:static;width:8px;height:8px;margin-right:4px;border:solid rgba(255,255,255,.45);border-width:2px 2px 0 0;border-radius:0;background:none;transform:rotate(45deg)}
  .mf-links a:active{background:rgba(255,255,255,.06)}
  .mf-bot{text-align:center}
}

.dock{transition:opacity .3s ease,transform .35s cubic-bezier(.22,.8,.24,1)}
body.foot-in .dock{opacity:0;pointer-events:none;transform:translate(16px,-50%)}
/* ফর্মের ফোন-হেডারের অ্যাপ-আইকন (আগে সাদার ওপর সাদা ছিল) */
.ph-av{background:linear-gradient(145deg,#FFB000,#FF7A00);color:#2b1a00;border-radius:13px;box-shadow:0 8px 16px -6px rgba(255,138,0,.6)}

.buy-alt{display:block;margin-top:10px;text-align:center;font-weight:700;font-size:.92rem;color:var(--g700);text-decoration:underline;text-underline-offset:3px}

/* পেমেন্ট পেজে মনোযোগ নষ্ট না করতে ভাসমান আইকন লুকানো (ফুটারে ও পেজের পাশে যোগাযোগ আছে) */
body.pg-payment .dock{display:none}

/* "আরো" ট্যাব: চাপলে সাইডের নেভিগেশন মেনু (ড্রয়ার) খোলে — ভেতরে Student Panel */
.tb-more{cursor:pointer;-webkit-user-select:none;user-select:none}
.tb-more:focus-visible{outline:3px solid rgba(0,212,255,.55);outline-offset:-3px}
body.pmh-drawer-open .tb-more{color:var(--g800)}
body.pmh-drawer-open .tb-more .tb-i{background:#E6EEFC}