/* ===========================
   HEADER
   =========================== */
.em-header {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 1000;
  padding: 16px 48px 0;   /* 48px left/right = space from screen edges */
  transition: all var(--em-transition);
}

/* Floating pill — transparent initially, dark on scroll */
.em-header__inner {
  max-width: 1160px;
  margin: 0 auto;
  background: transparent;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  border: 1px solid transparent;
  border-radius: 20px;
  padding: 0 12px 0 28px;
  transition: all var(--em-transition);
  box-shadow: none;
  position: relative;
}

/* Gold bottom accent line — hidden until scrolled */
.em-header__inner::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 10%;
  right: 10%;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(245,158,11,0.45), transparent);
  border-radius: 0 0 20px 20px;
  pointer-events: none;
  opacity: 0;
  transition: opacity var(--em-transition);
}

.em-header.scrolled .em-header__inner {
  background: rgba(4,12,24,0.97);
  backdrop-filter: blur(30px);
  -webkit-backdrop-filter: blur(30px);
  border-color: rgba(245,158,11,0.28);
  box-shadow:
    0 16px 56px rgba(0,0,0,0.65),
    0 0 0 1px rgba(245,158,11,0.05) inset;
}

.em-header.scrolled .em-header__inner::after {
  opacity: 1;
}

.em-header__wrap {
  display: flex;
  align-items: center;
  height: 68px;
  gap: 0;
}

/* Logo */
.em-header__logo {
  flex-shrink: 0;
  margin-right: 40px;
  display: flex;
  align-items: center;
  gap: 10px;
}

/* Logo-only: no gap needed between elements */
.em-header__logo:not(.em-header__logo--combined) {
  gap: 0;
}

/* WordPress wraps the logo <img> in its own <a> — make it a flex item */
.em-header__logo .custom-logo-link {
  display: flex;
  align-items: center;
  line-height: 0;
}

/* Site name link (name-only or combined mode) */
.em-header__logo-text-link {
  display: flex;
  align-items: center;
  text-decoration: none;
}

.em-header__logo .custom-logo {
  height: var(--em-logo-h, 48px);
  width: auto;
  display: block;
  transition: height var(--em-transition);
}

/* Combined mode: logo slightly smaller so name fits beside it */
.em-header__logo--combined .custom-logo {
  height: calc(var(--em-logo-h, 48px) - 8px);
}

/* Scrolled state — smaller logo */
.em-header.scrolled .em-header__logo .custom-logo {
  height: var(--em-logo-h-scroll, 38px);
}

@media (max-width: 768px) {
  .em-header__logo .custom-logo {
    height: var(--em-logo-h-mobile, 36px);
  }
  .em-header__logo--combined .custom-logo {
    height: calc(var(--em-logo-h-mobile, 36px) - 6px);
  }
}

.em-header__logo-text {
  font-size: 1.35rem;
  font-weight: 900;
  color: var(--em-white);
  letter-spacing: -0.5px;
  white-space: nowrap;
}

.em-header__logo-text em {
  font-style: normal;
  color: var(--em-gold);
}

/* Nav */
.em-nav {
  flex: 1;
}

.em-nav__list {
  display: flex;
  align-items: center;
  gap: 4px;
}

.em-nav__list li a {
  display: block;
  padding: 8px 14px;
  font-size: 0.88rem;
  font-weight: 600;
  color: rgba(255,255,255,0.75);
  border-radius: 8px;
  transition: all var(--em-transition-fast);
  white-space: nowrap;
}

.em-nav__list li a:hover,
.em-nav__list .current-menu-item > a,
.em-nav__list .current-page-ancestor > a {
  color: var(--em-gold);
  background: rgba(245,158,11,0.08);
}

.em-nav__list .current-menu-item > a {
  position: relative;
}

.em-nav__list .current-menu-item > a::after {
  content: '';
  position: absolute;
  bottom: 4px;
  left: 14px;
  right: 14px;
  height: 2px;
  background: var(--em-gold);
  border-radius: 2px;
}

/* Dropdown */
.em-nav__list .menu-item-has-children {
  position: relative;
}

.em-nav__list .sub-menu {
  position: absolute;
  top: calc(100% + 8px);
  left: 0;
  min-width: 200px;
  background: rgba(7,21,40,0.97);
  backdrop-filter: blur(20px);
  border: 1px solid var(--em-border-gold);
  border-radius: var(--em-radius);
  padding: 8px;
  opacity: 0;
  pointer-events: none;
  transform: translateY(-8px);
  transition: all var(--em-transition-fast);
  z-index: 100;
}

.em-nav__list .menu-item-has-children:hover .sub-menu {
  opacity: 1;
  pointer-events: all;
  transform: translateY(0);
}

.em-nav__list .sub-menu li a {
  border-radius: 8px;
  padding: 9px 14px;
}

/* Actions */
.em-header__actions {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-left: auto;
}

.em-header__cta {
  white-space: nowrap;
}

/* Hamburger */
.em-hamburger {
  display: none;
  flex-direction: column;
  justify-content: center;
  gap: 5px;
  width: 40px;
  height: 40px;
  padding: 8px;
  border-radius: 10px;
  background: rgba(255,255,255,0.05);
  border: 1px solid var(--em-border);
  transition: all var(--em-transition-fast);
}

.em-hamburger span {
  display: block;
  width: 100%;
  height: 2px;
  background: var(--em-white);
  border-radius: 2px;
  transition: all var(--em-transition-fast);
  transform-origin: center;
}

.em-hamburger.active span:nth-child(1) {
  transform: translateY(7px) rotate(45deg);
}

.em-hamburger.active span:nth-child(2) {
  opacity: 0;
  transform: scaleX(0);
}

.em-hamburger.active span:nth-child(3) {
  transform: translateY(-7px) rotate(-45deg);
}

/* Spacer — pill height (68px) + top floating gap (14px) */
.em-header-spacer {
  height: 82px;
}

/* Mobile Nav */
/* Reduce side gap on tablet */
@media (max-width: 1200px) {
  .em-header { padding-left: 28px; padding-right: 28px; }
}

@media (max-width: 1024px) {
  .em-header { padding-left: 16px; padding-right: 16px; }
  .em-header__inner { border-radius: 16px; }
  .em-hamburger {
    display: flex;
  }

  .em-nav {
    position: fixed;
    top: 100px;
    left: 48px;
    right: 48px;
    border-radius: 16px;
    background: rgba(3,15,34,0.98);
    backdrop-filter: blur(28px);
    border-bottom: 1px solid var(--em-border-gold);
    padding: 20px 24px 30px;
    transform: translateY(-120%);
    opacity: 0;
    pointer-events: none;
    transition: all var(--em-transition);
    z-index: 999;
  }

  .em-nav.open {
    transform: translateY(0);
    opacity: 1;
    pointer-events: all;
  }

  .em-nav__list {
    flex-direction: column;
    align-items: stretch;
    gap: 4px;
  }

  .em-nav__list li a {
    font-size: 1rem;
    padding: 12px 16px;
    border-radius: 10px;
  }

  .em-nav__list .sub-menu {
    position: static;
    opacity: 1;
    pointer-events: all;
    transform: none;
    background: rgba(255,255,255,0.03);
    border: none;
    padding: 4px 0 4px 16px;
    margin-top: 4px;
  }

  .em-header__cta {
    display: none;
  }
}

@media (max-width: 480px) {
  .em-header { padding-left: 12px; padding-right: 12px; }
  .em-nav { left: 12px; right: 12px; border-radius: 14px; }
}
