:root {
  --nav-blue: #0f1e37;
  --header-height: 64px;
}

.site-header.header {
  background: var(--nav-blue);
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
  z-index: 1100;
}

.site-header .header-inner {
  height: var(--header-height);
}

.site-header .nav-btn {
  color: rgba(255, 255, 255, 0.82);
}

.site-header .nav-btn:hover,
.site-header .nav-btn.active {
  color: var(--gold);
  background: rgba(255, 255, 255, 0.1);
}

.site-header [data-nav-parent].active > .nav-btn,
.site-header [data-nav-parent].active > .nav-about-btn,
.site-header [data-nav-parent].active > .nav-services-btn,
.site-header [data-nav-parent].active > .nav-offerings-btn,
.site-header [data-nav-parent].active > .nav-links-btn {
  color: var(--gold);
  background: rgba(255, 255, 255, 0.1);
}

.site-header .mobile-menu-btn {
  color: #fff;
}

.site-header .lang-btn {
  color: rgba(255, 255, 255, 0.85);
  border-color: rgba(255, 255, 255, 0.22);
  background: transparent;
}

.site-header .lang-btn:hover {
  border-color: var(--gold);
  color: var(--gold);
}

.site-header .auth-btn-outline {
  color: #fff;
  border-color: rgba(255, 255, 255, 0.28);
  background: transparent;
}

.site-header .auth-btn-outline:hover,
.site-header .auth-user-logged {
  border-color: var(--gold);
  color: var(--gold);
}

.site-header .mobile-nav {
  background: var(--nav-blue);
  border-top: 1px solid rgba(255, 255, 255, 0.08);
}

.site-header .mobile-nav-btn {
  color: rgba(255, 255, 255, 0.9);
  border-bottom-color: rgba(255, 255, 255, 0.08);
}

.site-header .mobile-nav-btn.active,
.site-header .mobile-nav-btn:hover {
  color: var(--gold);
}

.site-header .mobile-links-cat {
  color: var(--gold);
}

.site-header .services-dropdown-item.active,
.site-header .offerings-dropdown-item.active {
  color: var(--gold);
  background: var(--cream);
  font-weight: 600;
}

.site-page-layer,
.cal-page,
.service-page {
  position: fixed;
  top: var(--header-height);
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 900;
  overflow-y: auto;
}

.cal-page,
.service-page {
  display: none;
  background: var(--white);
}

.cal-page.open,
.service-page.open {
  display: block;
}
