.site-header { display: flex; align-items: stretch; gap: 24px; min-height: 74px; padding: 0 22px; border-bottom: 5px solid var(--pink); background: #e4e6bd; color: #10150d; }
.logo { position: relative; align-self: center; color: #10150d; font: bold 31px/.72 Impact, "Arial Black", sans-serif; letter-spacing: -1px; }
.logo span { color: #f01883; text-shadow: 2px 2px #9bff26; }
.logo small { display: block; margin-top: 7px; font: 8px var(--mono); letter-spacing: 2px; }
.site-header nav { display: flex; flex: 1; align-items: stretch; }
.site-header nav a { padding: 25px 16px 0; border-left: 1px solid #9da588; font-weight: bold; font-size: 13px; }
.site-header nav a:hover, .site-header nav .active { background: #171d12; color: var(--lime); }
.header-download { align-self: center; padding: 8px 10px; background: #141910; color: #d8ff54; font: bold 12px var(--mono); }

@media (max-width: 700px) { .site-header { display: grid; grid-template-columns: 1fr auto; gap: 10px; min-height: 116px; padding: 13px 14px 0; } .site-header nav { grid-column: 1 / 3; overflow-x: auto; } .site-header nav a { padding: 11px 13px; white-space: nowrap; } .header-download { margin-bottom: 9px; } }