/* ============================================================
   Smart Pourashava — Modern Government Theme
   Bootstrap 5 | Bangladesh Govt Design Language
   ============================================================ */


/* ── Variables ─────────────────────────────────────────────── */
:root {
  --gv-green:      #006A4E;
  --gv-green-d:    #004d38;
  --gv-green-deep: #003628;
  --gv-green-lt:   #e8f5e9;
  --gv-red:        #CE1126;
  --gv-gold:       #F4A72A;
  --gv-white:      #ffffff;
  --gv-bg:         #f0f4f8;
  --gv-card:       #ffffff;
  --gv-text:       #1c2438;
  --gv-muted:      #6b7280;
  --gv-border:     #e2e8f0;
  --gv-shadow-sm:  0 1px 6px rgba(0,0,0,.07);
  --gv-shadow-md:  0 4px 18px rgba(0,0,0,.10);
  --gv-radius:     10px;
  --gv-radius-sm:  6px;
  --gv-trans:      .22s ease;
  --font-bn:       'SolaimanLipi','Noto Sans Bengali',Arial,sans-serif;
}

/* ── Base ───────────────────────────────────────────────────── */
*,*::before,*::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  font-family: var(--font-bn);
  font-size: 15px;
  color: var(--gv-text);
  background: var(--gv-bg);
  overflow-x: hidden;
  line-height: 1.8;
}
a { color: var(--gv-green); text-decoration: none; transition: color var(--gv-trans); }
a:hover,a:focus { color: var(--gv-green-d); text-decoration: none; outline: none; }
img { max-width: 100%; height: auto; }
ul { list-style: none; margin: 0; padding: 0; }
p { margin: 0 0 .9rem; }
h1,h2,h3,h4,h5,h6 { font-family: var(--font-bn); font-weight: 700; line-height: 1.4; margin: 0 0 .6rem; color: var(--gv-text); }

/* ── Wrapper & body ── */
html, body {
  width: 100%;
  margin: 0;
  padding: 0;
  overflow-x: hidden;
}
.tg-wrapper {
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  box-shadow: none !important;
  background: var(--gv-bg) !important;
  min-height: 100vh;
  display: flex;
  flex-direction: column;
}

/* ── Bootstrap 3 col-xs-* compat ── ONLY at extra-small screens ── */
/* At xs (< 576px), define widths. At sm+ Bootstrap 5 classes take over */
.col-xs-1,.col-xs-2,.col-xs-3,.col-xs-4,.col-xs-5,.col-xs-6,
.col-xs-7,.col-xs-8,.col-xs-9,.col-xs-10,.col-xs-11,.col-xs-12 {
  padding-right: calc(var(--bs-gutter-x, 1.5rem) * .5);
  padding-left:  calc(var(--bs-gutter-x, 1.5rem) * .5);
  margin-top: var(--bs-gutter-y, 0);
}
@media (max-width: 575.98px) {
  .col-xs-1  { flex:0 0 auto; width: 8.33333%; }
  .col-xs-2  { flex:0 0 auto; width:16.66667%; }
  .col-xs-3  { flex:0 0 auto; width:25%; }
  .col-xs-4  { flex:0 0 auto; width:33.33333%; }
  .col-xs-5  { flex:0 0 auto; width:41.66667%; }
  .col-xs-6  { flex:0 0 auto; width:50%; }
  .col-xs-7  { flex:0 0 auto; width:58.33333%; }
  .col-xs-8  { flex:0 0 auto; width:66.66667%; }
  .col-xs-9  { flex:0 0 auto; width:75%; }
  .col-xs-10 { flex:0 0 auto; width:83.33333%; }
  .col-xs-11 { flex:0 0 auto; width:91.66667%; }
  .col-xs-12 { flex:0 0 auto; width:100%; }
}

/* tg-twocolumns — BS5 flex row behavior */
#tg-twocolumns, .tg-twocolumns {
  --bs-gutter-x: 1.5rem;
  --bs-gutter-y: 0;
  display: flex;
  flex-wrap: wrap;
  align-items: stretch;
  width: 100%;
  margin-right: calc(-.5 * var(--bs-gutter-x));
  margin-left:  calc(-.5 * var(--bs-gutter-x));
}
/* Each column: flex stack + Bootstrap gutter padding */
#tg-twocolumns > [class*="col-"],
.tg-twocolumns > [class*="col-"] {
  display: flex;
  flex-direction: column;
  min-width: 0;
  /* padding-right: calc(var(--bs-gutter-x) * .5); */
  padding-left:  calc(var(--bs-gutter-x) * .5);
}

/* ╔══════════════════════════════════════════════════════════╗
   ║  HEADER                                                  ║
   ╚══════════════════════════════════════════════════════════╝ */
/* Header — topbar+logo normal flow; only navbar sticks on scroll via JS */
#tg-header { position: relative; z-index: 1030; width: 100%; }

/* Sticky navbar (class added by JS on scroll) */
.hdr-nav.nav-sticky {
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  width: 100% !important;
  z-index: 1040 !important;
  box-shadow: 0 3px 16px rgba(0,0,0,.28) !important;
  animation: slideDown .25s ease;
}
@keyframes slideDown {
  from { transform: translateY(-100%); }
  to   { transform: translateY(0); }
}

/* Top bar */
.hdr-topbar {
  background: var(--gv-green-deep);
  color: rgba(255,255,255,.85);
  font-size: 13px;
  padding: 5px 0;
  border-bottom: 2px solid var(--gv-gold);
  width: 100%;
}
.hdr-topbar-left { display: flex; align-items: center; gap: 1.2rem; }
.hdr-topbar-right { display: flex; align-items: center; gap: .8rem; justify-content: flex-end; }
.hdr-topbar-left span,
.hdr-topbar-right span { display: flex; align-items: center; gap: .35rem; }
.hdr-topbar .fa { color: var(--gv-gold); font-size: 12px; }
.hdr-topbar a { color: rgba(255,255,255,.85); }
.hdr-topbar a:hover { color: var(--gv-gold); }

/* Logo strip — full width */
.hdr-logo-strip {
  background: var(--gv-white);
  border-bottom: 1px solid var(--gv-border);
  width: 100%;
}
.hdr-logo-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 10px 0;
}
.hdr-logo-left {
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
}
.hdr-logo-link {
  display: flex;
  align-items: center;
  gap: 14px;
  text-decoration: none;
  min-width: 0;
}
.hdr-logo-img {
  width: 80px;
  height: 80px;
  object-fit: contain;
  flex-shrink: 0;
}
.hdr-org-name {
  font-size: 45px;
  font-weight: 700;
  color: #004d38;
  line-height: 1.3;
  font-family: 'SolaimanLipi', 'Noto Sans Bengali', Arial, sans-serif;
}
.hdr-emblem-img {
  width: 78px;
  height: 78px;
  object-fit: contain;
  flex-shrink: 0;
}

/* Navbar — full width */
.hdr-nav {
  background: linear-gradient(135deg, var(--gv-green-d) 0%, var(--gv-green) 100%);
  box-shadow: 0 2px 8px rgba(0,0,0,.18);
  width: 100%;
}
.hdr-nav { overflow: visible; }
.hdr-toggler {
  border: 2px solid var(--gv-green) !important;
  border-radius: var(--gv-radius-sm) !important;
  padding: 6px 10px;
  color: var(--gv-green-d);
  background: transparent;
  cursor: pointer;
  flex-shrink: 0;
  line-height: 1;
}
.hdr-toggler .fa { font-size: 18px; }
/* Desktop: force single row, no wrap */
.hdr-nav-list {
  flex-wrap: nowrap !important;
  width: 100%;
  margin: 0;
  padding: 0;
}
.hdr-nav-list .nav-link {
  color: rgba(255,255,255,.92) !important;
  font-size: 15px;
  padding: 14px 11px !important;
  white-space: nowrap;
  font-family: var(--font-bn);
  transition: background var(--gv-trans), color var(--gv-trans);
}
.hdr-nav-list .nav-link:hover,
.hdr-nav-list .nav-item.active .nav-link {
  background: rgba(0,0,0,.22);
  color: var(--gv-gold) !important;
}
/* Dropdown — hover to open */
.hdr-dropdown { position: relative; }
.hdr-dropdown .dropdown-toggle::after { border-color: rgba(255,255,255,.75) transparent transparent; }
.hdr-dropdown:hover > .hdr-submenu,
.hdr-dropdown:focus-within > .hdr-submenu {
  display: block !important;
}
.hdr-submenu {
  border: none !important;
  border-top: 3px solid var(--gv-green) !important;
  border-radius: 0 0 var(--gv-radius-sm) var(--gv-radius-sm) !important;
  box-shadow: 0 8px 28px rgba(0,0,0,.18) !important;
  padding: .4rem 0 !important;
  min-width: 240px !important;
  z-index: 9999 !important;
  background: #fff !important;
}
.hdr-submenu .dropdown-item {
  font-size: 14px;
  font-family: var(--font-bn);
  padding: 9px 18px;
  color: var(--gv-text) !important;
  border-bottom: 1px solid #f0f4f8;
  transition: background var(--gv-trans), padding-left var(--gv-trans);
  display: block;
}
.hdr-submenu .dropdown-item:last-child { border-bottom: none; }
.hdr-submenu .dropdown-item:hover,
.hdr-submenu .dropdown-item:focus {
  background: var(--gv-green-lt) !important;
  color: var(--gv-green-d) !important;
  padding-left: 26px;
}
.hdr-submenu .dropdown-item::before {
  content: '\203A';
  margin-right: 7px;
  color: var(--gv-green);
  font-weight: 700;
}

/* Notice ticker — full width */
.hdr-ticker { background: #fff8e1; border-bottom: 1px solid #ffe082; width: 100%; }
.ticker-label {
  background: var(--gv-red);
  color: #fff;
  padding: 6px 16px;
  font-size: 13px;
  font-weight: 700;
  white-space: nowrap;
  display: flex;
  align-items: center;
  font-family: var(--font-bn);
}
.ticker-body {
  flex: 1;
  padding: 6px 12px;
  font-size: 14px;
  color: var(--gv-green-d);
  overflow: hidden;
  font-family: var(--font-bn);
}
.ticker-body marquee a { color: var(--gv-green-d); }

/* ╔══════════════════════════════════════════════════════════╗
   ║  PAGE LAYOUT                                             ║
   ╚══════════════════════════════════════════════════════════╝ */
.tg-main { padding: 22px 0; flex: 1 0 auto; }
.tg-haslayout { width: 100%; }
.tg-sectionspace { padding: 14px 0; }

/* ── Section Headings ── */
.tg-widgettitle {
  margin-bottom: 14px;
  padding-bottom: 8px;
  border-bottom: 2px solid var(--gv-green);
}
.tg-widgettitle h3,
.tg-widgettitle h2 {
  font-size: 19px;
  font-weight: 700;
  color: var(--gv-green-d);
  margin: 0;
  padding-left: 13px;
  border-left: 4px solid var(--gv-gold);
  line-height: 1.4;
  font-family: var(--font-bn);
}

/* ── Content / Widget Cards ── */
.tg-content,
.tg-widget {
  background: var(--gv-card);
  border-radius: var(--gv-radius);
  box-shadow: var(--gv-shadow-sm);
  padding: 16px;
  margin-bottom: 16px;
  border: 1px solid #eaeff5;
}
/* Column gap handled by Bootstrap gutter (--bs-gutter-x: 1.5rem) */

/* ── Slider ── */
.tg-homebannervtwo {
  overflow: hidden;
  position: relative;
  border-radius: 10px;
  border-bottom: 4px solid var(--gv-gold);
  box-shadow: 0 4px 24px rgba(0,0,0,.18);
  margin-bottom: 6px;
  margin-top: 10px;
}
.tg-homeslider .item figure {
  margin: 0;
  position: relative;
  overflow: hidden;
}
.tg-homeslider .item figure img {
  width: 100%;
  height: auto;
  display: block;
  max-height: 520px;
  object-fit: contain;
}

/* Caption overlay */
.tg-slidercontent {
  position: absolute;
  bottom: 0; left: 0; right: 0;
  background: linear-gradient(
    to top,
    rgba(0,30,18,.92) 0%,
    rgba(0,60,36,.65) 45%,
    transparent 100%
  );
  padding: 90px 44px 38px;
}
.tg-slidercontentbox { max-width: 820px; }
.tg-titledescription h1 {
  color: #fff;
  font-size: 30px;
  font-weight: 700;
  margin: 0;
  text-shadow: 0 2px 10px rgba(0,0,0,.55);
  border-left: 5px solid var(--gv-gold);
  padding-left: 16px;
  line-height: 1.45;
  font-family: var(--font-bn);
}

/* Prev / Next buttons */
.owl-nav button.owl-prev,
.owl-nav button.owl-next {
  position: absolute;
  top: 50%; transform: translateY(-50%);
  background: rgba(0,77,56,.78) !important;
  color: #fff !important;
  width: 46px; height: 46px;
  border-radius: 8px !important;
  display: flex; align-items: center; justify-content: center;
  border: 2px solid rgba(255,255,255,.28) !important;
  font-size: 20px !important;
  backdrop-filter: blur(6px);
  transition: background var(--gv-trans), transform var(--gv-trans);
}
.owl-nav button.owl-prev { left: 16px; }
.owl-nav button.owl-next { right: 16px; }
.owl-nav button:hover {
  background: var(--gv-green) !important;
  transform: translateY(-50%) scale(1.1);
}

/* Dots — line style */
.owl-dots {
  position: absolute;
  bottom: 18px; left: 44px;
  text-align: left;
  width: auto;
}
.owl-dot { display: inline-block; margin-right: 6px; }
.owl-dot span {
  width: 26px !important;
  height: 4px !important;
  border-radius: 2px !important;
  background: rgba(255,255,255,.38) !important;
  transition: all .35s ease !important;
  display: block;
}
.owl-dot.active span {
  width: 50px !important;
  background: var(--gv-gold) !important;
}

/* ── Member sidebar cards ── */
.tg-campus {
  display: flex; align-items: center; gap: 10px;
  background: var(--gv-white);
  border: 1px solid #edf0f5;
  border-radius: 8px;
  padding: 10px; margin-bottom: 10px;
  box-shadow: 0 1px 5px rgba(0,0,0,.06);
  transition: box-shadow var(--gv-trans), transform var(--gv-trans);
}
.tg-campus:hover { box-shadow: var(--gv-shadow-md); transform: translateY(-2px); }
.tg-featuredimg { flex-shrink: 0; }
.tg-featuredimg img {
  width: 58px !important; height: 58px !important;
  border-radius: 50%; object-fit: cover;
  border: 2px solid var(--gv-green-lt);
}
.tg-campuscontent { flex: 1; min-width: 0; }
.tg-campustitle h3 {
  font-size: 14px; font-weight: 600;
  margin-bottom: 2px;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.tg-campustitle h3 a { color: var(--gv-green-d); }
.tg-campustitle h3 a:hover { color: var(--gv-red); }
.tg-price { font-size: 13px; color: var(--gv-muted); display: block; }

/* ── Notice board ── */
.hmnotice { height: 210px; overflow: hidden; }
.hmnotice ul li {
  border-bottom: 1px dashed #e5e7eb;
  padding: 8px 0 8px 20px;
  position: relative;
  font-size: 15px; line-height: 1.6;
}
.hmnotice ul li::before {
  content: '\f0da'; font-family: FontAwesome;
  position: absolute; left: 3px; top: 11px;
  color: var(--gv-red); font-size: 12px;
}
.hmnotice ul li a { color: var(--gv-text); }
.hmnotice ul li a:hover { color: var(--gv-green); }

/* ── Chairman / Secretary message ── */
.tg-welcomeandgreeting figure {
  border-radius: 8px; overflow: hidden;
  margin-bottom: 10px;
  border: 3px solid var(--gv-green-lt);
}
.tg-welcomeandgreeting figure img {
  width: 100%; max-height: 300px;
  object-fit: contain; display: block;
}
.messageHi {
  background: var(--gv-green-lt) !important;
  border: 1px solid #b2dfdb !important;
  border-radius: var(--gv-radius-sm) !important;
  padding: 12px !important; margin-bottom: 8px;
}
.messageHi h4 {
  color: var(--gv-green-d) !important;
  font-size: 16px !important; font-weight: 700 !important;
  margin-bottom: 5px !important;
}
.welcomems {
  font-size: 18px !important;
  line-height: 1.7 !important;
  color: #374151 !important;
  max-height: 573px;
  overflow: hidden;
}
.tg-shortcode > a {
  display: inline-block; margin-top: 10px;
  padding: 6px 18px;
  background: var(--gv-green); color: #fff !important;
  border-radius: var(--gv-radius-sm);
  font-size: 14px; font-weight: 600;
  transition: background var(--gv-trans);
}
.tg-shortcode > a:hover { background: var(--gv-green-d); }

/* ── Services grid — 4 per row ── */
.tg-faculty {
  background: var(--gv-white);
  border: 1px solid #e8edf3;
  border-radius: 8px;
  padding: 14px 8px 12px;
  margin-bottom: 14px;
  text-align: center;
  box-shadow: 0 1px 5px rgba(0,0,0,.06);
  transition: box-shadow var(--gv-trans), transform var(--gv-trans), border-color var(--gv-trans);
  min-height: 110px;
  display: flex; flex-direction: column;
  align-items: center; justify-content: center;
}
.tg-faculty:hover {
  box-shadow: var(--gv-shadow-md);
  transform: translateY(-4px);
  border-color: var(--gv-green);
}
img.sthumb {
  width: 52px !important; height: 52px !important;
  object-fit: contain; display: block;
  margin: 0 auto 8px !important;
}
h3.stitle {
  font-size: 13px !important; font-weight: 600;
  color: var(--gv-text); margin: 0 !important; line-height: 1.4;
}
h3.stitle a { color: inherit; }
h3.stitle a:hover { color: var(--gv-green); }

/* ── About box ── */
.hinfoh h2 {
  font-size: 19px; color: var(--gv-green-d);
  margin-bottom: 10px; font-weight: 700;
}

/* ── Calendar ── */
table.calendar { width: 100%; border-collapse: collapse; font-size: 13px; }
table.calendar th {
  background: var(--gv-green) !important; color: #fff !important;
  padding: 7px 2px !important; text-align: center; font-size: 13px;
  border: 1px solid var(--gv-green-d) !important;
}
table.calendar td {
  padding: 6px 3px !important; text-align: center;
  border: 1px solid #e2e8f0 !important; color: #374151;
}
table.calendar td[style*="background-color"] {
  background: var(--gv-gold) !important; color: #fff; font-weight: 700;
}

/* ── Photo Gallery — 3 per row ── */
.gallery-container { margin-bottom: 12px; }
.gallery-img-wrapper {
  position: relative; overflow: hidden;
  border-radius: var(--gv-radius-sm);
  height: 120px; background: #ddd;
}
.gallery-img-wrapper img {
  width: 100%; height: 100%; object-fit: cover; display: block;
  transition: transform .35s ease;
}
.gallery-img-wrapper:hover img { transform: scale(1.09); }
.simple-overlay {
  position: absolute; inset: 0;
  background: rgba(0,106,78,.55);
  display: flex; align-items: center; justify-content: center;
  opacity: 0; transition: opacity .3s ease;
}
.gallery-img-wrapper:hover .simple-overlay { opacity: 1; }
.plus-icon { color: #fff; font-size: 30px; font-weight: 300; line-height: 1; }

/* ── Right sidebar widgets ── */
.rnotice { overflow: hidden; }
.rnotice img { width: 100%; display: block; border-radius: 4px; }
.rnotice audio { width: 100%; margin-top: 8px; }

/* ╔══════════════════════════════════════════════════════════╗
   ║  STATS SECTION                                           ║
   ╚══════════════════════════════════════════════════════════╝ */
.stats-section {
  background: var(--gv-card) !important;
  border-radius: var(--gv-radius);
  padding: 20px 16px;
  margin-bottom: 24px;
  box-shadow: var(--gv-shadow-sm);
  border: 1px solid #eaeff5 !important;
}
.stats-section .tg-widgettitle {
  border-bottom: 2px solid var(--gv-green);
  margin-bottom: 16px;
}
.stats-section .tg-widgettitle h3 {
  color: var(--gv-green-d) !important;
  border-left-color: var(--gv-gold) !important;
}
.stats-section .tg-faculty {
  background: #f8fbff !important;
  border: 1px solid #e0eaf4 !important;
  border-left: 3px solid var(--gv-green) !important;
  border-radius: 6px;
  padding: 8px 6px;
  text-align: center;
  margin-bottom: 10px;
  transition: box-shadow var(--gv-trans), transform var(--gv-trans), border-color var(--gv-trans);
  box-shadow: 0 1px 4px rgba(0,0,0,.05);
}
.stats-section .tg-faculty:hover {
  box-shadow: var(--gv-shadow-md) !important;
  transform: translateY(-3px);
  border-left-color: var(--gv-gold) !important;
}
.stats-section .tg-faculty h2 {
  font-size: 28px !important;
  font-weight: 700 !important;
  color: var(--gv-green) !important;
  margin-bottom: 4px !important;
  line-height: 1.2;
}
.stats-section .tg-faculty h3 {
  font-size: 13px !important;
  color: var(--gv-muted) !important;
  font-weight: 500 !important;
  margin: 0 !important;
  line-height: 1.4;
}
.stats-section .tg-faculty a { display: block; text-decoration: none; }
/* 6 cards per line on desktop, 3 on small tablets (2 on phones via col-6) */
@media (min-width: 992px) {
  .stats-section .col-lg-3 { width: 16.66666667%; }
}
@media (min-width: 576px) and (max-width: 767.98px) {
  .stats-section .col-sm-6 { width: 33.33333333%; }
}

/* ╔══════════════════════════════════════════════════════════╗
   ║  IMPORTANT LINKS                                         ║
   ╚══════════════════════════════════════════════════════════╝ */
.linkli a {
  display: block;
  padding: 8px 12px 8px 24px;
  font-size: 14px; color: var(--gv-text);
  border-bottom: 1px solid #f0f4f8;
  position: relative;
  transition: background var(--gv-trans), padding-left var(--gv-trans);
  line-height: 1.5;
}
.linkli a::before {
  content: '\f0da'; font-family: FontAwesome;
  position: absolute; left: 7px; top: 11px;
  color: var(--gv-red); font-size: 13px;
}
.linkli a:hover {
  background: var(--gv-green-lt);
  padding-left: 30px; color: var(--gv-green-d);
}

/* ╔══════════════════════════════════════════════════════════╗
   ║  GENERAL TABLES                                          ║
   ╚══════════════════════════════════════════════════════════╝ */
table { width: 100%; border-collapse: collapse; background: #fff; }
table th, table td {
  padding: 11px 13px;
  border: 1px solid var(--gv-border);
  font-size: 15px; vertical-align: middle; text-align: center;
  font-family: var(--font-bn);
}
table thead th {
  background: var(--gv-green); color: #fff;
  font-weight: 700; border-color: var(--gv-green-d);
}
table tbody tr:nth-child(even) { background: #f7fffe; }
table tbody tr:hover { background: var(--gv-green-lt); }

/* ╔══════════════════════════════════════════════════════════╗
   ║  FORMS                                                   ║
   ╚══════════════════════════════════════════════════════════╝ */
.form-control, select, input[type="text"], input[type="number"],
input[type="email"], input[type="tel"], input[type="date"],
input[type="password"], textarea {
  width: 100%; padding: 10px 13px;
  border: 1.5px solid var(--gv-border);
  border-radius: var(--gv-radius-sm);
  font-family: var(--font-bn); font-size: 15px;
  color: var(--gv-text); background: var(--gv-white);
  transition: border-color var(--gv-trans), box-shadow var(--gv-trans);
  min-height: 42px;
}
.form-control:focus, select:focus, input:focus, textarea:focus {
  border-color: var(--gv-green);
  box-shadow: 0 0 0 3px rgba(0,106,78,.12);
  outline: none;
}
label { display: block; font-weight: 600; font-size: 15px; margin-bottom: 5px; }

/* ╔══════════════════════════════════════════════════════════╗
   ║  BREADCRUMB / INNER PAGES                                ║
   ╚══════════════════════════════════════════════════════════╝ */
.tg-breadcrumb {
  background: linear-gradient(135deg, var(--gv-green-d), var(--gv-green));
  padding: 12px 0; margin-bottom: 18px;
}
.tg-breadcrumb ol, .tg-breadcrumb ul {
  list-style: none; display: flex; gap: .4rem;
  align-items: center; margin: 0; padding: 0; flex-wrap: wrap;
}
.tg-breadcrumb li { color: rgba(255,255,255,.78); font-size: 14px; }
.tg-breadcrumb li::after { content: '/'; margin-left: .4rem; color: rgba(255,255,255,.35); }
.tg-breadcrumb li:last-child::after { display: none; }
.tg-breadcrumb li a { color: rgba(255,255,255,.78); }
.tg-breadcrumb li a:hover { color: var(--gv-gold); }
.pagebg {
  background: var(--gv-card); border-radius: var(--gv-radius);
  padding: 24px; box-shadow: var(--gv-shadow-sm);
  border: 1px solid #eaeff5; margin-bottom: 20px;
}
.pagemh { min-height: 460px; }

/* ╔══════════════════════════════════════════════════════════╗
   ║  BUTTONS                                                 ║
   ╚══════════════════════════════════════════════════════════╝ */
.tg-btn {
  display: inline-block;
  background: var(--gv-green); color: #fff !important;
  padding: 9px 24px; border-radius: var(--gv-radius-sm);
  font-size: 15px; font-weight: 700; border: none; cursor: pointer;
  font-family: var(--font-bn);
  transition: background var(--gv-trans), transform var(--gv-trans);
}
.tg-btn:hover { background: var(--gv-green-d); transform: translateY(-1px); }

/* ╔══════════════════════════════════════════════════════════╗
   ║  FOOTER                                                  ║
   ╚══════════════════════════════════════════════════════════╝ */
/* ── Mobile Offcanvas Sidebar ── */
.hdr-sidebar {
  background: var(--gv-green-deep);
  width: 290px !important;
  max-width: 85vw;
}
.hdr-sidebar-head {
  background: var(--gv-green-d);
  padding: 14px 16px;
  border-bottom: 2px solid var(--gv-gold);
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.hdr-sidebar-brand {
  display: flex;
  align-items: center;
  gap: 10px;
  color: #fff;
  font-size: 14px;
  font-weight: 700;
  line-height: 1.3;
  font-family: var(--font-bn);
  flex: 1;
  overflow: hidden;
}
.hdr-sidebar-logo { width: 38px; height: 38px; object-fit: contain; flex-shrink: 0; }
.hdr-sidebar-close {
  background: none;
  border: none;
  color: rgba(255,255,255,.8);
  font-size: 20px;
  cursor: pointer;
  padding: 4px 8px;
  line-height: 1;
}
.hdr-sidebar-close:hover { color: #fff; }
.hdr-sidebar-body { padding: 0; overflow-y: auto; scrollbar-width: none; }
.hdr-sidebar-body::-webkit-scrollbar { display: none; }
.hdr-sidebar-nav { list-style: none; margin: 0; padding: 0; }
.hdr-sidebar-nav > li > a,
.hdr-sidebar-toggle {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 13px 18px;
  color: rgba(255,255,255,.88);
  font-size: 14.5px;
  font-family: var(--font-bn);
  border-bottom: 1px solid rgba(255,255,255,.07);
  text-decoration: none;
  cursor: pointer;
  transition: background .15s, color .15s;
}
.hdr-sidebar-nav > li > a:hover,
.hdr-sidebar-toggle:hover { background: rgba(255,255,255,.08); color: var(--gv-gold); }
.hdr-sidebar-arrow {
  margin-left: auto;
  transition: transform .2s;
  font-size: 13px;
}
.hdr-sidebar-group.open .hdr-sidebar-arrow { transform: rotate(180deg); }
.hdr-sidebar-sub {
  list-style: none;
  margin: 0; padding: 0;
  background: rgba(0,0,0,.25);
  max-height: 0;
  overflow: hidden;
  transition: max-height .3s ease;
}
.hdr-sidebar-group.open .hdr-sidebar-sub { max-height: 600px; }
.hdr-sidebar-sub li a {
  display: block;
  padding: 10px 18px 10px 42px;
  color: rgba(255,255,255,.75);
  font-size: 13.5px;
  font-family: var(--font-bn);
  text-decoration: none;
  border-bottom: 1px solid rgba(255,255,255,.04);
  transition: color .15s, background .15s;
}
.hdr-sidebar-sub li a:hover { color: var(--gv-gold); background: rgba(255,255,255,.05); }
.hdr-sidebar-admin {
  border-top: 2px solid var(--gv-gold) !important;
  margin-top: 8px;
}
.hdr-sidebar-admin a {
  color: var(--gv-gold) !important;
  font-weight: 700 !important;
}

.sp-footer { background: var(--gv-green-deep); color: rgba(255,255,255,.82); width: 100%; }
.sp-footer-main { padding: 36px 0 28px; border-top: 4px solid var(--gv-gold); }
.sp-footer-title {
  color: var(--gv-gold) !important;
  font-size: 16px; font-weight: 700;
  margin-bottom: 14px; padding-bottom: 8px;
  border-bottom: 1px solid rgba(255,255,255,.12);
  font-family: var(--font-bn);
}
.sp-footer-list { list-style: none; margin: 0; padding: 0; }
.sp-footer-list li {
  display: flex; align-items: flex-start; gap: 9px;
  padding: 7px 0; border-bottom: 1px solid rgba(255,255,255,.06);
  font-size: 14px; color: rgba(255,255,255,.82);
  font-family: var(--font-bn);
}
.sp-footer-list li:last-child { border-bottom: none; }
.sp-footer-list .fa { color: var(--gv-gold); margin-top: 3px; flex-shrink: 0; width: 14px; }
.sp-footer-link { color: var(--gv-gold) !important; font-weight: 600; }
.sp-footer-link:hover { color: #fff !important; }
.sp-footer-bar {
  background: rgba(0,0,0,.25); padding: 13px 0;
  border-top: 1px solid rgba(255,255,255,.07);
}
.sp-copyright { color: rgba(255,255,255,.65); font-size: 13px; font-family: var(--font-bn); }

/* ╔══════════════════════════════════════════════════════════╗
   ║  SCROLL TO TOP                                           ║
   ╚══════════════════════════════════════════════════════════╝ */
#scrollToTop {
  display: none; position: fixed;
  bottom: 26px; right: 26px; z-index: 9999;
  width: 44px; height: 44px; border-radius: 50%;
  background: var(--gv-green); color: #fff;
  border: 2px solid rgba(255,255,255,.3);
  box-shadow: var(--gv-shadow-md);
  cursor: pointer; font-size: 16px;
  transition: background var(--gv-trans), transform var(--gv-trans);
}
#scrollToTop:hover { background: var(--gv-green-d); transform: translateY(-3px); }

/* ╔══════════════════════════════════════════════════════════╗
   ║  RESPONSIVE                                              ║
   ╚══════════════════════════════════════════════════════════╝ */
/* Shrink nav item spacing before the lg breakpoint kicks in, so the full menu keeps
   fitting on one row at higher browser zoom levels (zoom shrinks the effective CSS
   viewport width without triggering the navbar-expand-lg hamburger collapse). */
@media (min-width: 992px) and (max-width: 1600px) {
  .hdr-nav-list .nav-link {
    padding: 14px 7px !important;
    font-size: 13.5px;
  }
}
@media (max-width: 991.98px) {
  .hdr-nav .container { padding: 4px 12px; }
}
@media (max-width: 767px) {
  /* Header */
  .hdr-topbar { display: none; }
  .hdr-logo-img, .hdr-emblem-img { width: 52px; height: 52px; }
  .hdr-org-name { font-size: 20px; }
  .hdr-logo-link { gap: 8px; }
  .hdr-logo-row { padding: 7px 0; }

  /* Slider */
  .tg-homeslider .item figure img { max-height: 200px; }
  .tg-slidercontent { padding: 40px 16px 18px; }
  .tg-slidercontentbox h1 { font-size: 15px; line-height: 1.4; }
  .tg-homebannervtwo .tg-btnprev,
  .tg-homebannervtwo .tg-btnnext { width: 32px; height: 32px; line-height: 32px; font-size: 14px; }

  /* Main columns */
  .tg-main { padding: 10px 0; }
  .tg-content, .tg-widget { padding: 12px; }

  /* Welcome greeting — remove fixed height on mobile */
  .tg-welcomeandgreeting.tg-welcomeandgreeting-v2 { height: auto; }
  .messageHi { max-height: none !important; height: auto !important; flex: none; }
  .hinfoh   { max-height: none !important; height: auto !important; flex: none; }

  /* Widget titles */
  .tg-widgettitle h3 { font-size: 15px; }

  /* Gallery */
  .gallery-img-wrapper { height: 90px; }

  /* Stats */
  .stats-section { padding: 12px 10px; }
  .stats-section .tg-faculty h2 { font-size: 22px !important; }

  /* Ticker */
  .hdr-ticker { font-size: 13px; }
  .ticker-label { font-size: 12px; padding: 0 8px; }
}

@media (max-width: 576px) {
  /* Header logo even smaller on phones */
  .hdr-logo-img, .hdr-emblem-img { width: 42px; height: 42px; }
  .hdr-org-name { font-size: 15px; line-height: 1.25; }
  .hdr-logo-link { gap: 6px; }
  .hdr-logo-row { padding: 6px 0; }

  /* Slider */
  .tg-homeslider .item figure img { max-height: 160px; }
  .tg-slidercontent { padding: 30px 12px 14px; }
  .tg-slidercontentbox h1 { font-size: 13px; }
  .tg-homebannervtwo .tg-btnprev,
  .tg-homebannervtwo .tg-btnnext { width: 26px; height: 26px; line-height: 26px; font-size: 12px; }

  /* Center col6 padding override */
  #tg-content.row .col-lg-6,
  .tg-twocolumns .col-lg-6 { padding-right: 0; }

  /* Row gap tighter on phone */
  #tg-content.row { --bs-gutter-x: 0.25rem; }

  /* Member cards */
  .member-card-image img { width: 90px; height: 90px; }
  .member-name { font-size: 13px; }
  .member-position { font-size: 12px; }

  /* Councillor thumb */
  .tg-campusleftthumb .tg-featuredimg img { width: 50px; height: 50px; }

  /* Bani text */
  .bani { font-size: 15px !important; }
}

@media print {
  .hdr-nav, .hdr-topbar, .hdr-ticker, #scrollToTop, .sp-footer { display: none !important; }
  #tg-header { position: static !important; }
}

.bani {
    font-size: 18px !important;
    line-height: 1.7 !important;
    color: #374151 !important;
    max-height: 225px;
    overflow: hidden;
}