/* v787BT — canonical public desktop header balanced visual rhythm
   Desktop layout source of truth:
   - logo remains an independent left block;
   - navigation stays a compact right-side cluster instead of stretching across spare space;
   - wide screens use a deliberate visual rhythm rather than cumulative micro-patches;
   - medium and compact desktop widths step down predictably;
   - mobile drawer rules remain unchanged below 1120px. */
:root{--vge-header-dropdown-text:#111827;--vge-header-dropdown-hover:#0b63ce;--vge-header-dropdown-border:#d8dee8}
html{scroll-behavior:smooth}
[id]{scroll-margin-top:104px}

@media(min-width:1121px){
  body:not([class*="admin"]):not(.admin-body):not(.vge-admin-page) .topbar .container.nav,
  body:not([class*="admin"]):not(.admin-body):not(.vge-admin-page) .topbar .nav{
    width:100%!important;
    max-width:none!important;
    min-height:78px!important;
    padding:10px 34px!important;
    display:flex!important;
    align-items:center!important;
    justify-content:flex-start!important;
    column-gap:0!important;
    row-gap:0!important;
    box-sizing:border-box!important;
  }
  body:not([class*="admin"]):not(.admin-body):not(.vge-admin-page) .topbar .brand.brand-logo,
  body:not([class*="admin"]):not(.admin-body):not(.vge-admin-page) .topbar .brand-logo{
    flex:0 0 314px!important;
    width:314px!important;
    min-width:314px!important;
    max-width:314px!important;
    margin:0!important;
    overflow:hidden!important;
  }
  body:not([class*="admin"]):not(.admin-body):not(.vge-admin-page) .topbar .brand-logo img,
  body:not([class*="admin"]):not(.admin-body):not(.vge-admin-page) .topbar .brand img,
  body:not([class*="admin"]):not(.admin-body):not(.vge-admin-page) .topbar img.logo-dark{
    display:block!important;
    width:auto!important;
    height:auto!important;
    max-width:100%!important;
    max-height:54px!important;
    object-fit:contain!important;
    object-position:left center!important;
  }
  body:not([class*="admin"]):not(.admin-body):not(.vge-admin-page) .topbar .navlinks{
    flex:0 1 auto!important;
    min-width:0!important;
    margin-left:auto!important;
    display:flex!important;
    align-items:center!important;
    justify-content:flex-end!important;
    flex-wrap:nowrap!important;
    column-gap:26px!important;
    row-gap:0!important;
    padding-left:0!important;
    overflow:visible!important;
  }
  body:not([class*="admin"]):not(.admin-body):not(.vge-admin-page) .topbar .navlinks>a:not(.btn),
  body:not([class*="admin"]):not(.admin-body):not(.vge-admin-page) .topbar .navlinks>a.vge-desktop-dropdown-parent:not(.btn){
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    flex:0 0 auto!important;
    padding:9px 2px!important;
    border:1px solid transparent!important;
    border-radius:8px!important;
    background:transparent!important;
    box-shadow:none!important;
    color:#f8fafc!important;
    opacity:.98!important;
    font-size:18.5px!important;
    line-height:1.08!important;
    font-weight:700!important;
    letter-spacing:0!important;
    white-space:nowrap!important;
    text-decoration:none!important;
    transition:background-color .16s ease,border-color .16s ease,color .16s ease,opacity .16s ease!important;
  }
  body:not([class*="admin"]):not(.admin-body):not(.vge-admin-page) .topbar .navlinks>a:not(.btn)::before,
  body:not([class*="admin"]):not(.admin-body):not(.vge-admin-page) .topbar .navlinks>a:not(.btn)::after{
    content:none!important;
    display:none!important;
    border:0!important;
    transform:none!important;
  }
  body:not([class*="admin"]):not(.admin-body):not(.vge-admin-page) .topbar .navlinks>a.active-nav:not(.btn),
  body:not([class*="admin"]):not(.admin-body):not(.vge-admin-page) .topbar .navlinks>a.vge-desktop-dropdown-parent.active-nav:not(.btn){
    border-color:transparent!important;
    background:transparent!important;
    box-shadow:none!important;
    color:#f8fafc!important;
  }
  body:not([class*="admin"]):not(.admin-body):not(.vge-admin-page) .topbar .navlinks>a:not(.btn):hover,
  body:not([class*="admin"]):not(.admin-body):not(.vge-admin-page) .topbar .navlinks>a:not(.btn):focus-visible,
  body:not([class*="admin"]):not(.admin-body):not(.vge-admin-page) .topbar .navlinks>a.vge-desktop-dropdown-parent.is-dropdown-open:not(.btn){
    border-color:rgba(255,255,255,.24)!important;
    background:rgba(255,255,255,.10)!important;
    color:#ffffff!important;
    opacity:1!important;
    outline:none!important;
    box-shadow:none!important;
  }
  body:not([class*="admin"]):not(.admin-body):not(.vge-admin-page) .topbar .navlinks .nav-apply-btn,
  body:not([class*="admin"]):not(.admin-body):not(.vge-admin-page) .topbar .navlinks>a.btn{
    display:inline-flex!important;
    flex:0 0 auto!important;
    min-height:48px!important;
    margin-left:12px!important;
    padding:11px 22px!important;
    border-radius:999px!important;
    font-size:18.5px!important;
    line-height:1.08!important;
    white-space:nowrap!important;
  }
}

/* Medium desktop / laptop: keep the same rhythm, step down predictably. */
@media(min-width:1321px) and (max-width:1680px){
  body:not([class*="admin"]):not(.admin-body):not(.vge-admin-page) .topbar .container.nav,
  body:not([class*="admin"]):not(.admin-body):not(.vge-admin-page) .topbar .nav{padding-left:24px!important;padding-right:24px!important}
  body:not([class*="admin"]):not(.admin-body):not(.vge-admin-page) .topbar .brand.brand-logo,
  body:not([class*="admin"]):not(.admin-body):not(.vge-admin-page) .topbar .brand-logo{flex-basis:236px!important;width:236px!important;min-width:236px!important;max-width:236px!important}
  body:not([class*="admin"]):not(.admin-body):not(.vge-admin-page) .topbar .navlinks{column-gap:12px!important}
  body:not([class*="admin"]):not(.admin-body):not(.vge-admin-page) .topbar .navlinks>a:not(.btn),
  body:not([class*="admin"]):not(.admin-body):not(.vge-admin-page) .topbar .navlinks>a.vge-desktop-dropdown-parent:not(.btn){padding-left:2px!important;padding-right:2px!important;font-size:16px!important;font-weight:700!important;letter-spacing:0!important}
  body:not([class*="admin"]):not(.admin-body):not(.vge-admin-page) .topbar .navlinks .nav-apply-btn,
  body:not([class*="admin"]):not(.admin-body):not(.vge-admin-page) .topbar .navlinks>a.btn{margin-left:8px!important;min-height:44px!important;padding-left:15px!important;padding-right:15px!important;font-size:16px!important}
}

/* Compact desktop: preserve one row without crushing the navigation. */
@media(min-width:1121px) and (max-width:1320px){
  body:not([class*="admin"]):not(.admin-body):not(.vge-admin-page) .topbar .container.nav,
  body:not([class*="admin"]):not(.admin-body):not(.vge-admin-page) .topbar .nav{padding-left:18px!important;padding-right:18px!important}
  body:not([class*="admin"]):not(.admin-body):not(.vge-admin-page) .topbar .brand.brand-logo,
  body:not([class*="admin"]):not(.admin-body):not(.vge-admin-page) .topbar .brand-logo{flex-basis:204px!important;width:204px!important;min-width:204px!important;max-width:204px!important}
  body:not([class*="admin"]):not(.admin-body):not(.vge-admin-page) .topbar .navlinks{column-gap:6px!important}
  body:not([class*="admin"]):not(.admin-body):not(.vge-admin-page) .topbar .navlinks>a:not(.btn),
  body:not([class*="admin"]):not(.admin-body):not(.vge-admin-page) .topbar .navlinks>a.vge-desktop-dropdown-parent:not(.btn){padding-left:1px!important;padding-right:1px!important;font-size:14.2px!important;font-weight:700!important;letter-spacing:0!important}
  body:not([class*="admin"]):not(.admin-body):not(.vge-admin-page) .topbar .navlinks .nav-apply-btn,
  body:not([class*="admin"]):not(.admin-body):not(.vge-admin-page) .topbar .navlinks>a.btn{margin-left:5px!important;min-height:42px!important;padding-left:11px!important;padding-right:11px!important;font-size:14.2px!important}
}

@media(max-width:1120px){body:not([class*="admin"]):not(.admin-body):not(.vge-admin-page) .topbar .navlinks{display:none!important}}

/* Desktop dropdown portal: outside .navlinks, therefore immune to legacy header rules. */
.vge-desktop-dropdown-portal{
  position:fixed;
  z-index:2147482500;
  display:block;
  overflow-x:hidden;
  overflow-y:auto;
  padding:10px 0;
  border:1px solid var(--vge-header-dropdown-border);
  border-radius:8px;
  background:#fff;
  box-shadow:0 16px 36px rgba(15,23,42,.18);
  opacity:0;
  visibility:hidden;
  transform:translateY(-5px);
  pointer-events:none;
  transition:opacity .15s ease,transform .15s ease,visibility 0s linear .15s;
}
.vge-desktop-dropdown-portal[hidden]{display:none!important}
.vge-desktop-dropdown-portal.is-open{opacity:1;visibility:visible;transform:translateY(0);pointer-events:auto;transition-delay:0s}
.vge-desktop-dropdown-portal a{
  display:block!important;
  width:100%!important;
  padding:11px 20px!important;
  border:0!important;
  border-radius:0!important;
  background:#fff!important;
  color:var(--vge-header-dropdown-text)!important;
  box-shadow:none!important;
  font-size:15px!important;
  font-weight:500!important;
  line-height:1.3!important;
  letter-spacing:0!important;
  opacity:1!important;
  text-align:left!important;
  text-decoration:none!important;
  white-space:normal!important;
  overflow-wrap:anywhere;
  transition:color .15s ease,transform .15s ease!important;
}
.vge-desktop-dropdown-portal a::after{display:none!important}
.vge-desktop-dropdown-portal a:hover,.vge-desktop-dropdown-portal a:focus{background:#fff!important;color:var(--vge-header-dropdown-hover)!important;transform:translateX(2px);outline:none!important}
.vge-desktop-dropdown-portal a.vge-dropdown-view-all,.vge-desktop-dropdown-portal a.vge-dropdown-cta{background:#fff!important;color:var(--vge-header-dropdown-text)!important;font-weight:500!important}
.vge-desktop-dropdown-portal a.vge-dropdown-view-all:hover,.vge-desktop-dropdown-portal a.vge-dropdown-cta:hover{color:var(--vge-header-dropdown-hover)!important}

/* v787BN Mobile drawer accordion parity lock:
   Dropdown parents (Fees, Urgent eVisa, Add-on Services, Useful Guide) are
   generated as accordion buttons by JS. Keep their closed-state visual
   language identical to ordinary drawer links instead of falling back to a
   legacy flat text-row style. */
.vge-mobile-nav-group{display:grid;gap:6px;border:0;border-radius:0;background:transparent;padding:0;min-width:0}
.vge-mobile-nav-group-toggle{display:flex!important;align-items:center!important;justify-content:flex-start!important;width:100%!important;min-height:46px!important;padding:11px 12px!important;border:1px solid #e2e8f0!important;border-radius:14px!important;background:#f8fafc!important;color:#0f172a!important;box-shadow:none!important;font:inherit;font-size:13px!important;font-weight:850!important;line-height:1.2!important;text-align:left!important;cursor:pointer;transition:background .15s ease,border-color .15s ease,color .15s ease!important}
.vge-mobile-nav-group.is-open .vge-mobile-nav-group-toggle,.vge-mobile-nav-group-toggle.active-nav,.vge-mobile-nav-group-toggle:hover,.vge-mobile-nav-group-toggle:focus{background:#eef6ff!important;border-color:#bfdbfe!important;color:#0b4d89!important;outline:none!important;box-shadow:inset 0 0 0 1px rgba(37,99,235,.10)!important}
.vge-mobile-nav-submenu{display:none;padding:2px 0 4px 12px;background:transparent}
.vge-mobile-nav-group.is-open .vge-mobile-nav-submenu{display:block}
.vge-mobile-nav-submenu a{display:block!important;padding:9px 0!important;border:0!important;border-radius:0!important;background:transparent!important;color:#111827!important;box-shadow:none!important;font-size:14.5px!important;font-weight:400!important;line-height:1.28!important;text-align:left!important;white-space:normal!important;transition:color .15s ease,transform .15s ease!important}
.vge-mobile-nav-submenu a:hover,.vge-mobile-nav-submenu a:focus{color:var(--vge-header-dropdown-hover)!important;transform:translateX(2px);outline:none!important}
.vge-mobile-nav-submenu a.vge-dropdown-view-all,.vge-mobile-nav-submenu a.vge-dropdown-cta{background:transparent!important;color:#111827!important;border:0!important}
@media(min-width:1121px){.vge-mobile-nav-group{display:none}}
