/* =========================================================
   HEADER — fixed, açık/koyu tema, mobil menü
   ========================================================= */

.header {
  position: fixed;
  top: var(--header-top);
  left: 0;
  right: 0;
  z-index: 100;
  /* Sadece container alanı tıklanabilir; arası sayfaya geçsin */
  pointer-events: none;
}

.header__inner {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  pointer-events: auto;
}

/* Logo: isim + ikon */
.header__logo {
  display: flex;
  align-items: center;
  gap: 6px;
  font-family: var(--f-display);
  font-weight: 700;
  font-size: 28px;
  line-height: normal;
  color: var(--c-white);
  transition: color var(--t-theme);
}
.header__logo img { width: 24px; height: 24px; }

/* Desktop nav */
.nav {
  display: flex;
  align-items: center;
  gap: 30px;
  font-size: 15px;
  line-height: normal;
}
.nav__link {
  color: var(--c-nav);
  transition: color var(--t-fast);
}
.nav__link:hover,
.nav__link.is-active { color: var(--c-white); }

/* Koyu tema (About gibi açık zeminlerin üstünde) */
.header.is-dark .header__logo { color: var(--c-black); }
.header.is-dark .nav__link { color: var(--c-nav-dark); }
.header.is-dark .nav__link:hover,
.header.is-dark .nav__link.is-active { color: var(--c-black); }

/* Hamburger — sadece mobil */
.header__burger {
  display: none;
  width: 90px;
  height: 40px;
  background: url("../assets/icons/hamburger-light.svg?v=6") no-repeat center / 90px 40px;
}
.header.is-dark .header__burger {
  background-image: url("../assets/icons/hamburger-dark.svg?v=6");
}
/* Menü açıkken: X ikonu, her zaman açık tema */
.header.is-open .header__burger {
  background-image: url("../assets/icons/menu-close.svg?v=6");
}
.header.is-open .header__logo { color: var(--c-white); }

/* Mobil menü overlay (instant) */
.menu {
  position: fixed;
  inset: 0;
  z-index: 90;
  display: none;
  background: linear-gradient(180deg, var(--c-black) 0%, var(--c-bg) 100%);
}
.menu.is-open { display: flex; }
.menu__list {
  list-style: none;
  margin: auto;
  padding: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 36px;
  font-size: 32px;
  line-height: normal;
}
.menu__link { color: var(--c-nav); }
.menu__link.is-active { color: var(--c-white); }

@media (max-width: 1023px) {
  .header__inner { align-items: center; }
  .nav { display: none; }
  .header__burger { display: block; }
}