.site-header { position: sticky; top: 0; z-index: 100; background: #0F1117; border-bottom: 1px solid #2A2D3E; transition: box-shadow 0.2s ease; }
.site-header.scrolled { box-shadow: 0 2px 12px rgba(0,0,0,0.4); }
.site-header .header-inner { max-width: 1200px; margin: 0 auto; padding: 0 24px; height: 68px; display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.site-header .site-logo { display: flex; align-items: center; text-decoration: none; flex-shrink: 0; }
.site-header .site-logo img { display: block; }
.site-header .site-nav { display: flex; align-items: center; }
.site-header .site-nav ul { list-style: none; margin: 0; padding: 0; display: flex; align-items: center; gap: 6px; }
.site-header .site-nav a { display: block; padding: 8px 14px; font-size: 15px; font-weight: 600; color: #E8EAF0; text-decoration: none; border-radius: 6px; transition: background 0.15s, color 0.15s; }
.site-header .site-nav a:hover { background: #1A1D27; color: #E53935; text-decoration: none; }
.site-header .site-nav a.active { color: #E53935; background: #2D1618; }
.site-header .header-right { display: flex; align-items: center; gap: 12px; flex-shrink: 0; }
.site-header .header-18plus { display: inline-flex; align-items: center; justify-content: center; width: 34px; height: 34px; border-radius: 50%; border: 2.5px solid #EF4444; color: #EF4444; font-size: 11px; font-weight: 900; flex-shrink: 0; letter-spacing: -0.5px; }
.site-header .nav-toggle { display: none; flex-direction: column; justify-content: center; align-items: center; width: 40px; height: 40px; border-radius: 8px; cursor: pointer; gap: 6px; padding: 8px; background: none; border: none; }
.site-header .nav-toggle span { display: block; width: 22px; height: 2px; background: #E8EAF0; border-radius: 2px; transition: transform 0.25s, opacity 0.25s; }
.site-header .nav-toggle.open span:nth-child(1) { transform: translateY(8px) rotate(45deg); }
.site-header .nav-toggle.open span:nth-child(2) { opacity: 0; }
.site-header .nav-toggle.open span:nth-child(3) { transform: translateY(-8px) rotate(-45deg); }
@media (max-width: 768px) {
  .site-header .nav-toggle { display: flex; }
  .site-header .site-nav { position: absolute; top: 68px; left: 0; right: 0; background: #0F1117; border-bottom: 1px solid #2A2D3E; padding: 12px 24px 20px; display: none; box-shadow: 0 8px 24px rgba(0,0,0,0.5); }
  .site-header .site-nav.open { display: block; }
  .site-header .site-nav ul { flex-direction: column; gap: 2px; }
  .site-header .site-nav a { padding: 12px 16px; font-size: 16px; }
}