/* ══════════════════════════════════════════════════════
   SHARED HEADER + FOOTER — anubhaparashar.github.io
   Applies to every page via js/site-components.js
══════════════════════════════════════════════════════ */

/* ── Scroll progress bar ── */
#nav-progress {
  position: fixed;
  top: 0; left: 0;
  height: 3px; width: 0%;
  background: linear-gradient(90deg, #1e4d7b 0%, #2d6b5e 40%, #7eb8e0 70%, #1e4d7b 100%);
  background-size: 200% 100%;
  animation: progShimmer 2.5s linear infinite;
  z-index: 10001;
  transition: width .08s linear;
  border-radius: 0 3px 3px 0;
  box-shadow: 0 0 10px rgba(30,77,123,.55), 0 0 4px rgba(45,107,94,.4);
}
@keyframes progShimmer {
  0%   { background-position: 0% 50%; }
  100% { background-position: 200% 50%; }
}

/* ── Header base — always white ── */
.header_area {
  position: fixed !important;
  top: 3px !important;
  width: 100%;
  background: #ffffff !important;
  border-bottom: 1px solid rgba(0,0,0,.06);
  transition: box-shadow .3s ease;
}
.header_area.glass-active {
  box-shadow: 0 4px 24px rgba(26,26,46,.10) !important;
}
.header_area.navbar_fixed .main_menu { position: relative !important; top: auto !important; }
.header_area .navbar { padding: 0 !important; background: transparent !important; }

/* ── Branded logo ── */
.header_area .navbar-brand {
  padding: 0 !important;
  display: flex !important;
  align-items: center !important;
  gap: 11px;
  height: 90px;
  text-decoration: none !important;
}
.nav-mono {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px; height: 40px;
  border-radius: 50%;
  background: linear-gradient(135deg, #1e4d7b 0%, #2d6b5e 100%);
  color: #fff !important;
  font: 800 14px/1 "Rubik", sans-serif;
  flex-shrink: 0;
  box-shadow: 0 4px 14px rgba(30,77,123,.45);
  transition: transform .35s cubic-bezier(.34,1.56,.64,1), box-shadow .3s;
}
.header_area .navbar-brand:hover .nav-mono {
  transform: rotate(12deg) scale(1.12);
  box-shadow: 0 6px 22px rgba(30,77,123,.6);
}
.nav-wordmark { display: flex; flex-direction: column; line-height: 1; }
.nav-wm-name {
  font: 700 13px/1 "Rubik", sans-serif;
  color: #1a1a2e !important;
  letter-spacing: .3px;
}
.nav-wm-sub {
  font: 400 10px/1 "Rubik", sans-serif;
  color: #999 !important;
  letter-spacing: .5px;
  margin-top: 5px;
}

/* ── Nav items ── */
.header_area .nav .nav-item { margin-right: 26px !important; }
.header_area .nav .nav-item:last-child { margin-right: 0 !important; }

/* ── Nav links — tall 90px bar ── */
.header_area .nav .nav-item .nav-link,
.header_area.navbar_fixed .main_menu .navbar .nav .nav-item .nav-link {
  font: 600 12px/90px "Rubik", sans-serif !important;
  text-transform: uppercase !important;
  letter-spacing: 1.4px !important;
  color: #555 !important;
  padding: 0 !important;
  position: relative;
  transition: color .25s, letter-spacing .3s;
}

/* Gradient underline — scaleX slide from center */
.header_area .nav .nav-item .nav-link::before {
  content: '';
  position: absolute;
  bottom: 16px; left: 0;
  width: 100%; height: 2px;
  background: linear-gradient(90deg, #1e4d7b, #2d6b5e);
  border-radius: 2px;
  transform: scaleX(0);
  transform-origin: center;
  transition: transform .3s cubic-bezier(.4,0,.2,1);
}
.header_area .nav .nav-item:hover .nav-link::before,
.header_area .nav .nav-item.active .nav-link::before { transform: scaleX(1); }

/* Hide ::after for plain links; chevron for dropdown */
.header_area .nav .nav-item:not(.submenu) .nav-link::after { display: none !important; }
.header_area .nav .nav-item.submenu .nav-link::after {
  display: inline-block !important;
  content: '' !important;
  width: 5px !important; height: 5px !important;
  border: none !important;
  border-right: 2px solid #4a6f94 !important;
  border-bottom: 2px solid #4a6f94 !important;
  transform: rotate(45deg) translateY(-2px) !important;
  margin-left: 6px !important;
  vertical-align: middle !important;
  border-radius: 0 !important;
  transition: transform .25s ease !important;
}
.header_area .nav .nav-item.submenu.show .nav-link::after,
.header_area .nav .nav-item.submenu[aria-expanded="true"] .nav-link::after {
  transform: rotate(-135deg) translateY(2px) !important;
}

.header_area .nav .nav-item:hover .nav-link { color: #1e4d7b !important; letter-spacing: 1.8px !important; }
.header_area .nav .nav-item.active .nav-link { color: #1e4d7b !important; font-weight: 700 !important; }

/* ── Dropdown panel ── */
.header_area .nav .nav-item.submenu ul {
  background: #fff !important;
  border: none !important;
  border-radius: 14px !important;
  box-shadow: 0 16px 48px rgba(26,26,46,.14) !important;
  padding: 10px !important;
  min-width: 156px !important;
  margin-top: -4px !important;
}
.header_area .nav .nav-item.submenu ul .nav-item .nav-link {
  font: 500 12px/1 "Rubik", sans-serif !important;
  color: #444 !important;
  padding: 10px 16px !important;
  letter-spacing: .5px !important;
  border-radius: 8px !important;
  transition: background .2s, color .2s, padding-left .2s !important;
}
.header_area .nav .nav-item.submenu ul .nav-item .nav-link:hover {
  background: #f0f4f8 !important;
  color: #1e4d7b !important;
  padding-left: 22px !important;
}
.header_area .nav .nav-item.submenu ul .nav-item .nav-link::before { display: none !important; }

/* ── Mobile toggler ── */
.header_area .navbar-toggler {
  border: 2px solid rgba(26,26,46,.22) !important;
  border-radius: 10px !important;
  padding: 8px 11px !important;
  background: rgba(26,26,46,.05) !important;
  transition: all .2s !important;
}
.header_area .icon-bar {
  display: block;
  width: 22px; height: 2px;
  background: #1a1a2e !important;
  border-radius: 2px;
  margin: 5px 0;
}

@media (max-width: 991px) {
  .header_area .nav .nav-item { margin-right: 0 !important; }
  .header_area .nav .nav-item .nav-link,
  .header_area.navbar_fixed .main_menu .navbar .nav .nav-item .nav-link {
    line-height: 1 !important;
    padding: 14px 8px !important;
    color: #1a1a2e !important;
  }
  .header_area .navbar-collapse {
    background: rgba(255,255,255,0.97) !important;
    backdrop-filter: blur(16px) !important;
    border-top: 1px solid rgba(0,0,0,.06) !important;
    border-radius: 0 0 14px 14px !important;
    padding: 10px 16px 18px !important;
    box-shadow: 0 12px 32px rgba(26,26,46,.12) !important;
  }
  .nav-wordmark { display: none; }
}

/* ══════════════════════════════════════════════════════
   SHARED FOOTER
══════════════════════════════════════════════════════ */
.exp-footer {
  background: #0d0d1a;
  padding: 56px 0 32px;
  text-align: center;
}
.exp-footer .back-top {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 42px; height: 42px;
  border-radius: 50%;
  background: rgba(255,255,255,.1);
  border: 1px solid rgba(255,255,255,.15);
  color: #fff !important;
  font-size: .9rem;
  margin-bottom: 14px;
  text-decoration: none !important;
  transition: background .2s;
}
.exp-footer .back-top:hover { background: rgba(255,255,255,.2); }
.exp-footer h5 {
  color: #fff !important;
  font-size: .7rem !important;
  letter-spacing: 2.5px;
  text-transform: uppercase;
  opacity: .4;
  margin-bottom: 28px;
  font-weight: 600 !important;
}
.footer-icon-group { margin-bottom: 28px; }
.footer-icon-group-label {
  font-size: .6rem;
  text-transform: uppercase;
  letter-spacing: 2px;
  color: #fff !important;
  opacity: .3;
  margin-bottom: 12px;
}
.footer-icons {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 10px;
}
.ficon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 42px; height: 42px;
  border-radius: 12px;
  background: rgba(255,255,255,.07);
  border: 1px solid rgba(255,255,255,.1);
  color: #fff !important;
  font-size: 1rem;
  text-decoration: none !important;
  transition: background .2s, border-color .2s, transform .2s;
}
.ficon:hover {
  background: rgba(255,255,255,.18);
  border-color: rgba(255,255,255,.3);
  transform: translateY(-3px);
  color: #fff !important;
}
.ficon img { width: 20px; height: 20px; object-fit: contain; filter: brightness(0) invert(1); }
.ficon-pill {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  height: 38px;
  border-radius: 20px;
  background: rgba(255,255,255,.07);
  border: 1px solid rgba(255,255,255,.1);
  color: #fff !important;
  font-size: .75rem;
  font-weight: 600;
  padding: 0 16px;
  text-decoration: none !important;
  transition: background .2s, transform .2s;
}
.ficon-pill:hover {
  background: rgba(233,69,96,.3);
  border-color: #e94560;
  transform: translateY(-2px);
  color: #fff !important;
}
.ficon-pill img { width: 18px; height: 18px; object-fit: contain; filter: brightness(0) invert(1); }
.footer-emails {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 24px;
}
.footer-email-link {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  font-size: .78rem;
  color: rgba(255,255,255,.45) !important;
  text-decoration: none !important;
  transition: color .2s;
}
.footer-email-link:hover { color: #e94560 !important; }
.footer-copy {
  font-size: .7rem;
  color: rgba(255,255,255,.2) !important;
  margin-top: 32px;
  border-top: 1px solid rgba(255,255,255,.07);
  padding-top: 20px;
  margin-bottom: 8px;
}
.footer-views {
  font-size: .68rem;
  color: rgba(255,255,255,.28) !important;
  letter-spacing: .6px;
  margin: 0;
}
.footer-views i { margin-right: 5px; opacity: .7; }