.site-header { position: absolute; inset: 0 0 auto; z-index: 20; }
.header-inner { max-width: 1680px; height: 108px; margin: auto; padding: 0 var(--page-gutter); display: flex; align-items: center; gap: 36px; }
.wordmark { display: flex; flex-direction: column; font-size: 18px; font-weight: 500; letter-spacing: .24em; line-height: 1.2; text-transform: uppercase; flex-shrink: 0; }
.navigation { display: flex; align-items: center; gap: clamp(22px, 2.7vw, 44px); margin: 0 auto; }
.navigation > a { position: relative; font-size: 11px; font-weight: 500; letter-spacing: .1em; text-transform: uppercase; padding: 16px 0; transition: color .2s; }
.navigation > a:hover { color: var(--blue); }
.navigation > a[aria-current]::after { content: ''; position: absolute; height: 2px; background: var(--navy); bottom: 4px; left: 0; right: 0; }
.navigation .mobile-fans { display: none; }
.header-actions { display: flex; align-items: center; gap: 24px; }
.country-badge { width: 38px; height: 38px; display: grid; place-items: center; border: 1px solid rgba(34, 64, 91, .14); border-radius: 50%; background: #ffffff8c; }
.country-badge img { width: 25px; height: 19px; border-radius: 2px; }
.fan-link { display: inline-flex; align-items: center; justify-content: center; gap: 20px; white-space: nowrap; border: 1px solid #c7d4e0; border-radius: 30px; padding: 13px 20px; background: #ffffff70; font-size: 11px; font-weight: 500; text-transform: uppercase; letter-spacing: .08em; transition: background .2s, border-color .2s; }
.fan-link:hover { background: white; border-color: var(--navy); }
.menu-toggle { display: none; width: 44px; height: 44px; padding: 0; border: 0; color: var(--navy); background: transparent; cursor: pointer; align-items: center; justify-content: center; }
.mobile-menu { display: none; }
.menu-toggle { list-style: none; }
.menu-toggle::-webkit-details-marker { display: none; }
.menu-close-icon { display: none; }
.mobile-menu[open] .menu-open-icon { display: none; }
.mobile-menu[open] .menu-close-icon { display: block; }
@media (max-width: 1023px) {
  .header-inner { height: 90px; justify-content: space-between; gap: 20px; }
  .wordmark { font-size: 16px; }
  .header-actions { gap: 18px; }
  .menu-toggle { display: flex; }
  .mobile-menu { display: block; }
  .navigation { display: none; position: absolute; inset: 80px var(--page-gutter) auto; flex-direction: column; align-items: stretch; gap: 0; padding: 15px 24px; background: #fbfdff; border: 1px solid var(--line); box-shadow: 0 18px 40px #102b481a; border-radius: 8px; }
  .mobile-menu[open] .mobile-navigation { display: flex; }
  .navigation > a { padding: 17px 0; font-size: 12px; }
  .navigation > a[aria-current]::after { right: auto; width: 26px; bottom: 9px; }
  .navigation .mobile-fans { display: flex; align-items: center; gap: 12px; border-top: 1px solid var(--line); margin-top: 6px; }
}
@media (max-width: 600px) {
  .header-inner { height: 82px; }
  .wordmark { font-size: 14px; }
  .header-actions { gap: 12px; }
  .country-badge { width: 32px; height: 32px; }
  .fan-link { display: none; }
}