/* Shared site tab — same header as Home on every page */
.site-header {
  position: fixed;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 78.125vw;
  border-radius: 0 0 6px 6px;
  overflow: hidden;
  z-index: 100;
  height: max(50px, 4.2188vw);
  display: flex;
  align-items: stretch;
  background: #151520;
  color: #fff;
  font-family: "Rubik", "PingFang SC", system-ui, sans-serif;
  transition: transform 0.5s cubic-bezier(0.25, 1, 0.5, 1), box-shadow 0.3s ease;
}
.site-header.is-hidden { transform: translateX(-50%) translateY(-130%); }
.site-header__brand {
  flex: 0 0 max(84px, 7.5vw);
  height: 100%;
  background: linear-gradient(135deg, #ff7a3d 0%, #ff4a2c 55%, #dc2826 100%);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: filter 0.2s ease;
}
.site-header__brand:hover { filter: brightness(1.08); }
.site-header__brand img {
  width: 30%;
  height: auto;
  transition: transform 0.4s cubic-bezier(0.25, 1, 0.5, 1);
}
.site-header__brand:hover img { transform: scale(1.1); }
.nav {
  flex: 1 1 auto;
  display: flex;
  justify-content: flex-end;
  align-items: center;
  gap: max(20px, 2.66vw);
  padding-right: max(22px, 2.6vw);
  font-size: max(10px, 0.703vw);
  font-weight: 400;
  letter-spacing: 1px;
  text-transform: uppercase;
}
.nav a {
  color: rgba(255, 255, 255, 0.7);
  transition: color 0.18s ease;
}
.nav a:hover,
.nav a.is-active { color: #fff; }
.nav a.is-active { font-weight: 500; }
.lang { display: none; }
.nav-toggle {
  display: none;
  align-items: center;
  justify-content: center;
  border: 0;
  padding: 0 7.8125vw;
  color: #fff;
  -webkit-appearance: none;
  appearance: none;
  background: transparent;
  height: 14.0625vw;
  margin-left: auto;
  flex: 0 0 auto;
  align-self: flex-start;
  z-index: 120;
  font: inherit;
  cursor: pointer;
}
.nav-toggle::before,
.nav-toggle::after { content: none; display: none; }
.nav-toggle svg { width: 5.20833333vw; height: auto; display: block; }
.nav-toggle .nav-toggle__bars { display: block; }
.nav-toggle .nav-toggle__close { display: none; }
.site-header.is-open .nav-toggle .nav-toggle__bars { display: none; }
.site-header.is-open .nav-toggle .nav-toggle__close { display: block; }

@media screen and (max-width: 1024px) {
  .site-header { width: 100%; }
}

@media screen and (max-width: 768px) {
  html { scroll-padding-top: 14.0625vw; }
  .site-header {
    width: 100%;
    height: 14.0625vw !important;
    max-height: 14.0625vw;
    border-radius: 0;
    overflow: visible;
    left: 50%;
    transform: translateX(-50%);
    align-items: flex-start;
  }
  .site-header.is-open {
    height: 14.0625vw !important;
    max-height: 14.0625vw;
    overflow: visible;
  }
  .site-header.is-hidden { transform: translateX(-50%) translateY(-130%); }
  .site-header__brand {
    flex: 0 0 25vw;
    width: 25vw;
    max-width: none;
    height: 14.0625vw !important;
    max-height: 14.0625vw;
    border-radius: 0;
    align-self: flex-start;
    overflow: hidden;
  }
  .site-header__brand img { width: 6.5625vw; max-width: none; }
  .nav-toggle { display: inline-flex; }
  .nav {
    display: none;
    position: absolute !important;
    right: 0;
    top: 14.0625vw !important;
    left: auto;
    z-index: 101;
    flex: 0 0 auto !important;
    flex-direction: column;
    align-items: flex-end;
    width: 57.1875vw;
    height: auto;
    padding: 0.91145833vw 0 10vw;
    background: rgba(21, 21, 32, 0.9);
    box-shadow: none;
    gap: 0;
  }
  .site-header.is-open .nav { display: flex; }
  .nav a {
    margin-right: 7.8125vw;
    padding: 3.515625vw 0;
    font-size: 4.6875vw;
    font-weight: 500;
    letter-spacing: 0.52083333vw;
    line-height: 5.59895833vw;
    color: rgba(255, 255, 255, 0.7);
  }
  .nav a.is-active,
  .nav a:hover { color: #fff; }
}

/* JS fallback when a tall/wide page expands the CSS viewport (About/Career/Contact) */
html.is-compact-nav { scroll-padding-top: 14.0625vw; }
html.is-compact-nav .site-header {
  width: 100%;
  height: 14.0625vw !important;
  max-height: 14.0625vw;
  border-radius: 0;
  overflow: visible;
  left: 50%;
  transform: translateX(-50%);
  align-items: flex-start;
}
html.is-compact-nav .site-header.is-open {
  height: 14.0625vw !important;
  max-height: 14.0625vw;
  overflow: visible;
}
html.is-compact-nav .site-header.is-hidden { transform: translateX(-50%) translateY(-130%); }
html.is-compact-nav .site-header__brand {
  flex: 0 0 25vw;
  width: 25vw;
  max-width: none;
  height: 14.0625vw !important;
  max-height: 14.0625vw;
  border-radius: 0;
  align-self: flex-start;
  overflow: hidden;
}
html.is-compact-nav .site-header__brand img { width: 6.5625vw; max-width: none; }
html.is-compact-nav .nav-toggle { display: inline-flex !important; }
html.is-compact-nav .nav {
  display: none;
  position: absolute !important;
  right: 0;
  top: 14.0625vw !important;
  left: auto;
  z-index: 101;
  flex: 0 0 auto !important;
  flex-direction: column;
  align-items: flex-end;
  width: 57.1875vw;
  height: auto;
  padding: 0.91145833vw 0 10vw;
  background: rgba(21, 21, 32, 0.9);
  box-shadow: none;
  gap: 0;
}
html.is-compact-nav .site-header.is-open .nav { display: flex !important; }
html.is-compact-nav .nav a {
  margin-right: 7.8125vw;
  padding: 3.515625vw 0;
  font-size: 4.6875vw;
  font-weight: 500;
  letter-spacing: 0.52083333vw;
  line-height: 5.59895833vw;
  color: rgba(255, 255, 255, 0.7);
}
html.is-compact-nav .nav a.is-active,
html.is-compact-nav .nav a:hover { color: #fff; }