/* ===== ট্যাবলেট ও মোবাইল ===== */
.sub-toggle{display:none}
.card img,.small img,.mini img,.col-card img,.vthumb img,.num-item img{aspect-ratio:16/10}

/* ---------- ট্যাবলেট (৬৪১–৯৬০px) ---------- */
@media (max-width:960px){
  .topbar .container{padding:12px 16px}
  .logo img{height:60px}
  .dateline{font-size:14px}
  .nav li>a{padding:11px 10px;font-size:16px}

  /* প্রধান খবর পাশাপাশি থাকুক, সাইডবার নিচে দুই কলামে */
  .g-lead{grid-template-columns:1.4fr 1fr}
  .g-8-4>aside{display:grid;grid-template-columns:1fr 1fr;gap:18px;align-items:start}
  .g-8-4>aside>*{margin-bottom:0}
  .g-8-4>aside .sidebar{display:contents}
  .g3{grid-template-columns:repeat(3,1fr)}
  .g4{grid-template-columns:repeat(2,1fr)}
  .with-side{grid-template-columns:1fr}
  .with-side>aside.sidebar{display:grid;grid-template-columns:1fr 1fr;gap:18px;align-items:start}
  .with-side>aside.sidebar>*{margin:0}
  .video .container,.g-4-8{grid-template-columns:1fr}
  .vgrid{grid-template-columns:repeat(3,1fr)}
  .ads-row{grid-template-columns:repeat(2,1fr)!important}
  footer .container{grid-template-columns:1fr 1fr}
  footer .container>div:last-child{grid-column:1/-1}
  .copy-row{grid-column:auto}
}

/* ---------- ট্যাবলেট ও মোবাইলে ☰ মেনু (≤৯৬০px) ---------- */
@media (max-width:960px){
  /* নেভিগেশন বার */
  .nav .container{flex-wrap:nowrap;padding:0 6px;min-height:48px}
  .burger{display:flex;align-items:center;padding:8px}
  .nav ul{display:none}
  .nav-right{margin-left:auto;gap:8px}
  .nav-right a{font-size:15px;padding:5px 8px}

  /* মোবাইল মেনু: পুরো স্ক্রিন জুড়ে, সাব-মেনু ভাঁজ করা */
  .nav.open ul{display:flex;flex-direction:column;flex-wrap:nowrap;position:absolute;left:0;right:0;top:100%;background:#fff;max-height:calc(100vh - 120px);overflow:auto;box-shadow:0 10px 24px rgba(0,0,0,.2);z-index:60}
  .nav.open li{border-bottom:1px solid var(--line);display:flex;flex-wrap:wrap;align-items:center}
  .nav.open li>a{flex:1;color:#222;padding:12px 16px;font-size:17px}
  .nav.open li>a .ic{display:none}
  .nav.open li.active>a,.nav.open li>a:hover{background:#fff5f5;color:var(--red)}
  .nav.open .sub-toggle{display:grid;place-items:center;width:48px;align-self:stretch;border:0;border-left:1px solid var(--line);background:#fafafa;color:#555;cursor:pointer}
  .nav.open .sub-toggle .ic{width:18px;height:18px;transition:transform .2s}
  .nav.open li.sub-open>.sub-toggle .ic{transform:rotate(180deg)}
  .nav li .sub{position:static;box-shadow:none;min-width:0;flex-basis:100%;background:#f7f7f7}
  .nav.open li:hover .sub{display:none}
  .nav.open li.sub-open .sub{display:block}
  .nav.open .sub li{border:0;border-top:1px solid #ececec}
  .nav.open .sub a{padding:10px 16px 10px 32px;font-size:16px;border:0}

}

/* ---------- মোবাইল (≤৭৬৭px) ---------- */
@media (max-width:767px){
  body{font-size:16px;padding-bottom:30px}
  .container{padding:0 12px}

  /* হেডার: লোগো বামে, সোশ্যাল ডানে, তারিখ নিচে পুরো লাইনে */
  .topbar .container{display:grid;grid-template-columns:1fr auto;gap:8px 10px;padding:10px 12px}
  .logo img{height:50px}
  .social a{width:30px;height:30px}
  .dateline{grid-column:1/-1;grid-row:2;font-size:12.5px;text-align:center;border-top:1px solid var(--line);padding-top:6px;color:#444}
  .header-ad{grid-column:1/-1}

  .search-bar .container{padding:0 12px}

  /* উপরের টিকার */
  .ticker .container{padding:6px 12px}
  .ticker-label{font-size:14px;padding:4px 8px}
  .ticker-track{font-size:15px}
  .ticker.fixed .ticker-label,.ticker.fixed{font-size:13px}
  .ticker.fixed .container{padding:0}

  /* সেকশন */
  main section{padding:14px 0}
  .g-8-4,.g-4-8,.g-lead,.with-side{grid-template-columns:1fr;gap:14px}
  .g-8-4>aside,.with-side>aside.sidebar{display:block}
  .g-8-4>aside>*,.with-side>aside.sidebar>*{margin-bottom:14px}
  .g-8-4>aside .sidebar{display:block}

  .card.lead h2{font-size:21px;padding:10px 12px 6px}
  .card.lead p{font-size:15px;padding:0 12px 10px}
  .card h3{font-size:18px}
  .card img,.card.lead img{height:auto!important}

  /* ছোট খবর: দুই কলামে */
  .g2,.g3,.g4{grid-template-columns:1fr 1fr!important;gap:10px}
  .small img{height:auto}
  .small h4{font-size:15.5px;padding:6px 8px 2px;line-height:1.4}
  .small .date{font-size:11.5px;padding:0 8px 6px}
  .stack{grid-template-columns:1fr 1fr;display:grid;gap:10px}
  .stack .card h3{font-size:15.5px}
  .stack .card .body{padding:6px 8px}
  .stack .card .meta{font-size:11.5px;padding:4px 8px}
  .row.three{grid-template-columns:1fr 1fr;gap:10px}
  .row.three .card h3{font-size:15.5px}
  .row.three .card .body{padding:6px 8px}
  .row.three .card .meta{font-size:11.5px;padding:4px 8px}

  .mini{grid-template-columns:100px 1fr;gap:8px}
  .mini img{height:auto}
  .mini h4{font-size:16px}
  .box-title{font-size:20px}

  .col-card h3{font-size:18px}
  .col-card li{font-size:15.5px}
  .g4 .col-card{grid-column:1/-1}

  .cat-head a,.sec-head h2{font-size:18px}

  /* ভিডিও */
  .video .container,.s2 .g-4-8{grid-template-columns:1fr}
  .vgrid{grid-template-columns:1fr 1fr;gap:10px}
  .vgrid a:first-child{grid-column:1/-1}
  .vgrid h4{font-size:15px}
  .tabs{overflow-x:auto;white-space:nowrap}
  .tabs button{font-size:14px;padding:6px 10px}

  /* বিজ্ঞাপন */
  .ads-row{grid-template-columns:1fr!important;gap:10px;margin:12px 0}
  .ads-row .ad.sm:nth-child(n+2){display:none}
  .ad.sm{font-size:14px;padding:12px 6px}

  /* খবরের পাতা */
  .page-wrap{padding:12px}
  .crumb{font-size:13px}
  .article{padding:14px}
  .article h1{font-size:23px;line-height:1.45}
  .article .byline{font-size:13px}
  .article-body{font-size:17.5px;line-height:1.8}
  .share{gap:6px}.share-btn{font-size:13.5px;padding:5px 9px}

  /* ফুটার */
  footer{padding:28px 0 12px;font-size:16px}
  footer .container{grid-template-columns:1fr;gap:18px}
  footer p{margin-bottom:12px}
  .copy-row{flex-direction:column;text-align:center;gap:10px}
  .copy-text{font-size:14px}
  .totop{width:42px;height:42px;right:14px;bottom:50px}
}

/* ---------- খুব ছোট ফোন (≤৩৬০px) ---------- */
@media (max-width:360px){
  .logo img{height:42px}
  .nav-right a{display:none}
  .small h4,.row.three .card h3,.stack .card h3{font-size:14.5px}
}