/* =============================================
   BPPIMT Style Override — Header & Menu Only
   v8 — clean HTML structure, precise CSS
   ============================================= */

/* -----------------------------------------------
   LOGO
----------------------------------------------- */

.site-logo-link {
  display: block !important;
  text-decoration: none !important;
}

.site-logo {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
}

.site-logo-icon {
  flex-shrink: 0 !important;
  display: flex !important;
  align-items: center !important;
}

.site-logo-icon svg {
  width: 72px !important;
  height: 72px !important;
  display: block !important;
}

.site-logo-text {
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  gap: 2px !important;
}

.logo-name {
  display: block !important;
  font-family: 'Inter', sans-serif !important;
  font-size: 18px !important;
  font-weight: 700 !important;
  color: #fff !important;
  line-height: 1.2 !important;
}

.logo-campus {
  display: block !important;
  font-family: 'Inter', sans-serif !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  color: #fab325 !important;
  line-height: 1.3 !important;
}

.logo-affil {
  display: block !important;
  font-family: 'Inter', sans-serif !important;
  font-size: 11px !important;
  font-weight: 400 !important;
  font-style: italic !important;
  color: rgba(255,255,255,0.7) !important;
  line-height: 1.4 !important;
}

@media only screen and (max-width: 767px) {
  .site-logo-icon svg { width: 48px !important; height: 48px !important; }
  .site-logo { gap: 8px !important; }
  .logo-name { font-size: 12px !important; }
  .logo-campus { font-size: 10px !important; }
  .logo-affil { font-size: 9px !important; }
}

/* -----------------------------------------------
   GLOBAL TYPOGRAPHY — Inter
----------------------------------------------- */

body {
  font-family: 'Inter', sans-serif !important;
  font-size: 14.5px !important;
  line-height: 1.65 !important;
  color: #3f3f46 !important;
}

h1, h2, h3, h4, h5, h6 {
  font-family: 'Inter', sans-serif !important;
  font-weight: 600 !important;
  color: #150447 !important;
  line-height: 1.3 !important;
}

p, li, td, th, label, input, textarea, select, button, a {
  font-family: 'Inter', sans-serif !important;
}

/* -----------------------------------------------
   TOP BAR
----------------------------------------------- */

.top {
  background: #150447 !important;
  padding: 10px 0 !important;
  border-bottom: 3px solid #fab325 !important;
}

/* Right column wrapper */
.top-right-area {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  height: 100%;
  padding-top: 4px;
}

/* Row 1: contact buttons left, social icons right */
.top-contact-row {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 6px;
}

.top-contact-buttons {
  display: flex;
  gap: 6px;
}

/* Individual contact pill buttons */
.top-contact-btn {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  background: rgba(255,255,255,0.1) !important;
  border: 1px solid rgba(255,255,255,0.2) !important;
  border-radius: 5px !important;
  padding: 5px 12px !important;
  font-family: 'Inter', sans-serif !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  color: #fff !important;
  text-decoration: none !important;
  white-space: nowrap !important;
  transition: background 0.15s ease !important;
}

.top-contact-btn:hover {
  background: rgba(255,255,255,0.2) !important;
  color: #fff !important;
  text-decoration: none !important;
}

.top-contact-btn .fa {
  color: #4ca5e9 !important;
  font-size: 14px !important;
}

/* Social icon buttons */
.top-social-icons {
  display: flex;
  align-items: center;
  gap: 5px;
}

.top-social-btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 28px !important;
  height: 28px !important;
  border-radius: 50% !important;
  color: #fff !important;
  font-size: 13px !important;
  text-decoration: none !important;
  transition: transform 0.15s ease, opacity 0.15s ease !important;
}

.top-social-btn:hover {
  transform: translateY(-2px) !important;
  opacity: 0.85 !important;
  color: #fff !important;
}

.top-social-btn.fb { background: #3b5998 !important; }
.top-social-btn.yt { background: #cc0000 !important; }
.top-social-btn.li { background: #0077b5 !important; }

/* Row 2: helpline */
.top-helpline-row {
  display: flex;
  justify-content: flex-end;
}

.help_line {
  background: #e63946 !important;
  font-family: 'Inter', sans-serif !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  padding: 4px 12px !important;
  border-radius: 4px !important;
  letter-spacing: 0.3px !important;
  display: inline-block !important;
  color: #fff !important;
}

/* -----------------------------------------------
   MOBILE CONTACT BAR
----------------------------------------------- */

.mobile-contact-bar { display: none; }

@media only screen and (max-width: 767px) {
  .mobile-contact-bar {
    display: flex !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 4px !important;
    background: #0a0230 !important;
    padding: 5px 10px !important;
    border-bottom: 1px solid rgba(255,255,255,0.1) !important;
  }

  .mobile-contact-bar a {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 4px !important;
    color: #fff !important;
    font-family: 'Inter', sans-serif !important;
    font-size: 11px !important;
    font-weight: 500 !important;
    background: rgba(255,255,255,0.1) !important;
    border: 1px solid rgba(255,255,255,0.15) !important;
    padding: 5px 8px !important;
    border-radius: 4px !important;
    text-decoration: none !important;
    flex: 1 !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
  }

  .mobile-contact-bar a .fa {
    color: #4ca5e9 !important;
    font-size: 14px !important;
    flex-shrink: 0 !important;
  }

  /* Phone buttons — icon only to save space */
  .mobile-contact-bar a.phone-btn span { display: none !important; }
  .mobile-contact-bar a.phone-btn { flex: 0 0 36px !important; }

  .mobile-contact-bar .helpline-btn {
    background: #e63946 !important;
    border-color: #e63946 !important;
  }

  .mobile-contact-bar .helpline-btn .fa { color: #fff !important; }

  /* Hide desktop right column on mobile — contact bar above handles this */
  .top-right-area { display: none !important; }
  .top { padding: 8px 0 !important; border-bottom: none !important; }

  /* Bigger logo on mobile */
  .top .col-md-7 img {
    height: 70px !important;
    width: auto !important;
  }

  /* Stop logo and social cols wrapping to two lines */
  .top > div {
    display: flex !important;
    align-items: center !important;
    flex-wrap: nowrap !important;
  }

  .top .col-md-7 {
    width: auto !important;
    flex: 1 1 auto !important;
    float: none !important;
    padding-right: 8px !important;
  }

  .top .col-md-5 {
    width: auto !important;
    flex: 0 0 auto !important;
    float: none !important;
  }

  .top .col-md-5 .social {
    margin-top: 0 !important;
    display: flex !important;
    align-items: center !important;
  }
}

/* -----------------------------------------------
   MENU BAR
----------------------------------------------- */

.menu-area {
  background: #2750ac !important;
  border: none !important;
  box-shadow: 0 2px 4px rgba(0,0,0,0.25) !important;
}

.mainmenu a,
.navbar-default .navbar-nav > li > a,
.mainmenu ul li a,
.navbar-expand-lg .navbar-nav .nav-link {
  font-family: 'Inter', sans-serif !important;
  font-size: 13.5px !important;
  font-weight: 500 !important;
  color: rgba(255,255,255,0.9) !important;
  padding: 15px 16px !important;
  letter-spacing: 0.2px !important;
  transition: background 0.18s ease !important;
  text-transform: none !important;
}

.mainmenu li a:hover,
.mainmenu li a:focus,
.mainmenu .active a,
.navbar-default .navbar-nav > .show > a,
.navbar-default .navbar-nav > .show > a:focus,
.navbar-default .navbar-nav > .show > a:hover {
  background: rgba(0,0,0,0.15) !important;
  color: #fff !important;
  text-decoration: none !important;
}

.navbar-collapse ul li {
  border-right: 1px solid rgba(255,255,255,0.15) !important;
}

/* -----------------------------------------------
   DROPDOWN MENUS — DESKTOP
----------------------------------------------- */

.mainmenu .collapse ul ul,
.mainmenu .collapse ul ul.dropdown-menu,
.navbar-collapse ul li ul {
  background: #fff !important;
  border-radius: 0 0 6px 6px !important;
  box-shadow: 0 6px 20px rgba(0,0,0,0.15) !important;
  border: none !important;
  border-top: 2px solid #4ca5e9 !important;
  min-width: 220px !important;
  padding: 4px 0 !important;
}

.navbar-collapse ul li ul li a,
.mainmenu .collapse ul ul li a {
  font-family: 'Inter', sans-serif !important;
  font-size: 13.5px !important;
  font-weight: 400 !important;
  color: #150447 !important;
  padding: 9px 18px !important;
  border-bottom: 1px solid #f0f0f0 !important;
  transition: background 0.15s ease, padding-left 0.15s ease !important;
  text-transform: none !important;
}

.navbar-collapse ul li ul li:last-child a,
.mainmenu .collapse ul ul li:last-child a {
  border-bottom: none !important;
}

.mainmenu .collapse ul ul > li:hover > a,
.mainmenu .collapse ul ul ul > li:hover > a {
  background: #eef4ff !important;
  color: #150447 !important;
  padding-left: 22px !important;
}

.mainmenu .collapse ul ul ul,
.mainmenu .collapse ul ul ul.dropdown-menu {
  background: #fff !important;
  border-top: none !important;
}

/* -----------------------------------------------
   MOBILE MENU — dark submenus
----------------------------------------------- */

@media only screen and (max-width: 767px) {
  .navbar-collapse ul li {
    border-right: none !important;
    border-bottom: 1px solid rgba(255,255,255,0.1) !important;
  }

  .mainmenu .collapse ul ul,
  .navbar-collapse ul li ul,
  .mainmenu .collapse ul ul.dropdown-menu {
    background: #1a1060 !important;
    box-shadow: none !important;
    border-radius: 0 !important;
    border-top: none !important;
    border-left: 3px solid #4ca5e9 !important;
  }

  .navbar-collapse ul li ul li a,
  .mainmenu .collapse ul ul li a {
    color: rgba(255,255,255,0.85) !important;
    border-bottom: 1px solid rgba(255,255,255,0.07) !important;
    padding: 9px 18px 9px 24px !important;
    background: transparent !important;
  }

  .navbar-collapse ul li ul li a:hover,
  .mainmenu .collapse ul ul li a:hover {
    background: rgba(255,255,255,0.08) !important;
    color: #fff !important;
    padding-left: 28px !important;
  }
}

/* -----------------------------------------------
   LEFT SIDEBAR — Gallery-style (navy header card)
----------------------------------------------- */

.inner_left {
  background: #fff !important;
  border: 1px solid #e4e4e7 !important;
  border-radius: 10px !important;
  overflow: hidden !important;
  box-shadow: 0 2px 8px rgba(21,4,71,0.06) !important;
}

/* Navy header bar at the top of the sidebar */
.inner_left::before {
  content: 'Navigation' !important;
  display: flex !important;
  align-items: center !important;
  background: #150447 !important;
  color: #fab325 !important;
  font-family: 'Inter', sans-serif !important;
  font-size: 10.5px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 1.5px !important;
  padding: 12px 16px !important;
}

.inner_left ul {
  list-style: none !important;
  padding: 6px 0 !important;
  margin: 0 !important;
}

.inner_left ul li a {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 9px 16px !important;
  font-family: 'Inter', sans-serif !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  color: #3f3f46 !important;
  border-bottom: 1px solid #f4f4f5 !important;
  transition: background 0.12s ease, color 0.12s ease, padding-left 0.12s ease !important;
  text-decoration: none !important;
}

.inner_left ul li:last-child a {
  border-bottom: none !important;
}

/* Show icons from HTML — hide long-arrow, keep meaningful icons */
.inner_left ul li a .fa {
  display: none !important;
}

.inner_left ul li a .fa:not(.fa-long-arrow-right) {
  display: inline-block !important;
  color: #4ca5e9 !important;
  font-size: 11px !important;
  width: 14px !important;
  flex-shrink: 0 !important;
}

/* Chevron on the right */
.inner_left ul li a::after {
  content: '›' !important;
  font-family: sans-serif !important;
  font-size: 18px !important;
  line-height: 1 !important;
  color: #a1a1aa !important;
  margin-left: auto !important;
  transition: color 0.12s ease, transform 0.12s ease !important;
}

.inner_left ul li a:hover::after {
  color: #2750ac !important;
  transform: translateX(2px) !important;
}

.inner_left ul li a:hover {
  background: #eef1fb !important;
  color: #150447 !important;
  padding-left: 22px !important;
  text-decoration: none !important;
}

.inner_left ul li a:hover .fa {
  color: #2750ac !important;
}

/* Active state */
.inner_left ul li.class_active {
  background: transparent !important;
}

.inner_left ul li.class_active a {
  background: #e8edf8 !important;
  color: #150447 !important;
  font-weight: 600 !important;
  border-left: 3px solid #2750ac !important;
  padding-left: 13px !important;
}

.inner_left ul li.class_active a::after {
  color: #2750ac !important;
}

.inner_left ul li.class_active a .fa {
  color: #2750ac !important;
}

/* -----------------------------------------------
   RIGHT SIDEBAR — Card style with icons
----------------------------------------------- */

.inner_left_btn {
  display: flex !important;
  flex-direction: column !important;
  gap: 8px !important;
}

/* Icon cards */
.inner_left_btn .btn {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  width: 100% !important;
  padding: 12px 14px !important;
  font-family: 'Inter', sans-serif !important;
  font-size: 13.5px !important;
  font-weight: 500 !important;
  text-align: left !important;
  border-radius: 8px !important;
  border: 1px solid #d0d5e8 !important;
  background: #f0f3fb !important;
  color: #150447 !important;
  transition: background 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease !important;
  text-decoration: none !important;
  margin: 0 !important;
  box-sizing: border-box !important;
  position: relative !important;
}

.inner_left_btn .btn::after {
  content: '›' !important;
  margin-left: auto !important;
  font-size: 18px !important;
  color: #a1a1aa !important;
  line-height: 1 !important;
  transition: color 0.15s ease, transform 0.15s ease !important;
}

.inner_left_btn .btn:hover {
  background: #e8edf8 !important;
  border-color: #2750ac !important;
  box-shadow: 0 2px 8px rgba(39,80,172,0.12) !important;
  text-decoration: none !important;
  color: #150447 !important;
}

.inner_left_btn .btn:hover::after {
  color: #2750ac !important;
  transform: translateX(2px) !important;
}

/* Alternate filled button — navy */
.inner_left_btn .btn_inner {
  background: #150447 !important;
  color: #fff !important;
  border-color: #150447 !important;
}

.inner_left_btn .btn_inner::before {
  background-color: rgba(255,255,255,0.15) !important;
}

.inner_left_btn .btn_inner::after {
  color: rgba(255,255,255,0.5) !important;
}

.inner_left_btn .btn_inner:hover {
  background: #2750ac !important;
  border-color: #2750ac !important;
  color: #fff !important;
  box-shadow: 0 2px 8px rgba(39,80,172,0.25) !important;
}

.inner_left_btn .btn_inner:hover::after {
  color: rgba(255,255,255,0.8) !important;
}

/* Image tiles */
.btm_bx_right {
  display: block !important;
  position: relative !important;
  overflow: hidden !important;
  border-radius: 8px !important;
  border: 1px solid rgba(255,255,255,0.1) !important;
  height: 140px !important;
  text-decoration: none !important;
  transition: box-shadow 0.18s ease !important;
  margin: 0 !important;
  background: #0d0230 !important;
}

.btm_bx_right:hover {
  box-shadow: 0 6px 20px rgba(0,0,0,0.2) !important;
  text-decoration: none !important;
}

/* Image goes behind — positioned absolute so span can sit on top */
.btm_bx_right img {
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  display: block !important;
  transition: transform 0.3s ease, opacity 0.3s ease !important;
  opacity: 0.85 !important;
  z-index: 0 !important;
}

.btm_bx_right:hover img {
  transform: scale(1.05) !important;
  opacity: 1 !important;
}

/* Span sits on top with gradient */
.btm_bx_right span {
  position: absolute !important;
  bottom: 0 !important;
  left: 0 !important;
  right: 0 !important;
  z-index: 2 !important;
  background: linear-gradient(to top, rgba(13,2,48,0.97) 0%, rgba(13,2,48,0.7) 50%, transparent 100%) !important;
  color: #fff !important;
  font-family: 'Inter', sans-serif !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  padding: 28px 12px 10px !important;
  letter-spacing: 0.2px !important;
  display: flex !important;
  align-items: center !important;
  gap: 6px !important;
}

.btm_bx_right span::before {
  content: '' !important;
  display: inline-block !important;
  width: 3px !important;
  height: 14px !important;
  background: #fab325 !important;
  border-radius: 2px !important;
  flex-shrink: 0 !important;
}

/* -----------------------------------------------
   CONTENT WIDTH — Cap on wide screens
----------------------------------------------- */

.inner_three_st {
  max-width: 1440px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  box-sizing: border-box !important;
  padding-bottom: 40px !important;
}

.inner_three_st::after {
  content: '' !important;
  display: table !important;
  clear: both !important;
}

@media only screen and (min-width: 768px) {
  .inner_three_st {
    padding-left: 24px !important;
    padding-right: 24px !important;
  }
}

/* -----------------------------------------------
   MOBILE COLUMN ORDER
   Content first, then left sidebar, then right
----------------------------------------------- */

@media only screen and (max-width: 767px) {
  .inner_three_st > div > div {
    display: flex !important;
    flex-direction: column !important;
  }

  /* Left sidebar — second */
  .inner_three_st > div > div > .col-md-3:first-child {
    order: 2 !important;
  }

  /* Content — first */
  .inner_three_st > div > div > .col-md-6 {
    order: 1 !important;
    margin-bottom: 24px !important;
  }

  /* Right sidebar — third */
  .inner_three_st > div > div > .col-md-3:last-child {
    order: 3 !important;
  }
}

/* -----------------------------------------------
   CONTENT AREA — Typography & Elements
----------------------------------------------- */

/* Content column */
.col-md-6 {
  font-size: 15px !important;
  line-height: 1.75 !important;
  color: #3f3f46 !important;
}

/* Headings inside content */
.col-md-6 h2 {
  font-size: 22px !important;
  font-weight: 700 !important;
  color: #150447 !important;
  margin-bottom: 14px !important;
  padding-bottom: 10px !important;
  border-bottom: 2px solid #e4e4e7 !important;
}

.col-md-6 h3 {
  font-size: 18px !important;
  font-weight: 600 !important;
  color: #150447 !important;
  margin-top: 24px !important;
  margin-bottom: 10px !important;
}

.col-md-6 h4 {
  font-size: 16px !important;
  font-weight: 600 !important;
  color: #2750ac !important;
  margin-top: 20px !important;
  margin-bottom: 8px !important;
}

.col-md-6 h5 {
  font-size: 15px !important;
  font-weight: 600 !important;
  color: #150447 !important;
  margin-top: 24px !important;
  margin-bottom: 8px !important;
  padding-left: 10px !important;
  border-left: 3px solid #2750ac !important;
}

/* Paragraphs */
.col-md-6 p {
  margin-bottom: 14px !important;
  line-height: 1.75 !important;
}

/* Lists */
.col-md-6 ul {
  padding-left: 0 !important;
  list-style: none !important;
  margin-bottom: 16px !important;
  line-height: 1.75 !important !important;
}

.col-md-6 ul li {
  position: relative !important;
  padding-left: 18px !important;
  margin-bottom: 6px !important;
  font-size: 15px !important;
  color: #3f3f46 !important;
  line-height: 1.7 !important;
}

.col-md-6 ul li::before {
  content: '›' !important;
  position: absolute !important;
  left: 0 !important;
  color: #2750ac !important;
  font-size: 18px !important;
  line-height: 1.4 !important;
  font-weight: 600 !important;
}

/* Section spacing between programme blocks */
.col-md-6 h5 + ul,
.col-md-6 h4 + ul {
  margin-top: 8px !important;
}

/* Buttons — solid filled */
.col-md-6 .btn,
.col-md-6 a.btn,
.col-md-6 .btn-info,
.col-md-6 a.btn-info {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  padding: 8px 22px !important;
  font-family: 'Inter', sans-serif !important;
  font-size: 13.5px !important;
  font-weight: 600 !important;
  border-radius: 6px !important;
  border: 1.5px solid #2750ac !important;
  background: #2750ac !important;
  color: #fff !important;
  text-decoration: none !important;
  transition: background 0.18s ease, box-shadow 0.18s ease, transform 0.18s ease !important;
  margin-bottom: 16px !important;
  box-shadow: 0 2px 6px rgba(39,80,172,0.25) !important;
  letter-spacing: 0.2px !important;
}

.col-md-6 .btn:hover,
.col-md-6 a.btn:hover,
.col-md-6 .btn-info:hover,
.col-md-6 a.btn-info:hover {
  background: #150447 !important;
  border-color: #150447 !important;
  color: #fff !important;
  text-decoration: none !important;
  box-shadow: 0 4px 14px rgba(21,4,71,0.3) !important;
  transform: translateY(-1px) !important;
}

.col-md-6 .btn:active,
.col-md-6 a.btn:active {
  transform: translateY(0px) !important;
  box-shadow: 0 1px 3px rgba(39,80,172,0.15) !important;
}

/* -----------------------------------------------
   INNER PAGE HEADER IMAGE
----------------------------------------------- */

.banner_inner,
.banner_inner2 {
  width: 100% !important;
  max-width: 100% !important;
  height: 40vh !important;
  max-height: 40vh !important;
  overflow: hidden !important;
  margin: 0 !important;
  padding: 0 !important;
  position: relative !important;

  /* ── Fallback pattern background (shows when no <img> is present) ──
     A layered CSS pattern: diagonal ruled lines + a dot grid,
     all rendered in brand navy with gold/blue tinted geometry.
     When a real photo <img> fills the container (object-fit: cover)
     it sits on top via stacking context and hides this entirely.
  */
  background-color: #4ca5e9 !important;
  background-image:
    /* Fine diagonal lines — bottom-left to top-right, white at low opacity */
    repeating-linear-gradient(
      -45deg,
      transparent,
      transparent 18px,
      rgba(255, 255, 255, 0.08) 18px,
      rgba(255, 255, 255, 0.08) 19px
    ),
    /* Coarser diagonal lines — opposite direction, darker blue shadow */
    repeating-linear-gradient(
      45deg,
      transparent,
      transparent 36px,
      rgba(21, 4, 71, 0.07) 36px,
      rgba(21, 4, 71, 0.07) 37px
    ),
    /* Dot grid — gold accent points */
    radial-gradient(
      circle,
      rgba(250, 179, 37, 0.35) 1px,
      transparent 1px
    ) !important;
  background-size:
    19px 19px,
    37px 37px,
    38px 38px !important;
  background-position:
    0 0,
    0 0,
    19px 19px !important;
}

.banner_inner img,
.banner_inner2 img {
  width: 100% !important;
  height: 100% !important;
  max-width: none !important;
  object-fit: cover !important;
  object-position: center top !important;
  display: block !important;
  /* Sits above the pattern background naturally via DOM stacking */
  position: relative !important;
  z-index: 1 !important;
}

/* Gradient overlay — sits above image (z-index 1) via ::after */
.banner_inner::after,
.banner_inner2::after {
  content: '' !important;
  position: absolute !important;
  inset: 0 !important;
  background: linear-gradient(to top, rgba(21,4,71,0.75) 0%, rgba(21,4,71,0.2) 60%, transparent 100%) !important;
  pointer-events: none !important;
  z-index: 2 !important;
}

/* Page title overlay — z-index 3 to sit above gradient overlay (z-index 2) */
.banner_inner h2,
.banner_inner2 h2,
.banner_inner h1,
.banner_inner2 h1 {
  position: absolute !important;
  bottom: 28px !important;
  left: 32px !important;
  right: 32px !important;
  z-index: 3 !important;
  color: #fff !important;
  font-family: 'Inter', sans-serif !important;
  font-size: clamp(20px, 3vw, 36px) !important;
  font-weight: 700 !important;
  text-transform: none !important;
  letter-spacing: 0.3px !important;
  text-shadow: 0 2px 8px rgba(0,0,0,0.3) !important;
  margin: 0 !important;
  padding: 0 !important;
  display: block !important;
  width: auto !important;
  background: none !important;
  background-color: transparent !important;
}

@media only screen and (max-width: 767px) {
  .banner_inner,
  .banner_inner2 {
    height: 22vh !important;
    max-height: 22vh !important;
  }

  .banner_inner h2,
  .banner_inner2 h2,
  .banner_inner h1,
  .banner_inner2 h1 {
    font-size: 18px !important;
    bottom: 16px !important;
    left: 16px !important;
    right: 16px !important;
  }
}

/* -----------------------------------------------
   FOOTER — Redesigned
----------------------------------------------- */

.footer, .bppimt-footer {
  all: unset !important;
}

.bppimt-footer {
  display: block !important;
  width: 100% !important;
  background: #0d0230 !important;
  color: rgba(255,255,255,0.75) !important;
  font-family: 'Inter', sans-serif !important;
  margin-top: 0 !important;
  border-top: 3px solid #fab325 !important;
}

.bppimt-footer-inner {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 40px !important;
  max-width: 1400px !important;
  margin: 0 auto !important;
  padding: 48px 32px !important;
}

/* Columns */
.footer-col {
  flex: 1 !important;
  min-width: 220px !important;
}

.footer-col:first-child {
  flex: 1.2 !important;
}

/* Section headings */
.footer-heading {
  font-family: 'Inter', sans-serif !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 1.5px !important;
  color: #fab325 !important;
  margin: 0 0 14px 0 !important;
  padding: 0 !important;
  border: none !important;
  background: none !important;
}

.footer-heading::after {
  display: none !important;
}

/* Links grid for quick links */
.footer-links-grid {
  display: flex !important;
  gap: 24px !important;
}

/* Footer links */
.footer-links {
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
}

.footer-links li {
  padding: 0 0 8px 0 !important;
  margin: 0 !important;
  line-height: 1.4 !important;
}

.footer-links li::before {
  display: none !important;
  content: none !important;
}

.footer-links li a {
  font-family: 'Inter', sans-serif !important;
  font-size: 13.5px !important;
  color: rgba(255,255,255,0.65) !important;
  text-decoration: none !important;
  transition: color 0.15s ease !important;
  font-weight: 400 !important;
}

.footer-links li a:hover {
  color: #fff !important;
  text-decoration: none !important;
}

/* Map */
.footer-map {
  border-radius: 8px !important;
  overflow: hidden !important;
  border: 1px solid rgba(255,255,255,0.1) !important;
  margin-bottom: 20px !important;
}

.footer-map iframe {
  width: 100% !important;
  height: 160px !important;
  display: block !important;
  border: none !important;
}

/* Newsletter + Social row */
.footer-bottom-row {
  display: flex !important;
  gap: 24px !important;
  align-items: flex-start !important;
}

/* Subscribe button */
.footer-subscribe-btn {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 8px 20px !important;
  background: #2750ac !important;
  color: #fff !important;
  border-radius: 6px !important;
  font-family: 'Inter', sans-serif !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  text-decoration: none !important;
  border: none !important;
  transition: background 0.15s ease, box-shadow 0.15s ease !important;
  box-shadow: 0 2px 8px rgba(39,80,172,0.3) !important;
}

.footer-subscribe-btn:hover {
  background: #150447 !important;
  color: #fff !important;
  text-decoration: none !important;
  box-shadow: 0 4px 14px rgba(21,4,71,0.4) !important;
}

/* Social icons */
.footer-social-icons {
  display: flex !important;
  gap: 10px !important;
}

.footer-social-icon {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 34px !important;
  height: 34px !important;
  border-radius: 50% !important;
  font-size: 15px !important;
  color: #fff !important;
  text-decoration: none !important;
  transition: transform 0.15s ease, box-shadow 0.15s ease !important;
}

.footer-social-icon:hover {
  transform: translateY(-2px) !important;
  text-decoration: none !important;
  color: #fff !important;
}

.footer-social-icon.fb { background: #3b5998 !important; }
.footer-social-icon.yt { background: #cc0000 !important; }
.footer-social-icon.li { background: #0077b5 !important; }

/* Address */
.footer-address {
  font-style: normal !important;
  font-size: 13.5px !important;
  color: rgba(255,255,255,0.65) !important;
  line-height: 1.7 !important;
}

.footer-address p {
  margin-bottom: 8px !important;
  color: rgba(255,255,255,0.65) !important;
  font-size: 13.5px !important;
}

.footer-address strong {
  color: rgba(255,255,255,0.9) !important;
}

.footer-address a {
  color: rgba(255,255,255,0.65) !important;
  text-decoration: none !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  transition: color 0.15s ease !important;
}

.footer-address a:hover {
  color: #fff !important;
  text-decoration: none !important;
}

.footer-address .fa {
  color: #fab325 !important;
  font-size: 13px !important;
}

/* Bottom bar */
.footer-bottom {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  flex-wrap: wrap !important;
  gap: 12px !important;
  padding: 16px 32px !important;
  background: rgba(0,0,0,0.3) !important;
  border-top: 1px solid rgba(255,255,255,0.08) !important;
  font-family: 'Inter', sans-serif !important;
  font-size: 12px !important;
  color: rgba(255,255,255,0.45) !important;
  max-width: 100% !important;
}

.footer-bottom-links {
  display: flex !important;
  gap: 20px !important;
}

.footer-bottom-links a {
  color: rgba(255,255,255,0.45) !important;
  text-decoration: none !important;
  font-size: 12px !important;
  transition: color 0.15s ease !important;
}

.footer-bottom-links a:hover {
  color: rgba(255,255,255,0.8) !important;
}

/* Mobile footer */
@media only screen and (max-width: 767px) {
  .bppimt-footer-inner {
    flex-direction: column !important;
    padding: 32px 16px !important;
    gap: 32px !important;
  }

  .footer-links-grid {
    flex-direction: column !important;
    gap: 0 !important;
  }

  .footer-bottom-row {
    flex-direction: column !important;
    gap: 20px !important;
  }

  .footer-bottom {
    flex-direction: column !important;
    text-align: center !important;
    padding: 16px !important;
  }

  .footer-bottom-links {
    justify-content: center !important;
  }
}

/* -----------------------------------------------
   RIGHT SIDEBAR — Sections & Notices
----------------------------------------------- */

.right-sidebar {
  display: flex !important;
  flex-direction: column !important;
  gap: 24px !important;
}

.right-sidebar-section {
  display: flex !important;
  flex-direction: column !important;
  gap: 8px !important;
}

.right-sidebar-heading {
  font-family: 'Inter', sans-serif !important;
  font-size: 10.5px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 1.5px !important;
  color: #150447 !important;
  margin: 0 0 8px 0 !important;
  padding: 0 0 8px 0 !important;
  border-bottom: 2px solid #fab325 !important;
  background: none !important;
}

/* Icon inside buttons */
.rsb-icon {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 28px !important;
  height: 28px !important;
  border-radius: 6px !important;
  background: rgba(39,80,172,0.12) !important;
  color: #2750ac !important;
  font-size: 13px !important;
  flex-shrink: 0 !important;
  transition: background 0.15s ease !important;
}

.btn_inner .rsb-icon {
  background: rgba(255,255,255,0.15) !important;
  color: #fab325 !important;
}

.inner_left_btn .btn:hover .rsb-icon {
  background: rgba(39,80,172,0.2) !important;
}

/* Notice items */
.rsb-notices {
  display: flex !important;
  flex-direction: column !important;
  gap: 0 !important;
  background: #f8f8fc !important;
  border: 1px solid #e4e4e7 !important;
  border-radius: 8px !important;
  overflow: hidden !important;
}

.rsb-notice-item {
  display: flex !important;
  align-items: flex-start !important;
  gap: 10px !important;
  padding: 10px 12px !important;
  border-bottom: 1px solid #e8e8ee !important;
  text-decoration: none !important;
  transition: background 0.15s ease !important;
}

.rsb-notice-item:last-of-type {
  border-bottom: none !important;
}

.rsb-notice-item:hover {
  background: #eef1fb !important;
  text-decoration: none !important;
}

.rsb-notice-icon {
  color: #fab325 !important;
  font-size: 13px !important;
  flex-shrink: 0 !important;
  margin-top: 2px !important;
}

.rsb-notice-text {
  font-family: 'Inter', sans-serif !important;
  font-size: 12.5px !important;
  color: #3f3f46 !important;
  line-height: 1.5 !important;
  flex: 1 !important;
}

.rsb-notice-new {
  display: inline-block !important;
  background: #e63946 !important;
  color: #fff !important;
  font-size: 9px !important;
  font-weight: 700 !important;
  letter-spacing: 0.5px !important;
  padding: 1px 5px !important;
  border-radius: 3px !important;
  margin-right: 4px !important;
  vertical-align: middle !important;
}

.rsb-notice-chevron {
  color: #a1a1aa !important;
  font-size: 10px !important;
  flex-shrink: 0 !important;
  margin-top: 4px !important;
}

.rsb-notice-item:hover .rsb-notice-chevron {
  color: #2750ac !important;
}

.rsb-no-notices {
  font-size: 13px !important;
  color: #a1a1aa !important;
  padding: 12px !important;
  margin: 0 !important;
}

.rsb-view-all {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 6px !important;
  padding: 9px !important;
  background: #150447 !important;
  color: #fff !important;
  font-family: 'Inter', sans-serif !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  text-decoration: none !important;
  letter-spacing: 0.3px !important;
  transition: background 0.15s ease !important;
}

.rsb-view-all:hover {
  background: #2750ac !important;
  color: #fff !important;
  text-decoration: none !important;
}

/* Tiles section */
.rsb-tiles {
  display: flex !important;
  flex-direction: column !important;
  gap: 8px !important;
}

/* ===============================================
   HOMEPAGE STYLES
=============================================== */

/* --- HERO --- */
.hp-hero {
  position: relative !important;
  width: 100% !important;
  overflow: hidden !important;
}

.hp-hero .carousel-item {
  height: 75vh !important;
  min-height: 400px !important;
  max-height: 700px !important;
}

.hp-hero .carousel-item img {
  width: 100% !important;
  height: 100% !important;
  max-width: none !important;
  object-fit: cover !important;
  object-position: center !important;
}

.hp-hero-overlay {
  position: absolute !important;
  inset: 0 !important;
  background: linear-gradient(to right, rgba(13,2,48,0.7) 0%, rgba(13,2,48,0.2) 60%, transparent 100%) !important;
  pointer-events: none !important;
}

.hp-hero-caption {
  position: absolute !important;
  bottom: 60px !important;
  left: 40px !important;
  right: 35% !important;
  z-index: 2 !important;
}

.hp-hero-caption h2 {
  font-family: 'Inter', sans-serif !important;
  font-size: clamp(18px, 3vw, 36px) !important;
  font-weight: 700 !important;
  color: #fff !important;
  text-shadow: 0 2px 12px rgba(0,0,0,0.4) !important;
  margin: 0 !important;
  line-height: 1.3 !important;
  border: none !important;
  background: none !important;
  padding: 0 !important;
}

/* Carousel controls */
.hp-carousel-ctrl {
  width: 44px !important;
  height: 44px !important;
  background: rgba(255,255,255,0.15) !important;
  border-radius: 50% !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  backdrop-filter: blur(4px) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  transition: background 0.2s ease !important;
}

.hp-carousel-ctrl:hover {
  background: rgba(255,255,255,0.3) !important;
}

.hp-carousel-ctrl .fa {
  color: #fff !important;
  font-size: 16px !important;
}

.carousel-control-prev.hp-carousel-ctrl { left: 16px !important; }
.carousel-control-next.hp-carousel-ctrl { right: 16px !important; }

/* CTA panel */
.hp-hero-cta {
  position: absolute !important;
  top: 50% !important;
  right: 40px !important;
  transform: translateY(-50%) !important;
  width: 260px !important;
  background: rgba(13,2,48,0.88) !important;
  backdrop-filter: blur(12px) !important;
  border: 1px solid rgba(250,179,37,0.3) !important;
  border-radius: 12px !important;
  padding: 24px 20px !important;
  z-index: 10 !important;
  box-shadow: 0 8px 32px rgba(0,0,0,0.3) !important;
}

.hp-cta-title {
  font-family: 'Inter', sans-serif !important;
  font-size: 16px !important;
  font-weight: 700 !important;
  color: #fff !important;
  margin: 0 0 4px 0 !important;
  padding: 0 !important;
  border: none !important;
  background: none !important;
}

.hp-cta-sub {
  font-size: 12px !important;
  color: #fab325 !important;
  margin: 0 0 16px 0 !important;
  font-weight: 500 !important;
  letter-spacing: 0.5px !important;
}

.hp-cta-btn {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  width: 100% !important;
  padding: 10px 16px !important;
  border-radius: 7px !important;
  font-family: 'Inter', sans-serif !important;
  font-size: 13.5px !important;
  font-weight: 600 !important;
  text-decoration: none !important;
  margin-bottom: 8px !important;
  transition: all 0.15s ease !important;
  border: none !important;
  box-sizing: border-box !important;
}

.hp-cta-primary {
  background: #fab325 !important;
  color: #150447 !important;
}

.hp-cta-primary:hover {
  background: #e9a11e !important;
  color: #150447 !important;
  text-decoration: none !important;
  transform: translateY(-1px) !important;
}

.hp-cta-secondary {
  background: rgba(255,255,255,0.1) !important;
  color: #fff !important;
  border: 1px solid rgba(255,255,255,0.2) !important;
}

.hp-cta-secondary:hover {
  background: rgba(255,255,255,0.2) !important;
  color: #fff !important;
  text-decoration: none !important;
}

.hp-cta-divider {
  border-top: 1px solid rgba(255,255,255,0.1) !important;
  margin: 14px 0 12px !important;
}

.hp-cta-contact {
  display: flex !important;
  flex-direction: column !important;
  gap: 6px !important;
}

.hp-cta-contact a {
  font-size: 12px !important;
  color: rgba(255,255,255,0.65) !important;
  text-decoration: none !important;
  display: flex !important;
  align-items: center !important;
  gap: 7px !important;
  transition: color 0.15s ease !important;
}

.hp-cta-contact a:hover { color: #fff !important; }
.hp-cta-contact .fa { color: #fab325 !important; font-size: 11px !important; }

/* --- TICKER --- */
.hp-ticker {
  display: flex !important;
  align-items: center !important;
  background: #150447 !important;
  border-top: 2px solid #fab325 !important;
  border-bottom: 2px solid #fab325 !important;
  height: 40px !important;
  overflow: hidden !important;
}

.hp-ticker-label {
  flex-shrink: 0 !important;
  background: #fab325 !important;
  color: #150447 !important;
  font-family: 'Inter', sans-serif !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 1px !important;
  padding: 0 16px !important;
  height: 100% !important;
  display: flex !important;
  align-items: center !important;
  gap: 6px !important;
  white-space: nowrap !important;
}

.hp-ticker-track-wrap {
  flex: 1 !important;
  overflow: hidden !important;
  height: 100% !important;
  display: flex !important;
  align-items: center !important;
}

.hp-ticker-track {
  display: flex !important;
  align-items: center !important;
  white-space: nowrap !important;
  animation: hp-ticker-scroll 40s linear infinite !important;
}

.hp-ticker-track:hover {
  animation-play-state: paused !important;
}

@keyframes hp-ticker-scroll {
  from { transform: translateX(0); }
  to { transform: translateX(-50%); }
}

.hp-ticker-item {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  padding: 0 8px !important;
  font-family: 'Inter', sans-serif !important;
  font-size: 13px !important;
}

.hp-ticker-item a {
  color: rgba(255,255,255,0.85) !important;
  text-decoration: none !important;
  transition: color 0.15s ease !important;
}

.hp-ticker-item a:hover { color: #fab325 !important; }

.hp-ticker-new {
  background: #e63946 !important;
  color: #fff !important;
  font-size: 9px !important;
  font-weight: 700 !important;
  padding: 1px 5px !important;
  border-radius: 3px !important;
  letter-spacing: 0.5px !important;
}

.hp-ticker-sep {
  color: #fab325 !important;
  font-size: 8px !important;
  padding: 0 12px !important;
  opacity: 0.6 !important;
}

/* --- ABOUT --- */
.hp-about {
  padding: 64px 32px !important;
  background: #fff !important;
}

.hp-about-inner {
  max-width: 1300px !important;
  margin: 0 auto !important;
  display: flex !important;
  gap: 60px !important;
  align-items: center !important;
}

.hp-about-text {
  flex: 1.5 !important;
}

.hp-section-label {
  display: inline-block !important;
  font-family: 'Inter', sans-serif !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 2px !important;
  color: #fab325 !important;
  margin-bottom: 10px !important;
}

.hp-section-title {
  font-family: 'Inter', sans-serif !important;
  font-size: clamp(20px, 2.5vw, 28px) !important;
  font-weight: 700 !important;
  color: #150447 !important;
  margin: 0 0 16px 0 !important;
  line-height: 1.3 !important;
  border: none !important;
  background: none !important;
  padding: 0 !important;
}

.hp-about-text p {
  font-size: 15px !important;
  color: #52525b !important;
  line-height: 1.8 !important;
  margin-bottom: 20px !important;
}

.hp-about-link {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  color: #2750ac !important;
  font-weight: 600 !important;
  font-size: 14px !important;
  text-decoration: none !important;
  border-bottom: 2px solid #2750ac !important;
  padding-bottom: 2px !important;
  transition: color 0.15s ease, border-color 0.15s ease !important;
}

.hp-about-link:hover {
  color: #150447 !important;
  border-color: #150447 !important;
  text-decoration: none !important;
}

.hp-about-stats {
  flex: 1 !important;
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 16px !important;
}

.hp-stat {
  background: #f0f3fb !important;
  border: 1px solid #d0d5e8 !important;
  border-radius: 10px !important;
  padding: 20px 16px !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 4px !important;
  transition: box-shadow 0.15s ease !important;
}

.hp-stat:hover {
  box-shadow: 0 4px 16px rgba(39,80,172,0.12) !important;
}

.hp-stat-number {
  font-family: 'Inter', sans-serif !important;
  font-size: 28px !important;
  font-weight: 800 !important;
  color: #150447 !important;
  line-height: 1 !important;
}

.hp-stat-label {
  font-size: 12px !important;
  color: #71717a !important;
  font-weight: 500 !important;
  line-height: 1.3 !important;
}

/* --- VISION / MISSION / FOUNDER --- */
.hp-vmf {
  background: #4ca5e9 !important;
  padding: 64px 32px !important;
  border-top: 3px solid #150447 !important;
}

.hp-vmf-inner {
  max-width: 1300px !important;
  margin: 0 auto !important;
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  gap: 28px !important;
}

.hp-vmf-card {
  background: #fff !important;
  border: none !important;
  border-radius: 12px !important;
  padding: 28px 24px !important;
  transition: box-shadow 0.2s ease, transform 0.2s ease !important;
  box-shadow: 0 4px 16px rgba(0,0,0,0.12) !important;
}

.hp-vmf-card:hover {
  box-shadow: 0 8px 32px rgba(0,0,0,0.18) !important;
  transform: translateY(-2px) !important;
}

.hp-vmf-card .hp-section-label {
  color: #2750ac !important;
  opacity: 1 !important;
}

.hp-vmf-title {
  font-family: 'Inter', sans-serif !important;
  font-size: 18px !important;
  font-weight: 700 !important;
  color: #150447 !important;
  margin: 0 0 16px 0 !important;
  padding: 0 0 10px 0 !important;
  border-bottom: 2px solid #fab325 !important;
  background: none !important;
}

.hp-vmf-card p {
  font-size: 14px !important;
  color: #3f3f46 !important;
  line-height: 1.75 !important;
  margin-bottom: 12px !important;
}

.hp-founder-content {
  display: flex !important;
  gap: 16px !important;
  align-items: flex-start !important;
}

.hp-founder-img {
  width: 80px !important;
  height: 80px !important;
  border-radius: 50% !important;
  object-fit: cover !important;
  border: 3px solid #2750ac !important;
  flex-shrink: 0 !important;
  max-width: none !important;
}

.hp-founder-name {
  font-weight: 700 !important;
  color: #150447 !important;
  margin-bottom: 2px !important;
  font-size: 14px !important;
}

.hp-founder-dates {
  color: #2750ac !important;
  font-size: 12px !important;
  margin-bottom: 10px !important;
}

.hp-vmf-link {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  color: #2750ac !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  text-decoration: none !important;
  transition: opacity 0.15s ease !important;
}

.hp-vmf-link:hover { opacity: 0.8 !important; text-decoration: none !important; color: #2750ac !important; }

.hp-mission-list {
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
}

.hp-mission-list li {
  font-size: 13.5px !important;
  color: #3f3f46 !important;
  padding: 8px 0 8px 16px !important;
  border-bottom: 1px solid #e8edf8 !important;
  position: relative !important;
  line-height: 1.6 !important;
}

.hp-mission-list li::before {
  content: '' !important;
  position: absolute !important;
  left: 0 !important;
  top: 14px !important;
  width: 4px !important;
  height: 4px !important;
  border-radius: 50% !important;
  background: #2750ac !important;
}

.hp-mission-list li:last-child { border-bottom: none !important; }

/* --- QUICK LINKS BAR --- */
.hp-quicklinks {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex-wrap: wrap !important;
  gap: 0 !important;
  background: #2750ac !important;
  padding: 0 !important;
}

.hp-ql-item {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 16px 28px !important;
  color: rgba(255,255,255,0.85) !important;
  font-family: 'Inter', sans-serif !important;
  font-size: 13.5px !important;
  font-weight: 500 !important;
  text-decoration: none !important;
  border-right: 1px solid rgba(255,255,255,0.15) !important;
  transition: background 0.15s ease, color 0.15s ease !important;
}

.hp-ql-item:last-child { border-right: none !important; }

.hp-ql-item:hover {
  background: rgba(0,0,0,0.15) !important;
  color: #fab325 !important;
  text-decoration: none !important;
}

.hp-ql-item .fa {
  font-size: 15px !important;
  opacity: 0.8 !important;
}

/* --- NOTICE / TABS SECTION --- */
.hp-notice-section {
  background: #f8f8fc !important;
  padding: 60px 32px !important;
}

.hp-notice-inner {
  max-width: 1300px !important;
  margin: 0 auto !important;
  display: grid !important;
  grid-template-columns: 1fr 280px !important;
  gap: 28px !important;
  align-items: start !important;
}

.hp-notice-main {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 0 !important;
  border-radius: 12px !important;
  overflow: hidden !important;
  box-shadow: 0 4px 24px rgba(0,0,0,0.08) !important;
  min-height: 360px !important;
}

.hp-notice-img {
  position: relative !important;
  overflow: hidden !important;
}

.hp-notice-img img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  display: block !important;
}

.hp-notice-img-overlay {
  position: absolute !important;
  inset: 0 !important;
  background: linear-gradient(to right, transparent 60%, rgba(13,2,48,0.3) 100%) !important;
}

/* Tabs */
.hp-tabs-wrap {
  background: #fff !important;
  display: flex !important;
  flex-direction: column !important;
}

.hp-tabs {
  display: flex !important;
  border-bottom: 2px solid #e4e4e7 !important;
}

.hp-tab {
  flex: 1 !important;
  padding: 13px 8px !important;
  font-family: 'Inter', sans-serif !important;
  font-size: 12.5px !important;
  font-weight: 600 !important;
  color: #71717a !important;
  background: none !important;
  border: none !important;
  cursor: pointer !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 6px !important;
  transition: color 0.15s ease, border-color 0.15s ease !important;
  border-bottom: 2px solid transparent !important;
  margin-bottom: -2px !important;
}

.hp-tab:hover { color: #150447 !important; }

.hp-tab.active {
  color: #150447 !important;
  border-bottom-color: #fab325 !important;
}

.hp-panel { display: none !important; flex-direction: column !important; flex: 1 !important; }
.hp-panel.active { display: flex !important; }

.hp-panel-scroll {
  flex: 1 !important;
  overflow-y: auto !important;
  max-height: 260px !important;
  padding: 8px 0 !important;
}

.hp-notice-item {
  display: flex !important;
  align-items: flex-start !important;
  gap: 10px !important;
  padding: 9px 14px !important;
  border-bottom: 1px solid #f4f4f5 !important;
  text-decoration: none !important;
  transition: background 0.15s ease !important;
}

.hp-notice-item:hover {
  background: #f8f8fc !important;
  text-decoration: none !important;
}

.hp-ni-icon {
  color: #fab325 !important;
  font-size: 12px !important;
  flex-shrink: 0 !important;
  margin-top: 3px !important;
}

.hp-notice-item span {
  font-family: 'Inter', sans-serif !important;
  font-size: 13px !important;
  color: #3f3f46 !important;
  line-height: 1.55 !important;
}

.hp-ni-new {
  display: inline-block !important;
  background: #e63946 !important;
  color: #fff !important;
  font-size: 9px !important;
  font-weight: 700 !important;
  padding: 1px 5px !important;
  border-radius: 3px !important;
  margin-right: 5px !important;
  letter-spacing: 0.5px !important;
  vertical-align: middle !important;
}

.hp-no-items {
  font-size: 13px !important;
  color: #a1a1aa !important;
  padding: 16px 14px !important;
  margin: 0 !important;
}

.hp-panel-viewall {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  padding: 11px !important;
  background: #150447 !important;
  color: #fff !important;
  font-family: 'Inter', sans-serif !important;
  font-size: 12.5px !important;
  font-weight: 600 !important;
  text-decoration: none !important;
  transition: background 0.15s ease !important;
  margin-top: auto !important;
}

.hp-panel-viewall:hover {
  background: #2750ac !important;
  color: #fff !important;
  text-decoration: none !important;
}

/* Tiles — match notice box height */
.hp-notice-tiles {
  display: flex !important;
  flex-direction: column !important;
  gap: 12px !important;
  align-self: stretch !important;
}

.hp-tile {
  display: block !important;
  position: relative !important;
  overflow: hidden !important;
  border-radius: 10px !important;
  flex: 1 !important;
  min-height: 140px !important;
  text-decoration: none !important;
  background: #0d0230 !important;
  transition: box-shadow 0.2s ease !important;
  box-shadow: 0 2px 8px rgba(0,0,0,0.1) !important;
}

.hp-tile:hover {
  box-shadow: 0 8px 24px rgba(0,0,0,0.2) !important;
  text-decoration: none !important;
}

.hp-tile img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  display: block !important;
  opacity: 0.8 !important;
  transition: transform 0.3s ease, opacity 0.3s ease !important;
  max-width: none !important;
}

.hp-tile:hover img {
  transform: scale(1.05) !important;
  opacity: 1 !important;
}

.hp-tile-caption {
  position: absolute !important;
  bottom: 0 !important;
  left: 0 !important;
  right: 0 !important;
  z-index: 2 !important;
  background: linear-gradient(to top, rgba(13,2,48,0.95) 0%, rgba(13,2,48,0.5) 60%, transparent 100%) !important;
  color: #fff !important;
  font-family: 'Inter', sans-serif !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  padding: 28px 14px 12px !important;
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
}

.hp-tile-caption::before {
  content: '' !important;
  display: inline-block !important;
  width: 3px !important;
  height: 16px !important;
  background: #fab325 !important;
  border-radius: 2px !important;
  flex-shrink: 0 !important;
}

/* NEW tag — white text */
.hp-ni-new,
.rsb-notice-new {
  background: #e63946 !important;
  color: #fff !important;
  font-size: 9px !important;
  font-weight: 700 !important;
  padding: 2px 5px !important;
  border-radius: 3px !important;
  letter-spacing: 0.5px !important;
  display: inline-block !important;
  vertical-align: middle !important;
  margin-right: 4px !important;
  line-height: 1.4 !important;
}

/* Quick links — wrap on mobile */
@media only screen and (max-width: 767px) {
  .hp-hero .carousel-item { height: 55vw !important; min-height: 220px !important; }
  .hp-hero-cta { display: none !important; }

  /* Mobile hero — bottom gradient instead of side, better for portrait */
  .hp-hero-overlay {
    background: linear-gradient(to top, rgba(13,2,48,0.8) 0%, rgba(13,2,48,0.15) 50%, transparent 100%) !important;
  }

  .hp-hero-caption {
    bottom: 20px !important;
    left: 16px !important;
    right: 16px !important;
  }

  .hp-hero-caption h2 {
    font-size: 16px !important;
    line-height: 1.4 !important;
  }

  .hp-quicklinks {
    justify-content: flex-start !important;
    overflow-x: visible !important;
    flex-wrap: wrap !important;
  }

  .hp-ql-item {
    flex: 1 1 45% !important;
    padding: 12px 14px !important;
    border-right: none !important;
    border-bottom: 1px solid rgba(255,255,255,0.1) !important;
    font-size: 12.5px !important;
  }

  .hp-about-inner { flex-direction: column !important; gap: 32px !important; }
  .hp-about { padding: 40px 16px !important; }
  .hp-about-stats { grid-template-columns: 1fr 1fr !important; }
  .hp-vmf { padding: 40px 16px !important; }
  .hp-vmf-inner { grid-template-columns: 1fr !important; }
  .hp-notice-section { padding: 40px 16px !important; }
  .hp-notice-inner { grid-template-columns: 1fr !important; }
  .hp-notice-main { grid-template-columns: 1fr !important; }
  .hp-notice-img { height: 180px !important; }

  .hp-notice-tiles {
    flex-direction: row !important;
  }

  .hp-tile {
    min-height: 160px !important;
  }
}

/* ===============================================
   ADMISSION ENQUIRY SECTION
=============================================== */

.hp-enquiry {
  background: #fff !important;
  padding: 80px 32px !important;
  position: relative !important;
  overflow: hidden !important;
  border-top: 4px solid #4ca5e9 !important;
}

/* Geometric background accent */
.hp-enquiry::before {
  content: '' !important;
  position: absolute !important;
  top: -80px !important;
  right: -80px !important;
  width: 500px !important;
  height: 500px !important;
  border-radius: 50% !important;
  background: radial-gradient(circle, rgba(76,165,233,0.08) 0%, transparent 70%) !important;
  pointer-events: none !important;
}

.hp-enquiry::after {
  content: '' !important;
  position: absolute !important;
  bottom: -100px !important;
  left: -60px !important;
  width: 400px !important;
  height: 400px !important;
  border-radius: 50% !important;
  background: radial-gradient(circle, rgba(21,4,71,0.05) 0%, transparent 70%) !important;
  pointer-events: none !important;
}

.hp-enquiry-inner {
  max-width: 1300px !important;
  margin: 0 auto !important;
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 72px !important;
  align-items: start !important;
  position: relative !important;
  z-index: 1 !important;
}

/* Left column */
.hp-enq-label {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  background: #4ca5e9 !important;
  color: #fff !important;
  font-family: 'Inter', sans-serif !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 1.5px !important;
  padding: 5px 14px !important;
  border-radius: 20px !important;
  margin-bottom: 16px !important;
}

.hp-enq-title {
  font-family: 'Inter', sans-serif !important;
  font-size: clamp(24px, 3vw, 36px) !important;
  font-weight: 800 !important;
  color: #150447 !important;
  line-height: 1.25 !important;
  margin: 0 0 16px 0 !important;
  padding: 0 !important;
  border: none !important;
  background: none !important;
}

.hp-enq-sub {
  font-size: 15px !important;
  color: #52525b !important;
  line-height: 1.75 !important;
  margin-bottom: 36px !important;
  border-left: 3px solid #4ca5e9 !important;
  padding-left: 16px !important;
}

.hp-enq-stats {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 16px !important;
  margin-bottom: 32px !important;
}

.hp-enq-stat {
  background: linear-gradient(135deg, #f0f6fc 0%, #e8f4fb 100%) !important;
  border: 1px solid rgba(76,165,233,0.25) !important;
  border-radius: 10px !important;
  padding: 18px 16px !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 4px !important;
}

.hp-enq-stat-num {
  font-family: 'Inter', sans-serif !important;
  font-size: 30px !important;
  font-weight: 800 !important;
  color: #150447 !important;
  line-height: 1 !important;
}

.hp-enq-stat-lbl {
  font-size: 12px !important;
  color: #52525b !important;
  font-weight: 500 !important;
  line-height: 1.4 !important;
}

.hp-enq-badges {
  display: flex !important;
  flex-direction: column !important;
  gap: 10px !important;
}

.hp-enq-badge {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  font-size: 13.5px !important;
  color: #3f3f46 !important;
  font-family: 'Inter', sans-serif !important;
}

.hp-enq-badge .fa {
  color: #4ca5e9 !important;
  font-size: 15px !important;
  flex-shrink: 0 !important;
}

/* Right column — form card */
.hp-enq-form-card {
  background: #fff !important;
  border: 1px solid #e4e4e7 !important;
  border-radius: 16px !important;
  padding: 36px 32px !important;
  box-shadow: 0 8px 40px rgba(21,4,71,0.08), 0 2px 8px rgba(76,165,233,0.08) !important;
  border-top: 4px solid #fab325 !important;
}

.hp-enq-form-title {
  font-family: 'Inter', sans-serif !important;
  font-size: 18px !important;
  font-weight: 700 !important;
  color: #150447 !important;
  margin: 0 0 6px 0 !important;
  padding: 0 !important;
  border: none !important;
  background: none !important;
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
}

.hp-enq-form-title .fa {
  color: #fab325 !important;
  font-size: 16px !important;
}

.hp-enq-form-sub {
  font-size: 13px !important;
  color: #71717a !important;
  margin-bottom: 24px !important;
  padding-bottom: 20px !important;
  border-bottom: 1px solid #f4f4f5 !important;
}

.hp-enq-row {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 16px !important;
}

.hp-enq-field {
  margin-bottom: 16px !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 5px !important;
}

.hp-enq-field label {
  font-family: 'Inter', sans-serif !important;
  font-size: 12.5px !important;
  font-weight: 600 !important;
  color: #3f3f46 !important;
  margin: 0 !important;
}

.hp-enq-field label span {
  color: #e63946 !important;
}

.hp-enq-field .form-control {
  border: 1px solid #d4d4d8 !important;
  border-radius: 7px !important;
  font-size: 13.5px !important;
  padding: 9px 12px !important;
  color: #3f3f46 !important;
  font-family: 'Inter', sans-serif !important;
  transition: border-color 0.15s ease, box-shadow 0.15s ease !important;
  height: auto !important;
}

.hp-enq-field .form-control:focus {
  border-color: #4ca5e9 !important;
  box-shadow: 0 0 0 3px rgba(76,165,233,0.15) !important;
  outline: none !important;
}

.hp-enq-captcha-row {
  display: flex !important;
  gap: 10px !important;
  align-items: center !important;
}

.hp-enq-captcha-img {
  border-radius: 6px !important;
  border: 1px solid #d4d4d8 !important;
  height: 38px !important;
  flex-shrink: 0 !important;
}

.hp-enq-submit {
  width: 100% !important;
  padding: 13px !important;
  background: #fab325 !important;
  color: #150447 !important;
  font-family: 'Inter', sans-serif !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  border: none !important;
  border-radius: 8px !important;
  cursor: pointer !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  transition: background 0.15s ease, transform 0.15s ease, box-shadow 0.15s ease !important;
  box-shadow: 0 4px 14px rgba(250,179,37,0.35) !important;
  margin-top: 8px !important;
}

.hp-enq-submit:hover {
  background: #e9a11e !important;
  transform: translateY(-1px) !important;
  box-shadow: 0 6px 20px rgba(250,179,37,0.45) !important;
}

/* Mobile */
@media only screen and (max-width: 767px) {
  .hp-enquiry { padding: 48px 16px !important; }
  .hp-enquiry-inner { grid-template-columns: 1fr !important; gap: 40px !important; }
  .hp-enq-stats { grid-template-columns: 1fr 1fr !important; }
  .hp-enq-row { grid-template-columns: 1fr !important; }
  .hp-enq-form-card { padding: 24px 20px !important; }
}

/* ===============================================
   MOBILE CTA SECTION
=============================================== */
.hp-mobile-cta {
  display: none !important;
  background: #150447 !important;
  border-bottom: 3px solid #fab325 !important;
  padding: 20px 16px !important;
}

.hp-mobile-cta-inner {
  display: flex !important;
  flex-direction: column !important;
  gap: 16px !important;
}

.hp-mobile-cta-text h3 {
  font-family: 'Inter', sans-serif !important;
  font-size: 18px !important;
  font-weight: 700 !important;
  color: #fff !important;
  margin: 0 0 4px 0 !important;
  padding: 0 !important;
  border: none !important;
  background: none !important;
}

.hp-mobile-cta-text p {
  font-size: 13px !important;
  color: #fab325 !important;
  margin: 0 !important;
  font-weight: 500 !important;
}

.hp-mobile-cta-actions {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 10px !important;
}

.hp-mobile-cta-actions .hp-cta-btn {
  justify-content: center !important;
  margin-bottom: 0 !important;
}

.hp-mobile-cta-contact {
  display: flex !important;
  gap: 16px !important;
  flex-wrap: wrap !important;
  padding-top: 4px !important;
  border-top: 1px solid rgba(255,255,255,0.1) !important;
}

.hp-mobile-cta-contact a {
  font-size: 13px !important;
  color: rgba(255,255,255,0.7) !important;
  text-decoration: none !important;
  display: flex !important;
  align-items: center !important;
  gap: 7px !important;
}

.hp-mobile-cta-contact a:hover { color: #fff !important; }
.hp-mobile-cta-contact .fa { color: #4ca5e9 !important; font-size: 12px !important; }

@media only screen and (max-width: 767px) {
  .hp-mobile-cta { display: block !important; }
  .hp-ticker-label-text { display: none !important; }
}

/* ===============================================
   HEADER & NAVIGATION
=============================================== */

/* Remove old top/mobile-contact-bar styles that conflict */
.top { display: none !important; }
.mobile-contact-bar { display: none !important; }
.menu-area { display: none !important; }

.bpp-header {
  position: relative !important;
  z-index: 1000 !important;
  width: 100% !important;
  font-family: 'Inter', sans-serif !important;
}

/* --- ROW 1: TOP BAR --- */
.bpp-topbar {
  background: #f0f6fc !important;
  overflow: hidden !important;
  border-bottom: 1px solid #d0e8f7 !important;
}

.bpp-topbar-inner {
  max-width: 1400px !important;
  margin: 0 auto !important;
  padding: 0 24px !important;
  height: 100% !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 16px !important;
}

.bpp-topbar-left {
  display: flex !important;
  align-items: center !important;
  gap: 4px !important;
}

.bpp-topbar-link {
  font-size: 12px !important;
  color: #3f3f46 !important;
  text-decoration: none !important;
  display: flex !important;
  align-items: center !important;
  gap: 5px !important;
  padding: 0 8px !important;
  transition: color 0.15s ease !important;
  white-space: nowrap !important;
}
.bpp-topbar-link:hover { color: #150447 !important; text-decoration: none !important; }
.bpp-topbar-link .fa { font-size: 11px !important; color: #4ca5e9 !important; }

.bpp-topbar-div { color: #d0d0d8 !important; font-size: 11px !important; }

.bpp-topbar-right {
  display: flex !important;
  align-items: center !important;
  gap: 16px !important;
}

.bpp-helpline {
  font-size: 11.5px !important;
  color: #150447 !important;
  font-weight: 600 !important;
  display: flex !important;
  align-items: center !important;
  gap: 6px !important;
  white-space: nowrap !important;
}
.bpp-helpline .fa { color: #4ca5e9 !important; }

.bpp-topbar-social { display: flex !important; align-items: center !important; gap: 4px !important; }

.bpp-social-btn {
  width: 26px !important;
  height: 26px !important;
  border-radius: 50% !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 12px !important;
  color: #fff !important;
  text-decoration: none !important;
  transition: transform 0.15s ease, opacity 0.15s ease !important;
  opacity: 0.85 !important;
}
.bpp-social-btn:hover { opacity: 1 !important; transform: translateY(-1px) !important; color: #fff !important; text-decoration: none !important; }
.bpp-social-btn.fb { background: #3b5998 !important; }
.bpp-social-btn.yt { background: #cc0000 !important; }
.bpp-social-btn.li { background: #0077b5 !important; }

/* --- ROW 2: LOGO BAR --- */
.bpp-logobar {
  background: #fff !important;
  border-bottom: 2px solid #4ca5e9 !important;
  overflow: hidden !important;
}

.bpp-logobar-inner {
  max-width: 1400px !important;
  margin: 0 auto !important;
  padding: 8px 24px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 24px !important;
}

/* Logo */
.bpp-logo {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  text-decoration: none !important;
  flex-shrink: 1 !important;
  min-width: 0 !important;
}
.bpp-logo:hover { text-decoration: none !important; }

.bpp-logo-icon {
  width: 80px !important;
  height: 80px !important;
  flex-shrink: 0 !important;
}
.bpp-logo-icon img {
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
  display: block !important;
}

.bpp-logo-text {
  display: flex !important;
  flex-direction: column !important;
  gap: 2px !important;
  min-width: 0 !important;
}

.bpp-logo-name {
  font-size: 16px !important;
  font-weight: 800 !important;
  color: #150447 !important;
  line-height: 1.3 !important;
  white-space: normal !important;
}

.bpp-logo-campus {
  font-size: 13px !important;
  color: #2750ac !important;
  font-weight: 600 !important;
  line-height: 1.3 !important;
}

.bpp-logo-affil {
  font-size: 11px !important;
  color: #71717a !important;
  font-weight: 400 !important;
  line-height: 1.4 !important;
}

/* CTA buttons in logobar */
.bpp-logobar-cta {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  flex-shrink: 0 !important;
}

.bpp-apply-btn {
  display: inline-flex !important;
  align-items: center !important;
  gap: 7px !important;
  padding: 10px 20px !important;
  background: #fab325 !important;
  color: #150447 !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  border-radius: 7px !important;
  text-decoration: none !important;
  white-space: nowrap !important;
  transition: background 0.15s ease, box-shadow 0.15s ease, transform 0.15s ease !important;
  box-shadow: 0 2px 8px rgba(250,179,37,0.3) !important;
}
.bpp-apply-btn:hover {
  background: #e9a11e !important;
  color: #150447 !important;
  text-decoration: none !important;
  transform: translateY(-1px) !important;
  box-shadow: 0 4px 14px rgba(250,179,37,0.4) !important;
}


/* --- ROW 3: STICKY NAV BAR --- */
.bpp-navbar {
  background: #150447 !important;
  box-shadow: 0 2px 16px rgba(21,4,71,0.2) !important;
  border-top: none !important;
  border-bottom: 3px solid #fab325 !important;
}

.bpp-navbar.is-fixed {
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  z-index: 1000 !important;
  box-shadow: 0 4px 24px rgba(21,4,71,0.3) !important;
}

.bpp-navbar-placeholder {
  display: none;
  height: 53px;
}

.bpp-navbar-inner {
  max-width: 1400px !important;
  margin: 0 auto !important;
  padding: 0 24px !important;
  height: 50px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
}

/* Desktop nav */
.bpp-nav {
  display: flex !important;
  flex: 1 !important;
}

.bpp-nav-list {
  display: flex !important;
  align-items: center !important;
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
  gap: 0 !important;
  width: 100% !important;
  justify-content: space-between !important;
}

.bpp-nav-item { position: relative !important; }

.bpp-nav-link {
  display: flex !important;
  align-items: center !important;
  gap: 5px !important;
  padding: 0 14px !important;
  height: 50px !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  color: rgba(255,255,255,0.88) !important;
  text-decoration: none !important;
  white-space: nowrap !important;
  transition: color 0.15s ease, background 0.15s ease !important;
  border-bottom: 3px solid transparent !important;
  border-left: 3px solid transparent !important;
  margin-bottom: -3px !important;
  letter-spacing: 0.2px !important;
}
.bpp-nav-link .fa-chevron-down {
  font-size: 9px !important;
  opacity: 0.5 !important;
  transition: transform 0.2s ease !important;
}
.bpp-nav-item:hover > .bpp-nav-link {
  color: #fff !important;
  background: rgba(76,165,233,0.15) !important;
  border-bottom-color: #4ca5e9 !important;
}
.bpp-nav-item:hover > .bpp-nav-link .fa-chevron-down {
  transform: rotate(180deg) !important;
  opacity: 1 !important;
}

/* Standard dropdown */
.bpp-dropdown {
  position: absolute !important;
  top: calc(100% + 3px) !important;
  left: 0 !important;
  min-width: 240px !important;
  background: #fff !important;
  border: 1px solid #e4e4e7 !important;
  border-top: 3px solid #4ca5e9 !important;
  border-radius: 0 0 8px 8px !important;
  box-shadow: 0 8px 24px rgba(21,4,71,0.12) !important;
  list-style: none !important;
  padding: 6px 0 !important;
  margin: 0 !important;
  opacity: 0 !important;
  visibility: hidden !important;
  transform: translateY(8px) !important;
  transition: opacity 0.18s ease, transform 0.18s ease, visibility 0.18s !important;
  z-index: 200 !important;
}
.bpp-has-dropdown:hover .bpp-dropdown {
  opacity: 1 !important;
  visibility: visible !important;
  transform: translateY(0) !important;
}
.bpp-dropdown li a {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  padding: 9px 16px !important;
  font-size: 13px !important;
  color: #3f3f46 !important;
  text-decoration: none !important;
  transition: background 0.12s ease, color 0.12s ease, padding 0.12s ease !important;
  font-weight: 500 !important;
}
.bpp-dropdown li a .fa { color: #4ca5e9 !important; font-size: 12px !important; width: 16px !important; flex-shrink: 0 !important; }
.bpp-dropdown li a:hover { background: #f0f6fc !important; color: #150447 !important; text-decoration: none !important; padding-left: 20px !important; }

/* Mega menu */
.bpp-mega {
  position: absolute !important;
  top: calc(100% + 3px) !important;
  left: 50% !important;
  transform: translateX(-50%) translateY(8px) !important;
  width: 700px !important;
  background: #fff !important;
  border: 1px solid #e4e4e7 !important;
  border-top: 3px solid #4ca5e9 !important;
  border-radius: 0 0 12px 12px !important;
  box-shadow: 0 12px 40px rgba(21,4,71,0.14) !important;
  padding: 24px !important;
  opacity: 0 !important;
  visibility: hidden !important;
  transition: opacity 0.18s ease, transform 0.18s ease, visibility 0.18s !important;
  z-index: 200 !important;
}
.bpp-has-mega:hover .bpp-mega {
  opacity: 1 !important;
  visibility: visible !important;
  transform: translateX(-50%) translateY(0) !important;
}
/* Left-align mega menu for Academics (3rd item), right-align for Activity (8th item) */
.bpp-nav-list > li:nth-child(3) .bpp-mega {
  left: 0 !important;
  transform: translateX(0) translateY(8px) !important;
}
.bpp-nav-list > li:nth-child(3):hover .bpp-mega {
  transform: translateX(0) translateY(0) !important;
}
.bpp-nav-list > li:nth-child(8) .bpp-mega {
  left: auto !important;
  right: 0 !important;
  transform: translateX(0) translateY(8px) !important;
}
.bpp-nav-list > li:nth-child(8):hover .bpp-mega {
  transform: translateX(0) translateY(0) !important;
}
.bpp-mega-inner {
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  gap: 24px !important;
}
.bpp-mega-heading {
  font-size: 11px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 1px !important;
  color: #150447 !important;
  margin: 0 0 10px 0 !important;
  padding: 0 0 8px 0 !important;
  border-bottom: 2px solid #4ca5e9 !important;
  display: flex !important;
  align-items: center !important;
  gap: 7px !important;
  background: none !important;
}
.bpp-mega-heading .fa { color: #4ca5e9 !important; font-size: 12px !important; }
.bpp-mega-col ul + .bpp-mega-heading { margin-top: 20px !important; }
.bpp-mega-col ul { list-style: none !important; padding: 0 !important; margin: 0 !important; }
.bpp-mega-col ul li a {
  display: block !important;
  padding: 7px 0 7px 10px !important;
  font-size: 13px !important;
  color: #52525b !important;
  text-decoration: none !important;
  border-left: 2px solid transparent !important;
  transition: all 0.12s ease !important;
  font-weight: 500 !important;
  line-height: 1.4 !important;
}
.bpp-mega-col ul li a:hover { color: #150447 !important; border-left-color: #4ca5e9 !important; padding-left: 14px !important; text-decoration: none !important; }

/* Mobile nav left — phone and email icons */
.bpp-mobile-nav-left {
  display: none !important;
  align-items: center !important;
  gap: 4px !important;
}

.bpp-mobile-nav-icon {
  width: 36px !important;
  height: 36px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  color: #fff !important;
  font-size: 15px !important;
  text-decoration: none !important;
  border-radius: 8px !important;
  transition: background 0.15s ease, color 0.15s ease !important;
}
.bpp-mobile-nav-icon:hover { background: rgba(255,255,255,0.15) !important; color: #fab325 !important; text-decoration: none !important; }

/* Hamburger */
.bpp-hamburger {
  display: none !important;
  flex-direction: column !important;
  justify-content: center !important;
  align-items: center !important;
  gap: 5px !important;
  width: 36px !important;
  height: 36px !important;
  background: rgba(76,165,233,0.15) !important;
  border: 1.5px solid rgba(76,165,233,0.5) !important;
  border-radius: 8px !important;
  cursor: pointer !important;
  padding: 0 !important;
  flex-shrink: 0 !important;
  transition: background 0.15s ease !important;
  margin-left: auto !important;
}
.bpp-hamburger:hover { background: rgba(76,165,233,0.3) !important; }
.bpp-hamburger span {
  display: block !important;
  width: 16px !important;
  height: 2px !important;
  background: #fff !important;
  border-radius: 2px !important;
}

/* --- MOBILE DRAWER --- */
.bpp-drawer-overlay {
  position: fixed !important;
  inset: 0 !important;
  background: rgba(0,0,0,0.5) !important;
  z-index: 1100 !important;
  opacity: 0 !important;
  visibility: hidden !important;
  transition: opacity 0.25s ease, visibility 0.25s !important;
  backdrop-filter: blur(2px) !important;
}

.bpp-drawer-overlay-show {
  opacity: 1 !important;
  visibility: visible !important;
}

.bpp-drawer {
  position: fixed !important;
  top: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  width: 320px !important;
  max-width: 90vw !important;
  background: #150447 !important;
  z-index: 1200 !important;
  display: flex !important;
  flex-direction: column !important;
  transform: translateX(100%) !important;
  transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
  overflow: hidden !important;
}

.bpp-drawer-open {
  transform: translateX(0) !important;
}

.bpp-drawer-head {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  padding: 20px 20px 16px !important;
  border-bottom: 1px solid rgba(255,255,255,0.1) !important;
  flex-shrink: 0 !important;
}

.bpp-drawer-logo {
  display: flex !important;
  flex-direction: column !important;
  gap: 4px !important;
  text-decoration: none !important;
}

.bpp-drawer-logo-name {
  font-size: 14px !important;
  font-weight: 800 !important;
  color: #fff !important;
  line-height: 1.35 !important;
}

.bpp-drawer-logo-campus {
  font-size: 12px !important;
  font-weight: 500 !important;
  color: #4ca5e9 !important;
}

.bpp-drawer-close {
  width: 36px !important;
  height: 36px !important;
  background: rgba(255,255,255,0.1) !important;
  border: none !important;
  border-radius: 8px !important;
  color: #fff !important;
  font-size: 16px !important;
  cursor: pointer !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex-shrink: 0 !important;
  transition: background 0.15s ease !important;
}

.bpp-drawer-close:hover { background: rgba(255,255,255,0.2) !important; }

.bpp-drawer-nav {
  flex: 1 !important;
  overflow-y: auto !important;
  padding: 8px 0 !important;
}

.bpp-drawer-list {
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
}

.bpp-drawer-link {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  padding: 13px 20px !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  color: rgba(255,255,255,0.85) !important;
  text-decoration: none !important;
  transition: background 0.12s ease, color 0.12s ease !important;
  border-bottom: 1px solid rgba(255,255,255,0.06) !important;
}

.bpp-drawer-link:hover { background: rgba(255,255,255,0.08) !important; color: #fff !important; text-decoration: none !important; }
.bpp-drawer-link .fa { color: #4ca5e9 !important; font-size: 13px !important; width: 18px !important; }

.bpp-drawer-toggle {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  width: 100% !important;
  padding: 13px 20px !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  color: rgba(255,255,255,0.85) !important;
  background: none !important;
  border: none !important;
  border-bottom: 1px solid rgba(255,255,255,0.06) !important;
  cursor: pointer !important;
  text-align: left !important;
  transition: background 0.12s ease !important;
}

.bpp-drawer-toggle:hover { background: rgba(255,255,255,0.08) !important; color: #fff !important; }
.bpp-drawer-toggle .fa:first-child { color: #4ca5e9 !important; font-size: 13px !important; width: 18px !important; }

.bpp-drawer-chev {
  margin-left: auto !important;
  font-size: 11px !important;
  opacity: 0.6 !important;
  transition: transform 0.2s ease !important;
  flex-shrink: 0 !important;
}

.bpp-drawer-sub {
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
  background: rgba(0,0,0,0.25) !important;
  display: none;
}

.bpp-drawer-sub li a {
  display: block !important;
  padding: 10px 20px 10px 48px !important;
  font-size: 13px !important;
  color: rgba(255,255,255,0.65) !important;
  text-decoration: none !important;
  border-bottom: 1px solid rgba(255,255,255,0.04) !important;
  transition: color 0.12s ease, background 0.12s ease !important;
}

.bpp-drawer-sub li a:hover { color: #fab325 !important; background: rgba(255,255,255,0.05) !important; text-decoration: none !important; }

.bpp-drawer-sub-heading {
  padding: 8px 20px 4px 20px !important;
  font-size: 10px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 1.2px !important;
  color: #fab325 !important;
  opacity: 0.8 !important;
}

.bpp-drawer-foot {
  padding: 14px 20px !important;
  border-top: 1px solid rgba(255,255,255,0.1) !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 8px !important;
  flex-shrink: 0 !important;
  background: rgba(0,0,0,0.2) !important;
}

.bpp-drawer-apply {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  padding: 12px !important;
  background: #fab325 !important;
  color: #150447 !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  border-radius: 8px !important;
  text-decoration: none !important;
  transition: background 0.15s ease !important;
}

.bpp-drawer-apply:hover { background: #e9a11e !important; color: #150447 !important; text-decoration: none !important; }

.bpp-drawer-cet {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  padding: 10px !important;
  background: rgba(255,255,255,0.1) !important;
  color: #fff !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  border-radius: 8px !important;
  text-decoration: none !important;
  border: 1px solid rgba(255,255,255,0.15) !important;
  transition: background 0.15s ease !important;
}

.bpp-drawer-cet:hover { background: rgba(255,255,255,0.15) !important; color: #fff !important; text-decoration: none !important; }

.bpp-drawer-contacts {
  display: flex !important;
  flex-direction: column !important;
  gap: 6px !important;
  padding-top: 10px !important;
  border-top: 1px solid rgba(255,255,255,0.10) !important;
}

.bpp-drawer-contacts a {
  font-size: 12px !important;
  color: rgba(255,255,255,0.55) !important;
  text-decoration: none !important;
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
}

.bpp-drawer-contacts a:hover { color: rgba(255,255,255,0.85) !important; }
.bpp-drawer-contacts .fa { color: #fab325 !important; font-size: 11px !important; }

/* Drawer footer — admission helpline */
.bpp-drawer-helpline {
  margin-top: 0;
  padding-top: 0;
}

.bpp-drawer-helpline > span {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 10px;
  font-weight: 700;
  color: rgba(255,255,255,0.45);
  text-transform: uppercase;
  letter-spacing: 0.08em;
  margin-bottom: 8px;
}

.bpp-drawer-helpline > span .fa {
  color: #fab325 !important;
  font-size: 11px !important;
}

.bpp-drawer-helpline-nums {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 6px;
}

/* Third number spans full width */
.bpp-drawer-helpline-nums a:last-child {
  grid-column: 1 / -1;
}

.bpp-drawer-helpline-nums a {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 6px !important;
  font-size: 12.5px !important;
  font-weight: 700 !important;
  color: #fab325 !important;
  text-decoration: none !important;
  background: rgba(250,179,37,0.10) !important;
  border: 1px solid rgba(250,179,37,0.25) !important;
  border-radius: 7px !important;
  padding: 8px 6px !important;
  transition: background 0.15s ease, border-color 0.15s ease !important;
  white-space: nowrap !important;
}

.bpp-drawer-helpline-nums a .fa {
  font-size: 10px !important;
  color: rgba(250,179,37,0.6) !important;
}

.bpp-drawer-helpline-nums a:hover {
  background: rgba(250,179,37,0.18) !important;
  border-color: rgba(250,179,37,0.45) !important;
  color: #fab325 !important;
  text-decoration: none !important;
}

/* --- RESPONSIVE --- */
@media only screen and (max-width: 1100px) {
  .bpp-nav-link { padding: 0 8px !important; font-size: 12px !important; }
  .bpp-logo-affil { display: none !important; }
}

@media only screen and (max-width: 900px) {
  .bpp-nav { display: none !important; }
  .bpp-mobile-nav-left { display: flex !important; }
  .bpp-hamburger { display: flex !important; }
  .bpp-topbar-left { display: none !important; }
  .bpp-helpline { font-size: 10.5px !important; }
  .bpp-apply-btn { display: none !important; }
  .bpp-navbar-inner {
    justify-content: space-between !important;
  }
}

@media only screen and (max-width: 600px) {
  .bpp-topbar { display: none !important; }
  .bpp-logobar-inner { padding: 8px 16px !important; }
  .bpp-logo-campus { display: block !important; }
  .bpp-logo-affil { display: block !important; }
  .bpp-logo-name { font-size: 13px !important; white-space: normal !important; }
  .bpp-logo-icon { width: 72px !important; height: 72px !important; flex-shrink: 0 !important; }
  .bpp-navbar-inner { padding: 0 16px !important; }
}

/* ===============================================================
   GALLERY PAGES — Shared layout, sidebar & components
   Applies to both gallery.php and video-gallery.php
   =============================================================== */

.gallery-page-wrap {
  background: #f4f6fb;
  min-height: 60vh;
  padding: 36px 0 60px;
}

.gallery-page-inner {
  max-width: 1440px;
  margin: 0 auto;
  padding: 0 24px;
  display: grid;
  grid-template-columns: 240px 1fr;
  gap: 32px;
  align-items: start;
}

/* --- Sidebar --- */
.gallery-sidebar { position: sticky; top: 80px; }

.gallery-sidebar-card {
  background: #fff;
  border: 1px solid #e4e4e7;
  border-radius: 10px;
  overflow: hidden;
  box-shadow: 0 2px 8px rgba(21,4,71,0.06);
  margin-bottom: 20px;
}

.gallery-sidebar-head {
  background: #150447;
  color: #fab325;
  font-size: 10.5px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 1.5px;
  padding: 12px 16px;
  display: flex;
  align-items: center;
  gap: 8px;
}
.gallery-sidebar-head .fa { font-size: 12px; color: #4ca5e9; }

.gallery-sidebar-links { list-style: none; padding: 6px 0; margin: 0; }

.gallery-sidebar-links li a {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 9px 16px;
  font-size: 13px;
  font-weight: 500;
  color: #3f3f46;
  text-decoration: none;
  border-bottom: 1px solid #f4f4f5;
  transition: background 0.12s ease, color 0.12s ease, padding-left 0.12s ease;
}
.gallery-sidebar-links li:last-child a { border-bottom: none; }
.gallery-sidebar-links li a:hover { background: #eef1fb; color: #150447; padding-left: 22px; text-decoration: none; }
.gallery-sidebar-links li a .fa { color: #4ca5e9; font-size: 11px; width: 14px; flex-shrink: 0; }

.gallery-sidebar-links li.active a {
  background: #e8edf8;
  color: #150447;
  font-weight: 600;
  border-left: 3px solid #2750ac;
  padding-left: 13px;
}

.gallery-sidebar-links li.sidebar-divider {
  padding: 8px 16px 4px;
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 1.2px;
  color: #a1a1aa;
  border-bottom: none;
  pointer-events: none;
}

.gallery-sidebar-links li.video-link a { color: #150447; font-weight: 600; }
.gallery-sidebar-links li.video-link a .fa { color: #cc0000; }
.gallery-sidebar-links li.video-link a:hover { background: #fff0f0; color: #cc0000; }

.gallery-sidebar-links li.video-link.active a {
  background: #fff0f0;
  color: #cc0000;
  font-weight: 700;
  border-left: 3px solid #cc0000;
  padding-left: 13px;
}

.gallery-sidebar-cta {
  background: linear-gradient(135deg, #150447 0%, #2750ac 100%);
  border-radius: 10px;
  padding: 24px 16px;
  text-align: center;
  color: #fff;
}
.gallery-sidebar-cta .fa-camera,
.gallery-sidebar-cta .fa-play-circle { font-size: 30px; color: #fab325; margin-bottom: 12px; display: block; }
.gallery-sidebar-cta h4 { font-size: 14px; font-weight: 700; color: #fff; margin: 0 0 6px; }
.gallery-sidebar-cta p { font-size: 12px; color: rgba(255,255,255,0.65); margin: 0 0 14px; line-height: 1.5; }
.gallery-sidebar-cta a {
  display: inline-flex !important; align-items: center !important; gap: 6px !important;
  background: #fab325 !important; color: #150447 !important; font-size: 12.5px !important; font-weight: 700 !important;
  padding: 8px 18px !important; border-radius: 6px !important; text-decoration: none !important;
  transition: background 0.15s ease !important;
}
.gallery-sidebar-cta a:hover { background: #e9a11e !important; color: #150447 !important; text-decoration: none !important; }

/* --- YouTube channel button --- */
.yt-channel-btn {
  display: flex !important; align-items: center !important; justify-content: center !important; gap: 8px !important;
  background: #cc0000 !important; color: #fff !important; padding: 9px 16px !important;
  border-radius: 7px !important; font-size: 13px !important; font-weight: 600 !important;
  text-decoration: none !important; margin-bottom: 0 !important;
  transition: background 0.15s ease, transform 0.15s ease !important;
}
.yt-channel-btn:hover { background: #aa0000 !important; color: #fff !important; text-decoration: none !important; transform: translateY(-1px) !important; }
.yt-channel-btn .fa { font-size: 16px !important; }

/* --- Page Header (shared) --- */
.gallery-page-header {
  display: flex; align-items: flex-end; justify-content: space-between;
  margin-bottom: 24px; padding-bottom: 16px;
  border-bottom: 2px solid #e4e4e7;
  gap: 16px; flex-wrap: wrap;
}
.gallery-page-title span {
  display: block; font-size: 11px; font-weight: 700;
  text-transform: uppercase; letter-spacing: 1.5px; margin-bottom: 4px;
}
.gallery-page-title h1 {
  font-size: 26px; font-weight: 800; color: #150447;
  margin: 0; padding: 0; border: none; background: none; line-height: 1.2;
}
.gallery-album-count,
.gallery-video-count {
  font-size: 12.5px; color: #71717a;
  background: #f0f3fb; border: 1px solid #d0d5e8;
  border-radius: 20px; padding: 5px 14px; white-space: nowrap;
  display: flex; align-items: center; gap: 6px;
}

/* ===============================================================
   PHOTO GALLERY — gallery.php specific
   =============================================================== */

.gallery-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
}

.gallery-album-card {
  background: #fff; border-radius: 12px; overflow: hidden;
  box-shadow: 0 2px 8px rgba(21,4,71,0.07); border: 1px solid #e8e8ee;
  transition: transform 0.22s ease, box-shadow 0.22s ease;
  cursor: pointer; display: block; text-decoration: none;
}
.gallery-album-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 12px 32px rgba(21,4,71,0.14);
  text-decoration: none;
}

.gallery-album-thumb {
  position: relative; overflow: hidden;
  height: 200px; background: #0d0230;
}
.gallery-album-thumb img {
  width: 100%; height: 100%; object-fit: cover; display: block;
  transition: transform 0.4s ease, opacity 0.3s ease; opacity: 0.9;
}
.gallery-album-card:hover .gallery-album-thumb img { transform: scale(1.07); opacity: 1; }

.gallery-album-overlay {
  position: absolute; inset: 0;
  background: linear-gradient(to top, rgba(21,4,71,0.82) 0%, rgba(21,4,71,0.25) 50%, transparent 100%);
  display: flex; align-items: center; justify-content: center;
  opacity: 0; transition: opacity 0.25s ease;
}
.gallery-album-card:hover .gallery-album-overlay { opacity: 1; }

.gallery-album-overlay-icon {
  width: 52px; height: 52px;
  background: rgba(255,255,255,0.15); border: 2px solid rgba(255,255,255,0.6);
  border-radius: 50%; display: flex; align-items: center; justify-content: center;
  color: #fff; font-size: 18px; backdrop-filter: blur(4px);
  transform: scale(0.8); transition: transform 0.25s ease;
}
.gallery-album-card:hover .gallery-album-overlay-icon { transform: scale(1); }

.gallery-album-badge {
  position: absolute; top: 10px; right: 10px;
  background: rgba(21,4,71,0.82); color: #fff;
  font-size: 11px; font-weight: 600; padding: 4px 10px;
  border-radius: 20px; backdrop-filter: blur(4px);
  border: 1px solid rgba(255,255,255,0.15);
  display: flex; align-items: center; gap: 5px; z-index: 2;
}
.gallery-album-badge .fa { color: #fab325; font-size: 10px; }

.gallery-album-strip {
  position: absolute; bottom: 0; left: 0; right: 0; height: 3px;
  background: linear-gradient(to right, #4ca5e9, #fab325);
  transform: scaleX(0); transform-origin: left; transition: transform 0.3s ease;
}
.gallery-album-card:hover .gallery-album-strip { transform: scaleX(1); }

.gallery-album-info { padding: 14px 16px 16px; }

.gallery-album-name {
  font-size: 14px; font-weight: 700; color: #150447;
  line-height: 1.4; margin: 0 0 8px;
  display: flex; align-items: flex-start; gap: 8px;
}
.gallery-album-name::before {
  content: ''; display: inline-block; width: 3px; min-height: 16px;
  background: #4ca5e9; border-radius: 2px; flex-shrink: 0; margin-top: 2px;
}

.gallery-album-view-btn {
  display: inline-flex; align-items: center; gap: 5px;
  font-size: 12px; font-weight: 600; color: #2750ac; text-decoration: none;
  transition: color 0.15s ease, gap 0.15s ease;
}
.gallery-album-view-btn .fa { font-size: 10px; transition: transform 0.15s ease; }
.gallery-album-card:hover .gallery-album-view-btn { color: #150447; gap: 8px; }
.gallery-album-card:hover .gallery-album-view-btn .fa { transform: translateX(3px); }

.gallery-empty {
  grid-column: 1 / -1; text-align: center; padding: 60px 20px; color: #a1a1aa;
}
.gallery-empty .fa { font-size: 48px; margin-bottom: 16px; display: block; opacity: 0.35; }

/* Lightbox overrides */
.mfp-bg { background: rgba(13,2,48,0.95) !important; }
.mfp-title { font-family: 'Inter', sans-serif !important; font-size: 13px !important; color: rgba(255,255,255,0.7) !important; text-align: center !important; }
.mfp-counter { font-family: 'Inter', sans-serif !important; font-size: 12px !important; color: rgba(255,255,255,0.45) !important; }

/* ===============================================================
   VIDEO GALLERY — video-gallery.php specific
   =============================================================== */

.video-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 22px;
}

.video-card {
  background: #fff; border-radius: 12px; overflow: hidden;
  box-shadow: 0 2px 8px rgba(21,4,71,0.07); border: 1px solid #e8e8ee;
  transition: transform 0.22s ease, box-shadow 0.22s ease;
  display: flex; flex-direction: column;
}
.video-card:hover { transform: translateY(-4px); box-shadow: 0 12px 32px rgba(21,4,71,0.14); }

.video-thumb-wrap {
  position: relative; width: 100%; padding-top: 56.25%;
  background: #0d0230; overflow: hidden;
}
.video-thumb-wrap iframe {
  position: absolute; top: 0; left: 0;
  width: 100%; height: 100%; border: none; display: block;
}

.video-thumb-cover {
  position: absolute; inset: 0;
  cursor: pointer; background: #000; z-index: 2;
  transition: opacity 0.2s ease;
}
.video-thumb-cover img {
  width: 100%; height: 100%; object-fit: cover; display: block;
  opacity: 0.88; transition: opacity 0.25s ease;
}
.video-thumb-cover:hover img { opacity: 1; }

.video-play-btn {
  position: absolute; top: 50%; left: 50%;
  transform: translate(-50%, -50%);
  width: 56px; height: 56px;
  background: rgba(204,0,0,0.92); border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  color: #fff; font-size: 20px;
  border: 3px solid rgba(255,255,255,0.7);
  backdrop-filter: blur(2px);
  transition: transform 0.2s ease, background 0.2s ease;
  pointer-events: none; padding-left: 4px;
}
.video-thumb-cover:hover .video-play-btn {
  transform: translate(-50%, -50%) scale(1.1);
  background: rgba(204,0,0,1);
}

.video-duration-badge {
  position: absolute; bottom: 8px; right: 8px;
  background: rgba(0,0,0,0.78); color: #fff;
  font-size: 11px; font-weight: 600; padding: 2px 7px;
  border-radius: 4px; pointer-events: none; z-index: 3;
}

.video-card-strip {
  height: 3px; background: linear-gradient(to right, #cc0000, #fab325);
  transform: scaleX(0); transform-origin: left; transition: transform 0.3s ease;
}
.video-card:hover .video-card-strip { transform: scaleX(1); }

.video-card-info { padding: 14px 16px 16px; flex: 1; display: flex; flex-direction: column; gap: 8px; }

.video-card-title {
  font-size: 13.5px; font-weight: 700; color: #150447;
  line-height: 1.45; margin: 0;
  display: flex; align-items: flex-start; gap: 8px;
}
.video-card-title::before {
  content: ''; display: inline-block; width: 3px; min-height: 16px;
  background: #cc0000; border-radius: 2px; flex-shrink: 0; margin-top: 2px;
}

.video-card-yt-link {
  display: inline-flex; align-items: center; gap: 5px;
  font-size: 12px; font-weight: 600; color: #cc0000;
  text-decoration: none; margin-top: auto;
  transition: color 0.15s ease, gap 0.15s ease;
}
.video-card-yt-link .fa { font-size: 10px; transition: transform 0.15s ease; }
.video-card:hover .video-card-yt-link { gap: 8px; }
.video-card:hover .video-card-yt-link .fa { transform: translateX(3px); }

.video-empty {
  grid-column: 1 / -1; text-align: center; padding: 60px 20px; color: #a1a1aa;
}
.video-empty .fa { font-size: 48px; margin-bottom: 16px; display: block; opacity: 0.35; }
.video-empty p { font-size: 14px; }

/* ===============================================================
   GALLERY PAGES — Responsive breakpoints
   =============================================================== */

@media (max-width: 1100px) {
  .gallery-page-inner { grid-template-columns: 200px 1fr; }
}
@media (max-width: 900px) {
  .gallery-page-inner { grid-template-columns: 1fr; padding: 0 16px; }
  .gallery-sidebar { position: static; display: grid; grid-template-columns: 1fr 1fr; gap: 16px; order: 2; }
  .gallery-main { order: 1; }
  .gallery-grid { grid-template-columns: repeat(2, 1fr); }
  .video-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 600px) {
  .gallery-page-inner { padding: 0 12px; }
  .gallery-grid { grid-template-columns: 1fr; gap: 16px; }
  .video-grid { grid-template-columns: 1fr; gap: 16px; }
  .gallery-sidebar { grid-template-columns: 1fr; }
  .gallery-album-thumb { height: 220px; }
}
/* ===============================================================
   CONTACT PAGE — contact.php
   =============================================================== */

/* Quick-info pill */
.contact-quick-bar {
  background: #f4f5f8;
  padding: 20px 0 0;
  text-align: center;
}
.cqb-pill {
  display: inline-flex;
  flex-wrap: wrap;
  justify-content: center;
  background: #150447;
  border-radius: 60px;
  box-shadow: 0 6px 24px rgba(21,4,71,0.2);
  border: 2px solid rgba(250,179,37,0.4);
  padding: 0 10px;
}
.cqb-item {
  display: flex;
  align-items: center;
  gap: 8px;
  color: rgba(255,255,255,0.9);
  font-size: 13.5px;
  padding: 12px 22px;
  position: relative;
  white-space: nowrap;
}
.cqb-item + .cqb-item::before {
  content: '';
  position: absolute;
  left: 0; top: 22%; height: 56%; width: 1px;
  background: rgba(250,179,37,0.35);
}
.cqb-item .fa { color: #fab325; font-size: 14px; width: 16px; text-align: center; }
.cqb-item a { color: rgba(255,255,255,0.9); text-decoration: none; transition: color 0.15s ease; }
.cqb-item a:hover { color: #fab325; text-decoration: none; }

/* Main section */
.contact-section {
  background: #f4f5f8;
  padding: 20px 0;
}

/* Intro block — h1 styling inherits global Inter/navy,
   only override what differs from the global .col-md-6 h2 rule */
.contact-intro { margin-bottom: 36px; }
.contact-intro h1 {
  font-size: 22px;
  padding-bottom: 10px;
  border-bottom: 2px solid #e4e4e7;
  margin-bottom: 10px;
}
.contact-intro p { max-width: 720px; color: #52525b; }

/* Enquiry topic chips */
.enquiry-chips { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 28px; }
.enquiry-chip {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 8px 16px;
  border-radius: 40px;
  border: 1.5px solid #d1d5db;
  background: #fff;
  font-size: 13px;
  font-weight: 600;
  color: #374151;
  cursor: pointer;
  transition: border-color 0.18s ease, background 0.18s ease, color 0.18s ease, box-shadow 0.18s ease;
  user-select: none;
}
.enquiry-chip .fa { font-size: 13px; color: #2750ac; transition: color 0.18s ease; }
.enquiry-chip:hover,
.enquiry-chip.active {
  border-color: #150447;
  background: #150447;
  color: #fff;
  box-shadow: 0 2px 8px rgba(21,4,71,0.15);
}
.enquiry-chip:hover .fa,
.enquiry-chip.active .fa { color: #fab325; }

/* Form card */
.contact-form-card {
  background: #fff;
  border-radius: 12px;
  padding: 36px 32px;
  box-shadow: 0 2px 16px rgba(21,4,71,0.07);
  border: 1px solid #e8e8ee;
  height: 100%;
}
.contact-form-card .card-heading {
  font-size: 20px;
  font-weight: 700;
  color: #150447;
  margin: 0 0 4px;
  padding-bottom: 12px;
  border-bottom: 2px solid #e4e4e7;
}
.contact-form-card .card-subheading { font-size: 13px; color: #71717a; margin: 8px 0 24px; }
.contact-form-card .form-group { margin-bottom: 18px; }
.contact-form-card label { font-size: 12.5px; font-weight: 600; color: #374151; margin-bottom: 5px; display: block; }
.contact-form-card label .req { color: #e63946; margin-left: 2px; }
.contact-form-card .form-control {
  border: 1.5px solid #e4e4e7;
  border-radius: 7px;
  padding: 10px 13px;
  font-size: 14px;
  color: #111827;
  background: #fafafa;
  transition: border-color 0.18s ease, box-shadow 0.18s ease;
}
.contact-form-card .form-control:focus {
  border-color: #2750ac;
  box-shadow: 0 0 0 3px rgba(39,80,172,0.1);
  background: #fff;
  outline: none;
}
.contact-form-card .form-control.is-error { border-color: #e63946; }
.field-error-msg { display: block; font-size: 11.5px; color: #e63946; margin-top: 4px; }
.contact-form-card textarea.form-control { min-height: 108px; resize: vertical; }
.contact-form-card .btn-submit {
  background: #150447;
  color: #fff;
  border: none;
  border-radius: 7px;
  padding: 11px 28px;
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  transition: background 0.18s ease, transform 0.15s ease;
}
.contact-form-card .btn-submit:hover { background: #fab325; color: #150447; transform: translateY(-1px); }

/* Session alerts — reuse Bootstrap alert colours, just restyle shape */
.contact-alert {
  border-radius: 8px;
  padding: 12px 16px;
  margin-bottom: 20px;
  font-size: 13.5px;
  display: flex;
  align-items: center;
  gap: 9px;
}
.contact-alert.alert-success { background: #ecfdf5; color: #065f46; border: 1px solid #6ee7b7; }
.contact-alert.alert-danger  { background: #fef2f2; color: #991b1b; border: 1px solid #fca5a5; }

/* Info sidebar */
.contact-info-stack { display: flex; flex-direction: column; gap: 18px; }
.contact-info-card,
.contact-map-card {
  background: #fff;
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 2px 16px rgba(21,4,71,0.07);
  border: 1px solid #e8e8ee;
}
.cci-header {
  display: flex;
  align-items: center;
  gap: 11px;
  padding: 15px 20px 13px;
  border-bottom: 1.5px solid #f0f0f4;
}
.cci-icon {
  width: 34px; height: 34px;
  border-radius: 7px;
  background: #150447;
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0;
}
.cci-icon .fa { color: #fab325; font-size: 14px; }
.cci-title { font-size: 15px; font-weight: 700; color: #150447; margin: 0; }

.contact-detail-list { list-style: none; padding: 14px 20px 16px; margin: 0; }
.contact-detail-list li {
  display: flex; align-items: flex-start; gap: 9px;
  font-size: 13.5px; color: #374151;
  padding: 4px 0; line-height: 1.55;
}
.contact-detail-list li .fa { color: #4ca5e9; margin-top: 3px; width: 14px; text-align: center; flex-shrink: 0; font-size: 13px; }
.contact-detail-list li a { color: #374151; text-decoration: none; }
.contact-detail-list li a:hover { color: #150447; }

.hours-badge {
  display: inline-flex; align-items: center; gap: 5px;
  background: #ecfdf5; color: #065f46;
  border: 1px solid #6ee7b7; border-radius: 20px;
  font-size: 11.5px; font-weight: 600;
  padding: 3px 10px; margin-top: 2px;
}
.hours-badge .fa { color: #059669 !important; font-size: 11px !important; width: auto !important; margin: 0 !important; }

.contact-map-card iframe { display: block; width: 100%; height: 220px; border: 0; }

/* Contact page — responsive */
@media (max-width: 991px) {
  .contact-form-card { margin-bottom: 24px; }
}
@media (max-width: 767px) {
  .contact-form-card { padding: 24px 18px; }
  .cqb-pill { border-radius: 16px; flex-direction: column; width: calc(100% - 32px); }
  .cqb-item { justify-content: center; white-space: normal; }
  .cqb-item + .cqb-item::before { top: 0; left: 16px; right: 16px; width: auto; height: 1px; }
  .enquiry-chips { gap: 8px; }
  .enquiry-chip { font-size: 12px; padding: 7px 13px; }
}

/* ===============================================================
   PLACEMENT PAGE — placement.php
   =============================================================== */

/* Chart wrapper */
.placement-chart-wrap {
  margin: 24px 0 20px;
  background: #fff;
  border: 1px solid #e4e4e7;
  border-radius: 10px;
  padding: 20px 16px 16px;
  box-shadow: 0 2px 10px rgba(21,4,71,0.05);
}

/* Stats table */
.placement-table-wrap {
  margin: 20px 0;
  overflow-x: auto;
}

.placement-stats-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 13.5px;
}

.placement-stats-table caption {
  caption-side: top;
  font-size: 12px;
  font-weight: 600;
  color: #71717a;
  text-align: left;
  padding-bottom: 8px;
  letter-spacing: 0.3px;
  text-transform: uppercase;
}

.placement-stats-table th {
  background: #150447;
  color: #fff;
  font-weight: 600;
  padding: 10px 16px;
  text-align: left;
  font-size: 13px;
}

.placement-stats-table td {
  padding: 9px 16px;
  border-bottom: 1px solid #f0f0f4;
  color: #374151;
}

.placement-stats-table tbody tr:nth-child(even) td {
  background: #f8f8fc;
}

.placement-stats-table tbody tr:hover td {
  background: #eef1fb;
}

/* ===============================================================
   ADMISSION PAGE — admission-new.php
   =============================================================== */

.admission-address-block {
  background: #f8f8fc;
  border: 1px solid #e4e4e7;
  border-radius: 8px;
  padding: 16px 20px;
  margin-bottom: 16px;
}

.admission-address-block h5 {
  font-size: 14px;
  font-weight: 700;
  color: #150447;
  margin: 0 0 10px;
  padding-bottom: 8px;
  border-bottom: 1px solid #e4e4e7;
}

.admission-address-block p {
  margin: 0;
  font-size: 13.5px;
  color: #374151;
  line-height: 1.8;
}

.admission-address-block a {
  color: #2750ac;
  text-decoration: none;
}

.admission-address-block a:hover {
  color: #150447;
  text-decoration: underline;
}

.admission-fees-note {
  background: #fffbeb;
  border: 1px solid #fde68a;
  border-radius: 8px;
  padding: 14px 18px;
  font-size: 13.5px;
  color: #374151;
  margin: 16px 0;
}

.admission-fees-note strong { color: #150447; }

.qr-wrap {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 8px;
  margin: 16px 0;
}

.qr-wrap img {
  border: 1px solid #e4e4e7;
  border-radius: 8px;
  padding: 8px;
  background: #fff;
}

.qr-wrap p {
  font-size: 13px;
  color: #71717a;
  margin: 0;
}

/* ===============================================================
   TRAINING & GROOMING PAGE — training.php
   =============================================================== */

.tg-section-title {
  display: block;
  font-size: 15px;
  font-weight: 700;
  color: #150447;
  margin: 28px 0 14px;
  padding-bottom: 8px;
  border-bottom: 2px solid #fab325;
}

/* Stat bar — matches homepage navy cards */
.tg-stat-row {
  display: flex;
  gap: 12px;
  margin: 20px 0 28px;
  flex-wrap: wrap;
}

.tg-stat {
  flex: 1;
  min-width: 90px;
  background: #150447;
  border-radius: 12px;
  padding: 18px 14px;
  text-align: center;
  box-shadow: 0 4px 16px rgba(21,4,71,0.15);
}

.tg-stat-num {
  font-size: 20px;
  font-weight: 700;
  color: #fab325;
  line-height: 1;
  margin-bottom: 6px;
}

.tg-stat-label {
  font-size: 11.5px;
  color: rgba(255,255,255,0.82);
  line-height: 1.45;
}

/* Skill / area cards — matches .hp-vmf-card pattern */
.tg-card-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 14px;
  margin: 0 0 28px;
}

.tg-card {
  background: #fff;
  border-radius: 12px;
  padding: 18px 16px;
  display: flex;
  align-items: center;
  gap: 14px;
  box-shadow: 0 4px 16px rgba(0,0,0,0.08);
  transition: box-shadow 0.2s ease, transform 0.2s ease;
}

.tg-card:hover {
  box-shadow: 0 8px 28px rgba(0,0,0,0.13);
  transform: translateY(-2px);
}

.tg-card-icon {
  width: 38px;
  height: 38px;
  border-radius: 8px;
  background: #150447;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.tg-card-icon .fa {
  color: #fab325;
  font-size: 15px;
}

.tg-card-body h5 {
  font-size: 13px;
  font-weight: 700;
  color: #150447;
  margin: 0 0 5px;
  line-height: 1.3;
}

.tg-card-body p {
  font-size: 12.5px;
  color: #52525b;
  margin: 0;
  line-height: 1.6;
}

/* Steps / timeline */
.tg-steps {
  display: flex;
  flex-direction: column;
  margin: 0 0 20px;
}

.tg-step {
  display: flex;
  gap: 14px;
}

.tg-step-left {
  display: flex;
  flex-direction: column;
  align-items: center;
  flex-shrink: 0;
  width: 34px;
}

.tg-step-num {
  width: 34px;
  height: 34px;
  border-radius: 50%;
  background: #150447;
  color: #fab325;
  font-size: 13px;
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.tg-step-line {
  width: 2px;
  flex: 1;
  min-height: 20px;
  background: #e4e4e7;
  margin: 4px 0;
}

.tg-step:last-child .tg-step-line { display: none; }

.tg-step-body {
  padding: 4px 0 22px;
}

.tg-step-body h5 {
  font-size: 13.5px;
  font-weight: 700;
  color: #150447;
  margin: 0 0 4px;
}

.tg-step-body p {
  font-size: 13px;
  color: #52525b;
  margin: 0;
  line-height: 1.65;
}

@media (max-width: 600px) {
  .tg-card-grid { grid-template-columns: 1fr; }
  .tg-stat-row { flex-direction: column; }
}

/* ===============================================================
   FACILITY PAGE — facility.php
   =============================================================== */

/* Reuses .tg-card-grid, .tg-card, .tg-card-icon, .tg-card-body,
   .tg-section-title, .tg-stat-row, .tg-stat from training page */

/* 3-column grid variant */
.fac-card-grid-3 {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 14px;
  margin: 0 0 28px;
}

/* Single-column grid variant (hostel, cafeteria) */
.fac-card-grid-1 {
  display: grid;
  grid-template-columns: 1fr;
  gap: 14px;
  margin: 0 0 28px;
}

/* Feature list */
.fac-feature-list {
  list-style: none;
  padding: 0;
  margin: 0 0 24px;
}

.fac-feature-list li {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  padding: 9px 0;
  border-bottom: 1px solid #f0f0f4;
  font-size: 13.5px;
  color: #374151;
  line-height: 1.5;
}

.fac-feature-list li:last-child { border-bottom: none; }

.fac-feature-list li .fa {
  color: #2750ac;
  font-size: 14px;
  margin-top: 2px;
  flex-shrink: 0;
  width: 16px;
  text-align: center;
}

/* Payment step cards */
.fac-step-card {
  background: #f8f8fc;
  border: 1px solid #e4e4e7;
  border-left: 3px solid #2750ac;
  border-radius: 8px;
  padding: 12px 16px;
  margin-bottom: 10px;
  display: flex;
  gap: 12px;
  align-items: center;
  font-size: 13.5px;
  color: #374151;
  line-height: 1.55;
}

.fac-step-badge {
  background: #150447;
  color: #fab325;
  font-size: 12px;
  font-weight: 700;
  width: 26px;
  height: 26px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

/* IT Infrastructure title below carousel */
.fac-it-title {
  font-size: 22px;
  font-weight: 700;
  color: #150447;
  margin: 20px 0 4px;
}

/* Health care image */
.fac-img-full {
  width: 100%;
  border-radius: 10px;
  margin: 16px 0;
  box-shadow: 0 2px 12px rgba(21,4,71,0.08);
}

/* Payment buttons */
.fac-pay-btn-row {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
  margin: 16px 0 24px;
}

@media (max-width: 768px) {
  .fac-card-grid-3 { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 480px) {
  .fac-card-grid-3 { grid-template-columns: 1fr; }
  .fac-pay-btn-row { flex-direction: column; }
}

/* ===============================================================
   ACADEMIC PAGE — academic.php
   =============================================================== */

/* Program card */
.acad-program-card {
  background: #fff;
  border-radius: 12px;
  padding: 22px 20px;
  box-shadow: 0 4px 16px rgba(0,0,0,0.08);
  transition: box-shadow 0.2s ease, transform 0.2s ease;
  margin-bottom: 16px;
  border-left: 4px solid #150447;
}

.acad-program-card:hover {
  box-shadow: 0 8px 28px rgba(0,0,0,0.13);
  transform: translateY(-2px);
}

.acad-program-card-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 14px;
  flex-wrap: wrap;
}

.acad-program-title {
  font-size: 15px;
  font-weight: 700;
  color: #150447;
  margin: 0;
}

/* Intake badge — prominent gold pill */
.acad-program-badge {
  background: #fab325;
  color: #150447;
  font-size: 13px;
  font-weight: 700;
  padding: 5px 14px;
  border-radius: 20px;
  white-space: nowrap;
  box-shadow: 0 2px 6px rgba(250,179,37,0.35);
  letter-spacing: 0.2px;
}

/* Meta pills row — more breathing room */
.acad-program-meta {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  margin-bottom: 18px;
}

.acad-meta-pill {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  background: #f0f3fb;
  border: 1px solid #d0d5e8;
  border-radius: 6px;
  padding: 6px 13px;
  font-size: 12.5px;
  color: #374151;
  line-height: 1;
}

.acad-meta-pill .fa {
  color: #2750ac;
  font-size: 12px;
}

.acad-program-actions {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  align-items: center;
  margin-top: 4px;
}

/* Semester info boxes */
.acad-semester-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
  margin: 0 0 24px;
}

.acad-semester-box {
  background: #fff;
  border-radius: 10px;
  border: 1px solid #e4e4e7;
  padding: 16px;
  box-shadow: 0 2px 8px rgba(0,0,0,0.05);
}

.acad-semester-box h5 {
  font-size: 13px;
  font-weight: 700;
  color: #150447;
  margin: 0 0 4px;
  display: flex;
  align-items: center;
  gap: 8px;
}

.acad-semester-box h5 .fa { color: #fab325; }

.acad-semester-box p {
  font-size: 12.5px;
  color: #52525b;
  margin: 0;
}

/* Scholarship / assistantship tables */
.acad-table {
  width: 100%;
  border-collapse: collapse;
  margin: 0 0 28px;
  font-size: 13px;
}

.acad-table thead th {
  background: #150447;
  color: #fff;
  padding: 10px 12px;
  font-weight: 600;
  text-align: left;
  border: none;
}

.acad-table thead th:first-child { border-radius: 8px 0 0 0; }
.acad-table thead th:last-child  { border-radius: 0 8px 0 0; }

.acad-table tbody tr:nth-child(even) td { background: #f8f8fc; }

.acad-table tbody td {
  padding: 10px 12px;
  border-bottom: 1px solid #e4e4e7;
  color: #374151;
  vertical-align: middle;
}

/* Academic calendar image */
.acad-calendar-img {
  display: block;
  width: 100%;
  max-width: 100%;
  height: auto;
  border-radius: 10px;
  box-shadow: 0 2px 12px rgba(21,4,71,0.08);
  margin: 8px 0 20px;
}

/* btn-default override inside col-md-6 — outlined navy style for syllabus buttons */
.col-md-6 .btn.btn-default,
.col-md-6 a.btn.btn-default {
  background: transparent !important;
  border: 1.5px solid #2750ac !important;
  color: #2750ac !important;
  box-shadow: none !important;
}

.col-md-6 .btn.btn-default:hover,
.col-md-6 a.btn.btn-default:hover {
  background: #2750ac !important;
  color: #fff !important;
  box-shadow: 0 4px 14px rgba(39,80,172,0.2) !important;
}

@media (max-width: 600px) {
  .acad-semester-row { grid-template-columns: 1fr; }
  .acad-program-meta { gap: 6px; }
  .acad-program-card-header { flex-direction: column; align-items: flex-start; }
}

/* ===============================================================
   DEPARTMENT PAGES — admission.php
   =============================================================== */

/* --- Info grid (replaces old bordered table) --- */
.dept-info-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
  margin: 0 0 28px;
}

.dept-info-box {
  background: #fff;
  border-radius: 10px;
  border: 1px solid #e4e4e7;
  padding: 14px 16px;
  box-shadow: 0 2px 8px rgba(0,0,0,0.05);
}

.dept-info-box .dept-info-label {
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.6px;
  color: #2750ac;
  margin: 0 0 4px;
}

.dept-info-box .dept-info-value {
  font-size: 13px;
  font-weight: 600;
  color: #150447;
  margin: 0;
  line-height: 1.45;
}

.dept-info-box .dept-info-value a {
  color: #2750ac;
  text-decoration: none;
}

.dept-info-box .dept-info-value a:hover { text-decoration: underline; }

/* --- Career / why cards --- */
.dept-career-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 12px;
  margin: 0 0 24px;
}

.dept-career-card {
  background: #fff;
  border-radius: 10px;
  padding: 16px;
  display: flex;
  align-items: flex-start;
  gap: 12px;
  box-shadow: 0 4px 16px rgba(0,0,0,0.07);
  transition: box-shadow 0.2s ease, transform 0.2s ease;
}

.dept-career-card:hover {
  box-shadow: 0 8px 24px rgba(0,0,0,0.11);
  transform: translateY(-2px);
}

.dept-career-icon {
  width: 36px;
  height: 36px;
  border-radius: 8px;
  background: #150447;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.dept-career-icon .fa { color: #fab325; font-size: 15px; }

.dept-career-card h5 {
  font-size: 13px;
  font-weight: 700;
  color: #150447;
  margin: 0 0 5px;
  line-height: 1.3;
}

.dept-career-card p {
  font-size: 12.5px;
  color: #52525b;
  margin: 0;
  line-height: 1.6;
}

/* --- FAQ accordion --- */
.dept-faq-item {
  border: 1px solid #e4e4e7;
  border-radius: 8px;
  margin-bottom: 8px;
  overflow: hidden;
}

.dept-faq-question {
  background: #f8f8fc;
  padding: 12px 16px;
  font-size: 13.5px;
  font-weight: 700;
  color: #150447;
  cursor: pointer;
  display: flex;
  justify-content: space-between;
  align-items: center;
  user-select: none;
  gap: 12px;
}

.dept-faq-question .fa {
  color: #2750ac;
  font-size: 12px;
  transition: transform 0.2s ease;
  flex-shrink: 0;
}

.dept-faq-question.open .fa { transform: rotate(180deg); }

.dept-faq-answer {
  display: none;
  padding: 12px 16px;
  font-size: 13px;
  color: #374151;
  line-height: 1.7;
  border-top: 1px solid #e4e4e7;
}

.dept-faq-answer ul {
  margin: 6px 0 0;
  padding-left: 18px;
}

.dept-faq-answer ul li { margin-bottom: 4px; }

/* --- Faculty card grid --- */
.faculty-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 16px;
  margin: 0 0 24px;
}

.faculty-card {
  background: #fff;
  border-radius: 12px;
  box-shadow: 0 4px 16px rgba(0,0,0,0.08);
  overflow: hidden;
  display: flex;
  flex-direction: column;
  transition: box-shadow 0.2s ease, transform 0.2s ease;
}

.faculty-card:hover {
  box-shadow: 0 8px 28px rgba(0,0,0,0.13);
  transform: translateY(-2px);
}

.faculty-card-photo {
  width: 100%;
  aspect-ratio: 1 / 1;
  object-fit: cover;
  object-position: top center;
  display: block;
  background: #e8edf8;
}

.faculty-card-body {
  padding: 14px 16px 16px;
  flex: 1;
  display: flex;
  flex-direction: column;
}

.faculty-card-name {
  font-size: 14px;
  font-weight: 700;
  color: #150447;
  margin: 0 0 3px;
  line-height: 1.3;
}

.faculty-card-desig {
  font-size: 12px;
  color: #2750ac;
  font-weight: 600;
  margin: 0 0 10px;
}

.faculty-card-meta {
  font-size: 12px;
  color: #52525b;
  line-height: 1.75;
  margin: 0 0 12px;
  flex: 1;
}

.faculty-card-meta span { display: block; }
.faculty-card-meta strong { color: #374151; }

.faculty-card-cv {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 12px;
  font-weight: 600;
  color: #2750ac;
  text-decoration: none;
  border: 1.5px solid #2750ac;
  border-radius: 6px;
  padding: 5px 12px;
  align-self: flex-start;
  transition: background 0.15s ease, color 0.15s ease;
}

.faculty-card-cv:hover {
  background: #2750ac;
  color: #fff;
  text-decoration: none;
}

/* --- Technical staff list --- */
.dept-staff-list {
  list-style: none;
  padding: 0;
  margin: 0 0 20px;
}

.dept-staff-list li {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 9px 0;
  border-bottom: 1px solid #f0f0f4;
  font-size: 13px;
  color: #374151;
}

.dept-staff-list li:last-child { border-bottom: none; }

.dept-staff-list li .fa {
  color: #2750ac;
  width: 16px;
  text-align: center;
  flex-shrink: 0;
}

/* --- CTA button row --- */
.dept-cta-row {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  margin: 20px 0 28px;
}

@media (max-width: 600px) {
  .dept-info-grid   { grid-template-columns: repeat(2, 1fr); }
  .dept-career-grid { grid-template-columns: 1fr; }
  .faculty-grid     { grid-template-columns: 1fr; }
  .dept-cta-row     { flex-direction: column; }
}

/* ===============================================================
   SHADCN-INSPIRED TABLE SYSTEM — site-wide
   =============================================================== */

.shadcn-table-wrap {
  width: 100%;
  overflow-x: auto;
  border-radius: 12px;
  border: 1px solid #e4e4e7;
  box-shadow: 0 1px 4px rgba(0,0,0,0.06);
}

.shadcn-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 13.5px;
  background: #fff;
  border-radius: 12px;
  overflow: hidden;
}

.shadcn-table thead tr {
  background: #f8f8fc;
  border-bottom: 1px solid #e4e4e7;
}

.shadcn-table thead th {
  padding: 11px 16px;
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.55px;
  color: #52525b;
  text-align: left;
  white-space: nowrap;
  border: none;
  background: transparent;
}

.shadcn-table tbody tr {
  border-bottom: 1px solid #f0f0f4;
  transition: background 0.13s ease;
}

.shadcn-table tbody tr:last-child {
  border-bottom: none;
}

.shadcn-table tbody tr:hover {
  background: #fafafa;
}

.shadcn-table tbody td {
  padding: 12px 16px;
  color: #374151;
  vertical-align: middle;
  border: none;
}

.shadcn-table tbody td strong {
  font-weight: 600;
  color: #150447;
}

/* Striped variant */
.shadcn-table.striped tbody tr:nth-child(even) {
  background: #f8f8fc;
}

/* Compact variant */
.shadcn-table.compact thead th,
.shadcn-table.compact tbody td {
  padding: 8px 12px;
}

/* -----------------------------------------------
   SHADCN BADGES
----------------------------------------------- */

.shadcn-badge {
  display: inline-flex;
  align-items: center;
  border-radius: 6px;
  padding: 3px 9px;
  font-size: 11.5px;
  font-weight: 600;
  line-height: 1.4;
  white-space: nowrap;
  letter-spacing: 0.2px;
}

.shadcn-badge-primary {
  background: #150447;
  color: #fff;
}

.shadcn-badge-accent {
  background: #fab32522;
  color: #92560a;
  border: 1px solid #fab32544;
}

.shadcn-badge-blue {
  background: #eff6ff;
  color: #1d4ed8;
  border: 1px solid #bfdbfe;
}

.shadcn-badge-muted {
  background: #f4f4f5;
  color: #52525b;
  border: 1px solid #e4e4e7;
}

.shadcn-badge-success {
  background: #f0fdf4;
  color: #166534;
  border: 1px solid #bbf7d0;
}

/* -----------------------------------------------
   SECTION SUBHEADING
----------------------------------------------- */

.section-subheading {
  font-size: 15px;
  font-weight: 700;
  color: #150447;
  padding-bottom: 8px;
  border-bottom: 2px solid #e4e4e7;
}

@media (max-width: 600px) {
  .shadcn-table thead th,
  .shadcn-table tbody td {
    padding: 9px 11px;
    font-size: 12.5px;
  }
}

/* ===============================================================
   AUTO-STYLE: Plain <table> elements in content columns
   Applies the ShadCN aesthetic to any bare table with no class,
   so existing pages get the upgrade without touching their PHP.
   =============================================================== */

.col-md-6 table:not(.shadcn-table),
.col-md-9 table:not(.shadcn-table),
.inner_three_st table:not(.shadcn-table) {
  width: 100%;
  border-collapse: collapse;
  font-size: 13.5px;
  background: #fff;
  border-radius: 12px;
  overflow: hidden;
  /* border-radius on table requires a wrapper — use outline trick */
  outline: 1px solid #e4e4e7;
  box-shadow: 0 1px 4px rgba(0,0,0,0.06);
  margin-bottom: 24px;
}

.col-md-6 table:not(.shadcn-table) thead tr,
.col-md-9 table:not(.shadcn-table) thead tr,
.inner_three_st table:not(.shadcn-table) thead tr {
  background: #f8f8fc;
  border-bottom: 1px solid #e4e4e7;
}

.col-md-6 table:not(.shadcn-table) thead th,
.col-md-9 table:not(.shadcn-table) thead th,
.inner_three_st table:not(.shadcn-table) thead th {
  padding: 11px 16px;
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.55px;
  color: #52525b;
  text-align: left;
  border: none !important;
  background: transparent;
  white-space: nowrap;
}

.col-md-6 table:not(.shadcn-table) tbody tr,
.col-md-9 table:not(.shadcn-table) tbody tr,
.inner_three_st table:not(.shadcn-table) tbody tr {
  border-bottom: 1px solid #f0f0f4;
  transition: background 0.13s ease;
}

.col-md-6 table:not(.shadcn-table) tbody tr:last-child,
.col-md-9 table:not(.shadcn-table) tbody tr:last-child,
.inner_three_st table:not(.shadcn-table) tbody tr:last-child {
  border-bottom: none;
}

.col-md-6 table:not(.shadcn-table) tbody tr:hover,
.col-md-9 table:not(.shadcn-table) tbody tr:hover,
.inner_three_st table:not(.shadcn-table) tbody tr:hover {
  background: #fafafa;
}

.col-md-6 table:not(.shadcn-table) td,
.col-md-6 table:not(.shadcn-table) th,
.col-md-9 table:not(.shadcn-table) td,
.col-md-9 table:not(.shadcn-table) th,
.inner_three_st table:not(.shadcn-table) td,
.inner_three_st table:not(.shadcn-table) th {
  padding: 11px 16px;
  vertical-align: middle;
  border: none !important;
  color: #374151;
}

/* Bold first column (common for label-value tables) */
.col-md-6 table:not(.shadcn-table) td:first-child,
.col-md-9 table:not(.shadcn-table) td:first-child,
.inner_three_st table:not(.shadcn-table) td:first-child {
  font-weight: 600;
  color: #150447;
}

/* Even-row stripe */
.col-md-6 table:not(.shadcn-table) tbody tr:nth-child(even),
.col-md-9 table:not(.shadcn-table) tbody tr:nth-child(even),
.inner_three_st table:not(.shadcn-table) tbody tr:nth-child(even) {
  background: #f8f8fc;
}

/* Caption / table title if present */
.col-md-6 table:not(.shadcn-table) caption,
.col-md-9 table:not(.shadcn-table) caption,
.inner_three_st table:not(.shadcn-table) caption {
  caption-side: top;
  padding: 12px 16px 10px;
  font-size: 14px;
  font-weight: 700;
  color: #150447;
  text-align: left;
  background: #f8f8fc;
  border-bottom: 1px solid #e4e4e7;
}

@media (max-width: 600px) {
  .col-md-6 table:not(.shadcn-table) td,
  .col-md-6 table:not(.shadcn-table) th,
  .col-md-9 table:not(.shadcn-table) td,
  .col-md-9 table:not(.shadcn-table) th,
  .inner_three_st table:not(.shadcn-table) td,
  .inner_three_st table:not(.shadcn-table) th {
    padding: 9px 11px;
    font-size: 12.5px;
  }
}

/* ===============================================================
   RECRUITER BADGE GRID — placement.php
   =============================================================== */

.recruiter-section {
  margin-top: 36px;
  padding-top: 24px;
  border-top: 2px solid #eeeef4;
}

.recruiter-intro {
  font-size: 13.5px;
  color: #52525b;
  line-height: 1.7;
  margin: 0 0 18px;
}

.recruiter-intro strong {
  color: #150447;
}

.recruiter-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  list-style: none;
  padding: 0;
  margin: 0;
}

.recruiter-badge {
  display: inline-block;
  background: #fff;
  border: 1.5px solid #d4d4e0;
  border-radius: 8px;
  padding: 7px 14px;
  font-size: 12.5px;
  font-weight: 600;
  color: #150447;
  white-space: nowrap;
  transition: border-color 0.15s ease, box-shadow 0.15s ease, transform 0.15s ease;
  cursor: default;
}

.recruiter-badge:hover {
  border-color: #2750ac;
  box-shadow: 0 3px 10px rgba(39,80,172,0.12);
  transform: translateY(-1px);
  color: #2750ac;
}

@media (max-width: 600px) {
  .recruiter-badge {
    font-size: 12px;
    padding: 6px 11px;
  }
}

/* Override global .col-md-6 ul li::before chevron for recruiter grid */
.recruiter-grid li {
  position: static !important;
  padding-left: 0 !important;
  margin-bottom: 0 !important;
  font-size: inherit !important;
  color: inherit !important;
  line-height: inherit !important;
}

.recruiter-grid li::before {
  content: none !important;
}

/* -----------------------------------------------
   RECRUITER GRID — div-based, no list chevrons
----------------------------------------------- */
.recruiter-grid {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
  padding: 0 !important;
  margin: 0 !important;
}

.recruiter-badge {
  display: inline-block !important;
  border-radius: 8px !important;
  padding: 8px 16px !important;
  font-size: 12.5px !important;
  font-weight: 700 !important;
  white-space: nowrap !important;
  cursor: default !important;
  transition: transform 0.15s ease, box-shadow 0.15s ease !important;
  position: static !important;
  color: #fff !important;
  line-height: 1.4 !important;
}

.recruiter-badge:hover {
  transform: translateY(-2px) !important;
  box-shadow: 0 6px 16px rgba(0,0,0,0.15) !important;
}

.recruiter-badge::before { content: none !important; }

/* Colour variants */
.rc-navy  { background: #150447 !important; }
.rc-blue  { background: #2750ac !important; }
.rc-teal  { background: #0e7490 !important; }
.rc-gold  { background: #b45309 !important; }
.rc-red   { background: #be123c !important; }

@media (max-width: 600px) {
  .recruiter-badge { font-size: 12px !important; padding: 6px 12px !important; }
}

/* ===============================================================
   STUDENT REVIEW CARDS — placement.php student_review
   =============================================================== */

.review-list {
  display: flex;
  flex-direction: column;
  gap: 16px;
  margin-bottom: 28px;
}

.review-card {
  background: #fff;
  border-radius: 12px;
  border: 1px solid #e4e4e7;
  box-shadow: 0 2px 12px rgba(0,0,0,0.06);
  padding: 20px 22px 16px;
  position: relative;
}

.review-card::before {
  content: '\201C';
  position: absolute;
  top: 12px;
  left: 18px;
  font-size: 48px;
  line-height: 1;
  color: #fab325;
  font-family: Georgia, serif;
  pointer-events: none;
}

.review-body {
  font-size: 13.5px;
  color: #374151;
  line-height: 1.75;
  padding-left: 28px;
  margin-bottom: 14px;
}

.review-footer {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  padding-left: 28px;
  border-top: 1px solid #f0f0f4;
  padding-top: 12px;
}

.review-name {
  font-size: 13px;
  font-weight: 700;
  color: #150447;
}

.review-tag {
  font-size: 11.5px;
  font-weight: 600;
  background: #eef2ff;
  color: #2750ac;
  border-radius: 6px;
  padding: 3px 9px;
}

/* ===============================================================
   ABOUT PAGES — about.php
   =============================================================== */

/* Fix: Overview stat cards — num and label stacked */
.tg-stat {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
}
.tg-stat-num { display: block !important; }
.tg-stat-label { display: block !important; }

/* Inspiration photo — full width, natural height */
.about-insp-photo { width: 100%; margin-bottom: 20px; }
.about-insp-photo img {
  width: 100%;
  height: auto;
  border-radius: 8px;
  border: 2px solid #eeeef4;
}

/* Message cards */
.about-message-card {
  background: #fff;
  border: 1.5px solid #e4e4e7;
  border-radius: 14px;
  box-shadow: 0 4px 18px rgba(0,0,0,0.08);
  overflow: hidden;
  margin-bottom: 24px;
  padding: 20px 22px 18px;
}

.about-message-photo {
  margin-bottom: 16px;
}

.about-message-photo img {
  width: 100%;
  height: auto;
  display: block;
  border-radius: 8px;
  border: 1px solid #eeeef4;
}

.about-message-body {
  padding: 0;
}

.about-message-body p {
  font-size: 13.5px;
  color: #374151;
  line-height: 1.75;
  margin-bottom: 12px;
}

.about-message-sig {
  display: flex;
  align-items: center;
  gap: 14px;
  margin-top: 16px;
  padding: 14px 16px;
  background: #150447;
  border-radius: 10px;
}

.about-message-sig-text {
  display: flex;
  flex-direction: column;
  gap: 3px;
}

.about-message-sig strong {
  font-size: 14px;
  font-weight: 800;
  color: #fab325;
  display: block;
}

.about-message-sig span {
  font-size: 12px;
  color: rgba(255,255,255,0.82);
  display: block;
}

.about-message-sig-badge {
  flex-shrink: 0;
  width: 38px;
  height: 38px;
  background: rgba(255,255,255,0.12);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
}

.about-message-sig-badge .fa {
  color: #fab325;
  font-size: 16px;
}

/* Mandatory Disclosure buttons */
.disclosure-grid {
  display: flex;
  flex-direction: column;
  gap: 14px;
}

.disclosure-btn {
  display: flex;
  align-items: center;
  gap: 16px;
  background: #fff;
  border: 2px solid #d4d4e0;
  border-radius: 12px;
  padding: 18px 20px;
  text-decoration: none !important;
  color: inherit !important;
  transition: border-color 0.15s ease, box-shadow 0.15s ease, transform 0.15s ease;
}

.disclosure-btn:hover {
  border-color: #2750ac;
  box-shadow: 0 4px 16px rgba(39,80,172,0.12);
  transform: translateY(-2px);
  text-decoration: none !important;
}

.disclosure-btn-icon {
  flex-shrink: 0;
  width: 52px;
  height: 52px;
  background: #fef3c7;
  border-radius: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.disclosure-btn-icon .fa { font-size: 22px; color: #b45309; }

.disclosure-btn-body {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 3px;
}

.disclosure-btn-type {
  font-size: 11px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: #71717a;
}

.disclosure-btn-label {
  font-size: 17px;
  font-weight: 800;
  color: #150447;
  line-height: 1.2;
}

.disclosure-btn-date {
  font-size: 13px;
  font-weight: 600;
  color: #2750ac;
}

.disclosure-btn-action {
  flex-shrink: 0;
  background: #150447;
  color: #fff !important;
  font-size: 12px;
  font-weight: 700;
  border-radius: 8px;
  padding: 8px 14px;
  white-space: nowrap;
  display: flex;
  align-items: center;
  gap: 6px;
}

.disclosure-btn:hover .disclosure-btn-action { background: #2750ac; }

@media (max-width: 600px) {
  .disclosure-btn { flex-wrap: wrap; }
  .disclosure-btn-action { width: 100%; justify-content: center; }
}

/* -----------------------------------------------
   QUICK LINKS BAR — Featured item highlight
   Programs Offered & Admission Procedure
----------------------------------------------- */

.hp-ql-item.hp-ql-featured {
  background: rgba(250, 179, 37, 0.10) !important;
  border-top: 2px solid #fab325 !important;
}

.hp-ql-item.hp-ql-featured i {
  color: #fab325 !important;
}

.hp-ql-item.hp-ql-featured span {
  color: #fff !important;
  font-weight: 600 !important;
}

.hp-ql-item.hp-ql-featured:hover {
  background: rgba(250, 179, 37, 0.18) !important;
}

/* -----------------------------------------------
   ADMISSION PAGE — Enquiry Form Card
   admission-new.php ?t=admission
----------------------------------------------- */

.adm-enq-wrap {
  background: #fff;
  border: 1.5px solid #e4e4e7;
  border-radius: 14px;
  box-shadow: 0 4px 18px rgba(0,0,0,0.07);
  overflow: hidden;
  margin-top: 28px;
}

.adm-enq-header {
  background: #150447;
  padding: 20px 22px 18px;
}

.adm-enq-pill {
  display: inline-block;
  background: #fab325;
  color: #150447;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.4px;
  text-transform: uppercase;
  border-radius: 20px;
  padding: 3px 12px;
  margin-bottom: 10px;
}

.adm-enq-title {
  font-size: 17px !important;
  font-weight: 700 !important;
  color: #fff !important;
  margin: 0 0 6px !important;
}

.adm-enq-header h1,
.adm-enq-header h2,
.adm-enq-header h3,
.adm-enq-header h4,
.adm-enq-header h5,
.adm-enq-header h6 {
  color: #fff !important;
}

.adm-enq-title .fa {
  color: #fab325;
  margin-right: 6px;
}

.adm-enq-sub {
  font-size: 13px;
  color: rgba(255,255,255,0.75);
  margin: 0;
}

.adm-enq-wrap form {
  padding: 20px 22px 22px;
}

.adm-enq-row {
  display: flex;
  gap: 12px;
}

.adm-enq-row .adm-enq-field {
  flex: 1;
}

.adm-enq-field {
  margin-bottom: 14px;
}

.adm-enq-field label {
  font-size: 12.5px;
  font-weight: 600;
  color: #150447;
  margin-bottom: 5px;
  display: block;
}

.adm-enq-field label span {
  color: #e63946;
}

.adm-enq-field .form-control {
  font-size: 13px;
  border: 1.5px solid #d4d4e0;
  border-radius: 7px;
  padding: 8px 12px;
  color: #3f3f46;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.adm-enq-field .form-control:focus {
  border-color: #2750ac;
  box-shadow: 0 0 0 3px rgba(39,80,172,0.1);
  outline: none;
}

.adm-enq-submit {
  width: 100%;
  background: #fab325;
  color: #150447;
  border: none;
  border-radius: 8px;
  padding: 11px 20px;
  font-size: 14px;
  font-weight: 700;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  margin-top: 4px;
  transition: background 0.15s ease, transform 0.15s ease;
}

.adm-enq-submit:hover {
  background: #e6a010;
  transform: translateY(-1px);
}

@media (max-width: 600px) {
  .adm-enq-row { flex-direction: column; gap: 0; }
  .adm-enq-header { padding: 16px 16px 14px; }
  .adm-enq-wrap form { padding: 16px; }
}


/* ===============================================================
   MOBILE ADMISSIONS OPEN BUTTON
   =============================================================== */

@keyframes admit-shimmer {
  0%   { background-position: 100% center; }
  55%  { background-position: 0% center; }
  100% { background-position: 0% center; }
}

.bpp-header .bpp-mobile-admit-btn,
.bpp-navbar .bpp-mobile-admit-btn {
  background: linear-gradient(
    120deg,
    #fab325 0%,
    #fab325 35%,
    #ffe898 47%,
    #fff5c0 50%,
    #ffe898 53%,
    #fab325 65%,
    #fab325 100%
  );
  background-size: 250% auto;
  animation: admit-shimmer 4.5s ease-in-out infinite;
}

.bpp-mobile-admit-btn {
  display: inline-flex !important;
  align-items: center !important;
  color: #150447 !important;
  font-size: 11px !important;
  font-weight: 800 !important;
  padding: 5px 10px !important;
  border-radius: 6px !important;
  text-decoration: none !important;
  white-space: nowrap !important;
  line-height: 1.3 !important;
  letter-spacing: 0.04em !important;
  text-transform: uppercase !important;
}

.bpp-mobile-admit-btn:hover {
  color: #150447 !important;
  text-decoration: none !important;
}

/* ===============================================================
   HOMEPAGE SEO SECTIONS — Why Choose Us / Course Cards / FAQ
   Added for keyword targeting: Best BBA/BCA College in Kolkata
   =============================================================== */

/* Shared sub-text used across all three new sections */
.hp-sub-text {
  font-size: 15px;
  color: #52525b;
  line-height: 1.7;
  margin: 0;
}

/* -----------------------------------------------
   WHY CHOOSE BPPIMT
----------------------------------------------- */

.hp-why {
  background: #f8f8fc;
  padding: 60px 32px;
}

.hp-why-inner {
  max-width: 1200px;
  margin: 0 auto;
}

.hp-why-header {
  text-align: center;
  max-width: 760px;
  margin: 0 auto 40px;
}

.hp-why-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
}

/* Reuses dept-career-card layout but needs a wrapper with title */
.hp-why-card {
  background: #fff;
  border-radius: 10px;
  padding: 20px;
  display: flex;
  align-items: flex-start;
  gap: 14px;
  box-shadow: 0 4px 16px rgba(0,0,0,0.07);
  transition: box-shadow 0.2s ease, transform 0.2s ease;
}

.hp-why-card:hover {
  box-shadow: 0 8px 24px rgba(0,0,0,0.11);
  transform: translateY(-2px);
}

.hp-why-card-title {
  font-size: 14px !important;
  font-weight: 700 !important;
  color: #150447 !important;
  margin: 0 0 6px !important;
  line-height: 1.3 !important;
}

.hp-why-card p {
  font-size: 13px;
  color: #52525b;
  line-height: 1.65;
  margin: 0;
}

/* -----------------------------------------------
   COURSE CARDS
----------------------------------------------- */

.hp-courses {
  background: #150447;
  padding: 60px 32px;
}

.hp-courses-inner {
  max-width: 1200px;
  margin: 0 auto;
}

.hp-courses-header {
  text-align: center;
  max-width: 760px;
  margin: 0 auto 40px;
}

/* Invert label & title colours for dark background */
.hp-courses-header .hp-section-label { color: #fab325 !important; }
.hp-courses-header .hp-section-title { color: #fff !important; }
.hp-courses-header .hp-sub-text      { color: rgba(255,255,255,0.72); }

.hp-course-cards {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
  align-items: start;
}

.hp-course-card {
  background: #fff;
  border-radius: 14px;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  transition: box-shadow 0.2s ease, transform 0.2s ease;
}

.hp-course-card:hover {
  box-shadow: 0 12px 40px rgba(0,0,0,0.25);
  transform: translateY(-4px);
}

.hp-course-card-featured {
  box-shadow: 0 8px 32px rgba(250,179,37,0.22);
  transform: translateY(-4px);
}

.hp-course-card-top {
  padding: 24px 20px;
  position: relative;
  display: flex;
  align-items: center;
  gap: 12px;
}

.hp-cc-bba   { background: linear-gradient(135deg, #150447, #2750ac); }
.hp-cc-bca   { background: linear-gradient(135deg, #0a5c30, #1a8a4a); }
.hp-cc-bbaba { background: linear-gradient(135deg, #7c2d12, #c2440e); }

/* dept-career-icon already defined; just override colour for card tops */
.hp-course-card-top .dept-career-icon { background: rgba(255,255,255,0.2); }
.hp-course-card-top .dept-career-icon .fa { color: #fff; font-size: 18px; }

.hp-cc-tag {
  background: rgba(255,255,255,0.2);
  color: #fff;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  padding: 3px 10px;
  border-radius: 20px;
}

.hp-cc-popular {
  position: absolute;
  top: 12px;
  right: 12px;
  background: #fab325;
  color: #150447;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  padding: 3px 9px;
  border-radius: 20px;
}

.hp-course-card-body {
  padding: 20px;
  flex: 1;
  display: flex;
  flex-direction: column;
}

.hp-cc-title {
  font-size: 20px !important;
  font-weight: 800 !important;
  color: #150447 !important;
  margin: 0 0 2px !important;
}

.hp-cc-small {
  font-size: 13px;
  font-weight: 600;
  color: #2750ac;
}

.hp-cc-full {
  font-size: 12px;
  color: #71717a;
  font-style: italic;
  margin: 0 0 14px;
}

/* Reuse dept-info-grid inside cards with tighter spacing */
.hp-cc-meta {
  grid-template-columns: repeat(3, 1fr) !important;
  gap: 8px !important;
  margin: 0 0 14px !important;
}

.hp-cc-desc {
  font-size: 13px;
  color: #3f3f46;
  line-height: 1.65;
  margin: 0 0 16px;
  flex: 1;
}

/* -----------------------------------------------
   FAQ SECTION
----------------------------------------------- */

.hp-faq {
  background: #fff;
  padding: 60px 32px;
  border-top: 1px solid #eeeef4;
}

.hp-faq-inner {
  max-width: 1200px;
  margin: 0 auto;
}

.hp-faq-header {
  text-align: center;
  max-width: 760px;
  margin: 0 auto 40px;
}

.hp-faq-cols {
  display: grid;
  grid-template-columns: 1fr 280px;
  gap: 36px;
  align-items: stretch;
}

.hp-faq-sidebar {
  display: flex;
  flex-direction: column;
}

.hp-faq-cta-card {
  flex: 1;
}

/* FAQ list reuses dept-faq-item / dept-faq-question / dept-faq-answer — no new CSS needed */

/* Sidebar CTA card */
.hp-faq-cta-card {
  background: #150447;
  border-radius: 14px;
  padding: 24px 20px;
  text-align: center;
}

.hp-faq-cta-icon {
  font-size: 28px;
  color: #fab325;
  margin-bottom: 12px;
  display: block;
}

.hp-faq-cta-card h3 {
  font-size: 17px !important;
  font-weight: 700 !important;
  color: #fff !important;
  margin: 0 0 8px !important;
}

.hp-faq-cta-card p {
  font-size: 13px;
  color: rgba(255,255,255,0.72);
  margin: 0 0 16px;
  line-height: 1.6;
}

/* CTA button reuses hp-cta-btn hp-cta-primary — overriding width:100% for sidebar */
.hp-faq-cta-card .hp-cta-btn { width: 100% !important; justify-content: center !important; }

/* Contact links reuse hp-cta-contact pattern */


/* -----------------------------------------------
   RESPONSIVE
----------------------------------------------- */

@media (max-width: 991px) {
  .hp-why-grid    { grid-template-columns: repeat(2, 1fr); }
  .hp-course-cards { grid-template-columns: 1fr; max-width: 480px; margin: 0 auto; }
  .hp-course-card-featured { transform: none; }
  .hp-faq-cols    { grid-template-columns: 1fr; }
  .hp-faq-sidebar { position: static; }
}

@media (max-width: 600px) {
  .hp-why, .hp-courses, .hp-faq { padding: 44px 16px; }
  .hp-why-grid   { grid-template-columns: 1fr; }
  .hp-cc-meta    { grid-template-columns: 1fr 1fr !important; }
}