/* ============================================================
   Exact-copy header, ported from the GulfLeaders WordPress theme
   (public_html/demo/wp-content/themes/GulfLeaders/header.php +
   assets/css/style.css), using the theme's real class names and
   Bootstrap 5.3's real grid math — reproduced here (not a global
   Bootstrap import) so the rest of the site's own design is
   untouched.
   ============================================================ */

/* ---- Minimal Bootstrap 5.3 grid/utilities actually used by the header ---- */
.container { width: 100%; padding-right: .75rem; padding-left: .75rem; margin-right: auto; margin-left: auto; }
@media (min-width: 576px)  { .container { max-width: 540px; } }
@media (min-width: 768px)  { .container { max-width: 720px; } }
@media (min-width: 992px)  { .container { max-width: 960px; } }
@media (min-width: 1200px) { .container { max-width: 1140px; } }
@media (min-width: 1400px) { .container { max-width: 1320px; } }

.row {
  --bs-gutter-x: 1.5rem; --bs-gutter-y: 0;
  display: flex; flex-wrap: wrap;
  margin-top: calc(-1 * var(--bs-gutter-y));
  margin-right: calc(-.5 * var(--bs-gutter-x));
  margin-left: calc(-.5 * var(--bs-gutter-x));
}
.row > * {
  flex-shrink: 0; width: 100%; max-width: 100%;
  padding-right: calc(var(--bs-gutter-x) * .5);
  padding-left: calc(var(--bs-gutter-x) * .5);
  margin-top: var(--bs-gutter-y);
}
.col { flex: 1 0 0%; }
@media (min-width: 768px) {
  .col-md-3 { flex: 0 0 auto; width: 25%; }
  .col-md-6 { flex: 0 0 auto; width: 50%; }
}

.d-flex { display: flex !important; }
.align-items-center { align-items: center !important; }
.justify-content-center { justify-content: center !important; }
.gap-2 { gap: .5rem !important; }
.position-relative { position: relative !important; }
.d-none { display: none !important; }
@media (min-width: 768px) {
  .d-md-block { display: block !important; }
  .d-md-none { display: none !important; }
}

/* ---- Real theme rules (verbatim values from assets/css/style.css) ---- */
.header-mid { background-color: #fff; padding: 20px 0; }
.header-logo img { height: 56px; display: block; }
.header-tagline { margin: 0; color: #040707; }
.header-social-list { list-style: none; margin: 0; padding: 0; }
.header-social-list a { color: #040707; font-size: 15px; transition: color .2s ease; }
.header-social-list a:hover { color: #4380c2; }

.navbar {
  z-index: 9;
  background-color: #fff;
  border-top: 1px solid #dadada;
  border-bottom: 1px solid #dadada;
  transition: all .3s ease;
}
.navbar-brand img { height: 45px; }
@media (min-width: 576px) { .navbar-brand img { height: 40px; } }
.sticky-top { position: sticky; top: 0; z-index: 100; }

/* ---- CSS-only mega/dropdown menu (verbatim from theme) ---- */
.nav--custom {
  --nav-bg: #fff;
  --nav-link: #333;
  --nav-link-active: #333;
  --hover-bg: #f5f5f5;
  --submenu-bg: #fff;
  --submenu-bg-1: #f9f9f9;
  --submenu-bg-2: #f1f1f1;
  --shadow: 0 2px 5px rgba(0,0,0,.12);
  background: var(--nav-bg);
  position: relative;
  width: 100%;
}
.nav--custom * { box-sizing: border-box; }
.nav--custom ul { list-style: none; margin: 0; padding: 0; }
.nav--custom a { text-decoration: none; color: inherit; }
.nav--custom .nav-container { margin: 0 auto; }

.nav--custom .menu { display: flex; }
.nav--custom .menu-item { position: relative; }
.nav--custom .menu-link {
  padding: 20px;
  color: var(--nav-link);
  font-size: 15.5px;
  font-weight: 600;
  transition: all .3s ease;
  display: flex;
  align-items: center;
  gap: 5px;
}
.nav--custom .menu-item:first-child > .menu-link { color: var(--nav-link-active); }
.nav--custom .menu-link:hover { background: var(--hover-bg); color: #4380c2; }
.nav--custom .dropdown-icon::after { content: '\25BC'; font-size: 9px; transition: transform .3s ease; }

.nav--custom .submenu {
  position: absolute; top: 100%; left: 0;
  background: var(--submenu-bg);
  min-width: 220px;
  display: none;
  box-shadow: var(--shadow);
  z-index: 1000;
  opacity: 0; visibility: hidden;
  transform: translateY(10px);
  transition: all .25s ease;
}
.nav--custom .menu-item:hover > .submenu { display: block; opacity: 1; visibility: visible; transform: translateY(0); }
.nav--custom .submenu-link { display: block; padding: 11px 20px; color: var(--nav-link); font-size: 14px; transition: all .25s ease; }
.nav--custom .submenu-link:hover { background: #eef2f7; color: #4380c2; }
.nav--custom .menu-item:hover > .menu-link .dropdown-icon::after { transform: rotate(-180deg); }

.nav--custom .menu-toggle,
.nav--custom .toggle-submenu,
.nav--custom .toggle-nested { display: none; }

.nav--custom .menu-hamburger {
  display: none;
  background: none; border: none; font-size: 22px;
  padding: 14px 4px; cursor: pointer; color: var(--nav-link);
}

@media (max-width: 767px) {
  .nav--custom .nav-container { padding: 0 20px; }
  .nav--custom .menu-hamburger { display: block; margin-left: auto; }
  .nav--custom .menu {
    display: none;
    flex-direction: column;
    width: 100%;
    background: var(--nav-bg);
    box-shadow: var(--shadow);
  }
  .nav--custom .menu-toggle:checked ~ .menu { display: flex; }
  .nav--custom .menu-item { position: relative; }
  .nav--custom .menu-link, .nav--custom .submenu-link {
    padding: 13px 20px;
    display: flex; justify-content: space-between; align-items: center; width: 100%;
  }
  .nav--custom .submenu {
    position: static; width: 100%; box-shadow: none;
    background: var(--submenu-bg-1);
    display: none;
    opacity: 1; visibility: visible; transform: none;
  }
  .nav--custom .toggle-submenu:checked ~ .submenu { display: block; }
  .nav--custom .toggle-submenu:checked ~ .menu-link .dropdown-icon::after { transform: rotate(-180deg); }
  .nav--custom .submenu-link { padding-left: 36px; }
}

/* ---- Navbar row layout: brand (mobile) + custom menu ---- */
.custom-navbar .container { display: flex; align-items: center; justify-content: space-between; }
.custom-navbar .navbar-brand { display: flex; align-items: center; padding: 10px 0; }
