body {
      text-align: center;
      background: lightblue;
      color: darkblue;
      font-family: 'Press Start 2P', system-ui;
    }
    h1 {
      text-shadow: midnightblue 9px 3px 5px;
      transition: color 0.3s ease-in-out, font-size 0.3s ease-in-out;
    }
    h3 {
      text-shadow: midnightblue 9px 3px 5px;
    }
    button {
      background: linear-gradient(gray, darkblue);
      color: white;
      border: 1px solid darkblue;
      border-radius: 4px;
      padding: 12px;
      margin: 8px;
      font-size: 14px;
      font-family: 'Press Start 2P', system-ui;
      cursor: pointer;
      width: 30%;
    }
    button:hover {
      background: linear-gradient(darkblue, navy);
    }
    section {
      border: 5px dotted black;
      transform: scale(0.95);
      transition: all 0.65s ease-in-out;
      margin: 20px auto;
      width: 90%;
    }
    section:hover {
      box-shadow: 0 0 50px white;
      transform: scale(1.05);
    }
/* Navigation bar container */
.navbar {
  background-color: #333;
  padding: 1rem;
}

/* Flexbox list for horizontal layout */
.nav-links {
  list-style: none; /* Removes bullets */
  display: flex;
  gap: 20px; /* Space between links */
  margin: 0;
  padding: 0;
}

/* Link styling */
.nav-links a {
  color: white;
  text-decoration: none;
  font-family: Arial, sans-serif;
  transition: 0.3s; /* Smooth hover effect */
}

/* Remove the space so it targets the image directly */
.seal:hover {
  box-shadow: 0 0 50px white;
  transform: scale(1.1) rotate(360deg);
}

.seal {
  transition: 0.5s;
}

/* Remove the space and fix the 10s transition to be faster */
.niko:hover {
  box-shadow: 0 0 50px white;
  transform: scale(500000) rotate(36000000deg); /* Scaled down from 7 for visibility */
}

.niko {
  transition: 1000s;
}

/* Fix h1 rotation */
h1 {
  display: inline-block; /* Required for transform to work properly */
  text-shadow: midnightblue 9px 3px 5px;
  transition: all 0.3s ease-in-out;
}