:root {
  --gw-dark: #0a1628;
  --gw-accent: #5aa9ff;
  --gw-accent2: #7cffc4;
  --gw-light: #e8eef7;
}

/* Base */
body {
  background-color: var(--gw-dark);
  color: var(--gw-light);
  font-family: "Inter", system-ui, sans-serif;
  overflow-x: hidden;
}

/* Navbar */
.navbar {
  background-color: var(--gw-dark);
  border-bottom: 1px solid rgba(255,255,255,0.05);
}

/* Brand wordmark */
.navbar-brand {
  position: relative;
  display: inline-flex;
  align-items: center;
  font-weight: 800;
  font-size: 1.5rem;
  color: var(--gw-light);
  letter-spacing: 0;
  white-space: nowrap;
  text-decoration: none;
  transition: all .25s ease;
}

/* Navbar Section */
.navbar-brand .fa-gamepad {
  margin-right: .4rem;
  font-size: 1.2rem;
  color: var(--gw-accent);
  transition: all .3s ease;
}
.navbar-brand .way {
  color: var(--gw-accent);
  margin-left: 0; 
}

/* --- Hover effect --- */
.navbar-brand:hover,
.navbar-brand:focus-visible {
  color: var(--gw-light);             
  text-shadow: 0 0 8px rgba(124,255,196,.35); 
  filter: brightness(1.1);
}
.navbar-brand:hover .way {
  color: var(--gw-accent);          
}
.navbar-brand:hover .fa-gamepad {
  transform: scale(1.05);
  color: var(--gw-accent);
  filter: drop-shadow(0 0 6px rgba(90,169,255,.35));
}

/* Navbar links */
.navbar-nav .nav-link {
  color: var(--gw-light);
  font-weight: 600;
  transition: color .2s ease;
}
.navbar-nav .nav-link:hover {
  color: var(--gw-accent2);
}

/* Toggler icon */
.navbar-toggler { border:none; background:transparent; }
.navbar-toggler-icon { filter: invert(1); }

/* Hero Section */
.hero {
  background: url("policewallpaper.png") center/cover no-repeat;
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  text-align: center;
}

.hero .overlay {
  position: absolute;
  inset: 0;
  background: rgba(10, 22, 40, 0.65);
}

.hero .container {
  position: relative;
  z-index: 2;
}

.hero h1 {
  font-weight: 800;
  font-size: clamp(2rem, 6vw, 3.5rem);
  color: var(--gw-light);
}

.hero .way {
  color: var(--gw-accent);
}

.hero p {
  color: #cfd8e7;
  font-size: 1.1rem;
}

/* Buttons */
.gw-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 12px 28px;
  border-radius: 999px;
  font-weight: 700;
  background: linear-gradient(90deg, var(--gw-accent), var(--gw-accent2));
  color: var(--gw-dark);
  text-decoration: none;
  transition: all 0.25s ease;
  border: none;
}

.gw-btn:hover {
  transform: translateY(-3px);
  filter: brightness(1.1);
  color: var(--gw-dark);
}

/* Footer */
footer {
  background: rgba(10, 22, 40, 0.95);
  color: var(--gw-light);
  text-align: center;
  padding: 16px 0;
  border-top: 1px solid rgba(255, 255, 255, 0.05);
}

footer a {
  color: var(--gw-accent);
  text-decoration: none;
  font-weight: 600;
}

footer a:hover {
  text-decoration: underline;
}

/* Responsive Fixes */
@media (max-width: 768px) {
  .gw-btn {
    width: 80%;
    margin: 0 auto;
  }
}
