/* Inner Circle Huniverse — organisms/header.css
   A mobil/desktop váltás JS-mért overflow alapján történik (html.nav-compact),
   nem media query alapján — l. .devin/rules mintát js/organisms/navigation.js-ben. */
.site-header{position:sticky;top:0;z-index:var(--z-header);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);
  background:rgba(18,13,8,.75);border-bottom:1px solid var(--line)}
.header-inner{max-width:1180px;margin:0 auto;display:flex;align-items:center;
  justify-content:space-between;padding:14px var(--sp-lg);gap:var(--sp-sm)}
.brand{display:flex;align-items:center;gap:10px;font-weight:800;font-size:var(--fs-lg);color:var(--text);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0;flex-shrink:1}
.brand img{width:36px;height:36px;object-fit:contain;flex-shrink:0}
.header-actions{display:flex;align-items:center;gap:var(--sp-sm);flex-shrink:0}
@media(max-width:480px){
  .brand{font-size:var(--fs-sm)}
  .header-inner{padding:12px var(--sp-md)}
  .lang-switch{padding:2px}
  .lang-btn{padding:4px 9px}
}

.mobile-menu{display:none;flex-direction:column;gap:5px;cursor:pointer;padding:6px;
  position:relative;z-index:calc(var(--z-header) + 2)}
.mobile-menu span{width:24px;height:2px;background:var(--text);transition:transform .15s,opacity .15s}
html.nav-compact .mobile-menu.is-open span:nth-child(1){transform:translateY(7px) rotate(45deg)}
html.nav-compact .mobile-menu.is-open span:nth-child(2){opacity:0}
html.nav-compact .mobile-menu.is-open span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

/* FONTOS: a .site-header backdrop-filter-je containing blockot hoz létre a benne lévő
   position:fixed elemeknek (CSS spec), ezért a mobil nav-overlay NEM a viewporthoz, hanem a
   fejléc dobozához igazodna "inset:64px 0 0 0"-val -- emiatt kell explicit top:0 + padding-top
   + height:100dvh biztonsági háló, hogy mindig a teljes képernyőt fedje, függetlenül a
   containing block kvirktől. */
html.nav-compact .nav-links{position:fixed;top:0;left:0;right:0;bottom:0;height:100dvh;
  flex-direction:column;z-index:calc(var(--z-header) + 1);overflow-y:auto;
  background:rgba(18,13,8,.92);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);
  padding:88px var(--sp-lg) var(--sp-xl);gap:var(--sp-xs);
  transform:translateY(-8px);opacity:0;pointer-events:none;transition:opacity .15s,transform .15s}
html.nav-compact .nav-links.open{opacity:1;transform:translateY(0);pointer-events:auto}
html.nav-compact .mobile-menu{display:flex}

/* FOUC megelőzés: mobilon (≤840px) a nav-links alapértelmezésben is rejtve van, MÉG mielőtt
   a navigation.js hozzáadná a nav-compact osztályt. Ez megakadályozza, hogy a menü egy
   pillanatra "kinyíljon" (desktop stílus) az oldal betöltésekor, mielőtt a JS elrejtené.
   A nav-compact osztály hozzáadása után a fenti szabályok átveszik az irányítást. */
@media(max-width:840px){
  .nav-links:not(.open){opacity:0;pointer-events:none}
  .mobile-menu{display:flex}
}