/* nav-fit.css: top nav that adapts to the real available width (see js/nav-fit.js).
   Stages on .site-header[data-nav-stage]: text-full, text, icons, menu, menu-tight */
.site-header.nav-fit .header-left { min-width: 0; }
.site-header.nav-fit .header-left > .header-text-link,
.site-header.nav-fit .header-left > .nav-dropdown { flex: 0 0 auto; white-space: nowrap; }
.site-header.nav-fit .header-left > .header-text-link { display: inline-flex !important; align-items: center; }
.site-header.nav-fit .nav-experts-search { display: block !important; }
.site-header.nav-fit .header-right { flex: 0 0 auto; }
.nav-fit-icon { display: none; width: 20px; height: 20px; flex: 0 0 auto; pointer-events: none; }
.nav-fit-burger { display: none; }

/* stage 1 */
.site-header[data-nav-stage="text-full"] .live-now-label { display: inline !important; }
.site-header[data-nav-stage="text"] .header-left > .header-text-link[href$="survey.html"] { display: none !important; }
.site-header[data-nav-stage="text"] .live-now-label { display: none !important; }

/* stage 2: icons */
.site-header[data-nav-stage="icons"] .header-left { gap: 0.35rem; }
.site-header[data-nav-stage="icons"] .header-left > .header-text-link,
.site-header[data-nav-stage="icons"] .header-left > .nav-dropdown > .nav-dropdown-trigger {
  position: relative; font-size: 0 !important; letter-spacing: 0; width: 38px; height: 38px; padding: 0 !important;
  justify-content: center; border-radius: 6px; color: var(--gold, #b28d55);
}
.site-header[data-nav-stage="icons"] .nav-dropdown-trigger { display: inline-flex; align-items: center; }
.site-header[data-nav-stage="icons"] .nav-dropdown-trigger .chevron { display: none !important; }
.site-header[data-nav-stage="icons"] .header-left > .header-text-link > .nav-fit-icon,
.site-header[data-nav-stage="icons"] .nav-dropdown-trigger > .nav-fit-icon { display: block; }
.site-header[data-nav-stage="icons"] .header-left > .header-text-link:hover,
.site-header[data-nav-stage="icons"] .header-left > .header-text-link:focus-visible,
.site-header[data-nav-stage="icons"] .header-left > .header-text-link.is-current,
.site-header[data-nav-stage="icons"] .nav-dropdown-trigger:hover,
.site-header[data-nav-stage="icons"] .nav-dropdown-trigger:focus-visible,
.site-header[data-nav-stage="icons"] .nav-dropdown-trigger[aria-expanded="true"] {
  background: rgba(178, 141, 85, 0.14); color: #e6c98f;
}
.site-header[data-nav-stage="icons"] [data-nav-tip]:hover::after,
.site-header[data-nav-stage="icons"] [data-nav-tip]:focus-visible::after {
  content: attr(data-nav-tip); position: absolute; top: calc(100% + 6px); left: 50%; transform: translateX(-50%);
  white-space: nowrap; font: 600 0.72rem/1.2 var(--font-body, system-ui, sans-serif); letter-spacing: 0.03em; text-transform: none;
  color: #f3e2b8; background: #141210; border: 1px solid rgba(178, 141, 85, 0.55); border-radius: 4px;
  padding: 0.35rem 0.55rem; box-shadow: 0 6px 18px rgba(0, 0, 0, 0.55); z-index: 1200; pointer-events: none;
}
.site-header[data-nav-stage="icons"] .header-right .cta-btn,
.site-header[data-nav-stage="icons"] .live-now-label { display: none !important; }

/* stage 3: hamburger */
.site-header[data-nav-stage^="menu"] .header-left > .header-text-link,
.site-header[data-nav-stage^="menu"] .header-left > .nav-dropdown,
.site-header[data-nav-stage^="menu"] .header-left > .nav-experts-search,
.site-header[data-nav-stage^="menu"] .header-right .cta-btn,
.site-header[data-nav-stage^="menu"] .live-now-label { display: none !important; }
.site-header[data-nav-stage="menu-tight"] .brand-logo .brand-text { display: none !important; }
.site-header[data-nav-stage^="menu"] .nav-fit-burger {
  display: inline-flex; align-items: center; justify-content: center; width: 40px; height: 40px; margin: 0 0.5rem 0 0.25rem;
  background: transparent; border: 1px solid rgba(178, 141, 85, 0.45); border-radius: 6px; color: var(--gold, #b28d55); cursor: pointer; flex: 0 0 auto;
}
.nav-fit-burger:hover, .nav-fit-burger:focus-visible, .nav-fit-burger[aria-expanded="true"] { background: rgba(178, 141, 85, 0.14); color: #e6c98f; outline: none; }
.nav-fit-burger:focus-visible { box-shadow: 0 0 0 2px rgba(230, 201, 143, 0.6); }
.nav-fit-burger svg { width: 22px; height: 22px; }
.nav-fit-panel {
  position: absolute; top: 100%; right: 8px; width: min(340px, calc(100vw - 16px)); max-height: calc(100vh - 80px); overflow-y: auto;
  box-sizing: border-box; padding: 0.6rem; background: #0e0d0b; border: 1px solid rgba(178, 141, 85, 0.45); border-radius: 8px;
  box-shadow: 0 14px 40px rgba(0, 0, 0, 0.7); z-index: 1300;
}
.nav-fit-panel[hidden] { display: none; }
.nav-fit-panel .nav-fit-search-slot { margin: 0 0 0.5rem; }
.nav-fit-panel .nav-fit-search-slot .nav-experts-search { display: block !important; max-width: none; margin: 0; width: 100%; }
.nav-fit-item {
  display: flex; align-items: center; gap: 0.7rem; width: 100%; box-sizing: border-box; padding: 0.65rem 0.7rem; border: 0; border-radius: 6px;
  background: transparent; color: #f2efe8; font: 600 0.85rem/1.2 var(--font-display, inherit); letter-spacing: 0.06em; text-transform: uppercase;
  text-decoration: none; text-align: left; cursor: pointer;
}
.nav-fit-item .nav-fit-icon { display: block; color: var(--gold, #b28d55); }
.nav-fit-item:hover, .nav-fit-item:focus-visible { background: rgba(178, 141, 85, 0.14); color: #e6c98f; outline: none; }
.nav-fit-item.is-current { color: var(--gold, #b28d55); }
.nav-fit-item .nav-fit-chev { margin-left: auto; transition: transform 0.15s ease; }
.nav-fit-item[aria-expanded="true"] .nav-fit-chev { transform: rotate(180deg); }
.nav-fit-classes { display: grid; grid-template-columns: repeat(auto-fill, minmax(118px, 1fr)); gap: 0.2rem; padding: 0.2rem 0.3rem 0.5rem 2.4rem; }
.nav-fit-classes[hidden] { display: none; }
.nav-fit-classes a { color: rgba(242, 239, 232, 0.85); font-size: 0.8rem; padding: 0.35rem 0.4rem; border-radius: 4px; text-decoration: none; }
.nav-fit-classes a:hover, .nav-fit-classes a:focus-visible { background: rgba(178, 141, 85, 0.14); color: #e6c98f; outline: none; }
html, body { overflow-x: clip; }

/* ---- panel animation ---- */
.nav-fit-panel { opacity: 0; transform: translateY(-8px); transition: opacity .18s ease, transform .2s ease; }
.nav-fit-panel.is-open { opacity: 1; transform: none; }
.nav-fit-badge { margin-left: auto; font-size: .78rem; padding: .1rem .5rem; border: 1px solid rgba(227,194,122,.45); border-radius: 999px; color: #e3c27a; }
.nav-fit-searchbtn { display: none; }
.nav-fit-lang-slot:empty { display: none; }
/* ---- mobile / touch: always hamburger ---- */
.site-header[data-nav-stage="menu-mobile"] .header-inner { padding-left: max(12px, env(safe-area-inset-left)); padding-right: max(12px, env(safe-area-inset-right)); gap: 8px; flex-wrap: nowrap; }
.site-header[data-nav-stage="menu-mobile"] .header-left { min-width: 0; flex: 1 1 auto; gap: 0; }
.site-header[data-nav-stage="menu-mobile"] .header-right { flex: 0 0 auto; gap: 6px; }
.site-header[data-nav-stage="menu-mobile"] .brand-logo { min-width: 0; }
.site-header[data-nav-stage="menu-mobile"] .brand-logo .brand-text { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
@media (max-width: 380px) { .site-header[data-nav-stage="menu-mobile"] .brand-logo .brand-text { display: none !important; } }
.site-header[data-nav-stage="menu-mobile"] .header-right > .lang-switch { display: none !important; }
.site-header[data-nav-stage="menu-mobile"] .nav-fit-searchbtn,
.site-header[data-nav-stage="menu-mobile"] .nav-fit-burger { display: inline-flex; align-items: center; justify-content: center; width: 40px; height: 40px; border-radius: 10px; border: 1px solid rgba(227,194,122,.45); background: rgba(10,8,6,.55); color: #e3c27a; cursor: pointer; padding: 0; flex: 0 0 auto; }
.site-header[data-nav-stage="menu-mobile"] .nav-fit-searchbtn svg,
.site-header[data-nav-stage="menu-mobile"] .nav-fit-burger svg { width: 22px; height: 22px; }
.site-header[data-nav-stage="menu-mobile"] .nav-fit-panel {
  position: fixed; left: 0; right: 0; width: auto; max-width: none; border-radius: 0 0 14px 14px; border-left: 0; border-right: 0;
  max-height: calc(100vh - 56px); max-height: calc(100dvh - 56px); overflow-y: auto; overscroll-behavior: contain;
  padding: 12px max(14px, env(safe-area-inset-right)) calc(16px + env(safe-area-inset-bottom)) max(14px, env(safe-area-inset-left));
  transform: translateY(-14px); z-index: 1000; box-sizing: border-box;
}
.site-header[data-nav-stage="menu-mobile"] .nav-fit-panel.is-open { transform: none; }
.site-header[data-nav-stage="menu-mobile"] .nav-fit-item { min-height: 52px; font-size: 1.05rem; }
.site-header[data-nav-stage="menu-mobile"] .nav-fit-classes a { min-height: 44px; display: flex; align-items: center; }
.site-header[data-nav-stage="menu-mobile"] .nav-fit-search-slot input { min-height: 46px; font-size: 16px; }
.nav-fit-lang-slot { margin-top: .6rem; padding-top: .6rem; border-top: 1px solid rgba(227,194,122,.2); }
.nav-fit-lang-slot .lang-switch { display: block !important; position: relative; }
html.nav-fit-lock { overflow: hidden; overscroll-behavior: none; }
/* mobile-1: lock only the viewport (locking body too broke the sticky header), and keep the cookie banner off the open menu */
html.nav-fit-lock #bdo-consent { visibility: hidden !important; pointer-events: none !important; }
@media (prefers-reduced-motion: reduce) { .nav-fit-panel { transition: none; } }
.nav-fit-btnicon { display: block; width: 22px; height: 22px; }
.nav-fit-panel .nav-fit-search-slot .nav-experts-search, .nav-fit-panel .nav-fit-search-slot input { box-sizing: border-box; max-width: 100% !important; width: 100% !important; min-width: 0 !important; }
.nav-fit-langs { display: grid; grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); gap: 6px; }
.nav-fit-lang { min-height: 44px; padding: 0 .7rem; border-radius: 10px; border: 1px solid rgba(227,194,122,.25); background: rgba(255,255,255,.03); color: #e8dcc0; font: inherit; font-size: .95rem; text-align: left; cursor: pointer; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.nav-fit-lang:hover, .nav-fit-lang:focus-visible { border-color: #e3c27a; color: #fff; outline: none; }
.nav-fit-lang.is-current { border-color: #e3c27a; color: #e3c27a; background: rgba(227,194,122,.12); }
.nav-fit-panel .nav-fit-search-slot input { box-sizing: border-box !important; }