/* Enhanced effects (only visual) - preserves layout & content */
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700&display=swap');
:root{--blue:#0b61c3;--blue-dark:#084a95;--bg:#f7f9fc;--muted:#6b7280;--radius:10px;--shadow:0 8px 24px rgba(11,97,195,0.08)}
*{box-sizing:border-box}body{font-family:'Poppins',sans-serif;background:var(--bg);color:#0f1724;line-height:1.6;overflow-x:hidden}
/* Page loader */
#site-loader{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;background:rgba(255,255,255,0.9);z-index:9999;transition:opacity .4s ease;backdrop-filter:blur(2px)}
.loader-dot{width:12px;height:12px;margin:6px;border-radius:50%;background:var(--blue);animation:loaderAnim 0.9s infinite ease-in-out}
@keyframes loaderAnim{0%{transform:translateY(0);opacity:1}50%{transform:translateY(-8px);opacity:.7}100%{transform:translateY(0);opacity:1}}

/* Section reveal */
.reveal{opacity:0;transform:translateY(18px);transition:all .7s cubic-bezier(.2,.9,.3,1)}
.reveal.visible{opacity:1;transform:none}

/* Smooth hover effects */
.card, .btn, .navbar{transition:all .25s ease}
.card:hover{transform:translateY(-6px);box-shadow:var(--shadow)}

/* Button polish */
.btn-primary{background:var(--blue);border:none;border-radius:8px;color:#fff;padding:10px 16px;font-weight:600}
.btn-outline{border:1px solid rgba(11,97,195,0.12);color:var(--blue);background:#fff;border-radius:8px;padding:8px 14px}

/* Banner text tweak (keeps same structure) */
.banner_left span{display:block;color:var(--blue-dark);font-weight:700;letter-spacing:.6px}

/* Navbar subtle */
header{background:linear-gradient(90deg,#fff,#f3f8ff);border-bottom:1px solid rgba(11,97,195,0.06)}
.navbar-nav .nav-link{color:var(--blue-dark)!important;font-weight:500}

/* Responsive tweaks preserved */
@media(max-width:768px){.banner_left{padding:18px;text-align:center} .navbar-nav{justify-content:center}}

/* small utilities */
.text-muted{color:var(--muted)!important}

/* Header Fix Update v2 */
header {
  background: linear-gradient(90deg, #0b61c3 0%, #084a95 100%);
  color: #fff !important;
  position: relative;
  z-index: 999;
  box-shadow: 0 4px 12px rgba(0,0,0,0.15);
}
header .navbar, header nav, .navbar-nav .nav-link {
  color: #fff !important;
}
.navbar-brand span, .navbar-brand {
  color: #fff !important;
}
.navbar-nav .nav-link:hover, .navbar-nav .nav-item.active .nav-link {
  background: rgba(255,255,255,0.12);
  border-radius: 6px;
}
.navbar-toggler {
  border: 1px solid rgba(255,255,255,0.6);
}
.navbar-toggler-icon {
  filter: invert(1);
}
header img {
  height: 50px;
  margin-right: 8px;
  transition: transform 0.3s ease;
}
header img:hover {
  transform: scale(1.05);
}
/* Mobile adjustment */
@media(max-width:992px){
  .navbar-collapse {
    background: #0b61c3;
    border-radius: 6px;
    padding: 10px;
  }
  .navbar-nav .nav-link {
    display: block;
    text-align: center;
    padding: 10px;
    color: #fff !important;
  }
}

/* v3 Fix: Navbar/Menu Visibility */
header nav, .navbar, .navbar-nav .nav-link, .navbar-brand span {
  color: #ffffff !important;
}
.navbar-nav .nav-link {
  font-weight: 500;
  letter-spacing: 0.4px;
  transition: background 0.3s ease, color 0.3s ease;
}
.navbar-nav .nav-link:hover, .navbar-nav .nav-item.active .nav-link {
  background: rgba(255,255,255,0.18);
  color: #fff !important;
  border-radius: 6px;
}
.navbar-toggler {
  border: 1px solid rgba(255,255,255,0.8);
}
.navbar-toggler-icon {
  background-image: none;
  width: 24px; height: 2px; background-color: #fff; position: relative;
}
.navbar-toggler-icon::before, .navbar-toggler-icon::after {
  content: ''; position: absolute; width: 24px; height: 2px; background: #fff; left: 0;
}
.navbar-toggler-icon::before { top: -6px; }
.navbar-toggler-icon::after { top: 6px; }
@media(max-width:992px){
  .navbar-collapse { background:#0b61c3; border-radius:6px; }
  .navbar-nav .nav-link { display:block; text-align:center; color:#fff !important; }
}

/* v4 Strong Navbar Fix: Solid color & visible menu */
header {
  background-color: #0b61c3 !important;
  background-image: none !important;
  color: #fff !important;
}
.navbar, .navbar-dark {
  background-color: #0b61c3 !important;
  color: #fff !important;
}
.navbar-nav .nav-link {
  color: #fff !important;
  font-weight: 500;
  padding: 10px 16px;
  letter-spacing: 0.4px;
}
.navbar-nav .nav-link:hover, .navbar-nav .nav-item.active .nav-link {
  background: rgba(255,255,255,0.15);
  border-radius: 6px;
  color: #fff !important;
}
.navbar-toggler {
  border: 1px solid rgba(255,255,255,0.8);
}
.navbar-toggler-icon {
  background-image: none !important;
  position: relative;
  width: 22px;
  height: 2px;
  background-color: #fff;
}
.navbar-toggler-icon::before, .navbar-toggler-icon::after {
  content: '';
  position: absolute;
  width: 22px;
  height: 2px;
  background-color: #fff;
  left: 0;
}
.navbar-toggler-icon::before { top: -6px; }
.navbar-toggler-icon::after { top: 6px; }
.dropdown-menu {
  background: #084a95 !important;
  border: none;
}
.dropdown-item {
  color: #fff !important;
}
.dropdown-item:hover {
  background: rgba(255,255,255,0.15) !important;
}
@media (max-width: 992px) {
  .navbar-collapse {
    background-color: #0b61c3 !important;
    border-radius: 6px;
  }
  .navbar-nav .nav-link {
    color: #fff !important;
    text-align: center;
    padding: 12px;
  }
}

/* v5 Responsive Optimization */
/* Ensure no horizontal scroll and better scaling on mobile */
html, body {
  max-width: 100%;
  overflow-x: hidden;
}

/* Ensure images shrink properly */
img, video {
  max-width: 100%;
  height: auto;
}

/* Better mobile text sizes */
@media (max-width: 992px) {
  h1, .display-4 { font-size: 1.8rem; }
  h2 { font-size: 1.5rem; }
  h3, h4 { font-size: 1.25rem; }
  p, li, a, span { font-size: 0.95rem; }
}

/* Navbar optimization for small screens */
@media (max-width: 768px) {
  header img { height: 42px; }
  .navbar-brand span { font-size: 16px; display: inline-block; }
  .navbar-nav { text-align: center; }
  .navbar-nav .nav-link { display: block; padding: 12px 10px; }
}

/* Card and section stacking improvements */
@media (max-width: 768px) {
  .card { margin-bottom: 20px; }
  .row > [class*='col-'] { flex: 0 0 100%; max-width: 100%; }
  .banner_left { text-align: center; padding: 20px; }
  #search-bar { width: 100%; margin-top: 10px; }
}

/* Ensure table responsiveness */
.table-responsive {
  display: block;
  width: 100%;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

/* Footer readability */
@media (max-width: 600px) {
  footer { text-align: center; font-size: 13px; padding: 18px 0; }
}