/* ==========================================================================
   header.css — floating glass header + mobile off-canvas
   ========================================================================== */
.site-header {
  position: fixed; top: 0; left: 0; right: 0; z-index: 1030;
  padding: 14px 0;
  transition: padding .4s var(--ease), transform .4s var(--ease);
}
.site-header.is-scrolled { padding: 8px 0; }

.header-bar {
  display: flex; align-items: center; justify-content: space-between; gap: 22px;
  padding: 9px 10px 9px 22px;
  border-radius: 999px;
  background: rgba(11, 23, 48, .55);
  -webkit-backdrop-filter: blur(18px) saturate(150%); backdrop-filter: blur(18px) saturate(150%);
  border: 1px solid rgba(103, 232, 249, .18);
  box-shadow: 0 10px 40px rgba(2, 8, 24, .28), inset 0 1px 0 rgba(255,255,255,.06);
  transition: background .4s var(--ease), box-shadow .4s var(--ease);
}
.site-header.is-scrolled .header-bar { background: rgba(9, 18, 42, .9); box-shadow: 0 14px 44px rgba(2, 8, 24, .45); }

/* Brand */
.brand { display: inline-flex; align-items: center; gap: 12px; color: #fff; flex-shrink: 0; }
.brand:hover { color: #fff; }
.brand-img { max-height: 44px; width: auto; }
.brand-mark { flex-shrink: 0; filter: drop-shadow(0 4px 14px rgba(8,124,240,.55)); }
.brand-text { display: flex; flex-direction: column; line-height: 1; }
.brand-text strong { font: 800 1.28rem/1 var(--font-head); letter-spacing: .12em; background: linear-gradient(180deg,#fff,#B8C9E6); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; }
.brand-text small { margin-top: 5px; font: 500 .62rem/1 var(--font-head); letter-spacing: .26em; text-transform: uppercase; color: var(--b-cyan); }

/* Desktop navigation */
.primary-nav { margin-left: auto; }
.nav-menu { display: flex; align-items: center; gap: 2px; margin: 0; padding: 0; list-style: none; }
.nav-menu > li { position: relative; }
.nav-menu > li > a {
  position: relative; display: flex; align-items: center; gap: 7px;
  padding: 11px 16px; border-radius: 999px;
  font: 500 .93rem/1 var(--font-body); color: #CFE0F7;
  transition: color .3s, background .3s;
}
.nav-menu > li > a:hover,
.nav-menu > li:hover > a { color: #fff; background: rgba(255,255,255,.07); }
.nav-menu > li.current-menu-item > a,
.nav-menu > li.current-menu-ancestor > a,
.nav-menu > li.current_page_item > a { color: #fff; }
.nav-menu > li.current-menu-item > a::before,
.nav-menu > li.current-menu-ancestor > a::before,
.nav-menu > li.current_page_item > a::before {
  content: ""; position: absolute; left: 50%; bottom: 3px; width: 5px; height: 5px; margin-left: -2.5px;
  border-radius: 50%; background: var(--b-cyan); box-shadow: 0 0 10px var(--b-cyan);
}
.nav-menu > li.menu-item-has-children > a::after {
  content: "\f078"; font: 900 .6rem/1 "Font Awesome 6 Free"; opacity: .7; transition: transform .3s var(--ease);
}
.nav-menu > li.menu-item-has-children:hover > a::after { transform: rotate(180deg); }

/* Mega dropdown */
.nav-menu .sub-menu {
  position: absolute; top: calc(100% + 14px); left: 50%;
  width: 520px; padding: 14px; margin: 0; list-style: none;
  display: grid; grid-template-columns: 1fr 1fr; gap: 4px;
  background: rgba(10, 20, 44, .97);
  border: 1px solid rgba(103, 232, 249, .2); border-radius: 22px;
  box-shadow: 0 30px 70px rgba(2, 8, 24, .55);
  opacity: 0; visibility: hidden; transform: translate(-50%, 10px);
  transition: opacity .3s var(--ease), transform .3s var(--ease), visibility .3s;
}
.nav-menu .sub-menu::before { content: ""; position: absolute; left: 0; right: 0; top: -16px; height: 16px; }
.nav-menu > li:hover > .sub-menu,
.nav-menu > li:focus-within > .sub-menu { opacity: 1; visibility: visible; transform: translate(-18%, 0); }
.nav-menu .sub-menu a {
  display: flex; align-items: center; gap: 12px; padding: 12px 14px; border-radius: 14px;
  font: 500 .88rem/1.3 var(--font-body); color: #CFE0F7;
  transition: background .25s, color .25s, transform .25s var(--ease);
}
.nav-menu .sub-menu a i {
  flex-shrink: 0; display: grid; place-items: center; width: 36px; height: 36px; border-radius: 11px;
  background: rgba(8, 124, 240, .16); color: var(--b-cyan); font-size: .9rem; transition: background .25s, color .25s;
}
.nav-menu .sub-menu a:hover { background: rgba(255,255,255,.06); color: #fff; transform: translateX(3px); }
.nav-menu .sub-menu a:hover i { background: var(--b-blue); color: #fff; }

/* Actions */
.header-actions { display: flex; align-items: center; gap: 10px; }
.header-phone {
  display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%;
  color: var(--b-cyan); background: rgba(103,232,249,.08); border: 1px solid rgba(103,232,249,.2);
  transition: background .3s, color .3s, transform .3s var(--ease);
}
.header-phone:hover { background: var(--b-cyan); color: var(--b-navy); transform: rotate(-12deg); }
.header-cta i { font-size: .8rem; }

/* Hamburger */
.menu-toggle {
  display: none; width: 46px; height: 46px; padding: 0; border-radius: 50%;
  background: rgba(255,255,255,.07); border: 1px solid rgba(103,232,249,.25); cursor: pointer;
}
.menu-toggle .bars { display: grid; gap: 5px; width: 20px; margin: 0 auto; }
.menu-toggle .bars i { display: block; height: 2px; border-radius: 2px; background: #fff; transition: width .3s var(--ease); }
.menu-toggle .bars i:nth-child(2) { width: 70%; margin-left: auto; }
.menu-toggle:hover .bars i:nth-child(2) { width: 100%; }

/* ---- Off-canvas ---- */
.binfo-offcanvas {
  --bs-offcanvas-width: min(88vw, 390px);
  background: linear-gradient(180deg, #0B1730 0%, #08112A 100%);
  color: #E6EEFB; border-left: 1px solid rgba(103,232,249,.2);
}
.binfo-offcanvas::before {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background: radial-gradient(400px 300px at 100% 0%, rgba(8,124,240,.28), transparent 70%);
}
.binfo-offcanvas .offcanvas-header { position: relative; justify-content: space-between; padding: 22px 24px 8px; }
.binfo-offcanvas .offcanvas-body { position: relative; padding: 12px 24px 32px; }
.oc-close {
  width: 44px; height: 44px; border-radius: 50%; color: #fff; font-size: 1rem; cursor: pointer;
  background: rgba(255,255,255,.07); border: 1px solid rgba(103,232,249,.25);
  transition: transform .4s var(--ease), background .3s;
}
.oc-close:hover { transform: rotate(90deg); background: var(--b-blue); }

.nav-menu-mobile { flex-direction: column; align-items: stretch; gap: 0; counter-reset: oc; }
.nav-menu-mobile > li { border-bottom: 1px solid rgba(255,255,255,.08); counter-increment: oc; }
.nav-menu-mobile > li > a {
  position: relative; padding: 18px 4px 18px 38px; border-radius: 0;
  font: 600 1.12rem/1.2 var(--font-head); color: #fff;
}
.nav-menu-mobile > li > a::before {
  content: "0" counter(oc); position: static; width: auto; height: auto; background: none; box-shadow: none;
  position: absolute; left: -12px; top: 50%; transform: translateY(-50%);
  font: 500 .72rem/1 var(--font-body); color: var(--b-cyan); letter-spacing: .08em;
}
.nav-menu-mobile > li.current-menu-item > a { color: var(--b-cyan); }
.nav-menu-mobile > li.menu-item-has-children > a::after { display: none; }
.nav-menu-mobile > li:hover > a { background: transparent; }
.nav-menu-mobile .sub-toggle  i{
	font-size: 13px;
}
.nav-menu-mobile .sub-toggle {
  position: absolute; right: 0; top: 10px; width: 27px; height: 27px; border-radius: 50%;
  color: #fff; background: rgba(255,255,255,.07); border: 0; cursor: pointer;
  transition: transform .3s var(--ease), background .3s;
}
.nav-menu-mobile .is-open > .sub-toggle { transform: rotate(180deg); background: var(--b-blue); }
.nav-menu-mobile .sub-menu {
  position: static; width: auto; display: none; grid-template-columns: 1fr; gap: 0;
  padding: 0 0 14px 38px; background: none; border: 0; box-shadow: none;
  opacity: 1; visibility: visible; transform: none;
}
.nav-menu-mobile .sub-menu::before { display: none; }
.nav-menu-mobile .is-open > .sub-menu { display: grid; }
.nav-menu-mobile .sub-menu a { padding: 11px 0; font-size: .95rem; background: none; }
.nav-menu-mobile .sub-menu a:hover { transform: none; background: none; color: var(--b-cyan); }
.nav-menu-mobile .sub-menu a i { width: 30px; height: 30px; border-radius: 9px; font-size: .8rem; }

.oc-contact { list-style: none; margin: 28px 0 0; padding: 0; display: grid; gap: 12px; }
.oc-contact li { display: flex; align-items: center; gap: 12px; font-size: .95rem; }
.oc-contact i { width: 18px; color: var(--b-cyan); }
.oc-contact a { color: #CFE0F7; }
.oc-social { margin-top: 24px; }