/* The public website's header on the results site (views/partials/website-nav.ejs).
   Same look and behaviour as the website's own header (cps-site, site.css):
   phone shows Live, Calendar and Results plus a menu of every page; wide
   screens show every page in one row. */
.wn-header {
  position: relative; z-index: 60; display: flex; align-items: center; gap: 6px;
  padding: 6px 14px; min-height: 54px; font-family: 'Poppins', 'Segoe UI', system-ui, sans-serif;
  background: rgba(11, 9, 18, 0.9); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px);
  border-bottom: 1px solid rgba(255, 255, 255, 0.11);
}
.wn-brand { flex: 0 0 auto; display: flex; align-items: center; }
.wn-brand img { width: 88px; height: auto; filter: drop-shadow(0 0 1px rgba(255, 255, 255, 0.9)) drop-shadow(0 0 10px rgba(139, 92, 246, 0.45)); }
.wn-quick { flex: 1 1 auto; display: flex; justify-content: flex-end; gap: 4px; min-width: 0; }
.wn-link {
  display: inline-flex; align-items: center; gap: 5px; min-height: 36px; padding: 4px 10px;
  border-radius: 999px; border: 1px solid transparent; color: #f4f3f8; text-decoration: none; font-size: 0.82rem; font-weight: 600;
}
.wn-link:hover { border-color: rgba(255, 255, 255, 0.11); background: rgba(255, 255, 255, 0.05); }
.wn-link.is-on { background: #6d28d9; }
.wn-cta { background: #dc2626; }
.wn-wide { display: none; }
.wn-dot { display: inline-block; flex: 0 0 8px; width: 8px; height: 8px; border-radius: 50%; background: #f87171; }
.wn-menu { position: relative; flex: 0 0 auto; }
.wn-menu > summary { list-style: none; }
.wn-menu > summary::-webkit-details-marker { display: none; }
.wn-menu-btn { display: flex; align-items: center; justify-content: center; width: 40px; height: 40px; border-radius: 10px; border: 1px solid rgba(255, 255, 255, 0.11); background: rgba(255, 255, 255, 0.05); cursor: pointer; }
.wn-burger, .wn-burger::before, .wn-burger::after { display: block; position: relative; width: 18px; height: 2px; border-radius: 2px; background: #f4f3f8; transition: transform 0.2s ease; }
.wn-burger::before, .wn-burger::after { content: ''; position: absolute; left: 0; }
.wn-burger::before { top: -6px; }
.wn-burger::after { top: 6px; }
.wn-menu[open] .wn-burger { background: transparent; }
.wn-menu[open] .wn-burger::before { transform: translateY(6px) rotate(45deg); }
.wn-menu[open] .wn-burger::after { transform: translateY(-6px) rotate(-45deg); }
.wn-menu-grid {
  position: absolute; right: 0; top: 48px; width: min(92vw, 340px); display: grid; grid-template-columns: 1fr 1fr; gap: 6px;
  padding: 10px; border-radius: 12px; background: #120d1f; border: 1px solid rgba(255, 255, 255, 0.11); box-shadow: 0 20px 50px rgba(0, 0, 0, 0.6);
}
.wn-menu-grid a { display: flex; align-items: center; min-height: 40px; padding: 6px 10px; border-radius: 8px; background: rgba(255, 255, 255, 0.05); color: #f4f3f8; text-decoration: none; font-weight: 600; font-size: 0.88rem; }
.wn-menu-grid a:hover { background: #6d28d9; }
@media (min-width: 600px) {
  .wn-brand img { width: 112px; }
}
@media (min-width: 1000px) {
  .wn-header { padding: 8px 24px; }
  .wn-wide { display: inline-flex; }
  .wn-menu { display: none; }
}
