/* =========================================
   HEADER BASE
========================================= */

.site-header {
  background:#000;
  border-bottom:2px solid var(--color-gold);
}



/* =========================================
   LOGIN BAR
========================================= */

.site-header__top {

  background:#2e2e2e;
  color:#9c9c9c;

  padding:6px 15px;

  text-align:right;

}

.site-header__top b {
  color:var(--color-gold);
}



/* =========================================
   NAV WRAPPER
========================================= */

.site-nav {
  background:#000;
}


.site-nav__inner {

  display:flex;
  align-items:center;
  justify-content:space-between;

  height:60px;

}



/* =========================================
   LOGO
========================================= */

.site-logo img {

  height:48px;

  display:block;

}



/* =========================================
   MOBILE TOGGLE
========================================= */

.site-toggle {

  background:none;
  border:none;

  color:#eee;

  font-size:22px;

  cursor:pointer;

}

.site-toggle:hover {

  color:white;

}



/* =========================================
   MENU BASE (Mobile First)
========================================= */

.site-menu {

  display:none;

  position:absolute;

  left:0;
  right:0;
  top:100%;

  background:var(--color-bg-dark);

  margin:0;
  padding:10px 0;

  list-style:none;

  z-index:999;

}


.site-menu--open {

  display:block;

}



/* =========================================
   MENU ITEMS
========================================= */

.site-menu li {

  list-style:none;

}


.site-menu a {

  display:block;

  padding:12px 20px;

  color:#ebebeb;

  text-decoration:none;

}

.site-menu a:hover {

  color:var(--color-primary);

}



/* =========================================
   SUBMENU (Mobile)
========================================= */

.has-submenu .submenu {

  display:none;

  background:#111;

  margin:0;
  padding:0;

  list-style:none;

}


.has-submenu.open .submenu {

  display:block;

}


.submenu li a {

  padding:10px 30px;

}



/* =========================================
   AUTH LINK
========================================= */

.menu-auth a {

  font-weight:600;

}



/* =========================================
   DESKTOP MODE
========================================= */

@media (min-width:768px) {


/* Hide Toggle */

.site-toggle {
  display:none;
}


/* Horizontal Layout */

.site-menu {

  display:flex !important;

  position:static;

  background:none;

  padding:0;

  gap:30px;

  align-items:center;

}


/* Menu Items */

.site-menu a {

  padding:0;

  font-size:18px;

  color:white;

}

.menu-item {
  position: relative;
}


/* =========================================
   DESKTOP DROPDOWN
========================================= */

.submenu {

  position:absolute;

  left:0;

  top:100%;

  min-width:200px;

  background:var(--color-bg-dark);

  border-radius:var(--radius-small);

  box-shadow:var(--shadow-dropdown);

  padding:8px 0;

  display:none;

  opacity:0;

  transition:opacity .15s ease;

}


.has-submenu:hover .submenu {

  display:block;

  opacity:1;

}


.submenu li a {

  padding:10px 18px;

}


.submenu li a:hover {

  background:rgba(255,255,255,.05);

}



/* Caret Animation */

.has-submenu > a i {

  transition:transform .2s ease;

}

.has-submenu:hover > a i {

  transform:rotate(180deg);

}


}