/* 1. Site header – sticky, Cinema ground.
   On the home page (--overlay) it sits transparent over the hero video
   and fades to solid ink once the page scrolls (opacity only). */
.site-header {
  position: sticky; top: 0; z-index: 50;
  isolation: isolate;
  background: transparent;
}
.site-header::before {
  content: ""; position: absolute; inset: 0; z-index: -1;
  background: var(--surface-100);
  border-bottom: var(--border-hairline) solid var(--line);
  transition: opacity var(--duration-fast) var(--ease-out);
}
.site-header--overlay { position: fixed; left: 0; right: 0; }
.site-header--overlay:not(.is-solid):not(.is-menu-open)::before { opacity: 0; }

.site-header__inner {
  display: flex; align-items: center; justify-content: space-between; gap: var(--space-5);
  padding-block: var(--space-4);
}

.brand { display: inline-flex; align-items: center; gap: var(--space-3); text-decoration: none; color: var(--ink); }
.brand__mark { width: auto; height: 32px; }
.brand__name { font-family: var(--font-display); font-weight: 600; font-size: var(--fs-lead); line-height: 1; white-space: nowrap; }

.site-nav { display: flex; align-items: center; gap: var(--space-6); }
.site-nav__list { display: flex; gap: var(--space-6); }
.site-nav__link {
  position: relative;
  font-size: var(--fs-nav); line-height: var(--lh-nav); font-weight: var(--fw-nav); letter-spacing: var(--ls-nav);
  text-decoration: none; color: var(--ink);
  padding-block: var(--space-2);
}
/* underline draws in from the left */
.site-nav__link::after {
  content: ""; position: absolute; left: 0; right: 0; bottom: 0;
  border-bottom: var(--border-hairline) solid currentColor;
  transform: scaleX(0); transform-origin: left;
  transition: transform var(--duration-fast) var(--ease-out);
}
.site-nav__link:hover::after, .site-nav__link[aria-current="page"]::after { transform: scaleX(1); }

.lang-switch { display: flex; align-items: center; gap: var(--space-1); font-size: var(--fs-small); font-weight: var(--fw-nav); }
.lang-switch__item.is-current { color: var(--ink); }
.lang-switch__item.is-disabled, .lang-switch__sep { color: var(--ink-muted); }

.nav-toggle { display: none; background: none; border: 0; color: var(--ink); padding: var(--space-3); margin-right: calc(var(--space-3) * -1); }

/* Below 960px: collapsed menu */
@media (max-width: 959px) {
  .nav-toggle { display: inline-flex; }
  .site-nav {
    position: absolute; inset: 100% 0 auto 0;
    flex-direction: column; align-items: stretch; gap: var(--space-5);
    padding: var(--space-5) var(--gutter) var(--space-6);
    background: var(--surface-100);
    border-bottom: var(--border-hairline) solid var(--line);
  }
  .site-nav:not(.is-open) { display: none; }
  .site-nav__list { flex-direction: column; gap: 0; }
  .site-nav__link { display: block; padding-block: var(--space-3); font-size: var(--fs-lead); border-bottom: var(--border-hairline) solid var(--line); }
  .site-nav__link::after { display: none; }
}