/* ==========================================================
   SolaimanLipi font — ফ্রি CDN থেকে সরাসরি লোড হচ্ছে (fonts.maateen.me)
   কোনো ফাইল ডাউনলোড/আপলোড করা লাগবে না। ইন্টারনেট বন্ধ থাকলে বা
   CDN ডাউন থাকলে সাইট Noto Sans Bengali fallback দিয়ে চলবে।
   ========================================================== */
@font-face {
  font-family: 'SolaimanLipi';
  font-display: swap;
  font-weight: 400;
  font-style: normal;
  src: url('https://fonts.maateen.me/solaiman-lipi/solaimanlipi-normal-v1.0.woff2') format('woff2'),
       url('https://fonts.maateen.me/solaiman-lipi/solaimanlipi-normal-v1.0.ttf') format('truetype');
}
@font-face {
  font-family: 'SolaimanLipi';
  font-display: swap;
  font-weight: 700;
  font-style: normal;
  src: url('https://fonts.maateen.me/solaiman-lipi/solaimanlipi-bold-v1.0.woff2') format('woff2'),
       url('https://fonts.maateen.me/solaiman-lipi/solaimanlipi-bold-v1.0.ttf') format('truetype');
}

/* ঐচ্ছিক: নিজের সার্ভারে ফন্ট রাখতে চাইলে উপরের CDN url() গুলো বদলে
   এভাবে লিখলেই হবে (ফাইল রাখবে assets/fonts/ ফোল্ডারে):
   src: url('../fonts/SolaimanLipi.woff2') format('woff2'),
        url('../fonts/SolaimanLipi.ttf') format('truetype'); */

:root{
  --brand: #b91c1c;       /* primary red */
  --brand-dark: #7f1616;
  --ink: #1a1a1a;
  --muted: #6b7280;
  --line: #e5e7eb;
  --bg-soft: #f7f7f8;
}

html, body {
  font-family: 'SolaimanLipi', 'Noto Sans Bengali', 'Hind Siliguri', sans-serif;
  color: var(--ink);
  background: #ffffff;
  overflow-x: hidden;
  max-width: 100vw;
}

/* Section title with red left-bar, used across all category sections */
.sec-title{
  display:flex; align-items:center; gap:.6rem;
  font-weight:700; font-size:1.15rem;
  border-bottom: 3px solid var(--brand);
  padding-bottom:.5rem; margin-bottom:1rem;
  color: var(--brand-dark);
}
.sec-title::before{
  content:""; width:6px; height:22px; background:var(--brand); display:inline-block; border-radius:2px;
}

.news-card{ display:block; }
.news-card img{ width:100%; aspect-ratio:16/10; object-fit:cover; border-radius:6px; background:#eee; }
.news-card .cat-tag{ color:var(--brand); font-size:.75rem; font-weight:700; }
.news-card .title{ font-weight:600; line-height:1.4; }
.news-card .title:hover{ color:var(--brand); }

.line-clamp-2{ display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.line-clamp-3{ display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; }

.marquee-track{ white-space:nowrap; animation: marquee 28s linear infinite; }
.marquee-track:hover{ animation-play-state: paused; }
@keyframes marquee{ 0%{ transform:translateX(100%);} 100%{ transform:translateX(-100%);} }

.skeleton{ background:linear-gradient(90deg,#eee 25%,#f5f5f5 37%,#eee 63%); background-size:400% 100%; animation:sk 1.4s ease infinite; border-radius:6px;}
@keyframes sk{ 0%{background-position:100% 50%;} 100%{background-position:0 50%;} }

.ad-slot{ border:1px dashed var(--line); background:var(--bg-soft); display:flex; align-items:center; justify-content:center; overflow:hidden; }
.ad-slot img{ max-width:100%; height:auto; }

.news-body{ line-height:2; font-size:1.05rem; overflow-wrap:break-word; word-break:break-word; }
.news-body img{ max-width:100%; border-radius:6px; margin:1rem 0; }
.news-body p{ margin-bottom:1rem; }
.news-body h2, .news-body h3{ font-weight:700; margin:1.2rem 0 .6rem; }
.news-body table{ display:block; overflow-x:auto; max-width:100%; }
.news-body iframe{ max-width:100%; }

.header-menu a.active{ color: var(--brand); }

/* ---------- Mobile / responsive polish ---------- */
#more-menu-panel a{ padding:.25rem 0; }
#mobile-menu-btn, #search-toggle-btn{ background:none; border:none; cursor:pointer; }

@media (max-width: 767px){
  .sec-title{ font-size:1rem; }
}

/* keep hero/lead images from ever overflowing on very small screens */
img{ max-width:100%; height:auto; }

/* smooth open/close for dropdown + mobile panel */
#more-menu-panel, #mobile-menu-panel, #search-panel{
  animation: fadeSlide .15s ease-out;
}
@keyframes fadeSlide{
  from{ opacity:0; transform:translateY(-4px); }
  to{ opacity:1; transform:translateY(0); }
}